:root{--void: #0a0a0b;--void-2: #141416;--gold: #c9a227;--gold-bright: #e8c34d;--gold-deep: #9c7d18;--ivory: #f4f1e8;--ivory-dim: #8c8a82;--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;--bg-app: #050506}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100%;height:100%}body{background:var(--bg-app);color:var(--ivory);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.app-shell{display:grid;grid-template-columns:minmax(300px,380px) 1fr;min-height:100vh;max-height:100vh}.work-pane{overflow-y:auto;overflow-x:hidden;padding:1rem 1rem 1.5rem;background:#0d0d0f;border-right:1px solid #1f1f22;min-width:0}.stage-pane-wrap{display:flex;flex-direction:column;min-height:0}@media (max-width: 760px){.app-shell{grid-template-columns:1fr;max-height:none}.work-pane{border-right:none;border-bottom:1px solid #1f1f22;max-height:none;overflow-y:visible}}.stage-pane{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem 1.5rem 0;min-height:0}@media (max-width: 760px){.stage-pane{padding:.75rem .5rem 0}}.stage-empty{text-align:center;color:var(--ivory-dim);font-family:var(--font-mono);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}.stage-frame{--tile-w: 7.22cqi;position:relative;aspect-ratio:9 / 16;width:100%;max-width:min(100%,calc((100vh - 8rem)*.5625));border-radius:4px;overflow:hidden;background:radial-gradient(120% 80% at 50% 0%,#1a1a1d,#0a0a0b 55%,#060607);box-shadow:0 30px 80px #0009;container-type:inline-size;isolation:isolate}@media (max-width: 760px){.stage-frame{max-width:92vw}}.stage-grain{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.05;background-image:repeating-radial-gradient(circle at 30% 20%,rgba(255,255,255,.06) 0 1px,transparent 1px 3px),repeating-radial-gradient(circle at 70% 80%,rgba(255,255,255,.04) 0 1px,transparent 1px 4px);mix-blend-mode:overlay}.corner{position:absolute;width:5.56cqi;height:5.56cqi;opacity:.5}.corner-tl{top:6.11cqi;left:6.11cqi;border-top:.42cqi solid var(--gold);border-left:.42cqi solid var(--gold)}.corner-br{bottom:6.11cqi;right:6.11cqi;border-bottom:.42cqi solid var(--gold);border-right:.42cqi solid var(--gold)}.brand-bar{position:absolute;top:9.44cqi;left:7.78cqi;right:7.78cqi;display:flex;justify-content:space-between;align-items:center}.brand-mark{display:flex;align-items:center;gap:1.94cqi;font-weight:800;font-size:5cqi;color:var(--ivory)}.brand-chip{background:var(--gold);color:var(--void);padding:.55cqi 1.94cqi;border-radius:.83cqi;box-shadow:0 1.67cqi 5cqi #c9a22733;line-height:1}.brand-suffix{color:var(--ivory-dim);font-weight:500;letter-spacing:.18em;font-size:2.78cqi;text-transform:uppercase}.brand-kicker{font-family:var(--font-mono);font-size:2.78cqi;color:var(--gold);letter-spacing:.16em}.surface-label{position:absolute;top:30cqi;left:7.78cqi;right:7.78cqi;text-align:center;font-family:var(--font-mono);font-weight:700;font-size:3.89cqi;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory-dim);opacity:0;transition:opacity .5s ease}.surface-label.is-visible{opacity:1}.board{position:absolute;top:43.89cqi;bottom:46.67cqi;left:7.22cqi;right:7.22cqi;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--tile-w) * 14 / 26)}.board-line{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:calc(var(--tile-w) * 4 / 26);max-width:100%}.board-word{display:flex;gap:calc(var(--tile-w) * 4 / 26)}.board-word-gap{width:calc(var(--tile-w) * 11 / 26);flex-shrink:0}.tile{width:var(--tile-w);height:calc(var(--tile-w) * 34 / 26);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:800;font-size:calc(var(--tile-w) * 22 / 26);border-radius:calc(var(--tile-w) * 4 / 26);color:var(--ivory);background:linear-gradient(180deg,#232327,#1c1c1f 60%,#101012);box-shadow:inset 0 1px #ffffff0f,inset 0 -2px 4px #0009,0 4px 10px #0000008c;opacity:0;transform:translateY(calc(var(--tile-w) * 24 / 26)) rotateX(40deg) scale(.9);transition:opacity .18s ease,transform .34s cubic-bezier(.2,1.5,.4,1);flex-shrink:0}.tile-set{opacity:1;transform:translateY(0) rotateX(0) scale(1)}.tile-accent.tile-set{color:var(--void);background:linear-gradient(180deg,var(--gold-bright) 0%,var(--gold) 65%,var(--gold-deep) 100%);box-shadow:inset 0 1px #ffffff59,inset 0 -2px 5px #00000059,0 6px 16px #c9a22759}.close-line{position:absolute;bottom:22.22cqi;left:8.33cqi;right:8.33cqi;text-align:center;font-weight:800;font-size:6.67cqi;line-height:1.28;letter-spacing:-.005em;color:var(--ivory);opacity:0;transform:translateY(2.78cqi);transition:opacity .6s ease,transform .6s ease}.close-line.is-visible{opacity:1;transform:translateY(0)}.close-gold{color:var(--gold-bright);font-weight:800}.handle{position:absolute;bottom:9.44cqi;left:0;right:0;text-align:center;font-family:var(--font-mono);font-size:3.06cqi;letter-spacing:.14em;color:var(--ivory-dim)}.handle-dot{color:var(--gold)}.idle-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#06060799}.idle-hint-badge{font-family:var(--font-mono);color:var(--gold);letter-spacing:.2em;font-size:3.33cqi;text-transform:uppercase;border:1px solid rgba(201,162,39,.4);padding:3.33cqi 6.11cqi;border-radius:1.11cqi}.controls{display:flex;gap:.75rem;justify-content:center;align-items:center;padding:1rem 1rem 1.25rem;flex-wrap:wrap}.btn{min-width:7rem;min-height:44px;padding:.7rem 1.25rem;border-radius:6px;font-weight:700;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;font-family:var(--font-mono);cursor:pointer;-webkit-tap-highlight-color:transparent}.btn-primary{background:var(--gold);color:var(--void);border:none}.btn-primary:active{background:var(--gold-bright)}.btn-secondary{background:transparent;color:var(--gold);border:1px solid var(--gold)}.btn-secondary:active{background:#c9a2271a}.controls-hint{flex-basis:100%;text-align:center;color:var(--ivory-dim);font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;margin:.25rem 0 0}.library{margin-bottom:1rem}.library-actions{display:flex;gap:.4rem;margin-bottom:.6rem;flex-wrap:wrap}.lib-action{flex:1;min-width:4.5rem;min-height:44px;padding:.5rem .6rem;background:transparent;border:1px solid #2d2d31;color:var(--ivory-dim);border-radius:6px;cursor:pointer;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;-webkit-tap-highlight-color:transparent}.lib-action:hover:not(:disabled),.lib-action:focus-visible{border-color:var(--gold);color:var(--gold)}.lib-action.is-primary{border-color:var(--gold);color:var(--gold)}.lib-action:disabled{opacity:.45;cursor:default}.library-empty{font-family:var(--font-mono);font-size:.75rem;color:var(--ivory-dim);text-align:center;padding:1rem 0}.library-list{list-style:none;padding:0;margin:0;max-height:36vh;overflow-y:auto}.library-list li{padding:.65rem .7rem;border:1px solid #1f1f22;border-radius:6px;margin-bottom:.35rem;cursor:pointer;background:#0e0e10;outline:none;-webkit-tap-highlight-color:transparent}.library-list li:hover,.library-list li:focus-visible{border-color:#c9a22780}.library-list li.is-active{border-color:var(--gold);background:#c9a2270f}.lib-kicker{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;color:var(--gold);margin-bottom:.2rem}.lib-preview{font-size:.78rem;color:var(--ivory);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lib-preview em{color:var(--ivory-dim);font-style:italic}.lib-time{font-family:var(--font-mono);font-size:.65rem;color:var(--ivory-dim);margin-top:.25rem}.editor{padding-top:.5rem}.field-label,.field-label-row{display:block;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory-dim);margin-top:.9rem;margin-bottom:.35rem}.field-input,.field-textarea{width:100%;background:#1a1a1d;border:1px solid #2d2d31;border-radius:6px;color:var(--ivory);padding:.6rem .7rem;font-size:.95rem;font-family:var(--font-mono);outline:none;min-height:44px;scroll-margin-top:1rem;scroll-margin-bottom:1rem}.field-textarea{min-height:72px;resize:vertical;line-height:1.4;font-family:var(--font-sans)}.field-input:focus,.field-textarea:focus{border-color:var(--gold)}.line-row{display:flex;gap:.35rem;margin-bottom:.4rem}.line-row .field-input{flex:1;min-width:0;text-transform:uppercase;letter-spacing:.06em}.line-btn{width:44px;min-width:44px;height:44px;min-height:44px;flex-shrink:0;background:transparent;border:1px solid #2d2d31;border-radius:6px;color:var(--ivory-dim);cursor:pointer;font-family:var(--font-mono);font-size:.95rem;-webkit-tap-highlight-color:transparent}.line-btn:hover:not(:disabled),.line-btn:focus-visible{border-color:var(--gold);color:var(--gold)}.line-btn:disabled{opacity:.35;cursor:default}.line-btn-del:hover{border-color:#b25656;color:#d77}.add-line-btn{margin-top:.3rem;background:transparent;border:1px dashed #2d2d31;color:var(--ivory-dim);padding:.5rem .75rem;border-radius:6px;cursor:pointer;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;width:100%;min-height:44px;-webkit-tap-highlight-color:transparent}.add-line-btn:hover,.add-line-btn:focus-visible{color:var(--gold);border-color:var(--gold)}.accent-picker{display:flex;gap:.35rem;flex-wrap:wrap}.accent-btn{min-width:44px;min-height:44px;padding:.45rem .7rem;background:transparent;color:var(--ivory-dim);border:1px solid #2d2d31;border-radius:6px;font-family:var(--font-mono);font-size:.8rem;cursor:pointer;-webkit-tap-highlight-color:transparent}.accent-btn:hover{border-color:var(--gold)}.accent-btn.is-active{color:var(--void);background:var(--gold);border-color:var(--gold)}.btn-danger{margin-top:1.5rem;width:100%;min-height:44px;background:transparent;border:1px solid #5b3535;color:#d77;border-radius:6px;cursor:pointer;font-family:var(--font-mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;-webkit-tap-highlight-color:transparent}.btn-danger:hover,.btn-danger:focus-visible{background:#b43c3c1f;border-color:#844}.sizing-warning{text-align:center;margin:.5rem auto 0;max-width:32rem;padding:.55rem .9rem;background:#c9a2271a;border:1px solid rgba(201,162,39,.35);border-radius:4px;color:var(--gold-bright);font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;line-height:1.4}.sizing-warning.inline{margin:.4rem 0 0;font-size:.65rem;text-align:left;letter-spacing:.04em}