@font-face{font-family:pixel;src:url('../font/fs-gravity.woff2') format('woff2');font-display:swap}
:root{--gold:#fcda3f;--ink:#0b0809;--brown:#3d2d2e;--panel:#171113;--muted:#ccbfc0}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#0d0b0b;color:#fff;font-family:pixel,system-ui,sans-serif}
body{background-image:url('../img/dirt-bg.png');background-repeat:repeat}
.game-header{height:76px;display:flex;align-items:center;gap:24px;padding:0 clamp(14px,4vw,60px);background:#090708;border-bottom:4px solid var(--gold);position:sticky;top:0;z-index:5}
.back,.chain{color:var(--gold);text-decoration:none;font-size:15px;white-space:nowrap}
.back:hover{color:#fff}
.brand{font-size:clamp(18px,3vw,28px);font-weight:700;letter-spacing:1px;flex:1;text-align:center}.brand span{color:#fff;font-size:.6em;margin-left:10px;letter-spacing:0}
.chain{border:2px solid var(--gold);padding:7px 10px;font-size:12px}
.game-shell{width:min(1120px,100%);margin:28px auto;padding:0 16px 44px}
.game-card{background:rgba(23,17,19,.94);border:4px solid var(--gold);box-shadow:10px 10px 0 rgba(0,0,0,.45);padding:16px}
.game-topbar{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.stat{background:#2a2023;border:2px solid #6a5658;padding:8px 10px;display:flex;justify-content:space-between;align-items:center}.stat-label{color:var(--muted);font-size:13px}.stat strong{color:var(--gold);font-size:20px}
.stage-wrap{position:relative;border:3px solid #6a5658;background:#100c0d;overflow:hidden}.stage-wrap:before{content:"";position:absolute;inset:0;pointer-events:none;border:4px solid rgba(252,218,63,.1)}
canvas{display:block;width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;background:#1b1420}
.start-panel,.result-panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:rgba(10,7,9,.78);padding:18px}#resultPanel[hidden]{display:none!important}.start-panel img{width:90px;height:90px;object-fit:contain;image-rendering:auto;filter:drop-shadow(4px 4px 0 #000)}h1,h2{color:var(--gold);margin:8px 0 4px;text-shadow:3px 3px 0 #000;font-size:clamp(24px,5vw,42px)}.result-panel h2{font-size:32px}.start-panel p,.result-panel p{margin:7px 0;color:#fff;font-size:15px}.hint{font-size:12px!important;color:var(--muted)!important}
.pixel-button{font:inherit;color:var(--ink);background:var(--gold);border:0;border-bottom:5px solid #a77d0a;padding:11px 24px;margin:12px 0 2px;cursor:pointer;box-shadow:4px 4px 0 #000}.pixel-button:hover{background:#ffe87d}.pixel-button:active{transform:translate(2px,2px);border-bottom-width:3px;box-shadow:2px 2px 0 #000}
.game-controls{display:flex;justify-content:space-between;align-items:center;padding:14px 4px 2px}.control-group{display:flex;gap:12px}.control{width:54px;height:48px;background:#2a2023;color:var(--gold);border:3px solid #6a5658;font:inherit;font-size:22px;cursor:pointer;touch-action:none}.control:active,.control.active{background:var(--gold);color:#201619}.jump{margin-left:auto}
.game-note{text-align:center;color:var(--muted);font-size:12px;margin-top:10px}
@media(max-width:620px){.game-header{height:auto;min-height:66px;gap:8px;padding:10px 12px;flex-wrap:wrap}.brand{order:-1;width:100%;flex:none}.back,.chain{font-size:11px}.game-shell{margin:14px auto;padding:0 8px 28px}.game-card{padding:9px;border-width:3px;box-shadow:5px 5px 0 rgba(0,0,0,.45)}.game-topbar{gap:4px}.stat{padding:7px 5px;display:block;text-align:center}.stat-label{display:block;font-size:10px}.stat strong{font-size:16px}.game-controls{padding-top:10px}.control{width:50px;height:44px}.game-note{font-size:10px}}