:root{
color-scheme: light dark;
--bg:#f4f0e8;
--surface:#fffefa;
--surface-2:#ece7db;
--ink:#171410;
--ink-2:#3e382f;
--ink-3:#7d7466;
--line:#ddd5c6;
--line-strong:#171410;
--accent:#e63b1f;
--accent-ink:#ffffff;
--hero-bg:#171410;
--hero-ink:#f7f2e7;
--hero-sub:#c9c0ae;
--geinin:#b45309;
--geinin-bg:#fdf3e3;
--sports:#15803d;
--sports-bg:#e9f6ee;
--actor:#1d4ed8;
--actor-bg:#eaf0fe;
--idol:#be185d;
--idol-bg:#fdeef4;
--seiyu:#0891b2;
--seiyu-bg:#e6f6fa;
--youtuber:#dc2626;
--youtuber-bg:#fdecec;
--olympic:#9a7b0a;
--olympic-bg:#faf3d7;
--rank-bg:#e63b1f;
--rank-ink:#ffffff;
--note-bg:#e63b1f;
--note-ink:#ffffff;
--shadow:6px 6px 0 rgba(23,20,16,.9);
--shadow-sm:3px 3px 0 rgba(23,20,16,.9);
--radius:16px;
--pf-ig:#c2255c;
--pf-x:#171410;
--pf-th:#595959;
--pf-tt:#0f766e;
--pf-yt:#e60012;
--disp:"Shippori Mincho B1","Hiragino Mincho ProN",serif;
}
@media (prefers-color-scheme: dark){
:root{
--bg:#121110;
--surface:#1d1b18;
--surface-2:#2a2721;
--ink:#f4efe3;
--ink-2:#d8d0bf;
--ink-3:#9d9482;
--line:#37332b;
--line-strong:#f4efe3;
--accent:#ff6a4d;
--accent-ink:#1a0f0a;
--hero-bg:#000000;
--hero-ink:#f7f2e7;
--hero-sub:#b7ad99;
--geinin:#f0b35e;
--geinin-bg:#2b2113;
--sports:#5ec98a;
--sports-bg:#12271a;
--actor:#8db1ff;
--actor-bg:#16233f;
--idol:#f28bb4;
--idol-bg:#331824;
--seiyu:#7dd3e8;
--seiyu-bg:#0b2b36;
--youtuber:#f87171;
--youtuber-bg:#331414;
--olympic:#e3c566;
--olympic-bg:#2e270e;
--rank-bg:#ff6a4d;
--rank-ink:#1a0f0a;
--note-bg:#c22e12;
--note-ink:#ffffff;
--shadow:6px 6px 0 rgba(0,0,0,.85);
--shadow-sm:3px 3px 0 rgba(0,0,0,.85);
--pf-ig:#f06595;
--pf-x:#f4efe3;
--pf-th:#bdbdbd;
--pf-tt:#4fd8c8;
--pf-yt:#ff6b5e;
}
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
margin:0;background:var(--bg);color:var(--ink);
font-family:"Noto Sans JP",system-ui,-apple-system,"Hiragino Kaku Gothic ProN",sans-serif;
-webkit-font-smoothing:antialiased;line-height:1.6;
}
button{font:inherit;cursor:pointer}
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding:0 18px 72px}
[hidden]{display:none !important}

/* ---------- data note ---------- */
.note-bar{
background:var(--note-bg);color:var(--note-ink);
font-size:12.5px;font-weight:700;letter-spacing:.02em;
padding:9px 18px;text-align:center;
}
.note-bar span{font-weight:500;opacity:.88}

/* ---------- hero ---------- */
.lead{padding:26px 0 4px}
.hero{
background:var(--hero-bg);color:var(--hero-ink);
border-radius:22px;padding:38px 38px 30px;position:relative;overflow:hidden;
}
.hero::after{
content:"@";position:absolute;right:-28px;top:-64px;
font-family:"Archivo",sans-serif;font-weight:800;font-size:300px;line-height:1;
color:var(--accent);opacity:.16;pointer-events:none;
}
.hero-kicker{
display:inline-block;background:var(--accent);color:#fff;
font-size:11.5px;font-weight:900;letter-spacing:.14em;
border-radius:4px;padding:3px 10px;margin-bottom:16px;
}
.hero h1{
margin:0;font-family:var(--disp);font-weight:800;
font-size:clamp(46px,8.5vw,78px);line-height:1.08;letter-spacing:.04em;position:relative;z-index:1;
}
.hero h1 .at{color:var(--accent);font-family:"Archivo",sans-serif;font-weight:800}
.hero p.sub{margin:16px 0 0;color:var(--hero-sub);font-size:15px;max-width:660px;position:relative;z-index:1}
.hero p.sub b{color:var(--hero-ink)}
.hero-pfs{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px;position:relative;z-index:1}
.hero-pf{
display:inline-flex;align-items:center;gap:7px;
border:1px solid rgba(247,242,231,.35);border-radius:999px;padding:5px 14px;
font-size:13px;font-weight:700;color:var(--hero-ink);
}
.hero-pf .pdot{width:8px;height:8px}
.hero-pf b{font-family:"Archivo",sans-serif;font-weight:800}
.lead-stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;position:relative;z-index:1}
.stat{
border:1px solid rgba(247,242,231,.35);border-radius:12px;
padding:10px 18px 9px;min-width:112px;background:rgba(247,242,231,.05);
}
.stat b{display:block;font-family:"Archivo",sans-serif;font-size:26px;line-height:1.15;color:var(--hero-ink)}
.stat small{color:var(--hero-sub);font-size:11.5px;font-weight:700;letter-spacing:.06em}

