:root{color-scheme:dark;font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#edeaf5;background:#111119;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 20%,#24203977,transparent 60%);min-height:100svh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;font-weight:550;border:1px solid #454150;border-radius:100px;padding:14px 24px;color:#eeeaf5;background:#24232e;cursor:pointer;transition:background .15s,transform .15s}button:hover{background:#34313f}button:active{transform:scale(.97)}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid #c9b9f5;outline-offset:5px}[hidden]{display:none!important}.shell{max-width:1100px;margin:0 auto;padding:28px 40px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:13px;color:#a6a0b7}.back{color:#bdb6cf;text-decoration:none}.wordmark{font-weight:650;font-size:18px;letter-spacing:2px;color:#e3dced}.wordmark span{font-size:10px;font-weight:400;color:#9385b5;letter-spacing:3px;margin-left:10px}#connection{font-size:12px}main{display:grid;grid-template-columns:1fr;gap:30px;max-width:790px;margin:0 auto}.call{text-align:center;padding:54px 8px 10px}.eyebrow{font-size:12px;letter-spacing:3px;color:#b2a5ca;margin:0 0 18px}h1{font-weight:450;font-size:clamp(25px,4vw,36px);letter-spacing:1px;margin:0}.sound{width:208px;height:208px;margin:25px auto 18px;position:relative;display:grid;place-items:center}.ring{position:absolute;inset:0;border:1px solid #59506960;border-radius:50%;background:radial-gradient(circle,#9c87c818,transparent 70%)}.ring.inner{inset:20px;border-color:#78689160}.bars{height:52px;display:flex;gap:6px;align-items:center}.bars i{display:block;width:5px;height:13px;border-radius:8px;background:#baabd6}.bars i:nth-child(2),.bars i:nth-child(6){height:26px}.bars i:nth-child(3),.bars i:nth-child(5){height:39px}.bars i:nth-child(4){height:50px}body[data-phase=listening] .ring{border-color:#afd9cd60}body[data-phase=listening] .bars i{background:#b8e0d2}body[data-phase=thinking] .ring{animation:breathe 2s ease-in-out infinite}body[data-phase=speaking] .bars i{animation:talk .7s ease-in-out infinite alternate}body[data-phase=speaking] .bars i:nth-child(2n){animation-delay:-.35s}body[data-phase=speaking] .bars i:nth-child(3n){animation-delay:-.5s}.state{font-size:18px;margin:0 0 10px;min-height:26px}.detail{font-size:13px;color:#a9a2bb;margin:0;min-height:22px}meter{display:block;width:84px;height:4px;margin:17px auto 24px;border:0;border-radius:4px}meter::-webkit-meter-bar{background:#37313f;border:0}meter::-webkit-meter-optimum-value{background:#b8e0d2}meter::-moz-meter-bar{background:#b8e0d2}.controls{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;min-height:52px}.primary{color:#1a1523;background:#cfc0ec;border-color:#cfc0ec;min-width:186px}.primary:hover{background:#e1d3f8}.danger{color:#f1b1bf;background:#472b36;border-color:#68404e}.danger:hover{background:#633a49}button[aria-pressed=true]{border-color:#bf8195;color:#f1b1bf}.notice{color:#eabdc5;font-size:13px;line-height:1.7;min-height:22px;margin:16px 0 0}.consent{font-size:12px;line-height:1.9;color:#90889f;margin:12px auto 0;max-width:560px}.subtitles{border-top:1px solid #35313e;padding-top:21px;padding-bottom:25px}.subtitle-header{display:flex;gap:16px;justify-content:space-between;align-items:center}h2{font-size:13px;font-weight:550;margin:0;color:#c8bfd8}#count{color:#948aab;font-size:11px}.empty{font-size:14px;color:#716b80;margin:25px 0}#transcript{max-height:340px;overflow:auto;scrollbar-width:thin;scrollbar-color:#484052 transparent}.utterance{display:grid;grid-template-columns:48px 1fr;gap:12px;margin:21px 0;font-size:15px;line-height:1.85}.speaker{color:#a99dc0;font-size:12px;padding-top:3px}.utterance.user .speaker{color:#a9cabe}.utterance p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.utterance.user p{color:#bcb5c9}footer{text-align:center;font-size:11px;color:#787184;padding:8px 0 0;line-height:1.8}@keyframes breathe{50%{opacity:.35;transform:scale(.96)}}@keyframes talk{to{transform:scaleY(.45)}}@media(min-width:1000px){.shell{padding-top:35px}.call{padding-top:65px}}@media(max-width:560px){.shell{padding:22px 22px max(20px,env(safe-area-inset-bottom))}header{gap:12px}.wordmark span{display:none}#connection{font-size:10px}.call{padding-top:42px}.sound{width:175px;height:175px;margin-top:22px}button{padding:13px 17px;font-size:14px}.consent br{display:none}.utterance{grid-template-columns:42px 1fr;font-size:14px}.subtitle-header{gap:8px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Telegram safe areas, including iPhone notches and the Mini App header. */
.shell { padding-top: max(24px, env(safe-area-inset-top), var(--tg-content-safe-area-inset-top, 0px)); padding-bottom: max(24px, env(safe-area-inset-bottom), var(--tg-content-safe-area-inset-bottom, 0px)); }