*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:#111;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.45}
a{color:#0b57d0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,video:focus-visible{outline:3px solid #0b57d0;outline-offset:2px}
header.top{border-bottom:1px solid #ddd;padding:18px 20px 14px}
header.top .wrap{max-width:1100px;margin:0 auto}
.brand{font-size:28px;font-weight:700;letter-spacing:.06em;margin:0;color:#111;text-decoration:none}
.sub{margin:2px 0 0;color:#555;font-size:15px}
nav.tabs{margin-top:10px;display:flex;gap:18px;font-size:15px}
nav.tabs a{text-decoration:none;color:#333;padding-bottom:3px;border-bottom:2px solid transparent}
nav.tabs a[aria-current=page]{border-color:#111;color:#111;font-weight:700}
main{max-width:1100px;margin:0 auto;padding:20px}
h1{font-size:24px;margin:6px 0 10px}
h2{font-size:20px;margin:34px 0 10px;padding-top:6px;border-top:1px solid #eee}
h3{font-size:17px;margin:20px 0 8px}
p{margin:0 0 12px;max-width:760px}
.muted{color:#555}
.small{font-size:14px}
.note{border-left:4px solid #111;background:#f6f6f6;padding:12px 14px;margin:14px 0;max-width:760px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:10px 0}
.stat{border:1px solid #ddd;padding:10px 12px}
.stat b{display:block;font-size:22px}
.stat span{font-size:13px;color:#444}
.flow{list-style:none;padding:0;margin:10px 0;max-width:760px}
.flow li{display:flex;justify-content:space-between;gap:12px;border:1px solid #ddd;padding:8px 12px;margin:0 0 6px}
.flow li.ex{margin-left:22px;border-style:dashed;color:#444}
.flow li.key{border-color:#111;font-weight:700}
.flow li b{white-space:nowrap}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{border-bottom:1px solid #e3e3e3;padding:7px 8px;text-align:left;vertical-align:top}
th{background:#f4f4f4;font-weight:700;position:sticky;top:0}
.tablewrap{overflow-x:auto;border:1px solid #ddd}
.controls{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:8px;margin:10px 0}
.controls label{font-size:13px;color:#444;display:block}
.controls input,.controls select{width:100%;font:inherit;font-size:16px;padding:8px;border:1px solid #999;border-radius:0;background:#fff;color:#111}
.count{font-size:14px;color:#333;margin:6px 0}
.acc{font-weight:700;white-space:nowrap}
.ttl{display:block;color:#555;font-size:13px;margin-top:2px}
.tag{display:inline-block;border:1px solid #bbb;padding:0 5px;margin:0 3px 3px 0;font-size:12px;white-space:nowrap}
.flag{font-size:12px;color:#7a4b00}
.video{width:100%;max-width:960px;aspect-ratio:16/9;background:#000;display:block}
.big{display:block;border:2px solid #111;padding:18px;margin:12px 0;text-decoration:none;color:#111;max-width:520px}
.big b{font-size:20px;display:block}
footer{max-width:1100px;margin:30px auto 0;padding:16px 20px 30px;border-top:1px solid #ddd;color:#555;font-size:13px}
@media (max-width:700px){
 main{padding:16px}
 .controls{grid-template-columns:1fr 1fr}
 .controls .q{grid-column:1/-1}
 table.cards thead{position:absolute;left:-9999px}
 table.cards,table.cards tbody,table.cards tr,table.cards td{display:block;width:100%}
 table.cards tr{border-bottom:1px solid #ddd;padding:8px 2px}
 table.cards td{border:0;padding:2px 4px;overflow-wrap:anywhere}
 table.cards td[data-l]::before{content:attr(data-l) ": ";color:#666;font-size:12px}
 .tablewrap{border:0;border-top:1px solid #ddd;overflow-x:visible}
 .flow li.ex{margin-left:12px}
}
