.cp{--cp:#3aa6f0;--cp2:#7fd0ff}
.cp.k-raid{--cp:#f0722a;--cp2:#ffb067}
.cp-h2{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;margin:30px 0 12px;color:var(--hi);font:19px/1.1 var(--f-lbl);letter-spacing:2px;text-transform:uppercase}
.cp-h2 small{color:var(--dim);font:13px var(--f-ui);letter-spacing:.3px;text-transform:none}
.cp-note{margin:10px 0 0;color:var(--dim);font:13.5px/1.45 var(--f-ui)}
.cp-note a{color:var(--link)}
.cp-note b{color:var(--hi);font-family:var(--f-num);font-weight:normal}
.cp-miss{margin:0 0 14px;color:var(--dim);font:15px var(--f-ui)}
.cp-tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0}
.cp-st{padding:3px 10px 2px;background:var(--pn3);color:var(--tx);font:11.5px/1.3 var(--f-lbl);letter-spacing:1.2px;text-transform:uppercase;clip-path:var(--slant)}
.cp-st:empty{display:none}
.cp-st.s-open{background:#2f9e5a;color:#fff}.cp-st.s-upcoming{background:#c99417;color:#0d1017}
.cp-k{padding:3px 10px 2px;background:var(--pn2);border:1px solid var(--ln);color:var(--tx);font:11.5px/1.3 var(--f-lbl);letter-spacing:1px;text-transform:uppercase;text-decoration:none}
.cp-k.hot{background:var(--cp);border-color:var(--cp);color:#fff}
a.cp-k.hot:hover{filter:brightness(1.1);color:#fff}
.cp-when{color:var(--dim);font:14px/1.35 var(--f-ui)}
.cp-when b{margin-left:6px;color:var(--acc-tx);font:15px var(--f-num)}
.cp-boss{color:var(--tx);font:14px/1.35 var(--f-lbl);letter-spacing:.3px}
.cp-art{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;aspect-ratio:4/1;line-height:0;
  background:radial-gradient(ellipse at 50% 60%,color-mix(in srgb,var(--cp) 30%,transparent),transparent 70%),#0b0e16}
.cp-art .cp-ban{position:relative;width:100%;height:100%;object-fit:contain}
.cp-art .cp-face{display:none;height:100%;width:auto;object-fit:contain}
.cp-art.noart .cp-face{display:block}
.cp-art.noart{aspect-ratio:4/1}
.cp-bossart{aspect-ratio:760/540}
.cp-bossart img{width:100%;height:100%;object-fit:cover}
.cp-art.strip{border:1px solid var(--ln)}
.cp-heroes{display:flex;flex-direction:column;gap:12px}
.cp-hero{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:20px;align-items:center;padding:14px;background:var(--pn);
  border:1px solid var(--ln);border-top:3px solid var(--cp);box-shadow:var(--sh);color:var(--tx);text-decoration:none;transition:border-color .15s}
a.cp-hero:hover{border-color:var(--cp);color:var(--tx)}
.cp-hero-i{display:flex;flex-direction:column;gap:9px;min-width:0}
.cp-name{margin:0;color:var(--hi);font:28px/1.1 var(--f-num);letter-spacing:.3px}
span.cp-name,b.cp-name{display:block;font-weight:normal}
.cp-hero.big{margin:0 0 6px;grid-template-columns:minmax(0,640px) minmax(0,1fr)}
.cp-hero.big.boss{grid-template-columns:minmax(0,470px) minmax(0,1fr);align-items:start}
.cp-hero.big .cp-name{font-size:32px}
.cp-acts{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 0}
.cp-rank{display:block;width:min(100%,360px);height:auto;margin-top:4px}
.cp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:12px;margin-top:14px}
.cp-card{display:flex;flex-direction:column;background:var(--pn);border:1px solid var(--ln);box-shadow:var(--sh);color:var(--tx);text-decoration:none;transition:transform .15s,border-color .15s}
.cp-card:hover{transform:translateY(-2px);border-color:var(--cp);color:var(--tx)}
.cp-cb{display:flex;flex-direction:column;gap:5px;padding:10px 13px 12px}
.cp-cb>b{color:var(--hi);font:16.5px/1.2 var(--f-lbl);font-weight:normal}
.cp-cb .cp-boss{color:var(--dim);font-size:13.5px}
.cp-rules{columns:360px 3;column-gap:12px}
.cp-rule{display:block;width:100%;margin:0 0 12px;break-inside:avoid;padding:13px 15px;background:var(--pn);border:1px solid var(--ln);box-shadow:var(--sh)}
.cp-rule h3{margin:0 0 7px;color:var(--hi);font:16px var(--f-lbl);letter-spacing:1.1px;text-transform:uppercase}
.cp-rule h4{margin:10px 0 5px;color:var(--acc-tx);font:14px var(--f-lbl);letter-spacing:1px;text-transform:uppercase}
.cp-rule p{margin:0 0 6px;color:var(--tx);font:14.5px/1.5 var(--f-ui)}
.cp-rule.pic img{display:block;width:100%;height:auto}
.cp-bonus{display:flex;flex-wrap:wrap;gap:10px}
.cp-bg{flex:var(--n,1) 1 calc(var(--n,1) * 166px + 60px);min-width:min(100%,380px);background:var(--pn);border:1px solid var(--ln);border-left:3px solid var(--cp);box-shadow:var(--sh)}
.cp-bg summary{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:10px 14px;cursor:pointer;list-style:none;color:var(--tx);font:14px var(--f-ui)}
.cp-bg summary::-webkit-details-marker{display:none}
.cp-bg summary::before{content:'\25B8';color:var(--dim);transition:transform .15s}
.cp-bg[open] summary::before{transform:rotate(90deg)}
.cp-bi{width:38px;height:38px;object-fit:contain}
.cp-bh{color:var(--hi);font:21px var(--f-num);font-weight:normal;letter-spacing:.3px}
.cp-bn{color:var(--tx);font:14.5px var(--f-lbl)}
.cp-tiers{display:flex;flex-wrap:wrap;gap:5px}
.cp-tiers i{padding:3px 9px 2px;background:var(--pn2);border:1px solid var(--ln);color:var(--dim);font:12.5px/1.3 var(--f-lbl);font-style:normal;letter-spacing:.6px}
.cp-tiers i b{margin-left:2px;color:var(--hi);font:14px var(--f-num);font-weight:normal}
.cp-tiers i.r{border-color:color-mix(in srgb,var(--cp) 55%,var(--ln))}
.cp-bg.wide{flex-basis:100%}
.cp-bc{margin-left:auto;color:var(--dim);font:13px var(--f-lbl);letter-spacing:.8px;text-transform:uppercase}
.cp-chars{padding:6px 12px 16px}
.cp-chars .chara-list{margin:0}
.cp-chars.lp-grid{zoom:.8}
.cp-stages .stg>summary{gap:8px 14px}
.cp-stg>.cp-sb{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 30px;align-items:start}
.cp-sl{min-width:0}
.cp-sr{min-width:0}
.cp-rw{display:flex;flex-wrap:wrap;gap:0 30px}
.cp-rw>div{min-width:0}
.cp-thumb{flex:none;height:46px;width:auto;max-width:170px;object-fit:cover;border:1px solid var(--ln)}
.cp-sd{display:block;margin-top:2px;color:var(--dim);font:12.5px var(--f-ui);letter-spacing:0;text-transform:none}
.cp-sd b{display:none}
.cp-stg.hl{outline:2px solid var(--acc);outline-offset:2px}
.cp-stg{scroll-margin-top:calc(var(--sh-h,0px) + 16px)}
.cp-boosts{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.cp-boosts li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:6px 8px;background:var(--pn2);border:1px solid var(--ln)}
.cp-tg{display:inline-flex;align-items:center;gap:8px;min-width:0;color:var(--hi);text-decoration:none;font:15px/1.2 var(--f-lbl)}
.cp-tg:hover{color:var(--acc-tx)}
.cp-tg img{flex:none;width:40px;height:40px;object-fit:cover;border:1px solid var(--ln)}
.cp-tg small{padding:2px 7px 1px;background:var(--cp);color:#fff;font:11px var(--f-lbl);letter-spacing:1px;text-transform:uppercase;clip-path:var(--slant)}
.cp-fx{display:flex;flex-wrap:wrap;gap:5px}
.cp-fx i{padding:2px 8px;background:var(--pn);border:1px solid var(--ln);color:var(--tx);font:13px/1.35 var(--f-ui);font-style:normal}
.cp-its{display:flex;flex-wrap:wrap;gap:6px}
.cp-it{display:inline-flex;align-items:center;gap:7px;padding:4px 10px 4px 5px;background:var(--pn2);border:1px solid var(--ln);color:var(--tx);font:13.5px/1.2 var(--f-ui)}
.cp-it img{width:30px;height:30px;object-fit:contain}
.cp-it b{color:var(--hi);font:15px var(--f-num);font-weight:normal}
.cp-dmg li>span:first-child small{color:var(--dim);font:11.5px var(--f-lbl);letter-spacing:1px;text-transform:uppercase}
.cp-dmg li>span:first-child b{color:var(--hi);font:16px var(--f-num);font-weight:normal}
.cp-plb{margin-top:18px;background:var(--pn);border:1px solid var(--ln);box-shadow:var(--sh)}
.cp-plb summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:12px 15px;cursor:pointer;list-style:none;color:var(--dim);font:14px var(--f-ui)}
.cp-plb summary::-webkit-details-marker{display:none}
.cp-plb summary::before{content:'\25B8';transition:transform .15s}
.cp-plb[open] summary::before{transform:rotate(90deg)}
.cp-plb summary b{color:var(--hi);font:16px var(--f-lbl);letter-spacing:1.2px;text-transform:uppercase;font-weight:normal}
.cp-plb .cp-note{padding:0 15px 14px}
.cp-tw{max-height:520px;overflow:auto;margin:0 15px;border:1px solid var(--ln)}
.cp-tab{width:100%;border-collapse:collapse}
.cp-tab th,.cp-tab td{padding:6px 10px;border-bottom:1px solid var(--ln);color:var(--tx);font:13.5px var(--f-ui);text-align:right;white-space:nowrap}
.cp-tab th{position:sticky;top:0;background:var(--pn2);color:var(--dim);font:11.5px var(--f-lbl);letter-spacing:1px;text-transform:uppercase}
.cp-tab th:first-child,.cp-tab td:first-child{text-align:left}
.cp-tab td b{color:var(--hi);font:14.5px var(--f-num);font-weight:normal}
.cp-pg{display:flex;justify-content:space-between;gap:12px;margin-top:22px}
.cp-pg a{color:var(--tx);text-decoration:none;font:14px var(--f-lbl);letter-spacing:.5px}
.cp-pg a:hover{color:var(--hi)}
.cp-pg small{color:var(--dim);font:12.5px var(--f-ui);letter-spacing:0}
@media(max-width:900px){
  .cp-hero,.cp-hero.big,.cp-hero.big.boss{grid-template-columns:minmax(0,1fr);padding:12px;gap:12px}
  .cp-hero.big.boss .cp-bossart{max-width:520px}
  .cp-name,.cp-hero.big .cp-name{font-size:24px}
  .cp-stg>.cp-sb{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:600px){
  .cp-thumb{display:none}
  .cp-bc{margin-left:0;flex-basis:100%}
  .cp-bh{font-size:19px}
  .cp-pg{flex-direction:column}
  .cp-chars.lp-grid{zoom:.66}
}