:root{color-scheme:dark;--bg:#05070a;--panel:rgba(10,13,18,0.76);--line:rgba(232,190,94,0.22);--line-bright:rgba(255,218,128,0.64);--gold:#e8bd61;--gold-bright:#ffe19a;--text:#f2f0e9;--muted:#8e949e;--technical:#b6bdc8;}*{box-sizing:border-box;}html,body{min-width:320px;min-height:100%;margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}body{overflow-x:hidden;background:radial-gradient(circle at 76% 38%,rgba(104,76,21,0.14),transparent 38%),linear-gradient(135deg,#090c11 0%,#030405 62%);}button{font:inherit;}.experience{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;}.experience::before{position:absolute;inset:0;z-index:-2;content:"";opacity:0.16;background-image:linear-gradient(rgba(255,255,255,0.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.035) 1px,transparent 1px);background-size:84px 84px;mask-image:linear-gradient(to right,black,transparent 72%);}.hero-copy{position:relative;z-index:8;width:min(42rem,44vw);padding:clamp(5.5rem,10vh,8.5rem) 0 7rem clamp(2rem,6vw,7rem);pointer-events:none;}.eyebrow{display:flex;align-items:center;gap:0.75rem;margin:0 0 1.6rem;color:var(--gold);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.68rem;letter-spacing:0.2em;text-transform:uppercase;}.eyebrow span{width:2.6rem;height:1px;background:linear-gradient(90deg,transparent,var(--gold));}h1{margin:0;font-size:clamp(4.4rem,9vw,10rem);font-weight:700;line-height:0.78;letter-spacing:-0.075em;text-shadow:0 0 60px rgba(255,197,79,0.1);}.lede{max-width:34rem;margin:2.4rem 0 0;color:#b7bbc2;font-size:clamp(1rem,1.35vw,1.25rem);line-height:1.65;}.project-facts{display:flex;flex-wrap:wrap;gap:0.6rem 1.1rem;margin-top:2rem;color:#777e88;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.62rem;letter-spacing:0.14em;}.project-facts span:not(:last-child)::after{margin-left:1.1rem;color:var(--gold);content:"/";}.primary-actions{display:flex;flex-wrap:wrap;gap:0.65rem;margin-top:2.7rem;pointer-events:auto;}.action{min-height:2.9rem;padding:0 1.15rem;border:1px solid rgba(255,255,255,0.13);border-radius:0.15rem;background:rgba(8,10,14,0.72);color:#c8cbd0;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.68rem;letter-spacing:0.11em;text-transform:uppercase;transition:180ms ease;}.action:hover:not(:disabled),.action:focus-visible{border-color:var(--line-bright);color:#fff5d7;box-shadow:0 0 24px rgba(232,189,97,0.12);outline:none;}.action:disabled{cursor:not-allowed;opacity:0.34;}.action-primary{border-color:#d9aa4d;background:linear-gradient(135deg,#d9aa4d,#8f6422);color:#100c04;font-weight:700;}.assembly-controls{display:grid;gap:0.8rem;width:min(31rem,100%);margin-top:1rem;pointer-events:auto;}.explode-control{display:grid;grid-template-columns:auto minmax(8rem,1fr) 3rem;align-items:center;gap:0.75rem;padding:0.8rem 0.9rem;border:1px solid rgba(255,255,255,0.1);background:rgba(7,9,13,0.62);color:#aeb4be;font:0.62rem/1 ui-monospace,monospace;letter-spacing:0.12em;text-transform:uppercase;}.explode-control input{width:100%;accent-color:var(--gold);}.explode-control output{color:var(--gold-bright);text-align:right;}.view-presets{display:flex;flex-wrap:wrap;gap:0.45rem;}.view-presets button{min-height:2rem;padding:0 0.7rem;border:1px solid rgba(255,255,255,0.1);border-radius:0.15rem;background:rgba(8,10,14,0.58);color:#9fa6b1;cursor:pointer;font:0.58rem/1 ui-monospace,monospace;letter-spacing:0.11em;text-transform:uppercase;transition:180ms ease;}.view-presets button:hover,.view-presets button:focus-visible,.view-presets button.active{border-color:var(--line-bright);color:#fff2cf;outline:none;}.status-rail{width:min(27rem,100%);margin-top:2rem;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.63rem;letter-spacing:0.08em;text-transform:uppercase;}.status-copy{display:flex;align-items:center;gap:0.55rem;}.status-dot{width:0.42rem;height:0.42rem;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold);animation:pulse 1.4s ease-in-out infinite;}.load-track{height:1px;margin-top:0.7rem;overflow:hidden;background:rgba(255,255,255,0.09);}.load-track span{display:block;width:4%;height:100%;background:linear-gradient(90deg,#9b6c1e,#ffe29a);transition:width 220ms ease;}.viewer-shell{position:absolute;inset:0 0 0 36%;min-height:100svh;overflow:hidden;}#viewer-canvas,.poster,.viewer-vignette,.grid-plane{position:absolute;inset:0;width:100%;height:100%;}#viewer-canvas{z-index:3;opacity:0;touch-action:none;transition:opacity 700ms ease;}body.model-ready #viewer-canvas{opacity:1;}.poster{z-index:2;background:linear-gradient(90deg,#05070a 0%,transparent 18%),url("/__l5e/assets-v1/4424b322-8a63-410c-940c-6ec5376dcb87/threepio_mirror_gold_hero.png") 68% center / contain no-repeat;filter:saturate(0.94) contrast(1.03);transition:opacity 800ms ease,filter 800ms ease;}body.model-ready .poster{opacity:0;filter:saturate(0.7) blur(8px);pointer-events:none;}.viewer-vignette{z-index:4;pointer-events:none;box-shadow:inset 0 0 160px 38px rgba(0,0,0,0.58);background:linear-gradient(90deg,rgba(5,7,10,0.96),transparent 24%,transparent 82%,rgba(5,7,10,0.45));}.grid-plane{z-index:1;opacity:0.18;transform:perspective(800px) rotateX(67deg) translateY(72%);transform-origin:bottom center;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to top,black,transparent 68%);}.viewer-chrome{position:absolute;z-index:7;right:clamp(1.2rem,3vw,3.2rem);left:clamp(1.2rem,3vw,3.2rem);display:flex;justify-content:space-between;color:#777f8a;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.58rem;letter-spacing:0.12em;pointer-events:none;}.viewer-chrome-top{top:1.7rem;}.viewer-chrome-bottom{bottom:1.6rem;justify-content:flex-end;gap:1.5rem;}.annotation-layer{position:absolute;inset:0;z-index:6;pointer-events:none;}.leader-layer{position:absolute;inset:0;z-index:5;width:100%;height:100%;overflow:visible;pointer-events:none;}.leader-line{fill:none;stroke:rgba(255,218,128,0.42);stroke-width:1;stroke-dasharray:2 5;opacity:0;transition:opacity 240ms ease,stroke 180ms ease;}.leader-line.visible{opacity:1;}.leader-line.selected{stroke:rgba(255,229,174,0.86);stroke-dasharray:none;}.annotation{position:absolute;min-width:8rem;max-width:12rem;padding:0.55rem 0.7rem;border-left:1px solid var(--gold);background:linear-gradient(90deg,rgba(9,12,16,0.88),rgba(9,12,16,0.28));color:#d6dae0;opacity:0;transform:translate(14px,-50%);transition:opacity 240ms ease;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.59rem;letter-spacing:0.08em;text-transform:uppercase;}.annotation.visible{opacity:1;}.annotation.selected{border-color:var(--gold-bright);background:linear-gradient(90deg,rgba(37,28,11,0.94),rgba(9,12,16,0.42));box-shadow:0 0 24px rgba(232,189,97,0.12);}.annotation b{display:block;margin-bottom:0.2rem;color:var(--gold-bright);font-size:0.64rem;}.annotation small{color:#79818c;font-size:0.52rem;}.assembly-index{position:absolute;z-index:8;right:clamp(1rem,2.4vw,2.8rem);top:50%;width:14rem;padding:1rem;border:1px solid rgba(255,255,255,0.08);background:rgba(6,8,11,0.62);backdrop-filter:blur(12px);transform:translateY(-50%);opacity:0;pointer-events:none;transition:opacity 300ms ease;}body.exploded .assembly-index{opacity:1;pointer-events:auto;}.assembly-index p{margin:0 0 0.8rem;color:#707782;font:0.58rem/1.2 ui-monospace,monospace;letter-spacing:0.14em;text-transform:uppercase;}.assembly-index ol{display:grid;gap:0.65rem;margin:0;padding:0;list-style:none;}.assembly-index li{margin:0;}.assembly-index button{display:flex;width:100%;align-items:center;gap:0.55rem;padding:0;border:0;background:transparent;color:#aab0b9;cursor:pointer;font:0.62rem/1.2 ui-monospace,monospace;text-align:left;text-transform:uppercase;}.assembly-index button:hover,.assembly-index button:focus-visible,.assembly-index button.active{color:#fff2cf;outline:none;}.assembly-index i{width:0.38rem;height:0.38rem;border:1px solid var(--gold);transform:rotate(45deg);}.assembly-index button.active i{background:var(--gold);box-shadow:0 0 14px rgba(232,189,97,0.42);}.assembly-index button.isolated span{color:var(--gold-bright);}.component-panel{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(232,190,94,0.2);opacity:1;}.component-panel[hidden]{display:none;}.component-panel p{margin:0 0 0.55rem;color:var(--gold);font:0.55rem/1.2 ui-monospace,monospace;letter-spacing:0.16em;text-transform:uppercase;}.component-panel h2{margin:0;color:#fff6dc;font:700 0.92rem/1.12 ui-monospace,monospace;letter-spacing:0.04em;text-transform:uppercase;}.component-panel strong{display:block;margin-top:0.28rem;color:#c7a758;font:0.58rem/1.3 ui-monospace,monospace;letter-spacing:0.08em;text-transform:uppercase;}.component-panel span{display:block;margin-top:0.7rem;color:#aeb5bf;font:0.72rem/1.55 Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:0;text-transform:none;}.component-panel button{justify-content:center;margin-top:0.85rem;min-height:2.25rem;border:1px solid rgba(232,190,94,0.34);background:rgba(232,190,94,0.1);color:var(--gold-bright);font-size:0.56rem;letter-spacing:0.12em;text-align:center;}.component-panel button:hover,.component-panel button:focus-visible{border-color:rgba(255,225,154,0.62);background:rgba(232,190,94,0.16);}body.isolating .annotation:not(.selected){opacity:0.2;}body.isolating .leader-line.visible:not(.selected){opacity:0.12;}.fallback-card{position:absolute;z-index:9;right:2rem;bottom:4rem;padding:0.85rem 1rem;border:1px solid var(--line);background:rgba(7,9,12,0.86);color:var(--technical);font:0.7rem/1.45 ui-monospace,monospace;}.fallback-card strong{display:block;color:var(--gold-bright);}.page-footer{position:absolute;z-index:8;bottom:1.5rem;left:clamp(2rem,6vw,7rem);display:flex;gap:1.2rem;color:#555c66;font:0.56rem ui-monospace,monospace;letter-spacing:0.1em;text-transform:uppercase;}.noscript{padding:2rem;background:#130d04;color:#ffe19a;}@keyframes pulse{50%{opacity:0.42;transform:scale(0.78);}}@media (max-width:900px){.experience{min-height:100svh;}.hero-copy{width:100%;padding:4.5rem 1.35rem 0;}h1{font-size:clamp(3.8rem,19vw,7rem);}.lede{max-width:31rem;margin-top:1.5rem;font-size:0.95rem;}.project-facts{display:none;}.primary-actions{margin-top:1.5rem;}.action{min-height:2.65rem;padding-inline:0.8rem;font-size:0.58rem;}.assembly-controls{width:100%;gap:0.6rem;}.explode-control{grid-template-columns:auto minmax(6rem,1fr) 2.8rem;padding:0.65rem;}.view-presets button{min-height:1.9rem;padding-inline:0.55rem;font-size:0.52rem;}.status-rail{margin-top:1rem;}.viewer-shell{inset:39% 0 0;min-height:auto;}.viewer-vignette{box-shadow:inset 0 0 90px 20px rgba(0,0,0,0.6);background:linear-gradient(to bottom,#05070a,transparent 24%,rgba(5,7,10,0.25));}.poster{background:linear-gradient(to bottom,#05070a,transparent 16%),url("/__l5e/assets-v1/4424b322-8a63-410c-940c-6ec5376dcb87/threepio_mirror_gold_hero.png") 67% center / contain no-repeat;}.viewer-chrome-top{display:none;}.viewer-chrome-bottom{right:1rem;bottom:0.8rem;left:1rem;justify-content:space-between;gap:0.4rem;font-size:0.48rem;}.assembly-index{display:none;}.annotation{min-width:6.5rem;padding:0.4rem 0.5rem;font-size:0.5rem;}.page-footer{display:none;}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto !important;animation-duration:0.01ms !important;transition-duration:0.01ms !important;}}
.fallback-details{margin-top:0.5rem;font-size:0.55rem;opacity:0.85;}
.fallback-details summary{cursor:pointer;letter-spacing:0.12em;text-transform:uppercase;}
.fallback-details pre{margin:0.4rem 0 0;padding:0.5rem;background:rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.08);border-radius:4px;max-height:180px;overflow:auto;font-size:0.55rem;line-height:1.4;white-space:pre-wrap;word-break:break-word;}

