:root{color-scheme:dark;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#030b1c;color:#f7f9ff}
*{box-sizing:border-box}
body{min-width:0;margin:0;background:radial-gradient(circle at 76% 18%,rgba(34,89,255,.22),transparent 34%),linear-gradient(145deg,#020817 0%,#07152d 54%,#041026 100%);color:#f7f9ff}
button,a,input{font:inherit}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #83eeff;outline-offset:3px}
.showcase-header{display:flex;align-items:center;justify-content:space-between;width:min(1440px,calc(100% - 40px));min-height:76px;margin:auto;border-bottom:1px solid rgba(255,255,255,.11)}
.brand-lockup{font-size:1.18rem}.back-link{min-height:44px;display:inline-flex;align-items:center;color:#b9c9eb;text-underline-offset:4px}
.showcase-shell{display:grid;grid-template-columns:minmax(250px,340px) minmax(0,1fr);gap:clamp(32px,5vw,88px);width:min(1440px,calc(100% - 40px));min-height:calc(100vh - 76px);margin:auto;padding:clamp(44px,7vw,96px) 0 64px}
.showcase-intro{align-self:start;position:sticky;top:32px}.eyebrow{margin:0 0 18px;color:#83eeff;font-size:.75rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.showcase-intro h1{max-width:8ch;margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(3rem,5vw,5.8rem);font-weight:500;letter-spacing:-.055em;line-height:.9}.intro-copy{max-width:31rem;margin:28px 0 0;color:#c6d4ef;font-size:1.08rem;line-height:1.65}
.fictional-note{margin-top:32px;padding:18px;border:1px solid rgba(131,238,255,.25);border-radius:18px;background:rgba(4,18,46,.68)}.fictional-note strong{color:#83eeff;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.fictional-note p{margin:8px 0 0;color:#aebedc;font-size:.9rem;line-height:1.55}
.showcase-facts{display:grid;gap:0;margin:24px 0 0}.showcase-facts div{padding:14px 0;border-top:1px solid rgba(255,255,255,.1)}.showcase-facts dt{color:#fff;font-weight:800}.showcase-facts dd{margin:4px 0 0;color:#8fa5cd;font-size:.86rem}
.showcase-workbench{min-width:0}.showcase-controls{display:flex;align-items:end;gap:14px;flex-wrap:wrap;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(2,10,28,.66);box-shadow:0 24px 70px rgba(0,0,0,.24);backdrop-filter:blur(18px)}
.showcase-controls fieldset{min-width:0;margin:0;padding:0;border:0}.showcase-controls legend{margin:0 0 7px 4px;color:#8fa5cd;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.control-group{display:flex;gap:4px;padding:4px;border-radius:12px;background:rgba(255,255,255,.06)}.control-group button,.identity-rail button{min-height:44px;padding:0 14px;border:1px solid transparent;border-radius:9px;background:transparent;color:#b9c9eb;font-weight:750;cursor:pointer}.control-group button[aria-selected="true"],.identity-rail button[aria-selected="true"]{border-color:rgba(131,238,255,.34);background:linear-gradient(135deg,#123cc7,#0b6ead);color:#fff;box-shadow:0 8px 20px rgba(0,53,210,.25)}.control-group button:disabled{cursor:not-allowed;opacity:.62}
.safe-toggle{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:1px 9px;min-height:52px;margin-left:auto;padding:6px 12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#e6edff;cursor:pointer}.safe-toggle input{grid-row:1/3;width:20px;height:20px;margin:0;accent-color:#5bd9f2}.safe-toggle span{font-size:.84rem;font-weight:800}.safe-toggle small{color:#8fa5cd;font-size:.7rem}.safe-toggle.is-disabled{opacity:.5;cursor:not-allowed}
.identity-rail{display:flex;gap:6px;margin:16px 0 0;overflow-x:auto;padding:4px 0 9px}.identity-rail button{flex:1 0 auto;border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.035)}
.preview-heading,.showcase-footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.preview-heading{min-height:52px;color:#91a7d1;font-size:.82rem}.preview-heading div{display:flex;align-items:center;gap:9px}.preview-heading strong{color:#e8eeff}.signal-dot{width:8px;height:8px;border-radius:50%;background:#83eeff;box-shadow:0 0 18px #83eeff}
.showcase-stage{display:grid;place-items:center;min-height:420px;padding:clamp(16px,4vw,48px);overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:28px;background:linear-gradient(rgba(1,8,23,.5),rgba(3,14,36,.84)),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px);background-size:auto,32px 32px,32px 32px;box-shadow:inset 0 1px rgba(255,255,255,.05),0 38px 100px rgba(0,0,0,.3)}
.showcase-stage introdio-card{width:min(100%,920px)}.showcase-stage[data-layout="vertical"] introdio-card{width:min(100%,430px)}
.showcase-footer{min-height:70px;color:#91a7d1;font-size:.82rem}.showcase-footer p{max-width:52ch;margin:0;line-height:1.5}.showcase-footer button{min-height:44px;padding:0 18px;border:1px solid rgba(131,238,255,.28);border-radius:11px;background:rgba(11,61,255,.18);color:#fff;font-weight:800;cursor:pointer}.showcase-footer button:hover{background:rgba(11,61,255,.35)}
.print-surface{display:none}.toast{position:fixed;right:22px;bottom:22px;z-index:20;max-width:min(420px,calc(100% - 44px));padding:13px 16px;border:1px solid rgba(131,238,255,.26);border-radius:12px;background:#07152d;color:#fff;box-shadow:0 18px 48px rgba(0,0,0,.38);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s ease}.toast.show{opacity:1;transform:none}
@media(max-width:980px){.showcase-shell{grid-template-columns:1fr}.showcase-intro{position:static}.showcase-intro h1{max-width:none}.intro-copy{max-width:46rem}.showcase-facts{grid-template-columns:repeat(3,1fr);gap:18px}.showcase-facts div{border-top:0;border-left:1px solid rgba(255,255,255,.1);padding:0 0 0 14px}}
@media(max-width:680px){.showcase-header,.showcase-shell{width:min(100% - 24px,1440px)}.showcase-shell{padding-top:34px}.showcase-intro h1{font-size:clamp(2.8rem,15vw,4.5rem)}.showcase-facts{grid-template-columns:1fr;gap:0}.showcase-facts div{border-top:1px solid rgba(255,255,255,.1);border-left:0;padding:12px 0}.showcase-controls{align-items:stretch}.showcase-controls fieldset{width:100%}.control-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.showcase-controls fieldset:nth-child(2) .control-group{grid-template-columns:repeat(2,minmax(0,1fr))}.control-group button{padding:0 8px;font-size:.78rem}.safe-toggle{width:100%;margin-left:0}.identity-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.identity-rail button{width:100%;min-width:0;padding:0 8px;white-space:normal;overflow-wrap:anywhere}.preview-heading{align-items:flex-start;flex-direction:column;justify-content:center;gap:3px}.showcase-stage{min-height:300px;padding:12px;border-radius:20px}.showcase-footer{align-items:flex-start;flex-direction:column;padding:14px 0}.showcase-footer button{width:100%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
.portrait-frame-controls{flex-wrap:wrap}.portrait-frame-controls button{flex:1 1 auto}
