/* Devil2K Vault – site styles */
html,body{margin:0}
[hidden]{display:none!important}
img{max-width:100%}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
body.no-grain .grain-box{display:none}
body.splash-pending{overflow:hidden}
.portrait.has-img{background:#070708}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.25) brightness(.85)}
.portrait.has-img::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 40%,rgba(5,5,5,.75)),radial-gradient(circle at 50% 30%,rgba(200,0,0,.25),transparent 60%);mix-blend-mode:multiply}
.portrait::after{z-index:2}
.screen.has-embed{background:#000}
.screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.dlcard{text-decoration:none;color:inherit}
.dlcard.pending .a{color:var(--weather)}
.relic .links{display:flex;gap:14px;align-items:center}
.relic .ext{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;color:var(--weather);text-decoration:none;text-transform:uppercase}
.relic .ext:hover,.relic .ext:focus-visible{color:var(--bone);outline:none}
.relic .real{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;color:var(--bronze);border:1px solid var(--rule);padding:2px 6px}

/* ---------- SPLASH: portal to hell ---------- */
.splash{--f1:#ff1100;--f2:#ff7a00;--f3:#ffd27a;--core:rgba(255,40,0,.9);position:fixed;inset:0;z-index:100;background:#030101;display:grid;place-items:center;overflow:hidden;transition:opacity 1s ease,visibility 1s;color:#eaeaea}
.splash-ember{--f1:#ff5a00;--f2:#ffae00;--f3:#fff0b0;--core:rgba(255,140,0,.9)}
.splash-soul{--f1:#00b4ff;--f2:#6ef2ff;--f3:#e6fdff;--core:rgba(0,170,255,.9)}
.splash-toxic{--f1:#29d600;--f2:#b6ff3a;--f3:#f2ffd0;--core:rgba(80,255,0,.85)}
.splash canvas{position:absolute;inset:0;width:100%;height:100%;display:block;transition:transform 1.2s cubic-bezier(.6,0,.2,1),filter 1.2s}
.splash-inner{position:relative;z-index:2;display:grid;justify-items:center;gap:14px;text-align:center;padding:24px max(20px,env(safe-area-inset-left,0px));max-width:760px;transition:opacity .6s,transform .9s}
.splash-eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.42em;text-transform:uppercase;color:var(--f3);opacity:.8}
.splash-title{font-family:var(--f-deco);font-weight:900;font-size:clamp(44px,9vw,112px);line-height:.95;letter-spacing:.04em;margin:0;text-transform:uppercase;color:#f4ece6;text-shadow:0 0 18px var(--core),0 0 60px var(--f1),0 4px 0 #000;animation:sflicker 3.2s infinite}
@keyframes sflicker{0%,100%{opacity:1}41%{opacity:1}42%{opacity:.72}43%{opacity:1}77%{opacity:.9}78%{opacity:.6}79%{opacity:1}}
.splash-eyebrow,.splash-sub,.splash-notice,.splash-skip{text-shadow:0 2px 6px #000,0 0 14px #000,0 0 2px #000}
.splash-sub{font-family:var(--f-head);font-weight:700;letter-spacing:.24em;font-size:clamp(12px,1.5vw,15px);text-transform:uppercase;margin:0;color:#d8cfc8}
.splash-enter{margin-top:18px;font-size:13px;padding:17px 28px;box-shadow:0 0 40px var(--f1)}
.splash-ember .splash-enter,.splash-soul .splash-enter,.splash-toxic .splash-enter{background:var(--f1);color:#050505}
.splash-skip{background:none;border:none;color:#9a9aa3;font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;padding:8px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.2)}
.splash-skip:hover,.splash-skip:focus-visible{color:#fff;outline:none}
.splash-notice{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;color:#b9b9c2;margin:4px 0 0;background:rgba(0,0,0,.6);padding:4px 10px}
.splash.entering canvas{transform:scale(2.4);filter:brightness(2.2) saturate(1.4)}
.splash.entering .splash-inner{opacity:0;transform:scale(.85)}
.splash.gone{opacity:0;visibility:hidden;pointer-events:none}
@media (prefers-reduced-motion:reduce){.splash-title{animation:none}.splash canvas{transition:none}}

/* Layout: a single-page vault. Monumental audio-reactive sigil hero, then six chambers stacked vertically; a live-ritual drawer drops from the top seal and the Relic Deck seals the bottom edge. */
:root{
  --abyss:#050505;
  --obsidian:#0b0b0e;
  --stone:#121215;
  --seam:#261c1c;
  --blood:#c80000;
  --hellfire:#ff1100;
  --bronze:#8a7968;
  --bone:#eaeaea;
  --weather:#70707b;
  --rule:#261c1c;
  --f-deco:"Cinzel Decorative","Cinzel",Georgia,serif;
  --f-head:"Cinzel",Georgia,"Times New Roman",serif;
  --f-body:"Space Grotesk","Helvetica Neue",Arial,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"Courier New",monospace;
  --cut:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  --glow:.35;
  --energy:0;
  --live-h:0px;
  --corrupt:0;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--abyss);color:var(--bone);font-family:var(--f-body);font-size:16px;line-height:1.6;overflow-x:hidden;padding-bottom:84px}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:70;background:var(--abyss)}
a{color:inherit}
button{font:inherit;color:inherit}
::selection{background:var(--blood);color:var(--bone)}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.mono{font-family:var(--f-mono)}
.muted{color:var(--weather)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* atmosphere */
.grain-box{pointer-events:none;position:fixed;inset:0;z-index:60;overflow:hidden}
.grain{position:absolute;inset:-50%;opacity:calc(.09 + var(--corrupt) * .16);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:grain 1s steps(5) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-2%,3%)}50%{transform:translate(3%,-2%)}75%{transform:translate(-3%,-3%)}100%{transform:translate(0,0)}}
.hellfire{pointer-events:none;position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse 70% 50% at 50% 100%,rgba(200,0,0,var(--glow)),transparent 70%);animation:flicker 5s infinite}
@keyframes flicker{0%,100%{opacity:.8}30%{opacity:1}33%{opacity:.7}60%{opacity:.95}62%{opacity:.75}}
.live-vignette{pointer-events:none;position:fixed;inset:0;z-index:44;box-shadow:inset 0 0 0 0 rgba(200,0,0,0);transition:box-shadow .8s}
body.live .live-vignette{box-shadow:inset 0 0 180px 30px rgba(200,0,0,.5);animation:alarm 1.4s ease-in-out infinite}
@keyframes alarm{0%,100%{opacity:1}50%{opacity:.55}}
body.live{--glow:.55}
.flash{pointer-events:none;position:fixed;inset:0;z-index:80;background:radial-gradient(circle at 50% 50%,#fff,rgba(255,17,0,.8) 40%,transparent 75%);opacity:0}
.flash.on{animation:flash .7s ease-out}
.flash.blood{background:radial-gradient(circle at 50% 50%,rgba(255,40,20,.95),rgba(200,0,0,.85) 45%,rgba(90,0,0,.6) 80%)}
@keyframes flash{0%{opacity:.95}100%{opacity:0}}
main,header,footer{position:relative;z-index:1}
main.shake{animation:shake .55s cubic-bezier(.36,.07,.19,.97)}
main.shake-long{animation:shake .7s cubic-bezier(.36,.07,.19,.97) 2}
@keyframes shake{10%,90%{transform:translate(-2px,1px)}20%,80%{transform:translate(4px,-2px)}30%,50%,70%{transform:translate(-7px,3px)}40%,60%{transform:translate(7px,-3px)}}

/* custom cursor (fine pointers only) */
.cursor{position:fixed;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;z-index:90;pointer-events:none;color:var(--hellfire);opacity:0;transition:opacity .2s,width .2s,height .2s,margin .2s;mix-blend-mode:screen}
.cursor svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.4;transition:transform .35s}
.cursor .dot{fill:currentColor;stroke:none}
html.has-cursor .cursor{opacity:.9}
html.has-cursor,html.has-cursor *{cursor:none}
html.has-cursor input,html.has-cursor textarea,html.has-cursor select{cursor:text}
.cursor.hot{width:48px;height:48px;margin:-24px 0 0 -24px}
.cursor.hot svg{transform:rotate(45deg)}
.cursor.down svg{transform:rotate(45deg) scale(.8)}

/* shared cut-corner frame lines */
.status,.btn-steel,.tab,.stat,.dlcard,.peak,.fmt,.pill.done,.toggle{--cl:var(--rule);background-image:linear-gradient(135deg,transparent 7.6px,var(--cl) 7.6px 8.9px,transparent 8.9px),linear-gradient(315deg,transparent 7.6px,var(--cl) 7.6px 8.9px,transparent 8.9px);background-size:12px 12px;background-repeat:no-repeat;background-position:0 0,100% 100%}

/* THE SEAL – nav */
header.seal{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:50;background:rgba(5,5,5,.66);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--rule)}
.seal-row{display:flex;align-items:center;justify-content:space-between;gap:18px;height:64px}
.mark{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.mark svg{width:30px;height:30px;color:var(--blood)}
.mark span{font-family:var(--f-head);font-weight:900;font-size:19px;letter-spacing:.14em}
.mark span b{color:var(--hellfire);font-weight:900}
nav.anchors{display:flex;gap:20px}
nav.anchors a{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-decoration:none;color:var(--weather);text-transform:uppercase;padding-block:6px;border-bottom:1px solid transparent;white-space:nowrap}
nav.anchors a:hover,nav.anchors a:focus-visible{color:var(--bone);border-bottom-color:var(--blood);outline:none}
.seal-ctrl{display:flex;gap:8px;flex:none}
.toggle,.status{display:flex;align-items:center;gap:9px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;color:var(--weather);border:none;box-shadow:inset 0 0 0 1px var(--rule);padding:8px 12px;clip-path:var(--cut);background-color:var(--obsidian);cursor:pointer;white-space:nowrap}
.toggle i,.status i{width:8px;height:8px;background:var(--weather);display:block;flex:none}
.toggle i{border-radius:50%}
.status i{transform:rotate(45deg)}
.toggle:hover,.status:hover,.toggle:focus-visible,.status:focus-visible{color:var(--bone);outline:none}
.toggle[aria-pressed="true"]{color:var(--bone);--cl:var(--hellfire);box-shadow:inset 0 0 0 1px var(--hellfire);background-color:#1a0303}
.toggle[aria-pressed="true"] i{background:var(--hellfire);box-shadow:0 0 10px var(--hellfire);animation:blink 1s infinite}
@keyframes blink{50%{opacity:.25}}
.status[data-state="armed"]{color:var(--bronze);--cl:var(--bronze)}
.status[data-state="armed"] i{background:var(--bronze)}
.status[data-state="active"]{color:var(--bone);--cl:var(--blood);box-shadow:inset 0 0 0 1px var(--blood)}
.status[data-state="active"] i{background:var(--hellfire);box-shadow:0 0 10px var(--hellfire);animation:beat .4s infinite}
.status[data-state="muted"]{color:var(--weather)}
@keyframes beat{0%,100%{transform:rotate(45deg) scale(1)}50%{transform:rotate(45deg) scale(1.5)}}

/* LIVE DRAWER */
.live-drawer{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 64px);z-index:48;background:rgba(8,5,5,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--blood);box-shadow:0 20px 50px rgba(0,0,0,.6),0 1px 0 rgba(255,17,0,.4);transform:translateY(-110%);transition:transform .5s cubic-bezier(.2,.8,.2,1);visibility:hidden}
body.live .live-drawer{transform:none;visibility:visible}
.ld-grid{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:28px;align-items:center;padding-block:18px}
.screen{position:relative;aspect-ratio:16/9;max-width:100%;clip-path:var(--cut);background:
  repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 3px),
  radial-gradient(circle at 50% 55%,rgba(200,0,0,.45),transparent 60%),#0a0606;display:grid;place-items:center;overflow:hidden}
.screen svg{width:38%;height:auto;fill:none;stroke:var(--hellfire);stroke-width:1.5;filter:drop-shadow(0 0 10px var(--hellfire));animation:spin 14s linear infinite}
.screen .badge{position:absolute;top:10px;left:10px;font-family:var(--f-mono);font-size:10px;font-weight:600;letter-spacing:.14em;background:var(--hellfire);color:#fff;padding:3px 8px;display:flex;gap:6px;align-items:center}
.screen .badge i{width:6px;height:6px;border-radius:50%;background:#fff;animation:blink 1s infinite}
.screen .viewers{position:absolute;top:10px;right:10px;font-family:var(--f-mono);font-size:10px;color:var(--bone);background:rgba(0,0,0,.6);padding:3px 8px;font-variant-numeric:tabular-nums}
.screen .cap{position:absolute;bottom:8px;left:10px;right:10px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;color:var(--weather)}
.ld-info{min-width:0;display:grid;gap:10px}
.ld-title{font-family:var(--f-head);font-weight:900;font-size:clamp(18px,2.4vw,26px);letter-spacing:.08em;margin:0;text-transform:uppercase}
.ld-title span{color:var(--hellfire)}
.ticker{font-family:var(--f-mono);font-size:13px;letter-spacing:.04em;color:var(--bone);border:1px solid var(--rule);background:var(--abyss);padding:10px 14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ticker b{color:var(--hellfire);font-weight:600}
.ticker .sep{color:var(--weather);margin:0 .6em}
.ld-meta{display:flex;gap:18px;flex-wrap:wrap;font-family:var(--f-mono);font-size:11px;color:var(--weather);letter-spacing:.1em;font-variant-numeric:tabular-nums}
.ld-meta b{color:var(--bone);font-weight:400}
.ld-actions{display:flex;gap:8px;flex-wrap:wrap}

/* HERO */
.hero{min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center;padding-block:72px 96px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 38%,rgba(200,0,0,.18),transparent 42%);transition:opacity .25s}
body.overdrive .hero::before{background:radial-gradient(circle at 50% 38%,rgba(255,17,0,.42),transparent 52%);opacity:.6}
body.overdrive.beat .hero::before{opacity:1;transition:none}
.hero-inner{position:relative;display:grid;justify-items:center;gap:6px}
.sigil{width:min(420px,84vw,40vh);aspect-ratio:1;position:relative;margin-bottom:10px;color:var(--bronze);transition:transform .12s ease-out,filter .12s}
.sigil svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:currentColor;overflow:visible}
.sigil .layer-a{opacity:.62;animation:spin 120s linear infinite}
.sigil .layer-b{opacity:.9;animation:spin 70s linear infinite reverse}
.sigil .core{color:var(--bronze);transition:color .6s;filter:drop-shadow(0 0 calc(var(--energy) * 34px) rgba(255,17,0,.9))}
body.overdrive .sigil .core,body.playing .sigil .core{color:var(--hellfire)}
body.overdrive .sigil .layer-a{animation-duration:18s;color:#a0503f}
body.overdrive .sigil .layer-b{animation-duration:11s;color:var(--blood);filter:drop-shadow(0 0 6px rgba(255,17,0,.6))}
.sigil.kick{transform:scale(1.045);filter:drop-shadow(5px 0 0 rgba(255,17,0,.75)) drop-shadow(-5px 0 0 rgba(0,220,255,.45))}
.sigil.kick .core{transform:translateX(2px)}
@keyframes spin{to{transform:rotate(360deg)}}
.eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.32em;color:var(--bronze);text-transform:uppercase}
h1.name{font-family:var(--f-deco);font-weight:900;font-size:clamp(56px,11vw,140px);line-height:.95;letter-spacing:.04em;margin:.32em 0 .05em;text-shadow:0 0 40px rgba(200,0,0,.25);position:relative}
h1.name b{color:var(--hellfire);font-weight:900}
h1.name.kick{text-shadow:4px 0 0 rgba(255,17,0,.6),-4px 0 0 rgba(0,220,255,.35)}
.keeper{text-transform:uppercase;font-family:var(--f-head);font-weight:700;font-size:clamp(13px,1.6vw,17px);letter-spacing:.3em;color:var(--bone)}
.keeper span{color:var(--blood);margin:0 .4em}
.ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:26px}
.btn{font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;padding:15px 22px;clip-path:var(--cut);border:none;cursor:pointer;display:inline-block}
.btn.sm{font-size:11px;padding:10px 14px;letter-spacing:.12em}
.btn-blood{background:var(--blood);color:var(--bone)}
.btn-blood:hover,.btn-blood:focus-visible{background:var(--hellfire);box-shadow:0 0 30px var(--hellfire);outline:none}
.btn-steel{background-color:transparent;color:var(--bone);box-shadow:inset 0 0 0 1px var(--bronze);--cl:var(--bronze)}
.btn-steel:hover,.btn-steel:focus-visible{box-shadow:inset 0 0 0 1px var(--hellfire);color:var(--hellfire);outline:none;--cl:var(--hellfire)}
.scrollhint{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);font-family:var(--f-mono);font-size:10px;letter-spacing:.3em;color:var(--weather)}

/* chambers */
section.chamber{padding-block:110px;border-top:1px solid var(--rule);scroll-margin-top:64px}
.ch-head{display:grid;gap:10px;margin-bottom:44px}
.ch-num{font-family:var(--f-mono);font-size:11px;letter-spacing:.3em;color:var(--blood);text-transform:uppercase;display:flex;align-items:center;gap:12px}
.ch-num::after{content:"";height:1px;width:80px;background:var(--rule)}
h2{font-family:var(--f-head);font-weight:900;font-size:clamp(38px,6vw,72px);line-height:1;letter-spacing:.04em;margin:0;text-transform:uppercase;text-wrap:balance}
.ch-lede{color:var(--weather);max-width:60ch;margin:0}

/* SONIC RITUALS */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.tab{background-color:var(--obsidian);border:none;box-shadow:inset 0 0 0 1px var(--rule);padding:13px 16px;clip-path:var(--cut);cursor:pointer;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.13em;color:var(--weather);text-transform:uppercase}
.tab:hover,.tab:focus-visible{color:var(--bone);outline:none}
.tab[aria-selected="true"]{background-color:#170404;--cl:var(--blood);color:var(--bone);box-shadow:inset 0 0 0 1px var(--blood)}
.relics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.relic{position:relative;clip-path:var(--cut);padding:1px;background:linear-gradient(135deg,#3a2a2a,var(--rule) 40%,#3a2a2a)}
.relic-in{background:linear-gradient(170deg,var(--stone),var(--obsidian));clip-path:var(--cut);padding:22px;display:grid;gap:14px;height:100%;align-content:start}
.relic[hidden]{display:none}
.relic .top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.cat{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--bronze)}
.bpm{font-family:var(--f-mono);font-size:11px;font-weight:600;letter-spacing:.08em;padding:4px 8px;border:1px solid var(--blood);color:var(--hellfire);white-space:nowrap}
.relic h3{font-family:var(--f-head);font-weight:700;font-size:21px;line-height:1.15;letter-spacing:.02em;margin:0;text-wrap:balance}
.relic .kind{color:var(--weather);font-size:14px;margin:-6px 0 0}
.relic .glyph{height:56px;display:flex;align-items:flex-end;gap:3px;opacity:.75}
.relic .glyph i{flex:1;background:linear-gradient(to top,var(--blood),rgba(200,0,0,.12))}
.peaks{display:flex;flex-wrap:wrap;gap:6px}
.peak{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.04em;color:#c9c9cf;background-color:var(--abyss);border:none;box-shadow:inset 0 0 0 1px var(--rule);clip-path:var(--cut);padding:6px 10px;cursor:pointer;font-variant-numeric:tabular-nums}
.peak svg{width:12px;height:12px;fill:var(--hellfire);flex:none}
.peak b{color:var(--bone);font-weight:600}
.peak:hover,.peak:focus-visible{color:var(--bone);box-shadow:inset 0 0 0 1px var(--hellfire);--cl:var(--hellfire);outline:none}
.relic .bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;color:var(--weather);font-variant-numeric:tabular-nums;margin-top:2px}
.playrelic{display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;color:var(--bone);text-transform:uppercase;padding:6px 0}
.playrelic svg{width:14px;height:14px;fill:var(--hellfire)}
.playrelic:hover,.playrelic:focus-visible{color:var(--hellfire);outline:none}
.relic.active{background:linear-gradient(135deg,var(--hellfire),var(--blood) 40%,var(--hellfire))}
.relic.active .relic-in{box-shadow:inset 0 0 40px rgba(255,17,0,.12)}

/* SOUND ALTAR */
.altar{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:24px;align-items:stretch}
.pads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pad{position:relative;border:none;cursor:pointer;text-align:left;padding:22px 20px 18px;min-height:178px;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));background:
  radial-gradient(ellipse 80% 60% at 50% 40%,rgba(138,121,104,.08),transparent 70%),
  repeating-linear-gradient(115deg,rgba(255,255,255,.012) 0 2px,transparent 2px 7px),
  linear-gradient(160deg,#17171a,#0b0b0e);box-shadow:inset 0 0 0 1px var(--rule),inset 0 -20px 40px rgba(0,0,0,.5);display:grid;grid-template-rows:auto 1fr auto;gap:8px;transition:transform .08s}
.pad:hover,.pad:focus-visible{box-shadow:inset 0 0 0 1px var(--bronze),inset 0 -20px 40px rgba(0,0,0,.5);outline:none}
.pad.hit{transform:scale(.97);box-shadow:inset 0 0 0 1px var(--hellfire),inset 0 0 60px rgba(255,17,0,.35)}
.pad .key{font-family:var(--f-mono);font-size:11px;color:var(--weather);letter-spacing:.14em;display:flex;justify-content:space-between}
.pad .key kbd{font-family:var(--f-mono);border:1px solid var(--rule);padding:1px 7px;color:var(--bone)}
.pad .rune{width:46px;height:62px;align-self:center;justify-self:center;color:var(--bronze);transition:color .1s,filter .1s}
.pad .rune svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:square}
.pad.hit .rune{color:var(--hellfire);filter:drop-shadow(0 0 12px var(--hellfire))}
.pad .pn{font-family:var(--f-head);font-weight:700;font-size:15px;letter-spacing:.06em;line-height:1.2}
.pad .ps{font-family:var(--f-mono);font-size:10.5px;color:var(--weather);letter-spacing:.08em}
.scope{clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));background:var(--obsidian);box-shadow:inset 0 0 0 1px var(--rule);padding:20px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:14px;min-height:370px}
.scope-head{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;color:var(--weather)}
.scope-head b{color:var(--bronze);font-weight:400}
.scope canvas{width:100%;height:100%;min-height:200px;display:block;background:
  linear-gradient(rgba(138,121,104,.08) 1px,transparent 1px) 0 0/100% 25%,
  linear-gradient(90deg,rgba(138,121,104,.08) 1px,transparent 1px) 0 0/10% 100%,#050505;border:1px solid var(--rule)}
.meter{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;font-family:var(--f-mono);font-size:10.5px;color:var(--weather);letter-spacing:.14em;font-variant-numeric:tabular-nums}
.meter .bar{height:8px;background:#141417;position:relative;overflow:hidden}
.meter .bar i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--bronze),var(--blood) 60%,var(--hellfire))}
.last{font-family:var(--f-mono);font-size:12px;color:var(--bone);letter-spacing:.06em;min-height:18px}
.last span{color:var(--hellfire)}

/* FORBIDDEN CRYPT */
.vaultdoor{position:relative;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));background:linear-gradient(170deg,#101013,#08080a);box-shadow:inset 0 0 0 1px var(--rule);min-height:460px;overflow:hidden}
.bootlegs{padding:34px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;transition:filter 1s,opacity 1s}
.vaultdoor.open{min-height:0}
.vaultdoor:not(.open) .bootlegs{filter:blur(7px) brightness(.32) saturate(.4);opacity:.8;pointer-events:none;user-select:none}
.boot{display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:center;padding:18px;background:rgba(5,5,5,.6);box-shadow:inset 0 0 0 1px var(--rule);clip-path:var(--cut)}
.boot .art{width:52px;height:52px;clip-path:var(--cut);background:radial-gradient(circle,var(--blood) 0 18%,transparent 19%),conic-gradient(from 45deg,#1d1012,#0a0a0c,#2a0c0c,#0a0a0c,#1d1012)}
.boot h3{font-family:var(--f-head);font-weight:700;font-size:17px;line-height:1.2;margin:0}
.boot .bs{font-family:var(--f-mono);font-size:10.5px;color:var(--weather);letter-spacing:.08em;margin-top:2px}
.boot .acts{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}
.crypt-note{grid-column:1/-1;font-family:var(--f-mono);font-size:11px;color:var(--bronze);min-height:16px;letter-spacing:.06em;margin:0}
.seal-layer{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .6s,transform .8s}
.vaultdoor.open .seal-layer{opacity:0;transform:scale(1.15);pointer-events:none}
.chains{position:absolute;inset:0;width:100%;height:100%}
.chains .band{fill:url(#chainPat);opacity:.65}
.seal-core{position:relative;display:grid;justify-items:center;gap:14px;text-align:center;padding:20px}
.seal-status{font-family:var(--f-mono);font-size:11px;letter-spacing:.24em;color:var(--hellfire);background:rgba(5,5,5,.85);padding:6px 12px;border:1px solid var(--blood)}
.holdwrap{position:relative;width:150px;height:150px}
.holdwrap svg.ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.holdwrap .track-c{fill:none;stroke:var(--rule);stroke-width:4}
.holdwrap .prog{fill:none;stroke:var(--hellfire);stroke-width:4;stroke-dasharray:440;stroke-dashoffset:440;filter:drop-shadow(0 0 8px var(--hellfire))}
.holdbtn{position:absolute;inset:14px;border-radius:50%;border:none;cursor:pointer;background:radial-gradient(circle at 50% 35%,#2a1414,#0c0607 70%);box-shadow:inset 0 0 0 1px var(--bronze),0 0 40px rgba(200,0,0,.25);display:grid;place-items:center;color:var(--bronze);touch-action:none;-webkit-user-select:none;user-select:none}
.holdbtn svg{width:46px;height:62px;fill:none;stroke:currentColor;stroke-width:1.6}
.holdbtn:focus-visible{outline:2px solid var(--hellfire);outline-offset:4px}
.holdbtn.holding{color:var(--hellfire);box-shadow:inset 0 0 0 1px var(--hellfire),0 0 60px rgba(255,17,0,.5)}
.vaultdoor.holding .seal-core{animation:tremble .09s linear infinite}
@keyframes tremble{0%{transform:translate(0,0)}25%{transform:translate(1px,-1px)}50%{transform:translate(-1px,1px)}75%{transform:translate(1px,1px)}100%{transform:translate(0,0)}}
.holdlabel{font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;color:var(--bone);background:rgba(5,5,5,.85);padding:8px 14px}

/* THE ENTITY */
.entity{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center}
.portrait{position:relative;aspect-ratio:4/5;max-width:100%;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));background:
  radial-gradient(ellipse 45% 35% at 50% 38%,#2a2a2e 0,#121214 60%,transparent 61%),
  radial-gradient(ellipse 70% 40% at 50% 100%,#1b1b1e 0 60%,transparent 61%),
  radial-gradient(circle at 50% 30%,rgba(200,0,0,.35),transparent 55%),#070708}
.portrait::after{content:"";position:absolute;inset:14px;border:1px solid var(--rule)}
.portrait svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--bronze);opacity:.5}
.portrait .ph{position:absolute;left:24px;bottom:22px;font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--weather)}
.chron h3{font-family:var(--f-mono);font-size:11px;letter-spacing:.3em;color:var(--bronze);margin:0 0 14px;font-weight:400}
.chron p{color:#c9c9cf;max-width:56ch;margin:0 0 16px;font-size:17px}
.chron p:first-of-type::first-line{color:var(--bone);font-weight:500}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:28px}
.stat{background-color:var(--obsidian);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--rule);padding:18px 18px 16px;position:relative}
.stat .rn{position:absolute;right:14px;top:12px;width:10px;height:16px;color:var(--blood)}
.stat .rn svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6}
.stat .k{font-family:var(--f-mono);font-size:10px;letter-spacing:.24em;color:var(--blood)}
.stat .v{font-family:var(--f-head);font-weight:700;font-size:19px;letter-spacing:.03em;margin-top:6px}

/* GATHERINGS */
.log-wrap{overflow-x:auto}
table.log{width:100%;border-collapse:collapse;min-width:640px;font-variant-numeric:tabular-nums}
.log th{font-family:var(--f-mono);font-size:10px;letter-spacing:.24em;color:var(--weather);text-align:left;font-weight:400;padding:0 14px 12px;border-bottom:1px solid var(--rule)}
.log td{padding:18px 14px;border-bottom:1px solid var(--rule);vertical-align:middle}
.log tr:hover td{background:rgba(200,0,0,.06)}
.log .date{font-family:var(--f-mono);font-size:14px;color:var(--bone);white-space:nowrap}
.log .ev{font-family:var(--f-head);font-weight:700;font-size:18px;letter-spacing:.02em}
.log .loc{color:var(--weather)}
.pill{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;padding:6px 10px;display:inline-block;clip-path:var(--cut);white-space:nowrap}
.pill.up{background:var(--blood);color:var(--bone)}
.pill.done{box-shadow:inset 0 0 0 1px var(--rule);color:var(--weather)}
.log tr.past td{opacity:.62}

/* PROMOTER CRYPT */
.fmts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:28px}
.fmt{position:relative;border:none;text-align:left;cursor:pointer;background-color:var(--obsidian);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--rule);padding:20px 18px;display:grid;gap:10px;align-content:start}
.fmt:hover,.fmt:focus-visible{box-shadow:inset 0 0 0 1px var(--bronze);--cl:var(--bronze);outline:none}
.fmt[aria-checked="true"]{background-color:#170404;box-shadow:inset 0 0 0 1px var(--hellfire),inset 0 0 40px rgba(255,17,0,.1);--cl:var(--hellfire)}
.fmt .fd{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;color:var(--bronze)}
.fmt[aria-checked="true"] .fd{color:var(--hellfire)}
.fmt .fn{font-family:var(--f-head);font-weight:700;font-size:17px;line-height:1.2;letter-spacing:.03em}
.fmt .fb{font-family:var(--f-mono);font-size:11px;color:var(--weather)}
.crypt{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:40px;align-items:start}
.rider{background:var(--obsidian);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--rule);padding:22px;margin-bottom:14px}
.rider h3{font-family:var(--f-mono);font-size:11px;letter-spacing:.24em;color:var(--bronze);font-weight:400;margin:0 0 12px}
.rider dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 18px;font-size:14px}
.rider dt{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;color:var(--weather);padding-top:2px}
.rider dd{margin:0;color:var(--bone)}
.dl{display:grid;gap:10px}
.dlcard{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:14px;align-items:center;background-color:var(--obsidian);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--rule);padding:14px 16px;cursor:pointer;border:none;text-align:left;width:100%}
.dlcard:hover,.dlcard:focus-visible{box-shadow:inset 0 0 0 1px var(--hellfire);--cl:var(--hellfire);outline:none}
.dlcard svg{width:32px;height:32px;fill:none;stroke:var(--bronze);stroke-width:1.4}
.dlcard .t{font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.1em}
.dlcard .s{font-size:12.5px;color:var(--weather)}
.dlcard .a{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;color:var(--hellfire)}
.dl-note{font-family:var(--f-mono);font-size:11px;color:var(--bronze);min-height:18px;letter-spacing:.06em}
form.summon{background:linear-gradient(170deg,var(--stone),var(--obsidian));clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,24px 100%,0 calc(100% - 24px));box-shadow:inset 0 0 0 1px var(--rule);padding:34px}
form.summon h3{font-family:var(--f-head);font-weight:900;font-size:28px;letter-spacing:.06em;margin:0 0 4px;text-transform:uppercase}
form.summon .sub{color:var(--weather);margin:0 0 24px;font-size:14px}
.f{display:grid;gap:6px;margin-bottom:16px}
.f label{font-family:var(--f-mono);font-size:10px;letter-spacing:.22em;color:var(--weather);text-transform:uppercase}
.f input,.f select,.f textarea{width:100%;background:var(--abyss);border:1px solid var(--rule);color:var(--bone);font-family:var(--f-body);font-size:16px;padding:12px 14px;border-radius:0}
.f input[readonly]{color:var(--hellfire);font-family:var(--f-mono);font-size:13px;letter-spacing:.06em;border-color:var(--blood)}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--hellfire);box-shadow:0 0 0 1px var(--hellfire),0 0 18px rgba(255,17,0,.25)}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.summoned{font-family:var(--f-mono);font-size:12px;color:var(--hellfire);margin-top:14px;letter-spacing:.06em}

