/* ══════════════════════════════════════════════════════════════════════════
   HALLOWED GROUND — staff portal
   Loaded only while the Hallowed release is showing, on top of site.css.
   The dashboard is token-driven, so the whole surface re-skins from the
   token layer; everything below that is chrome the tokens cannot reach.
   ══════════════════════════════════════════════════════════════════════════ */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,400&family=Archivo+Narrow:wght@400;500;600;700&display=swap");

/* site.css sets its dark tokens through `:root:not([data-theme="light"])`
   inside a prefers-color-scheme query — specificity (0,2,0) — so a plain
   `:root` here loses to it whenever no theme attribute is set. These
   selectors match in every theme state and outrank it. */
:root:not([data-theme="__none"]):not([data-theme="__none2"]),
:root[data-theme="dark"]:not([data-theme="__none"]),
:root[data-theme="light"]:not([data-theme="__none"]){
  /* ground */
  --bg:#0a0809; --bg2:#0e0b0b; --panel:#120e0e; --card:#161110; --raised:#1f1714; --nav:#0b0808;
  --line:rgba(240,232,216,.085); --line-2:rgba(240,232,216,.17);

  /* ink */
  --text:#f0e8d8; --fg:#f0e8d8;
  --muted:rgba(240,232,216,.66); --dim:rgba(240,232,216,.46);

  --fill:rgba(240,232,216,.05); --fill-2:rgba(240,232,216,.09); --fill-3:rgba(240,232,216,.15);
  --overlay:rgba(6,4,4,.74);
  --on-accent:#150c06;

  /* the season's colour carries every accent */
  --red:#e07b23; --red-br:#f59a3c; --red-10:rgba(224,123,35,.13); --red-25:rgba(224,123,35,.30);
  --accent:#e07b23;
  --gold:#d3a45f; --gold-10:rgba(211,164,95,.13);
  --green:#7fae6a; --green-10:rgba(127,174,106,.14);
  --amber:#e6a24a; --amber-10:rgba(230,162,74,.14);
  --blue:#9fb9b4; --blue-10:rgba(159,185,180,.13);

  --shadow-sm:0 1px 2px rgba(0,0,0,.6);
  --shadow-md:0 10px 30px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.45);
  --shadow-lg:0 34px 80px rgba(0,0,0,.78), 0 6px 18px rgba(0,0,0,.55);
  --shadow-glow:0 6px 26px rgba(224,123,35,.34);
  --glass-shine:inset 0 1px 0 rgba(240,232,216,.06);
  --glass-bg:rgba(18,14,14,.78);

  --f-display:"Cormorant Garamond", Georgia, serif;
  --f-body:"Archivo Narrow", "Helvetica Neue", Arial, sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, "SF Mono", monospace;

  color-scheme:dark;
}

/* Grain and a single warm light over the whole console — the same air as the
   public site, kept faint so tables stay readable. */
body::after{
  content:""; position:fixed; inset:0; z-index:9998; pointer-events:none;
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(224,123,35,.07), transparent 60%),
    radial-gradient(140% 100% at 50% 50%, transparent 55%, rgba(0,0,0,.55) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
  mix-blend-mode:overlay; opacity:.55;
}

/* ── Type ─────────────────────────────────────────────────────────────── */
body{font-family:var(--f-body);letter-spacing:.005em}
h1,h2,h3,.page-title,.card-title,.staff-brand b{font-family:var(--f-display);letter-spacing:-.005em}
.page-title{font-size:38px;font-weight:600;line-height:1.08}
.page-sub{font-family:var(--f-body);letter-spacing:.01em}
.card-title{font-size:18px;font-weight:600;letter-spacing:0}
.grp,.nav-label,th,.eyebrow{font-family:var(--f-body)}
.grp{letter-spacing:.3em;text-transform:uppercase;color:var(--red);opacity:.75;font-size:9px}
th{font-family:var(--f-body);letter-spacing:.16em;text-transform:uppercase;font-size:10px;color:var(--dim)}

