@import url("https://db.onlinewebfonts.com/c/35dfdf7e579e8177abde867a88e08c8b?family=Isle+Headline+PERSONAL+USE+Black");
:root{
  --bg:#000;
  --ink:#f2eee8;
  --muted:#817b75;
  --red:#840b0b;
  --red-hot:#c01818;
  --pad:clamp(22px,4.4vw,84px);
  --headline:"Isle Headline PERSONAL USE Black",Arial Black,sans-serif;
  --serif:"Cormorant Garamond",serif;
  --ui:"Rajdhani",Arial,sans-serif;
  --mx:50vw;
  --my:50vh;
}
*{box-sizing:border-box}
html{background:#000;scroll-behavior:auto}
body{margin:0;background:#000;color:var(--ink);font-family:var(--ui);overflow-x:hidden}
body.locked{overflow:hidden}
button{font:inherit;color:inherit}
::selection{background:#8a1111;color:#fff}

.background{position:fixed;inset:0;z-index:-10;overflow:hidden;background:#000}
.bg-layer,.background__red,.background__veil,.background__fog,.background__rain{position:absolute;inset:0}
.bg-layer{will-change:transform,opacity}
.bg-layer--silhouette{background:url("assets/v8-silhouette-upscaled.jpg") center 42%/cover no-repeat;opacity:.46;filter:brightness(.34) contrast(1.25) saturate(.18);transform:scale(1.045);animation:silhouetteBreath 16s ease-in-out infinite alternate}
.bg-layer--reveal{background:url("assets/reveal-hunt.webp") center center/cover no-repeat;opacity:0;filter:brightness(.24) contrast(1.18) saturate(.45);mix-blend-mode:screen;transform:scale(1.08);transition:opacity 1s ease}
.background__red{opacity:.28;background:radial-gradient(circle at 50% 30%,rgba(120,6,6,.12),transparent 30%),radial-gradient(circle at 24% 75%,rgba(80,0,0,.08),transparent 30%);filter:blur(30px);animation:redBreathe 8s ease-in-out infinite alternate}
.background__veil{background:
  radial-gradient(circle at 50% 42%,rgba(255,255,255,.018),rgba(0,0,0,.10) 15%,rgba(0,0,0,.52) 55%,rgba(0,0,0,.93) 100%),
  linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.72) 62%,rgba(0,0,0,.94) 100%)}
.background__fog{inset:-12%;opacity:.48;background:radial-gradient(ellipse at 18% 58%,rgba(160,160,160,.06),transparent 35%),radial-gradient(ellipse at 80% 28%,rgba(160,160,160,.05),transparent 30%),radial-gradient(ellipse at 48% 72%,rgba(120,120,120,.04),transparent 32%);filter:blur(50px);animation:fog 17s ease-in-out infinite alternate}
.background__rain{opacity:.035;background-image:linear-gradient(transparent 0 38%,rgba(255,255,255,.055) 39%,transparent 41%);background-size:3px 50px;transform:skewX(-14deg);animation:rain 1.2s linear infinite}
@keyframes silhouetteBreath{to{transform:scale(1.075) translate3d(-1%,.6%,0)}}
@keyframes redBreathe{to{opacity:.4;transform:scale(1.1)}}
@keyframes fog{to{transform:translate3d(-2%,1.5%,0) scale(1.05)}}
@keyframes rain{to{background-position:0 50px}}
body.entered .bg-layer--silhouette{opacity:.34}
body.entered .bg-layer--reveal{opacity:.20}

#world{position:fixed;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none;opacity:0;transition:opacity .8s ease}
body.entered #world{opacity:.88}
.film-noise{position:fixed;inset:-20%;z-index:70;pointer-events:none;opacity:.032;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");animation:grain .23s steps(2) infinite}
.scanlines{position:fixed;inset:0;z-index:69;pointer-events:none;opacity:.024;background:repeating-linear-gradient(180deg,rgba(255,255,255,.05) 0 1px,transparent 1px 4px)}
@keyframes grain{0%{transform:translate(0)}25%{transform:translate(1%,-.7%)}50%{transform:translate(-.7%,1%)}75%{transform:translate(.4%,.5%)}100%{transform:translate(-1%,-.4%)}}
.vignette{position:fixed;inset:0;z-index:68;pointer-events:none;box-shadow:inset 0 0 240px 110px #000;background:linear-gradient(90deg,rgba(0,0,0,.5),transparent 16%,transparent 84%,rgba(0,0,0,.5))}
.blood-flash{position:fixed;inset:0;z-index:110;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 50%,rgba(120,0,0,.75),rgba(15,0,0,.86) 27%,#000 70%);mix-blend-mode:screen}
.cursor-orb{position:fixed;left:50%;top:50%;z-index:76;pointer-events:none;width:88px;height:88px;border-radius:50%;transform:translate(-50%,-50%);opacity:0;background:radial-gradient(circle,rgba(255,255,255,.085),rgba(255,255,255,.025) 32%,rgba(130,10,10,.012) 48%,transparent 72%);mix-blend-mode:screen;filter:blur(4px);transition:opacity .18s}
.cursor-focus{position:fixed;inset:0;z-index:74;pointer-events:none;opacity:.18;background:radial-gradient(circle 44px at var(--mx) var(--my),rgba(255,255,255,.04),rgba(160,20,20,.012) 34%,transparent 72%);mix-blend-mode:screen}
.particle-layer{position:fixed;inset:0;z-index:111;pointer-events:none;overflow:hidden}
.burst-particle,.mouse-particle{position:absolute;border-radius:50%;will-change:transform,opacity}
.burst-particle{width:3px;height:3px;background:#ddd3c8;box-shadow:0 0 10px rgba(150,0,0,.7)}
.mouse-particle{width:1.5px;height:1.5px;background:rgba(255,255,255,.45);box-shadow:0 0 7px rgba(130,10,10,.3)}

.terror-gate{position:fixed;inset:0;display:grid;grid-template-columns:repeat(8,1fr);z-index:112;pointer-events:none;opacity:0}
.terror-gate__slice{background:linear-gradient(180deg,rgba(65,0,0,.95),rgba(3,0,0,.97) 28%,#000 100%);border-left:1px solid rgba(255,255,255,.015);transform:translateY(-102%)}
.loader{position:fixed;inset:0;z-index:140;background:#000;display:grid;place-content:center;justify-items:center;gap:11px;letter-spacing:.34em;color:#958b81;text-align:center}
.loader span{font-family:var(--serif);font-size:14px}.loader small{font-size:9px;letter-spacing:.42em;color:#5d5650}.loader i{width:180px;height:1px;background:#151515;overflow:hidden}.loader b{display:block;height:100%;width:0;background:#7a0b0b;box-shadow:0 0 14px rgba(150,10,10,.45)}

main{position:relative}
.scene{position:relative;min-height:100vh;padding:var(--pad);isolation:isolate}
.hero{height:100vh;display:grid;place-items:center;text-align:center;overflow:hidden}
.hero__content{position:relative;z-index:5;display:flex;flex-direction:column;align-items:center;width:min(94vw,1180px)}
.hero-title{margin:0;text-transform:uppercase;line-height:.77}
.hero-title__top{display:block;font-family:var(--ui);font-weight:500;font-size:clamp(36px,4.2vw,70px);letter-spacing:.26em;color:rgba(245,241,235,.88);margin-left:.26em}
.hero-title__main{display:block;font-family:var(--headline);font-size:clamp(118px,18vw,292px);font-weight:900;letter-spacing:-.015em;color:rgba(250,247,242,.9);opacity:.9;text-shadow:0 20px 90px #000,0 0 32px rgba(120,0,0,.12)}
.hero__subtitle{display:flex;align-items:center;justify-content:center;gap:1.4em;margin:18px 0 0;font-size:clamp(18px,1.6vw,26px);letter-spacing:.45em;text-transform:uppercase;color:rgba(235,230,224,.72)}
.hero__subtitle b{font-weight:700;color:rgba(250,247,242,.88)}
.hero__soon{margin:19px 0 0;font-size:11px;letter-spacing:.72em;color:#791010;text-transform:uppercase}

.enter-button{position:relative;margin-top:58px;width:min(88vw,560px);height:92px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:22px;letter-spacing:.28em;text-transform:uppercase;overflow:hidden;transition:transform .28s ease,filter .28s ease}
.enter-button__edge{position:absolute;pointer-events:none}
.enter-button__edge--a{inset:0;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.3);backdrop-filter:blur(2px)}
.enter-button__edge--b{left:16px;right:16px;bottom:10px;height:1px;background:linear-gradient(90deg,transparent,#781010 30%,#b31919 50%,#781010 70%,transparent);transform:scaleX(.28);transition:transform .4s ease,box-shadow .4s ease}
.enter-button__scan{position:absolute;inset:0;background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(255,255,255,.025) 3px 4px),linear-gradient(100deg,transparent 10%,rgba(255,255,255,.08) 48%,rgba(150,15,15,.12) 53%,transparent 90%);transform:translateX(-110%);transition:transform .75s ease}
.enter-button__label{position:relative;z-index:3;font-weight:700;font-size:14px;letter-spacing:.32em}
.enter-button__mark{position:relative;z-index:3;color:#8e1111;font-size:19px;transition:transform .3s ease,color .3s ease}
.enter-button:hover{transform:translateY(-3px);filter:brightness(1.07)}
.enter-button:hover .enter-button__edge--a{border-color:rgba(170,24,24,.38);box-shadow:0 18px 60px rgba(0,0,0,.45),0 0 32px rgba(120,10,10,.08) inset}
.enter-button:hover .enter-button__edge--b{transform:scaleX(1);box-shadow:0 0 14px rgba(170,20,20,.6)}
.enter-button:hover .enter-button__scan{transform:translateX(110%)}
.enter-button:hover .enter-button__mark{transform:rotate(45deg);color:#c32222}
.enter-button--small{width:360px;height:72px;margin-top:36px}.enter-button--small .enter-button__label{font-size:12px}

.scroll-cue{position:absolute;top:calc(100% + 42px);left:50%;transform:translateX(-50%) translateY(10px);display:grid;place-items:center;gap:9px;border:0;background:transparent;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .5s ease,transform .5s ease}
body.entered .scroll-cue{opacity:.66;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.scroll-cue__mouse{width:22px;height:34px;border:1px solid rgba(255,255,255,.22);border-radius:13px;position:relative}
.scroll-cue__mouse i{position:absolute;left:50%;top:7px;width:2px;height:7px;border-radius:10px;background:#a61919;transform:translateX(-50%);animation:wheel 1.45s ease-in-out infinite}
.scroll-cue__text{font-size:8px;letter-spacing:.38em;color:#7d746b;text-transform:uppercase;white-space:nowrap}
@keyframes wheel{0%{opacity:0;transform:translate(-50%,0)}35%{opacity:1}100%{opacity:0;transform:translate(-50%,10px)}}

.scene-index{position:absolute;left:var(--pad);top:12vh;font-size:9px;letter-spacing:.34em;color:#4e4944;text-transform:uppercase}
.descent{min-height:185vh;display:flex;align-items:flex-start;padding-top:28vh}
.descent__copy{width:min(700px,70vw);position:sticky;top:25vh;z-index:5}
.eyebrow{margin:0 0 20px;font-size:10px;letter-spacing:.42em;color:#6f6861;text-transform:uppercase}
.descent h2,.stats-heading h2,.final h2{margin:0;font-family:Arial Black,var(--ui),sans-serif;font-size:clamp(56px,7vw,112px);font-weight:900;line-height:.86;letter-spacing:-.055em;text-transform:uppercase}
.descent h2 em,.stats-heading h2 em{font-family:var(--serif);font-weight:700;font-style:italic;color:#8d0c0c;letter-spacing:-.04em}
.descent__copy>p:last-child{max-width:500px;margin:25px 0 0;color:#827b74;font-size:14px;line-height:1.85}
.threat-meter{position:sticky;top:30vh;margin-left:auto;width:min(260px,26vw);align-self:flex-start}
.threat-meter span{font-size:9px;letter-spacing:.34em;color:#5e5852}.threat-meter i{display:block;height:1px;background:#1e1e1e;margin:13px 0}.threat-meter i b{display:block;width:0;height:100%;background:#8d1010;box-shadow:0 0 12px rgba(150,16,16,.5)}.threat-meter strong{font-family:var(--serif);font-size:46px;font-weight:500;color:#5d5751}
.anatomy-tags{position:absolute;inset:0;pointer-events:none}.anatomy-tags span{position:absolute;font-size:8px;letter-spacing:.28em;color:#5d0808;opacity:0}.anatomy-tags span:nth-child(1){right:26vw;top:55vh}.anatomy-tags span:nth-child(2){right:12vw;top:78vh}.anatomy-tags span:nth-child(3){right:18vw;top:118vh}

.stats-section{min-height:130vh;padding-top:18vh}
.stats-heading{max-width:760px}
.survival-rail{position:relative;display:grid;grid-template-columns:1fr 1fr .82fr;margin-top:58px;border-top:1px solid rgba(255,255,255,.065);border-bottom:1px solid rgba(255,255,255,.04);background:linear-gradient(90deg,rgba(255,255,255,.035),rgba(255,255,255,.018) 52%,rgba(255,255,255,.006));overflow:hidden}
.survival-rail::before{content:"";position:absolute;left:0;top:-1px;width:34%;height:1px;background:linear-gradient(90deg,#6f0909,transparent)}
.survival-node{min-height:250px;padding:30px 34px 28px;position:relative;border-right:1px solid rgba(255,255,255,.035)}
.survival-node:last-child{border-right:0}
.survival-node--primary{background:rgba(0,0,0,.14)}
.survival-node__label{display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:.3em;color:#695f58;text-transform:uppercase}.survival-node__label span{color:#781111}.survival-node__label b{font-weight:500}
.survival-node>strong{display:block;margin-top:26px;font-family:var(--serif);font-size:clamp(50px,5.8vw,88px);font-weight:500;color:rgba(238,233,226,.62);line-height:.85}
.survival-node--signal>strong{font-family:var(--ui);font-size:clamp(28px,3.6vw,52px);font-weight:700;letter-spacing:.18em;color:rgba(225,220,214,.68)}
.survival-node p{margin:22px 0 0;max-width:360px;color:#6f6962;font-size:12px;line-height:1.7}
.protocol-line{display:flex;align-items:center;gap:14px;margin-top:14px;font-size:7px;letter-spacing:.34em;color:#4e4741;text-transform:uppercase}.protocol-line i{height:1px;flex:1;background:linear-gradient(90deg,rgba(255,255,255,.06),transparent)}

.final{display:grid;place-items:center;text-align:center;min-height:110vh}
.final__content{position:relative;z-index:3}.final__mark{font-size:9px;letter-spacing:.45em;color:#6e655d;text-transform:uppercase}.final h2{font-size:clamp(72px,12vw,190px);color:rgba(245,241,235,.9)}.final__content>p:last-of-type{margin:12px 0 0;font-size:10px;letter-spacing:.48em;color:#6e665e;text-transform:uppercase}

.hud{position:fixed;left:22px;right:22px;bottom:20px;z-index:80;display:flex;align-items:center;gap:14px;font-size:9px;letter-spacing:.34em;color:#4c4640;text-transform:uppercase;pointer-events:none}.hud i{flex:1;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.065),rgba(255,255,255,.01))}
.music-embed{position:fixed;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}

.glow-text .char{display:inline-block;color:inherit;filter:brightness(calc(.78 + var(--g,0) * .44));text-shadow:0 0 0 rgba(255,255,255,0);transition:filter .09s ease,color .09s ease,text-shadow .09s ease}.glow-text .char.space{width:.29em}.glow-text .char.active{color:rgba(255,255,255,.98);text-shadow:0 0 6px rgba(255,255,255,.28),0 0 15px rgba(150,15,15,.18)}
body.entrying .cursor-orb,body.entrying .cursor-focus{opacity:0!important}
body.glitching .film-noise{opacity:.085}

@media (max-width:980px){
  .descent{display:block;min-height:140vh}.descent__copy,.threat-meter{position:relative;top:auto;width:100%;margin:0 0 28px}.survival-rail{grid-template-columns:1fr}.survival-node{border-right:0;border-bottom:1px solid rgba(255,255,255,.035)}
}
@media (max-width:760px){
  .hero-title__top{font-size:clamp(26px,8vw,42px)}.hero-title__main{font-size:clamp(94px,28vw,160px)}.hero__subtitle{font-size:14px;gap:.8em;letter-spacing:.28em}.hero__soon{letter-spacing:.45em}.enter-button{margin-top:44px;height:82px;width:min(90vw,500px)}.enter-button__label{font-size:12px;letter-spacing:.22em}.scroll-cue{top:calc(100% + 32px)}.descent h2,.stats-heading h2{font-size:clamp(48px,13vw,78px)}.survival-node{padding:26px 22px}.protocol-line{display:none}.cursor-orb{width:72px;height:72px}.cursor-focus{background:radial-gradient(circle 36px at var(--mx) var(--my),rgba(255,255,255,.035),rgba(160,20,20,.01) 34%,transparent 72%)}
}

/* ===== V9 horror polish ===== */
:root{--horror:"Special Elite",serif;--scroll-horror:0}

/* PATH OF now shares the exact same display face as BRASIL. */
.hero-title{line-height:.79}
.hero-title__top{
  font-family:var(--headline);
  font-weight:900;
  font-size:clamp(34px,4.05vw,68px);
  letter-spacing:.18em;
  color:rgba(250,247,242,.86);
  margin-left:.18em;
  margin-bottom:.05em;
}
.hero-title__main{
  font-size:clamp(112px,17.1vw,278px);
  color:rgba(250,247,242,.9);
  opacity:.9;
}

/* Very light, intermittent analog glitch instead of a strong TV distortion. */
.glitch-soft{position:relative;isolation:isolate}
.glitch-soft::before,.glitch-soft::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  font:inherit;
  letter-spacing:inherit;
  line-height:inherit;
  color:inherit;
  text-transform:inherit;
  z-index:-1;
}
.glitch-soft::before{color:rgba(130,10,10,.46);transform:translateX(-1px);animation:glitchGhostA 8.8s steps(1,end) infinite}
.glitch-soft::after{color:rgba(210,215,215,.25);transform:translateX(1px);animation:glitchGhostB 10.4s steps(1,end) infinite}
@keyframes glitchGhostA{
  0%,89%,92%,100%{opacity:0;clip-path:inset(0 0 100% 0)}
  90%{opacity:.32;clip-path:inset(18% 0 62% 0);transform:translate(-2px,0)}
  91%{opacity:.18;clip-path:inset(68% 0 12% 0);transform:translate(1px,0)}
}
@keyframes glitchGhostB{
  0%,74%,77%,100%{opacity:0;clip-path:inset(100% 0 0 0)}
  75%{opacity:.18;clip-path:inset(42% 0 39% 0);transform:translate(2px,0)}
  76%{opacity:.12;clip-path:inset(8% 0 76% 0);transform:translate(-1px,0)}
}

/* Entry is now only + / line / text — no box. */
.entry-link{
  position:relative;
  margin-top:54px;
  padding:18px 12px;
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  cursor:pointer;
  text-transform:uppercase;
  transition:transform .3s ease,filter .3s ease;
}
.entry-link__plus{font-family:var(--ui);font-size:20px;font-weight:400;color:#8d1010;line-height:1;transition:transform .35s ease,color .35s ease,text-shadow .35s ease}
.entry-link__line{display:block;width:58px;height:1px;background:linear-gradient(90deg,#8c0f0f,rgba(140,15,15,.15));transform-origin:left;transition:width .4s ease,box-shadow .4s ease,background .4s ease}
.entry-link__label{font-size:13px;font-weight:700;letter-spacing:.34em;color:rgba(239,234,228,.76)}
.entry-link:hover{transform:translateY(-2px);filter:brightness(1.08)}
.entry-link:hover .entry-link__plus{transform:rotate(45deg);color:#c11c1c;text-shadow:0 0 12px rgba(190,20,20,.45)}
.entry-link:hover .entry-link__line{width:94px;background:linear-gradient(90deg,#ba1616,rgba(186,22,22,.05));box-shadow:0 0 10px rgba(155,15,15,.35)}

/* Lower copy gets a distressed typewriter/horror character without becoming cartoonish. */
.descent__copy>p:last-child,
.survival-node p,
.survival-node__label,
.protocol-line,
.scene-index,
.anatomy-tags span,
.scroll-cue__text{font-family:var(--horror)}
.survival-node p{font-size:13px;line-height:1.72;color:#797168;letter-spacing:.015em}
.survival-node__label{font-size:9px;letter-spacing:.24em}
.protocol-line{font-size:8px;letter-spacing:.27em}

/* Make the stats rail more like a contaminated field report, less like generic UI cards. */
.survival-rail{
  background:linear-gradient(90deg,rgba(45,5,5,.05),rgba(255,255,255,.014) 42%,rgba(255,255,255,.004));
  border-top-color:rgba(148,14,14,.12);
  border-bottom-color:rgba(255,255,255,.025);
  overflow:visible;
}
.survival-rail::after{
  content:"";position:absolute;left:0;right:0;top:48%;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(120,10,10,.1) 18%,transparent 35%,rgba(255,255,255,.025) 58%,transparent);
  opacity:.5;
}
.survival-node{border-right-color:rgba(120,15,15,.055)}
.survival-node::after{
  content:"";position:absolute;left:30px;bottom:18px;width:28px;height:1px;background:#751010;opacity:.45;
  box-shadow:34px 0 0 rgba(117,16,16,.22),68px 0 0 rgba(117,16,16,.1)
}

/* Replay is no longer a button-shaped object. */
.final__mark{font-size:clamp(12px,1.05vw,17px);letter-spacing:.38em;color:rgba(180,171,161,.72);font-family:var(--headline)}
.final h2{font-family:var(--headline);font-size:clamp(72px,11.3vw,180px);color:rgba(245,241,235,.9)}
.final__subtitle{margin:15px 0 0!important;font-size:clamp(12px,1.15vw,18px)!important;letter-spacing:.44em!important;color:rgba(155,147,137,.72)!important}
.replay-link{
  position:relative;
  margin:38px auto 0;
  padding:14px 26px 20px;
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  cursor:pointer;
  text-transform:uppercase;
  color:rgba(235,230,224,.7);
}
.replay-link__label{font-size:11px;font-weight:700;letter-spacing:.34em}
.replay-link__arrow{font-size:15px;color:#8e1111;transition:transform .3s,color .3s}
.replay-link__trace{position:absolute;left:50%;bottom:7px;width:78px;height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#8a1111 22%,#ad1717 50%,#8a1111 78%,transparent);transition:width .35s,box-shadow .35s}
.replay-link:hover .replay-link__trace{width:150px;box-shadow:0 0 10px rgba(155,15,15,.42)}
.replay-link:hover .replay-link__arrow{transform:translateY(-3px);color:#c21c1c}

/* Soft screen corruption: pulse at edges, almost invisible while idle, stronger during scroll. */
.horror-screen{
  position:fixed;inset:0;z-index:67;pointer-events:none;opacity:calc(.055 + var(--scroll-horror) * .08);
  background:
    radial-gradient(ellipse at 3% 48%,rgba(105,0,0,.14),transparent 21%),
    radial-gradient(ellipse at 98% 62%,rgba(70,0,0,.12),transparent 20%),
    linear-gradient(90deg,rgba(90,0,0,.025),transparent 8%,transparent 92%,rgba(90,0,0,.025));
  mix-blend-mode:screen;
  filter:blur(.3px);
  animation:horrorScreen 7.8s ease-in-out infinite alternate;
}
@keyframes horrorScreen{
  0%,100%{transform:translate(0);filter:blur(.25px)}
  47%{transform:translate(0);filter:blur(.25px)}
  48%{transform:translate(.35px,-.2px);filter:blur(.4px)}
  49%{transform:translate(-.25px,.15px);filter:blur(.2px)}
  50%{transform:translate(0);filter:blur(.25px)}
}
#infectionCanvas{position:fixed;inset:0;width:100%;height:100%;z-index:66;pointer-events:none;opacity:0;mix-blend-mode:screen;transition:opacity .35s ease}
body.entered #infectionCanvas{opacity:.72}

/* Keep the supplied silhouette readable. */
.bg-layer--silhouette{opacity:.54;filter:brightness(.39) contrast(1.2) saturate(.16)}
body.entered .bg-layer--silhouette{opacity:.38}
.background__veil{background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.014),rgba(0,0,0,.06) 15%,rgba(0,0,0,.43) 56%,rgba(0,0,0,.88) 100%),linear-gradient(180deg,rgba(0,0,0,.09),rgba(0,0,0,.64) 64%,rgba(0,0,0,.92) 100%)}

/* Slightly calmer TV texture. */
.film-noise{opacity:.027}
.scanlines{opacity:.019}
body.glitching .film-noise{opacity:.066}

@media (max-width:760px){
  .hero-title__top{font-size:clamp(24px,7.4vw,38px);letter-spacing:.14em;margin-left:.14em}
  .hero-title__main{font-size:clamp(90px,26vw,150px)}
  .entry-link{margin-top:42px;gap:11px;padding-inline:5px}.entry-link__line{width:38px}.entry-link:hover .entry-link__line{width:58px}.entry-link__label{font-size:11px;letter-spacing:.22em}
  .final__mark{font-size:11px}.final__subtitle{font-size:10px!important;letter-spacing:.32em!important}
}
.glitch-soft::before,.glitch-soft::after{z-index:0}
.glitch-soft>.char{position:relative;z-index:1}

/* ===== V10 precision tweaks ===== */
/* The exact image supplied in the latest turn is forced as the principal background. */
.bg-layer--silhouette{
  background-image:url("assets/v10-silhouette-bg.jpg")!important;
  background-position:center center!important;
  background-size:cover!important;
  opacity:.74!important;
  filter:brightness(.62) contrast(1.08) saturate(.12)!important;
  mix-blend-mode:normal!important;
}
body.entered .bg-layer--silhouette{opacity:.52!important;filter:brightness(.54) contrast(1.12) saturate(.13)!important}
.bg-layer--reveal{opacity:0!important}
body.entered .bg-layer--reveal{opacity:.12!important}
.background__veil{
  background:
    radial-gradient(circle at 50% 42%,rgba(255,255,255,.012),rgba(0,0,0,.035) 16%,rgba(0,0,0,.31) 56%,rgba(0,0,0,.78) 100%),
    linear-gradient(180deg,rgba(0,0,0,.045),rgba(0,0,0,.42) 65%,rgba(0,0,0,.82) 100%)!important;
}
.vignette{box-shadow:inset 0 0 220px 86px rgba(0,0,0,.94)!important}

/* Make only the white first lines smaller while preserving the red impact line. */
.descent h2 .heading-white,.stats-heading h2 .heading-white{font-size:.78em;letter-spacing:-.045em}
.descent h2,.stats-heading h2{line-height:.89}

/* Entry control: centered copy, line underneath, + at the far right. */
.entry-link{
  width:min(84vw,420px);
  margin-top:50px;
  padding:10px 0 6px;
  display:grid;
  grid-template-rows:auto auto;
  justify-items:center;
  gap:12px;
  transform:none;
}
.entry-link__label{
  display:block;
  width:100%;
  text-align:center;
  font-size:13px;
  font-weight:700;
  letter-spacing:.32em;
  color:rgba(239,234,228,.76);
}
.entry-link__rail{
  width:100%;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:13px;
}
.entry-link__rail i{
  height:1px;
  background:linear-gradient(90deg,transparent 0,#6f0c0c 16%,#a41616 50%,#6f0c0c 84%,transparent 100%);
  box-shadow:0 0 0 rgba(155,15,15,0);
  transform:scaleX(.86);
  transition:transform .38s ease,box-shadow .38s ease,filter .38s ease;
}
.entry-link__rail b{
  font-family:var(--ui);
  font-size:18px;
  line-height:1;
  font-weight:400;
  color:#8e1111;
  transition:transform .35s ease,color .35s ease,text-shadow .35s ease;
}
.entry-link:hover{transform:translateY(-2px);filter:none}
.entry-link:hover .entry-link__rail i{transform:scaleX(1);filter:brightness(1.2);box-shadow:0 0 10px rgba(155,15,15,.28)}
.entry-link:hover .entry-link__rail b{transform:rotate(45deg);color:#c21c1c;text-shadow:0 0 9px rgba(190,20,20,.32)}

/* A short real glitch pulse is added by JS on top of the long subtle ghost animation. */
.glitch-live{animation:glitchLive .18s steps(1,end) 1!important}
.glitch-live::before{opacity:.34!important;clip-path:inset(17% 0 58% 0)!important;transform:translate(-2px,-.4px)!important}
.glitch-live::after{opacity:.22!important;clip-path:inset(63% 0 15% 0)!important;transform:translate(2px,.3px)!important}
@keyframes glitchLive{
  0%,100%{transform:translate(0);filter:none}
  20%{transform:translate(-1.1px,.25px);filter:contrast(1.03)}
  44%{transform:translate(1.25px,-.2px);filter:brightness(1.035)}
  62%{transform:translate(-.65px,0)}
  80%{transform:translate(.4px,.2px)}
}

/* Make the analog layer a touch calmer outside of actual glitches. */
.film-noise{opacity:.023!important}
.scanlines{opacity:.015!important}
body.glitching .film-noise{opacity:.052!important}

@media(max-width:760px){
  .entry-link{width:min(84vw,360px);margin-top:40px;gap:10px}
  .entry-link__label{font-size:11px;letter-spacing:.22em}
  .entry-link__rail{gap:9px}.entry-link__rail b{font-size:16px}
  .descent h2 .heading-white,.stats-heading h2 .heading-white{font-size:.76em}
}

/* ===== V11 — text glitch + full-screen OLD TV + scroll impact ===== */
:root{
  --scroll-shake:0;
}

/* The actual glyphs move during a glitch pulse — not only duplicated ghost layers. */
.glitch-live > .char:nth-child(3n+1){animation:charGlitchA .19s steps(2,end) 1!important}
.glitch-live > .char:nth-child(4n+2){animation:charGlitchB .19s steps(2,end) 1!important}
.glitch-live > .char:nth-child(5n+3){animation:charGlitchC .19s steps(2,end) 1!important}
.glitch-live > .char.active{animation-duration:.16s!important}
@keyframes charGlitchA{
  0%,100%{transform:translate(0);filter:inherit}
  22%{transform:translate(-2px,-.5px) skewX(-2deg);filter:brightness(1.14)}
  46%{transform:translate(1.6px,.45px);color:rgba(255,245,240,.96);text-shadow:-2px 0 rgba(125,0,0,.42)}
  70%{transform:translate(-.7px,0)}
}
@keyframes charGlitchB{
  0%,100%{transform:translate(0);filter:inherit}
  28%{transform:translate(1.8px,.35px) skewX(1.5deg);text-shadow:2px 0 rgba(220,225,225,.18)}
  52%{transform:translate(-1.5px,-.35px);filter:brightness(1.1)}
  76%{transform:translate(.5px,0)}
}
@keyframes charGlitchC{
  0%,100%{transform:translate(0);filter:inherit}
  34%{transform:translateY(-1px) scaleY(1.035)}
  58%{transform:translateY(.7px) scaleY(.985);text-shadow:0 0 7px rgba(150,10,10,.22)}
}

/* Full screen analogue television layer. */
.film-noise{
  opacity:.062!important;
  mix-blend-mode:soft-light;
  animation-duration:.145s!important;
  filter:contrast(1.2);
}
.scanlines{
  opacity:.052!important;
  background:
    repeating-linear-gradient(180deg,rgba(255,255,255,.075) 0 1px,rgba(0,0,0,.03) 1px 2px,transparent 2px 4px)!important;
  animation:scanlineDrift .85s linear infinite;
}
.scanlines::before{
  content:"";
  position:absolute;
  inset:-25% 0;
  background:linear-gradient(180deg,transparent 0 42%,rgba(255,255,255,.035) 48%,rgba(0,0,0,.08) 52%,transparent 58%);
  opacity:.6;
  animation:verticalSync 7.4s linear infinite;
}
.scanlines::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(255,0,0,.012),transparent 27%,transparent 70%,rgba(130,180,210,.012));
  animation:crtFlicker .21s steps(2,end) infinite;
}
body.glitching .film-noise{opacity:.115!important}
@keyframes scanlineDrift{to{background-position:0 4px}}
@keyframes verticalSync{
  0%{transform:translateY(-58%);opacity:0}
  9%{opacity:.42}
  23%{opacity:.18}
  38%{transform:translateY(52%);opacity:0}
  100%{transform:translateY(52%);opacity:0}
}
@keyframes crtFlicker{
  0%,100%{opacity:.7;filter:brightness(1)}
  48%{opacity:.56;filter:brightness(.985)}
  52%{opacity:.76;filter:brightness(1.018)}
}

/* Slight analogue edge warp across the whole viewport. */
.horror-screen{
  opacity:calc(.07 + var(--scroll-horror) * .11)!important;
  background:
    radial-gradient(ellipse at 2% 50%,rgba(115,0,0,.16),transparent 20%),
    radial-gradient(ellipse at 99% 62%,rgba(70,0,0,.13),transparent 20%),
    linear-gradient(90deg,rgba(0,0,0,.12),transparent 6%,transparent 94%,rgba(0,0,0,.12)),
    repeating-linear-gradient(90deg,transparent 0 11%,rgba(255,255,255,.006) 11.2%,transparent 11.5%)!important;
}

/* Scroll velocity causes a short, organic screen impact. */
body.scroll-shaking main{
  animation:scrollScreenShake .105s steps(2,end) infinite;
  will-change:transform;
}
body.scroll-shaking .background{
  animation:scrollBackgroundShake .11s steps(2,end) infinite;
  will-change:transform;
}
body.scroll-shaking #world,
body.scroll-shaking #infectionCanvas{
  animation:scrollCanvasShake .12s steps(2,end) infinite;
}
@keyframes scrollScreenShake{
  0%,100%{transform:translate3d(0,0,0)}
  25%{transform:translate3d(calc(var(--scroll-shake) * -1px),calc(var(--scroll-shake) * .42px),0)}
  50%{transform:translate3d(calc(var(--scroll-shake) * .72px),calc(var(--scroll-shake) * -.55px),0)}
  75%{transform:translate3d(calc(var(--scroll-shake) * -.35px),calc(var(--scroll-shake) * .22px),0)}
}
@keyframes scrollBackgroundShake{
  0%,100%{transform:translate3d(0,0,0) scale(1.003)}
  33%{transform:translate3d(calc(var(--scroll-shake) * .48px),calc(var(--scroll-shake) * -.28px),0) scale(1.004)}
  66%{transform:translate3d(calc(var(--scroll-shake) * -.44px),calc(var(--scroll-shake) * .32px),0) scale(1.003)}
}
@keyframes scrollCanvasShake{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(calc(var(--scroll-shake) * -.3px),calc(var(--scroll-shake) * .2px),0)}
}

@media (prefers-reduced-motion:reduce){
  body.scroll-shaking main,body.scroll-shaking .background,body.scroll-shaking #world,body.scroll-shaking #infectionCanvas{animation:none!important}
  .scanlines::before{animation:none!important;opacity:.12}
}

/* ===== V12 — persistent explorer cue + stronger full-screen OLD TV ===== */
/* OLD TV remains above the entire experience, including loader and entry transition. */
.film-noise{
  z-index:176!important;
  opacity:.095!important;
  mix-blend-mode:soft-light;
  animation-duration:.11s!important;
  filter:contrast(1.32) brightness(1.04);
}
.scanlines{
  z-index:175!important;
  opacity:.066!important;
  background:
    repeating-linear-gradient(180deg,
      rgba(255,255,255,.09) 0 1px,
      rgba(0,0,0,.055) 1px 2px,
      transparent 2px 4px)!important;
  animation:scanlineDrift .68s linear infinite;
}
.scanlines::before{
  opacity:.78!important;
  background:linear-gradient(180deg,
    transparent 0 40%,
    rgba(255,255,255,.048) 47%,
    rgba(0,0,0,.13) 52%,
    transparent 60%)!important;
  animation:verticalSync 6.2s linear infinite!important;
}
.scanlines::after{
  opacity:.88;
  background:
    linear-gradient(90deg,rgba(255,0,0,.018),transparent 24%,transparent 74%,rgba(125,180,210,.018)),
    radial-gradient(ellipse at center,transparent 47%,rgba(0,0,0,.15) 100%)!important;
  animation:crtFlicker .16s steps(2,end) infinite!important;
}
body.glitching .film-noise{opacity:.145!important}

/* Keep the mouse/scroll instruction available through every section after entering. */
.scroll-cue{
  position:fixed!important;
  top:auto!important;
  bottom:62px!important;
  left:50%!important;
  z-index:92!important;
  transform:translateX(-50%) translateY(10px)!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:opacity .42s ease,transform .42s ease,filter .25s ease!important;
}
body.entered:not(.at-final) .scroll-cue{
  opacity:.72!important;
  pointer-events:auto!important;
  transform:translateX(-50%) translateY(0)!important;
}
body.at-final .scroll-cue{
  opacity:0!important;
  pointer-events:none!important;
  transform:translateX(-50%) translateY(8px)!important;
}
.scroll-cue:hover{filter:brightness(1.28)}
.scroll-cue__mouse{background:rgba(0,0,0,.12);box-shadow:0 0 18px rgba(0,0,0,.42)}
.scroll-cue__text{text-shadow:0 1px 8px #000,0 0 10px rgba(130,10,10,.14)}

@media(max-width:760px){
  .scroll-cue{bottom:54px!important}
  .film-noise{opacity:.085!important}
  .scanlines{opacity:.058!important}
}

/* ===== V14 — persistent analog noise + larger entry + void portal ===== */
/* Full-screen analog snow. Keep it above every scene, including loader and pre-entry. */
.film-noise{
  position:fixed!important;
  inset:-24%!important;
  z-index:210!important;
  opacity:.105!important;
  pointer-events:none!important;
  mix-blend-mode:screen!important;
  filter:contrast(1.75) brightness(1.13)!important;
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.25' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='1.65' intercept='-.28'/%3E%3CfeFuncG type='linear' slope='1.65' intercept='-.28'/%3E%3CfeFuncB type='linear' slope='1.65' intercept='-.28'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.92'/%3E%3C/svg%3E")!important;
  animation:analogSnow .085s steps(2,end) infinite!important;
}
.film-noise::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.10) 0 1px,transparent 1px 3px,rgba(0,0,0,.10) 3px 4px);
  opacity:.26;
  animation:noiseBands .55s steps(2,end) infinite;
}
.film-noise::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 0 34%,rgba(255,255,255,.09) 43%,rgba(0,0,0,.22) 50%,transparent 59%);
  opacity:.34;
  animation:trackingBand 4.8s linear infinite;
}
body.glitching .film-noise{opacity:.16!important}
@keyframes analogSnow{
  0%{transform:translate3d(0,0,0) scale(1.02)}
  25%{transform:translate3d(-1.4%,.7%,0) scale(1.025)}
  50%{transform:translate3d(.8%,-1.1%,0) scale(1.02)}
  75%{transform:translate3d(1.25%,.9%,0) scale(1.027)}
  100%{transform:translate3d(-.7%,-.5%,0) scale(1.02)}
}
@keyframes noiseBands{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@keyframes trackingBand{0%{transform:translateY(-120%)}100%{transform:translateY(120%)}}

/* Stronger but still subtle full-screen CRT layer. */
.scanlines{z-index:211!important;opacity:.08!important;pointer-events:none!important}
.scanlines::before{opacity:.9!important}
.scanlines::after{opacity:.9!important}

/* Entry CTA: same minimalist line treatment, just more presence. */
.entry-link{
  width:min(90vw,620px)!important;
  margin-top:62px!important;
  gap:14px!important;
}
.entry-link__label{
  font-size:clamp(15px,1.25vw,20px)!important;
  letter-spacing:.34em!important;
}
.entry-link__rail{width:min(86vw,590px)!important}

/* Dark portal that opens only on entry. */
.void-portal{
  position:fixed;
  inset:0;
  z-index:205;
  pointer-events:none;
  opacity:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:radial-gradient(circle at center,transparent 0 6%,rgba(0,0,0,.4) 17%,rgba(0,0,0,.9) 48%,#000 72%);
}
.void-portal span{
  position:absolute;
  width:min(78vw,980px);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(120,12,12,.16);
  box-shadow:0 0 60px rgba(110,0,0,.08),inset 0 0 80px rgba(0,0,0,.95);
  opacity:0;
  transform:scale(1.4);
}
.void-portal span:nth-child(2){width:min(60vw,760px);border-color:rgba(255,255,255,.08)}
.void-portal span:nth-child(3){width:min(42vw,540px);border-color:rgba(125,8,8,.28)}
.void-portal i{
  position:absolute;
  width:9vmin;
  aspect-ratio:1;
  border-radius:50%;
  background:#000;
  box-shadow:0 0 36px 22px rgba(0,0,0,.95),0 0 95px 18px rgba(110,0,0,.16);
  transform:scale(.05);
}
body.portal-active .void-portal{opacity:1}

/* Cue lives outside the hero now, so hero fade/transform can never hide it. */
.scroll-cue{
  position:fixed!important;
  top:auto!important;
  left:50%!important;
  bottom:58px!important;
  z-index:194!important;
  transform:translateX(-50%) translateY(10px)!important;
  opacity:0!important;
  pointer-events:none!important;
}
body.entered:not(.at-final) .scroll-cue{
  opacity:.74!important;
  pointer-events:auto!important;
  transform:translateX(-50%) translateY(0)!important;
}
body.at-final .scroll-cue{opacity:0!important;pointer-events:none!important}
.scroll-cue__mouse{width:23px!important;height:36px!important}
.scroll-cue__text{font-size:8px!important;letter-spacing:.36em!important}

@media(max-width:760px){
  .film-noise{opacity:.09!important}
  .scanlines{opacity:.07!important}
  .entry-link{width:min(88vw,520px)!important;margin-top:48px!important}
  .entry-link__label{font-size:13px!important;letter-spacing:.25em!important}
  .scroll-cue{bottom:50px!important}
}


/* V15 hack-entry overlay */
.hack-overlay{position:fixed;inset:0;z-index:206;pointer-events:none;opacity:0;overflow:hidden;mix-blend-mode:screen;background:rgba(0,0,0,.12)}
.hack-overlay__noise,.hack-overlay__bands,.hack-overlay__grid,.hack-overlay__code{position:absolute;inset:0}
.hack-overlay__noise{background-image:radial-gradient(circle at 20% 20%,rgba(255,255,255,.12) 0 1px,transparent 1.4px),radial-gradient(circle at 70% 55%,rgba(255,255,255,.1) 0 1px,transparent 1.5px),radial-gradient(circle at 40% 80%,rgba(255,255,255,.09) 0 1px,transparent 1.3px);background-size:18px 18px,15px 15px,21px 21px;opacity:.22;filter:blur(.2px);animation:hackSnow .12s steps(2) infinite}
.hack-overlay__bands{background:repeating-linear-gradient(180deg,rgba(255,255,255,.07) 0 2px,transparent 2px 4px,rgba(120,6,6,.035) 4px 5px,transparent 5px 8px),linear-gradient(90deg,rgba(255,0,0,.06),transparent 16%,transparent 84%,rgba(0,170,255,.05));opacity:.28;animation:hackBands 1.1s linear infinite}
.hack-overlay__grid{background:linear-gradient(transparent 94%,rgba(255,255,255,.05) 100%),linear-gradient(90deg,transparent 96%,rgba(255,255,255,.04) 100%);background-size:100% 34px,44px 100%;opacity:.08;transform:perspective(800px) rotateX(75deg) scale(1.8) translateY(22%);transform-origin:center bottom;mask-image:linear-gradient(180deg,transparent,black 28%,black 100%)}
.hack-overlay__code{display:grid;align-content:center;justify-items:center;gap:18px;font-family:var(--ui);font-weight:700;letter-spacing:.38em;text-transform:uppercase;font-size:clamp(10px,1vw,14px);color:rgba(255,255,255,.55);text-shadow:0 0 8px rgba(255,255,255,.2),0 0 16px rgba(170,18,18,.16)}
.hack-overlay__code span{opacity:0;transform:translateY(10px) scale(.98)}
@keyframes hackSnow{0%{transform:translate(0,0)}25%{transform:translate(1.2%,-.7%)}50%{transform:translate(-1%,1.1%)}75%{transform:translate(.6%,.6%)}100%{transform:translate(-1.3%,-.5%)}}
@keyframes hackBands{0%{transform:translateY(-8%)}100%{transform:translateY(8%)}}
@keyframes hackShake{0%,100%{transform:translate3d(0,0,0)}10%{transform:translate3d(-1px,1px,0)}20%{transform:translate3d(2px,-1px,0)}30%{transform:translate3d(-2px,1px,0)}40%{transform:translate3d(1px,-2px,0)}50%{transform:translate3d(-1px,2px,0)}60%{transform:translate3d(2px,1px,0)}70%{transform:translate3d(-2px,-1px,0)}80%{transform:translate3d(1px,2px,0)}90%{transform:translate3d(-1px,-2px,0)}}
body.hack-mode main,body.hack-mode .background,body.hack-mode #world{animation:hackShake .18s linear infinite}
body.hack-mode .film-noise{opacity:.23!important;filter:contrast(1.35) brightness(1.15)}
body.hack-mode .scanlines{opacity:.18!important}
body.hack-mode .horror-screen{opacity:.26!important}
body.hack-mode .cursor-orb,body.hack-mode .cursor-focus,body.hack-mode .scroll-cue{opacity:0!important}


/* V16 — Discord signal CTA */
.discord-link{
  display:grid;
  justify-items:center;
  width:min(86vw,520px);
  margin:34px auto 22px;
  color:inherit;
  text-decoration:none;
  position:relative;
  z-index:3;
  transition:transform .28s ease,filter .28s ease;
}
.discord-link__status{
  font-family:var(--ui);
  font-size:8px;
  letter-spacing:.5em;
  color:rgba(156,22,22,.78);
  margin-bottom:9px;
  text-transform:uppercase;
}
.discord-link__label{
  font-family:var(--ui);
  font-weight:700;
  font-size:clamp(13px,1.05vw,17px);
  letter-spacing:.34em;
  color:rgba(242,238,232,.82);
  text-transform:uppercase;
  padding-left:.34em;
}
.discord-link__rail{
  width:min(80vw,460px);
  height:17px;
  display:flex;
  align-items:flex-end;
  gap:12px;
  margin-top:5px;
}
.discord-link__rail i{
  display:block;
  height:1px;
  flex:1;
  background:linear-gradient(90deg,transparent,rgba(151,13,13,.34) 14%,rgba(190,18,18,.76) 55%,rgba(151,13,13,.34) 86%,transparent);
  box-shadow:0 0 10px rgba(133,8,8,.15);
  transform:scaleX(.68);
  transform-origin:center;
  transition:transform .4s ease,box-shadow .4s ease;
}
.discord-link__rail b{
  font-family:var(--ui);
  color:#a31212;
  font-size:14px;
  line-height:1;
  font-weight:500;
  transition:transform .35s ease,color .35s ease,text-shadow .35s ease;
}
.discord-link:hover{transform:translateY(-2px);filter:brightness(1.15)}
.discord-link:hover .discord-link__rail i{transform:scaleX(1);box-shadow:0 0 16px rgba(155,10,10,.35)}
.discord-link:hover .discord-link__rail b{transform:rotate(90deg);color:#e02a2a;text-shadow:0 0 12px rgba(196,18,18,.55)}
.discord-link:hover .discord-link__label{text-shadow:0 0 10px rgba(255,255,255,.15),0 0 18px rgba(150,12,12,.18)}
@media(max-width:760px){
  .discord-link{margin-top:28px}
  .discord-link__label{font-size:12px;letter-spacing:.26em}
  .discord-link__rail{width:min(76vw,360px)}
}