:root{--ink:#141414;--soft:#6b6b6b;--line:#e6e6e6;--accent:#9e2b25;--paper:#fff;--wash:#faf8f6}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;padding:24px 20px 70px;max-width:720px;margin:0 auto;line-height:1.6}
a{color:var(--accent)}
.brand{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent);font-weight:700}
.stats{display:flex;gap:10px;margin:14px 0 24px;flex-wrap:wrap}
.stat{border:1px solid var(--line);border-radius:12px;padding:10px 14px;min-width:92px}
.stat .n{font-size:24px;font-weight:800;font-family:Georgia,serif}
.stat .l{font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--soft);font-weight:700}
h1{font-family:Georgia,serif;font-size:29px;line-height:1.2;margin:6px 0 12px}
.kicker{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent);font-weight:700}
.lesson-card{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:0 0 12px}
.lesson-card:active{background:var(--wash)}
.lesson-card .d{font-size:12.5px;color:var(--soft)}
.lesson-card .t{font-size:18px;font-weight:700;font-family:Georgia,serif;margin-top:2px}
.lesson-card .a{font-size:12px;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.nav{display:flex;justify-content:space-between;align-items:center;margin:0 0 18px}
.nav a{font-size:14px;text-decoration:none;font-weight:600}
.hint{font-size:13px;color:var(--soft);border-left:3px solid var(--accent);padding:2px 0 2px 12px;margin:0 0 22px}
article p{font-family:Georgia,serif;font-size:18.5px;line-height:1.78;margin:0 0 18px}
.w{border-bottom:1.5px solid rgba(158,43,37,.45);cursor:pointer;font-weight:600}
.w:active{background:#f6ecec}
.ted{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;padding:14px 16px;margin:8px 0 30px;background:var(--wash)}
.ted b{display:block;font-size:15px;margin-bottom:4px} .ted span{font-size:13px;color:var(--soft)}
h2{font-family:Georgia,serif;font-size:21px;margin:34px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--line)}
ol.vocab{list-style:none;counter-reset:v;padding:0;margin:0}
ol.vocab li{counter-increment:v;padding:14px 0 14px 40px;border-bottom:1px solid var(--line);position:relative}
ol.vocab li::before{content:counter(v);position:absolute;left:0;top:15px;font-size:13px;font-weight:700;color:var(--accent);width:26px}
.vtop{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vw{font-weight:700;font-size:17px} .vr{color:var(--accent);font-weight:600;font-size:14.5px}
.vd{color:var(--soft);font-size:15px;margin-top:3px} .vua{font-size:15.5px;margin-top:1px}
.vex{font-style:italic;font-size:15px;opacity:.8;margin-top:4px}
.say{border:1px solid var(--line);background:#fff;border-radius:16px;font-size:12px;padding:3px 10px;cursor:pointer;color:var(--accent)}
.say:active{background:var(--accent);color:#fff}
ol.q{padding-left:20px} ol.q li{margin:0 0 12px;line-height:1.6}
footer{margin-top:36px;font-size:12.5px;color:var(--soft);text-align:center;border-top:1px solid var(--line);padding-top:16px}
.warm{border:1px solid var(--line);border-radius:12px;padding:18px;background:var(--wash);margin:0 0 22px}
.warm h3{margin:0 0 4px;font-family:Georgia,serif;font-size:19px}
.warm .sub{font-size:13px;color:var(--soft);margin-bottom:12px}
.twist{font-family:Georgia,serif;font-size:18px;font-weight:600;line-height:1.6}
.twf{display:block;font-size:12.5px;color:var(--accent);margin:8px 0 14px}
.gobtn{display:block;text-align:center;background:var(--accent);color:#fff;font-weight:700;border-radius:24px;padding:13px;cursor:pointer;font-size:15px;text-decoration:none}
.gobtn:active{opacity:.85}
.gatechk{position:absolute;opacity:0;pointer-events:none}
.locked{display:none} .gatechk:checked ~ .locked{display:block}
.gatechk:checked ~ .warm .gobtn{display:none}
.gatechk:checked ~ .warm .done{display:block}
.done{display:none;text-align:center;color:var(--soft);font-size:13px}
.tg{position:absolute;opacity:0;pointer-events:none}
.ov{display:none;position:fixed;inset:0;background:rgba(10,10,10,.38);z-index:40}
.sheet{display:none;position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:560px;background:#fff;border-radius:18px 18px 0 0;z-index:41;padding:24px 22px 30px;box-shadow:0 -10px 40px rgba(0,0,0,.18)}
.tg:checked + .ov{display:block} .tg:checked + .ov + .sheet{display:block}
.x{position:absolute;top:12px;right:16px;font-size:28px;color:var(--soft);cursor:pointer;line-height:1}
.sw{font-size:24px;font-weight:800;padding-right:30px}
.sr{color:var(--accent);font-weight:700;font-size:17px;margin-top:2px;display:flex;align-items:center;gap:10px}
.slab{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--soft);font-weight:700;margin:16px 0 2px}
.sd{font-size:16px} .sua{font-size:18px;font-weight:600} .se{font-size:16px;font-style:italic;opacity:.85}
.wb input{width:100%;padding:11px 14px;border:1px solid var(--line);border-radius:10px;font-size:16px;margin:0 0 16px}
.wb .day{font-size:11px;color:var(--soft)}