/* ── The rail ─────────────────────────────────────────────────────────── */
.staff-nav,.staff-aside,aside.staff-side{
  background:linear-gradient(180deg,#0b0808, #0a0708 62%, #0d0909);
  border-right:1px solid var(--line);
}
.staff-nav a,.staff-nav .nav-label{border-radius:0}
.staff-nav a.active,.staff-nav a[aria-current="page"]{
  background:linear-gradient(90deg, rgba(224,123,35,.16), transparent);
  box-shadow:inset 2px 0 0 var(--red);
  color:var(--text);
}
.staff-nav a:hover{background:rgba(224,123,35,.07)}

/* ── Cards / surfaces ─────────────────────────────────────────────────── */
.card,.panel,.modal{
  border-radius:2px;
  background:linear-gradient(176deg, var(--card), var(--panel));
  border:1px solid var(--line);
  box-shadow:var(--shadow-md), var(--glass-shine);
}
.card:hover{border-color:rgba(224,123,35,.22)}

/* ── Controls ─────────────────────────────────────────────────────────── */
.btn,.btn-sm,button.btn,button.btn-sm{
  border-radius:2px; font-family:var(--f-body);
  letter-spacing:.16em; text-transform:uppercase; font-size:11px; font-weight:600;
}
.btn.primary,.btn-sm.primary,.btn-red{
  background:var(--red); color:#150c06; border-color:var(--red);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22), var(--shadow-glow);
}
.btn.primary:hover,.btn-sm.primary:hover,.btn-red:hover{background:var(--red-br)}
.btn-sm.deny,.btn.deny{color:#f0b9a0;border-color:rgba(224,123,35,.45)}
.btn-sm.deny:hover,.btn.deny:hover{background:rgba(224,123,35,.12);color:#ffd2b5}
input,select,textarea{
  border-radius:2px; background:var(--bg2); border:1px solid var(--line-2);
  font-family:var(--f-body); color:var(--text);
}
input:focus,select:focus,textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-10);outline:none}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}

/* ── The way in ───────────────────────────────────────────────────────── */
/* Discord blurple fights the season; the sign-in button joins the palette. */
.btn-discord{
  background:var(--red); color:#150c06; border-color:var(--red);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22), var(--shadow-glow);
}
.btn-discord:hover{background:var(--red-br);color:#150c06}
.gate .badge-icon{filter:drop-shadow(0 0 22px rgba(224,123,35,.35))}
.gate h1,.gate h2{font-family:var(--f-display)}
.hero-eyebrow{letter-spacing:.34em;color:var(--red)}

/* ── Tables keep their density; only the dressing changes ─────────────── */
table{font-family:var(--f-body)}
tbody tr:hover td{background:rgba(224,123,35,.05)}
.table-scroll{border-radius:2px}

/* ── Topbar ───────────────────────────────────────────────────────────── */
.staff-topbar,.topbar{
  background:linear-gradient(180deg, rgba(11,8,8,.94), rgba(11,8,8,.72));
  border-bottom:1px solid var(--line); backdrop-filter:blur(6px);
}

/* ── The signed-in strip: the avatar is the thing that was broken ─────── */
/* sticky over a scrolling nav, so it has to be opaque — a translucent strip
   let the nav items read straight through the name and avatar */
.staff-user{
  border-top:1px solid var(--line); padding:12px 10px; z-index:2;
  background:linear-gradient(180deg, #0c0909, #0a0708);
  box-shadow:0 -12px 24px -14px #000;
}
.staff-user img{
  width:34px;height:34px;border-radius:50%;object-fit:cover;
  background:var(--raised);                       /* never a blank hole while loading */
  box-shadow:0 0 0 1px rgba(224,123,35,.45), 0 0 14px -4px rgba(224,123,35,.5);
}
.staff-user .name{font-family:var(--f-display);font-size:15px;font-weight:600;letter-spacing:0}
.staff-user .role{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--red);opacity:.85}
.staff-user .logout:hover{color:var(--red-br);background:var(--red-10)}

/* ── Scrollbar, selection, small print ────────────────────────────────── */
::selection{background:var(--red);color:#150c06}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#0a0708}
::-webkit-scrollbar-thumb{background:#241a16;border:2px solid #0a0708;border-radius:0}
::-webkit-scrollbar-thumb:hover{background:#3a2719}
