/* ============================================================
   THE SEALED VAULT — shared styles
   Palette: #0B0D14 (void), #11141F (panel), #1B2030 (panel-raised),
            #C9A24B (seal gold), #E8E3D6 (parchment text), #6F7689 (muted)
   Type: 'Fraunces' (display/seal), 'Inter' (body/UI)
   ============================================================ */

:root{
  --void:#0B0D14;
  --panel:#11141F;
  --panel-raised:#171B29;
  --line: rgba(201,162,75,0.16);
  --gold:#C9A24B;
  --gold-bright:#E6C878;
  --parchment:#ECE7DA;
  --muted:#7C8198;
  --danger:#D9695A;
  --success:#7FB88A;
  --radius:14px;
  --shadow: 0 20px 60px rgba(0,0,0,0.45);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background: radial-gradient(ellipse at top, #161a26 0%, var(--void) 55%);
  color: var(--parchment);
  font-family: 'Inter', -apple-system, sans-serif;
  min-height:100vh;
  -webkit-font-smoothing: antialiased;
}

::selection{ background: var(--gold); color:#0B0D14; }

a{ color: var(--gold); text-decoration:none; }

.faint-grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(201,162,75,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,162,75,0.035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, black 0%, transparent 75%);
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:'Inter',sans-serif; font-weight:600; font-size:14.5px;
  letter-spacing:0.01em;
  padding:13px 26px; border-radius:10px; border:1px solid transparent;
  cursor:pointer; transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
  user-select:none;
}
.btn:active{ transform: translateY(1px) scale(0.99); }
.btn-gold{
  background: linear-gradient(180deg, var(--gold-bright), var(--gold));
  color:#1A140A;
  box-shadow: 0 8px 24px rgba(201,162,75,0.25);
}
.btn-gold:hover{ box-shadow: 0 10px 30px rgba(201,162,75,0.4); }
.btn-ghost{
  background: transparent; color: var(--parchment);
  border:1px solid var(--line);
}
.btn-ghost:hover{ border-color: var(--gold); color: var(--gold-bright); }
.btn:disabled{ opacity:0.5; cursor:not-allowed; }

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar{ width:8px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background: var(--line); border-radius:8px; }