:root{--coral:#ff666a;--ink:#171717;--paper:#f5f1e8;--blue:#20b9e8;--violet:#9874dc;--yellow:#ffd74b}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
body::selection{background:var(--ink);color:var(--paper)}
#playfield{position:fixed;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.noise{position:fixed;inset:0;z-index:6;pointer-events:none;opacity:.035;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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.impact{--event-a:var(--blue);--event-b:var(--violet);--event-c:var(--yellow);position:fixed;inset:0;z-index:20;pointer-events:none;display:grid;place-items:center;overflow:hidden;opacity:0}.impact::before{content:"";position:absolute;width:10vmax;height:10vmax;border:3px solid var(--paper);border-radius:50%;opacity:0}.impact strong{max-width:95vw;text-align:center;font-size:clamp(100px,23vw,360px);line-height:.7;letter-spacing:-.1em;color:var(--paper);text-shadow:7px 7px 0 var(--ink);transform:scale(.15) rotate(-12deg);opacity:0;white-space:nowrap}.impact-label,.impact-count{position:absolute;background:var(--ink);color:var(--paper);padding:8px 11px;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:0}.impact-label{top:18%;left:5%;transform:rotate(-5deg)}.impact-count{right:5%;bottom:17%;transform:rotate(4deg)}
.impact.is-live{animation:impact-in 1.25s both}.impact.is-live::before{animation:shockwave 1s ease-out both}.impact.is-live strong{animation:word-hit 1.1s cubic-bezier(.16,.9,.2,1) both}.impact.is-live .impact-label,.impact.is-live .impact-count{animation:tag-pop .75s .15s both}
body.is-reacting .hero{animation:screen-kick .38s steps(2,end)}body.is-reacting #nudge{background:var(--ink);color:var(--paper)}
body.is-reacting #playfield{z-index:25}
.impact.is-rare .impact-label,.impact.is-rare .impact-count{background:var(--yellow);color:var(--ink);box-shadow:5px 5px 0 var(--ink)}
.impact.is-live.fx-spin strong{animation:word-spin 1.1s cubic-bezier(.16,.9,.2,1) both}
.impact.is-live.fx-drop strong{animation:word-drop 1.1s cubic-bezier(.16,.9,.2,1) both}
.impact.is-live.fx-stretch strong{animation:word-stretch 1.1s cubic-bezier(.16,.9,.2,1) both}
.impact.is-live.fx-echo strong{animation:word-echo 1.1s cubic-bezier(.16,.9,.2,1) both}
.impact.is-live.fx-tilt strong{animation:word-tilt 1.1s cubic-bezier(.16,.9,.2,1) both}
.hero-foot button.is-mischief{animation:button-mischief .8s cubic-bezier(.2,.8,.2,1)}
.nav,main,footer{position:relative;z-index:2}
.nav>* ,.hero>*{position:relative;z-index:5}
.nav{position:absolute;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:28px 3vw}
.brand{color:var(--ink);text-decoration:none;font-weight:800;font-size:clamp(22px,2vw,31px);letter-spacing:-1.7px}.brand span{color:white}
.contact{color:var(--ink);text-decoration:none;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;border-bottom:2px solid;padding:8px 0}.contact span{display:inline-block;transition:transform .2s}.contact:hover span{transform:translate(3px,-3px)}
.hero{min-height:100svh;background:var(--coral);padding:clamp(130px,18vh,190px) 3vw 4vh;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.eyebrow,.index{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.eyebrow{display:flex;align-items:center;gap:9px}.live-dot{width:8px;height:8px;background:var(--ink);border-radius:50%;animation:pulse 1.5s infinite}
h1{font-size:clamp(62px,10.2vw,158px);line-height:.8;letter-spacing:-.078em;margin:4vh 0 8vh;max-width:1300px;font-weight:800}h1 em{color:var(--paper);font-style:normal}
.hero-foot{display:flex;justify-content:space-between;align-items:end;gap:30px}.hero-foot p{margin:0;max-width:390px;font-size:clamp(18px,1.55vw,24px);line-height:1.2;font-weight:700;letter-spacing:-.03em}.hero-foot button{appearance:none;border:2px solid var(--ink);border-radius:99px;background:transparent;padding:15px 19px;font:700 12px Arial;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:.18s}.hero-foot button:hover{background:var(--ink);color:var(--paper);transform:rotate(-2deg)}
.manifesto{min-height:105svh;padding:9vh 3vw;display:flex;flex-direction:column;justify-content:space-between}.statement{font-size:clamp(58px,9.6vw,150px);line-height:.87;letter-spacing:-.075em;margin:9vh 0}.statement strong{font-weight:800;color:var(--coral)}
.pill-row{display:flex;flex-wrap:wrap;gap:10px}.pill-row span{border:2px solid var(--ink);border-radius:99px;padding:13px 18px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.09em}.pill-row span:nth-child(2){background:var(--yellow)}.pill-row span:nth-child(3){background:var(--violet)}
.signal{min-height:92svh;background:var(--ink);color:var(--paper);padding:9vh 3vw;display:flex;flex-direction:column;align-items:flex-start}.signal h2{font-size:clamp(68px,11.5vw,175px);line-height:.8;letter-spacing:-.08em;margin:auto 0 4vh}.signal>p:not(.index){font-size:clamp(17px,1.5vw,23px);max-width:390px;line-height:1.25}.signal a{margin-top:28px;background:var(--coral);color:var(--ink);text-decoration:none;border-radius:99px;padding:17px 21px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.signal a span{display:inline-block;transition:transform .2s}.signal a:hover span{transform:translate(4px,-4px)}
footer{min-height:140px;padding:35px 3vw;display:flex;justify-content:space-between;align-items:end;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
@keyframes pulse{50%{transform:scale(1.7);opacity:.45}}
@keyframes impact-in{0%{opacity:0;background:transparent}8%{opacity:1;background:var(--event-a)}40%{background:var(--event-b)}76%{opacity:1;background:var(--event-c)}100%{opacity:0;background:transparent}}
@keyframes shockwave{0%{opacity:1;transform:scale(.2)}70%{opacity:.7}100%{opacity:0;transform:scale(12)}}
@keyframes word-hit{0%{opacity:0;transform:scale(.15) rotate(-12deg)}22%{opacity:1;transform:scale(1.08) rotate(2deg)}38%{transform:scale(.96) rotate(-1deg)}78%{opacity:1;transform:scale(1) rotate(0)}100%{opacity:0;transform:scale(1.6) rotate(3deg)}}
@keyframes word-spin{0%{opacity:0;transform:scale(.2) rotate(-160deg)}30%{opacity:1;transform:scale(1.08) rotate(8deg)}78%{opacity:1;transform:rotate(-3deg)}100%{opacity:0;transform:scale(.5) rotate(90deg)}}
@keyframes word-drop{0%{opacity:0;transform:translateY(-100vh) scaleY(1.4)}28%{opacity:1;transform:translateY(5vh) scaleY(.65)}45%{transform:translateY(-2vh) scaleY(1.05)}80%{opacity:1;transform:none}100%{opacity:0;transform:translateY(70vh) rotate(8deg)}}
@keyframes word-stretch{0%{opacity:0;transform:scaleX(.05) scaleY(2)}25%{opacity:1;transform:scaleX(1.15) scaleY(.7)}48%{transform:scaleX(.92) scaleY(1.06)}82%{opacity:1;transform:none}100%{opacity:0;transform:scaleX(2.2) scaleY(.1)}}
@keyframes word-echo{0%{opacity:0;transform:translate(-8vw,-4vh);text-shadow:0 0 var(--ink)}25%{opacity:1;transform:none;text-shadow:12px 12px var(--ink),24px 24px var(--event-c),36px 36px var(--ink)}80%{opacity:1;transform:translate(2vw,1vh);text-shadow:-12px -12px var(--ink),-24px -24px var(--event-a)}100%{opacity:0;transform:translate(10vw,5vh)}}
@keyframes word-tilt{0%{opacity:0;transform:perspective(500px) rotateY(85deg) scale(.6)}30%{opacity:1;transform:perspective(500px) rotateY(-12deg) scale(1.05)}52%{transform:perspective(500px) rotateY(5deg)}82%{opacity:1;transform:none}100%{opacity:0;transform:perspective(500px) rotateY(-70deg) scale(1.5)}}
@keyframes tag-pop{0%{opacity:0;transform:scale(0) rotate(-10deg)}35%,80%{opacity:1;transform:scale(1) rotate(-5deg)}100%{opacity:0;transform:scale(1.3) rotate(2deg)}}
@keyframes screen-kick{0%{transform:translate(0)}25%{transform:translate(-8px,5px)}50%{transform:translate(7px,-4px)}75%{transform:translate(-3px,2px)}100%{transform:translate(0)}}
@keyframes button-mischief{0%{transform:none}25%{transform:translate(-55px,-18px) rotate(-8deg)}50%{transform:translate(38px,12px) rotate(5deg)}75%{transform:translate(-15px,5px) rotate(-3deg)}100%{transform:none}}
@media(max-width:700px){.nav{padding:22px 20px}.contact{font-size:10px;letter-spacing:.035em}.hero,.manifesto,.signal{padding-left:20px;padding-right:20px}.hero{padding-top:130px}.hero-foot{align-items:flex-start;flex-direction:column}.hero-foot button{align-self:flex-end}h1{font-size:clamp(57px,18.2vw,96px);line-height:.84}.statement{font-size:clamp(54px,16vw,88px)}.signal h2{font-size:clamp(66px,20vw,110px)}footer{padding:28px 20px;gap:30px;align-items:flex-start;flex-direction:column-reverse}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.live-dot{animation:none}.impact.is-live{animation:impact-in .6s both}.impact.is-live strong,.impact.is-live.fx-spin strong,.impact.is-live.fx-drop strong,.impact.is-live.fx-stretch strong,.impact.is-live.fx-echo strong,.impact.is-live.fx-tilt strong{animation:word-hit .55s both}.impact.is-live::before{display:none}body.is-reacting .hero,.hero-foot button.is-mischief{animation:none}}