:root{color-scheme:dark;--ink: #f4efe6;--muted: #b7aea0;--paper: #1a1714;--panel: #241f1a;--rule: #3a3229;--accent: #ff6b4a;--accent-soft: #ff8f75;--stage-top: #2a221c;--stage-bot: #0e0c0a;font-family:Iowan Old Style,Palatino Linotype,Palatino,Georgia,serif;line-height:1.45}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--stage-bot);color:var(--ink)}body{min-height:100vh;background:radial-gradient(1200px 500px at 50% -10%,#3a2c22 0%,transparent 60%),linear-gradient(180deg,var(--stage-top),var(--stage-bot))}#app{max-width:920px;margin:0 auto;padding:1.5rem 1.25rem 2.5rem}.topbar{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}.brand{display:flex;flex-direction:column;gap:.15rem}.brand h1{margin:0;font-size:1.35rem;letter-spacing:.02em}.brand p{margin:0;color:var(--muted);font-size:.92rem}.pill{border:1px solid var(--rule);border-radius:999px;padding:.35rem .75rem;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}.stage{position:relative;border:1px solid var(--rule);border-radius:14px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 30%),radial-gradient(800px 280px at 50% 0%,rgba(255,107,74,.12),transparent 55%),#14110e;box-shadow:0 24px 60px #00000059}.stage-art{height:220px;display:grid;place-items:end center;padding:1.5rem 1.5rem 0;background:radial-gradient(circle at 50% 70%,rgba(255,107,74,.18),transparent 45%),linear-gradient(180deg,transparent 40%,rgba(0,0,0,.55))}.speaker{width:min(220px,46vw);aspect-ratio:3 / 4;border-radius:120px 120px 18px 18px;background:linear-gradient(180deg,#4a3a2e,#2a211b 55%,#1a1511);border:1px solid rgba(255,255,255,.08);position:relative;box-shadow:0 18px 40px #00000073}.speaker:before{content:"";position:absolute;inset:18% 28% auto;height:28%;border-radius:50%;background:radial-gradient(circle at 35% 35%,#6b5646,#3a2d25 70%)}.speaker:after{content:"";position:absolute;left:18%;right:18%;bottom:8%;height:38%;border-radius:40% 40% 18% 18%;background:linear-gradient(180deg,#5a4638,#2d231c)}.dialogue{margin:0 1rem 1rem;border:1px solid var(--rule);border-radius:12px;background:#14110eeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.9rem 1rem 1rem}.dialogue-name{display:inline-block;margin-bottom:.45rem;padding:.15rem .55rem;border-radius:999px;background:var(--accent);color:#1a100c;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.dialogue-text{margin:0;min-height:3.2em;font-size:1.05rem;white-space:pre-wrap}.cursor{display:inline-block;width:.55ch;margin-left:1px;background:var(--accent-soft);animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}.controls{display:grid;gap:1rem;margin-top:1.25rem;padding:1rem;border:1px solid var(--rule);border-radius:12px;background:var(--panel)}.controls h2{margin:0;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}textarea{width:100%;min-height:84px;resize:vertical;border:1px solid var(--rule);border-radius:10px;background:#161310;color:var(--ink);padding:.7rem .8rem;font:inherit}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem 1rem}@media(max-width:640px){.grid{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:flex-start}}label{display:grid;gap:.35rem;font-size:.85rem;color:var(--muted)}.rangeRow{display:flex;align-items:center;gap:.65rem}input[type=range]{width:100%;accent-color:var(--accent)}.rangeValue{min-width:3.2rem;text-align:right;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;color:var(--ink)}.actions{display:flex;flex-wrap:wrap;gap:.5rem}button{border:1px solid var(--rule);border-radius:999px;background:#1c1814;color:var(--ink);padding:.55rem .95rem;font:inherit;cursor:pointer}button.primary{background:var(--accent);border-color:transparent;color:#1a100c;font-weight:700}button:hover{filter:brightness(1.08)}.status{margin:0;font-size:.85rem;color:var(--muted)}.snippets{margin-top:1.25rem;padding:1rem;border:1px solid var(--rule);border-radius:12px;background:var(--panel)}.snippetTabs{display:flex;flex-wrap:wrap;gap:.35rem;margin:.65rem 0 .75rem}.snippetTabs button.active{border-color:var(--accent);color:var(--accent-soft)}pre{margin:0;padding:.85rem;border:1px solid var(--rule);border-radius:10px;overflow:auto;font-size:.78rem;line-height:1.45;background:#14110e;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
