.grimoire-stage{--ink:#f6f1e8;--muted:#d8d0c2;--panel:#0c0f12c7;min-height:100dvh;color:var(--ink);font-family:var(--font-sans);background:#101318;overflow:hidden}.grimoire-stage__surface{min-height:100dvh}#viewport{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}.stage-header,.stage-message,.stage-hud,.side-sheet{z-index:30;position:fixed}.stage-header{pointer-events:none;justify-content:space-between;align-items:flex-start;padding:clamp(17px,3vw,30px);display:flex;inset:0 0 auto}.header-actions{pointer-events:auto;gap:8px;display:flex}.wordmark{text-shadow:0 3px 18px #000;gap:6px;display:grid}.wordmark span,.eyebrow{color:var(--accent);font:700 10px/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;margin:0}.wordmark strong{font:500 clamp(25px, 3.3vw, 42px)/.86 var(--font-display);letter-spacing:-.055em}.quiet-button,.ride-button,.sheet-close{color:var(--ink);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font:700 10px/1 var(--font-sans);letter-spacing:.09em;text-transform:uppercase;cursor:pointer;background:#0a0c0f94;border:1px solid #f6f1e840;border-radius:999px;padding:10px 13px;box-shadow:0 8px 24px #0004}.quiet-button:hover,.ride-button:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, #101318)}.stage-message{max-width:min(390px,100vw - 42px);color:var(--muted);font:500 12px/1.35 var(--font-sans);text-align:center;text-shadow:0 2px 12px #000;pointer-events:none;top:31%;left:50%;transform:translate(-50%)}.stage-message__dot{background:var(--accent);width:6px;height:6px;box-shadow:0 0 13px var(--accent);border-radius:50%;margin:0 8px 1px 0;display:inline-block}.stage-hud{pointer-events:none;justify-items:center;gap:9px;display:grid;bottom:22px;left:0;right:0}.element-selector{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:auto;background:#0a0c0fad;border:1px solid #f6f1e833;border-radius:18px;gap:3px;padding:4px;display:flex;box-shadow:0 16px 38px #0008}.element-selector button{color:#c6c4bf;min-width:61px;font:700 9px/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;border-radius:13px;gap:3px;padding:7px 9px;display:grid}.element-selector button i{color:var(--accent);text-shadow:0 0 14px var(--accent);font:23px/1 Georgia,serif}.element-selector button.is-active{color:var(--ink);background:color-mix(in srgb, var(--accent) 19%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 75%, transparent)}.cast-button{border:1px solid color-mix(in srgb, var(--accent) 78%, white);color:#0e1215;background:var(--accent);min-width:148px;box-shadow:0 8px 32px color-mix(in srgb, var(--accent) 42%, transparent);font:800 10px/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;border-radius:14px;padding:12px 19px}.cast-button b{font:600 22px/.9 var(--font-display);letter-spacing:-.02em;text-transform:none;margin-top:4px;display:block}.cast-button:disabled{opacity:.55;cursor:wait}.ride-button{pointer-events:auto;padding:8px 12px;font-size:9px}.ride-button.is-armed{color:#06252a;background:#a7e8f2;border-color:#a7e8f2}.intro{z-index:100;background:#08090a;display:grid;position:fixed;inset:0;overflow:hidden}.intro__art{object-fit:cover;width:100%;height:100%;animation:7.2s ease-in-out infinite alternate panel-drift;position:absolute;inset:0}.intro__panels{z-index:1;grid-template-columns:repeat(4,1fr);display:grid;position:relative}.intro__panel{min-width:0;min-height:0;margin:0;position:relative;overflow:hidden}.intro__panel:before{z-index:1;content:"";animation:.85s cubic-bezier(.2,.8,.2,1) both panel-reveal;animation-delay:calc(var(--panel-index) * .12s);background:#08090a;position:absolute;inset:0}.intro__panel:after{z-index:2;content:"";mix-blend-mode:screen;animation:3.4s ease-in-out infinite panel-sheen;animation-delay:calc(var(--panel-index) * .18s);background:linear-gradient(110deg,#0000 35%,#ffffff24 50%,#0000 65%);position:absolute;inset:0}.intro__panel figcaption{z-index:3;color:#fff;font:700 10px/1 var(--font-sans);letter-spacing:.28em;opacity:0;text-shadow:0 2px 12px #000;text-transform:uppercase;animation:.4s both intro-label;animation-delay:calc(.4s + var(--panel-index) * .12s);position:absolute;bottom:13px;right:16px}.intro__copy{text-align:center;pointer-events:none;background:radial-gradient(circle,#0000 0 22%,#00000061 72%,#000000bd);align-content:center;justify-items:center;padding:28px;display:grid;position:absolute;inset:0}.intro__copy p,.intro__copy span{color:#fff6e7;font:700 10px/1.35 var(--font-sans);letter-spacing:.2em;text-transform:uppercase;margin:0}.intro__copy h1{max-width:620px;font:500 clamp(45px, 9vw, 112px)/.82 var(--font-display);letter-spacing:-.07em;text-shadow:0 5px 44px #000;margin:14px 0}.intro__copy span{color:#f4ead9c7;letter-spacing:.11em;text-transform:none;font-size:9px}.intro__skip{z-index:1;color:#fff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font:700 10px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:#00000052;border:1px solid #ffffff6b;border-radius:999px;padding:10px 14px;position:absolute;bottom:22px;right:24px}.side-sheet{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(145deg,#191e22f5,#0b0e11f7);border:1px solid #f6f1e838;border-radius:22px;width:min(360px,100vw - 36px);max-height:min(680px,100dvh - 50px);padding:23px;top:50%;right:22px;overflow:auto;transform:translateY(-50%);box-shadow:0 24px 84px #000a}.sheet-close{width:32px;height:32px;color:var(--muted);font:300 25px/1 var(--font-sans);place-items:center;padding:0;display:grid;position:absolute;top:12px;right:12px}.side-sheet h2{max-width:280px;font:500 31px/.98 var(--font-display);letter-spacing:-.045em;margin:7px 0 12px}.sheet-copy{color:#ddd9d0;font:400 13px/1.55 var(--font-sans);margin:0}.input-health{color:#d9e9e7;font:500 11px/1.4 var(--font-sans);background:#bfe8df14;border:1px solid #bfe8df40;border-radius:12px;align-items:flex-start;gap:9px;margin:17px 0;padding:10px;display:flex}.input-health i{background:#b9c0c0;border-radius:50%;flex:none;width:8px;height:8px;margin-top:3px;box-shadow:0 0 10px}.input-health--ready i,.input-health--tracking i{color:#a8f0dc;background:#a8f0dc}.input-health--fallback i,.input-health--unavailable i{color:#ffb65d;background:#ffb65d}.input-health--requesting i{color:#bfe8df;background:#bfe8df;animation:1s ease-in-out infinite status-pulse}.gesture-guide{gap:9px;margin:17px 0;padding:0;list-style:none;display:grid}.gesture-guide li{color:#d8d2c9;font:400 11px/1.42 var(--font-sans);grid-template-columns:23px 1fr;align-items:start;gap:9px;display:grid}.gesture-guide b{aspect-ratio:1;border:1px solid var(--accent);width:23px;color:var(--accent);font:700 10px/1 var(--font-sans);border-radius:50%;place-items:center;display:grid}.gesture-guide strong{color:#fff;font-size:11px;display:block}.sheet-actions{grid-template-columns:1fr auto;align-items:end;gap:7px;display:grid}.sheet-actions .cast-button{min-width:0}.sheet-actions .cast-button b{display:none}.workshop{right:max(22px,50vw - 650px)}.preset-grid{grid-template-columns:repeat(2,1fr);gap:7px;margin-top:17px;display:grid}.preset-grid button{min-height:65px;color:var(--ink);text-align:left;cursor:pointer;background:#ffffff09;border:1px solid #f6f1e829;border-radius:11px;gap:5px;padding:9px;display:grid}.preset-grid button:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 11%, transparent)}.preset-grid small{color:var(--accent);font:700 8px/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase}.preset-grid strong{font:500 16px/1 var(--font-display)}.local-dials{border:0;border-top:1px solid #f6f1e829;gap:13px;margin:20px 0 0;padding:16px 0 0;display:grid}.local-dials legend{color:var(--accent);font:700 9px/1 var(--font-sans);letter-spacing:.15em;text-transform:uppercase;padding:0}.local-dials label{color:#eee8dc;font:600 11px/1 var(--font-sans);grid-template-columns:1fr auto;align-items:center;gap:6px;display:grid}.local-dials output{color:var(--accent);font:500 14px/1 var(--font-display)}.local-dials input{width:100%;accent-color:var(--accent);grid-column:1/-1}.hand-mirror{--hand-accent:#bfe8df;z-index:45;aspect-ratio:4/3;pointer-events:none;background:#07090b;border:1px solid #f6f1e852;border-radius:15px;width:164px;position:fixed;bottom:20px;right:20px;overflow:hidden;box-shadow:0 16px 40px #000b}.hand-mirror video,.hand-mirror canvas{object-fit:cover;width:100%;height:100%;position:absolute;transform:scaleX(-1)}.hand-mirror canvas{transform:none}.hand-mirror span{color:#fff;font:700 7px/1 var(--font-sans);letter-spacing:.09em;text-transform:uppercase;background:#0000008a;border-radius:999px;padding:4px 6px;position:absolute;bottom:7px;right:7px}.hand-mirror i{border:2px solid var(--hand-accent);clip-path:inset(0 calc((1 - var(--hold,0)) * 100%) 0 0);filter:drop-shadow(0 0 5px var(--hand-accent));opacity:0;border-radius:50%;transition:opacity .12s;position:absolute;inset:8px}.hand-mirror.is-pose i{opacity:1}.hand-mirror.is-tracking{border-color:var(--hand-accent);box-shadow:0 0 24px -9px var(--hand-accent), 0 16px 40px #000b}.grimoire-stage :is(button,input):focus-visible{outline-offset:3px;outline:3px solid #fff}@keyframes panel-reveal{0%{clip-path:inset(0);opacity:1}to{clip-path:inset(0 0 0 100%);opacity:0}}@keyframes panel-drift{0%{transform:scale(1.08)translate(-1.5%,1%)}to{transform:scale(1.18)translate(1.5%,-1%)}}@keyframes panel-sheen{0%,30%{transform:translate(-120%)}65%,to{transform:translate(120%)}}@keyframes intro-label{to{opacity:1}}@keyframes status-pulse{50%{opacity:.4;transform:scale(.55)}}@media (max-width:680px){.stage-header{padding:17px}.wordmark strong{font-size:28px}.header-actions{gap:5px}.quiet-button{padding:9px 10px;font-size:9px}.stage-message{top:24%}.element-selector button{min-width:54px;padding:7px 5px}.element-selector button i{font-size:20px}.side-sheet{width:calc(100vw - 18px);max-height:min(680px,100dvh - 18px);top:auto;bottom:9px;right:9px;transform:none}.hand-mirror{width:132px;bottom:166px;right:12px}.intro__copy h1{font-size:clamp(43px,13vw,74px)}.intro__copy span{max-width:260px}.intro__skip{bottom:13px;right:13px}}@media (pointer:coarse){.element-selector button,.quiet-button,.ride-button,.intro__skip{min-height:42px}.cast-button{min-height:52px}}@media (prefers-reduced-motion:reduce){.grimoire-stage *,.grimoire-stage :before,.grimoire-stage :after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}