:root{--bg: #14100c;--bg-panel: rgba(0, 0, 0, .55);--ink: #f2ece2;--ink-dim: #a89e90;--accent: #d8a657;--student: #8fbcd4;--caption-size: clamp(1.75rem, 3.4vw, 3.4rem);--label-size: clamp(.85rem, 1.1vw, 1.15rem)}*{box-sizing:border-box}html,body{height:100%;margin:0;background:var(--bg);color:var(--ink);font-family:Heebo,Assistant,Rubik,system-ui,-apple-system,sans-serif;overflow:hidden;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.stage{display:grid;grid-template-rows:minmax(0,1fr) auto auto;height:100dvh;width:100%}.avatar{position:relative;min-height:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse 60% 55% at 50% 45%,rgba(216,166,87,.1),transparent 70%)}.avatar canvas{display:block;max-width:100%;max-height:100%}.placeholder-avatar{width:100%;height:100%}.captions{display:flex;flex-direction:column;gap:.75rem;padding:1.25rem clamp(1.5rem,5vw,5rem) .5rem;min-height:34dvh;max-height:42dvh;overflow-y:auto;scrollbar-width:none}.captions::-webkit-scrollbar{display:none}.caption{background:var(--bg-panel);border-radius:1rem;padding:.85rem 1.5rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.caption__label{display:block;font-size:var(--label-size);letter-spacing:.08em;color:var(--ink-dim);margin-bottom:.3rem}.caption__text{margin:0;font-size:var(--caption-size);line-height:1.35;font-weight:500;text-wrap:balance}.caption--student{border-inline-start:6px solid var(--student)}.caption--student .caption__text{color:var(--student)}.caption--student.is-interim .caption__text{opacity:.6;font-style:italic}.caption--aliza{border-inline-start:6px solid var(--accent)}.caption__word.is-current{background:var(--accent);color:#14100c;border-radius:.3rem;padding:0 .15em;font-weight:700}.status-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem clamp(1.5rem,5vw,5rem) 1rem;font-size:clamp(.8rem,1.1vw,1.05rem);color:var(--ink-dim)}.status{margin:0;display:flex;align-items:center;gap:.5rem}.status:before{content:"";width:.6em;height:.6em;border-radius:50%;background:currentColor;opacity:.35}[data-state=listening] .status{color:var(--student)}[data-state=listening] .status:before{opacity:1;animation:pulse 1.6s ease-in-out infinite}[data-state=thinking] .status:before{opacity:1;animation:pulse .7s ease-in-out infinite}[data-state=speaking] .status{color:var(--accent)}[data-state=speaking] .status:before{opacity:1}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.4}}.disclaimer{margin:0;text-align:end;opacity:.75}.gate{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);padding:2rem;transition:opacity .4s ease;z-index:10}.gate.is-hidden{opacity:0;pointer-events:none}.gate__panel{max-width:46rem;text-align:center}.gate__title{font-size:clamp(2.5rem,6vw,5rem);margin:0 0 1.5rem;color:var(--accent);font-weight:600}.gate__disclaimer{font-size:clamp(1rem,1.6vw,1.4rem);line-height:1.6;color:var(--ink-dim);margin:0 0 2.5rem}.gate__button{font:inherit;font-size:clamp(1.2rem,2vw,1.8rem);padding:1rem 3rem;border:2px solid var(--accent);border-radius:999px;background:transparent;color:var(--accent);cursor:pointer;transition:background .2s ease,color .2s ease}.gate__button:hover:not(:disabled),.gate__button:focus-visible{background:var(--accent);color:var(--bg)}.gate__button:disabled{opacity:.4;cursor:not-allowed}.gate__error{margin:1.5rem 0 0;color:#e08c7d;font-size:clamp(.95rem,1.4vw,1.2rem);line-height:1.5}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}