/* ============================================================
   MOBILE POLISH (<=768px)
   Dedicated layout: hero copy on top, model in the middle,
   sticky compact controls pinned to the bottom safe area.
   Overrides the older 900px squeeze rules above.
   ============================================================ */
@media (max-width: 768px) {
  /* ---- Page shell ---- */
  html, body { overscroll-behavior-y: contain; }
  body { background: #05070a; }
  .experience {
    min-height: 100svh;
    min-height: 100dvh;
    overflow: hidden;
    display: block;
  }

  /* ---- TOP: compact hero ---- */
  .hero-copy {
    position: relative;
    width: 100%;
    padding: 0.9rem 1rem 0.5rem;
    pointer-events: none;
    z-index: 10;
  }
  .eyebrow { margin: 0 0 0.4rem; gap: 0.5rem; font-size: 0.54rem; }
  .eyebrow span { width: 1.3rem; }
  h1 {
    font-size: 2.4rem;
    line-height: 0.88;
    letter-spacing: -0.04em;
    text-shadow: 0 0 28px rgba(255,197,79,0.08);
  }
  .lede {
    margin: 0.5rem 0 0;
    max-width: 100%;
    font-size: 0.74rem;
    line-height: 1.45;
  }
  .project-facts,
  .status-rail { display: none; }

  /* ---- MIDDLE: model band ---- */
  .viewer-shell {
    position: fixed;
    inset: auto;
    top: 8.4rem;
    left: 0;
    right: 0;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 15rem);
    min-height: 0;
  }
  .viewer-vignette {
    box-shadow: inset 0 0 60px 12px rgba(0,0,0,0.5);
    background: linear-gradient(to bottom,
      rgba(5,7,10,0.35), transparent 14%, transparent 86%, rgba(5,7,10,0.55));
  }
  .poster {
    background:
      url("/__l5e/assets-v1/4424b322-8a63-410c-940c-6ec5376dcb87/threepio_mirror_gold_hero.png")
      center / contain no-repeat;
  }
  .grid-plane { opacity: 0.1; }
  .annotation, .leader-layer { display: none !important; }
  .viewer-chrome-top, .viewer-chrome-bottom, .page-footer { display: none !important; }

  /* ---- Component chip rail (under hero) ---- */
  .assembly-index {
    position: fixed;
    top: 8.4rem;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
    transform: none;
    padding: 0.4rem 0.7rem 0.5rem;
    border: 0;
    background: linear-gradient(to bottom, rgba(5,7,10,0.85), rgba(5,7,10,0));
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 20;
    display: block !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .assembly-index > p { display: none; }
  .assembly-index ol {
    display: flex;
    gap: 0.4rem;
    margin: 0;
    padding: 0.1rem 0.1rem 0.35rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .assembly-index ol::-webkit-scrollbar { display: none; }
  .assembly-index li { flex: 0 0 auto; scroll-snap-align: start; }
  .assembly-index button {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    padding: 0.4rem 0.65rem;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(10,13,18,0.78);
    color: #c8cdd5;
    font-size: 0.58rem;
    line-height: 1.1;
    text-align: left;
    min-height: 2.4rem;
    white-space: nowrap;
  }
  .assembly-index button > i { display: none; }
  .assembly-index button::after {
    display: block;
    margin-top: 0.12rem;
    color: #8e949e;
    font-size: 0.5rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    content: "";
  }
  .assembly-index button[data-group="front-shell"]::after   { content: "Polished exterior"; }
  .assembly-index button[data-group="rear-shell"]::after    { content: "Service enclosure"; }
  .assembly-index button[data-group="eye-assemblies"]::after{ content: "Lenses / LEDs / Reflectors"; }
  .assembly-index button[data-group="neck-frame"]::after    { content: "Structural interface"; }
  .assembly-index button[data-group="audio-exciters"]::after{ content: "Voice transducers"; }
  .assembly-index button[data-group="electronics"]::after   { content: "AI compute & control"; }
  .assembly-index button.active,
  .assembly-index button.isolated {
    border-color: var(--gold);
    color: var(--gold-bright);
    background: rgba(40,28,8,0.7);
  }
  .assembly-index button.active::after,
  .assembly-index button.isolated::after { color: #d9c9a0; }

  /* ---- Component focus panel (appears above bottom stack when a part is selected) ---- */
  .component-panel {
    position: fixed;
    left: 0.7rem;
    right: 0.7rem;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 15.2rem);
    margin: 0;
    padding: 0.7rem 0.85rem 0.75rem;
    border: 1px solid rgba(232,190,94,0.28);
    background: linear-gradient(to top, rgba(7,9,13,0.96), rgba(15,11,4,0.92));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 32;
    max-height: 30vh;
    overflow-y: auto;
  }
  .component-panel p { margin: 0 0 0.3rem; font-size: 0.5rem; }
  .component-panel h2 { font-size: 0.85rem; }
  .component-panel strong { font-size: 0.55rem; margin-top: 0.2rem; }
  .component-panel span { font-size: 0.7rem; line-height: 1.45; margin-top: 0.45rem; }
  .component-panel button { margin-top: 0.6rem; min-height: 2.1rem; font-size: 0.54rem; }

  /* ---- BOTTOM STACK ---- */
  /* Neutralize the .assembly-controls wrapper so its children can position individually */
  .assembly-controls { display: contents; }

  /* View presets: top of bottom stack, horizontal scroll */
  .view-presets {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 12.4rem);
    display: flex;
    gap: 0.4rem;
    padding: 0.35rem 0.7rem 0.45rem;
    margin: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    background: linear-gradient(to top, rgba(5,7,10,0.85), rgba(5,7,10,0));
    z-index: 30;
    pointer-events: auto;
  }
  .view-presets::-webkit-scrollbar { display: none; }
  .view-presets button {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 2.1rem;
    padding: 0 0.9rem;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(10,13,18,0.85);
    color: #aeb4be;
    font-size: 0.55rem;
    letter-spacing: 0.12em;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  .view-presets button.active {
    border-color: var(--gold);
    color: var(--gold-bright);
    background: rgba(40,28,8,0.7);
  }

  /* Explode slider panel (middle of bottom stack) */
  .explode-control {
    position: fixed;
    left: 0.7rem;
    right: 0.7rem;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 8.55rem);
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    column-gap: 0.75rem;
    padding: 0.55rem 0.85rem;
    background: rgba(7,9,13,0.94);
    border: 1px solid rgba(255,255,255,0.08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #aeb4be;
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    z-index: 30;
  }
  .explode-control > span { color: #cfd3da; }
  .explode-control output { color: var(--gold-bright); min-width: 2.5rem; text-align: right; }
  .explode-control input[type="range"] {
    width: 100%;
    height: 2.4rem;
    margin: 0;
    background: transparent;
    accent-color: var(--gold);
    -webkit-appearance: none;
    appearance: none;
  }
  .explode-control input[type="range"]::-webkit-slider-runnable-track {
    height: 3px;
    background: linear-gradient(90deg, var(--gold), rgba(255,255,255,0.12));
    border-radius: 3px;
  }
  .explode-control input[type="range"]::-moz-range-track {
    height: 3px;
    background: linear-gradient(90deg, var(--gold), rgba(255,255,255,0.12));
    border-radius: 3px;
  }
  .explode-control input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 1.6rem;
    height: 1.6rem;
    margin-top: -0.75rem;
    border-radius: 50%;
    background: var(--gold-bright);
    border: 2px solid #1a1305;
    box-shadow: 0 0 12px rgba(232,189,97,0.45);
    cursor: pointer;
  }
  .explode-control input[type="range"]::-moz-range-thumb {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: var(--gold-bright);
    border: 2px solid #1a1305;
    box-shadow: 0 0 12px rgba(232,189,97,0.45);
    cursor: pointer;
  }

  /* Primary actions: strict 2x2 grid, equal cells, 56px tall */
  .primary-actions {
    position: fixed;
    left: 0.7rem;
    right: 0.7rem;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 0.6rem);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 56px;
    gap: 12px;
    margin: 0;
    width: auto;
    z-index: 30;
    pointer-events: auto;
  }
  .action {
    width: 100%;
    height: 56px;
    min-height: 56px;
    padding: 0 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.66rem;
    letter-spacing: 0.12em;
    background: rgba(8,10,14,0.94);
    border: 1px solid rgba(255,255,255,0.14);
    color: #d8dce3;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
  .action:disabled { opacity: 0.42; }
  .action-primary {
    background: linear-gradient(135deg, #d9aa4d, #8f6422);
    border-color: #d9aa4d;
    color: #100c04;
    font-weight: 700;
  }
  .action > span {
    display: block;
    width: 100%;
    text-align: center;
    line-height: 1.1;
  }

  .fallback-card {
    right: 0.8rem;
    left: 0.8rem;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 14rem);
    max-width: none;
  }
}