/* 国試過去問バンク. 画面案 ~/tasks/kakomon-redesign-20261011/board/gen_board.py の CSS を本番用に移したもの。
   区切りは余白と背景色の差。縁線で囲った箱は作らない（線は表の行・見出しの上だけ）。
   書体2つ（見出し --hd / 本文 --bd）、文字サイズは --f0〜--f6 の7段だけ（gen/check.py が確かめる）。 */
:root{--paper:#f2ecdf;--paper2:#e6dec9;--paper3:#faf7f0;--ink:#1e1c18;--ink2:#55504a;--ink3:#8c857a;--rule:#cfc5ae;--shu:#cf3f22;
--f0:12px;--f1:14px;--f2:16px;--f3:19px;--f4:24px;--f5:32px;--f6:46px;
--hd:'Zen Kaku Gothic New',sans-serif;--bd:'BIZ UDPGothic',sans-serif;color-scheme:light}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:var(--bd);font-size:var(--f2);line-height:1.8}
a{color:inherit}
h1,h2,h3,.h4{font-family:var(--hd);line-height:1.4}
:where(h1,h2,h3,p){margin:0}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.w{max-width:1200px;margin:0 auto;padding:0 40px}
.hdr{border-bottom:2px solid var(--ink)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--hd);font-weight:900;font-size:var(--f3);white-space:nowrap}
.logo-m{width:78px;height:17px}
.nav{display:flex;gap:24px;font-size:var(--f1);white-space:nowrap}
.nav a{text-decoration:none;padding:4px 0}
.nav a[aria-current]{border-bottom:2px solid var(--ink)}
.crumbs{font-size:var(--f0);color:var(--ink2);padding-top:18px;padding-bottom:6px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.crumbs li+li::before{content:"／";margin:0 4px}
.crumbs a{color:var(--ink2)}
.ring{fill:var(--paper3);stroke:var(--ink);stroke-width:1.2}
.ring.faint{stroke:var(--ink3);stroke-width:1}
.shu{fill:var(--shu)}
.ink,.inkf{fill:var(--ink)}.ink2{fill:var(--ink2)}.ink3{fill:var(--ink3)}.p2{fill:var(--paper2)}
.fig{display:block;width:100%;height:auto}
.sheet.c1{display:none}
.fig text{font-family:var(--bd);fill:var(--ink)}
.fig .t12{font-size:12px}.fig .t14{font-size:14px}.fig .b{font-weight:700}.fig .sub{fill:var(--ink2)}
.fig .mid{text-anchor:middle}.fig .on{fill:var(--paper3);font-weight:700}
.h2{font-size:var(--f4);font-weight:900;margin-bottom:20px}
.h3{font-size:var(--f3);font-weight:700;margin:28px 0 10px}
.h4{font-size:var(--f2);font-weight:700;margin:28px 0 8px}
.p{margin:0 0 14px;max-width:46em}
.sec{padding-top:64px;padding-bottom:64px}
.band{background:var(--paper2)}
.lead2{color:var(--ink2);font-size:var(--f1);margin:-8px 0 28px}
.note{font-size:var(--f0);color:var(--ink2);margin-top:8px}
.ul{margin:0;padding-left:1.2em}.ul li{margin-bottom:8px;max-width:46em}
/* FV */
.fv{padding:56px 0 72px}
.fv-in{display:grid;grid-template-columns:14px minmax(0,1.15fr) minmax(0,.85fr);gap:40px;align-items:start}
.tm{align-self:stretch;background:repeating-linear-gradient(to bottom,var(--ink) 0 8px,transparent 8px 30px);width:14px}
.eyebrow{font-size:var(--f1);color:var(--ink2);margin-bottom:18px}
.fv h1{font-size:var(--f6);font-weight:900;letter-spacing:.01em;margin-bottom:22px}
.fv-lead{font-size:var(--f3);line-height:1.75;margin-bottom:30px;max-width:30em}
.srch{display:flex;max-width:640px}
.srch input{flex:1;min-width:0;height:58px;border:0;border-bottom:2px solid var(--ink);background:var(--paper3);padding:0 18px;font:inherit;font-size:var(--f3);color:var(--ink);border-radius:0}
.srch button{border:0;background:var(--ink);color:var(--paper3);font:inherit;font-weight:700;font-size:var(--f2);padding:0 26px;cursor:pointer}
.srch.sm input{height:50px;font-size:var(--f2)}
.srch-n{font-size:var(--f0);color:var(--ink2);margin:8px 0 26px}
.acts{display:flex;flex-wrap:wrap;gap:12px}
.b-ink,.b-p2{display:inline-block;text-decoration:none;font-weight:700;padding:14px 24px}
.b-ink{background:var(--ink);color:var(--paper3)}
.b-p2{background:var(--paper2)}
.fv-r{margin:0;background:var(--paper3);padding:22px 22px 16px}
figcaption{font-size:var(--f0);color:var(--ink2);margin-top:8px}
/* exams */
.exs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px}
.ex{border-top:3px solid var(--ink);padding-top:16px}
.ex h3{font-size:var(--f3);font-weight:900}
.ex h3 a{text-decoration:none}
.ex-n{font-size:var(--f1);margin:6px 0 2px}.ex-n b{font-family:var(--hd);font-size:var(--f4);margin-right:2px}
.ex-w{font-size:var(--f0);color:var(--ink2);margin-bottom:14px;min-height:3.6em}
.ex figure{margin:0}
.ex-r{font-size:var(--f1);margin-top:12px;display:flex;flex-wrap:wrap;gap:4px 14px}
.dfs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px}
.df{margin:0}.df h3{font-size:var(--f3);font-weight:900;margin-bottom:10px}
.df-h{font-size:var(--f0);color:var(--ink2);margin:12px 0 6px}
.honest .ul{font-size:var(--f2)}
/* titles */
.ttl{padding-top:20px;padding-bottom:32px}
.ttl h1{font-size:var(--f5);font-weight:900}
.sub{font-size:var(--f1);color:var(--ink2);margin-top:6px}
.stats{display:flex;flex-wrap:wrap;gap:16px 48px;margin:24px 0 28px}
.stats dt{font-size:var(--f0);color:var(--ink2)}
.stats dd{margin:0;font-family:var(--hd);font-weight:700;font-size:var(--f4)}
.stats .srcref{display:block;font-family:var(--bd);font-weight:400;font-size:var(--f0);color:var(--ink2)}
.warn{font-size:var(--f1);margin-top:14px;background:var(--paper3);padding:10px 16px;max-width:46em}
/* matrix */
.mx-r{display:grid;grid-template-columns:150px 1fr 1fr 180px;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule)}
.mx-n b{font-family:var(--hd);font-size:var(--f4);margin-right:10px}.mx-n span{font-size:var(--f1);color:var(--ink2)}
.mx-n a{text-decoration:none}
.mx-h{display:flex;align-items:baseline;gap:10px;text-decoration:none;background:var(--paper3);padding:10px 18px}
.mx-h span{font-size:var(--f1);color:var(--ink2);white-space:nowrap}.mx-h b{font-family:var(--hd);font-size:var(--f4)}
.mx-h::after{content:'→';margin-left:auto}
.mx-x{font-size:var(--f1);color:var(--ink2)}
.kbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kb-e{display:flex;flex-direction:column;text-decoration:none;background:var(--paper3);padding:18px 22px}
.kb-e b{font-family:var(--hd);font-size:var(--f4)}.kb-e span{font-size:var(--f1);color:var(--ink2)}
.kb-e .kb-c{font-family:var(--hd);font-size:var(--f3);color:var(--ink);margin-top:6px}
.kb-fig{margin:24px 0 0;max-width:600px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
.two figure{margin:0}.two h3{font-size:var(--f3);margin-bottom:14px}
.app{font-size:var(--f1);color:var(--ink2);margin-top:20px}
.app a{margin-left:10px}
/* list */
.tabs{display:flex;gap:28px;margin-top:22px;font-family:var(--hd);font-weight:700;font-size:var(--f3)}
.tabs a{text-decoration:none;padding-bottom:4px}.tabs a[aria-current]{border-bottom:3px solid var(--ink)}
.tabs .first{margin-left:auto;font-size:var(--f2);background:var(--ink);color:var(--paper3);padding:8px 18px}
.tools{background:var(--paper2);position:sticky;top:0;z-index:2}
.tools-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:0;background:var(--paper3);font:inherit;font-size:var(--f1);padding:6px 14px;cursor:pointer;color:var(--ink)}
.chip.on{background:var(--ink);color:var(--paper3)}
.tg{display:flex;align-items:center;gap:8px;border:0;background:transparent;font:inherit;font-size:var(--f1);font-weight:700;cursor:pointer;color:var(--ink)}
.tl{font-size:var(--f1);font-weight:700}
.ql{list-style:none;margin:0;padding:8px 0 24px}
.qr{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:20px;align-items:center;padding:14px 0;border-bottom:1px solid var(--rule)}
.qn{font-family:var(--hd);font-weight:900;font-size:var(--f4);text-decoration:none;text-align:right}
.qm{font-size:var(--f0);color:var(--ink2);display:flex;flex-wrap:wrap;gap:4px 10px}
.kb{background:var(--paper2);padding:0 8px;color:var(--ink)}
.hx{color:var(--ink2)}
.qs{text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.qs:hover{text-decoration:underline}
.qr.miss{color:var(--ink3);font-size:var(--f1);padding:8px 0;grid-template-columns:64px 1fr}
.qr.miss .qn{font-size:var(--f2);color:var(--ink3)}
.yr{font-family:var(--hd);font-size:var(--f3);font-weight:900;padding-top:28px}
.bbs{display:inline-flex;gap:6px}
.bb{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1.2px solid var(--ink);background:var(--paper3);font-style:normal;font-size:var(--f0);font-weight:700;line-height:1;flex:none}
.show .bb.c,.tg .bb.c{background:var(--shu);border-color:var(--shu);color:var(--paper3)}
.tg[aria-pressed="false"] .bb.c{background:var(--paper3);border-color:var(--ink);color:var(--ink)}
.cred{font-size:var(--f0);color:var(--ink2);padding:20px 0 48px;max-width:60em;overflow-wrap:anywhere}
.cred-s{font-size:var(--f0);color:var(--ink2);margin:10px 0 24px;overflow-wrap:anywhere}
.pager ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:8px 0 0;font-family:var(--hd);font-weight:700}
.pager a,.pager span{display:inline-block;padding:6px 14px;background:var(--paper3);text-decoration:none}
.pager span{background:var(--ink);color:var(--paper3)}
/* question */
.qw{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:64px;padding-top:20px;padding-bottom:40px}
.qmeta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:var(--f1);color:var(--ink2);margin-bottom:14px}
.qmeta b{font-family:var(--hd);color:var(--ink);font-size:var(--f3)}
.case{background:var(--paper3);padding:14px 20px;margin-bottom:18px;font-size:var(--f2)}
.case-h{font-size:var(--f0);color:var(--ink2);font-weight:700}
.stem{font-family:var(--bd);font-size:var(--f4);font-weight:700;line-height:1.7}
.opts{list-style:none;margin:0;padding:0}
.opt{display:flex;align-items:center;gap:18px;width:100%;text-align:left;border:0;background:var(--paper3);font:inherit;font-size:var(--f3);color:var(--ink);padding:14px 20px;margin-bottom:8px;cursor:pointer}
.opt:hover{background:#fffdf8}
.bb.lg{width:38px;height:38px;font-size:var(--f2);border-width:1.5px}
.opt.sel .bb{background:var(--ink);color:var(--paper3)}
.done .opt{cursor:default}
.done .opt.ok .bb{background:var(--shu);border-color:var(--shu);color:var(--paper3)}
.done .opt.ng .bb{background:var(--ink);color:var(--paper3)}
.done .opt.ng .ot{text-decoration:line-through;text-decoration-thickness:1px}
.om{margin-left:auto;font-size:var(--f0);color:var(--ink2);white-space:nowrap}
.hint{font-size:var(--f0);color:var(--ink2);margin-top:4px}
.hint .tg{display:inline;font-size:var(--f0);text-decoration:underline;padding:0;margin-left:10px;color:var(--ink2)}
.done .hint{display:none}
.quiz:not(.done) .after{display:none}
.vd{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 24px;padding:20px 0 4px;border-top:2px solid var(--ink);margin-top:24px}
.vd-v{font-family:var(--hd);font-weight:900;font-size:var(--f5)}
.vd-d{font-size:var(--f2)}.vd-d b{font-size:var(--f3)}
.after .h3{margin-top:18px}
.gnote{font-size:var(--f1);background:var(--paper2);padding:10px 16px;margin:6px 0 10px;max-width:46em}
.peek{font-size:var(--f1);margin-top:14px}
.peek summary{cursor:pointer;color:var(--ink2)}
.pn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:40px}
.pn a{display:flex;flex-direction:column;text-decoration:none;background:var(--paper2);padding:14px 18px}
.pn span{font-size:var(--f0);color:var(--ink2)}.pn b{font-size:var(--f2)}
.qside .h4:first-child{margin-top:4px}
.g120{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;margin-top:10px}
.nb{display:grid;place-items:center;aspect-ratio:1;border-radius:50%;border:1px solid var(--ink);font-size:var(--f0);letter-spacing:-.05em;text-decoration:none;background:var(--paper3)}
.nb.off{border:1px dashed var(--ink3);color:var(--ink3);background:transparent}
.nb.cur{background:var(--ink);color:var(--paper3)}
.prog{font-size:var(--f1)}.prog b{font-family:var(--hd);font-size:var(--f5)}
.lk{display:flex;flex-direction:column;gap:6px;font-size:var(--f1)}
/* fukushi */
.nt{font-size:var(--f1);margin-top:14px;background:var(--paper3);padding:10px 16px;display:inline-block}
.facts{padding-top:36px;padding-bottom:36px}
.facts .stats{margin-top:0}
.facts .two{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.src{font-size:var(--f1);margin-top:24px;display:flex;flex-wrap:wrap;gap:4px 16px}
.sj{padding:28px 0 8px}
.sj-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 18px;margin-bottom:12px}
.sj-h h3{font-size:var(--f3);font-weight:900}.sj-h p{font-size:var(--f1);color:var(--ink2)}
.sec-h{font-family:var(--hd);font-size:var(--f4);font-weight:900;padding-top:36px}
.pdf{font-size:var(--f1);margin-left:auto}
.ag{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2px 28px}
.ag li{display:flex;align-items:center;gap:12px;padding:5px 0;border-bottom:1px solid var(--rule)}
.an{font-size:var(--f1);width:48px;text-align:right;font-weight:700}
/* about / tables */
.ab{display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;padding-top:28px;padding-bottom:64px}
.toc{position:sticky;top:16px;align-self:start;font-size:var(--f1)}
.toc ol{margin:0;padding-left:1.4em}.toc li{margin-bottom:4px}
.ab-b h1{font-size:var(--f5);font-weight:900}
.ab-b section{padding-top:40px}
.tw{overflow-x:auto}
.t{border-collapse:collapse;font-size:var(--f1);min-width:560px;width:100%}
.t th,.t td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--rule);white-space:nowrap}
.t thead th{font-size:var(--f0);color:var(--ink2);background:var(--paper2)}
.t td.r{text-align:right}
.src-l{font-size:var(--f1);padding-left:1.2em;overflow-wrap:anywhere}
/* search */
.sr{list-style:none;margin:0;padding:8px 0 24px}
.sr li{padding:14px 0;border-bottom:1px solid var(--rule)}
.sr a{text-decoration:none;display:block}
.sr a:hover .sr-t{text-decoration:underline}
.sr mark{background:var(--paper2);color:var(--ink)}
.sr-n{font-size:var(--f1);color:var(--ink2);margin-top:16px}
/* footer */
.ft{background:var(--ink);color:var(--paper2);padding:40px 0 48px;font-size:var(--f1);margin-top:0}
.ft p{margin:0}
.ft-name{font-family:var(--hd);font-weight:900;font-size:var(--f3);color:var(--paper3);margin-bottom:8px!important}
.ft-links{display:flex;flex-wrap:wrap;gap:6px 24px;margin-top:14px!important}
.ft a{color:var(--paper3)}
/* responsive */
@media (max-width: 1100px){
 .exs,.dfs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 760px){
 .w{padding:0 16px}
 .hdr-in{flex-direction:column;align-items:flex-start;gap:4px;padding-top:10px;padding-bottom:6px}
 .nav{gap:18px;overflow-x:auto;max-width:100%}
 .fv{padding:28px 0 44px}
 .fv-in{grid-template-columns:8px minmax(0,1fr);gap:16px}
 .tm{width:8px;grid-row:1 / span 2}
 .fv-r{grid-column:2;padding:14px}
 .fv h1{font-size:var(--f5)}
 .sheet.c2{display:none}.sheet.c1{display:block}
 .fv-lead{font-size:var(--f2)}
 .srch input{height:52px;font-size:var(--f2)}
 .srch button{padding:0 16px}
 .exs,.dfs{grid-template-columns:minmax(0,1fr);gap:40px}
 .sec{padding-top:44px;padding-bottom:44px}
 .ttl h1{font-size:var(--f4)}
 .stats{gap:12px 28px}
 .stats dd{font-size:var(--f3)}
 .mx-r{grid-template-columns:1fr 1fr;gap:8px}
 .mx-n,.mx-x{grid-column:1 / -1}
 .kbs,.two,.facts .two{grid-template-columns:minmax(0,1fr);gap:28px}
 .tabs .first{font-size:var(--f1);padding:6px 12px}
 .qr{grid-template-columns:40px minmax(0,1fr);gap:4px 12px}
 .qr .bbs{grid-column:2}
 .qr.miss{grid-template-columns:40px 1fr}
 .qn{font-size:var(--f3)}
 .qw{grid-template-columns:minmax(0,1fr);gap:24px}
 .stem{font-size:var(--f3)}
 .opt{font-size:var(--f2);padding:12px 14px;gap:14px}
 .pn{grid-template-columns:1fr 1fr}.pn .same{grid-column:1 / -1}
 .vd-v{font-size:var(--f4)}
 .ab{grid-template-columns:minmax(0,1fr);gap:16px}
 .toc{position:static}
 .ag{grid-template-columns:minmax(0,1fr)}
 .pdf{margin-left:0}
}