/* Handeware Learn: worksheet pages and hubs (built by infra/learn/build.py). Nordic: light, one blue accent, system type. */
.lp{--ac:#2e66d1;--ac2:#2557b8;--tx:#121417;--mut:#565d66;--line:#e3e5e8;--soft:#eef3fc;max-width:1120px;margin:0 auto;padding:24px 20px 56px;font-size:18px;line-height:1.6;color:var(--tx)}
.lp>h1{font-size:clamp(30px,4.4vw,44px);line-height:1.1;margin:.25em 0 .35em;letter-spacing:-.01em}
.lp>h2{font-size:clamp(22px,2.6vw,26px);line-height:1.2;margin:1.7em 0 .55em}
.lp>h3{font-size:19px;margin:1.2em 0 .4em}
.lp>p a,.lp>ol a{color:var(--ac2)}
.lp .crumbs{font-size:15px;color:var(--mut);margin:0}.lp .crumbs a{color:inherit}
.lp .kick{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ac);font-weight:700;margin:1.1em 0 0}
.lp .lead{max-width:780px;margin:0 0 .6em;color:#2b3138}
.lp .mednote{font-size:16px;color:#7a2e12;background:#fdf3ec;border:1px solid #f1d2c0;border-radius:10px;padding:8px 12px;max-width:780px}
.lp .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 20px;border-radius:12px;background:var(--ac);color:#fff;font-weight:700;font-size:17px;text-decoration:none;border:0;cursor:pointer;font-family:inherit}
.lp .btn:hover{background:var(--ac2);color:#fff}
.lp .btn.alt{background:var(--soft);color:var(--ac2)}.lp .btn.alt:hover{background:#e0e9f9}
.lp .row{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
/* Print and Customize stay in reach: on a short screen the row rides the bottom edge until its own place scrolls into view */
.lp .row.act{position:sticky;bottom:0;z-index:4;margin:14px -8px;padding:10px 8px;background:var(--paper,#fff);border-radius:14px}
.lp :focus-visible{outline:3px solid var(--ac);outline-offset:2px}
/* the controls above the sheet: version and answer key */
.lp .opts{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;margin:4px 0 14px;font-size:16px}
.lp .vers{display:flex;gap:0;border:1px solid #c9ced6;border-radius:10px;overflow:hidden;background:#fff}
.lp .vers label{position:relative;display:flex;align-items:center;min-height:44px;padding:0 14px;cursor:pointer;border-left:1px solid #c9ced6;font-weight:600}
.lp .vers label:first-child{border-left:0}
.lp .vers input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.lp .vers label:has(input:checked){background:var(--ac);color:#fff}
.lp .vers label:has(input:focus-visible){outline:3px solid var(--tx);outline-offset:-3px}
.lp .chk{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;font-weight:600}
.lp .chk input{width:22px;height:22px;accent-color:var(--ac)}
/* the sheet, exactly as it prints. The page box (209.5 x 279 mm) fits both US Letter and A4 paper. */
.ws-pages.fit{--pw:209.5mm;--ph:279mm}
.sheetwrap{background:#f2f4f7;border:1px solid var(--line);border-radius:16px;padding:18px;overflow:hidden}
.sheetwrap .ws-pages{display:flex;flex-direction:column;align-items:center;gap:18px;margin:0 auto}
.sheetwrap .ws-page{box-shadow:0 1px 3px rgba(16,24,40,.08),0 8px 24px rgba(16,24,40,.10)}
.sheetwrap .ver{display:none}
.sheetwrap .ver[data-v=a]{display:block}
.vline{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;font-size:15px;color:var(--mut);margin:0 0 10px}
.vline a{font-weight:600}
body:has(#v-b:checked) .sheetwrap .ver[data-v=a],body:has(#v-c:checked) .sheetwrap .ver[data-v=a]{display:none}
body:has(#v-b:checked) .sheetwrap .ver[data-v=b],body:has(#v-c:checked) .sheetwrap .ver[data-v=c]{display:block}
body:has(#withkey:not(:checked)) .ws-page[data-kind=key]{display:none}
.keyhead{display:none}
/* how to use, related pages, games */
.lp ol.how{padding-left:1.3em;max-width:780px}.lp ol.how li{margin:0 0 6px}
.lcards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.lcards a{display:flex;flex-direction:column;gap:6px;height:100%;padding:10px;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:var(--tx);transition:border-color .15s,box-shadow .15s}
.lcards a:hover{border-color:#b9c6dd;box-shadow:0 6px 18px rgba(16,24,40,.10)}
.lcards .th{display:block;background:#f2f4f7;border-radius:8px;padding:8px}
.lcards img{display:block;width:100%;height:auto;aspect-ratio:240/320;object-fit:cover;object-position:top;box-shadow:0 1px 4px rgba(0,0,0,.16);background:#fff}
.lcards b{font-size:16px;line-height:1.25;color:var(--ac2)}
.lcards small{font-size:14px;color:var(--mut)}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-flex;align-items:center;min-height:42px;padding:0 15px;border-radius:999px;background:var(--soft);color:var(--ac2);font-size:16px;font-weight:600;text-decoration:none}
.chips a:hover{background:#e0e9f9}
.chips a[aria-current]{background:var(--ac);color:#fff}
.game{display:flex;align-items:center;gap:16px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,#f7f9fd,#fff);text-decoration:none;color:var(--tx);max-width:640px}
.game b{display:block;font-size:19px;color:var(--ac2)}.game span{display:block;font-size:16px;color:var(--mut)}
.game i{flex:none;width:46px;height:46px;border-radius:12px;background:var(--ac);display:grid;place-items:center}
.game i::after{content:"";border-left:14px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}
.subj{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.subj article{display:grid;grid-template-columns:96px 1fr;gap:16px;border:1px solid var(--line);border-radius:16px;padding:16px;background:#fff;align-items:start}
.subj article img{width:96px;height:auto;display:block;box-shadow:0 1px 6px rgba(0,0,0,.14);background:#fff}
.subj h3{margin:0 0 4px;font-size:21px}.subj h3 a{text-decoration:none}
.subj p{margin:0 0 8px;font-size:16px;color:#2b3138}
.subj .n{font-size:14px;color:var(--mut);margin:0}
.lp .faq summary{font-size:17px}
#shop-slot[hidden]{display:none}
@media(max-width:599px){.lp{padding:16px 16px 40px;font-size:17px}.sheetwrap{padding:8px;border-radius:12px}.sheetwrap .ws-pages{gap:10px}
.lp .row .btn{flex:1 1 100%}.lcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.lcards a{padding:8px}.lcards b{font-size:15px}
.subj{grid-template-columns:1fr}.subj article{grid-template-columns:72px 1fr;gap:12px;padding:12px}.subj article img{width:72px}}
.sheetwrap .ws-pages{zoom:.3}
@media(min-width:300px){.sheetwrap .ws-pages{zoom:0.315}}
@media(min-width:310px){.sheetwrap .ws-pages{zoom:0.328}}
@media(min-width:320px){.sheetwrap .ws-pages{zoom:0.34}}
@media(min-width:330px){.sheetwrap .ws-pages{zoom:0.353}}
@media(min-width:340px){.sheetwrap .ws-pages{zoom:0.366}}
@media(min-width:350px){.sheetwrap .ws-pages{zoom:0.378}}
@media(min-width:360px){.sheetwrap .ws-pages{zoom:0.391}}
@media(min-width:370px){.sheetwrap .ws-pages{zoom:0.404}}
@media(min-width:380px){.sheetwrap .ws-pages{zoom:0.416}}
@media(min-width:390px){.sheetwrap .ws-pages{zoom:0.429}}
@media(min-width:400px){.sheetwrap .ws-pages{zoom:0.441}}
@media(min-width:410px){.sheetwrap .ws-pages{zoom:0.454}}
@media(min-width:420px){.sheetwrap .ws-pages{zoom:0.467}}
@media(min-width:430px){.sheetwrap .ws-pages{zoom:0.479}}
@media(min-width:440px){.sheetwrap .ws-pages{zoom:0.492}}
@media(min-width:450px){.sheetwrap .ws-pages{zoom:0.505}}
@media(min-width:460px){.sheetwrap .ws-pages{zoom:0.517}}
@media(min-width:470px){.sheetwrap .ws-pages{zoom:0.53}}
@media(min-width:480px){.sheetwrap .ws-pages{zoom:0.542}}
@media(min-width:490px){.sheetwrap .ws-pages{zoom:0.555}}
@media(min-width:500px){.sheetwrap .ws-pages{zoom:0.568}}
@media(min-width:510px){.sheetwrap .ws-pages{zoom:0.58}}
@media(min-width:520px){.sheetwrap .ws-pages{zoom:0.593}}
@media(min-width:530px){.sheetwrap .ws-pages{zoom:0.606}}
@media(min-width:540px){.sheetwrap .ws-pages{zoom:0.618}}
@media(min-width:550px){.sheetwrap .ws-pages{zoom:0.631}}
@media(min-width:560px){.sheetwrap .ws-pages{zoom:0.643}}
@media(min-width:570px){.sheetwrap .ws-pages{zoom:0.656}}
@media(min-width:580px){.sheetwrap .ws-pages{zoom:0.669}}
@media(min-width:590px){.sheetwrap .ws-pages{zoom:0.681}}
@media(min-width:600px){.sheetwrap .ws-pages{zoom:0.638}}
@media(min-width:610px){.sheetwrap .ws-pages{zoom:0.651}}
@media(min-width:620px){.sheetwrap .ws-pages{zoom:0.664}}
@media(min-width:630px){.sheetwrap .ws-pages{zoom:0.676}}
@media(min-width:640px){.sheetwrap .ws-pages{zoom:0.689}}
@media(min-width:650px){.sheetwrap .ws-pages{zoom:0.702}}
@media(min-width:660px){.sheetwrap .ws-pages{zoom:0.714}}
@media(min-width:670px){.sheetwrap .ws-pages{zoom:0.727}}
@media(min-width:680px){.sheetwrap .ws-pages{zoom:0.739}}
@media(min-width:690px){.sheetwrap .ws-pages{zoom:0.752}}
@media(min-width:700px){.sheetwrap .ws-pages{zoom:0.765}}
@media(min-width:710px){.sheetwrap .ws-pages{zoom:0.777}}
@media(min-width:720px){.sheetwrap .ws-pages{zoom:0.79}}
@media(min-width:730px){.sheetwrap .ws-pages{zoom:0.803}}
@media(min-width:740px){.sheetwrap .ws-pages{zoom:0.815}}
@media(min-width:750px){.sheetwrap .ws-pages{zoom:0.828}}
@media(min-width:760px){.sheetwrap .ws-pages{zoom:0.84}}
@media(min-width:770px){.sheetwrap .ws-pages{zoom:0.853}}
@media(min-width:780px){.sheetwrap .ws-pages{zoom:0.866}}
@media(min-width:790px){.sheetwrap .ws-pages{zoom:0.878}}
@media(min-width:800px){.sheetwrap .ws-pages{zoom:0.891}}
@media(min-width:810px){.sheetwrap .ws-pages{zoom:0.904}}
@media(min-width:820px){.sheetwrap .ws-pages{zoom:0.916}}
@media(min-width:830px){.sheetwrap .ws-pages{zoom:0.929}}
@media(min-width:840px){.sheetwrap .ws-pages{zoom:0.941}}
@media(min-width:850px){.sheetwrap .ws-pages{zoom:0.954}}
@media(min-width:860px){.sheetwrap .ws-pages{zoom:0.967}}
@media(min-width:870px){.sheetwrap .ws-pages{zoom:0.979}}
@media(min-width:880px){.sheetwrap .ws-pages{zoom:0.992}}
@media(min-width:890px){.sheetwrap .ws-pages{zoom:1}}
@media print{
@page{size:auto;margin:0}
html,body{background:#fff!important;margin:0!important;padding:0!important}
body>:not(main),main>:not(.lp),.lp>:not(.sheetwrap),.sheetwrap>.ver>:not(.ws-pages){display:none!important}
.lp,.sheetwrap{display:block!important;padding:0!important;margin:0!important;max-width:none!important;border:0!important;background:none!important;border-radius:0!important;overflow:visible!important}
.sheetwrap .ws-pages{zoom:1!important;display:block!important;gap:0!important}
.sheetwrap .ws-page{box-shadow:none!important;margin:0 auto!important}
.sheetwrap .ws-page+.ws-page{break-before:page;page-break-before:always}
}