/* ---------- search & tabs ---------- */
.toolbar{
position:sticky;top:12px;z-index:30;
background:var(--surface);border:1.5px solid var(--line-strong);border-radius:18px;
padding:16px 18px 14px;margin-top:20px;box-shadow:var(--shadow-sm);
}
.search-row{display:flex;gap:10px;flex-wrap:wrap}
.search-box{
flex:1 1 260px;display:flex;align-items:center;gap:9px;
background:var(--surface-2);border:1.5px solid transparent;border-radius:999px;padding:0 18px;
}
.search-box:focus-within{border-color:var(--line-strong);background:var(--surface)}
.search-box svg{flex:none;color:var(--ink-3)}
.search-box input{border:0;background:transparent;color:var(--ink);font:inherit;font-size:15px;padding:11px 0;width:100%;outline:none;min-width:0}
.bookmark-count{
display:inline-flex;align-items:center;gap:8px;
background:var(--surface);border:1.5px solid var(--line);border-radius:999px;
padding:10px 16px;font-weight:700;font-size:14px;color:var(--ink);
}
.bookmark-count b{font-family:"Archivo",sans-serif}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.tab{
border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:999px;padding:7px 18px;font-weight:700;font-size:14px;
transition:transform .12s ease,border-color .12s ease;
}
.tab:hover{border-color:var(--line-strong)}
.tab[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tab .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px}
.pf-filter{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;align-items:center}
.pf-filter .lbl{font-size:12px;font-weight:900;color:var(--ink-3);letter-spacing:.05em}
.pf-chip{
border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:999px;padding:5px 14px;font-weight:700;font-size:13px;
}
.pf-chip:hover{border-color:var(--line-strong)}
.pf-chip[aria-pressed="true"]{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ---------- sections ---------- */
section{margin-top:52px}
.sec-head{
display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:18px;
border-bottom:2.5px solid var(--line-strong);padding-bottom:10px;
}
.sec-no{font-family:"Archivo",sans-serif;font-weight:800;font-size:15px;color:var(--accent)}
.sec-head h2{margin:0;font-family:var(--disp);font-size:23px;font-weight:800;letter-spacing:.03em}
.sec-head p{margin:0;color:var(--ink-3);font-size:13px}

/* ---------- coverage ---------- */
.cov-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.cov{
background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px;
}
.cov h3{margin:0 0 2px;font-size:15px;font-weight:900;display:flex;align-items:center;gap:8px}
.cov .big{font-family:"Archivo",sans-serif;font-size:40px;font-weight:800;line-height:1.15}
.cov .big small{font-size:14px;color:var(--ink-3);font-family:"Noto Sans JP",sans-serif;font-weight:700}
.cov .bar{height:10px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin:12px 0 14px}
.cov .bar i{display:block;height:100%;border-radius:99px}
.cov table{width:100%;border-collapse:collapse;font-size:12.5px}
.cov table td{padding:3px 0;color:var(--ink-2)}
.cov table td:last-child{text-align:right;font-family:"Archivo",sans-serif;font-weight:800;color:var(--ink)}
.cov .foot{margin-top:10px;font-size:11.5px;color:var(--ink-3)}
.pdot{width:10px;height:10px;border-radius:50%;flex:none}
.cov-takeaway{
margin-top:14px;background:var(--surface);border:1.5px solid var(--line-strong);border-radius:var(--radius);
padding:18px 22px;font-size:14.5px;color:var(--ink-2);box-shadow:var(--shadow-sm);
}
.cov-takeaway b{color:var(--accent)}

/* ---------- ranking ---------- */
.rank-panel{background:var(--surface);border:1.5px solid var(--line-strong);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.rank-list{list-style:none;margin:0;padding:6px 0}
.rank-item{
display:flex;align-items:center;gap:14px;width:100%;text-align:left;
background:transparent;border:0;padding:11px 20px;color:var(--ink);
}
.rank-item:hover{background:var(--surface-2)}
.rank-no{font-family:"Archivo",sans-serif;font-weight:800;font-size:19px;width:32px;text-align:center;flex:none;color:var(--ink-3)}
.rank-list li:nth-child(1) .rank-no,.rank-item.top .rank-no{background:var(--rank-bg);color:var(--rank-ink);border-radius:8px;padding:2px 0}
.rank-list li:nth-child(2) .rank-no,.rank-list li:nth-child(3) .rank-no{color:var(--ink)}
.rank-meta{flex:1;min-width:0}
.rank-meta b{display:block;font-size:15px;overflow-wrap:anywhere}
.rank-meta small{color:var(--ink-3);font-size:12px}
.rank-fol{text-align:right;flex:none}
.rank-fol b{font-family:"Archivo",sans-serif;font-size:17px;display:block;line-height:1.2;color:var(--accent)}
.rank-fol small{font-size:11px;font-weight:700;color:var(--ink-3)}
.rank-note{padding:10px 20px 14px;color:var(--ink-3);font-size:12px;border-top:1px dashed var(--line)}

/* ---------- avatars ---------- */
.avatar{border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;font-weight:900;color:#fff;letter-spacing:.02em}
.av-44{width:44px;height:44px;font-size:16px}
.av-56{width:56px;height:56px;font-size:20px}
.av-72{width:72px;height:72px;font-size:26px}

/* ---------- platform badges ---------- */
.pf-row{display:flex;gap:6px;flex-wrap:wrap}
.pf{
display:inline-flex;align-items:center;gap:5px;border-radius:7px;padding:3px 8px;
font-size:11.5px;font-weight:700;border:1px solid var(--line);background:var(--surface-2);color:var(--ink-3);
}
.pf .pdot{width:7px;height:7px}
.pf.ok{background:var(--surface);color:var(--ink);border-color:var(--line-strong)}
.pf.ok .pv{font-family:"Archivo",sans-serif;font-weight:800}
.pf.none{opacity:.75}
.pf.unk{border-style:dashed;background:transparent}
.pf-mini{display:inline-flex;gap:4px;flex-wrap:wrap}
.pf-mini .pf{padding:1px 6px;font-size:10.5px}

/* ---------- sports hub ---------- */
.hub-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.hub-tab{
border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:10px;padding:9px 18px;font-weight:900;font-size:15px;
}
.hub-tab:hover{border-color:var(--line-strong)}
.hub-tab[aria-pressed="true"]{background:var(--sports);border-color:var(--sports);color:#fff}
.hub-panel{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:22px}
.hub-panel>p{margin:0 0 14px;color:var(--ink-3);font-size:13px}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.team{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:var(--surface)}
.team h4{margin:0 0 8px;font-size:14.5px;font-weight:900}
.team .off{margin-bottom:10px}
.chip-btn{
display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line);background:var(--surface);
border-radius:999px;padding:5px 13px 5px 6px;font-weight:700;font-size:13px;color:var(--ink);margin:0 6px 6px 0;
}
.chip-btn:hover{border-color:var(--line-strong)}
.chip-btn small{color:var(--ink-3);font-weight:500}
.hub-layer{margin-top:18px}
.hub-layer h4{margin:0 0 10px;font-size:13px;font-weight:900;letter-spacing:.05em;color:var(--sports)}

/* ---------- account grid ---------- */
.list-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.list-tools .count{font-size:13.5px;color:var(--ink-3);font-weight:700}
.list-tools select{
margin-left:auto;font:inherit;font-size:14px;font-weight:700;color:var(--ink);
background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:8px 12px;
}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card{
background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);
padding:18px;display:flex;flex-direction:column;gap:10px;text-align:left;width:100%;color:var(--ink);
transition:transform .13s ease,box-shadow .13s ease,border-color .13s ease;
}
.card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm);transform:translate(-2px,-2px)}
.card-top{display:flex;gap:12px;align-items:flex-start}
.card-top .avatar{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--line)}
.card-name{min-width:0;flex:1}
.card-name b{font-size:15.5px;display:block;overflow-wrap:anywhere}
.handle{color:var(--ink-3);font-size:12.5px;font-weight:600}
.pill{font-size:10.5px;font-weight:900;letter-spacing:.05em;border-radius:5px;padding:2px 7px;vertical-align:1px;white-space:nowrap}
.pill-geinin{background:var(--geinin-bg);color:var(--geinin)}
.pill-sports{background:var(--sports-bg);color:var(--sports)}
.pill-actor{background:var(--actor-bg);color:var(--actor)}
.pill-idol{background:var(--idol-bg);color:var(--idol)}
.pill-seiyu{background:var(--seiyu-bg);color:var(--seiyu)}
.pill-youtuber{background:var(--youtuber-bg);color:var(--youtuber)}
.pill-olympic{background:var(--olympic-bg);color:var(--olympic)}
.cat-basis{font-size:12px;color:var(--ink-3);margin:6px 0 0}
.card .group-line{margin:0;color:var(--ink-2);font-size:13px}
.card-foot{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:8px;border-top:1px dashed var(--line)}
.card-foot .cnt{font-size:12px;color:var(--ink-3);font-weight:700}
.bm-btn{
margin-left:auto;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:999px;padding:5px 13px;font-size:12.5px;font-weight:700;flex:none;
}
.bm-btn:hover{border-color:var(--line-strong)}
.bm-btn[aria-pressed="true"]{background:var(--accent);color:#fff;border-color:var(--accent)}
.empty{
grid-column:1/-1;text-align:center;color:var(--ink-3);padding:44px 16px;
border:1.5px dashed var(--line-strong);border-radius:var(--radius);background:var(--surface);
}

/* ---------- category index ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.cat-card{
background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);
padding:22px;text-align:left;width:100%;color:var(--ink);display:flex;flex-direction:column;gap:8px;
transition:transform .13s ease,box-shadow .13s ease,border-color .13s ease;
}
.cat-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm);transform:translate(-2px,-2px)}
.cat-card .cat-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.cat-card h3{margin:0;font-family:var(--disp);font-size:21px;font-weight:800;letter-spacing:.03em}
.cat-card .cat-big{font-family:"Archivo",sans-serif;font-weight:800;font-size:30px;line-height:1.1}
.cat-card .cat-big small{font-size:13px;color:var(--ink-3);font-family:"Noto Sans JP",sans-serif;font-weight:700}
.cat-card p{margin:0;color:var(--ink-2);font-size:13.5px}
.cat-card .cat-groups{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
.cat-card .cat-groups span{
font-size:11.5px;font-weight:700;border:1px solid var(--line);border-radius:999px;
padding:2px 10px;color:var(--ink-2);background:var(--surface-2);
}
.cat-card .cat-go{margin-top:auto;padding-top:8px;font-weight:900;font-size:14px;color:var(--accent)}

/* ---------- grouped list ---------- */
.sub-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.sub-bar .lbl{font-size:12px;font-weight:900;color:var(--ink-3);letter-spacing:.05em}
.sub-chip{
border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:999px;padding:5px 14px;font-weight:700;font-size:13px;
}
.sub-chip:hover{border-color:var(--line-strong)}
.sub-chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sub-chip .n{font-family:"Archivo",sans-serif;font-weight:800;font-size:11.5px;opacity:.75;margin-left:4px}
#grid.grouped{display:block}
.group-block{margin-bottom:30px}
.group-block:last-child{margin-bottom:0}
.group-head{
display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
margin:0 0 12px;font-size:16.5px;font-weight:900;letter-spacing:.02em;
border-left:5px solid var(--accent);padding-left:12px;
}
.group-head .g-count{font-size:12px;color:var(--ink-3);font-weight:700}
.group-head .g-open{
margin-left:auto;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:999px;padding:4px 13px;font-size:12px;font-weight:900;
}
.group-head .g-open:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- design memo ---------- */
.memo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.memo{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px}
.memo h3{margin:0 0 8px;font-size:15px;font-weight:900}
.memo h3 .no{font-family:"Archivo",sans-serif;margin-right:8px;color:var(--accent)}
.memo p{margin:0;color:var(--ink-2);font-size:13.5px}
.memo p b{color:var(--ink)}

footer{margin-top:52px;border-top:1px solid var(--line);padding-top:18px;color:var(--ink-3);font-size:12.5px}

/* ---------- detail sheet ---------- */
.sheet-backdrop{position:fixed;inset:0;background:rgba(10,8,5,.55);z-index:50;display:none;align-items:flex-end;justify-content:center}
.sheet-backdrop.open{display:flex}
.sheet{
background:var(--surface);color:var(--ink);width:min(680px,100%);max-height:88vh;overflow:auto;
border-radius:22px 22px 0 0;padding:26px 24px 34px;box-shadow:var(--shadow);
border-top:6px solid var(--accent);
}
@media (min-width:720px){
.sheet-backdrop{align-items:center;padding:24px}
.sheet{border-radius:22px}
}
.sheet-close{float:right;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;width:36px;height:36px;font-size:16px;line-height:1}
.sheet-head{display:flex;gap:16px;align-items:center;margin-bottom:6px}
.sheet-head h3{margin:0;font-family:var(--disp);font-size:22px;font-weight:800;overflow-wrap:anywhere}
.sheet-actions{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0 4px}
.btn-ghost{background:var(--surface);color:var(--ink);border:1.5px solid var(--line);border-radius:999px;padding:10px 18px;font-weight:700;font-size:14px}
.btn-ghost:hover{border-color:var(--line-strong)}
.btn-page{background:var(--accent);color:#fff;border:1.5px solid var(--accent);border-radius:999px;padding:10px 18px;font-weight:900;font-size:14px}
.btn-page:hover{filter:brightness(1.07)}
.sheet h4{font-size:13px;font-weight:900;letter-spacing:.06em;color:var(--ink-3);margin:22px 0 8px}
.sheet p.body{margin:0;font-size:14.5px;color:var(--ink-2)}
.pf-table{width:100%;border-collapse:collapse}
.pf-table tr{border-bottom:1px dashed var(--line)}
.pf-table td{padding:11px 4px;vertical-align:middle}
.pf-table .pname{font-weight:900;font-size:14.5px;white-space:nowrap;width:104px}
.pf-table .phandle{color:var(--ink-2);font-size:13.5px;overflow-wrap:anywhere}
.pf-table .pfol{font-family:"Archivo",sans-serif;font-weight:800;font-size:14px;white-space:nowrap;text-align:right}
.pf-table .pfol small{display:block;font-family:"Noto Sans JP",sans-serif;font-weight:500;font-size:10.5px;color:var(--ink-3)}
.pf-table .plink{text-align:right;width:86px}
.open-btn{
display:inline-block;border:1.5px solid var(--line-strong);border-radius:999px;padding:5px 15px;
font-size:12.5px;font-weight:900;text-decoration:none;background:var(--surface);color:var(--ink);white-space:nowrap;
}
.open-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.st{font-size:11px;font-weight:900;border-radius:5px;padding:2px 7px;white-space:nowrap}
.st-f{background:var(--sports-bg);color:var(--sports)}
.st-n{background:var(--surface-2);color:var(--ink-3)}
.st-u{background:transparent;color:var(--ink-3);border:1px dashed var(--line)}
.src-list{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.src-list a{font-size:13px;color:var(--actor);overflow-wrap:anywhere}
.rel-row{display:flex;gap:9px;flex-wrap:wrap}
.rel-chip{
display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line);
background:var(--surface);border-radius:999px;padding:6px 14px 6px 7px;font-weight:700;font-size:13.5px;color:var(--ink);
}
.rel-chip:hover{border-color:var(--line-strong)}

/* ---------- individual page (sample) ---------- */
.page-wrap{padding-top:22px}
.crumb{font-size:12.5px;color:var(--ink-3);font-weight:700;margin-bottom:14px}
.crumb b{color:var(--ink)}
.url-bar{
display:flex;align-items:center;gap:10px;
background:var(--surface);border:1.5px solid var(--line-strong);border-radius:12px;
padding:11px 16px;margin-bottom:22px;box-shadow:var(--shadow-sm);
font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:13.5px;overflow-wrap:anywhere;
}
.url-bar .lock{color:var(--sports);flex:none;display:inline-flex}
.url-bar .dom{color:var(--ink-3)}
.url-bar .path{font-weight:700}
.page-tag{
display:inline-block;background:var(--accent);color:#fff;font-size:11.5px;font-weight:900;
letter-spacing:.1em;border-radius:4px;padding:3px 10px;margin-bottom:14px;
}
.page-head{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.page-head h1{margin:0;font-family:var(--disp);font-size:clamp(28px,5vw,38px);font-weight:800;letter-spacing:.03em;overflow-wrap:anywhere}
.page-head .avatar{box-shadow:0 0 0 2px var(--bg),0 0 0 4.5px var(--line-strong)}
.page-lead{margin:16px 0 0;font-size:15px;color:var(--ink-2);max-width:720px}
.page-lead b{color:var(--ink)}
.facts{
display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:22px;
background:var(--line);border:1.5px solid var(--line-strong);border-radius:14px;overflow:hidden;
}
.facts>div{background:var(--surface);padding:13px 16px}
.facts dt{font-size:11px;font-weight:900;letter-spacing:.07em;color:var(--ink-3)}
.facts dd{margin:3px 0 0;font-size:14.5px;font-weight:700}
.page-sec{margin-top:36px}
.page-sec>h2{
margin:0 0 14px;font-family:var(--disp);font-size:20px;font-weight:800;letter-spacing:.03em;
border-bottom:2.5px solid var(--line-strong);padding-bottom:8px;
}
.page-panel{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:8px 20px}
.page-note{font-size:12.5px;color:var(--ink-3);margin-top:10px}
.rel-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.rel-card{
display:flex;align-items:center;gap:12px;flex-wrap:wrap;text-align:left;width:100%;
background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:13px 16px;color:var(--ink);
transition:transform .13s ease,box-shadow .13s ease,border-color .13s ease;
}
.rel-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm);transform:translate(-2px,-2px)}
.rel-card .rc-meta{flex:1 1 150px;min-width:150px}
.rel-card .rc-meta b{display:block;font-size:14.5px;overflow-wrap:anywhere}
.rel-card .rc-meta small{color:var(--ink-3);font-size:12px}
.rel-card .rc-arrow{color:var(--accent);font-weight:900;flex:none}
.back-row{margin-top:40px;display:flex;gap:10px;flex-wrap:wrap}
.back-btn{
display:inline-flex;align-items:center;gap:8px;
background:var(--ink);color:var(--bg);border:1.5px solid var(--ink);
border-radius:999px;padding:11px 22px;font-weight:900;font-size:14.5px;
}
.back-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.back-link-top{
display:inline-flex;align-items:center;gap:7px;background:none;border:0;padding:0;
font-weight:900;font-size:13.5px;color:var(--accent);margin-bottom:16px;
}

@media (max-width:900px){
.grid,.memo-grid,.team-grid{grid-template-columns:repeat(2,1fr)}
.cov-grid{grid-template-columns:repeat(2,1fr)}
.facts{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
.grid,.memo-grid,.team-grid,.cov-grid,.rel-cards,.cat-grid{grid-template-columns:1fr}
.rank-item{padding:11px 14px}
.hub-panel{padding:18px 16px}
.hero{padding:28px 22px 24px;border-radius:18px}
.hero::after{font-size:200px;top:-40px}
.lead{padding-top:18px}
.lead-stats{display:grid;grid-template-columns:1fr 1fr}
.stat{min-width:0}
.toolbar{top:8px;padding:14px 14px 12px}
.pf-table .pname{width:86px}
.page-panel{padding:6px 14px}
}
@media (prefers-reduced-motion: reduce){
html{scroll-behavior:auto}
.card,.rel-card,.tab{transition:none}
}


/* ---------- generated category colors ---------- */
:root{
--cat0:#7c1d1d;--catbg0:#f7e3e3;
--cat1:#1d7c39;--catbg1:#e3f7e9;
--cat2:#541d7c;--catbg2:#efe3f7;
--cat3:#7c701d;--catbg3:#f7f5e3;
--cat4:#1d6c7c;--catbg4:#e3f4f7;
--cat5:#7c1d50;--catbg5:#f7e3ee;
--cat6:#357c1d;--catbg6:#e8f7e3;
--cat7:#211d7c;--catbg7:#e4e3f7;
--cat8:#7c3d1d;--catbg8:#f7eae3;
--cat9:#1d7c58;--catbg9:#e3f7f0;
--cat10:#741d7c;--catbg10:#f5e3f7;
--cat11:#687c1d;--catbg11:#f3f7e3;
--cat12:#1d4c7c;--catbg12:#e3edf7;
--cat13:#7c1d31;--catbg13:#f7e3e7;
--cat14:#1d7c25;--catbg14:#e3f7e5;
--cat15:#411d7c;--catbg15:#ebe3f7;
--cat16:#7c5d1d;--catbg16:#f7f0e3;
--cat17:#1d7c78;--catbg17:#e3f7f6;
--cat18:#7c1d64;--catbg18:#f7e3f2;
--cat19:#487c1d;--catbg19:#ecf7e3;
--cat20:#1d2d7c;--catbg20:#e3e7f7;
--cat21:#7c291d;--catbg21:#f7e6e3;
--cat22:#1d7c45;--catbg22:#e3f7ec;
--cat23:#611d7c;--catbg23:#f1e3f7;
--cat24:#7c7c1d;--catbg24:#f7f7e3;
--cat25:#1d607c;--catbg25:#e3f1f7;
--cat26:#7c1d44;--catbg26:#f7e3eb;
--cat27:#297c1d;--catbg27:#e6f7e3;
--cat28:#2d1d7c;--catbg28:#e7e3f7;
--cat29:#7c491d;--catbg29:#f7ece3;
--cat30:#1d7c65;--catbg30:#e3f7f2;
--cat31:#7c1d78;--catbg31:#f7e3f6;
--cat32:#5c7c1d;--catbg32:#f0f7e3;
--cat33:#1d407c;--catbg33:#e3ebf7;
--cat34:#7c1d25;--catbg34:#f7e3e5;
--cat35:#1d7c31;--catbg35:#e3f7e8;
--cat36:#4d1d7c;--catbg36:#ede3f7;
--cat37:#7c691d;--catbg37:#f7f3e3;
--cat38:#1d747c;--catbg38:#e3f5f7;
--cat39:#7c1d58;--catbg39:#f7e3f0;
--cat40:#3c7c1d;--catbg40:#eaf7e3;
--cat41:#1d217c;--catbg41:#e3e4f7;
}
@media (prefers-color-scheme: dark){
:root{
--cat0:#f58484;--catbg0:#3b1616;
--cat1:#84f5a5;--catbg1:#163b21;
--cat2:#c684f5;--catbg2:#2c163b;
--cat3:#f5e784;--catbg3:#3b3716;
--cat4:#84e2f5;--catbg4:#16353b;
--cat5:#f584c1;--catbg5:#3b162a;
--cat6:#a0f584;--catbg6:#203b16;
--cat7:#8984f5;--catbg7:#18163b;
--cat8:#f5aa84;--catbg8:#3b2316;
--cat9:#84f5cb;--catbg9:#163b2d;
--cat10:#ec84f5;--catbg10:#38163b;
--cat11:#ddf584;--catbg11:#333b16;
--cat12:#84bdf5;--catbg12:#16293b;
--cat13:#f5849c;--catbg13:#3b161e;
--cat14:#84f58e;--catbg14:#163b1a;
--cat15:#af84f5;--catbg15:#24163b;
--cat16:#f5d084;--catbg16:#3b2f16;
--cat17:#84f5f1;--catbg17:#163b3a;
--cat18:#f584d9;--catbg18:#3b1632;
--cat19:#b8f584;--catbg19:#273b16;
--cat20:#8497f5;--catbg20:#161c3b;
--cat21:#f59384;--catbg21:#3b1b16;
--cat22:#84f5b4;--catbg22:#163b26;
--cat23:#d584f5;--catbg23:#31163b;
--cat24:#f5f584;--catbg24:#3b3b16;
--cat25:#84d4f5;--catbg25:#16303b;
--cat26:#f584b3;--catbg26:#3b1626;
--cat27:#92f584;--catbg27:#1b3b16;
--cat28:#9884f5;--catbg28:#1d163b;
--cat29:#f5b884;--catbg29:#3b2716;
--cat30:#84f5d9;--catbg30:#163b32;
--cat31:#f584f0;--catbg31:#3b1639;
--cat32:#cff584;--catbg32:#2f3b16;
--cat33:#84aef5;--catbg33:#16243b;
--cat34:#f5848d;--catbg34:#3b1619;
--cat35:#84f59c;--catbg35:#163b1e;
--cat36:#bd84f5;--catbg36:#29163b;
--cat37:#f5de84;--catbg37:#3b3416;
--cat38:#84ebf5;--catbg38:#16383b;
--cat39:#f584ca;--catbg39:#3b162d;
--cat40:#a9f584;--catbg40:#223b16;
--cat41:#8488f5;--catbg41:#16183b;
}
}
.pill-c0{background:var(--catbg0);color:var(--cat0)}
.pill-c1{background:var(--catbg1);color:var(--cat1)}
.pill-c2{background:var(--catbg2);color:var(--cat2)}
.pill-c3{background:var(--catbg3);color:var(--cat3)}
.pill-c4{background:var(--catbg4);color:var(--cat4)}
.pill-c5{background:var(--catbg5);color:var(--cat5)}
.pill-c6{background:var(--catbg6);color:var(--cat6)}
.pill-c7{background:var(--catbg7);color:var(--cat7)}
.pill-c8{background:var(--catbg8);color:var(--cat8)}
.pill-c9{background:var(--catbg9);color:var(--cat9)}
.pill-c10{background:var(--catbg10);color:var(--cat10)}
.pill-c11{background:var(--catbg11);color:var(--cat11)}
.pill-c12{background:var(--catbg12);color:var(--cat12)}
.pill-c13{background:var(--catbg13);color:var(--cat13)}
.pill-c14{background:var(--catbg14);color:var(--cat14)}
.pill-c15{background:var(--catbg15);color:var(--cat15)}
.pill-c16{background:var(--catbg16);color:var(--cat16)}
.pill-c17{background:var(--catbg17);color:var(--cat17)}
.pill-c18{background:var(--catbg18);color:var(--cat18)}
.pill-c19{background:var(--catbg19);color:var(--cat19)}
.pill-c20{background:var(--catbg20);color:var(--cat20)}
.pill-c21{background:var(--catbg21);color:var(--cat21)}
.pill-c22{background:var(--catbg22);color:var(--cat22)}
.pill-c23{background:var(--catbg23);color:var(--cat23)}
.pill-c24{background:var(--catbg24);color:var(--cat24)}
.pill-c25{background:var(--catbg25);color:var(--cat25)}
.pill-c26{background:var(--catbg26);color:var(--cat26)}
.pill-c27{background:var(--catbg27);color:var(--cat27)}
.pill-c28{background:var(--catbg28);color:var(--cat28)}
.pill-c29{background:var(--catbg29);color:var(--cat29)}
.pill-c30{background:var(--catbg30);color:var(--cat30)}
.pill-c31{background:var(--catbg31);color:var(--cat31)}
.pill-c32{background:var(--catbg32);color:var(--cat32)}
.pill-c33{background:var(--catbg33);color:var(--cat33)}
.pill-c34{background:var(--catbg34);color:var(--cat34)}
.pill-c35{background:var(--catbg35);color:var(--cat35)}
.pill-c36{background:var(--catbg36);color:var(--cat36)}
.pill-c37{background:var(--catbg37);color:var(--cat37)}
.pill-c38{background:var(--catbg38);color:var(--cat38)}
.pill-c39{background:var(--catbg39);color:var(--cat39)}
.pill-c40{background:var(--catbg40);color:var(--cat40)}
.pill-c41{background:var(--catbg41);color:var(--cat41)}

/* ---------- smooth motion (nurunuru) ---------- */
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes viewIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes sheetUp{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
.view-in{animation:viewIn .45s cubic-bezier(.22,.8,.3,1) both}
.card{animation:rise .5s cubic-bezier(.22,.8,.3,1) both;animation-delay:calc(var(--i,0)*32ms)}
.cat-card,.rel-card,.rank-item,.chip-btn,.team,.cov,.memo{transition:transform .25s cubic-bezier(.22,.8,.3,1),box-shadow .25s cubic-bezier(.22,.8,.3,1),border-color .25s ease,background-color .25s ease}
.tab,.sub-chip,.pf-chip,.hub-tab,.bm-btn,.btn-ghost,.btn-page,.open-btn,.g-open{transition:transform .2s cubic-bezier(.22,.8,.3,1),background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease}
.tab:active,.sub-chip:active,.pf-chip:active,.hub-tab:active{transform:scale(.96)}
.sheet-backdrop.open{animation:fadeIn .28s ease both}
.sheet-backdrop.open .sheet{animation:sheetUp .42s cubic-bezier(.22,.9,.28,1) both}
.reveal{animation:viewIn .55s cubic-bezier(.22,.8,.3,1) both}
.cov .bar i{transition:width .9s cubic-bezier(.22,.8,.3,1)}
.rank-panel,.hub-panel{animation:popIn .35s cubic-bezier(.22,.8,.3,1) both}
.pf{transition:transform .2s ease,border-color .2s ease}
.card:hover .pf.ok{border-color:var(--ink-3)}

/* ---------- more button ---------- */
.more-wrap{margin-top:20px;text-align:center}
.more-btn{
background:var(--surface);border:1.5px solid var(--line-strong);border-radius:999px;
padding:13px 34px;font-weight:900;font-size:15px;color:var(--ink);box-shadow:var(--shadow-sm);
transition:transform .2s cubic-bezier(.22,.8,.3,1),background-color .2s ease,color .2s ease;
}
.more-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px)}
.more-wrap .remain{display:block;margin-top:9px;font-size:12.5px;color:var(--ink-3);font-weight:700}

/* ---------- cross (platform x category) ---------- */
.cross-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cross-card{
background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:16px 18px;
text-align:left;width:100%;color:var(--ink);display:flex;flex-direction:column;gap:5px;
transition:transform .25s cubic-bezier(.22,.8,.3,1),box-shadow .25s ease,border-color .25s ease;
}
.cross-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm);transform:translate(-2px,-2px)}
.cross-card .cc-top{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.cross-card h3{margin:0;font-size:16.5px;font-weight:900}
.cross-card .cc-n{font-family:"Archivo",sans-serif;font-weight:800;font-size:24px;color:var(--accent)}
.cross-card .cc-n small{font-size:12px;color:var(--ink-3);font-family:"Noto Sans JP",sans-serif;font-weight:700}
.cross-card .cc-subs{font-size:12px;color:var(--ink-3);overflow-wrap:anywhere}
.cross-card.zero{opacity:.5}
.seg-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.seg-tab{
border:1.5px solid var(--line);background:var(--surface);color:var(--ink-2);
border-radius:10px;padding:9px 18px;font-weight:900;font-size:15px;
transition:transform .2s cubic-bezier(.22,.8,.3,1),background-color .2s ease,color .2s ease,border-color .2s ease;
}
.seg-tab:hover{border-color:var(--line-strong)}
.seg-tab:active{transform:scale(.96)}
.seg-tab[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.rank-cats{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.rank-empty{padding:34px 22px;text-align:center;color:var(--ink-2);font-size:14.5px}
.rank-empty b{color:var(--ink)}

/* ---------- faq ---------- */
.faq-list{display:grid;gap:10px}
.faq{
background:var(--surface);border:1.5px solid var(--line);border-radius:14px;overflow:hidden;
transition:border-color .25s ease;
}
.faq.open{border-color:var(--line-strong)}
.faq-q{
width:100%;display:flex;align-items:center;gap:10px;text-align:left;background:none;border:0;
padding:15px 18px;font-weight:900;font-size:14.5px;color:var(--ink);
}
.faq-q .fq-pf{flex:none}
.faq-q .fq-arrow{margin-left:auto;flex:none;color:var(--accent);font-weight:900;transition:transform .35s cubic-bezier(.22,.8,.3,1)}
.faq.open .faq-q .fq-arrow{transform:rotate(180deg)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.22,.8,.3,1)}
.faq.open .faq-a{grid-template-rows:1fr}
.faq-a>div{overflow:hidden}
.faq-a p{margin:0;padding:0 18px 16px;font-size:14px;color:var(--ink-2)}
.faq-a a{color:var(--actor);overflow-wrap:anywhere}

@media (max-width:900px){.cross-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cross-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){
.card,.view-in,.sheet-backdrop.open,.sheet-backdrop.open .sheet,.rank-panel,.hub-panel{animation:none}
.reveal{opacity:1;transform:none;transition:none}
.faq-a,.faq-q .fq-arrow,.cov .bar i{transition:none}
}


a.card,a.cat-card,a.cross-card,a.rank-item,a.chip-btn,a.rel-card,a.rel-chip{text-decoration:none;color:inherit}
a.cat-card,a.cross-card{display:block}
.site-nav{display:flex;gap:6px 16px;flex-wrap:wrap;align-items:center;justify-content:space-between;max-width:1120px;margin:0 auto;padding:12px 18px 0;font-size:13.5px;font-weight:700}
.site-nav .brand{font-family:var(--disp);font-weight:800;font-size:18px;text-decoration:none}
.site-nav .brand .at{color:var(--accent)}
.site-nav nav{display:flex;gap:14px;flex-wrap:wrap}
.site-nav nav a{text-decoration:none;color:var(--ink-2)}
.site-nav nav a:hover{color:var(--accent)}
.lang-sw{display:flex;gap:4px}
.lang-sw a{text-decoration:none;padding:3px 9px;border-radius:999px;border:1.5px solid var(--line);font-size:12px;color:var(--ink-2)}
.lang-sw a[aria-current="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.orig-name{display:block;font-size:14px;font-weight:700;color:var(--ink-3);margin-top:2px}
.crumb a{color:inherit}
.verify-body p{font-size:15px;line-height:1.85;margin:0 0 14px}
.panel-hidden{display:none}
.search-form{display:flex;gap:8px;align-items:center;flex:1}
.search-form .search-box{flex:1}
.search-form button{border:2px solid var(--ink);background:var(--ink);color:var(--bg);border-radius:12px;padding:10px 16px;font-weight:900}
.facet-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.facet-row select{font:inherit;font-weight:700;padding:8px 10px;border-radius:10px;border:2px solid var(--line);background:var(--surface);color:var(--ink)}
.x-other{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 18px}
.root-langs{display:grid;gap:14px;max-width:520px;margin:60px auto;padding:0 18px}
.root-langs a{display:block;padding:18px 20px;border:2px solid var(--ink);border-radius:16px;text-decoration:none;font-weight:900;font-size:18px;box-shadow:var(--shadow-sm);background:var(--surface)}
.root-langs small{display:block;font-weight:500;font-size:13px;color:var(--ink-3)}