:root{--primary: #3f51b5;--primary-dark: #303f9f;--primary-light: #c5cae9;--teal: #009688;--amber: #f9a825;--green: #43a047;--red: #e53935;--orange: #ff7043;--bg: #eef2f7;--surface: #ffffff;--surface-soft: #f7f9fc;--text: #1f2937;--muted: #64748b;--border: #d6dee9;--shadow-2: 0 2px 5px rgba(31, 41, 55, .12), 0 1px 2px rgba(31, 41, 55, .08);--shadow-4: 0 4px 12px rgba(31, 41, 55, .14), 0 2px 5px rgba(31, 41, 55, .1)}*{box-sizing:border-box}html{min-width:320px;background:var(--bg)}body{margin:0;min-width:320px;color:var(--text);background:var(--bg);font-family:Roboto,Noto Sans SC,PingFang SC,Microsoft YaHei,Arial,sans-serif;letter-spacing:0}button{font:inherit;letter-spacing:0}.app-shell{min-height:100vh}.top-app-bar{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 24px;color:#fff;background:var(--primary);box-shadow:var(--shadow-4)}.brand{display:flex;align-items:center;gap:12px;min-width:260px;font-size:18px;font-weight:500}.top-tabs{display:flex;align-self:stretch;gap:2px;overflow-x:auto}.top-tabs button{min-width:118px;border:0;border-bottom:3px solid transparent;color:#ffffffd1;background:transparent;font-size:14px;font-weight:600;cursor:pointer}.top-tabs button:hover,.top-tabs button.active{color:#fff;background:#ffffff1f}.top-tabs button.active{border-bottom-color:#ffeb3b}.page-shell{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:24px 0 36px}.lesson-hero{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:end;margin-bottom:16px}.lesson-title-block{min-width:0}.lesson-number{display:block;margin-bottom:8px;color:var(--accent);font-size:14px;font-weight:700}.lesson-title-block h1{margin:0;font-size:32px;font-weight:500;line-height:1.16}.lesson-title-block p{margin:10px 0 0;color:var(--muted);font-size:15px;line-height:1.6}.lesson-status{display:grid;gap:10px;padding:16px;border-radius:8px;background:var(--surface);box-shadow:var(--shadow-2)}.status-row{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:center;color:var(--accent);font-size:14px;font-weight:700}.status-row span{color:var(--text)}.linear-progress{height:5px;border-radius:99px;background:#e2e8f0;overflow:hidden}.linear-progress i{display:block;height:100%;border-radius:inherit;background:var(--accent)}.lesson-status small{color:var(--muted);font-size:12px;line-height:1.5}.lesson-nav-row{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:12px;align-items:center;margin-bottom:18px}.icon-button{display:inline-grid;width:42px;height:42px;place-items:center;border:0;border-radius:50%;color:var(--primary-dark);background:transparent;cursor:pointer}.icon-button.tonal{background:#fff;box-shadow:var(--shadow-2)}.icon-button:hover{background:#eef2ff}.section-position{display:flex;align-items:center;justify-content:center;gap:12px;min-height:42px;padding:8px 14px;border-radius:8px;background:var(--surface);box-shadow:var(--shadow-2);text-align:center}.section-position span{color:var(--accent);font-size:13px;font-weight:700;white-space:nowrap}.section-position strong{min-width:0;overflow:hidden;color:#334155;font-size:13px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.lesson-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.7fr);gap:18px;align-items:start}.md-card{min-width:0;border-radius:8px;background:var(--surface);box-shadow:var(--shadow-4)}.visual-card,.reason-card{padding:18px}.reason-card{position:sticky;top:74px}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.card-heading span{display:block;margin-bottom:5px;color:var(--accent);font-size:12px;font-weight:700}.card-heading h2{margin:0;font-size:20px;font-weight:500}.answer-summary{margin-top:18px;border-radius:8px;background:var(--surface);box-shadow:var(--shadow-4);overflow:hidden}.summary-title{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid var(--border)}.summary-title h2{margin:0;font-size:20px;font-weight:500}.summary-title span{color:var(--muted);font-size:13px}.summary-table{display:grid}.summary-row{display:grid;grid-template-columns:92px 1fr;gap:16px;padding:13px 18px;border-bottom:1px solid var(--border)}.summary-row:last-child{border-bottom:0}.summary-row strong{color:var(--primary-dark);font-size:14px}.summary-row span{color:#334155;font-size:14px;line-height:1.55}.diagram-shell{min-height:320px;border:1px solid var(--border);border-radius:8px;background:#fafafa;overflow:hidden}.set-shell,.graph-shell{display:grid;grid-template-rows:minmax(0,1fr) auto}.set-svg,.graph-svg{display:block;width:100%;height:auto}.svg-label{fill:#374151;font-size:16px;font-weight:500}.svg-label.muted{fill:#64748b;font-size:14px}.svg-label.emphasis{fill:#1f2937;font-weight:700}.svg-white{fill:#fff;font-size:16px;font-weight:700}.svg-dark{fill:#1f2937;font-size:16px;font-weight:700}.legend-row{display:flex;flex-wrap:wrap;gap:10px 16px;padding:10px 14px 14px;color:var(--muted);font-size:13px}.legend-row span{display:inline-flex;align-items:center;gap:6px}.legend-dot{width:10px;height:10px;border-radius:50%}.legend-dot.indigo{background:var(--primary)}.legend-dot.teal{background:var(--teal)}.legend-dot.amber{background:var(--amber)}.legend-dot.orange{background:var(--orange)}.wordle-shell,.function-shell{display:grid;gap:18px;align-content:center;padding:22px}.wordle-board{display:grid;grid-template-columns:repeat(5,minmax(58px,1fr));gap:10px}.wordle-tile{display:grid;min-height:82px;place-items:center;padding:8px;border-radius:6px;color:#fff;background:#607d8b;box-shadow:var(--shadow-2);text-align:center}.wordle-tile span{font-size:28px;font-weight:700}.wordle-tile small{color:#ffffffe0;font-size:11px;line-height:1.35}.wordle-tile.present,.wordle-tile.must{background:#c9b458}.wordle-tile.absent{background:#787c7e}.wordle-tile.triple{background:var(--primary)}.wordle-tile.single{background:var(--teal)}.wordle-tile.extra{background:var(--green)}.wordle-tile.blank{color:var(--muted);background:#eceff1}.formula-flow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.formula-step{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:8px 10px;border-radius:6px;background:#fff;box-shadow:var(--shadow-2);color:#263238;font-size:13px;font-weight:500}.step-index{display:inline-grid;width:22px;height:22px;flex:0 0 auto;place-items:center;border-radius:50%;color:#fff;background:var(--primary);font-size:12px}.flow-arrow{display:none}.mini-visual-grid{display:grid;grid-template-columns:1fr 126px;gap:14px}.slot-visual,.answer-badge{border-radius:8px;background:#fff;box-shadow:var(--shadow-2)}.slot-visual{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:14px}.slot{display:inline-grid;width:34px;height:34px;place-items:center;border:2px solid var(--primary-light);border-radius:4px;color:var(--primary-dark);font-weight:700}.slot.banned{border-color:var(--red);color:var(--red);background:#ffebee}.slot-visual p{flex-basis:100%;margin:2px 0 0;color:var(--muted);font-size:13px}.answer-badge{display:grid;place-items:center;padding:14px;text-align:center}.answer-badge span{color:var(--muted);font-size:12px;font-weight:700}.answer-badge strong{color:var(--primary-dark);font-size:24px}.graph-note{display:flex;gap:14px;align-items:center;padding:12px 16px 16px;border-top:1px solid var(--border);background:#fff}.graph-note strong{flex:0 0 auto;color:var(--green);font-size:16px}.graph-note span{color:var(--muted);font-size:14px;line-height:1.55}.interval-stage{position:relative;min-height:150px;padding-top:18px}.axis-line{position:absolute;right:4%;bottom:20px;left:4%;height:3px;border-radius:99px;background:#cbd5e1}.interval-bar{position:absolute;top:22px;display:grid;gap:4px;min-height:42px;padding:8px 10px;border-left:5px solid var(--bar-color);border-radius:5px;background:#fff;box-shadow:var(--shadow-2);opacity:.54;transition:opacity .16s ease,transform .16s ease}.interval-bar:nth-of-type(3){top:74px}.interval-bar:nth-of-type(4){top:126px}.interval-bar:nth-of-type(5){top:74px}.interval-bar.active{opacity:1;transform:translateY(-2px)}.interval-bar span{color:var(--text);font-size:13px;font-weight:700}.interval-bar small{color:var(--muted);font-size:12px}.mapping-stage{display:grid;grid-template-columns:108px minmax(120px,1fr) 108px;gap:12px;align-items:center}.set-bucket{display:grid;place-items:center;min-height:112px;border-radius:50%;color:#fff;box-shadow:var(--shadow-4)}.set-bucket span,.set-bucket small{font-size:12px;font-weight:700}.set-bucket strong{font-size:27px}.set-bucket.domain{background:var(--primary)}.set-bucket.codomain{background:var(--teal)}.mapping-svg{width:100%;min-height:112px}.function-rule{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-radius:8px;background:#fff;box-shadow:var(--shadow-2)}.function-rule span{color:var(--muted);font-weight:700}.function-rule strong{color:var(--primary-dark);font-size:22px}.statement-grid,.part-tabs,.graph-card-list,.function-table-control{display:grid;gap:8px;margin-top:14px}.statement-grid,.part-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}.graph-card-list{grid-template-columns:repeat(5,minmax(0,1fr))}.function-table-control{grid-template-columns:repeat(4,minmax(0,1fr))}.statement-button,.part-tabs button,.graph-card-list button,.function-table-control button{min-width:0;border:1px solid var(--border);border-radius:6px;color:var(--text);background:#fff;cursor:pointer;transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease}.statement-button:hover,.statement-button.active,.part-tabs button:hover,.part-tabs button.active,.graph-card-list button:hover,.graph-card-list button.active,.function-table-control button:hover,.function-table-control button.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent),#ffffff 93%);box-shadow:var(--shadow-2)}.statement-button{display:grid;grid-template-columns:26px 1fr 20px;gap:8px;align-items:center;min-height:44px;padding:8px 10px;text-align:left}.statement-button>span{display:inline-grid;width:24px;height:24px;place-items:center;border-radius:50%;color:#fff;background:var(--primary);font-size:12px;font-weight:700}.statement-button strong{min-width:0;overflow-wrap:anywhere;font-size:14px}.statement-button svg{color:var(--muted)}.statement-button:has(svg[data-lucide=check-circle-2]) svg{color:var(--green)}.statement-button:has(svg[data-lucide=x-circle]) svg{color:var(--red)}.part-tabs button,.function-table-control button{display:grid;gap:3px;min-height:54px;padding:9px 10px;text-align:left}.part-tabs strong,.function-table-control span{color:var(--muted);font-size:12px;font-weight:700}.part-tabs span,.function-table-control strong{color:var(--primary-dark);font-size:17px;font-weight:700;overflow-wrap:anywhere}.function-table-control small{color:var(--muted);font-size:11px;line-height:1.35}.graph-card-list button{display:grid;gap:5px;min-height:66px;padding:10px;text-align:left}.graph-card-list strong{font-size:12px;line-height:1.3}.graph-card-list span{color:var(--muted);font-size:11px;line-height:1.3}.mode-switch{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:16px;border:1px solid var(--primary-light);border-radius:6px;overflow:hidden}.mode-switch button{min-height:42px;border:0;border-right:1px solid var(--primary-light);color:var(--primary-dark);background:#fff;font-size:14px;font-weight:700;cursor:pointer}.mode-switch button:last-child{border-right:0}.mode-switch button.active{color:#fff;background:var(--primary)}.explanation-panel{display:grid;gap:14px}.answer-chip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-left:4px solid var(--accent);border-radius:4px;background:color-mix(in srgb,var(--accent),#ffffff 90%)}.answer-chip span{color:var(--muted);font-size:12px;font-weight:700}.answer-chip strong{color:var(--primary-dark);font-size:18px;overflow-wrap:anywhere;text-align:right}.explanation-panel h2{margin:0;font-size:22px;font-weight:500;line-height:1.3}.mode-copy{display:grid;gap:10px;padding:14px;border-radius:8px;background:var(--surface-soft)}.mode-copy p,.detail-block p,.section-answer p{margin:0;color:#334155;font-size:14px;line-height:1.72}.detail-block{display:grid;gap:12px}.truth-mark{display:inline-flex;width:fit-content;align-items:center;gap:8px;padding:8px 10px;border-radius:4px;font-size:14px;font-weight:700}.truth-mark.true{color:#1b5e20;background:#e8f5e9}.truth-mark.false{color:#b71c1c;background:#ffebee}.counter-line{padding:12px;border-left:4px solid var(--amber);border-radius:4px;background:#fff8e1}.formula-list{display:grid;gap:8px}.formula-list span{padding:9px 10px;border-radius:4px;background:#eef2ff;color:var(--primary-dark);font-size:13px;font-weight:700;line-height:1.45}.section-answer{display:grid;gap:6px;padding-top:12px;border-top:1px solid var(--border)}.section-answer span{color:var(--accent);font-size:12px;font-weight:700}@media(max-width:1080px){.page-shell{width:min(100% - 28px,920px)}.lesson-hero,.lesson-grid{grid-template-columns:1fr}.lesson-status,.reason-card{position:static}.graph-card-list{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:780px){.top-app-bar{align-items:flex-start;flex-direction:column;padding:8px 14px 0}.brand{min-width:0;min-height:40px}.top-tabs{width:100%;min-height:42px}.top-tabs button{min-width:124px}.page-shell{width:min(100% - 24px,640px);padding-top:18px}.lesson-title-block h1{font-size:26px}.lesson-nav-row{grid-template-columns:40px minmax(0,1fr) 40px;gap:8px}.statement-grid,.part-tabs,.graph-card-list,.function-table-control{grid-template-columns:repeat(2,minmax(0,1fr))}.wordle-board{grid-template-columns:repeat(5,minmax(42px,1fr))}.wordle-tile{min-height:68px}.wordle-tile span{font-size:22px}.formula-flow,.mini-visual-grid,.mapping-stage{grid-template-columns:1fr}.mapping-svg{display:none}.summary-title{align-items:flex-start;flex-direction:column}.summary-row{grid-template-columns:1fr;gap:6px}}@media(max-width:520px){.page-shell{width:min(100% - 20px,420px)}.visual-card,.reason-card{padding:14px}.statement-grid,.part-tabs,.graph-card-list,.function-table-control{grid-template-columns:1fr}.wordle-shell,.function-shell{padding:14px}.section-position{align-items:center;gap:2px;text-align:center}.section-position strong{display:none}.set-bucket{width:126px;max-width:126px;margin:0 auto}}