:root{--bg:#0b0d0c;--g:#4f9a35;--au:#e0b84a;--tx:#e9ece8;--mu:#97a39b;--ck:repeating-conic-gradient(rgba(0,0,0,.14) 0 25%,transparent 0 50%) 0 0/8px 8px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font:16px/1.65 Inter,system-ui,sans-serif;color:var(--tx);background:var(--bg) var(--ck);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}
.px{font-family:'Press Start 2P','Courier New',monospace;line-height:1.5}
a{color:var(--au)}
:focus-visible{outline:3px solid var(--au);outline-offset:3px}
.top{position:absolute;z-index:5;inset:0 0 auto;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding:18px max(20px,calc(50% - 560px));background:linear-gradient(#000a,transparent)}
.logo{display:flex;gap:12px;align-items:center;font-size:13px;color:var(--tx);text-decoration:none;text-shadow:3px 3px 0 #000}
.top nav{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.top nav a,.lang{font:600 14px Inter,sans-serif;color:#cfd6d1;text-decoration:none;padding:8px 12px;background:none;border:2px solid transparent;cursor:pointer;transition:.15s}
.top nav a:hover,.lang:hover{color:#fff;border-color:#ffffff30;background:#00000055}
.lang{border-color:#ffffff30}
.cube{display:inline-block;width:34px;height:38px;flex:none;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);background:var(--ck),conic-gradient(var(--ct) 0 60deg,var(--cr) 0 180deg,var(--cl) 0 300deg,var(--ct) 0)}
.grass{--ct:#5aa83a;--cr:#7a5230;--cl:#5e3f23}.stone{--ct:#a3a8a5;--cr:#6b706d;--cl:#868b88}.obs{--ct:#32254f;--cr:#110b1e;--cl:#1d1532}.gold{--ct:#f3d36b;--cr:#b8902a;--cl:#d4ad3d}
.hero{position:relative;min-height:96vh;display:grid;place-items:center;overflow:hidden;background:linear-gradient(#070b14 0,#15233a 38%,#3b4a52 66%,#7a6a52 100%)}
.hero canvas{position:absolute;left:-5%;bottom:0;width:110%;height:100%;image-rendering:pixelated;transition:transform .25s ease-out;will-change:transform}
.hero canvas.cl{height:34%;top:6%;bottom:auto;width:220%;left:0;animation:dr 160s linear infinite}
@keyframes dr{to{transform:translateX(-50%)}}
.moon{position:absolute;top:11%;right:14%;width:64px;height:64px;background:#f4ecc4;box-shadow:inset -10px -10px 0 #d8cc98,0 0 80px 30px #f4ecc428}
.fy{position:absolute;width:4px;height:4px;background:var(--au);box-shadow:0 0 8px 2px #e0b84a88;opacity:0;animation:fy 9s ease-in-out infinite}
@keyframes fy{50%{opacity:.85}to{transform:translate(18px,-46px);opacity:0}}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,#0000 20%,#000b 100%),linear-gradient(#0000 55%,#0b0d0c 100%)}
.hc{position:relative;z-index:3;text-align:center;padding:110px 20px 90px;max-width:900px}
.title{font-size:clamp(32px,9.4vw,104px);color:#f3edd2;letter-spacing:-.02em;text-shadow:0 1px #c9a43a,0 2px #b8902a,0 3px #a07c1e,0 4px #8a6a18,0 5px #6e5412,0 6px #543f0d,0 14px 24px #000c;animation:dp .9s cubic-bezier(.2,.9,.3,1.1) both}
@keyframes dp{from{transform:translateY(-40px);opacity:0}}
.tag{margin:22px auto 30px;max-width:46ch;font-size:18px;color:#d5dbd6;text-shadow:0 2px 12px #000;animation:up .7s .35s both}
@keyframes up{from{transform:translateY(16px);opacity:0}}
.ipbar{display:inline-flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;padding:12px 14px 12px 22px;background:#050606cc;border:4px solid #000;box-shadow:inset 0 0 0 2px #3a423e,0 0 0 2px #e0b84a55,0 12px 40px #000a;animation:up .7s .5s both}
.ipbar code{font:inherit;font-family:'Press Start 2P',monospace;font-size:clamp(11px,3vw,16px);color:var(--au)}
.badge{display:block;max-width:100%;height:auto;margin:20px auto 0;animation:up .7s .65s both}
.btn{display:inline-block;font:11px/1.4 'Press Start 2P',monospace;color:#fff;text-decoration:none;text-shadow:2px 2px 0 #333;padding:14px 20px;background:var(--ck),#898f8b;border:4px solid #000;box-shadow:inset 3px 3px 0 #c3c8c4,inset -3px -3px 0 #575c59;cursor:pointer;transition:transform .15s,box-shadow .15s,background-color .15s}
.btn:hover{background-color:#5c9a42;transform:translateY(-3px);box-shadow:inset 3px 3px 0 #a8e083,inset -3px -3px 0 #2d6620,0 0 22px #5cb03c66}
.btn:active{transform:translateY(0);box-shadow:inset 3px 3px 0 #575c59,inset -3px -3px 0 #c3c8c4}
.btn:disabled{opacity:.6;cursor:wait}
.btn.au{background-color:#c79a2c;box-shadow:inset 3px 3px 0 #f3d36b,inset -3px -3px 0 #7d5e12;text-shadow:2px 2px 0 #5a430c}
.btn.au:hover{background-color:#dcae36;box-shadow:inset 3px 3px 0 #ffe9a0,inset -3px -3px 0 #7d5e12,0 0 24px #e0b84a77}
.sep{height:28px;margin-top:-28px;position:relative;z-index:4;background:var(--ck),linear-gradient(#5aa83a 0 10px,#3d2a17 10px 22px,#2a2a2a 22px)}
main{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:30px 20px 70px}
section{padding:70px 0 0}
h2{font:16px/1.5 'Press Start 2P',monospace;margin-bottom:10px;text-shadow:3px 3px 0 #000}
.sub{color:var(--mu);max-width:56ch;margin-bottom:30px}
.pn{background:var(--ck),#1b1f1d;border:4px solid #000;box-shadow:inset 4px 4px 0 #353d39,inset -4px -4px 0 #101312,0 14px 34px #000a;padding:26px;position:relative;transition:transform .2s,box-shadow .2s}
.pn:hover{transform:translateY(-4px);box-shadow:inset 4px 4px 0 #3f4944,inset -4px -4px 0 #101312,0 18px 40px #000b,0 0 26px #4f9a3533}
.craft{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.craft .pn{padding:20px;text-align:center}
.slot{width:72px;height:72px;margin:0 auto 14px;display:grid;place-items:center;background:#0c0e0d;border:4px solid;border-color:#050606 #3c443f #3c443f #050606;font:22px 'Press Start 2P',monospace;color:var(--au)}
.slot .cube{width:44px;height:48px}
.craft p{font-size:14px;color:#cfd6d1}
.bento{display:grid;grid-template-columns:1.5fr 1fr;gap:20px}
.bento .big{grid-row:span 2;display:flex;flex-direction:column;justify-content:flex-end;min-height:300px;background:linear-gradient(#0000 20%,#000c),radial-gradient(circle at 70% 25%,#4f9a3544,#0000 55%),var(--ck),#1b1f1d}
.bento .big .cube{position:absolute;top:26px;right:26px;width:96px;height:106px}
.bento h3{font:12px/1.6 'Press Start 2P',monospace;margin-bottom:8px;color:var(--au)}
.bento p{color:#c3cbc5;font-size:15px}
.bento .pn:not(.big){display:flex;gap:16px;align-items:flex-start}
.rules{list-style:none;padding:0;counter-reset:r;display:grid;gap:10px}
.rules li{counter-increment:r;display:flex;gap:16px;align-items:center;padding:12px 16px;background:#0f1211;border-left:4px solid var(--au)}
.rules li::before{content:counter(r);flex:none;width:34px;height:34px;display:grid;place-items:center;background:#0c0e0d;border:3px solid;border-color:#050606 #3c443f #3c443f #050606;font:11px 'Press Start 2P',monospace;color:var(--au)}
.dc{margin-top:70px;text-align:center;padding:50px 20px;background:radial-gradient(ellipse at 50% 0,#4a2f8044,#0000 65%),var(--ck),#120d1d;border:4px solid #000;box-shadow:inset 0 0 0 3px #2a1f40,0 0 40px #32254f66}
.dc h2{margin-bottom:14px}.dc .sub{margin:0 auto 26px}
form{display:grid;gap:18px;margin-top:10px}
label{display:grid;gap:7px;font-weight:600;font-size:14px;color:#cfd6d1}
input,select,textarea{font:inherit;color:var(--tx);background:#0c0e0d;border:4px solid;border-color:#050606 #3c443f #3c443f #050606;padding:11px 13px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 2px var(--g)}
textarea{min-height:150px;resize:vertical}
.hp{position:absolute;left:-9999px}
#msg{min-height:1.6em;color:var(--mu)}.ok{color:#7bc24f!important}.bad{color:#ff8a8a!important}
.pg{padding-top:130px}
footer{text-align:center;padding:26px;color:var(--mu);font-size:13px;border-top:4px solid #000;background:var(--ck),#090b0a}
@media(max-width:820px){.craft{grid-template-columns:1fr 1fr}.bento{grid-template-columns:1fr}.bento .big{grid-row:auto}}
@media(max-width:480px){.craft{grid-template-columns:1fr}.hero{min-height:88vh}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}