:root{--paper:#F8F7F2;--paper-deep:#ECEBE3;--ink:#1D2A33;--ink-soft:#4E5D68;--seal:#C8322B;--seal-dark:#A92820;--seal-soft:#F8E4E2;--grid:#E3EAE5;--azure:#3F6C8C;--azure-soft:#E7EFF3;--jade:#2F6F5E;--jade-soft:#E6EFEA;--gold:#B8862C;--gold-soft:#F5EBD8;--plum:#7C5A8A;--plum-soft:#EDE6F0;--clay:#B4633A;--clay-soft:#F5E5DA;--teal:#3A7A82;--teal-soft:#E3EEF0;--indigo:#4A5A8C;--indigo-soft:#E7E9F2;--rose:#9C4F63;--rose-soft:#F1E1E5;--slate:#52677A;--slate-soft:#E2E9ED;--moss:#6E7A45;--moss-soft:#EAEDDD;--amber:#C99A3E;--amber-soft:#F6EEDA;--maroon:#8B3A42;--maroon-soft:#F0DEE0;--switch-on:#3C8C5C;--switch-off:#B4433A;--card-bg:#FFFFFF;--shadow: 0 1px 2px rgba(34,38,43,.07), 0 4px 10px rgba(34,38,43,.07);--radius: 10px}*{box-sizing:border-box}body{margin:0;min-height:100vh;background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:28px 28px;font-family:Be Vietnam Pro,IBM Plex Sans,sans-serif;color:var(--ink)}.app-shell{max-width:860px;margin:0 auto;padding:12px 24px 60px}.brand{display:flex;align-items:center;gap:8px;margin:0 0 4px}.brand[hidden]{display:none}.brand>div{min-width:0}.brand-seal{--brand-accent: var(--seal);width:24px;height:24px;flex-shrink:0;background:var(--brand-accent);color:#fff;font-family:"Noto Serif SC",serif;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;border-radius:4px 8px 4px 7px;transform:rotate(-4deg);box-shadow:0 2px 6px color-mix(in srgb,var(--brand-accent) 35%,transparent),inset 0 0 0 1.5px #ffffff38}.brand h1{font-family:Be Vietnam Pro,IBM Plex Sans,sans-serif;font-weight:700;font-size:.98rem;margin:0;letter-spacing:.2px}.brand p{margin:0;font-size:.74rem;line-height:1.3;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:70ch}footer{margin:46px 0 6px;text-align:center;font-size:.78rem;color:var(--ink-soft)}.stats-row{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 6px}.stats-row[hidden]{display:none}.stat-tile{display:flex;flex-direction:column;gap:2px;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px 18px;min-width:132px}.stat-value{font-family:"Noto Serif SC",serif;font-weight:700;font-size:1.5rem;color:var(--ink);line-height:1.1}.stat-label{font-size:.78rem;color:var(--ink-soft)}.credit{margin-top:22px;padding-top:20px;border-top:1px solid #E4DDCB;display:flex;align-items:flex-start;gap:14px}.credit-seal{width:34px;height:34px;flex-shrink:0;background:var(--seal);color:#fff;font-family:"Noto Serif SC",serif;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;border-radius:4px 8px 5px 7px;transform:rotate(-4deg);box-shadow:0 2px 6px #a5342a4d}.credit-text p{margin:0 0 5px;font-size:.8rem;line-height:1.65;color:var(--ink-soft)}.credit-text p:last-child{margin-bottom:0}.credit-author{font-size:.85rem!important;color:var(--ink)}.credit-text strong{color:var(--ink);font-weight:600}.credit-contact strong{color:var(--seal)}.credit-text a{color:var(--seal);text-decoration:underline;text-decoration-color:#a5342a66}.credit-text a:hover{text-decoration-color:var(--seal)}.phrase-segment{border-radius:4px;padding:1px 4px;font-weight:400}.card-line-chinese .phrase-segment,.demo-line-chinese .phrase-segment{font-weight:600}.phrase-segment-0{background:var(--seal-soft);color:var(--seal)}.phrase-segment-1{background:var(--azure-soft);color:var(--azure)}.phrase-segment-2{background:var(--jade-soft);color:var(--jade)}.phrase-segment-3{background:var(--gold-soft);color:var(--gold)}.phrase-segment-4{background:var(--plum-soft);color:var(--plum)}.phrase-segment-5{background:var(--clay-soft);color:var(--clay)}.card-line-chinese .phrase-segment,.demo-line-chinese .phrase-segment{position:relative;padding-left:7px}.card-line-chinese .phrase-segment:before,.demo-line-chinese .phrase-segment:before{content:"";position:absolute;top:4px;left:2px;width:0;height:0;border-top:2px solid transparent;border-bottom:2px solid transparent;border-left:3px solid currentColor;opacity:0;transition:all .15s}.card-line-chinese .phrase-segment:hover:before,.demo-line-chinese .phrase-segment:hover:before{opacity:.3}.phrase-segment--audible{cursor:pointer}.card-line-chinese .phrase-segment--audible:before,.demo-line-chinese .phrase-segment--audible:before{border-top-width:3px;border-bottom-width:3px;border-left-width:5px}.phrase-segment--audible:hover{filter:brightness(.94)}.card-line-chinese .phrase-segment--audible:hover:before,.demo-line-chinese .phrase-segment--audible:hover:before{opacity:1;transform:scale(1.35)}.card-lines{position:relative;display:flex;flex-direction:column;gap:22px;max-width:min(680px,90vw);overflow-x:auto;padding:3px 3px 2px}.card-line{display:flex;align-items:baseline;gap:7px}.card-line[hidden]{display:none}.segment-links{position:absolute;top:0;left:0;pointer-events:none;overflow:visible}.segment-link{fill:none;stroke-width:1.5;opacity:.5}.segment-link-0{stroke:var(--seal)}.segment-link-1{stroke:var(--azure)}.segment-link-2{stroke:var(--jade)}.segment-link-3{stroke:var(--gold)}.segment-link-4{stroke:var(--plum)}.segment-link-5{stroke:var(--clay)}.phrase-segment[data-group]{transition:box-shadow .12s;cursor:default}.phrase-segment--hover-match{box-shadow:0 0 0 2px currentColor}.segment-links.has-hover .segment-link{opacity:.1}.segment-links .segment-link.is-hover-active{opacity:1;stroke-width:2.5}@media (max-width:600px){.app-shell{padding:12px 16px 50px}}.card-line-chinese .phrase-segment--locked:before{cursor:pointer}.card-line-chinese .phrase-segment--locked:hover:before{opacity:.85;border-top-width:3px;border-bottom-width:3px;border-left-width:5px}.site-nav-lock{font-size:.68em;font-weight:600;opacity:.8;margin-left:2px;white-space:nowrap}.sd-notice-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:16px;background:#22262b8c}.sd-notice-card{width:100%;max-width:420px;padding:22px 22px 18px;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);border-top:4px solid var(--seal)}.sd-notice-title{margin:0 0 10px;font-size:1.1rem;color:var(--ink)}.sd-notice-text{margin:0 0 8px;font-size:.9rem;line-height:1.5;color:var(--ink-soft)}.sd-notice-actions{display:flex;gap:10px;margin-top:16px;justify-content:flex-end;flex-wrap:wrap}.sd-notice-btn{display:inline-block;padding:8px 16px;border-radius:20px;border:1.5px solid var(--seal);background:var(--seal);color:#fff;font-weight:600;font-size:.85rem;cursor:pointer;text-decoration:none}.sd-notice-btn:hover{background:var(--seal-dark);border-color:var(--seal-dark)}.sd-notice-btn--ghost{background:transparent;color:var(--ink-soft);border-color:var(--paper-deep)}.sd-notice-btn--ghost:hover{background:var(--paper-deep);border-color:var(--paper-deep)}