:root{--bg:#09090b;--panel:#111115;--panel2:#15151a;--line:#2a2930;--ink:#eee9df;--muted:#aaa5aa;--dim:#76737a;--gold:#c7ab72;--red:#a74d4d;--yellow:#c8ac65;--purple:#8d6fa3}*{box-sizing:border-box}html{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Yu Gothic",Meiryo,sans-serif}body{margin:0;background:radial-gradient(circle at 50% -20%,#241b25 0,#09090b 46%)}a{color:inherit}.shell{min-height:100vh}.topbar{height:66px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 1180px)/2));background:#09090bd9;backdrop-filter:blur(10px);position:sticky;top:0;z-index:20}.brand{text-decoration:none;font-weight:800;letter-spacing:.05em;font-size:13px}.topbar nav{display:flex;gap:8px}.topbar nav a{font-size:11px;color:#b9b3b8;text-decoration:none;border:1px solid var(--line);padding:8px 10px;background:#101014}main{width:min(1180px,calc(100% - 32px));margin:auto}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;padding:58px 0 32px;align-items:stretch}.hero-copy{padding:12px 0}.eyebrow{margin:0 0 10px;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.18em}.hero h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500;font-size:clamp(42px,6.6vw,78px);line-height:1.05;margin:0 0 18px}.lead{max-width:650px;color:#c7c0c6;font-size:14px;line-height:1.85}.lead b{color:#fff}.verify{display:inline-flex;gap:10px;align-items:center;margin-top:15px;border:1px solid #4a3b2a;padding:9px 11px;background:#17130f}.verify b{color:#e1c992;font-size:10px;letter-spacing:.12em}.verify span{color:#9c9489;font-size:10px}.hud-demo{border:1px solid var(--line);background:linear-gradient(135deg,#101014,#17131a);padding:16px;min-height:320px}.demo-title{color:#8c858d;font-size:9px;letter-spacing:.16em;font-weight:800}.demo-screen{height:230px;margin:12px 0;border:1px solid #24232a;background:linear-gradient(#0b0b0edb,#050506),radial-gradient(circle,#332738,#09090b);position:relative;overflow:hidden}.portrait-stack{position:absolute;left:14px;top:34px;display:grid;gap:7px}.portrait-stack i{display:block;width:58px;height:31px;border:1px solid #4b4850;background:#151519}.portrait-stack i:nth-child(2){border-color:#665044}.portrait-stack span{font-size:8px;color:#858087;position:absolute;left:70px;top:44px;white-space:nowrap}.perk-diamond{position:absolute;right:28px;bottom:24px;width:130px;height:85px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;align-items:end}.perk-diamond>i{width:26px;height:26px;border:1px solid #58545d;transform:rotate(45deg);background:#18171b}.status-row{position:absolute;bottom:43px;right:0;display:flex;gap:3px}.status-row img{display:block;width:29px;height:29px;object-fit:contain;filter:sepia(1) saturate(3.4) hue-rotate(318deg) brightness(.98)}.status-row img.buff{filter:sepia(1) saturate(2.2) hue-rotate(355deg) brightness(1.08)}.perk-diamond small{position:absolute;right:0;bottom:72px;white-space:nowrap;color:#8d8890;font-size:8px}.hud-demo p{margin:0;color:#918b92;font-size:10px;line-height:1.65}.hud-demo strong{color:#c7c0c6}.search-panel{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:18px;border:1px solid var(--line);background:#101014;margin:12px 0 16px}.search{height:48px;border:1px solid #38363e;background:#0b0b0e;display:flex;align-items:center;padding:0 13px;gap:9px}.search span{font-size:22px;color:#8e8990}.search input{width:100%;border:0;outline:0;background:transparent;color:#fff;font-size:16px}.search input::placeholder{color:#66616a}.filters{display:flex;gap:5px}.filters button{border:1px solid #323139;background:#141418;color:#99939b;padding:10px 11px;cursor:pointer;font-size:10px}.filters button.is-active{border-color:#725a78;color:#e8dde9;background:#201822}.count{margin:0;color:#88838a;font-size:10px;white-space:nowrap}.count strong{color:#fff;font-size:17px;margin-right:3px}.explain{border:1px solid var(--line);background:#0d0d10;padding:13px 15px;display:grid;grid-template-columns:auto auto 1fr;gap:12px;align-items:center}.explain>div{display:flex;gap:7px;align-items:center;font-size:10px;color:#aaa}.explain>div b{padding:5px 7px;border:1px solid #72643f;color:#ddc36c;background:#1c180f}.explain>div:nth-child(2) b{border-color:#774540;color:#d86b62;background:#1d1010}.explain p{margin:0;color:#88828a;font-size:10px;line-height:1.65}.section{padding:54px 0 8px}.section-head{border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:16px}.section-head h2,.mistake h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500;font-size:clamp(27px,4vw,42px);margin:0 0 9px}.section-head>p:last-child{margin:0;color:#a59fa6;font-size:12px;line-height:1.7}.status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.status-card{border:1px solid var(--line);background:linear-gradient(130deg,#131317,#0f0f12);padding:14px;display:grid;grid-template-columns:68px minmax(0,1fr);gap:16px;min-height:190px}.status-card>div:last-child{min-width:0}.status-card[hidden],.killer-state[hidden]{display:none}.status-card.buff{border-top:2px solid #7d6b3d}.status-card.debuff{border-top:2px solid #733f3e}.status-mark{width:68px;height:68px;display:grid;place-items:center;overflow:hidden;padding:6px;border:0;background:transparent;box-shadow:none}.status-mark img{position:static;display:block;width:56px!important;height:56px!important;max-width:56px;max-height:56px;margin:0;object-fit:contain;filter:sepia(1) saturate(3.4) hue-rotate(318deg) brightness(.98);opacity:.95}.buff .status-mark img{filter:sepia(1) saturate(2.2) hue-rotate(355deg) brightness(1.08)}.status-card small{font-size:8px;letter-spacing:.14em;color:#817c83}.status-card h3{margin:3px 0 8px;font-size:20px}.status-card p{margin:0 0 8px;color:#aaa3aa;font-size:11px;line-height:1.68}.status-card .meaning{color:#d2ccd1}.status-card .action b{color:#e6d0a0}.status-card a{color:#d4b7dd}.danger{background:linear-gradient(130deg,#191113,#0f0f12)}.killer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.killer-state{text-decoration:none;border:1px solid var(--line);background:#111115;min-height:190px;padding:12px;display:grid;grid-template-columns:115px 1fr;gap:14px;position:relative;overflow:hidden}.killer-state:hover{border-color:#5b4b60}.killer-state>img{width:115px;height:165px;object-fit:contain;object-position:top center;filter:saturate(.7) brightness(.72);align-self:end}.killer-state div{padding:11px 7px 8px 0;z-index:2}.killer-state small{font-size:8px;letter-spacing:.15em;color:#817a84}.killer-state h3{margin:3px 0 7px;font-size:18px}.killer-state p{margin:0 0 9px;color:#aaa2aa;font-size:10.5px;line-height:1.65}.killer-state b{font-size:9px;color:#c8a6ce}.state-icon{position:absolute;left:68px;top:8px;width:58px;height:58px;display:grid;place-items:center;padding:2px;border:1px solid #4a4650;background:#0a0a0dcc;box-shadow:0 0 0 4px #0a0a0c;z-index:3}.state-icon img{display:block;width:54px!important;height:54px!important;max-width:54px;max-height:54px;object-fit:contain;filter:none}.mistake{padding:54px 0 10px}.mistake-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mistake-grid>div{border:1px solid var(--line);background:#111115;padding:15px}.mistake-grid b{font-size:13px;color:#e0c78f}.mistake-grid p{font-size:10.5px;color:#9d969e;line-height:1.65;margin:8px 0 0}.next-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:40px 0 10px}.next-links a{border:1px solid var(--line);background:#121216;text-decoration:none;padding:18px}.next-links small{display:block;color:#817b83;font-size:9px;letter-spacing:.1em;margin-bottom:5px}.next-links b{font-size:15px}.sources{margin:36px 0 55px;border-top:1px solid var(--line);padding-top:20px}.sources h2{font-size:14px}.sources p{font-size:10px;line-height:1.75;color:#858087}.sources div{display:flex;gap:8px;flex-wrap:wrap}.sources a{font-size:9px;color:#b69abb;border:1px solid #343038;padding:7px 9px;text-decoration:none}.footer{border-top:1px solid var(--line);max-width:1180px;margin:auto;padding:18px 0 35px;display:flex;justify-content:space-between;color:#716d74;font-size:9px;letter-spacing:.08em}@media(max-width:820px){.hero{grid-template-columns:1fr;padding-top:34px}.hud-demo{min-height:270px}.demo-screen{height:180px}.search-panel{grid-template-columns:1fr}.filters{overflow-x:auto;padding-bottom:2px}.filters button{flex:0 0 auto}.explain{grid-template-columns:1fr 1fr}.explain p{grid-column:1/-1}.status-grid,.killer-grid{grid-template-columns:1fr}.mistake-grid{grid-template-columns:1fr}.next-links{grid-template-columns:1fr}.footer{padding-left:16px;padding-right:16px}.killer-state{grid-template-columns:102px 1fr}.killer-state>img{width:102px}.state-icon{left:64px}}@media(max-width:520px){main{width:min(100% - 24px,1180px)}.topbar{height:58px;padding:0 12px}.topbar nav a{padding:7px;font-size:9px}.hero h1{font-size:43px}.lead{font-size:12px}.verify{display:flex;width:100%;justify-content:space-between}.search-panel{padding:12px}.status-card{grid-template-columns:54px minmax(0,1fr);padding:11px;gap:12px;min-height:unset}.status-mark{width:54px;height:54px;padding:4px}.status-mark img{width:46px!important;height:46px!important;max-width:46px;max-height:46px}.status-card h3{font-size:18px}.status-card p{font-size:10.5px}.section{padding-top:42px}.killer-state{grid-template-columns:88px 1fr;min-height:168px;padding:9px;gap:10px}.killer-state>img{width:88px;height:145px}.state-icon{left:50px;top:7px;width:46px;height:46px}.state-icon img{width:42px!important;height:42px!important;max-width:42px;max-height:42px}.killer-state div{padding-top:7px}.killer-state p{font-size:10px}.footer{flex-direction:column;gap:5px}}

/* r17.1: 日本語のページ名が長くなったためヘッダーを折り返し可能にする */
html,body{overflow-x:clip}
.topbar{height:auto;min-height:66px;flex-wrap:wrap;row-gap:6px;padding-top:8px;padding-bottom:8px}
.topbar nav{flex-wrap:wrap;row-gap:6px}
@media(max-width:640px){
  .topbar{min-height:0}
  .topbar .brand{font-size:12px}
  .topbar nav a{font-size:10px;padding:6px 8px}
}