:root{--toxin: #6aff8a;--toxin-dim: #1f8f45;--ember: #ff5a3c;--ember-dim: #9a2614;--bone: #e8e0d0;--ash: #9a9588;--ink: #050705;--slime: #0c1a10}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;overflow-x:hidden;background:var(--ink);color:var(--bone);font-family:Special Elite,Courier New,ui-monospace,monospace}body{display:flex;flex-direction:column;min-height:100dvh;padding:0 20px 32px}.fog{position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(70% 55% at 50% -10%,rgba(106,255,138,.16),transparent 65%),radial-gradient(40% 35% at 90% 20%,rgba(255,90,60,.1),transparent 70%),radial-gradient(50% 40% at 8% 70%,rgba(31,143,69,.14),transparent 70%),linear-gradient(180deg,#070a08 0%,var(--slime) 45%,#030503 100%);animation:fog-breathe 12s ease-in-out infinite alternate}.vignette{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.72) 100%)}@keyframes fog-breathe{0%{filter:brightness(.92) saturate(1)}to{filter:brightness(1.08) saturate(1.15)}}.hero{width:100%;max-width:860px;margin:0 auto;padding:48px 0 28px;text-align:center;animation:rise-in .7s ease-out both}.hero-kicker{margin:0 0 8px;font-size:14px;letter-spacing:4px;text-transform:uppercase;color:var(--ember);opacity:.85}.hero-title{margin:0;font-family:Creepster,Special Elite,fantasy;font-size:clamp(46px,11vw,84px);line-height:1;letter-spacing:2px;color:var(--toxin);text-shadow:0 0 18px rgba(106,255,138,.45),0 4px 0 #062410,0 8px 24px rgba(0,0,0,.8);animation:title-flicker 4.5s ease-in-out infinite}.hero-sub{margin:16px auto 0;max-width:28em;font-size:clamp(15px,2.3vw,18px);line-height:1.45;color:var(--ash)}@keyframes title-flicker{0%,92%,to{opacity:1}94%{opacity:.72}96%{opacity:1}97%{opacity:.55}}@keyframes rise-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}main{flex:1;width:100%;max-width:860px;margin:0 auto;animation:rise-in .8s ease-out .12s both}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:18px;margin:0;padding:0;list-style:none}.card{display:flex;flex-direction:column;gap:8px;padding:22px 20px 20px;border:2px solid rgba(106,255,138,.35);border-radius:6px;background:linear-gradient(160deg,#122016f2,#080c09fa);color:var(--bone);text-decoration:none;box-shadow:0 0 0 1px #0009,0 10px #041008,0 0 28px #6aff8a14;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}.card:hover,.card:focus-visible{transform:translateY(-4px);border-color:var(--toxin);box-shadow:0 0 0 1px #0009,0 14px #041008,0 0 36px #6aff8a38;outline:none}.card:active{transform:translateY(3px);box-shadow:0 0 0 1px #0009,0 4px #041008,0 0 18px #6aff8a1f}.card.ember{border-color:#ff5a3c66;box-shadow:0 0 0 1px #0009,0 10px #1a0806,0 0 28px #ff5a3c14}.card.ember:hover,.card.ember:focus-visible{border-color:var(--ember);box-shadow:0 0 0 1px #0009,0 14px #1a0806,0 0 36px #ff5a3c38}.card.ember:active{box-shadow:0 0 0 1px #0009,0 4px #1a0806,0 0 18px #ff5a3c1f}.card-emoji{font-size:46px;line-height:1;filter:drop-shadow(0 0 8px rgba(106,255,138,.35))}.card.ember .card-emoji{filter:drop-shadow(0 0 8px rgba(255,90,60,.4))}.card-name{margin:0;font-family:Creepster,Special Elite,fantasy;font-size:28px;font-weight:400;letter-spacing:1px;color:#f2f5f0}.card-tagline{margin:0;font-size:15px;line-height:1.4;color:var(--ash);overflow-wrap:anywhere}.card-play{margin-top:auto;padding-top:14px;font-size:16px;font-weight:700;letter-spacing:2px;color:var(--toxin)}.card.ember .card-play{color:var(--ember)}.card.soon{background:#0c100d8c;border-style:dashed;border-color:#ff5a3c59;box-shadow:none;cursor:default;opacity:.82}.card.soon:hover{transform:none;box-shadow:none;border-color:#ff5a3c59}.card.soon .card-play{color:var(--ember)}.footer{width:100%;max-width:860px;margin:36px auto 0;text-align:center;font-size:14px;letter-spacing:1px;color:var(--ash);opacity:.7;animation:rise-in .9s ease-out .22s both}.footer p{margin:0}.footer b{color:var(--toxin);font-weight:700}@media(max-width:620px){body{padding:0 14px 24px}.hero{padding:34px 0 20px}.card{padding:18px 16px 16px}.card-name{font-size:24px}}
