:root{--bg:#07070b;--gold:#d4af37;--gold2:#f6dc8a;--red:#ff2d4a;--txt:#e9e6dc;--mut:#8a8778;--line:rgba(212,175,55,.25)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:radial-gradient(ellipse at 70% 0,#2a0a12 0,transparent 55%),radial-gradient(ellipse at 0 40%,#1c1606 0,transparent 50%),var(--bg);color:var(--txt);font-family:"Segoe UI",system-ui,sans-serif;overflow-x:hidden;line-height:1.6}
#rain{position:fixed;inset:0;z-index:-1;opacity:.18}
.scan{pointer-events:none;position:fixed;inset:0;z-index:50;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
code,.term,small,.tick,nav,.hud b,.btn,.lock,h2 span,.marquee{font-family:"Courier New",ui-monospace,monospace}
nav{position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;padding:14px 5vw;background:rgba(7,7,11,.8);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
nav a{color:var(--txt);text-decoration:none;margin-left:22px;font-size:.85rem;letter-spacing:2px}nav a:hover{color:var(--gold)}.logo{color:var(--gold)!important;font-weight:700;margin:0!important;font-size:1.1rem!important}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:5vw;align-items:center;padding:8vh 5vw 6vh;min-height:88vh}
.term{color:var(--red);font-size:1rem;margin-bottom:14px}.cur{animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}
h1{font-size:clamp(2.6rem,6vw,5.4rem);line-height:.95;font-weight:900;letter-spacing:-1px;background:linear-gradient(180deg,var(--gold2),var(--gold) 55%,#8a6a12);-webkit-background-clip:text;background-clip:text;color:transparent;position:relative}
.glitch::before,.glitch::after{content:attr(data-t);position:absolute;inset:0;background:inherit;-webkit-background-clip:text;background-clip:text}
.glitch::before{animation:g1 3s infinite;color:var(--red);-webkit-text-fill-color:var(--red);opacity:.0}.glitch::after{animation:g2 3s infinite;-webkit-text-fill-color:#4ff;opacity:0}
@keyframes g1{0%,92%,100%{opacity:0}93%{opacity:.7;transform:translate(-4px,2px);clip-path:inset(10% 0 60% 0)}95%{opacity:.7;transform:translate(3px,-2px);clip-path:inset(55% 0 20% 0)}}
@keyframes g2{0%,93%,100%{opacity:0}94%{opacity:.6;transform:translate(4px,0);clip-path:inset(30% 0 40% 0)}96%{opacity:.6;transform:translate(-3px,1px);clip-path:inset(70% 0 5% 0)}}
.tick{display:inline-block;margin:18px 0;padding:4px 14px;border:1px solid var(--red);color:var(--red);font-size:1.5rem;font-weight:700;letter-spacing:4px;box-shadow:0 0 18px rgba(255,45,74,.35)}
.sub{color:#cfcabb;max-width:520px;font-size:1.08rem}
.btns{display:flex;gap:14px;margin:28px 0;flex-wrap:wrap}
.btn{cursor:pointer;padding:13px 26px;font-weight:700;letter-spacing:2px;font-size:.9rem;text-decoration:none;border:1px solid var(--gold);transition:.2s;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.gold{background:linear-gradient(90deg,var(--gold),var(--gold2));color:#111}.gold:hover{filter:brightness(1.15);transform:translateY(-2px)}
.ghost{background:transparent;color:var(--gold)}.ghost:hover{background:rgba(212,175,55,.12)}
.hud-row{display:flex;gap:12px;flex-wrap:wrap}.hud{border:1px solid var(--line);background:rgba(0,0,0,.45);padding:8px 14px}.hud small{display:block;color:var(--mut);font-size:.7rem;letter-spacing:2px}.hud b{color:var(--gold2)}
.hero-img{position:relative}.frame{position:relative;padding:10px;animation:float 6s ease-in-out infinite}@keyframes float{50%{transform:translateY(-12px)}}
.frame img{width:100%;display:block;filter:contrast(1.05) saturate(1.1);box-shadow:0 0 60px rgba(255,45,74,.25),0 0 120px rgba(212,175,55,.12)}
.c{position:absolute;width:26px;height:26px;border:2px solid var(--gold)}.tl{top:0;left:0;border-right:0;border-bottom:0}.tr{top:0;right:0;border-left:0;border-bottom:0}.bl{bottom:0;left:0;border-right:0;border-top:0}.br{bottom:0;right:0;border-left:0;border-top:0}
.lock{position:absolute;bottom:22px;left:22px;background:rgba(255,45,74,.85);color:#fff;font-size:.75rem;padding:4px 10px;letter-spacing:2px;animation:blink 1.6s steps(1) infinite}
figcaption{font-size:.75rem;color:var(--mut);margin-top:10px;text-align:right}figcaption a,footer a{color:var(--gold)}
.marquee{overflow:hidden;border-block:1px solid var(--line);background:#0d0b05;color:var(--gold);padding:10px 0;white-space:nowrap;letter-spacing:3px}.marquee div{display:inline-block;animation:mq 30s linear infinite}@keyframes mq{to{transform:translateX(-50%)}}
section{padding:11vh 5vw;max-width:1200px;margin:auto}
h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:36px;letter-spacing:3px;color:var(--txt)}h2 span{color:var(--red);font-size:.6em}
.lore{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.lore img{width:100%;border:1px solid var(--line)}.lore p{margin-bottom:14px;color:#d6d1c2}.lore code{color:var(--red)}.lore b{color:var(--gold2)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{border:1px solid var(--line);background:linear-gradient(160deg,rgba(212,175,55,.07),rgba(0,0,0,.4));padding:24px;transition:.25s}.card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 0 30px rgba(212,175,55,.15)}
.card small,.ca small,.phase small{color:var(--mut);letter-spacing:2px;font-size:.72rem;display:block}.card b{font-size:1.35rem;color:var(--gold2)}
.ph i{font-style:normal;font-size:.65rem;background:var(--red);color:#fff;padding:2px 6px;margin-left:6px;vertical-align:middle;letter-spacing:1px;font-family:monospace}
.ca{margin-top:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:1px dashed var(--gold);padding:18px 22px}.ca code{flex:1;color:var(--gold2);font-size:1.05rem;word-break:break-all}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:s}.steps li{counter-increment:s;border:1px solid var(--line);padding:24px;position:relative;color:#cfcabb;font-size:.95rem}
.steps li::before{content:"0" counter(s);font-family:monospace;color:var(--red);font-size:2rem;font-weight:700;display:block}.steps b{display:block;color:var(--gold2);margin-bottom:6px;letter-spacing:1px}.steps a{color:var(--gold)}
.road{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative}.phase{border-top:3px solid var(--gold);background:rgba(0,0,0,.4);padding:22px}.phase:nth-child(4){border-color:var(--red)}.phase b{font-size:1.15rem;color:var(--gold2);display:block;margin:4px 0 8px}.phase p{color:#bdb8a8;font-size:.92rem}
.note{color:var(--mut);font-size:.8rem;margin-top:16px}
.socials{display:flex;gap:16px}.soc{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--line);padding:22px 12px;text-align:center;color:var(--txt);text-decoration:none;font-weight:700;letter-spacing:.06em;font-size:clamp(.72rem,1.5vw,.95rem);line-height:1.25;transition:.2s}.soc span{white-space:nowrap}.soc small{display:block;color:var(--mut);font-weight:400;letter-spacing:0;margin-top:6px;font-size:.82em;white-space:nowrap}.soc:hover{border-color:var(--gold);color:var(--gold)}
.soc.real{border-color:var(--red);box-shadow:0 0 24px rgba(255,45,74,.25)}
footer{border-top:1px solid var(--line);padding:40px 5vw;text-align:center;color:var(--mut);font-size:.82rem}.disc{max-width:860px;margin:0 auto 14px}.hint{opacity:.5}
.boot{position:fixed;inset:0;z-index:100;background:rgba(5,0,2,.94);display:none;align-items:center;justify-content:center}.boot.on{display:flex}.boot pre{color:var(--red);font-size:clamp(.8rem,2vw,1.2rem);text-shadow:0 0 10px var(--red);white-space:pre-wrap;padding:20px}
.heart{position:fixed;z-index:90;pointer-events:none;color:var(--red);animation:up 2.4s ease-out forwards}@keyframes up{to{transform:translateY(-70vh) rotate(40deg);opacity:0}}
.shot .reveal{opacity:1!important;transform:none!important;transition:none!important}.shot .hero{min-height:0;padding:90px 5vw}.shot section{padding:90px 5vw}
.reveal{opacity:0;transform:translateY(30px);transition:.8s}.reveal.in{opacity:1;transform:none}
@media(max-width:900px){.hero,.lore{grid-template-columns:1fr}.hero{padding-top:5vh}.grid{grid-template-columns:1fr 1fr}.steps,.road{grid-template-columns:1fr 1fr}nav .links{display:none}}
@media(max-width:520px){.grid,.steps,.road{grid-template-columns:1fr}.socials{gap:8px}.soc{padding:14px 6px;letter-spacing:.04em;font-size:.68rem}}
