:root{--bg:#f7f6f2;--card:#fff;--ink:#1d2330;--mute:#5d6575;--line:#e3e0d8;--accent:#1f5f8b;--good:#1e7a4a;--mid:#8a6d1a;--bad:#a8372b;--warn:#fff4d6;--warnline:#e7c76a}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--accent)}
.wrap{max-width:1000px;margin:0 auto;padding:0 16px}
header.top{background:#16324a;color:#fff;padding:14px 0}
header.top .wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
header.top a{color:#fff;text-decoration:none}
header.top .brand{font-weight:700;font-size:1.1rem}
header.top nav a{margin-left:16px;opacity:.85}header.top nav a:hover{opacity:1}
.prelim{background:var(--warn);border-bottom:1px solid var(--warnline);padding:10px 0;font-size:.92rem}
.prelim strong{letter-spacing:.04em}
h1{font-size:1.6rem;margin:24px 0 4px}
.sub{color:var(--mute);margin:0 0 16px}
.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0 16px}
.tabs{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card)}
.tabs button{border:0;background:none;padding:8px 14px;font:inherit;cursor:pointer;color:var(--mute)}
.tabs button.on{background:var(--accent);color:#fff}
.controls input[type=search],.controls select{font:inherit;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.controls input[type=search]{flex:1;min-width:180px}
.controls label{font-size:.9rem;color:var(--mute);display:flex;gap:6px;align-items:center}
.list{display:grid;gap:10px}
.row{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;text-decoration:none;color:inherit}
.row:hover{border-color:var(--accent)}
.score{font-size:1.5rem;font-weight:700;text-align:center;border-radius:10px;padding:6px 0;color:#fff}
.s-good{background:var(--good)}.s-mid{background:var(--mid)}.s-bad{background:var(--bad)}.s-na{background:#9aa0a8}
.name{font-weight:600}
.meta{color:var(--mute);font-size:.88rem}
.badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.b{font-size:.75rem;padding:2px 8px;border-radius:999px;border:1px solid var(--line);white-space:nowrap;background:#fafafa}
.b.active{background:#e6f4ec;border-color:#b5dcc4;color:#185c38}
.b.occasional{background:#fdf3e1;border-color:#ecd29b;color:#7a5a12}
.b.historical{background:#eee;color:#555}
.b.featured{background:#e8f0f8;border-color:#b9cfe3;color:#1f4f75}
.b.conf-high{color:#185c38}.b.conf-medium{color:#7a5a12}.b.conf-low{color:#8a2d23}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin:14px 0}
.hero{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center}
.hero .score{font-size:2.6rem;padding:14px 0}
.ci{font-size:.85rem;color:var(--mute);text-align:center;margin-top:4px}
.bar{position:relative;height:8px;background:#ecebe6;border-radius:4px;margin-top:6px}
.bar i{position:absolute;top:0;bottom:0;background:var(--accent);opacity:.35;border-radius:4px}
.bar b{position:absolute;top:-3px;width:3px;height:14px;background:var(--ink)}
.bar u{position:absolute;top:-3px;left:50%;width:1px;height:14px;background:#888}
.subs{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.sub-s{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.sub-s .h{display:flex;justify-content:space-between;gap:8px;font-weight:600}
.sub-s .v{font-size:.85rem;margin:2px 0}
.v.better{color:var(--good)}.v.worse{color:var(--bad)}.v.typical{color:var(--mid)}.v.na{color:var(--mute)}
.sub-s .l{font-size:.82rem;color:var(--mute)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.stat{border:1px solid var(--line);border-radius:10px;padding:10px}
.stat .k{font-size:.8rem;color:var(--mute)}.stat .n{font-size:1.25rem;font-weight:700}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th,td{text-align:left;padding:7px 6px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl{overflow-x:auto}
details summary{cursor:pointer;color:var(--accent);margin:8px 0}
footer{color:var(--mute);font-size:.85rem;padding:28px 0 40px;border-top:1px solid var(--line);margin-top:30px}
.empty{padding:30px;text-align:center;color:var(--mute)}
@media(max-width:620px){.row{grid-template-columns:54px 1fr}.row .badges{grid-column:1/-1;justify-content:flex-start}.hero{grid-template-columns:1fr}.hero .score{max-width:140px}header.top nav a{margin:0 12px 0 0}}
.b.spec{background:#eef0f7;border-color:#c9cfe4;color:#2b3a67}
.meta .b.spec{margin-right:4px}
.mix{display:flex;height:14px;border-radius:7px;overflow:hidden;margin:8px 0;background:#ecebe6}
.mix i{display:block;height:100%}
.mixleg{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.85rem}
.mixleg>span{display:inline-flex;align-items:center;gap:5px}
.mixleg i{display:inline-block;width:10px;height:10px;border-radius:2px}
.pill{display:inline-block;min-width:44px;text-align:center;color:#fff;border-radius:8px;padding:0 8px}
.specline{display:flex;align-items:center;gap:6px;font-size:.92rem;margin:2px 0;color:var(--ink)}
.specline i{display:inline-block;width:11px;height:11px;border-radius:3px;flex:none}
.primwork{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:10px;padding:8px 12px;border:1px solid #c9cfe4;background:#eef0f7;border-radius:10px}
.primwork .k{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--mute)}
.primwork .v{font-size:1.15rem;font-weight:700;color:#2b3a67;display:inline-flex;align-items:center;gap:6px}
.primwork .v i{display:inline-block;width:12px;height:12px;border-radius:3px}

.famrow{margin:4px 0 14px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:12px}
.famlab{font-size:.85rem;font-weight:600;margin-bottom:8px}
.fampills{display:flex;flex-wrap:wrap;gap:8px}
.fampills button{font:inherit;font-size:.88rem;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:#fafafa;color:var(--ink);cursor:pointer;line-height:1.2}
.fampills button:hover{border-color:var(--accent)}
.fampills button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.fampills button.on i{background:#fff!important;opacity:.95}
.fampills button i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:middle}
.famany{display:inline-flex;gap:6px;align-items:center;font-size:.88rem;color:var(--mute);margin-top:10px}