:root{--em:#0b6b47;--em-d:#084f35;--co:#e8563f;--co-d:#c9412c;--ch:#22262b;--paper:#fbfaf5;--line:#d9d6cb;--mint:#e3f1ea;--blush:#fde6e1;--gray:#5b6168}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ch);font:16px/1.55 Inter,system-ui,Segoe UI,Arial,sans-serif}
h1,h2,h3,.disp{font-family:Anton,Impact,"Arial Narrow Bold",sans-serif;font-weight:400;letter-spacing:.01em;line-height:1.02;text-transform:uppercase;margin:0}
a{color:var(--em)}
button{font:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--co);outline-offset:2px}
.top{background:var(--em);color:#fff;display:flex;align-items:center;gap:16px;padding:10px 16px;position:sticky;top:0;z-index:20}
.brand{font-family:Anton,Impact,sans-serif;color:#fff;text-decoration:none;display:flex;gap:6px;align-items:baseline;font-size:20px;letter-spacing:.02em;white-space:nowrap}
.brand .b2{color:var(--ch);background:#fff;padding:0 5px}
.brand .b3{font-size:12px;opacity:.9}
nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
nav a{color:#fff;text-decoration:none;font-weight:600;font-size:14px;padding:8px 10px;border-radius:4px}
nav a:hover,nav a.on{background:var(--em-d)}
.menu{display:none;margin-left:auto;background:var(--co);color:#fff;border:0;font-family:Anton,Impact,sans-serif;padding:8px 12px;letter-spacing:.05em}
main{max-width:1000px;margin:0 auto;padding:20px 16px 60px;outline:0}
.foot{border-top:1px solid var(--line);padding:18px 16px 30px;text-align:center;color:var(--gray);font-size:14px}
.hero{background:var(--em);color:#fff;margin:-20px -16px 24px;padding:36px 20px 30px}
.hero h1{font-size:clamp(38px,8vw,76px)}
.hero p{max-width:620px;font-size:18px;margin:14px 0 20px}
.hero .row{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--co);color:#fff;border:0;text-decoration:none;font-family:Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.04em;font-size:18px;padding:12px 20px;border-radius:3px}
.btn:hover{background:var(--co-d)}
.btn.alt{background:#fff;color:var(--em)}
.btn.line{background:transparent;color:var(--em);border:2px solid var(--em)}
.btn.sm{font-size:15px;padding:8px 14px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.unit{margin:26px 0}
.unit-h{display:flex;align-items:baseline;gap:12px;border-bottom:3px solid var(--em);padding-bottom:6px;margin-bottom:12px;flex-wrap:wrap}
.unit-h .num{font-family:Anton,Impact,sans-serif;color:var(--co);font-size:44px;line-height:.9}
.unit-h h2{font-size:26px;color:var(--em)}
.unit-h a{margin-left:auto;font-weight:600;font-size:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.wk{display:block;background:#fff;border:1px solid var(--line);border-top:5px solid var(--em);padding:10px 12px 12px;text-decoration:none;color:var(--ch);min-height:118px;position:relative}
.wk:hover{border-color:var(--em);box-shadow:0 3px 0 var(--em)}
.wk.rev{border-top-color:var(--co)}
.wk small{font-family:Anton,Impact,sans-serif;color:var(--em);letter-spacing:.06em;font-size:13px}
.wk.rev small{color:var(--co)}
.wk b{display:block;font-size:14px;line-height:1.25;margin-top:4px;font-weight:600}
.wk .sc{position:absolute;right:8px;bottom:6px;font-family:Anton,Impact,sans-serif;font-size:15px;color:var(--gray)}
.wk .sc.full{color:var(--em)}
.card{background:#fff;border:1px solid var(--line);padding:18px 20px;margin:14px 0}
.card.mint{background:var(--mint);border-color:#b9dccb;border-left:6px solid var(--em)}
.card.blush{background:var(--blush);border-color:#f3c3ba;border-left:6px solid var(--co)}
.lead{font-family:Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--em);font-size:14px;margin-bottom:4px}
.blush .lead{color:var(--co-d)}
.crumb{font-size:14px;margin-bottom:10px;color:var(--gray)}
.page-h{font-size:clamp(30px,6vw,52px);color:var(--em);margin-bottom:6px}
.sub{color:var(--gray);margin:0 0 14px}
.bar{height:8px;background:var(--line);margin:10px 0 18px}
.bar i{display:block;height:100%;background:var(--co);transition:width .25s}
.stem{font-size:20px;line-height:1.5;margin:6px 0 16px}
.stem u{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--co);text-underline-offset:4px;font-weight:600}
.opts{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.opt{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;background:#fff;border:2px solid var(--line);padding:12px 14px;font-size:17px;color:var(--ch)}
.opt:hover:not(:disabled){border-color:var(--em)}
.opt .k{font-family:Anton,Impact,sans-serif;color:var(--em);min-width:18px}
.opt.sel{border-color:var(--em);background:var(--mint)}
.opt.right{border-color:var(--em);background:var(--mint)}
.opt.wrong{border-color:var(--co);background:var(--blush)}
.opt:disabled{cursor:default;color:var(--ch)}
.fb{margin-top:14px}
.big{font-family:Anton,Impact,sans-serif;font-size:clamp(56px,14vw,110px);line-height:.9;color:var(--em)}
.big.co{color:var(--co)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sp{margin-top:16px}
table{border-collapse:collapse;width:100%;background:#fff}
th{background:var(--em);color:#fff;text-align:left;font-family:Anton,Impact,sans-serif;font-weight:400;letter-spacing:.05em;text-transform:uppercase;padding:8px 10px;font-size:14px}
td{border-bottom:1px solid var(--line);padding:8px 10px;vertical-align:top}
tr:nth-child(even) td{background:#f6f4ec}
.tag{display:inline-block;font-family:Anton,Impact,sans-serif;font-size:13px;letter-spacing:.05em;padding:2px 8px;color:#fff;background:var(--em);text-transform:uppercase}
.tag.review{background:#b7791f}.tag.learn{background:var(--co)}
.flash{perspective:1200px;margin:12px auto;max-width:640px}
.flash-in{position:relative;min-height:300px;transition:transform .45s;transform-style:preserve-3d;cursor:pointer}
.flash.flip .flash-in{transform:rotateY(180deg)}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:2px solid var(--em);background:#fff;padding:22px;display:flex;flex-direction:column;justify-content:center;overflow:auto}
.face.back{transform:rotateY(180deg);background:var(--mint)}
.face h3{font-size:30px;color:var(--em);text-align:center}
.face .hint{text-align:center;color:var(--gray);font-size:14px;margin-top:14px}
.face p{margin:6px 0}
.face .model{font-style:italic;border-left:4px solid var(--co);padding-left:10px;margin-top:10px}
.game-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.game-list a{display:block;background:#fff;border:1px solid var(--line);border-top:6px solid var(--co);padding:16px;text-decoration:none;color:var(--ch)}
.game-list a:hover{box-shadow:0 3px 0 var(--co)}
.game-list h3{font-size:24px;color:var(--em);margin-bottom:6px}
.hud{display:flex;gap:18px;align-items:baseline;flex-wrap:wrap;font-family:Anton,Impact,sans-serif;text-transform:uppercase;letter-spacing:.05em;color:var(--gray)}
.hud b{font-weight:400;font-size:34px;color:var(--em)}
.hud .time b{color:var(--co)}
.sort{background:#fff;border:2px solid var(--ch);padding:26px 18px;font-size:22px;text-align:center;min-height:130px;display:flex;align-items:center;justify-content:center;margin:12px 0}
.sort .gap{display:inline-block;width:22px;height:26px;border:2px dashed var(--co);margin:0 4px;vertical-align:middle}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.two .btn{text-align:center;font-size:22px;padding:18px 8px}
.two .btn.no{background:var(--ch)}
.flashmsg{min-height:52px;margin-top:10px;font-weight:500}
.flashmsg.ok{color:var(--em)}.flashmsg.bad{color:var(--co-d)}
.passage{font-size:19px;line-height:2.1;background:#fff;border:1px solid var(--line);padding:18px 20px}
.passage span.w{padding:2px 1px;border-radius:2px;cursor:pointer}
.passage span.w:hover{background:#eee9d8}
.passage span.found{background:var(--mint);cursor:default}
.passage span.found s{color:var(--co-d)}
.passage span.found b{color:var(--em)}
.passage span.miss{animation:shake .3s;background:var(--blush)}
@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.notes{margin:12px 0 0;padding-left:20px}
.notes li{margin:4px 0}
.cta{background:var(--ch);color:#fff;padding:18px 20px;margin:26px 0 0;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.cta h3{font-size:24px}.cta p{margin:0;flex:1;min-width:220px}
.pill{display:inline-block;border:1px solid var(--line);background:#fff;padding:3px 10px;margin:2px 4px 2px 0;font-size:14px;text-decoration:none;color:var(--ch)}
.pill.on{background:var(--em);color:#fff;border-color:var(--em)}
.tiles,.answer{display:flex;flex-wrap:wrap;gap:8px}
.answer{min-height:64px;border:2px dashed var(--em);background:#fff;padding:10px;align-items:center}
.tile{background:#fff;border:2px solid var(--ch);padding:9px 13px;font-size:17px;color:var(--ch);font-weight:600}
.tile.cl{background:var(--mint);border-color:var(--em)}
.tile.on{box-shadow:0 3px 0 var(--co)}
.tile:hover{border-color:var(--co)}
table.lined td{border:1px solid #777;background:#fff!important}
.sheet{background:#fff;border:1px solid var(--line);padding:22px}
.cert{border:4px double var(--em);text-align:center;padding:26px}
@media (max-width:980px){.brand .b3{display:none}nav a{padding:8px 7px;font-size:13px}}
@media (max-width:760px){
 .menu{display:block}
 nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--em-d);flex-direction:column;padding:8px}
 nav.open{display:flex}
 nav a{font-size:17px;padding:12px}
 .brand .b3{display:none}
 .stem{font-size:18px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{body.certonly main>*:not(.cert){display:none!important}.sheet{border:0;padding:0}main{max-width:none;padding:0}th{-webkit-print-color-adjust:exact;print-color-adjust:exact}.top,.foot,.noprint,.btn{display:none!important}body{background:#fff}.card{break-inside:avoid}}
