:root{--y:#ffe600;--w:#f4f4f4;--k:#0a0a0a;--g:#1b1b1b;--m:#8a8a8a;--r:#ff3864}
*{box-sizing:border-box}html,body{margin:0;background:var(--k);color:var(--w);font-family:"Rajdhani","Segoe UI",system-ui,sans-serif}
body{background-image:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,230,0,.03) 3px 4px);min-height:100vh}
header{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:2px solid var(--y);position:sticky;top:0;background:rgba(10,10,10,.95);z-index:5}
.logo{font:900 22px/1 monospace;color:var(--y);letter-spacing:2px}.logo span{color:var(--w);font-size:12px;margin-left:4px}
#who{margin-left:auto;font-size:13px;display:flex;gap:8px;align-items:center}#who img{width:26px;height:26px;border:1px solid var(--y)}
.net{font:11px monospace;padding:2px 6px;border:1px solid var(--m);color:var(--m)}.net.off{border-color:var(--r);color:var(--r)}
main{max-width:980px;margin:0 auto;padding:16px}
h1,h2,h3{font-family:monospace;text-transform:uppercase;letter-spacing:1px;margin:.4em 0}h2{color:var(--y)}
button,.btn{background:var(--y);color:var(--k);border:0;padding:10px 14px;font:800 14px monospace;text-transform:uppercase;cursor:pointer;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));text-decoration:none;display:inline-block}
button.ghost{background:transparent;color:var(--y);outline:1px solid var(--y);clip-path:none}button.w{background:var(--w)}button.danger{background:var(--r);color:#fff}
button:disabled{opacity:.4}
input,select{background:var(--g);color:var(--w);border:1px solid #333;border-bottom:2px solid var(--y);padding:10px;font:16px monospace;width:100%}
label{display:block;font:12px monospace;color:var(--m);text-transform:uppercase;margin:10px 0 4px}
.card{background:var(--g);border-left:4px solid var(--y);padding:14px;margin:12px 0}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.grow{flex:1}
.list{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.boxcard{cursor:pointer}.boxcard:hover{border-color:var(--w)}
.bar{height:14px;background:#000;border:1px solid var(--y);margin:8px 0}.bar i{display:block;height:100%;background:repeating-linear-gradient(45deg,var(--y) 0 8px,#d8c300 8px 16px);transition:width .4s}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;font-family:monospace}.stats div{background:#000;padding:8px;border:1px solid #333}.stats b{display:block;color:var(--y);font-size:18px}.stats small{color:var(--m);font-size:11px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px;margin:14px 0;padding:12px;background:#111;border:2px solid #333}
.cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;flex-direction:column;background:var(--k);border:1px solid #444;font:800 15px monospace;color:var(--w);cursor:pointer;position:relative;user-select:none}
.cell small{font-size:9px;color:var(--m);font-weight:400}
.cell.done{background:var(--y);color:var(--k);border-color:var(--y)}.cell.done small{color:#333}
.cell.done::after{content:"";position:absolute;inset:6px;background:linear-gradient(45deg,transparent 46%,var(--k) 46% 54%,transparent 54%),linear-gradient(-45deg,transparent 46%,var(--k) 46% 54%,transparent 54%);opacity:.3}
.cell.pop{animation:pop .35s}@keyframes pop{50%{transform:scale(1.18)}}
.denoms{display:flex;flex-wrap:wrap;gap:6px}.denoms label{margin:0;display:flex;gap:4px;align-items:center;background:#000;padding:6px 10px;border:1px solid #444;color:var(--w);font-size:14px}.denoms input{width:auto}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:20;padding:12px}.modal.hidden{display:none}
.modal>div{background:var(--k);border:2px solid var(--y);max-width:520px;width:100%;max-height:90vh;overflow:auto;padding:18px}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--w);color:var(--k);font:700 14px monospace;padding:10px 16px;opacity:0;transition:.3s;z-index:30;pointer-events:none}.toast.on{opacity:1}
.wish{display:flex;gap:8px;align-items:center;padding:8px;background:#000;margin:6px 0;border:1px solid #333}.wish b{color:var(--y);font-family:monospace}.wish a{color:var(--w)}
.tag{font:11px monospace;background:var(--w);color:var(--k);padding:1px 6px}
.hero{text-align:center;padding:40px 10px}.hero h1{font-size:34px;color:var(--y)}.hero p{color:var(--m)}
.tabs{display:flex;gap:6px;margin-bottom:10px}.tabs button{flex:1}
.hist{font:12px monospace;color:var(--m);max-height:180px;overflow:auto}
@media(max-width:520px){.grid{grid-template-columns:repeat(5,1fr);gap:4px;padding:6px}.cell{font-size:12px}.logo span{display:none}}
.tabs button{padding:10px 6px;font-size:12px}.red{color:var(--r)!important}.yl{color:var(--y)}
.hoyo{position:relative;height:340px;margin:8px 0 6px;overflow:hidden;background:radial-gradient(ellipse at 50% 100%,#2a2400 0,#0a0a0a 60%);border:1px solid #333}
.hoyo::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 80%,#3a2a12 0 2px,transparent 3px) 0 0/37px 29px,radial-gradient(circle at 70% 30%,#2a2008 0 2px,transparent 3px) 0 0/23px 31px;opacity:.6}
.pit-back{position:absolute;left:50%;bottom:28px;width:min(86%,520px);height:120px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#000 55%,#111 70%,#3b2c14 85%,#1a1406 100%);box-shadow:0 0 30px rgba(255,230,0,.25),inset 0 0 40px #000}
.clip{position:absolute;left:0;right:0;top:0;bottom:70px;overflow:hidden}
.climber{position:absolute;left:50%;bottom:0;height:230px;transform:translate(-50%,calc((1 - var(--rise)) * 82%));transition:transform 1.2s cubic-bezier(.3,1.4,.5,1)}
.chibi{height:100%;filter:drop-shadow(0 0 6px rgba(255,230,0,.45))}
.free .climber{animation:jump .9s ease-in-out infinite alternate}@keyframes jump{to{transform:translate(-50%,-14px) rotate(-3deg)}}
.pit-lip{position:absolute;left:50%;bottom:28px;width:min(86%,520px);height:120px;transform:translateX(-50%);border-radius:50%;border:4px solid var(--y);border-top-color:transparent;clip-path:inset(50% 0 0 0);box-shadow:0 6px 0 #3b2c14,0 0 18px rgba(255,230,0,.6);background:radial-gradient(ellipse at 50% 0,transparent 60%,#3b2c14 61%,#241a08 100%)}
.hoyo-pct{position:absolute;top:12px;left:14px;font:900 44px/1 monospace;color:var(--y);text-shadow:0 0 12px rgba(255,230,0,.6)}.hoyo-pct small{display:block;font-size:11px;color:var(--w);letter-spacing:2px}
.hoyo-pct.neg{color:var(--r);text-shadow:0 0 12px var(--r)}
.shake{animation:shake .5s}@keyframes shake{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.bar.big{height:22px}.bar.neg{border-color:var(--r);animation:shake .5s}.bar.neg i{background:var(--r)}
.debt.paid{opacity:.6;border-color:#4caf50}.debt.grew{border-color:var(--r)}
.confetti i{position:absolute;top:-10px;left:var(--x);width:8px;height:12px;background:var(--c);animation:fall var(--d) linear var(--l) infinite}@keyframes fall{to{transform:translateY(360px) rotate(540deg)}}
@media(max-width:520px){.hoyo{height:300px}.climber{height:200px}.hoyo-pct{font-size:34px}}
