.dv-rankings { --rank-gold:var(--iron-bronze, #aa956c); --rank-muted:#a4a3a0; color:var(--iron-text, #ddd9cf); margin-bottom:28px; min-width:0; }
.dv-rankings * { box-sizing:border-box; }
.dv-rankings a { text-decoration:none; }
.dv-rankings__hero { position:relative; overflow:hidden; padding:34px 32px 28px; border:1px solid rgba(176,161,126,.24); border-radius:5px 5px 0 0; background:radial-gradient(ellipse at 90% 15%,rgba(176,161,126,.12),transparent 60%),linear-gradient(135deg,#1c191b,#101214); }
.dv-rankings__hero::after { content:'✧'; position:absolute; right:24px; top:-65px; font-size:290px; line-height:1; color:rgba(176,161,126,.055); pointer-events:none; }
.dv-rankings__eyebrow { display:flex; align-items:center; gap:10px; color:var(--rank-gold); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.dv-rankings__eyebrow span { color:#737570; }
.dv-rankings__hero h1 { margin:16px 0 12px; font:600 clamp(30px,4vw,44px)/1.12 Georgia,serif; color:#eee7d9; }
.dv-rankings__hero p { max-width:560px; margin:0; color:#b9b8b2; font-size:14px; line-height:1.7; }
.dv-rankings__badges { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.dv-rankings__badges>span { display:flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid rgba(176,161,126,.18); border-radius:6px; background:rgba(176,161,126,.04); color:#c6b99f; font-size:12px; }
.dv-rankings__badges b { color:var(--rank-gold); }
.dv-rankings__groups { display:flex; flex-wrap:wrap; gap:4px; padding:12px; background:#101214; border:1px solid var(--iron-line, rgba(176,161,126,.22)); border-top:0; }
.dv-rankings__groups a { display:flex; flex:1 1 auto; align-items:center; justify-content:center; gap:7px; padding:12px 9px; border:1px solid transparent; border-radius:7px; font-size:12px; color:var(--rank-muted); transition:background .15s,color .15s; }
.dv-rankings__groups a:hover { background:#222426; color:var(--iron-text, #ddd9cf); }
.dv-rankings__groups a[aria-current] { color:var(--rank-gold); border-color:rgba(181,64,69,.45); background:rgba(143,40,48,.18); }
.dv-rankings__groups small { font-size:10px; color:inherit; opacity:.65; }
.dv-rankings__choices { padding:18px 22px; background:#131517; border:1px solid var(--iron-line, rgba(176,161,126,.22)); border-top:0; }
.dv-rankings__boards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.dv-rankings__board { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:48px; padding:12px; border:1px solid #353536; border-radius:7px; color:#bdbdb8; background:#191b1d; font-size:12px; line-height:1.4; }
.dv-rankings__board:hover { color:#fff; border-color:#777469; }
.dv-rankings__board[aria-current] { border-color:rgba(176,161,126,.5); color:#e0c69d; background:linear-gradient(110deg,rgba(143,40,48,.24),rgba(143,40,48,.08)); }
.dv-rankings__board i { flex:none; opacity:.8; }
.dv-rankings__dungeon-label { display:block; margin-bottom:6px; color:var(--rank-muted); font-size:12px; }
.dv-rankings select.dv-rankings__dungeon { width:100%; margin-bottom:14px; }
.dv-rankings__noscript { display:flex; flex-wrap:wrap; gap:10px; padding-bottom:12px; }
.dv-rankings__noscript a { color:#c7b28d; font-size:12px; }
.dv-rankings__body { padding:26px 22px 20px; background:linear-gradient(#101214,#0c0e10); border:1px solid var(--iron-line, rgba(176,161,126,.22)); border-top:0; border-radius:0 0 5px 5px; }
.dv-rankings__heading { display:flex; gap:16px; align-items:center; justify-content:space-between; margin-bottom:22px; }
.dv-rankings__kicker { font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--rank-gold); }
.dv-rankings__heading h2 { margin:8px 0; font:600 24px/1.25 Georgia,serif; color:#e8e4db; }
.dv-rankings__heading p { margin:0; max-width:560px; font-size:12px; line-height:1.6; color:var(--rank-muted); }
.dv-rankings__population { text-align:right; flex:none; color:var(--rank-muted); font-size:11px; }
.dv-rankings__population b { display:block; color:#d8d3c8; font-size:25px; font-weight:500; font-variant-numeric:tabular-nums; }
.dv-rankings__filters { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; margin:0 0 12px; }
.dv-rankings__filters>div { flex:1 1 110px; min-width:0; }
.dv-rankings__filters .dv-rankings__search { flex:2 1 190px; }
.dv-rankings__filters label { display:block; margin:0 0 6px; color:var(--rank-muted); font-size:11px; }
.dv-rankings input,.dv-rankings select { display:block; width:100%; height:42px; padding:0 10px; border:1px solid #3b3c3b; border-radius:6px; background:#0d0f11; color:var(--iron-text, #ddd9cf); font-family:inherit; font-size:12px; }
.dv-rankings input::placeholder { color:#838782; }
.dv-rankings select { color-scheme:dark; }
.dv-rankings__filters button { min-height:42px; padding:0 16px; border:1px solid #96363e; border-radius:5px; background:linear-gradient(#8f2d34,#641b22); color:#eee7db; font-family:inherit; font-size:12px; font-weight:600; cursor:pointer; }
.dv-rankings__filters button:hover { filter:brightness(1.1); }
.dv-rankings__reset { display:inline-block; color:#b8b6af; font-size:11px; margin:0 0 6px; }
.dv-rankings__podium { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:24px 0; align-items:stretch; }
.dv-rankings__winner { text-align:center; position:relative; min-width:0; padding:20px 12px 18px; border:1px solid #444441; border-radius:10px; background:linear-gradient(155deg,#1c1e20,#111315); }
.dv-rankings__winner--1 { border-color:#a78348; background:radial-gradient(ellipse at top,rgba(176,161,126,.12),transparent),linear-gradient(155deg,#292323,#141416); }
.dv-rankings__winner--2 { border-color:#757978; }
.dv-rankings__winner--3 { border-color:#805e48; }
.dv-rankings__medal { display:flex; align-items:center; justify-content:center; gap:7px; color:#b3b7b6; font-size:14px; }
.dv-rankings__medal i { font-size:23px; }
.dv-rankings__winner--1 .dv-rankings__medal { color:var(--iron-bronze, #aa956c); }
.dv-rankings__winner--3 .dv-rankings__medal { color:#d09b77; }
.dv-rankings__winner h3 { overflow-wrap:anywhere; font-size:16px; line-height:1.4; margin:13px 0 5px; color:#e7e3da; }
.dv-rankings__winner p { color:var(--rank-muted); font-size:10px; line-height:1.5; margin:0 0 16px; overflow-wrap:anywhere; }
.dv-rankings__winner p span { margin:0 3px; }
.dv-rankings__winner>strong { display:block; color:#d8d4c9; font-size:19px; font-weight:500; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.dv-rankings__winner--1>strong { color:#e0c69d; }
.dv-rankings__table-scroll { max-width:100%; overflow-x:auto; border:1px solid #303230; border-radius:9px; margin-top:20px; }
.dv-rankings__table { width:100%; border-collapse:collapse; font-size:12px; margin:0; }
.dv-rankings__table thead { background:#1a1c1e; }
.dv-rankings__table th,.dv-rankings__table td { padding:13px 12px; border:0; border-bottom:1px solid rgba(176,161,126,.12); vertical-align:middle; }
.dv-rankings__table thead th { color:#989b98; font-size:10px; font-weight:500; text-transform:uppercase; white-space:nowrap; }
.dv-rankings__table th:first-child { width:48px; text-align:center; }
.dv-rankings__table th:last-child,.dv-rankings__table td:last-child { text-align:right; }
.dv-rankings__table tbody tr:last-child>* { border-bottom:0; }
.dv-rankings__table tbody tr:hover { background:rgba(176,161,126,.045); }
.dv-rankings__row--medal { background:rgba(176,161,126,.025); }
.dv-rankings__place { display:inline-flex; justify-content:center; align-items:center; min-width:26px; height:26px; border-radius:6px; font-size:12px; font-weight:500; color:#969a96; }
.dv-rankings__place--1 { background:rgba(176,161,126,.16); color:#d2b47e; }
.dv-rankings__place--2 { background:rgba(190,194,191,.12); color:#c5c9c8; }
.dv-rankings__place--3 { background:rgba(208,155,119,.12); color:#d09b77; }
.dv-rankings__identity { display:flex; align-items:center; gap:10px; min-width:130px; }
.dv-rankings__identity img { border-radius:7px; object-fit:cover; border:1px solid #444440; flex:none; }
.dv-rankings__identity strong { display:block; color:var(--iron-text, #ddd9cf); font-weight:500; overflow-wrap:anywhere; max-width:210px; }
.dv-rankings__identity small { display:block; margin-top:4px; color:var(--rank-muted); font-size:10px; }
.dv-rankings__mobile-meta { display:none; }
.dv-rankings__empire { display:flex; align-items:center; gap:7px; white-space:nowrap; color:#b4b7b3; font-size:11px; }
.dv-rankings__empire img { border-radius:2px; object-fit:cover; }
.dv-rankings__score { min-width:110px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.dv-rankings__score strong { font-size:13px; color:#c9b28d; font-weight:500; }
.dv-rankings__bar { display:block; height:3px; margin:7px 0 0 auto; width:80px; background:#292b2c; border-radius:3px; }
.dv-rankings__bar>span { display:block; height:100%; border-radius:3px; background:linear-gradient(90deg,#68523a,#d6b379); }
.dv-rankings__pagination { display:flex; align-items:center; justify-content:center; gap:14px; margin:22px 0; font-size:12px; color:var(--rank-muted); }
.dv-rankings__pagination a { padding:9px 12px; border:1px solid #3b3c3b; border-radius:6px; color:#d8d4c9; }
.dv-rankings__pagination a:hover { border-color:#a78348; }
.dv-rankings__footnote { display:flex; flex-wrap:wrap; align-items:baseline; gap:7px; margin:18px 0 14px; font-size:10px; line-height:1.7; color:#969a96; }
.dv-rankings__footnote>span { margin-left:auto; }
.dv-rankings__rules { padding-top:14px; border-top:1px solid #303230; }
.dv-rankings__rules summary { cursor:pointer; font-size:12px; color:#c2c2ba; }
.dv-rankings__rules p { color:#969a96; font-size:11px; line-height:1.7; margin:12px 0 0; }
.dv-rankings__empty { text-align:center; padding:48px 22px; margin-top:20px; border:1px dashed #3b3c3b; border-radius:10px; }
.dv-rankings__empty>i { color:#d6b379; font-size:28px; }
.dv-rankings__empty h3 { margin:18px 0 10px; color:#d9d6cd; font-size:18px; }
.dv-rankings__empty p { max-width:400px; margin:0 auto; color:var(--rank-muted); font-size:12px; line-height:1.7; }
.dv-rankings__sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.dv-rankings :is(a,button,input,select,summary,[tabindex]):focus-visible { outline:2px solid var(--iron-bronze, #aa956c); outline-offset:3px; }
@media(min-width:701px) { .dv-rankings__winner--1 { order:2; } .dv-rankings__winner--2 { order:1; margin-top:12px; } .dv-rankings__winner--3 { order:3; margin-top:20px; } }
@media(max-width:700px) { .dv-rankings__hero { padding:26px 20px 24px; } .dv-rankings__groups { gap:3px; padding:8px; } .dv-rankings__groups a { padding:10px 8px; font-size:11px; } .dv-rankings__choices { padding:14px; } .dv-rankings__boards { grid-template-columns:repeat(2,minmax(0,1fr)); } .dv-rankings__body { padding:22px 14px 18px; } .dv-rankings__heading h2 { font-size:21px; } .dv-rankings__podium { gap:7px; } .dv-rankings__winner { padding:16px 7px; } .dv-rankings__winner h3 { font-size:13px; } .dv-rankings__winner>strong { font-size:15px; } .dv-rankings__table th,.dv-rankings__table td { padding:12px 8px; } .dv-rankings__filters button { flex:1 0 100%; } }
@media(max-width:420px) { .dv-rankings__heading { gap:8px; align-items:flex-start; } .dv-rankings__population b { font-size:21px; } .dv-rankings__population { font-size:9px; } .dv-rankings__podium { grid-template-columns:1fr; } .dv-rankings__winner { display:grid; grid-template-columns:48px minmax(0,1fr) auto; gap:4px 8px; text-align:left; align-items:center; padding:13px; } .dv-rankings__medal { grid-row:1/3; flex-direction:column; gap:3px; } .dv-rankings__winner h3 { margin:0; } .dv-rankings__winner p { margin:0; grid-column:2; } .dv-rankings__winner>strong { grid-column:3; grid-row:1/3; font-size:14px; } .dv-rankings__hero::after { right:-70px; } .dv-rankings__empire span { display:none; } }
@media(max-width:700px) { .dv-rankings__table { table-layout:fixed; } .dv-rankings__table th:first-child { width:36px; } .dv-rankings__table th:last-child { width:112px; } .dv-rankings__table tr>:nth-child(3),.dv-rankings__table tr>:nth-child(4) { display:none; } .dv-rankings__identity { min-width:0; gap:7px; } .dv-rankings__identity>div { min-width:0; } .dv-rankings__identity img { width:28px; height:28px; } .dv-rankings__mobile-meta { display:block; margin-top:3px; line-height:1.5; } .dv-rankings__score { min-width:0; white-space:normal; overflow-wrap:anywhere; } .dv-rankings__score strong { display:block; } }
@media(max-width:420px) { .dv-rankings__identity img { display:none; } }
