/* THE GRAVEYARD — $PROPHET · graveyard.css */

@font-face{font-family:"Urban Spray";src:url("assets/urban-spray.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Archivo Var";src:url("assets/archivo-variable.woff2") format("woff2-variations"),url("assets/archivo-variable.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap;}
@font-face{font-family:"Archivo Black";src:url("assets/archivo-black.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Space Grotesk";src:url("assets/space-grotesk-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Space Grotesk";src:url("assets/space-grotesk-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:"JetBrains Mono";src:url("assets/jbmono-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"JetBrains Mono";src:url("assets/jbmono-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"JetBrains Mono";src:url("assets/jbmono-800.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap;}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:#05060a;color:#e8ebf4;font-family:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;overflow:hidden;overscroll-behavior:none;height:100%;width:100%;}
a{color:#4db2ff;text-decoration:none;}
a:hover{color:#7cc7ff;}
button{font-family:inherit;}
input::placeholder{color:#5b6680;}

#screen{position:fixed;inset:0;overflow:hidden;background:#05060a;touch-action:manipulation;}
#shake{position:absolute;inset:0;z-index:1;}
#stage{position:absolute;left:0;top:0;width:1920px;height:1072px;transform-origin:0 0;pointer-events:none;}
#stage img.bg{position:absolute;left:0;top:0;width:1920px;height:1072px;pointer-events:none;user-select:none;}

.vignette{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(80% 70% at 50% 58%,transparent 55%,rgba(4,5,9,.6) 100%);}
.topfade{position:absolute;left:0;right:0;top:0;height:min(48vh,400px);z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(5,6,10,.86) 0%,rgba(5,6,10,.55) 58%,rgba(5,6,10,0) 100%);}

.topleft{position:absolute;top:14px;left:18px;z-index:11;display:flex;align-items:center;gap:14px;}
.brand{position:relative;font-family:"Urban Spray",cursive;font-size:clamp(24px,3.4vw,50px);color:#2f9bff;text-shadow:0 0 24px rgba(47,155,255,.6),3px 4px 0 rgba(0,0,0,.7);transform:rotate(-2deg);text-transform:uppercase;pointer-events:none;}

.topnav{position:absolute;top:14px;right:14px;z-index:11;display:flex;align-items:center;gap:8px;}
.back-link{background:rgba(7,9,14,.7);border:1px solid #2b3548;color:#8b98ad;font-size:12px;font-weight:800;padding:6px 10px;cursor:pointer;font-family:"JetBrains Mono",monospace;text-decoration:none;line-height:1;}
.back-link:hover{color:#e8ebf4;border-color:#4a5670;}
.social{display:flex;align-items:center;gap:10px;}
.social a{display:flex;align-items:center;justify-content:center;width:54px;height:54px;background:rgba(7,9,14,.72);border:1px solid rgba(47,155,255,.45);color:#2f9bff;box-shadow:0 0 18px rgba(47,155,255,.25);transition:transform .15s,box-shadow .15s,border-color .15s;}
.social a:hover{transform:translateY(-2px);border-color:#2f9bff;box-shadow:0 0 26px rgba(47,155,255,.55);}
.social svg{width:24px;height:24px;fill:currentColor;}

#formwrap{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;flex-direction:column;align-items:center;gap:10px;padding:max(64px,calc(130px - 3.4vw)) 16px 0;pointer-events:none;}
.h1{font-family:"Urban Spray",cursive;font-size:clamp(32px,5vw,58px);line-height:1;color:#e11d48;text-transform:uppercase;transform:rotate(-1deg);white-space:nowrap;text-shadow:0 0 22px rgba(225,29,72,.5),2px 3px 0 rgba(0,0,0,.8);margin:0;}
.sub{margin:0;font-family:"Space Grotesk",sans-serif;font-size:clamp(13px,1.3vw,17px);font-weight:600;color:#e2e7f2;line-height:1.45;text-align:center;text-shadow:0 2px 10px #000;max-width:44ch;}

form.buryform{pointer-events:auto;width:100%;max-width:760px;display:flex;gap:8px;flex-wrap:wrap;}
form.buryform input{flex:1 1 220px;min-width:0;padding:14px 16px;background:rgba(7,9,14,.92);border:1px solid #2b3548;border-radius:2px;color:#fff;font-family:"JetBrains Mono",monospace;font-size:16px;font-weight:700;outline:none;}
form.buryform input:focus{border-color:#4a5670;}
.bury-btn{flex:1 0 100%;width:100%;padding:16px 26px;border:none;border-radius:2px;background:#e11d48;color:#fff;font-family:"Archivo Var","Archivo Black",sans-serif;font-size:16px;font-weight:900;letter-spacing:.08em;cursor:pointer;white-space:nowrap;box-shadow:0 0 26px rgba(225,29,72,.35);}
.bury-btn:hover{filter:brightness(1.12);}

.sharepanel{pointer-events:auto;width:100%;max-width:560px;max-height:calc(100dvh - 150px);overflow-y:auto;overscroll-behavior:contain;padding:14px;background:rgba(11,14,20,.95);border:1px solid #2b3548;display:flex;flex-direction:column;gap:12px;box-shadow:0 20px 60px rgba(0,0,0,.7);animation:gFade .4s ease-out both;}
.cardbox{position:relative;aspect-ratio:16/9;flex:0 0 auto;width:min(100%, calc((100dvh - 300px) * 16 / 9));min-width:min(100%,260px);align-self:center;background:#0a0a10;border:1px solid #33354a;overflow:hidden;}
.cardbox canvas,.cardbox img{position:absolute;inset:0;width:100%;height:100%;display:block;}
.sharerow{display:flex;gap:8px;flex-wrap:wrap;}
.btn-ghost{flex:0 0 auto;padding:12px 14px;border:1px solid #2b3548;background:none;color:#9aa4b8;font-size:13px;font-weight:800;cursor:pointer;white-space:nowrap;font-family:"JetBrains Mono",monospace;}
.btn-ghost:hover{color:#e8ebf4;border-color:#4a5670;}
.btn-share{flex:1 1 180px;display:flex;align-items:center;justify-content:center;padding:13px;border:none;background:#2f9bff;color:#04121f;font-family:"Archivo Var","Archivo Black",sans-serif;font-size:15px;font-weight:900;letter-spacing:.06em;cursor:pointer;white-space:nowrap;}
.btn-share:hover{filter:brightness(1.1);}
.toast{font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;color:#43D19E;line-height:1.5;}
.share-close-row{display:flex;justify-content:flex-end;}
.btn-bury-another{background:none;border:none;color:#6b7690;font-size:12px;font-weight:700;cursor:pointer;padding:2px;font-family:"JetBrains Mono",monospace;}
.btn-bury-another:hover{color:#9aa4b8;}

.stone{position:absolute;transform-origin:50% 100%;cursor:pointer;transition:left .8s cubic-bezier(.34,1.35,.5,1),top .8s cubic-bezier(.34,1.35,.5,1),transform .8s cubic-bezier(.34,1.35,.5,1),opacity .6s,filter .6s;}
.stone-inner{position:absolute;inset:0;transform-origin:50% 100%;}
.stone-anim{position:absolute;inset:0;transform-origin:50% 100%;}
.stone img.stone-img{position:absolute;pointer-events:none;user-select:none;max-width:none;}
.stone-content{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;}
.stone-rip{font-family:"JetBrains Mono",monospace;font-weight:800;letter-spacing:.3em;padding-left:.3em;color:#3a3548;}
.stone-name{font-family:"Archivo Var",sans-serif;font-weight:900;font-stretch:70%;line-height:.95;color:#17151d;text-transform:uppercase;letter-spacing:-.01em;text-shadow:0 2px 0 rgba(255,255,255,.22);white-space:nowrap;}
.stone-tag{font-family:"Urban Spray",cursive;line-height:1;transform:rotate(-6deg);white-space:nowrap;text-transform:uppercase;}
.stone-handle{font-family:"JetBrains Mono",monospace;font-weight:800;color:#FFE9A8;background:rgba(12,10,18,.82);white-space:nowrap;letter-spacing:.02em;box-shadow:0 2px 0 rgba(0,0,0,.4);}
.stone-dirt{position:absolute;left:-14%;right:-14%;background:radial-gradient(ellipse at 50% 50%, rgba(12,10,16,.95) 35%, rgba(12,10,16,0) 70%);}
.stone-ghost-label{font-family:"Urban Spray",cursive;color:#F5B93E;text-transform:uppercase;text-shadow:0 0 18px rgba(245,185,62,.7), 2px 3px 0 rgba(0,0,0,.7);transform:rotate(-4deg);}
.stone-ghost-body{border:5px dashed rgba(245,185,62,.85);background:rgba(245,185,62,.07);box-shadow:0 0 30px rgba(245,185,62,.35), inset 0 0 30px rgba(245,185,62,.2);animation:gGhost 1.8s ease-in-out infinite;}
.stone-body{position:absolute;inset:0;}
.stone-arrow{position:absolute;left:50%;font-family:"Archivo Black",sans-serif;color:#F5B93E;text-shadow:0 0 18px rgba(245,185,62,.7);animation:gArrow 1s ease-in-out infinite;pointer-events:none;}
.stone-dust{position:absolute;left:50%;border-radius:50%;background:radial-gradient(ellipse, rgba(205,200,220,.8) 0%, rgba(205,200,220,.35) 45%, transparent 70%);pointer-events:none;}
.stone-bonk{position:absolute;left:50%;z-index:5;font-family:"Archivo Black",sans-serif;font-style:italic;color:#FFE9A8;-webkit-text-stroke:2px #120d04;text-shadow:4px 5px 0 #000;white-space:nowrap;pointer-events:none;}

.slam{animation-name:gSlam;animation-fill-mode:both;}
.fade{animation:gFade .9s ease-out both;}

@keyframes gSlam{0%{transform:translateY(-1500px);animation-timing-function:cubic-bezier(.55,0,1,.6)}62%{transform:translateY(0) scale(1,1);animation-timing-function:ease-out}70%{transform:translateY(0) scale(1.17,.72)}80%{transform:translateY(-24px) scale(.95,1.08)}90%{transform:translateY(0) scale(1.03,.97)}100%{transform:none}}
@keyframes gFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes gDust{0%{opacity:0;transform:translateX(0) scale(.3)}15%{opacity:.95}100%{opacity:0;transform:translateX(var(--dx)) scale(1.7)}}
@keyframes gBonk{0%{opacity:0;transform:translate(-50%,0) scale(.2) rotate(-14deg)}18%{opacity:1;transform:translate(-50%,-24px) scale(1.2) rotate(-7deg)}70%{opacity:1;transform:translate(-50%,-40px) scale(1) rotate(-7deg)}100%{opacity:0;transform:translate(-50%,-70px) scale(.9) rotate(-7deg)}}
@keyframes gGhost{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes gArrow{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,16px)}}
@keyframes gShine{0%,100%{filter:drop-shadow(0 0 8px rgba(245,185,62,.35))}50%{filter:drop-shadow(0 0 28px rgba(245,185,62,.85))}}
@keyframes gProphet{0%{transform:translateY(105%)}13%{transform:translateY(-5%)}19%{transform:translateY(0)}84%{transform:translateY(0)}100%{transform:translateY(110%)}}
@keyframes gBubble{0%,10%{opacity:0;transform:scale(.2) rotate(-16deg)}18%{opacity:1;transform:scale(1.14) rotate(-5deg)}25%{transform:scale(1) rotate(-5deg)}78%{opacity:1;transform:scale(1) rotate(-5deg)}90%,100%{opacity:0;transform:scale(.6) rotate(-5deg)}}
@keyframes gFlash{0%{opacity:.6}100%{opacity:0}}

#reactLayer{position:fixed;inset:0;z-index:30;pointer-events:none;}
.liq{position:absolute;font-family:"Archivo Black",sans-serif;font-style:italic;color:#FFE9A8;-webkit-text-stroke:3px #120d04;text-shadow:5px 6px 0 #000, 0 0 30px rgba(245,185,62,.7);white-space:nowrap;animation:gBonk 1.4s ease-out both;}
.flash{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 70%, rgba(255,233,168,.55), transparent 70%);animation:gFlash .5s ease-out both;}
.prophetwrap{position:absolute;right:max(8px,3vw);bottom:0;height:min(48vh,440px);}
.prophetwrap img{height:100%;display:block;animation:gProphet 2.9s cubic-bezier(.3,1.3,.5,1) both;filter:drop-shadow(0 0 24px rgba(157,78,255,.5));}
.bubble{position:absolute;right:62%;bottom:74%;transform-origin:bottom right;animation:gBubble 2.9s ease-out both;background:#fff;border:4px solid #0b0a10;border-radius:22px;padding:10px 20px 12px;box-shadow:6px 6px 0 #000;font-family:"Archivo Black",sans-serif;font-style:italic;font-size:clamp(20px,3.6vw,46px);line-height:.95;color:#0b0a10;white-space:nowrap;text-align:center;}
.bubble .red{color:#e11d48;}
.bubble .tail{position:absolute;right:18px;bottom:-15px;width:24px;height:24px;background:#fff;border-right:4px solid #0b0a10;border-bottom:4px solid #0b0a10;transform:rotate(45deg);}

#fx{position:fixed;inset:0;z-index:40;pointer-events:none;}

.viewed-hint{position:absolute;top:4px;font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;color:#9aa4b8;text-align:center;pointer-events:none;text-shadow:0 2px 6px #000;}

@media (prefers-reduced-motion: reduce){
  .slam,.fade,.stone-dust,.stone-bonk,.stone-ghost-body,.stone-arrow,.liq,.flash,.prophetwrap img,.bubble{animation:none !important;}
}

/* Must win the cascade over .sharepanel{display:flex} / .toast{display:block}
   regardless of source order, since both are equal-specificity class rules
   declared earlier in this file. Kept last + ID-qualified on purpose. */
#sharepanel.is-hidden,
#toast.is-hidden{display:none;}

.social a.buy{position:relative;border-color:rgba(245,185,62,.6);box-shadow:0 0 18px rgba(245,185,62,.3);}
.social a.buy:hover{border-color:#f5b93e;box-shadow:0 0 26px rgba(245,185,62,.6);}
.social a.buy img{height:32px;width:auto;display:block;}
.buy-lbl{position:absolute;top:100%;left:50%;transform:translateX(-50%) rotate(-3deg);margin-top:5px;white-space:nowrap;font-family:"Urban Spray",cursive;font-size:16px;line-height:1;color:#f5b93e;text-shadow:0 0 8px rgba(245,185,62,.6),1px 1px 0 #000;text-transform:uppercase;pointer-events:none;}

.back-link{font-size:13px;padding:9px 12px;}
@media (max-width:600px){
.topleft{top:12px;left:12px;gap:8px;flex-direction:column;align-items:flex-start;}
.topnav{top:12px;right:12px;}
.social{gap:7px;}
.social a{width:40px;height:40px;}
.social svg{width:19px;height:19px;}
.social a.buy img{height:23px;}
.buy-lbl{font-size:13px;}
.back-link{font-size:11px;padding:6px 9px;}
}
@media (prefers-reduced-motion:reduce){.social a{transition:none}.social a:hover{transform:none}}
