/* ─────────────────────────────────────────────────────────────────────────
   New Dawnn — Old School RuneScape theme
   Loaded last on every page (hub, bingo, SOTW/BOTW) so it layers over each
   page's own styles. Gives everything the in-game interface look: dark
   brown stone panels with a bevelled edge, orange headings, yellow numbers
   and the game's hard black text shadow. Icons come from the OSRS Wiki.
   ───────────────────────────────────────────────────────────────────────── */
:root{
  --bg:#14100b;--surface:#2a2319;--surface2:#332a1f;--surface3:#3e3426;
  --border:rgba(255,200,120,0.13);--border2:rgba(255,190,110,0.28);
  --text:#ecdfc2;--text2:#cdb68a;--text3:#93805e;
  --gold:#ff981f;--gold-bright:#ffcc33;--gold-dim:rgba(255,152,31,0.14);--gold-border:rgba(255,152,31,0.42);
  --osrs-orange:#ff981f;--osrs-yellow:#ffff00;
  --stone:#2b2419;--stone-hi:rgba(255,236,196,0.17);--stone-lo:rgba(0,0,0,0.62);--stone-edge:#0c0906;
  /* fine grain + larger mottling, like the game's interface stone */
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .45 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --mottle:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='400'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='.018' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55 0 0 0 0 .42 0 0 0 0 .26 0 0 0 .22 0'/></filter><rect width='100%' height='100%' filter='url(%23m)'/></svg>");
}

body{
  background-color:var(--bg);
  background-image:
    radial-gradient(ellipse 70% 45% at 50% 0%,rgba(232,145,42,0.12) 0%,transparent 70%),
    radial-gradient(ellipse 120% 80% at 50% 50%,transparent 55%,rgba(0,0,0,0.55) 100%),
    var(--mottle-soft),var(--grain);
  background-attachment:fixed;
}
/* a gentler, finer version of the mottling for the page background, so the
   panels on top read as the "stone" and the backdrop stays calm */
:root{--mottle-soft:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='.035' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5 0 0 0 0 .38 0 0 0 0 .24 0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23m)'/></svg>")}

/* ── the stone panel ─────────────────────────────────────────────────── */
.card,.modal,.hadm-card,.empty-card,.plist,.adm-sec,.hist-card,.met,.log-wrap,.dash-countdown,.holding-card,.next-row,.q-item,.be-item{
  background-color:var(--stone);
  background-image:linear-gradient(180deg,rgba(255,240,200,0.035) 0%,rgba(0,0,0,0.16) 100%),var(--mottle),var(--grain);
  border:2px solid var(--stone-edge);
  border-radius:3px;
  box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),0 8px 22px rgba(0,0,0,0.5);
}
.empty-card{border-style:solid}
.q-item,.be-item{box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo)}
/* the thin gold lines some pages drew across card tops read as a web UI,
   not a game one — the bevel replaces them */
.card::before,.hub-card::before{display:none}

/* accent-tinted panels keep their colour wash on top of the stone */
.ev-card,.hub-card{
  background-color:var(--stone);
  background-image:radial-gradient(ellipse 120% 90% at 100% 0%,rgba(var(--ac-rgb),0.13) 0%,transparent 55%),linear-gradient(180deg,rgba(255,240,200,0.035) 0%,rgba(0,0,0,0.16) 100%),var(--mottle),var(--grain);
  border:2px solid var(--stone-edge);border-radius:3px;
  box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),inset 0 3px 0 rgba(var(--ac-rgb),0.55),0 10px 26px rgba(0,0,0,0.5);
}
.ev-card::before{display:none}
.hub-card:hover{border-color:var(--stone-edge);box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),inset 0 3px 0 var(--ac),0 16px 34px rgba(0,0,0,0.55),0 0 26px rgba(var(--ac-rgb),0.18)}
a.next-row:hover{border-color:var(--stone-edge);box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),inset 3px 0 0 var(--ac),0 8px 22px rgba(0,0,0,0.5)}

