/* Opcje dźwięku i obrazu mieszczą się bez poziomego przewijania. */
#hud #field-menu { position:fixed;left:50%;top:50%;right:auto;transform:translate(-50%,-50%);width:min(480px,calc(100vw - 36px));max-height:85vh;padding:28px;z-index:100;box-shadow:0 0 0 100vmax #030807a6,0 20px 70px #000b; }
#field-menu h2{margin:0 0 18px;font-size:20px;letter-spacing:3px;color:#f3d69d}
#hud #field-menu{scrollbar-width:thin;scrollbar-color:#788d7d #111919}
#field-menu .field-home{display:grid;gap:6px}
#field-menu .field-home[hidden],#field-menu .field-settings[hidden]{display:none}
#field-menu .field-home #resume-game{border-color:#b8c999;color:#e0efc5;padding:15px}
#hud #field-menu .field-home{gap:14px}
#hud #field-menu .field-home button{margin:0;min-height:54px;padding:16px 20px;font-size:14px;font-weight:700;letter-spacing:1.2px;text-align:left;border:1px solid #637a79;background:#223335;box-shadow:none;color:#e7efea;clip-path:none;border-radius:4px}
#hud #field-menu .field-home #resume-game{min-height:64px;background:#526540;border-color:#afc795;color:#fff8df;font-size:16px;border-left:5px solid #d4e5aa}
#hud #field-menu .field-home #field-settings-open{background:#263d49;border-color:#7495a5;color:#d4efff}
#hud #field-menu .field-home #command{margin-top:16px;background:#262d2c;border-color:#576864;color:#c3d1cc;font-size:12px}
#hud #field-menu .field-home #leave{margin-top:8px;background:#392926;border-color:#82615a;color:#e9b6a9;font-size:12px}
#hud #field-menu .field-home button:hover{filter:brightness(1.25);border-color:#e1e7d6}
#hud #field-menu .field-home button:focus-visible{outline:2px solid #f2d799;outline-offset:3px}
#hud #field-menu .volume-settings{margin:0;padding:0;border:0}
.settings-section{display:grid;gap:16px;margin:0 0 22px;padding-bottom:20px;border-bottom:1px solid #788d8744}
.settings-section h3{margin:0;font-size:11px;letter-spacing:2px;color:#d3b77e}
#field-menu .volume-settings { min-width:0; }
#field-menu .volume-toggle button { width:auto; margin-top:0; }
body.loading-game #menu-column, body.loading-game #workshop-button { visibility:hidden; }
#game-loading { position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding-inline:16px;background:radial-gradient(ellipse at 50% 40%,#2b312d,#0c100f 75%); }
#game-loading[hidden] { display:none; }
.loading-card { width:min(760px,100%);display:grid;gap:40px;color:#ecebe4; }
.loading-showcase { margin:0;display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center; }
.loading-showcase[hidden] { display:none; }
.showcase-window { width:256px;height:256px;max-width:100%;overflow:hidden;filter:drop-shadow(0 18px 16px #000a); }
.showcase-row, .showcase-col { will-change:transform; }
.showcase-col canvas { display:block; }
.loading-showcase .eyebrow { color:#ef6251; }
.loading-showcase h1 { font-size:clamp(24px,4vw,36px);letter-spacing:.1em;font-weight:700;margin:8px 0 12px; }
.showcase-text { color:#c8cfc4;font-size:14px;line-height:1.6;margin:0 0 14px; }
.showcase-tags { display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 18px;padding:0; }
.showcase-tags li { font-size:9px;font-weight:700;letter-spacing:.14em;padding:5px 8px;border:1px solid #85857b88;color:#e6e6df; }
.showcase-stats { display:flex;flex-wrap:wrap;gap:12px 28px;margin:0; }
.showcase-stats div { display:grid;gap:4px; }
.showcase-stats dt { font-size:9px;font-weight:700;letter-spacing:.14em;color:#9aa39a; }
.showcase-stats dd { margin:0;font-size:18px;color:#f3dcb3;font-variant-numeric:tabular-nums; }
.loading-progress p { margin:0 0 10px;font-size:11px;letter-spacing:.12em;color:#b4b7b1; }
.loading-bar { position:relative;height:6px;border:1px solid #6a6f66;background:#080c0b;overflow:hidden; }
.loading-bar i { position:absolute;inset:0;background:linear-gradient(90deg,#9b1d14,#d83729 70%,#ff7a5c);transform:scaleX(0);transform-origin:left;will-change:transform; }

@media (max-width:640px) { .loading-showcase { grid-template-columns:1fr;justify-items:center;text-align:center; } .showcase-tags, .showcase-stats { justify-content:center; } }
