/* Jugami Digital Citizenship theme (v1) */
:root{--ink:#14284b;--ink2:#3a4a66;--paper:#f6f8fc;--card:#fff;--mint:#0a5f3d;--mint-l:#3ddc97;--coral:#d4553a;--sky:#1a4590;--line:#d5dcea;--radius:14px;
--sans:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--head-font:var(--sans)}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.6 var(--sans)}
a{color:var(--sky)}a:focus-visible,button:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.wrap{max-width:1040px;margin:0 auto;padding:0 18px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 12px;z-index:9}.skip:focus{left:8px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.site-head{background:var(--ink);color:#fff}
.bar{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;padding-top:10px;padding-bottom:10px}
.brand{display:flex;gap:10px;align-items:center;color:#fff;text-decoration:none;font-weight:700;font-size:19px}
.head-nav{display:flex;flex-wrap:wrap;gap:4px 14px}.head-nav a{color:#cfe0ff;text-decoration:none;font-size:16px;padding:6px 0}.head-nav a:hover{text-decoration:underline}
.crumbs ol{list-style:none;padding:0;margin:14px 0;display:flex;flex-wrap:wrap;gap:6px;font-size:15px}.crumbs li+li::before{content:"› ";color:var(--ink2)}
.hero{display:grid;gap:24px;align-items:center;margin:8px 0 28px}
@media(min-width:820px){.hero{grid-template-columns:1.25fr 1fr}}
.hero svg{width:100%;height:auto;border-radius:var(--radius)}
.kicker{text-transform:uppercase;letter-spacing:.08em;font-size:14px;color:var(--mint);font-weight:700;margin:0}
h1{font-size:clamp(32px,6vw,48px);line-height:1.1;margin:.2em 0}
h2{font-size:28px;margin:44px 0 10px;line-height:1.2}h3{font-size:21px;margin:22px 0 6px}
.tag{font-size:21px;color:var(--ink2);margin:0 0 12px}
.prose{max-width:68ch}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.btn{display:inline-block;background:var(--mint);color:#fff;border:0;border-radius:999px;padding:11px 20px;font:600 17px var(--sans);text-decoration:none;cursor:pointer;min-height:44px}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.toc{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));list-style:none;padding:0}
.toc a{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;text-decoration:none;color:var(--ink)}.toc b{display:block;color:var(--mint)}
.cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.card h3{margin-top:0}
.callout{background:#e8f8f0;border-left:6px solid var(--mint);border-radius:8px;padding:12px 16px;max-width:68ch}
.callout.warn{background:#fdeee9;border-color:var(--coral)}
.game-items{display:grid;gap:10px}
.item{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px}
.item p{margin:0 0 8px}.choice{margin:0 8px 6px 0;padding:8px 14px;border-radius:999px;border:2px solid var(--ink);background:#fff;font:600 16px var(--sans);cursor:pointer;min-height:44px}
.choice[aria-pressed="true"].ok{background:#d6f5e6;border-color:var(--mint)}.choice[aria-pressed="true"].no{background:#fbe0d9;border-color:var(--coral)}
.fb{font-size:16px;color:var(--ink2);margin:4px 0 0}
.q{margin:0 0 18px}.q fieldset{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fff}
.q legend{font-weight:700;padding:0 4px}.opts{display:grid;gap:6px;margin-top:6px}
.opt{text-align:left;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:#f9fbff;font:17px var(--sans);cursor:pointer;min-height:44px;color:var(--ink)}
.opt.right{background:#d6f5e6;border-color:var(--mint)}.opt.wrong{background:#fbe0d9;border-color:var(--coral)}
.score{font-weight:700;font-size:20px}
.pager{display:flex;flex-wrap:wrap;gap:10px 20px;justify-content:space-between;margin:44px 0 20px;padding-top:16px;border-top:1px solid var(--line)}
.site-foot{background:var(--ink);color:#dfe7f5;padding:24px 0;margin-top:30px;font-size:16px}.site-foot a{color:#9fd8ff}
.jugami-more{margin-top:10px}
@media screen{.print-only{display:none}}
