:root{font-family:system-ui,sans-serif;color:#14233c;background:#eef2f5}*{box-sizing:border-box}body{margin:0}main{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(340px,.6fr)}#stage{position:relative;min-height:100vh;background:radial-gradient(circle at 50% 35%,#dcecf1,#8ca4b3);overflow:hidden;perspective:1000px}canvas{width:100%;height:100%;display:block;opacity:0;filter:saturate(.97) contrast(1.015);transition:opacity .7s ease,filter .35s ease;will-change:transform,filter}canvas.is-ready{opacity:1}canvas.is-speaking{filter:saturate(1.04) contrast(1.02) brightness(1.025)}canvas.has-error{opacity:0}.status{position:absolute;left:20px;right:20px;bottom:20px;display:flex;justify-content:space-between;color:#fff;z-index:2}.status span{background:rgba(20,35,60,.78);padding:8px 12px;border-radius:999px;backdrop-filter:blur(8px)}.panel{background:#fff;padding:28px;box-shadow:-18px 0 60px rgba(0,0,0,.12)}label{display:block;font-weight:700;margin-top:20px}textarea{width:100%;margin-top:8px;border:1px solid #c9d0d8;border-radius:12px;padding:12px}.controls{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}button{border:0;border-radius:10px;padding:10px 13px;background:#14233c;color:#fff}button:disabled{opacity:.45}pre{white-space:pre-wrap;word-break:break-word;border-radius:12px;background:#111923;color:#eaf1f8;padding:14px;min-height:180px;overflow:auto}@media(prefers-reduced-motion:reduce){canvas{transition:none}}@media(max-width:900px){main{grid-template-columns:1fr}#stage{min-height:55vh}.panel{min-height:45vh}}