.score-card{border:2px solid var(--stone-edge)!important;border-radius:3px}
.score-card.ta{background-color:var(--stone);background-image:radial-gradient(ellipse 110% 90% at 0% 0%,rgba(95,207,106,0.16) 0%,transparent 60%),var(--mottle),var(--grain);box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),inset 0 3px 0 rgba(95,207,106,0.7),0 12px 30px rgba(0,0,0,0.45)}
.score-card.tb{background-color:var(--stone);background-image:radial-gradient(ellipse 110% 90% at 0% 0%,rgba(242,104,95,0.16) 0%,transparent 60%),var(--mottle),var(--grain);box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),inset 0 3px 0 rgba(242,104,95,0.7),0 12px 30px rgba(0,0,0,0.45)}
.score-card::before{display:none}

/* header bar: a strip of interface stone */
.header{
  background-color:#221c14;
  background-image:linear-gradient(180deg,rgba(255,240,200,0.05) 0%,rgba(0,0,0,0.25) 100%),var(--mottle),var(--grain);
  border-bottom:2px solid var(--stone-edge);
  box-shadow:inset 0 -1px 0 rgba(255,152,31,0.35),0 4px 14px rgba(0,0,0,0.6);
}
.logo,.hero-title,.bh-title,.holding-logo{color:var(--osrs-orange)}
.logo{text-shadow:1px 1px 0 #000,0 0 16px rgba(255,152,31,0.35)}
.logo span,.hero-title span{color:#fff6dc}
.hero-title{text-shadow:2px 2px 0 #000,0 0 38px rgba(255,160,50,0.45)}
.bh-title,.holding-logo{text-shadow:2px 2px 0 #000,0 0 26px rgba(255,160,50,0.4)}

/* ── type: orange headings, yellow numbers, hard black shadow ─────────── */
.sec-hdr,.card-hdr,.adm-sec-ttl,.plhdr,.modal-hdr,.hadm-title,.hero-eyebrow,.bh-eyebrow,.dcd-title,.holding-label,.hv-title,.board-nm{color:var(--osrs-orange);text-shadow:1px 1px 0 #000}
.sec-hdr::after{background:linear-gradient(90deg,rgba(255,152,31,0.45),transparent)}
.ev-title,.hub-name,.next-title,.hero-title,.q-title,.hist-card-title{text-shadow:1px 1px 0 #000}
.hub-name,.ev-title{color:#fff1cf}
.cd b,.dcd-num,.cd-num,.sc-pts,.met-v,.lb .val,.pod-val{color:var(--osrs-yellow);text-shadow:1px 1px 0 #000,0 0 12px rgba(255,255,0,0.18)}
.next-when b{color:var(--osrs-yellow);text-shadow:1px 1px 0 #000}
.score-card.ta .sc-pts,.score-card.tb .sc-pts{color:var(--osrs-yellow)}
.cd div,.dcd-unit{background:#0f0c08;border:1px solid var(--stone-edge);border-radius:2px;box-shadow:inset 1px 1px 0 var(--stone-lo),inset -1px -1px 0 rgba(255,236,196,0.08)}

/* ── buttons & tabs: bevelled stone, pressed when active ──────────────── */
.btn,.cta,.adm-btn,.btn-edit,.mbtns button,.holding-hub,.be-add,.be-acts button,.nb,.picker{
  background-color:#3a3024;
  background-image:linear-gradient(180deg,rgba(255,240,200,0.06) 0%,rgba(0,0,0,0.18) 100%),var(--grain);
  border:1px solid var(--stone-edge);border-radius:2px;
  box-shadow:inset 1px 1px 0 rgba(255,236,196,0.2),inset -1px -1px 0 rgba(0,0,0,0.6);
  color:var(--osrs-orange);text-shadow:1px 1px 0 #000;
}
.btn:hover,.cta:hover,.adm-btn:hover,.btn-edit:hover,.mbtns button:hover,.holding-hub:hover,.be-add:hover,.be-acts button:hover,.nb:hover{
  background-color:#4a3e2e;color:var(--gold-bright);border-color:var(--stone-edge);
}
.btn:active,.cta:active,.mbtns button:active{box-shadow:inset 1px 1px 0 rgba(0,0,0,0.6),inset -1px -1px 0 rgba(255,236,196,0.15)}
.cta{color:var(--ac)}
.btn-gold,.mbtns .btn-primary,.adm-btn.on{color:var(--gold-bright)}
.btn-green{color:#7ee089}.btn-red,.be-acts .del{color:#f5877f}
.nav{background-color:#1d1812;background-image:var(--mottle),var(--grain);border:2px solid var(--stone-edge);border-radius:3px;box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo),0 6px 18px rgba(0,0,0,0.45)}
.nb{border-radius:2px;font-family:'Cinzel',serif}
.nb.active{background-color:#2a2219;background-image:var(--grain);color:var(--osrs-yellow);border-color:var(--stone-edge);box-shadow:inset 1px 1px 0 rgba(0,0,0,0.65),inset -1px -1px 0 rgba(255,236,196,0.14)}

/* Admin + Log out sit together on the right of the header */
.header{gap:10px}
.header #adm-tog{margin-left:auto}
.header .logout-btn{margin-left:0;color:var(--text2)}
.header .logout-btn:hover{color:#f5877f}

/* inputs sit sunk into the stone */
input,select,textarea,.mf input,.mf select,.p-in,.p-sel,.inl,.hadm-input{
  background-color:#100c08!important;border:1px solid var(--stone-edge)!important;border-radius:2px;
  box-shadow:inset 1px 1px 0 rgba(0,0,0,0.7),inset -1px -1px 0 rgba(255,236,196,0.08);
}
input:focus,select:focus,textarea:focus{border-color:var(--osrs-orange)!important;outline:none}
input[type=checkbox]{box-shadow:none}

/* ── OSRS icons (from the OSRS Wiki) ──────────────────────────────────── */
.osrs-ico{image-rendering:pixelated;image-rendering:crisp-edges;filter:drop-shadow(1px 1px 0 #000)}
.hub-ico{border-radius:3px;background-color:#1a150f;border:1px solid var(--stone-edge);box-shadow:inset 1px 1px 0 var(--stone-lo),inset -1px -1px 0 rgba(255,236,196,0.1),0 0 16px rgba(var(--ac-rgb),0.12)}
.hub-ico .osrs-ico{width:34px;height:34px;object-fit:contain}

/* bingo tiles: empty tiles become stone too; completed ones keep team colour */
.tile{border-radius:3px}
.tile.st-none{background-color:var(--stone);background-image:linear-gradient(160deg,rgba(255,240,200,0.04) 0%,rgba(0,0,0,0.18) 100%),var(--grain);border-color:var(--stone-edge);box-shadow:inset 1px 1px 0 var(--stone-hi),inset -1px -1px 0 var(--stone-lo)}

/* bingo pre-launch screen: dawn breaking behind the countdown */
.holding{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 50% 112%,rgba(255,226,150,0.42) 0%,rgba(246,198,90,0.20) 16%,rgba(232,145,42,0.09) 34%,transparent 56%),
    radial-gradient(ellipse 120% 80% at 50% 40%,transparent 50%,rgba(0,0,0,0.6) 100%),
    var(--mottle-soft),var(--grain);
}
.holding-card{padding:26px 34px}
.holding-sub{color:var(--text2)}

/* tooltips and toasts */
.hv-tip{background-color:#1f1912;background-image:var(--grain);border:2px solid var(--stone-edge);border-radius:2px;box-shadow:inset 1px 1px 0 var(--stone-hi),0 8px 20px rgba(0,0,0,0.7)}
.toast{background:#1f1912;color:var(--osrs-yellow);border:2px solid var(--stone-edge);border-top:2px solid var(--stone-edge);text-shadow:1px 1px 0 #000;box-shadow:inset 1px 1px 0 var(--stone-hi),0 6px 16px rgba(0,0,0,0.7)}

/* scrollbars in the game's brown */
*{scrollbar-color:#5a4a36 #120e0a}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#120e0a}
::-webkit-scrollbar-thumb{background:#4a3d2d;border:2px solid #120e0a;border-radius:2px}

.site-foot{border-top:2px solid var(--stone-edge);box-shadow:inset 0 1px 0 var(--stone-hi)}
.site-foot .wiki{display:block;margin-top:6px;font-size:10px;opacity:.75}
.site-foot a{color:var(--text2)}