:root{font-family:IBM Plex Sans,Avenir Next,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color:#f3f7fb;background:#04111e;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--accent: #65f0c9;--panel-bg: rgba(10, 20, 32, .68);--panel-border: rgba(255, 255, 255, .12);--panel-shadow: 0 28px 80px rgba(0, 0, 0, .28);--text-muted: rgba(231, 238, 247, .72);--text-soft: rgba(231, 238, 247, .82)}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100vh}body{margin:0;background:#04111e}button,input,textarea,select{font:inherit}a{color:inherit}.app-shell{position:relative;min-height:100vh}.debug-panel{position:fixed;top:1rem;right:1rem;z-index:4;display:grid;gap:.6rem;width:min(22rem,calc(100vw - 2rem));max-height:calc(100vh - 2rem);overflow:auto;padding:.8rem;border:1px solid rgba(255,255,255,.12);background:#090e16d1;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#ffffffe0}.debug-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.debug-mode-button{min-height:2.3rem;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:#ffffffd1;cursor:pointer}.debug-mode-button.is-active{border-color:#ffffff42;background:#ffffff1f;color:#fff}.debug-action-button{width:calc(100% - 1.6rem);margin:0 .8rem .65rem;min-height:2.15rem;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:#ffffffeb;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.debug-action-button:hover{border-color:#ffffff42;background:#ffffff1f}.debug-panel details{border:1px solid rgba(255,255,255,.08);background:#ffffff08}.debug-panel summary{cursor:pointer;padding:.7rem .8rem;font-size:.82rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.debug-field,.debug-toggle{display:grid;gap:.4rem;padding:.65rem .8rem;border-top:1px solid rgba(255,255,255,.06)}.debug-field span,.debug-toggle span{font-size:.76rem;color:#ffffffb8}.debug-field strong{font-size:.76rem;font-weight:600}.debug-field input[type=range]{width:100%}.debug-field select,.debug-field input[type=color]{width:100%;min-height:2rem;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:inherit}.debug-toggle{grid-template-columns:1fr auto;align-items:center}.debug-color{grid-template-columns:1fr}.stage-shell{position:fixed;inset:0;overflow:hidden;background:#02060d}.stage-shell canvas{display:block;width:100%!important;height:100%!important}.stage-overlay{position:absolute;inset:0;z-index:2;pointer-events:none;--grid-opacity: .82;--grid-size: 4.75rem;--guide-opacity: .9;--frame-opacity: .18;--frame-inset: 1.15rem;--frame-notch-width: 7rem}.gesture-feedback{position:absolute;top:1rem;left:1rem;z-index:3;pointer-events:none;width:min(24rem,calc(100vw - 2rem));padding:.75rem .85rem;border:1px solid rgba(255,255,255,.18);background:#070c1485;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fafbfdf2}.panel-fixed-feedback{position:absolute;top:1.2rem;left:50%;z-index:3;padding:.45rem .75rem;border:1px solid rgba(255,255,255,.22);background:#080e16b8;color:#fafcfff5;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;transform:translate(-50%) translateY(-.45rem);opacity:0;pointer-events:none}.panel-fixed-feedback.is-visible{animation:panel-fixed-feedback-pop 1.2s ease forwards}@keyframes panel-fixed-feedback-pop{0%{opacity:0;transform:translate(-50%) translateY(-.45rem)}14%{opacity:1;transform:translate(-50%) translateY(0)}74%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-.2rem)}}.gesture-feedback-title{margin:0;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:#ffffffa3}.gesture-feedback-status{margin:.22rem 0 0;font-size:.9rem;font-weight:600}.gesture-feedback-meta{margin:.3rem 0 0;font-size:.75rem;color:#f0f5fad6}.gesture-progress-track{position:relative;margin-top:.55rem;height:.24rem;border:1px solid rgba(255,255,255,.2);background:#ffffff0f;overflow:hidden}.gesture-progress-fill{position:absolute;inset:0;transform-origin:left center;background:linear-gradient(90deg,#aad8fff2,#fffffff5)}.overlay-grid,.overlay-guides,.overlay-frame{position:absolute;inset:0}.overlay-grid{background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:clamp(2.5rem,8vw,var(--grid-size)) clamp(2.5rem,8vw,var(--grid-size));opacity:var(--grid-opacity)}.overlay-guides{background-image:linear-gradient(90deg,transparent 16.66%,rgba(255,255,255,.1) 16.66%,rgba(255,255,255,.1) calc(16.66% + 1px),transparent calc(16.66% + 1px)),linear-gradient(90deg,transparent 33.33%,rgba(255,255,255,.07) 33.33%,rgba(255,255,255,.07) calc(33.33% + 1px),transparent calc(33.33% + 1px)),linear-gradient(90deg,transparent 50%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.12) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(90deg,transparent 66.66%,rgba(255,255,255,.07) 66.66%,rgba(255,255,255,.07) calc(66.66% + 1px),transparent calc(66.66% + 1px)),linear-gradient(90deg,transparent 83.33%,rgba(255,255,255,.1) 83.33%,rgba(255,255,255,.1) calc(83.33% + 1px),transparent calc(83.33% + 1px)),linear-gradient(transparent 24%,rgba(255,255,255,.08) 24%,rgba(255,255,255,.08) calc(24% + 1px),transparent calc(24% + 1px)),linear-gradient(transparent 50%,rgba(255,255,255,.11) 50%,rgba(255,255,255,.11) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(transparent 76%,rgba(255,255,255,.08) 76%,rgba(255,255,255,.08) calc(76% + 1px),transparent calc(76% + 1px));opacity:var(--guide-opacity)}.overlay-frame{inset:var(--frame-inset);border:1px solid rgba(255,255,255,var(--frame-opacity));box-shadow:inset 0 0 0 1px #ffffff0a,0 0 0 1px #50505029}.overlay-frame:before,.overlay-frame:after{content:"";position:absolute;left:50%;width:var(--frame-notch-width);height:1px;transform:translate(-50%);background:#ffffff47}.overlay-frame:before{top:1.1rem}.overlay-frame:after{bottom:1.1rem}@media(max-width:640px){.debug-panel{top:auto;right:.75rem;bottom:.75rem;width:min(22rem,calc(100vw - 1.5rem));max-height:min(52vh,28rem)}.overlay-grid{background-size:clamp(2.5rem,12vw,var(--grid-size)) clamp(2.5rem,12vw,var(--grid-size))}.gesture-feedback{top:.75rem;left:.75rem;width:min(22rem,calc(100vw - 1.5rem))}}