@import url('./world.css');
@import url('./board.css');
@import url('./trivia.css');

@font-face{font-family:Alfa;src:url('/fonts/alfa-slab.woff2') format('woff2');font-display:swap}
@font-face{font-family:Slab;src:url('/fonts/roboto-slab.woff2') format('woff2');font-weight:400 800;font-display:swap}
:root{--ink:#35170f;--deep:#211510;--brick:#9e3827;--gold:#f1bf69;--paper:#ffedc4;--line:#ad7651;--hair:#d9ad73;--rust:#793522;--sans:system-ui,sans-serif;--slab:Slab,Georgia,serif;--display:Alfa,Georgia,serif;--pixel:polygon(0 9px,4px 9px,4px 4px,9px 4px,9px 0,calc(100% - 9px) 0,calc(100% - 9px) 4px,calc(100% - 4px) 4px,calc(100% - 4px) 9px,100% 9px,100% calc(100% - 9px),calc(100% - 4px) calc(100% - 9px),calc(100% - 4px) calc(100% - 4px),calc(100% - 9px) calc(100% - 4px),calc(100% - 9px) 100%,9px 100%,9px calc(100% - 4px),4px calc(100% - 4px),4px calc(100% - 9px),0 calc(100% - 9px))}
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light;min-width:320px;scroll-behavior:smooth}
body{margin:0;background:var(--paper) url('/art/paper.webp') repeat;color:var(--ink);font-family:var(--slab);font-size:16px;line-height:1.55}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #30543c;outline-offset:4px}
[hidden]{display:none!important}
.sr,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:12px;left:12px;z-index:20;background:var(--paper);padding:12px}
.pixel-icon{width:24px;height:24px;display:inline-block;vertical-align:middle;flex:none}
.content-width{width:min(1120px,calc(100% - 44px));margin-inline:auto}
.content-width h2,.content-width h3,.article h1{line-height:1.16}
.content-width h2,.article h1,dialog h2{font-family:var(--display);font-weight:400;letter-spacing:.01em}
.guide-section{padding:64px 0 44px}
.section-heading h2{margin:8px 0 14px;font-size:clamp(28px,5vw,44px)}
.section-heading p{max-width:42rem;margin:0}
.kicker{font-family:var(--sans);font-weight:800;font-size:14px;color:#75331f;text-transform:uppercase;letter-spacing:.14em}
.quick-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;list-style:none;padding:0;margin:30px 0 22px}
.quick-steps li{background:#ffe7b1a6;border:1px solid #ac7846;border-top:4px solid #8d4028;padding:22px}
.quick-steps h3{margin:6px 0;font-size:21px}
.quick-steps p{margin:0}
.step-number{font-family:ui-monospace,monospace;font-weight:800;color:#873820;font-size:17px}
.guide-links{display:flex;flex-wrap:wrap;gap:10px 28px}
.text-link{font-weight:800;text-decoration-thickness:1px;text-underline-offset:4px}
.text-link:hover{color:#8c3321}
.text-link .pixel-icon{width:18px;height:18px}
.questions{padding:0 0 58px}
.questions h2{font-size:30px;margin:0 0 16px}
details{border-bottom:1px solid #ab7949;padding:12px 0}
summary{cursor:pointer;font-weight:800}
details p{max-width:48rem;margin:8px 0 4px}
.site-footer{background:#301d16;color:#ffe3af;padding:25px 0;border-top:5px solid #a24d2f}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-inner nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.footer-inner a{font-size:14px;text-underline-offset:4px}
.footer-inner .brand b{font-size:22px}
.footer-inner .brand .brand-symbol{width:40px;height:40px}
.footer-inner .brand-caption{display:none}
.interior .site-header{background:#f7c46a;border-bottom:3px double #753322}
.article{max-width:820px;padding-top:48px;padding-bottom:64px}
.article h1{font-size:clamp(34px,6vw,56px);margin:10px 0 18px}
.article h2{font-size:26px;margin:34px 0 12px}
.article p,.article li{font-size:17px;max-width:46rem}
.article .lead{font-size:20px}
.article .primary{margin-top:16px;display:inline-flex}
.example{border:2px solid #a46b42;background:#ffdf99a8;padding:15px 21px;margin-block:22px}
.example p{margin:.4em 0}
@media(max-width:720px){.quick-steps{grid-template-columns:1fr;gap:10px}.guide-section{padding-top:40px}.footer-inner{align-items:flex-start}.article{padding-top:34px}.interior .site-header>.text-link{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;scroll-behavior:auto!important}}

