:root { --ink:#18181b; --muted:#71717a; --line:#e4e4e7; --paper:#f8fafc; --card:#fff; --gold:#d6a84b; --soft:#f4f4f5; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
html, body { min-height:100%; margin:0; }
body { min-width:320px; background:var(--paper); }
button, a { font:inherit; }
.deck-shell { min-height:100vh; display:flex; flex-direction:column; }
.deck-topbar { height:58px; display:flex; align-items:center; justify-content:space-between; padding:0 34px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.9); backdrop-filter:blur(15px); }
.deck-brand { color:var(--ink); font-size:12px; font-weight:800; text-decoration:none; letter-spacing:-.02em; }
.deck-brand span { margin-left:7px; color:var(--muted); font-weight:550; }
.deck-meta { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:10px; }
.deck-meta span { padding:5px 8px; border:1px solid var(--line); border-radius:6px; color:var(--ink); background:var(--card); }
.deck-meta strong { font-weight:650; }
.deck { position:relative; width:min(1180px, calc(100% - 64px)); min-height:calc(100vh - 124px); margin:0 auto; flex:1; }
.slide { display:none; min-height:calc(100vh - 124px); padding:clamp(36px, 7vh, 82px) clamp(10px, 4vw, 60px); }
.slide.is-active { display:flex; flex-direction:column; animation:slideIn .25s ease-out; }
@keyframes slideIn { from { opacity:.3; transform:translateY(8px); } to { opacity:1; transform:none; } }
.slide-index { color:#a1a1aa; font-size:10px; font-weight:800; letter-spacing:.13em; }
.kicker { margin:0 0 13px; color:var(--muted); font-size:11px; font-weight:750; letter-spacing:.11em; text-transform:uppercase; }
.hero-copy { margin:auto 0 46px; }
h1, h2, h3, p { margin-top:0; }
h1 { max-width:800px; margin-bottom:20px; font-size:clamp(42px, 7vw, 86px); line-height:1.02; letter-spacing:-.06em; }
h2 { margin-bottom:0; font-size:clamp(30px, 4.5vw, 60px); line-height:1.04; letter-spacing:-.055em; }
.hero-copy > p:last-child { max-width:540px; margin:0; color:var(--muted); font-size:15px; line-height:1.7; }
.hero-stamp { align-self:flex-end; display:flex; flex-direction:column; align-items:flex-end; padding:15px 18px; border:1px solid #ead9ac; border-radius:10px; background:#fffbeb; }
.hero-stamp span { color:#8a641e; font-size:9px; font-weight:800; letter-spacing:.1em; }
.hero-stamp strong { margin-top:4px; font-size:34px; letter-spacing:-.04em; }
.hero-stamp small { color:var(--muted); font-size:9px; }
.slide-hint { margin-top:30px; color:#a1a1aa; font-size:10px; }
.slide-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin:23px 0 42px; }
.slide-heading > p { max-width:320px; margin:0 0 5px; color:var(--muted); font-size:11px; line-height:1.7; text-align:right; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:auto; }
.metric-grid article { min-height:150px; padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--card); }
.metric-grid article:first-child { color:#fff; border-color:var(--ink); background:var(--ink); }
.metric-grid span, .metric-grid small { display:block; font-size:10px; }
.metric-grid span { color:var(--muted); }
.metric-grid article:first-child span, .metric-grid article:first-child small { color:#a1a1aa; }
.metric-grid strong { display:block; margin:22px 0 7px; font-size:32px; letter-spacing:-.05em; }
.metric-grid small { color:var(--muted); }
.lesson-note { display:flex; gap:15px; margin-top:30px; padding:15px 17px; border-left:3px solid var(--ink); border-radius:0 8px 8px 0; background:var(--soft); color:var(--muted); font-size:11px; line-height:1.65; }
.lesson-note b { flex:0 0 auto; color:var(--ink); }
.lesson-note--gold { border-left-color:var(--gold); background:#fffbeb; }
.growth-chart { display:flex; align-items:flex-end; gap:4px; min-height:330px; padding:24px 4px 0; border-bottom:1px solid var(--line); }
.growth-column { display:flex; min-width:0; flex:1; flex-direction:column; align-items:center; justify-content:flex-end; height:300px; gap:7px; }
.growth-column__bar { width:100%; max-width:22px; min-height:2px; border-radius:3px 3px 0 0; background:#bfc0c5; }
.growth-column__label { color:var(--muted); font-size:8px; white-space:nowrap; transform:rotate(-45deg) translate(-8px, 3px); transform-origin:top right; }
.growth-column.is-latest .growth-column__bar { background:var(--gold); }
.growth-column.is-latest::after { content:"今日未完"; margin-top:5px; color:#8a641e; font-size:8px; font-weight:750; }
.legend { display:flex; gap:18px; margin-top:15px; color:var(--muted); font-size:9px; }
.legend span { display:flex; align-items:center; gap:6px; }
.legend i { display:inline-block; width:12px; height:5px; border-radius:3px; }
.legend-bar { background:#bfc0c5; }
.legend-line { height:2px!important; background:var(--ink); }
.legend-muted { color:#8a641e; }
.school-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:auto; }
.school-card { min-height:260px; padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--card); }
.school-card--active { border-color:var(--gold); background:#fffbeb; }
.school-card__name { display:flex; justify-content:space-between; gap:8px; font-size:13px; font-weight:750; }
.school-card__delta { color:#8a641e; }
.school-card__count { margin-top:25px; font-size:28px; font-weight:750; letter-spacing:-.04em; }
.school-card__meta, .school-card__pattern { color:var(--muted); font-size:9px; line-height:1.7; }
.school-card__pattern { margin-top:18px; color:var(--ink-2, #3f3f46); font-weight:650; }
.method-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:auto; }
.method-grid article { min-height:150px; padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--card); }
.method-grid b { color:#a1a1aa; font-size:10px; }
.method-grid h3 { margin:23px 0 8px; font-size:15px; }
.method-grid p { margin:0; color:var(--muted); font-size:10px; line-height:1.7; }
.dashboard-link { display:inline-flex; align-self:flex-start; align-items:center; gap:12px; margin-top:26px; padding-bottom:3px; border-bottom:1px solid var(--ink); color:var(--ink); font-size:11px; font-weight:750; text-decoration:none; }
.dashboard-link span { font-size:16px; }
.slide--end { background:var(--ink); color:#fff; }
.slide--end .slide-index, .slide--end .kicker { color:#a1a1aa; }
.slide--end h2 { margin-top:auto; }
.takeaway-list { width:min(520px, 100%); margin:45px 0 auto; }
.takeaway-list p { display:flex; gap:28px; margin:0; padding:15px 0; border-bottom:1px solid #3f3f46; font-size:12px; }
.takeaway-list b { flex:0 0 50px; color:#fff; }
.takeaway-list span { color:#a1a1aa; }
.dashboard-link--dark { color:#fff; border-color:#fff; }
.deck-controls { height:66px; display:flex; align-items:center; justify-content:center; gap:13px; border-top:1px solid var(--line); background:var(--card); }
.deck-controls button { width:31px; height:31px; border:1px solid var(--line); border-radius:50%; color:var(--ink); background:var(--card); cursor:pointer; }
.deck-controls button:hover { background:var(--soft); }
.slide-dots { display:flex; gap:6px; }
.slide-dot { width:22px; height:3px; border:0; border-radius:5px; background:#d4d4d8; cursor:pointer; }
.slide-dot.is-active { background:var(--ink); }
.deck-controls > span { margin-left:6px; color:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }
@media (max-width:700px) {
  .deck-topbar { padding:0 16px; }
  .deck-brand span { display:none; }
  .deck-meta { gap:6px; font-size:9px; }
  .deck { width:100%; }
  .slide { min-height:calc(100vh - 124px); padding:30px 20px; }
  h1 { font-size:clamp(38px, 12vw, 62px); }
  h2 { font-size:clamp(28px, 9vw, 44px); }
  .slide-heading { align-items:flex-start; flex-direction:column; gap:15px; margin-bottom:26px; }
  .slide-heading > p { text-align:left; }
  .metric-grid { grid-template-columns:repeat(2,1fr); margin-top:35px; }
  .metric-grid article { min-height:125px; padding:13px; }
  .metric-grid strong { margin-top:16px; font-size:26px; }
  .growth-chart { min-height:270px; }
  .growth-column { height:240px; }
  .growth-column__label { font-size:7px; }
  .school-cards, .method-grid { grid-template-columns:1fr; margin-top:20px; }
  .school-card { min-height:0; padding:15px; }
  .method-grid article { min-height:0; }
  .hero-copy { margin-bottom:35px; }
  .hero-stamp { align-self:flex-start; }
}
