:root{color:#2b2926;--paper:#fffdf8;--ink-soft:#6f695f;--accent:#c67d00;--accent-soft:#fff0cb;--line:#e8dbc0;--field:#fff;background:linear-gradient(#f3efe6 0%,#f8f6f1 100%);font-family:Noto Sans SC,"Source Sans 3",sans-serif;line-height:1.45}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,textarea{font:inherit}button{cursor:pointer}textarea{resize:vertical}#root{min-height:100vh}.app-shell{width:min(920px,100vw - 18px);margin:0 auto;padding:12px 0 40px}.hero-panel{padding:12px 2px 10px}.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.16em;margin:0 0 6px;font-size:.72rem;font-weight:800}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Bricolage Grotesque,Noto Sans SC,sans-serif}h1{font-size:clamp(1.9rem,4vw,3.1rem)}h2{font-size:clamp(1.2rem,2.2vw,1.7rem)}h3{font-size:1rem}.subtitle,.page-summary,.unit-banner p,.block-note,.selection-bar span{color:var(--ink-soft)}.selection-bar{z-index:20;border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffdf8f2;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;margin:8px 0 14px;padding:10px 12px;display:flex;position:sticky;top:0}.selection-button,.speak-button{background:var(--accent-soft);color:#8b5900;border:1px solid #d6c49b;border-radius:999px;padding:6px 10px;font-weight:700}.selection-button:disabled{opacity:.45;cursor:default}.lesson-flow{gap:26px;display:grid}.page-section{gap:12px;display:grid}.page-header{border-bottom:1px solid var(--line);align-items:start;gap:12px;padding-bottom:10px;display:flex}.page-number,.page-chip{background:var(--accent-soft);min-width:44px;height:32px;color:var(--accent);border-radius:999px;justify-content:center;align-items:center;padding:0 10px;font-size:.82rem;font-weight:800;display:inline-flex}.page-flow{gap:12px;display:grid}.study-block,.unit-banner{background:0 0;border:0;padding:0}.study-block h3,.unit-banner h2{margin-bottom:6px}.study-block.is-core h3,.study-block.is-core p,.study-block.is-core li,.study-block.is-core dt{color:#1f1d1b}.study-block.is-support,.study-block.is-reference{color:var(--ink-soft)}.unit-banner{background:linear-gradient(#fff5d9,#0000);border-left:4px solid #ebc36f;padding:10px 12px}.study-block.is-hero{background:linear-gradient(#fff2cfa6,#0000);border-left:3px solid #ebc36f;padding:8px 12px}.study-block.is-dialogue .dialogue-line{background:#fff8e899}.study-block.is-reference .table-wrap,.study-block.is-table .table-wrap{background:#fffdf8}.study-block.is-note{border-left:2px solid #ead9b4;padding-left:12px}.page-heading{align-items:center;gap:10px;margin-bottom:4px;display:flex}.block-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.compact-list{gap:8px;margin:0;padding-left:18px;display:grid}.compact-list li{white-space:pre-wrap}.dialogue-list,.exercise-list,.match-grid,.passport-fields{gap:8px;display:grid}.dialogue-line,.exercise-row,.match-row,.passport-row{border-bottom:1px solid var(--line);gap:6px;padding:8px 0;display:grid}.dialogue-line{grid-template-columns:80px minmax(0,1fr)}.passport-fields{margin:0}.passport-row{grid-template-columns:120px minmax(0,1fr)}.passport-row dt{font-weight:700}.passport-row dd{margin:0}.field-with-audio,.sentence-line,.block-title-row,.title-tools{flex-wrap:wrap;align-items:center;gap:8px;display:inline-flex}.block-title-row{justify-content:space-between;width:100%}.sentence-stack{gap:4px;display:inline-grid}.table-wrap{border:1px solid var(--line);background:#fffdfa;border-radius:12px;margin-top:8px;overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:420px}th,td{text-align:left;vertical-align:top;border:1px solid #e4d8b9;padding:8px 10px}th{background:#fff2cf}.exercise-kind{text-transform:uppercase;color:var(--ink-soft);background:#f3eee2;border-radius:999px;padding:3px 8px;font-size:.72rem;font-weight:800}.is-fill,.is-response,.is-match,.is-listen{background:var(--accent-soft);color:#8b5900}input,textarea{background:var(--field);border:1px solid #dacaa5;border-radius:10px;width:100%;padding:8px 10px}.inline-input{vertical-align:middle;width:118px;margin:0 6px;display:inline-flex}.response-row textarea{min-height:70px}pre{white-space:pre-wrap;margin:0}@media (width<=720px){.app-shell{width:calc(100vw - 10px);padding-top:8px}.selection-bar{display:grid}.page-header,.page-heading,.dialogue-line,.passport-row,.block-title-row{grid-template-columns:1fr;align-items:start;display:grid}.lesson-flow{gap:20px}.block-columns{grid-template-columns:1fr;gap:10px;display:grid}.inline-input{width:100%;margin:6px 0 0;display:block}}
