.gd-hud { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.gd-joystick{position:absolute;z-index:3;right:28px;bottom:112px;display:flex;align-items:center;gap:16px;padding:13px 15px;border:1px solid rgba(224,181,91,.28);border-radius:26px;background:rgba(8,7,5,.78);box-shadow:0 18px 45px rgba(0,0,0,.38);backdrop-filter:blur(18px);touch-action:none}.gd-stick{position:relative;width:112px;height:112px;border:1px solid rgba(235,198,111,.42);border-radius:50%;background:radial-gradient(circle,rgba(218,172,78,.2) 0 8%,transparent 9%),linear-gradient(rgba(255,255,255,.04),rgba(0,0,0,.2));box-shadow:inset 0 0 0 14px rgba(255,255,255,.025);touch-action:none}.gd-stick:before,.gd-stick:after{content:"";position:absolute;background:rgba(235,198,111,.16);pointer-events:none}.gd-stick:before{left:50%;top:10px;bottom:10px;width:1px}.gd-stick:after{top:50%;left:10px;right:10px;height:1px}.gd-stick i{position:absolute;z-index:2;left:calc(50% - 22px);top:calc(50% - 22px);width:44px;height:44px;border:1px solid #efd184;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f7dda0,#aa762b);box-shadow:0 8px 18px #000,0 0 20px rgba(232,187,85,.28);transition:transform .08s linear;pointer-events:none}.gd-stick span{position:absolute;inset:auto 0 16px;color:#7f7567;font-size:7px;line-height:1.25;letter-spacing:.12em;text-align:center;text-transform:uppercase;pointer-events:none}.gd-joystick__readout{display:grid;gap:8px;min-width:70px}.gd-joystick__readout span{display:grid;gap:2px;color:#81786c;font-size:8px;letter-spacing:.12em;text-transform:uppercase}.gd-joystick__readout b{color:#e0bd6e;font-size:13px}.gd-joystick>button{display:grid;width:72px;height:72px;place-items:center;border:1px solid #f0ce81;border-radius:50%;background:radial-gradient(circle at 35% 25%,#f1ce78,#9d6d25);box-shadow:0 9px 25px rgba(0,0,0,.4);color:#171006;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}.gd-joystick>button:active{transform:scale(.94)}.gd-level-toast{position:absolute;z-index:5;top:50%;left:50%;display:grid;gap:5px;min-width:220px;padding:16px 24px;border:1px solid rgba(224,181,91,.3);border-radius:16px;background:rgba(8,7,5,.82);box-shadow:0 20px 50px #000;transform:translate(-50%,-50%);text-align:center;pointer-events:none;backdrop-filter:blur(16px)}.gd-level-toast[hidden]{display:none}.gd-level-toast small{color:#9a8e7e;font-size:8px;letter-spacing:.18em;text-transform:uppercase}.gd-level-toast b{color:#e7c779;font:500 25px "Cormorant Garamond",serif}

@media (max-width: 700px) {
  .gd-hud { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-wind { grid-column: 1 / -1; }
  .gd-aim{display:none}.gd-joystick{right:12px;bottom:14px;left:12px;justify-content:space-between;padding:10px 13px;border-radius:22px}.gd-stick{width:104px;height:104px}.gd-joystick>button{width:68px;height:68px}.gd-stage{padding-bottom:0}.gd-message{place-content:center;justify-items:center;padding:24px 20px;background:linear-gradient(rgba(5,5,4,.78),rgba(5,5,4,.42));text-align:center}.gd-message h1{font-size:clamp(38px,12vw,62px)}
}

.gd-message{place-content:center start;justify-items:start;padding-left:clamp(34px,7vw,100px);background:linear-gradient(90deg,rgba(5,5,4,.96) 0 36%,rgba(5,5,4,.72) 52%,rgba(5,5,4,.12) 78%,transparent);text-align:left}.gd-message p{max-width:480px}.gd-message button{margin-top:10px}

/* Site theme: warm ivory, graphite and restrained Miller Rings gold. */
html,body{background:#f3eee6;color:#302a23}.gd-shell{background:radial-gradient(circle at 50% -20%,rgba(177,139,72,.22),transparent 40%),#f3eee6}.gd-brand{color:#332b22}.gd-brand span,.gd-wallet b{color:#9c712d}.gd-wallet{border-color:rgba(139,101,42,.25);background:rgba(255,255,255,.72);box-shadow:0 12px 40px rgba(69,49,20,.08)}.gd-wallet small{color:#7e7264}.gd-stage{border-color:rgba(129,91,35,.3);box-shadow:0 32px 90px rgba(62,42,15,.18)}.gd-shell>footer{color:#6e6255}.gd-shell>footer button{color:#8f6526}.gd-joystick{background:rgba(39,34,28,.88);border-color:rgba(218,178,99,.35)}
