:root{color-scheme:light;--ink:#142238;--muted:#667085;--line:#dde4ee;--soft:#f4f7fb;--paper:#fff;--accent:#2e5cff;--accent-strong:#173ab7;--success:#176b4a;--danger:#a93a35;--warm:#fff8e8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{color:var(--ink);background:#edf2f8}body{background:linear-gradient(#f7f9fc 0,#edf2f8 100%);min-width:320px;margin:0}button,input,textarea{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.experience-shell{width:min(1180px,100% - 32px);margin:0 auto;padding:42px 0 64px}.experience-header{justify-content:space-between;align-items:flex-end;gap:28px;margin-bottom:18px;display:flex}.eyebrow{color:var(--accent-strong);letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px;font-size:.78rem;font-weight:800}h1{letter-spacing:-.045em;max-width:760px;margin:0;font-size:clamp(2rem,5vw,3.5rem);line-height:1.03}.chinese-title{color:var(--muted);margin:8px 0 0;font-size:1.2rem}.evidence-pill{border:1px solid var(--line);background:#ffffffd1;border-radius:14px;flex:none;gap:3px;padding:12px 15px;display:grid;box-shadow:0 8px 30px #1523370f}.evidence-pill span{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-size:.72rem}.evidence-pill strong{font-size:.95rem}.engineering-note{background:var(--warm);color:#6d561a;border:1px dashed #d0a84a;border-radius:12px;align-items:baseline;gap:10px;margin:18px 0;padding:12px 15px;font-size:.86rem;display:flex}.engineering-note strong{white-space:nowrap}.player-grid{grid-template-columns:250px minmax(0,1fr);align-items:start;gap:18px;display:grid}.stage-nav{gap:14px;display:grid;position:sticky;top:16px}.stage-tabs{border:1px solid var(--line);background:#ffffffe0;border-radius:18px;gap:7px;padding:9px;display:grid;box-shadow:0 14px 40px #1b2c4812}.stage-tab{cursor:pointer;text-align:left;color:#536177;background:0 0;border:0;border-radius:12px;grid-template-columns:34px 1fr;align-items:center;gap:9px;width:100%;padding:11px 10px;display:grid}.stage-tab:hover{background:#f3f6fb}.stage-tab.is-active{color:#173ab7;background:#eaf0ff;font-weight:750}.stage-index{background:#f0f3f8;border-radius:10px;place-items:center;width:30px;height:30px;font-size:.72rem;font-weight:800;display:grid}.is-active .stage-index{background:#d9e4ff}.boundary-note{border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px 15px}.boundary-note strong{text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}.boundary-note p{color:var(--muted);margin:7px 0 0;font-size:.82rem;line-height:1.5}.player-card{border:1px solid var(--line);background:var(--paper);border-radius:22px;min-height:650px;padding:clamp(20px,4vw,42px);box-shadow:0 18px 52px #1b2c4814}.stage-heading{max-width:720px;margin-bottom:28px}.stage-kicker{color:var(--accent-strong);letter-spacing:.09em;text-transform:uppercase;margin:0 0 7px;font-size:.78rem;font-weight:800}.stage-heading h2{letter-spacing:-.025em;margin:0;font-size:clamp(1.6rem,3vw,2.25rem)}.stage-heading p:not(.stage-kicker){color:var(--muted);margin:10px 0 0;line-height:1.65}.situation-card{border-left:4px solid var(--accent);background:var(--soft);border-radius:0 14px 14px 0;margin-bottom:22px;padding:17px 18px}.situation-card span{color:var(--accent-strong);text-transform:uppercase;letter-spacing:.06em;font-size:.75rem;font-weight:800}.situation-card p{margin:7px 0;line-height:1.55}.situation-card small{color:var(--muted)}.scaffold-toolbar{justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px 94px;display:flex}.scaffold-toolbar>span{color:var(--muted);letter-spacing:.03em;font-size:.78rem;font-weight:750}.scaffold-toggle-group{flex-wrap:wrap;gap:7px;display:flex}.scaffold-toggle{color:#536177;cursor:pointer;background:#fff;border:1px solid #cbd6e6;border-radius:9px;padding:7px 10px;font-size:.78rem;font-weight:750}.scaffold-toggle:hover{background:#f4f7fb}.scaffold-toggle[aria-pressed=true]{color:var(--accent-strong);background:#eaf0ff;border-color:#9eb3e8}.dialogue{gap:10px;display:grid}.dialogue-line{grid-template-columns:82px minmax(0,1fr);align-items:start;gap:12px;display:grid}.speaker{color:var(--muted);padding-top:14px;font-size:.88rem;font-weight:700}.utterance{border:1px solid var(--line);background:#fff;border-radius:14px;justify-content:space-between;align-items:center;gap:16px;min-width:0;padding:12px 14px 12px 17px;display:flex}.utterance-copy{gap:3px;min-width:0;display:grid}.dialogue-pinyin,.dialogue-chinese,.dialogue-english{overflow-wrap:anywhere;margin:0;line-height:1.5}.dialogue-pinyin{color:#536177;font-size:.84rem}.dialogue-chinese{font-size:clamp(1.12rem,2vw,1.32rem);font-weight:700}.dialogue-english{color:var(--muted);font-size:.84rem}.audio-button{color:#29486f;cursor:pointer;background:#f8faff;border:1px solid #cbd6e6;border-radius:10px;flex:none;padding:7px 10px;font-size:.78rem;font-weight:700}.audio-button:hover{background:#edf3ff}.learning-block+.learning-block{margin-top:30px}.learning-block h3{margin:0 0 13px;font-size:1rem}.pattern-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.pattern-card,.context-card,.question-card,.use-card{border:1px solid var(--line);background:#fff;border-radius:16px}.pattern-card{padding:17px}.pattern-card .pinyin{color:var(--muted);margin:0;font-size:.84rem}.pattern-chinese{margin:5px 0;font-size:1.22rem;font-weight:800}.pattern-card>p:not(.pinyin):not(.pattern-chinese){margin:5px 0}.pattern-card small,.context-card small{color:var(--muted);line-height:1.5}.token-list{flex-wrap:wrap;gap:8px;display:flex}.token{background:#f8fafc;border:1px solid #d6dfeb;border-radius:10px;align-items:baseline;gap:7px;padding:8px 10px;font-size:1.05rem;font-weight:700;display:inline-flex}.token small{color:var(--muted);font-size:.65rem;font-weight:700}.context-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.context-card{padding:14px}.context-card>div{align-items:baseline;gap:9px;display:flex}.context-card strong{font-size:1.1rem}.context-card span{color:var(--muted);font-size:.8rem}.context-card p{margin:7px 0}.grammar-list{gap:8px;display:grid}.grammar-list article{border-top:1px solid #e7ebf1;grid-template-columns:92px 1fr;gap:10px;padding:11px 0;display:grid}.grammar-list article:first-child{border-top:0}.grammar-list span{color:var(--accent-strong);font-size:.75rem;font-weight:800}.grammar-list p{margin:0;line-height:1.5}.question-stack,.use-stack{gap:14px;display:grid}.question-card,.use-card{background:#fbfcfe;padding:20px}.question-number,.use-card>span:first-child{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:.72rem;font-weight:800}.question-card h3,.use-card h3{margin:7px 0 14px;font-size:1.25rem}.choice-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.choice-grid button{cursor:pointer;background:#fff;border:1px solid #cfd8e4;border-radius:11px;padding:11px 12px;font-size:1rem}.choice-grid button:hover{border-color:#8ba4c7}.choice-grid button.is-selected{box-shadow:inset 0 0 0 2px #a9bfff}.choice-grid button.is-correct{color:var(--success);background:#edf8f2;border-color:#77af95}.choice-grid button.is-incorrect{color:var(--danger);background:#fff2f1;border-color:#d59a96}.feedback{background:#f0f4f9;border-radius:10px;margin:12px 0 0;padding:10px 12px;line-height:1.5}.frame{color:#173ab7;background:#edf2ff;border-radius:9px;margin:0 0 9px;padding:8px 11px;font-size:1.05rem;font-weight:700;display:inline-block}.use-card small{color:var(--muted);display:block}.record-actions{align-items:center;gap:11px;margin-top:15px;display:flex}.record-actions button{cursor:pointer;background:#fff;border:1px solid #b9c7d9;border-radius:10px;padding:9px 12px;font-weight:700}.record-actions span{color:var(--muted);font-size:.8rem}.use-card audio{width:100%;margin-top:12px}.completion-card{background:linear-gradient(135deg,#f7f9ff,#eef4ff);border:1px solid #cfdcf0;border-radius:18px;max-width:650px;padding:24px}.completion-card>span{color:var(--accent-strong);text-transform:uppercase;letter-spacing:.07em;font-size:.78rem;font-weight:800}.completion-card h3{margin:8px 0;font-size:1.5rem}.completion-card p{color:var(--muted);line-height:1.55}.primary-action{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:11px;margin-top:8px;padding:11px 15px;font-weight:800}.primary-action:not(:disabled):hover{background:var(--accent-strong)}.primary-action:disabled{cursor:default;opacity:.72}.completion-status{min-height:1.5em;font-size:.86rem}@media (width<=820px){.experience-shell{width:min(100% - 20px,720px);padding-top:24px}.experience-header{flex-direction:column;align-items:flex-start}.evidence-pill{width:100%}.engineering-note{flex-direction:column;align-items:flex-start}.player-grid{grid-template-columns:1fr}.stage-nav{position:static;overflow:hidden}.stage-tabs{scroll-snap-type:x proximity;grid-template-columns:repeat(5,minmax(112px,1fr));overflow-x:auto}.stage-tab{scroll-snap-align:start;grid-template-columns:1fr}.stage-index{width:26px;height:26px}.boundary-note{display:none}.player-card{border-radius:18px;min-height:0;padding:20px}.pattern-grid,.context-grid{grid-template-columns:1fr}}@media (width<=560px){h1{font-size:2rem}.scaffold-toolbar{flex-direction:column;align-items:flex-start;margin-left:0}.dialogue-line{grid-template-columns:1fr;gap:3px}.speaker{padding-top:0}.utterance{flex-direction:column;align-items:flex-start}.audio-button{align-self:flex-start}.choice-grid{grid-template-columns:1fr}.grammar-list article{grid-template-columns:1fr;gap:4px}.record-actions{flex-direction:column;align-items:flex-start}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}