:root {
    color-scheme:light;
    --bg:#f3f5f8; --card:#fff; --ink:#14213d; --muted:#5b6475; --line:#dfe3ea;
    --navy:#0b1f3a; --navy-2:#132d52;
    --accent:#0f766e; --accent-soft:#e3f2f0; --gold:#b8892d; --ok:#15803d; --bad:#b42318;
    --radius:8px;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.5 "Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }
h1 { font-size:26px; margin:0 0 4px; line-height:1.25; }
h2 { font-size:18px; margin:24px 0 10px; }
.dr-wrap { max-width:1040px; margin:0 auto; padding:0 16px; }
.dr-main { padding-top:20px; padding-bottom:40px; min-height:60vh; }
.dr-muted { color:var(--muted); }
.dr-small { font-size:13px; }

/* top bar */
.dr-top { background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; }
.dr-top-in { display:flex; align-items:center; justify-content:space-between; gap:12px; height:56px; }
.dr-brand { font-weight:800; font-size:17px; color:var(--ink); white-space:nowrap; }
.dr-brand:hover { text-decoration:none; }
.dr-logo { color:var(--gold); }
.dr-nav { display:flex; align-items:center; gap:14px; font-size:14px; flex-wrap:wrap; justify-content:flex-end; }
.dr-nav a { color:var(--ink); }

/* buttons & forms */
.dr-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:8px; padding:8px 14px; font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; }
.dr-btn:hover { text-decoration:none; filter:brightness(1.06); }
.dr-btn.ghost { background:transparent; color:var(--accent); }
.dr-btn.danger { background:var(--bad); border-color:var(--bad); }
.dr-btn.ok { background:var(--ok); border-color:var(--ok); }
.dr-btn-sm { padding:5px 10px; font-size:13px; color:#fff; }
.dr-btn[disabled] { opacity:.55; cursor:default; }
input[type=text], input[type=email], input[type=search], input[type=number], input[type=url], select, textarea {
    width:100%; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:8px 10px; font:inherit;
}
textarea { min-height:90px; resize:vertical; }
label { font-size:13px; font-weight:600; display:block; margin:10px 0 4px; }

/* hero + filters */
.dr-hero { margin-bottom:14px; }
.dr-filters { display:grid; grid-template-columns:2fr 1fr 1fr 1fr auto; gap:8px; margin-bottom:12px; }
.dr-tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.dr-tab { padding:6px 14px; border-radius:20px; background:var(--card); border:1px solid var(--line); color:var(--ink); font-size:13px; font-weight:600; }
.dr-tab.on { background:var(--accent); border-color:var(--accent); color:#fff; }
.dr-tab:hover { text-decoration:none; }
@media (max-width:760px) { .dr-filters { grid-template-columns:1fr 1fr; } .dr-filters .dr-q { grid-column:1 / -1; } }

/* list rows */
.dr-list { display:flex; flex-direction:column; gap:8px; }
.dr-row { display:flex; gap:12px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:12px 14px; }
.dr-row.feat { border-color:var(--gold); }
.dr-rank { width:34px; text-align:center; font-weight:800; font-size:18px; color:var(--muted); flex-shrink:0; }
.dr-rank.top { color:var(--gold); }
.dr-row-main { flex:1; min-width:0; }
.dr-row-name { font-weight:700; font-size:15px; color:var(--ink); word-break:break-word; }
.dr-row-meta { font-size:13px; color:var(--muted); display:flex; gap:10px; flex-wrap:wrap; margin-top:2px; }
.dr-chip { display:inline-block; font-size:11px; font-weight:700; padding:1px 8px; border-radius:10px; background:var(--accent-soft); color:var(--accent); vertical-align:middle; }
.dr-chip.claimed { background:#d4edda; color:#1e7e34; }
.dr-chip.unclaimed { background:var(--line); color:var(--muted); }
.dr-sponsored { display:inline-block; font-size:11px; font-weight:700; padding:1px 8px; border-radius:10px; background:#fff3cd; color:#8a6100; }

/* vote button */
.dr-vote { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:52px; padding:6px 8px; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--muted); cursor:pointer; font:inherit; flex-shrink:0; }
.dr-vote:hover { border-color:var(--accent); color:var(--accent); }
.dr-vote.on { background:var(--accent); border-color:var(--accent); color:#fff; }
.dr-vote-ic { font-size:13px; line-height:1; }
.dr-vote-n { font-weight:800; font-size:15px; line-height:1.3; }
.dr-vote.lg { min-width:72px; padding:10px; }
.dr-vote.lg .dr-vote-n { font-size:20px; }

/* cards / detail */
.dr-card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:16px; margin-bottom:12px; }
.dr-detail-head { display:flex; gap:16px; align-items:flex-start; }
.dr-detail-head .dr-row-main { padding-top:2px; }
.dr-facts { display:grid; grid-template-columns:140px 1fr; gap:6px 12px; font-size:14px; }
.dr-facts dt { color:var(--muted); }
.dr-facts dd { margin:0; word-break:break-word; }
@media (max-width:560px) { .dr-facts { grid-template-columns:1fr; } .dr-facts dt { margin-top:6px; } }
.dr-claim-box { border:1px dashed var(--accent); background:var(--accent-soft); border-radius:var(--radius); padding:14px 16px; margin-bottom:12px; }

/* pagination */
.dr-pager { display:flex; gap:6px; justify-content:center; margin-top:16px; flex-wrap:wrap; }
.dr-pager a, .dr-pager span { padding:6px 12px; border:1px solid var(--line); border-radius:8px; background:var(--card); font-size:13px; color:var(--ink); }
.dr-pager .on { background:var(--accent); color:#fff; border-color:var(--accent); }

/* admin tables */
.dr-table { width:100%; border-collapse:collapse; font-size:13px; }
.dr-table th, .dr-table td { padding:7px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.dr-table th { color:var(--muted); font-weight:600; white-space:nowrap; }
.dr-scroll { overflow-x:auto; }
.dr-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:760px) { .dr-grid2 { grid-template-columns:1fr; } }
.dr-switch { display:inline-flex; align-items:center; gap:10px; font-weight:700; }
.dr-pill { display:inline-block; padding:2px 10px; border-radius:10px; font-size:12px; font-weight:700; }
.dr-pill.on { background:#d4edda; color:#1e7e34; }
.dr-pill.off { background:#f8d7da; color:#a71d2a; }
.dr-notice { padding:10px 14px; border-radius:8px; margin-bottom:12px; font-size:14px; }
.dr-notice.ok { background:#d4edda; color:#155724; }
.dr-notice.bad { background:#f8d7da; color:#721c24; }
.dr-notice.info { background:var(--accent-soft); color:var(--ink); }

.dr-empty { text-align:center; padding:50px 16px; color:var(--muted); }
.dr-foot { border-top:1px solid var(--line); background:var(--card); color:var(--muted); font-size:12.5px; padding:14px 0; }
.dr-foot p { margin:4px 0; }

.dr-toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%, 20px); background:#1c1e21; color:#fff; padding:10px 16px; border-radius:8px; font-size:14px; opacity:0; transition:all .25s; z-index:100; max-width:90vw; }
.dr-toast.show { opacity:1; transform:translate(-50%, 0); }
.dr-toast.bad { background:var(--bad); }

/* daily votes badge */
.dr-votes-badge { display:inline-flex; align-items:center; gap:3px; padding:3px 10px; border-radius:14px; background:var(--accent-soft); color:var(--accent); font-size:12.5px; font-weight:700; white-space:nowrap; }
.dr-votes-badge .dr-vote-ic { font-size:10px; }