#ranked-cpu-dialog { color:#eef4ff; background:#101827; border:1px solid #486080; border-radius:20px; width:min(1050px,94vw); max-height:90vh; padding:24px; overflow:auto; box-sizing:border-box; }
#ranked-cpu-dialog::backdrop { background:rgba(0,0,0,.82); }
#ranked-cpu-dialog h2, #ranked-cpu-dialog h3 { margin:8px 0; }
#ranked-cpu-dialog p { line-height:1.6; }
#ranked-cpu-dialog .cpu-head, #ranked-cpu-dialog .cpu-summary, #ranked-cpu-dialog .cpu-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
#ranked-cpu-dialog select { display:block; width:100%; padding:12px; margin-top:8px; background:#1c2a40; color:white; border:1px solid #647c9c; border-radius:8px; }
#ranked-cpu-dialog .cpu-summary { padding:16px 0; color:#6ee7b7; }
#ranked-cpu-dialog .cpu-pick { background:#1a2b42; border:1px solid #456480; border-radius:12px; padding:16px; margin-bottom:20px; }
#ranked-cpu-dialog .cpu-boards { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
#ranked-cpu-dialog .cpu-slots { display:grid; gap:8px; }
#ranked-cpu-dialog .cpu-slots button { display:grid; grid-template-columns:110px 1fr 40px; align-items:center; gap:8px; text-align:left; margin:0; padding:12px; min-height:65px; background:#20344e; color:#fff; border:1px solid #6786ae; border-radius:10px; }
#ranked-cpu-dialog .cpu-slots button:disabled { opacity:1; background:#152134; border-color:#31435c; cursor:default; }
#ranked-cpu-dialog .cpu-slots button:not(:disabled):hover { background:#2a4a68; }
#ranked-cpu-dialog button:focus-visible, #ranked-cpu-dialog select:focus-visible { outline:3px solid #6ee7b7; outline-offset:3px; }
#ranked-cpu-dialog .cpu-slots span { font-size:12px; overflow-wrap:anywhere; }
#ranked-cpu-dialog .cpu-slots b { color:#6ee7b7; text-align:right; }
#ranked-cpu-dialog .cpu-actions { margin-top:20px; }
#ranked-cpu-dialog .slot-img { float:left; margin-right:16px; }
#ranked-cpu-dialog .cpu-portrait { width:72px; height:90px; object-fit:cover; float:left; margin-right:16px; border-radius:8px; }
#ranked-cpu-dialog #cpu-error { color:#ffaaaa; }
@media(max-width:650px) { #ranked-cpu-dialog { padding:14px; } #ranked-cpu-dialog .cpu-boards { grid-template-columns:1fr; } }
#v47-home-flow [data-v47-action="cpu"][hidden] { display:none !important; }
#ranked-cpu-dialog.cpu-battle-active { width:100vw; max-width:none; height:100vh; max-height:100vh; margin:0; border:0; border-radius:0; padding:24px max(20px,calc((100vw - 1500px)/2)); background:radial-gradient(ellipse at top left,#08445a99,transparent 60%),radial-gradient(ellipse at bottom right,#64177566,transparent 65%),#080d1e; }
#ranked-cpu-dialog .cpu-boards { grid-template-columns:minmax(0,1fr) 300px minmax(0,1fr); gap:12px; align-items:start; }
#ranked-cpu-dialog .cpu-team { padding:12px; background:linear-gradient(145deg,#252a32,#17141f); border:1px solid #353555; border-radius:20px; }
#ranked-cpu-dialog .cpu-team h3 { display:flex; justify-content:space-between; color:var(--cpu-color); margin:0 0 12px; font-size:18px; }
#ranked-cpu-dialog .cpu-team h3 small { color:#bbc0ce; background:#ffffff0b; border:1px solid #ffffff22; border-radius:20px; padding:6px 8px; font-size:11px; }
#ranked-cpu-dialog .cpu-team-0 { --cpu-color:#ffcc00; }
#ranked-cpu-dialog .cpu-team-1 { --cpu-color:#00bfff; }
#ranked-cpu-dialog .cpu-slot-row { display:grid; grid-template-columns:108px minmax(0,1fr); gap:8px; min-height:62px; }
#ranked-cpu-dialog .cpu-stat-label { display:flex; align-items:center; justify-content:center; text-align:center; text-transform:uppercase; font-size:13px; line-height:1.1; color:#000; padding:10px 6px; background:var(--cpu-color); border-radius:12px; }
#ranked-cpu-dialog .cpu-slots button { display:flex; justify-content:space-between; gap:8px; padding:10px; min-height:62px; background:#0b0d14cc; border:1px solid #ffffff29; border-radius:14px; font-weight:400; }
#ranked-cpu-dialog .cpu-slots button:disabled { background:#0b0d14cc; border-color:#ffffff29; }
#ranked-cpu-dialog .cpu-slots b { color:var(--cpu-color); }
#ranked-cpu-dialog .cpu-center { position:sticky; top:0; padding:12px; background:linear-gradient(150deg,#252936,#14131e); border:1px solid #36365a; border-radius:20px; }
#ranked-cpu-dialog .cpu-pick { text-align:center; background:linear-gradient(145deg,#16334777,#10121e 70%); border:1px solid #5164a4; border-radius:22px; padding:16px; margin:0; }
#ranked-cpu-dialog .cpu-roll-heading { display:flex; justify-content:space-between; gap:6px; font-size:11px; letter-spacing:1px; color:#b4c3ff; font-weight:900; }
#ranked-cpu-dialog .cpu-roll-heading span { font-size:9px; color:#87e8ba; letter-spacing:0; }
#ranked-cpu-dialog .cpu-roll-image { width:204px; height:204px; max-width:100%; margin:16px auto 12px; background:#0a0d16; border:1px solid #3d466f; border-radius:20px; overflow:hidden; display:flex; align-items:center; justify-content:center; color:#aaa; }
#ranked-cpu-dialog .cpu-roll-image .slot-img,#ranked-cpu-dialog .cpu-roll-image .cpu-portrait { width:100%; height:100%; float:none; margin:0; border-radius:0; object-fit:cover; background-size:cover; background-position:center; }
#ranked-cpu-dialog .cpu-pick h3 { font-size:24px; }
#ranked-cpu-dialog .cpu-pick p { font-size:12px; color:#b7bacb; }
#ranked-cpu-dialog .cpu-roll-button { width:100%; margin:8px 0; padding:16px 8px; background:linear-gradient(110deg,#345dce,#6342b8); color:white; border:1px solid #8c86eb; border-radius:14px; }
#ranked-cpu-dialog .cpu-roll-button:disabled { opacity:.65; cursor:default; }
@media(max-width:1100px) and (min-width:761px) { #ranked-cpu-dialog .cpu-boards { grid-template-columns:minmax(0,1fr) 240px minmax(0,1fr); } #ranked-cpu-dialog .cpu-slot-row { grid-template-columns:82px minmax(0,1fr); } #ranked-cpu-dialog .cpu-stat-label { font-size:11px; } }
@media(max-width:760px) { #ranked-cpu-dialog.cpu-battle-active { padding:12px; } #ranked-cpu-dialog .cpu-boards { grid-template-columns:1fr; } #ranked-cpu-dialog .cpu-center { position:static; grid-row:1; } }
#ranked-cpu-dialog .cpu-ai-panel { margin:20px 0; padding:20px; border:1px solid #6877ac; border-radius:16px; background:#182036; }
#ranked-cpu-dialog .cpu-ai-panel p, #ranked-cpu-dialog .cpu-ai-panel li { font-size:14px; line-height:1.6; }
#ranked-cpu-dialog .cpu-ai-panel ul { padding-left:24px; }