footer{border-top:1px solid var(--rule);padding-block:40px}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
.social{display:flex;gap:18px;flex-wrap:wrap}
.social a{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--weather)}
.social a:hover,.social a:focus-visible{color:var(--hellfire);outline:none}

/* OVERKILL + TOAST */
body.overkill{--glow:.95}
body.overkill .live-vignette{box-shadow:inset 0 0 220px 60px rgba(255,17,0,.65);animation:alarm .35s ease-in-out infinite}
body.overkill .sigil .layer-a{animation-duration:4s}
body.overkill .sigil .layer-b{animation-duration:2.5s;color:var(--hellfire)}
body.overkill h1.name{animation:rgbsplit .18s steps(2) infinite}
@keyframes rgbsplit{0%{text-shadow:6px 0 0 rgba(255,17,0,.8),-6px 0 0 rgba(0,220,255,.5)}100%{text-shadow:-4px 2px 0 rgba(255,17,0,.8),4px -2px 0 rgba(0,220,255,.5)}}
.toast{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 84px);z-index:85;transform:translate(-50%,-20px);opacity:0;pointer-events:none;background:#140202;border:1px solid var(--hellfire);box-shadow:0 0 40px rgba(255,17,0,.5);padding:14px 22px;font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;color:var(--bone);text-align:center;transition:opacity .3s,transform .3s;max-width:calc(100vw - 32px)}
.toast b{display:block;color:var(--hellfire);font-size:15px;letter-spacing:.2em;margin-bottom:4px}
.toast.on{opacity:1;transform:translate(-50%,0)}
.relic.vip{background:linear-gradient(135deg,var(--hellfire),#ff7a00 50%,var(--hellfire));animation:vipglow 1.6s ease-in-out infinite}
@keyframes vipglow{50%{filter:drop-shadow(0 0 18px rgba(255,17,0,.6))}}
.vipbadge{font-family:var(--f-mono);font-size:10px;font-weight:600;letter-spacing:.18em;background:var(--hellfire);color:#fff;padding:3px 8px}
.egg{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:#2e2e34}

/* SACRIFICE A DEMO */
.sacrifice{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center}
.dropzone{position:relative;width:min(380px,100%);aspect-ratio:1;margin:0 auto;border-radius:50%;overflow:hidden;display:grid;place-items:center;text-align:center;cursor:pointer;color:var(--bronze);isolation:isolate}
.dropzone input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.dropzone:focus-within{outline:2px solid var(--hellfire);outline-offset:6px}
.dz-rings{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:currentColor;animation:spin 80s linear infinite;transition:color .3s}
.dz-glow{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle at 50% 60%,rgba(200,0,0,.18),transparent 65%);transition:background .4s,box-shadow .4s;z-index:-1}
.dz-inner{position:relative;display:grid;gap:10px;justify-items:center;padding:0 16%}
.dz-inner svg{width:54px;height:54px;fill:none;stroke:currentColor;stroke-width:1.4}
.dz-title{font-family:var(--f-head);font-weight:900;font-size:clamp(17px,2vw,21px);letter-spacing:.08em;color:var(--bone);line-height:1.2}
.dz-sub{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;color:var(--weather)}
.embers{position:absolute;inset:0;border-radius:50%;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .3s;z-index:-1}
.embers i{position:absolute;bottom:-10px;width:5px;height:5px;border-radius:50%;background:#ffb070;box-shadow:0 0 8px 2px var(--hellfire);animation:rise 1.8s linear infinite;opacity:0}
@keyframes rise{0%{transform:translate(0,0) scale(1);opacity:0}15%{opacity:1}100%{transform:translate(var(--dx,10px),-340px) scale(.2);opacity:0}}
.dropzone.burning{color:var(--hellfire)}
.dropzone.burning .dz-rings{animation-duration:6s;filter:drop-shadow(0 0 8px var(--hellfire))}
.dropzone.burning .dz-glow{background:radial-gradient(circle at 50% 80%,rgba(255,120,0,.55),rgba(255,17,0,.35) 40%,transparent 70%);box-shadow:0 0 80px rgba(255,17,0,.45),inset 0 -40px 80px rgba(255,90,0,.35);animation:blaze .5s ease-in-out infinite alternate}
@keyframes blaze{to{transform:scale(1.04);filter:brightness(1.3)}}
.dropzone.burning .embers,.dropzone.accepted .embers{opacity:1}
.dropzone.accepted{color:var(--hellfire)}
.dropzone.accepted .dz-glow{background:radial-gradient(circle at 50% 60%,rgba(255,17,0,.4),transparent 65%)}
.offering{display:grid;gap:14px}
.relicfile{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center;background:var(--obsidian);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--blood);padding:16px}
.relicfile[hidden]{display:none}
.relicfile svg{width:32px;height:32px;fill:none;stroke:var(--hellfire);stroke-width:1.4}
.relicfile .rn1{font-family:var(--f-head);font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.relicfile .rn2{font-family:var(--f-mono);font-size:10.5px;color:var(--weather);letter-spacing:.08em;font-variant-numeric:tabular-nums}
.relicfile .acts{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}
.dz-msg{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.06em;color:var(--bronze);min-height:18px;margin:0}
.dz-msg.err{color:var(--hellfire)}

/* CORRUPTION KNOB */
.corrupt{display:flex;align-items:center;gap:10px}
.knob{width:46px;height:46px;flex:none;cursor:ns-resize;touch-action:none;border-radius:50%;position:relative}
.knob:focus-visible{outline:2px solid var(--hellfire);outline-offset:3px}
.knob svg{width:100%;height:100%;overflow:visible}
.knob .kt{fill:none;stroke:#2a2a30;stroke-width:4;stroke-linecap:butt}
.knob .ka{fill:none;stroke:var(--hellfire);stroke-width:4;filter:drop-shadow(0 0 calc(var(--corrupt) * 8px) var(--hellfire))}
.knob .kb{fill:#141417;stroke:var(--bronze);stroke-width:1}
.knob .kp{stroke:var(--bone);stroke-width:2;stroke-linecap:round}
.klbl{display:grid;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;color:var(--weather);line-height:1.4}
.klbl b{font-size:13px;color:var(--bone);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.corrupt.hot .klbl b{color:var(--hellfire);animation:blink .25s steps(2) infinite}
body.playing .deck{box-shadow:0 -1px 0 rgba(255,17,0,calc(var(--corrupt) * .9)),0 -20px 60px rgba(255,17,0,calc(var(--corrupt) * .25))}

/* RELIC DECK */
.deck{position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(10,10,12,.93);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--rule);padding-bottom:env(safe-area-inset-bottom,0px);transition:border-color .5s,box-shadow .5s}
body.playing .deck{border-top-color:var(--blood)}
.deck.kick{border-top-color:var(--hellfire);box-shadow:0 -12px 48px rgba(255,17,0,.4);transition:none}
.deck-row{display:grid;grid-template-columns:minmax(0,230px) auto minmax(0,1fr) auto auto auto auto;gap:18px;align-items:center;height:76px}
.np{display:flex;align-items:center;gap:12px;min-width:0}
.np .art{width:44px;height:44px;flex:none;clip-path:var(--cut);background:radial-gradient(circle,var(--blood) 0 22%,transparent 23%),radial-gradient(circle,transparent 0 40%,var(--bronze) 41% 43%,transparent 44%),var(--stone)}
body.playing .np .art{animation:spin 4s linear infinite}
.np .tt{min-width:0}
.np .t1{font-family:var(--f-head);font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.np .t2{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;color:var(--weather);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pbtn{width:46px;height:46px;border:none;background:var(--blood);clip-path:var(--cut);cursor:pointer;display:grid;place-items:center}
.pbtn:hover,.pbtn:focus-visible{background:var(--hellfire);outline:none}
.pbtn svg{width:18px;height:18px;fill:var(--bone)}
.wave{display:grid;gap:4px;min-width:0}
.vizbox{position:relative;height:30px}
.viz{position:absolute;inset:0;display:flex;align-items:flex-end;gap:2px;cursor:pointer}
.viz i{flex:1;min-width:1px;background:#2a2a30;height:20%}
.viz i.done{background:var(--blood)}
.pmark{position:absolute;top:-9px;width:12px;height:12px;margin-left:-6px;border:none;padding:0;background:transparent;cursor:pointer;z-index:2}
.pmark::before{content:"";position:absolute;inset:2px;background:var(--bone);transform:rotate(45deg);box-shadow:0 0 6px rgba(255,17,0,.8)}
.pmark:hover::before,.pmark:focus-visible::before{background:var(--hellfire)}
.pmark:focus-visible{outline:none}
.pmark .tip{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);font-family:var(--f-mono);font-size:10px;white-space:nowrap;background:var(--abyss);border:1px solid var(--blood);padding:3px 7px;color:var(--bone);opacity:0;pointer-events:none;transition:opacity .15s}
.pmark:hover .tip,.pmark:focus-visible .tip{opacity:1}
.times{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:10px;color:var(--weather);font-variant-numeric:tabular-nums}
.pbpm{font-family:var(--f-mono);font-size:12px;font-weight:600;color:var(--hellfire);border:1px solid var(--blood);padding:6px 9px;white-space:nowrap;font-variant-numeric:tabular-nums;min-width:96px;text-align:center}
.pulse-sw{display:flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;color:var(--weather);background:none;border:none;cursor:pointer;white-space:nowrap;padding:0}
.pulse-sw .sw{width:32px;height:16px;background:#1a1a1e;box-shadow:inset 0 0 0 1px var(--rule);position:relative;flex:none}
.pulse-sw .sw::after{content:"";position:absolute;top:3px;left:3px;width:10px;height:10px;background:var(--weather);transition:left .2s,background .2s}
.pulse-sw[aria-checked="true"]{color:var(--bone)}
.pulse-sw[aria-checked="true"] .sw::after{left:19px;background:var(--hellfire);box-shadow:0 0 8px var(--hellfire)}
.pulse-sw:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.vol{display:flex;align-items:center;gap:8px}
.vol svg{width:16px;height:16px;fill:none;stroke:var(--weather);stroke-width:2}
.vol input{width:84px;accent-color:var(--blood)}

@media (max-width:1120px){
  nav.anchors{display:none}
}
@media (max-width:1000px){
  .relics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .altar,.entity,.crypt{grid-template-columns:minmax(0,1fr)}
  .fmts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portrait{max-width:440px}
  .deck-row{grid-template-columns:minmax(0,1fr) auto auto auto}
  .deck .wave,.deck .vol,.deck .pulse-sw{display:none}
  .sacrifice{grid-template-columns:minmax(0,1fr)}
  .ld-grid{grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:18px}
}
@media (max-width:600px){
  section.chamber{padding-block:76px}
  .relics,.bootlegs{grid-template-columns:minmax(0,1fr)}
  .bootlegs{padding:20px}
  .two{grid-template-columns:minmax(0,1fr)}
  form.summon{padding:24px 20px}
  .status span,.toggle span{display:none}
  .mark span{font-size:16px}
  .hero{padding-block:88px 72px}
  .pad{min-height:150px;padding:18px 14px 14px}
  .fmts{grid-template-columns:minmax(0,1fr)}
  .ld-grid{grid-template-columns:minmax(0,1fr);gap:12px;padding-block:12px}
  .screen{display:none}
  .pbpm{display:none}
  .klbl span{display:none}
  .deck-row{gap:12px}
}
@media (prefers-reduced-motion:reduce){
  .grain,.hellfire,.sigil svg,.screen svg,body.playing .np .art,body.live .live-vignette{animation:none!important}
  main.shake,main.shake-long,.vaultdoor.holding .seal-core,body.overkill h1.name,.dz-rings,.embers i,.dropzone.burning .dz-glow,.relic.vip{animation:none!important}
  .sigil.kick{transform:none;filter:none}
  html{scroll-behavior:auto}
}

/* ---------- BRAND: logo, emblem, wordmark ---------- */
.brand-mask{display:block;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.mark{gap:10px}
.mark-emblem{width:34px;height:33px;color:var(--hellfire);flex:none}
.mark-word{width:112px;aspect-ratio:1200/247;background:linear-gradient(90deg,var(--bone) 0 var(--split,64%),var(--hellfire) var(--split,64%))}
.mark-text{font-family:var(--f-head);font-weight:900;font-size:19px;letter-spacing:.14em}
.mark-text b{color:var(--hellfire)}
.sigil .core-wrap{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;filter:drop-shadow(0 0 calc(var(--energy) * 30px) rgba(255,17,0,.95)) drop-shadow(0 0 12px rgba(0,0,0,.9));transition:transform .12s ease-out}
.sigil .core-emblem{width:41%;aspect-ratio:640/610;margin-top:-2%;color:var(--bone);transition:color .5s}
body.overdrive .sigil .core-emblem,body.playing .sigil .core-emblem,body.overkill .sigil .core-emblem{color:var(--hellfire)}
.sigil.kick .core-wrap{transform:scale(1.06) translateX(2px)}
h1.name.has-logo{width:min(720px,84vw);aspect-ratio:1200/247;margin:.55em 0 .35em;font-size:0;line-height:0;text-shadow:none;filter:drop-shadow(0 0 34px rgba(200,0,0,.28))}
h1.name.has-logo .wordmark{width:100%;height:100%;background:linear-gradient(90deg,var(--bone) 0 var(--split,64%),var(--hellfire) var(--split,64%))}
h1.name.has-logo.kick{text-shadow:none;filter:drop-shadow(5px 0 0 rgba(255,17,0,.7)) drop-shadow(-5px 0 0 rgba(0,220,255,.45))}
body.overkill h1.name.has-logo{animation:rgbsplitf .18s steps(2) infinite}
@keyframes rgbsplitf{0%{filter:drop-shadow(7px 0 0 rgba(255,17,0,.85)) drop-shadow(-7px 0 0 rgba(0,220,255,.55))}100%{filter:drop-shadow(-5px 2px 0 rgba(255,17,0,.85)) drop-shadow(5px -2px 0 rgba(0,220,255,.55))}}
.played-at{margin:22px 0 0;font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;color:var(--weather);text-transform:uppercase;max-width:62ch;line-height:1.8;text-wrap:balance}
.played-at span{color:var(--blood);margin-right:.6em}
.splash-emblem-wrap{display:block;filter:drop-shadow(0 0 16px var(--f1)) drop-shadow(0 0 42px var(--core));margin-bottom:6px;animation:sflicker 3.2s infinite}
.splash-emblem{width:clamp(96px,13vw,150px);aspect-ratio:640/610;color:#f6eee8}
.foot-logo{width:96px;height:auto;opacity:.85}

/* portrait from photo */
.portrait img{object-position:50% 12%;filter:grayscale(1) contrast(1.18) brightness(.95)}
.aliases{display:grid;gap:4px;margin-top:22px!important;font-family:var(--f-head);font-weight:700;letter-spacing:.06em;color:var(--bone)!important;font-size:15px!important}
.aliases span{font-family:var(--f-mono);font-weight:400;font-size:10.5px;letter-spacing:.24em;color:var(--bronze);text-transform:uppercase}

/* ---------- BATTLEGROUNDS (references) ---------- */
.tally{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 56px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.tally div{padding:22px 20px;display:flex;flex-direction:column-reverse;gap:4px}
.tally div+div{border-left:1px solid var(--rule)}
.tally dt{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.22em;color:var(--weather);text-transform:uppercase}
.tally dd{margin:0;font-family:var(--f-deco);font-weight:900;font-size:clamp(40px,5vw,64px);line-height:1;color:var(--bone);font-variant-numeric:tabular-nums}
.tally div:first-child dd{color:var(--hellfire)}
.ref-h{font-family:var(--f-mono);font-size:11px;font-weight:400;letter-spacing:.3em;color:var(--bronze);text-transform:uppercase;margin:0 0 18px;display:flex;align-items:center;gap:14px}
.ref-h::after{content:"";flex:1;height:1px;background:var(--rule)}
.fest-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:56px}
.fest-year{background:var(--obsidian);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--rule);padding:20px 18px}
.fy{font-family:var(--f-deco);font-weight:900;font-size:34px;line-height:1;color:var(--hellfire);margin-bottom:14px;font-variant-numeric:tabular-nums}
.fest-year ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fest-year li{display:grid;gap:2px;padding-left:14px;position:relative}
.fest-year li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;background:var(--blood);transform:rotate(45deg)}
.fest-year li b{font-family:var(--f-head);font-weight:700;font-size:15px;letter-spacing:.02em;line-height:1.25}
.fest-year li span{font-family:var(--f-mono);font-size:11px;color:var(--weather);letter-spacing:.04em}
.own-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:56px}
.own{padding:22px;background:linear-gradient(160deg,#170404,var(--obsidian) 70%);clip-path:var(--cut);box-shadow:inset 0 0 0 1px var(--seam)}
.oc{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;color:var(--hellfire);text-transform:uppercase}
.on{font-family:var(--f-head);font-weight:900;font-size:20px;line-height:1.2;margin:8px 0 4px}
.ow{color:var(--weather);font-size:14px}
.club-wall{list-style:none;margin:0 0 56px;padding:0;columns:4 220px;column-gap:28px}
.club-wall li{break-inside:avoid;padding:7px 0;border-bottom:1px solid #151212;font-family:var(--f-head);font-weight:700;font-size:14.5px;letter-spacing:.02em;color:#d9d9de}
.club-wall li span{display:block;font-family:var(--f-mono);font-weight:400;font-size:10.5px;letter-spacing:.08em;color:var(--weather);text-transform:uppercase;margin-top:1px}
.radios{display:flex;flex-wrap:wrap;gap:8px}
.radio{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;padding:8px 12px;background:var(--obsidian);box-shadow:inset 0 0 0 1px var(--rule);clip-path:var(--cut);display:inline-flex;gap:8px;align-items:center}
.radio i{font-style:normal;font-size:9.5px;letter-spacing:.16em;background:var(--blood);color:#fff;padding:2px 6px}
.radio.fm{box-shadow:inset 0 0 0 1px var(--blood);color:var(--bone)}
@media (max-width:1000px){
  .fest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tally{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tally div:nth-child(3){border-left:none}
  .tally div:nth-child(n+3){border-top:1px solid var(--rule)}
  .own-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:600px){
  .fest-grid{grid-template-columns:minmax(0,1fr)}
  .mark-word{width:96px}
  .played-at{font-size:10px;letter-spacing:.12em}
}
@media (prefers-reduced-motion:reduce){.splash-emblem-wrap,body.overkill h1.name.has-logo{animation:none}}
@media (max-width:600px){h2{font-size:clamp(26px,8vw,38px)}}

/* ---------- BACKGROUND MEDIA (image or video, set in the admin) ---------- */
.bg-media{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:var(--bg-op,.5);background:#050505}
.bg-media img,.bg-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(var(--bg-blur,0px));transform:scale(var(--bg-scale,1))}
.bg-media::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 75% 70% at 50% 45%,transparent 35%,rgba(5,5,5,.7) 100%)}
.bg-page{position:fixed;z-index:0}
.bg-page::after{background:radial-gradient(ellipse 80% 75% at 50% 45%,transparent 30%,rgba(5,5,5,.75) 100%),linear-gradient(rgba(5,5,5,.25),rgba(5,5,5,.25))}
.bg-hero{z-index:0}
.bg-hero::after{background:radial-gradient(ellipse 70% 60% at 50% 40%,transparent 30%,rgba(5,5,5,.65) 100%),linear-gradient(to bottom,rgba(5,5,5,.35) 0%,transparent 25%,transparent 65%,#050505 100%)}
.hero::before{z-index:1}
.hero-inner,.hero .scrollhint{z-index:2}
.splash-bg{z-index:0;background:#030101;transition:transform 1.2s cubic-bezier(.6,0,.2,1),filter 1.2s}
.splash-bg::after{background:radial-gradient(ellipse 60% 55% at 50% 45%,transparent 25%,rgba(3,1,1,.8) 100%)}
.splash canvas{z-index:1}
.splash.entering .splash-bg{transform:scale(1.35);filter:brightness(1.8) saturate(1.3)}
@media (prefers-reduced-motion:reduce){.splash-bg{transition:none}}
