:root{--bg:#f5f7f3;--panel:#fff;--text:#263b34;--muted:#758279;--line:#e3e9e2;--accent:#28644e;--accent-hover:#194e3b;--soft:#eff5ee;--gold:#a98d51;--warn:#8a5d24;--shadow:0 5px 24px #263b3405;color-scheme:light;font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:18px;line-height:1.6}body.dark{--bg:#17221e;--panel:#202e27;--text:#e0e9df;--muted:#9bafa1;--line:#35443a;--accent:#a6ceb3;--accent-hover:#c0e5c9;--soft:#2b3c30;--gold:#c8b077;--warn:#e0b479;color-scheme:dark}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.43;cursor:not-allowed}button,a,input,select,textarea,summary{outline-offset:4px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent)}input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px;flex-shrink:0}button{transition:background .15s,color .15s,border-color .15s}a{color:var(--accent);text-underline-offset:3px}button{color:inherit}h1,h2,h3,p{margin:0}h2{font-size:18px;font-weight:600}.topbar{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;max-width:1280px;margin:auto;padding:0 32px}.brand{text-decoration:none;display:flex;align-items:center;gap:12px;flex:0 0 auto;max-width:100%;padding:8px 14px 8px 10px;background:#fff5e6;border-radius:3px;color:#0d0d0b}.brand-seal{display:block;width:52px;height:52px;flex:0 0 auto}.brand-text{display:flex;flex-direction:column;align-items:stretch;line-height:1}.brand-name{font-family:"STKaiti","KaiTi","Kaiti SC","AR PL UKai CN","Noto Serif CJK SC","Songti SC",serif;font-weight:900;font-size:38px;letter-spacing:.04em;white-space:nowrap}.brand-sub{font-family:Georgia,"Times New Roman",serif;font-size:11px;letter-spacing:.2em;margin-top:5px;white-space:nowrap}.top-actions{display:flex;gap:18px;align-items:center}.lang-switch{display:flex;gap:2px}.lang-switch button{background:transparent;border:0;padding:5px 10px;font-size:16px;color:var(--muted);border-radius:6px}.lang-switch .selected{background:var(--soft);color:var(--accent);font-weight:650}.icon-button{border:1px solid var(--line);background:transparent;border-radius:9px;width:35px;height:35px;font-size:22px;display:inline-grid;place-items:center}.icon-button:hover{background:var(--soft)}main{max-width:1216px;margin:auto;padding:0 28px}.intro{padding:46px 0 32px}.eyebrow{display:flex;gap:8px;align-items:center;font-size:16px;color:var(--accent);letter-spacing:2px;margin-bottom:12px}.dot{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%}h1{font-family:"Songti SC","Noto Serif CJK SC",Georgia,serif;font-size:46px;font-weight:600;letter-spacing:1px;line-height:1.3}.intro p{margin-top:14px;color:var(--muted);font-size:18px}.workspace{display:grid;grid-template-columns:1fr 1.1fr;gap:22px;align-items:stretch}.panel{border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:21px 24px}.section-label{display:flex;gap:10px;align-items:center;font-size:18px;font-weight:600}.step{font-size:16px;font-weight:500;color:var(--gold);font-variant-numeric:tabular-nums}.actions{display:flex;gap:14px}.text-button{border:0;background:none;padding:3px 0;font-size:16px;color:var(--accent)}.text-button:hover{text-decoration:underline;text-underline-offset:3px}.muted{color:var(--muted)}textarea{background:transparent;color:var(--text);border:0;resize:vertical}#input{display:block;width:100%;height:225px;min-height:160px;padding:8px 24px 16px;font-size:24px;line-height:1.9;resize:vertical;outline:none}#input::placeholder{font-size:20px;color:var(--muted);opacity:.58}.editor-panel{display:flex;flex-direction:column}.editor-bottom{display:flex;justify-content:space-between;padding:10px 24px 18px;margin-top:auto;color:var(--muted);font-size:16px}.local-indicator{display:flex;align-items:center;gap:6px}.local-indicator .dot{width:5px;height:5px;opacity:.65}.translate-row{display:flex;align-items:center;gap:12px;padding:15px 24px;border-top:1px solid var(--line)}.settings-link{margin-left:auto;color:var(--muted);font-size:16px}.primary,.secondary{border-radius:9px;padding:9px 15px;font-size:16px;border:1px solid var(--line);font-weight:550;white-space:nowrap}.primary{background:var(--accent);color:var(--panel);border-color:var(--accent)}.primary:hover{background:var(--accent-hover)}.secondary{background:var(--panel)}.secondary:hover{background:var(--soft);border-color:var(--accent)}.status:empty{display:none}.status{font-size:16px;color:var(--warn);padding:0 24px 12px}.small-badge{font-size:16px;color:var(--accent);background:var(--soft);border:1px solid var(--line);border-radius:5px;padding:3px 8px;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-panel{display:flex;flex-direction:column}.result-toolbar{padding:0 24px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}.segmented{display:flex;border-radius:8px;padding:3px;background:var(--bg)}.segmented button{font-size:16px;padding:5px 10px;border:0;background:none;color:var(--muted);border-radius:6px}.segmented .selected{background:var(--panel);color:var(--accent);box-shadow:0 1px 3px #0000000b}.compare-label{font-size:16px;display:flex;align-items:center;gap:4px;color:var(--muted)}.result-content{padding:22px 24px 10px;min-height:180px;max-height:500px;overflow:auto;flex:1;line-height:2.7;overflow-wrap:anywhere;white-space:pre-wrap}.empty{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.6;text-align:center;color:var(--muted)}.empty-glyph{font-family:serif;font-size:38px;color:var(--line);margin-bottom:10px}.empty p{font-size:18px}.empty small{margin-top:6px;opacity:.7;font-size:16px}.token{display:inline-flex;flex-direction:column;align-items:center;border:0;background:none;padding:4px 5px 2px;vertical-align:bottom;min-width:34px;line-height:1.5;border-radius:6px}.token:hover{background:var(--soft)}.token .phonetic{font-size:16px;color:var(--accent);font-family:"SFMono-Regular",Consolas,monospace;white-space:pre}.token .hanzi{font-size:30px;font-family:"Songti SC",serif}.token .comparison{font-size:16px;color:var(--muted);white-space:pre}.token.manual .hanzi{border-bottom:2px solid var(--gold)}.token.poly .hanzi{text-decoration:underline dotted var(--line);text-underline-offset:7px}.token.unmapped .phonetic{color:var(--warn)}.punct{font-family:serif;font-size:27px}.inline-mode .token{display:inline-block;font-size:20px}.inline-mode .token .hanzi{font-size:26px}.inline-mode .token .phonetic{margin-left:3px}.inline-mode .comparison{display:block}.phonetic-mode .token{min-width:0}.phonetic-mode .phonetic{font-size:19px}.result-bottom{display:flex;align-items:center;gap:10px;padding:16px 24px 10px;margin-top:auto;border-top:1px solid var(--line)}#copy{margin-left:auto}select,input:not([type=checkbox]),#custom-dict{border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--text);padding:7px 9px;font-size:16px}#rate{padding:7px 4px;border:0;color:var(--muted)}.voice-status{font-size:16px;color:var(--muted);padding:0 24px 14px;line-height:1.5}.notices{font-size:16px;color:var(--warn);padding:0 24px 12px;line-height:1.5}.notices:empty{display:none}.scheme-section{margin-top:24px}.scheme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 24px 20px}.scheme-card{text-align:left;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);position:relative;min-height:82px}.scheme-card:hover{background:var(--soft)}.scheme-card[aria-checked=true]{border-color:var(--accent);background:var(--soft);box-shadow:inset 0 0 0 .5px var(--accent)}.scheme-card[aria-checked=true]::after{content:'✓';position:absolute;right:11px;top:10px;color:var(--accent);font-size:16px}.scheme-card strong{display:block;font-size:16px;font-weight:550;margin-right:12px;line-height:1.5}.scheme-card small{display:block;color:var(--muted);font-size:16px;margin-top:6px;letter-spacing:.3px;font-family:Consolas,monospace}.scheme-card .new-tag{font-size:16px;color:var(--accent);margin-left:6px;background:var(--panel);padding:1px 4px;border-radius:3px}.scheme-note{padding:13px 24px;background:var(--bg);border-top:1px solid var(--line);font-size:16px;color:var(--muted)}.quiet{color:var(--muted);font-size:16px}.options-grid{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:22px;margin-top:24px}summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:19px 24px;font-size:16px;font-weight:600}summary::-webkit-details-marker{display:none}.chevron{font-weight:400;color:var(--muted)}details[open] .chevron{transform:rotate(180deg)}.details-body{padding:0 24px 22px}.check-row{display:flex;align-items:start;gap:9px}.check-row strong{font-size:16px;font-weight:500}.check-row small{display:block;color:var(--muted);font-size:16px;margin-top:3px}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin:19px 0}.check-grid label{font-size:16px;display:flex;align-items:center;gap:6px}.bracket-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:16px;color:var(--muted)}#custom-brackets input{width:45px;margin-right:4px}#reset-overrides{margin-top:10px}#custom-dict{display:block;width:100%;margin-top:12px;font-family:monospace;font-size:16px;resize:vertical}.hint{color:var(--muted);font-size:16px;line-height:1.8;margin:10px 0}#dict-status{padding:8px 0}.about{margin-top:22px}.about .details-body{font-size:16px;color:var(--muted)}.about p+p{margin-top:10px}footer{padding:30px 0 40px;display:flex;justify-content:space-between;gap:20px;font-size:16px;color:var(--muted)}footer b{color:var(--text)}.footer-dot{padding:0 10px}dialog{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:18px;padding:24px;width:min(460px,calc(100% - 32px));max-height:90vh;box-shadow:0 20px 90px #0003}dialog::backdrop{background:#172b2460;backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-head h3{font-size:20px}.dialog-head .icon-button{border:0}#picker-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}#picker-choices button{padding:13px;text-align:left;background:var(--bg);border:1px solid var(--line);border-radius:10px}#picker-choices button.selected{border-color:var(--accent)}#picker-choices small{display:block;color:var(--muted)}#api-form label{display:grid;gap:5px;margin:12px 0;font-size:16px}#api-form input,#api-form select{width:100%;padding:10px}#api-status{padding:8px 0}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,15px);background:var(--text);color:var(--panel);padding:10px 18px;border-radius:9px;font-size:16px;box-shadow:0 5px 20px #0002;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90vw}#toast.visible{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}@media(max-width:960px){.scheme-grid{grid-template-columns:repeat(3,1fr)}.workspace{grid-template-columns:1fr 1fr}.result-toolbar{align-items:start;flex-direction:column}.result-bottom{gap:6px;padding-left:16px;padding-right:16px}.primary,.secondary{padding:9px 12px}}@media(max-width:700px){.topbar{height:72px;padding:0 20px}.brand-seal{width:44px;height:44px}.brand-name{font-size:30px}.brand-sub{font-size:9.5px}.top-actions{gap:10px}main{padding:0 16px}.intro{padding:32px 4px 25px}h1{font-size:36px}.intro p{font-size:16px;line-height:1.8}.workspace,.options-grid{grid-template-columns:1fr;gap:16px}.panel-head{padding:19px 20px}#input{height:170px;padding:4px 20px 12px}.result-toolbar{flex-direction:row;padding:0 20px 10px}.result-content{min-height:160px;padding:18px 20px}.scheme-grid{grid-template-columns:repeat(2,1fr);padding:0 16px 16px;gap:8px}.scheme-card{padding:12px 10px;min-height:82px}.scheme-card strong{font-size:16px}.scheme-card small{font-size:16px}.scheme-section .quiet{font-size:16px}.scheme-section,.options-grid{margin-top:16px}.translate-row{padding:14px 20px}.details-body{padding:0 20px 20px}summary{padding:18px 20px}.scheme-note{padding:12px 20px}footer .quiet{display:none}.result-bottom{padding:14px 20px 10px}.result-content .token .hanzi{font-size:29px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.workspace>.panel,.options-grid>.panel,.scheme-card{min-width:0}@media(max-width:700px){.translate-row{flex-wrap:wrap}.result-toolbar{flex-wrap:wrap}.scheme-section .panel-head{flex-wrap:wrap}}

/* Keep the source and its Cantonese translation visible together. */
.editor-panel #input{height:142px;min-height:110px;font-size:22px;padding:8px 24px 14px}
.text-block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 24px;color:var(--muted);font-size:16px}
.text-block-head label{color:var(--text);font-size:16px;font-weight:600}
.editor-panel .translate-row{border-top:0;padding-top:0;padding-bottom:18px}
.translation-block{background:var(--soft);border-top:1px solid var(--line);padding-top:18px;flex:1}
.translation-badge{font-size:16px;color:var(--accent);border:1px solid var(--line);border-radius:5px;padding:2px 7px;background:var(--panel)}
#translation-text{display:block;width:100%;height:148px;min-height:100px;padding:10px 24px;font-size:22px;line-height:1.85;color:var(--accent);resize:vertical}
#translation-text::placeholder{font-size:16px;color:var(--muted);line-height:1.9}
.translation-hint{font-size:16px;line-height:1.7;color:var(--muted);padding:0 24px 18px}
.translation-hint.stale{color:var(--warn)}
.result-source{font-size:16px;color:var(--accent);padding:2px 24px 0}
@media(max-width:700px){.text-block-head{padding:0 20px}.editor-panel #input{padding-left:20px;padding-right:20px;height:126px}#translation-text{padding:10px 20px;height:132px}.translation-hint{padding:0 20px 16px}.result-source{padding:2px 20px 0}}

.service-status{padding:0 24px 12px;color:var(--muted);font-size:16px;line-height:1.6}.service-status:empty{display:none}

.voice-help{padding:0 24px 20px;font-size:16px;color:var(--muted)}.voice-help summary{cursor:pointer;padding:8px 0}.voice-help p{line-height:1.8}.top-actions{flex-wrap:wrap}#account-role{font-size:16px;overflow-wrap:anywhere}#api-settings[hidden],#register-link[hidden]{display:none}

/* Larger type remains readable without clipping at mobile widths. */
small{font-size:16px}.topbar{height:auto;min-height:96px;gap:20px;padding-top:18px;padding-bottom:18px;flex-wrap:wrap}.top-actions{gap:12px}.panel-head,.actions,.result-toolbar,.result-bottom,.translate-row{flex-wrap:wrap}.section-label{flex-shrink:0}.small-badge{max-width:100%;white-space:normal}.segmented{flex-wrap:wrap}.primary,.secondary{white-space:normal;min-height:44px}.icon-button{min-width:44px;min-height:44px}.scheme-card{overflow-wrap:anywhere}.scheme-card small{overflow-wrap:anywhere}.text-block-head{flex-wrap:wrap}.member-row{flex-wrap:wrap}.member-row p{min-width:0;flex:1 1 220px}#account-role{max-width:100%}footer{flex-wrap:wrap}
@media(max-width:960px){.workspace{grid-template-columns:1fr}.options-grid{grid-template-columns:1fr}.scheme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.topbar{padding:16px 20px;gap:12px}.top-actions{width:100%;gap:10px}.result-toolbar{align-items:flex-start;flex-direction:column}.check-grid{grid-template-columns:1fr}.scheme-card strong{margin-right:20px}}
@media(max-width:360px){.scheme-grid{grid-template-columns:1fr}.panel-head{gap:10px}.segmented button{padding:6px 8px}}

/* Learning modes share the established ink-green palette and type system. */
.mode-tabs{display:flex;gap:8px;padding-top:24px;border-bottom:1px solid var(--line)}
.mode-tabs [role=tab]{border:0;border-bottom:3px solid transparent;background:none;padding:10px 28px 13px;color:var(--muted);font-size:22px;font-family:"Songti SC","Noto Serif CJK SC",Georgia,serif;letter-spacing:2px}
.mode-tabs [aria-selected=true]{color:var(--accent);border-bottom-color:var(--accent);font-weight:650}
.mode-tabs [role=tab]:hover{background:var(--soft)}
/* 首页两个主标题不得大于选项卡文字（22px），宽窄屏一致 */
.intro h1{font-size:22px;line-height:1.5;letter-spacing:2px}.mode-panel[hidden],.call-panel [hidden]{display:none!important}
.practice-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:24px;align-items:stretch}
.call-time{font-family:"SFMono-Regular",Consolas,monospace;font-size:16px;color:var(--muted);font-variant-numeric:tabular-nums}
.call-center{text-align:center;padding:24px 24px 16px}.voice-orb{width:130px;height:130px;margin:4px auto 24px;border:1px solid var(--line);background:var(--soft);border-radius:50%;position:relative;display:grid;place-items:center;color:var(--accent)}
.voice-orb>span{font-family:"Songti SC","Noto Serif CJK SC",Georgia,serif;font-size:52px;line-height:1}.voice-orb>i{position:absolute;inset:-10px;border:1px solid var(--line);border-radius:50%;pointer-events:none}.voice-orb>i:nth-of-type(2){inset:-20px;opacity:.5}.voice-orb>i:nth-of-type(3){inset:-30px;opacity:.25}
.voice-orb[data-state=listening]>i,.voice-orb[data-state=speaking]>i{animation:voice-breathe 2.4s ease-in-out infinite}.voice-orb[data-state=speaking]{background:var(--accent);color:var(--panel)}.voice-orb[data-state=connecting]{animation:voice-breathe 1.5s ease-in-out infinite}
.call-state{font-size:20px;font-weight:600;margin-top:32px;color:var(--text)}.call-access{font-size:16px;line-height:1.7;color:var(--muted);margin-top:8px;min-height:28px}
.call-preferences{padding:8px 24px 20px}.call-preferences>label,.topic-label{display:block;font-size:16px;color:var(--muted);margin-bottom:8px}.call-preferences select{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text)}.topic-label{margin-top:18px}
.topic-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.topic-options button{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:16px;text-align:left;min-height:44px}.topic-options [aria-pressed=true]{color:var(--accent);background:var(--soft);border-color:var(--accent)}
.call-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:4px 24px 16px}.call-actions>.primary,.call-hangup{min-width:150px;padding:12px 20px}.call-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.call-hangup{border:1px solid #a13d3d;background:#a13d3d;color:#fff;border-radius:9px;font-size:16px;min-height:44px}.call-hangup:hover{background:#852d2d}
.call-error{color:var(--warn);font-size:16px;line-height:1.7;padding:0 24px 8px}.call-error:empty{display:none}.call-links{display:flex;justify-content:center;gap:24px;padding:0 24px 16px}.call-privacy{font-size:16px;line-height:1.7;color:var(--muted);padding:20px 24px;border-top:1px solid var(--line)}
.conversation-panel{display:flex;flex-direction:column;min-height:640px}.conversation-empty{flex:1;display:grid;place-content:center;text-align:center;padding:40px 28px;gap:16px;color:var(--muted)}.conversation-empty[hidden]{display:none}.conversation-empty>span{font-family:"Songti SC","Noto Serif CJK SC",Georgia,serif;font-size:64px;color:var(--line)}.conversation-empty>p{max-width:26ch;font-size:16px;line-height:1.8}
.conversation-messages{overflow:auto;max-height:600px;padding:0 24px 24px;scrollbar-color:var(--line) transparent;scroll-behavior:smooth}.conversation-messages:empty{display:none}.conversation-message{margin-top:16px;border:1px solid var(--line);padding:16px 18px;border-radius:12px;background:var(--soft);overflow-wrap:anywhere}.conversation-message.user{margin-left:40px;background:var(--panel)}.conversation-message.assistant{margin-right:24px}.conversation-speaker{font-size:16px;color:var(--accent);display:block;margin-bottom:6px}.conversation-message p{font-size:19px;line-height:1.8;white-space:pre-wrap}
.voice-admin{margin:24px 0}.voice-admin input[type=checkbox]{width:18px!important}.voice-admin .voice-enabled{display:flex;align-items:center;gap:10px}.voice-admin .hint{line-height:1.8}
@keyframes voice-breathe{0%,100%{transform:scale(1);opacity:.65}50%{transform:scale(1.045);opacity:1}}
@media(max-width:960px){.practice-grid{grid-template-columns:1fr}.conversation-panel{min-height:300px}}
@media(max-width:700px){.mode-tabs{padding-top:16px}.mode-tabs [role=tab]{flex:1;padding:10px 20px 12px}.call-preferences{padding-left:20px;padding-right:20px}.call-center{padding-left:20px;padding-right:20px}.conversation-message.user{margin-left:20px}.conversation-message.assistant{margin-right:12px}}
@media(prefers-reduced-motion:reduce){.voice-orb,.voice-orb>i{animation:none!important}.conversation-messages{scroll-behavior:auto}}