:root{color:#17201d;background:#e7e2d8;font-family:Segoe UI,Noto Sans SC,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--paper: #f4f1ea;--paper-deep: #e9e4d9;--ink: #17201d;--muted: #6f766f;--line: rgba(23, 32, 29, .14);--source: #1f6f63;--source-soft: #dce9e4;--target: #b96332;--target-soft: #f3e3d6;--danger: #ad3f35}*{box-sizing:border-box}html{min-width:320px;background:#e7e2d8}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh}button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid rgba(31,111,99,.3);outline-offset:3px}.auth-shell{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 18px;padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));overflow-y:auto;background:radial-gradient(circle at 76% 12%,rgba(185,99,50,.11),transparent 28%),radial-gradient(circle at 22% 86%,rgba(31,111,99,.1),transparent 30%),#e7e2d8}.auth-card{width:min(100%,480px);padding:clamp(24px,5vw,42px);background:linear-gradient(180deg,rgba(255,255,255,.52),transparent 180px),var(--paper);border:1px solid rgba(23,32,29,.16);border-radius:20px;box-shadow:0 24px 70px #26272124}.auth-card__header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-bottom:28px;border-bottom:1px solid var(--line)}.auth-card__eyebrow,.auth-card__index{color:var(--muted);font-family:Consolas,monospace;font-size:10px;font-weight:700;letter-spacing:.12em}.auth-card__intro{padding:30px 0 26px}.auth-card__intro h1{margin:12px 0 10px;color:var(--ink);font-size:clamp(27px,7vw,36px);line-height:1.2;letter-spacing:-.035em;text-wrap:pretty}.auth-card__intro p{margin:0;color:var(--muted);font-size:14px;line-height:1.75;text-wrap:pretty}.login-form{display:grid;gap:16px}.login-form label{display:grid;gap:8px}.login-form label>span{color:var(--ink);font-size:12px;font-weight:700;letter-spacing:.04em}.login-form input{width:100%;min-height:52px;padding:0 14px;color:var(--ink);background:#ffffff8f;border:1px solid var(--line);border-radius:11px;font-size:16px;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}.login-form input:hover:not(:disabled){border-color:#1f6f6352}.login-form input:focus{border-color:#1f6f638c;background:#ffffffc7;box-shadow:0 0 0 4px #1f6f6314}.login-form input:disabled{cursor:wait;opacity:.64}.login-form__message{min-height:22px;margin-top:-3px;color:var(--danger);font-size:12px;line-height:1.6;text-wrap:pretty}.login-form button{min-height:54px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 18px;color:#f9f7f1;background:var(--ink);border:0;border-radius:12px;cursor:pointer;box-shadow:0 12px 28px #17201d2e;font-size:15px;font-weight:750;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}.login-form button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 16px 32px #17201d38}.login-form button:active:not(:disabled){transform:translateY(1px);box-shadow:0 8px 20px #17201d2b}.login-form button:disabled{cursor:wait;opacity:.68}.auth-card__footer{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start;margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}.auth-card__footer>span{height:1px;margin-top:9px;background:var(--source)}.auth-card__footer p{margin:0;color:var(--muted);font-size:11px;line-height:1.7;text-wrap:pretty}.auth-card--loading{min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.auth-card--loading .brand{margin-bottom:44px}.auth-card--loading>strong{margin-top:18px;font-size:15px}.auth-card--loading>p{margin:8px 0 0;color:var(--muted);font-size:12px}.auth-loader{width:28px;height:28px;border:2px solid rgba(31,111,99,.18);border-top-color:var(--source);border-radius:50%;animation:auth-spin .8s linear infinite}.app-shell{width:min(1440px,calc(100% - 32px));min-height:calc(100vh - 32px);margin:16px auto;padding:0 34px 22px;overflow:hidden;background:radial-gradient(circle at 88% 6%,rgba(185,99,50,.09),transparent 25%),linear-gradient(180deg,rgba(255,255,255,.46),transparent 180px),var(--paper);border:1px solid rgba(23,32,29,.16);border-radius:20px;box-shadow:0 24px 70px #2627211f}.topbar{min-height:82px;display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:12px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:13px;width:max-content;color:var(--ink);text-decoration:none}.brand__mark{width:39px;height:39px;display:flex;align-items:center;justify-content:center;gap:3px;border:1px solid var(--ink);border-radius:50%}.brand__mark i{display:block;width:3px;height:11px;background:var(--ink);border-radius:2px}.brand__mark i:nth-child(2){height:19px;background:var(--source)}.brand strong,.brand small{display:block}.brand strong{font-size:21px;letter-spacing:.08em}.brand small{margin-top:2px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.18em}.service-badge{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;letter-spacing:.04em}.service-badge>span{width:6px;height:6px;border-radius:50%;background:var(--target)}.service-badge.is-ready>span{background:var(--source)}.connection-state{justify-self:end;display:inline-flex;align-items:center;gap:9px;min-height:35px;padding:0 13px;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:12px;font-weight:700}.connection-state__dot{width:7px;height:7px;border-radius:50%;background:#9ba099}.connection-state--connecting .connection-state__dot{background:var(--target);animation:pulse 1.2s ease-in-out infinite}.connection-state--listening,.connection-state--translating,.connection-state--speaking{color:var(--source);border-color:#1f6f6340;background:#dce9e485}.connection-state--listening .connection-state__dot,.connection-state--translating .connection-state__dot,.connection-state--speaking .connection-state__dot{background:var(--source);box-shadow:0 0 0 5px #1f6f631c}.connection-state--translating .connection-state__dot,.connection-state--speaking .connection-state__dot,.connection-state--finishing .connection-state__dot{animation:pulse 1.2s ease-in-out infinite}.connection-state--error{color:var(--danger);border-color:#ad3f3540;background:#ad3f350f}.connection-state--error .connection-state__dot{background:var(--danger)}.logout-button{min-width:76px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px;color:var(--muted);background:#ffffff57;border:1px solid var(--line);border-radius:10px;cursor:pointer;font-size:12px;font-weight:700;transition:color .16s ease,border-color .16s ease,background .16s ease}.logout-button:hover:not(:disabled){color:var(--danger);border-color:#ad3f354d;background:#ad3f350d}.logout-button:active:not(:disabled){color:var(--danger);background:#ad3f3517}.logout-button:disabled{cursor:wait;opacity:.58}.control-strip{min-height:108px;display:grid;grid-template-columns:minmax(220px,1fr) 150px minmax(260px,1fr);align-items:center;gap:26px}.language-select{min-height:68px;display:flex;align-items:center;gap:14px;padding:11px 15px;background:#fff6;border:1px solid var(--line);border-radius:13px}.language-select__code{width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;font-size:12px;font-weight:800;letter-spacing:.1em}.language-select__eyebrow,.language-select__label{display:block}.language-select__eyebrow{margin-bottom:4px;color:var(--muted);font-size:11px}.language-select__label{font-size:15px;font-weight:720}.language-flow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;color:var(--muted)}.language-flow>span{height:1px;background:var(--line)}.language-flow b{font-size:10px;letter-spacing:.12em;white-space:nowrap}.language-flow button{min-height:44px;display:inline-flex;align-items:center;gap:7px;padding:0 12px;color:var(--muted);background:#ffffff59;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:color .16s ease,border-color .16s ease,transform .16s ease}.language-flow button:hover:not(:disabled){color:var(--source);border-color:#1f6f634d;transform:translateY(-1px)}.language-flow button:disabled{cursor:not-allowed;opacity:.5}.language-select{position:relative;cursor:pointer}.language-select--source .language-select__code{color:var(--source);background:var(--source-soft)}.language-select--target .language-select__code{color:var(--target);background:var(--target-soft)}.language-select__copy{min-width:0;flex:1}.language-select__label{display:flex;align-items:baseline;gap:8px}.language-select__label span{font-size:13px;font-weight:650}.language-select--source .language-select__label span{color:var(--source)}.language-select--target .language-select__label span{color:var(--target)}.language-select select{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}.language-select:has(select:disabled){cursor:not-allowed;opacity:.58}.error-banner{min-height:46px;display:flex;align-items:center;gap:10px;margin:-1px 0 14px;padding:10px 14px;color:var(--danger);background:#ad3f3512;border:1px solid rgba(173,63,53,.2);border-radius:11px;font-size:12px}.workspace{min-height:515px;display:grid;grid-template-columns:minmax(0,1fr) 50px minmax(0,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#ffffff4d}.transcript-panel{min-width:0;display:flex;flex-direction:column}.transcript-panel--source{background:linear-gradient(145deg,#dce9e47a,#ffffff2e)}.transcript-panel--translation{background:linear-gradient(215deg,#f3e3d68f,#ffffff2e)}.panel-heading{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;border-bottom:1px solid var(--line)}.panel-heading>div{display:flex;align-items:center;gap:11px}.panel-heading__index{color:var(--muted);font-family:Consolas,monospace;font-size:10px;letter-spacing:.12em}.panel-heading h2{margin:0;font-size:17px;letter-spacing:.025em}.panel-heading__meta{color:var(--muted);font-size:11px}.transcript-list{flex:1;display:flex;flex-direction:column;padding:12px 26px 22px;overflow-y:auto}.transcript-segment{position:relative;display:grid;grid-template-columns:max-content minmax(0,1fr);gap:16px;padding:22px 0;border-bottom:1px solid rgba(23,32,29,.09)}.transcript-list[dir=rtl] .transcript-segment{grid-template-columns:minmax(0,1fr) max-content}.transcript-list[dir=rtl] .transcript-segment time{grid-column:2;grid-row:1}.transcript-list[dir=rtl] .transcript-segment p{grid-column:1;grid-row:1}.transcript-segment time{padding-top:6px;color:var(--muted);font-family:Consolas,monospace;font-size:10px;font-variant-numeric:tabular-nums;letter-spacing:.05em;white-space:nowrap;direction:ltr;unicode-bidi:isolate}.transcript-segment p{min-width:0;margin:0;font-size:clamp(18px,1.5vw,23px);line-height:1.65;letter-spacing:.01em;overflow-wrap:anywhere;text-wrap:pretty}.transcript-segment.is-draft p{color:#17201db8}.draft-cursor{display:inline-block;width:2px;height:1em;margin-inline-start:5px;vertical-align:-.1em;background:currentColor;animation:pulse .85s ease-in-out infinite}.transcript-panel--translation .transcript-segment p{font-family:Segoe UI,Tahoma,Noto Sans Arabic,sans-serif}.transcript-segment.is-current:before{content:"";position:absolute;inset-block:20px;inset-inline-start:-26px;width:3px;background:var(--source)}.transcript-panel--translation .transcript-segment.is-current:before{background:var(--target)}.empty-transcript{width:min(340px,85%);margin:auto;padding:42px 22px;text-align:center;color:var(--muted)}.empty-transcript__line{position:relative;display:block;width:84px;height:1px;margin:0 auto 23px;background:var(--line)}.empty-transcript__line:after{content:"";position:absolute;top:-3px;left:calc(50% - 3px);width:7px;height:7px;border-radius:50%;background:var(--source)}.transcript-panel--translation .empty-transcript__line:after{background:var(--target)}.empty-transcript strong{display:block;margin-bottom:8px;color:var(--ink);font-size:16px}.empty-transcript p{margin:0;font-size:12px;line-height:1.7}.listening-line{margin-top:auto;padding-top:22px;display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px}.listening-line__dot{width:6px;height:6px;border-radius:50%;background:currentColor}.listening-line.is-live .listening-line__dot{animation:pulse 1.2s ease-in-out infinite}.workspace-divider{position:relative;display:grid;place-items:center;border-inline:1px solid var(--line);background:var(--paper-deep)}.workspace-divider span{width:28px;height:28px;display:grid;place-items:center;color:var(--target);background:var(--paper);border:1px solid var(--line);border-radius:50%;font-size:14px}.transport{min-height:118px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px;border-bottom:1px solid var(--line)}.transport__signal,.audio-toggle{display:flex;align-items:center;gap:13px}.transport small,.transport strong{display:block}.transport small{margin-bottom:3px;color:var(--muted);font-size:10px;letter-spacing:.04em}.transport strong{font-size:12px}.waveform{width:90px;height:44px;display:flex;align-items:center;justify-content:center;gap:3px}.waveform span{width:3px;height:5px;background:#a9ada7;border-radius:3px;transition:height .18s ease,background .18s ease}.waveform.is-active span{height:var(--bar-height);background:var(--source);animation:waveform .78s ease-in-out infinite alternate;animation-delay:var(--delay)}.session-button{min-width:234px;min-height:68px;display:flex;align-items:center;justify-content:center;gap:13px;padding:10px 22px;color:#f9f7f1;background:var(--ink);border:0;border-radius:14px;cursor:pointer;box-shadow:0 12px 28px #17201d2e;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.session-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 34px #17201d38}.session-button:disabled{cursor:wait}.session-button.is-running{background:var(--danger)}.session-button__icon{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:10px}.session-button strong{font-size:15px;text-align:left}.session-button small{color:#ffffffa6;text-align:left}.audio-toggle{justify-self:end;min-width:178px;min-height:58px;padding:9px 12px 9px 15px;border:1px solid var(--line);border-radius:12px;background:#ffffff59;cursor:pointer}.audio-toggle>span{flex:1;text-align:left}.audio-toggle>i{position:relative;width:34px;height:20px;background:#b4b6b1;border-radius:20px;transition:background .16s ease}.audio-toggle>i:after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .16s ease}.audio-toggle.is-enabled{color:var(--source);border-color:#1f6f633d}.audio-toggle.is-enabled>i{background:var(--source)}.audio-toggle.is-enabled>i:after{transform:translate(14px)}.status-footnote{min-height:43px;display:flex;align-items:end;justify-content:center;gap:9px;color:#858a83;font-size:10px;letter-spacing:.04em}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}@keyframes waveform{0%{height:7px}to{height:var(--bar-height)}}@keyframes auth-spin{to{transform:rotate(360deg)}}@media(max-width:980px){.app-shell{width:min(calc(100% - 20px),820px);padding:0 20px 18px}.topbar{grid-template-columns:1fr auto auto}.service-badge{display:none}.control-strip{grid-template-columns:1fr;gap:10px;padding:16px 0}.workspace{grid-template-columns:1fr}.workspace-divider{height:42px;border-inline:0;border-block:1px solid var(--line)}.workspace-divider span{transform:rotate(90deg)}.transcript-panel{min-height:390px}.transport{grid-template-columns:1fr 1fr;gap:14px;padding:18px 0}.transport__signal{display:none}.session-button,.audio-toggle{width:100%;min-width:0}}@media(max-width:620px){.app-shell{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;min-height:0;display:flex;flex-direction:column;margin:0;padding:0 10px 8px;padding:env(safe-area-inset-top) max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));overscroll-behavior:none;border:0;border-radius:0}.topbar{flex:0 0 56px;min-height:56px;gap:8px}.brand__mark{width:32px;height:32px}.brand{gap:9px}.brand strong{font-size:18px}.brand small{display:none}.connection-state{min-height:40px;padding:0 10px;font-size:11px}.logout-button{min-height:40px}.control-strip{flex:0 0 auto;min-height:0;grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);gap:6px;padding:6px 0}.language-select{min-width:0;min-height:48px;gap:6px;padding:5px 8px;border-radius:10px}.language-select__code,.language-select__label span{display:none}.language-select__eyebrow{margin-bottom:1px;font-size:9px}.language-select__label{display:block;font-size:13px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.language-select__copy{overflow:hidden}.language-select>svg{flex:0 0 auto;width:16px}.language-flow{display:block}.language-flow>span,.language-flow b{display:none}.language-flow button{width:44px;height:44px;min-height:44px;justify-content:center;padding:0}.error-banner{flex:0 0 auto;min-height:36px;margin:0 0 6px;padding:6px 10px;font-size:11px}.workspace{flex:1 1 auto;height:auto;min-height:0;grid-template-rows:minmax(0,1fr) 22px minmax(0,1fr);border-radius:12px}.workspace-divider{height:22px}.workspace-divider span{width:20px;height:20px;font-size:11px}.transcript-panel{min-height:0;overflow:hidden}.panel-heading{flex:0 0 38px;height:38px;padding:0 12px}.panel-heading__meta{display:none}.panel-heading>div{gap:8px}.panel-heading h2{font-size:14px}.transcript-list{min-height:0;padding:0 12px 6px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(23,32,29,.24) transparent}.transcript-segment{grid-template-columns:max-content minmax(0,1fr);gap:8px;padding:8px 0}.transcript-list[dir=rtl] .transcript-segment{grid-template-columns:minmax(0,1fr) max-content}.transcript-segment time{padding-top:3px;font-size:9px}.transcript-segment p{font-size:clamp(15px,4vw,18px);line-height:1.45}.transcript-segment.is-current:before{inset-block:8px;inset-inline-start:-12px}.empty-transcript{padding:14px 10px}.empty-transcript__line{margin-bottom:10px}.empty-transcript strong{margin-bottom:4px;font-size:14px}.empty-transcript p,.listening-line{font-size:11px}.listening-line{padding-top:8px}.transport{flex:0 0 auto;min-height:0;grid-template-columns:minmax(0,1fr) 118px;gap:8px;padding:8px 0 0;border-bottom:0}.session-button{min-height:52px;height:52px;padding:6px 12px;gap:8px;border-radius:12px}.session-button__icon{width:34px;height:34px;flex:0 0 auto}.session-button strong{font-size:14px}.session-button small,.audio-toggle small{display:none}.audio-toggle{min-height:52px;height:52px;gap:7px;padding:6px 8px}.audio-toggle strong{font-size:11px;white-space:nowrap}.audio-toggle>i{width:30px;height:18px}.audio-toggle>i:after{width:12px;height:12px}.audio-toggle.is-enabled>i:after{transform:translate(12px)}.status-footnote{display:none}}@media(max-width:420px){.auth-shell{padding:16px 12px;padding:max(16px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}.auth-card{padding:22px;border-radius:16px}.auth-card__header{padding-bottom:22px}.auth-card__intro{padding:25px 0 20px}.connection-state{width:38px;min-width:38px;padding:0;justify-content:center}.connection-state__label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.logout-button{width:44px;min-width:44px;padding:0}.logout-button>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}@media(max-width:350px){.brand small{display:none}}@media(max-height:650px){.auth-shell{align-items:flex-start}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
