/* Prisonia — ember palette.
   Warm orange accent on the same dark base as before. The accent set is
   #ff8a1f (base) / #ffa64d (hover) / #c25e00 (deep edge); every text pairing
   below was checked against WCAG AA on the dark base. */
:root{
  --bg-0:#080605;
  --bg-1:#191310;
  --ink:#f6efe4;
  --ink-dim:rgba(246,239,228,.70);
  --ink-faint:rgba(246,239,228,.52);

  --accent:#ff8a1f;          /* ember orange */
  --accent-bright:#ffa64d;   /* hover / highlight */
  --accent-deep:#c25e00;     /* deep edge, borders, shadow */
  --accent-soft:rgba(255,138,31,.14);
  --accent-line:rgba(255,138,31,.36);
  --glow:rgba(255,138,31,.30);

  --violet:#b07cf0;          /* &d / &5 VIP prefix, from the 2017 store */
  --stone:#2a231d;

  --panel:#15100c;
  --panel-2:#1d1510;
  --line:rgba(255,255,255,.085);

  --shadow-block:#2a1204;

  --art:none;
  --art-opacity:0;
}

/* ---- shared chrome that carries a hard-coded green in site.css ---------- */
a{color:var(--accent-bright)}
.topbar{background:rgba(10,7,5,.92)}
.topbar .brand span{color:var(--accent)}
.topbar nav a.is-active{color:var(--accent-bright)}
.hero{
  background:
    linear-gradient(180deg, rgba(12,8,5,.25) 0%, rgba(8,6,5,.72) 62%, var(--bg-0) 100%),
    var(--art) center 32%/cover no-repeat,
    radial-gradient(120% 90% at 50% 0%, var(--bg-1), var(--bg-0) 70%);
}
.btn{
  border-color:var(--accent-line);
  background:var(--accent-soft);
  color:var(--ink);
}
.btn:hover{
  background:rgba(255,138,31,.22);
  border-color:var(--accent);
  color:var(--ink);
}
.module > header::before{background:var(--accent)}
.tile .fallback{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent)}
.toast{background:var(--panel-2);border-color:var(--accent-line);color:var(--ink)}

/* ---- store chrome that is hard-coded green in store.css ----------------- */
.store-head .stub{
  border-color:rgba(255,138,31,.38);
  background:rgba(255,138,31,.10);
  color:#ffc27a;
}
.pkg-art{
  background:
    radial-gradient(80% 80% at 50% 20%, rgba(255,255,255,.07), transparent 70%),
    repeating-conic-gradient(from 0deg at 50% 50%, rgba(255,255,255,.028) 0% 25%, transparent 0% 50%) 0 0/26px 26px,
    #100b08;
}
.pkg-badge{
  background:rgba(255,138,31,.16);
  border-color:rgba(255,138,31,.42);
  color:#ffc27a;
}
.payments .av{background:linear-gradient(135deg,#4a2a12,#241307)}
.modal{background:rgba(5,3,2,.74)}
.modal-card{background:linear-gradient(180deg,var(--panel-2),#0d0907)}
.modal-art{background:radial-gradient(80% 80% at 50% 30%, rgba(255,255,255,.06), transparent 70%),#0c0805}
.notice{
  border-color:rgba(255,138,31,.32);
  background:rgba(255,138,31,.08);
  color:#f3d6b8;
}
.notice .h{color:#ffc27a}
.toast{background:var(--panel-2)}

/* ---- heat haze behind the splash ---------------------------------------- */
.stage::before{
  content:"";
  position:absolute;
  left:50%;
  top:45%;
  width:min(76vw,940px);
  aspect-ratio:1.55;
  transform:translate(-50%,-50%);
  background:radial-gradient(closest-side, rgba(255,138,31,.18), rgba(255,138,31,.055) 46%, transparent 72%);
  opacity:.55;
  pointer-events:none;
  z-index:-1;
  animation:pri-heat 7s ease-in-out infinite alternate;
}
.stage::after{
  content:"";
  position:absolute;
  inset:-12% -8%;
  z-index:-1;
  pointer-events:none;
  background:repeating-linear-gradient(90deg, rgba(0,0,0,.16) 0 10px, transparent 10px 72px);
  opacity:.16;
  transform:translateX(-3%);
  animation:pri-bars 22s linear infinite;
}
@keyframes pri-heat{
  0%{transform:translate(-50%,-50%) scale(.98);opacity:.42}
  50%{transform:translate(-50%,-52%) scale(1.03);opacity:.64}
  100%{transform:translate(-50%,-49%) scale(1.01);opacity:.5}
}
@keyframes pri-bars{
  from{transform:translateX(-3%)}
  to{transform:translateX(3%)}
}
@media (prefers-reduced-motion:reduce){
  .stage::before,.stage::after{animation:none}
}