#root{min-height:100vh}:root{--bg:#10141c;--surface:#171d28;--surface-2:#1e2633;--border:#ffffff14;--text:#e8ecf4;--muted:#8b95a8;--amber:#e8a838;--amber-dim:#e8a83826;--cyan:#5bc4c4;--danger:#f07178;--radius:14px;--font:"DM Sans", system-ui, sans-serif;--display:"Instrument Serif", Georgia, serif}*{box-sizing:border-box}body{min-height:100vh;font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0}.app{max-width:1400px;min-height:100vh;margin:0 auto;padding:2rem clamp(1rem,4vw,3rem) 3rem;position:relative}.grain{pointer-events:none;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.header{margin-bottom:2rem}.header-mark{align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.mark-dot{background:var(--amber);width:8px;height:8px;box-shadow:0 0 12px var(--amber);border-radius:50%}.mark-label{letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-size:.75rem}.title{font-family:var(--display);margin:0;font-size:clamp(2.2rem,5vw,3.4rem);font-weight:400;line-height:1.1}.title em{color:var(--amber);font-style:italic}.subtitle{color:var(--muted);margin:.6rem 0 0;font-size:1rem}.layout{grid-template-rows:auto auto;grid-template-columns:minmax(260px,340px) 1fr;gap:1rem;display:grid}.player-panel{grid-column:1/-1}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;min-height:0;padding:1.25rem;display:flex}.panel-head{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.panel-head h2{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.8rem;font-weight:600}.badge,.char-count{color:var(--muted);background:var(--surface-2);border-radius:999px;padding:.2rem .55rem;font-size:.75rem}.filters{flex-direction:column;gap:.65rem;margin-bottom:.75rem;display:flex}.search{border:1px solid var(--border);background:var(--surface-2);width:100%;color:var(--text);font:inherit;border-radius:10px;padding:.65rem .85rem}.search:focus{outline:2px solid var(--amber-dim);border-color:var(--amber)}.chips{flex-wrap:wrap;gap:.4rem;display:flex}.chip{border:1px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:999px;padding:.3rem .65rem;font-size:.72rem;transition:background .15s,color .15s,border-color .15s}.chip:hover{color:var(--text);border-color:#ffffff2e}.chip-active{background:var(--amber-dim);color:var(--amber);border-color:#e8a83873}.voice-list{flex-direction:column;gap:.45rem;max-height:min(58vh,520px);margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.voice-card{text-align:left;border:1px solid var(--border);background:var(--surface-2);cursor:pointer;width:100%;color:inherit;font:inherit;border-radius:10px;padding:.7rem .85rem;transition:border-color .15s,background .15s}.voice-card:hover{border-color:#ffffff29}.voice-card-active{border-color:var(--amber);background:var(--amber-dim)}.voice-name{font-size:.92rem;font-weight:600;display:block}.voice-meta{color:var(--muted);margin-top:.15rem;font-size:.72rem;display:block}.voice-id{color:var(--cyan);opacity:.85;word-break:break-all;margin-top:.35rem;font-size:.65rem;display:block}.field{color:var(--muted);flex-direction:column;gap:.35rem;margin-bottom:.75rem;font-size:.8rem;display:flex}.field select{border:1px solid var(--border);background:var(--surface-2);color:var(--text);font:inherit;border-radius:10px;padding:.55rem .75rem}.textarea{resize:vertical;border:1px solid var(--border);background:var(--surface-2);width:100%;min-height:220px;color:var(--text);font:inherit;border-radius:12px;flex:1;padding:1rem;font-size:1rem;line-height:1.65}.textarea:focus{outline:2px solid var(--amber-dim);border-color:var(--amber)}.editor-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem;display:flex}.selected{color:var(--muted);font-size:.85rem}.selected strong{color:var(--text)}.btn-primary,.btn-secondary{font:inherit;cursor:pointer;border:none;border-radius:10px;align-items:center;gap:.5rem;font-weight:600;transition:transform .12s,opacity .12s;display:inline-flex}.btn-primary{color:#1a1208;background:linear-gradient(135deg,#e8a838,#d4922a);padding:.75rem 1.4rem}.btn-primary:hover:not(:disabled){transform:translateY(-1px)}.btn-primary:disabled{opacity:.65;cursor:wait}.btn-secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--border);padding:.6rem 1.1rem}.spinner{border:2px solid #1a120840;border-top-color:#1a1208;border-radius:50%;width:14px;height:14px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.wave{justify-content:center;align-items:flex-end;gap:4px;height:56px;margin-bottom:1rem;display:flex}.wave span{background:var(--surface-2);border-radius:2px;width:4px;height:8px;transition:background .2s;display:block}.wave-active span{background:var(--amber);animation:.9s ease-in-out infinite bar;animation-delay:calc(var(--i) * 40ms)}@keyframes bar{0%,to{opacity:.4;height:8px}50%{opacity:1;height:40px}}.audio{width:100%;margin-bottom:.75rem}.hint{color:var(--muted);font-size:.88rem}.player-empty{text-align:center;padding:1rem 0}.error{color:var(--danger);margin:.75rem 0 0;font-size:.88rem}@media (width<=900px){.layout{grid-template-columns:1fr}.voice-list{max-height:280px}}@media (prefers-reduced-motion:reduce){.wave-active span{height:20px;animation:none}.btn-primary:hover:not(:disabled){transform:none}}