html,body,#app{width:100%;height:100%;min-height:100dvh;margin:0;overflow:hidden;background:#14080c;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}canvas{display:block;touch-action:none}#loading-screen{display:grid;width:100%;height:100%;place-items:center;color:#fff;font-family:Arial,sans-serif;background:radial-gradient(circle,#421313 0%,#14080c 60%)}button{border:1px solid #f5b44c;border-radius:4px;min-height:40px;padding:12px 18px;color:#14080c;background:#f5b44c;font-weight:700;cursor:pointer}.entry-overlay,.landing-page{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;align-items:flex-end;justify-content:center;background-position:top center;background-size:cover}.entry-overlay{background-image:var(--entry-bg-landscape)}@media (orientation: portrait){.entry-overlay{background-image:var(--entry-bg-portrait)}}.entry-overlay:before,.landing-page:before{position:absolute;top:0;right:0;bottom:0;left:0;content:"";pointer-events:none;background:linear-gradient(0deg,rgba(20,8,12,.88),rgba(20,8,12,.05) 44%)}.entry-action{position:relative;width:min(1120px,calc(100% - 48px));margin-right:auto;margin-bottom:max(62px,calc(env(safe-area-inset-bottom) + 34px));margin-left:auto;text-align:center}.loading-panel,.landing-card{position:relative;max-width:680px;margin:32px;border:1px solid rgba(245,180,76,.45);border-radius:18px;padding:32px;color:#fff;font-family:Arial,sans-serif;background:rgba(15,8,10,.78);box-shadow:0 18px 80px #0000008c}.eyebrow{margin:0 0 8px;color:#f5b44c;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.loading-panel h1,.landing-card h1{margin:0 0 12px;color:#ffefae;font-size:clamp(36px,7vw,74px);line-height:.9;text-transform:uppercase}.tagline{max-width:560px;color:#f5d7b0;font-size:18px;line-height:1.45}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:24px 0}.feature-grid span,.balance{border:1px solid rgba(255,239,174,.25);border-radius:10px;padding:10px;background:rgba(255,109,36,.12)}.entry-difficulty-buttons,.entry-mode-buttons{display:flex;justify-content:center;gap:4px}.enter-button{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:620px;min-height:296px;margin:-70px;border:0;padding:34px 40px;color:#ffefae;background:transparent url(../assets/ui/gothic_fantasy_game_ui_frame_transparent.png) center / 100% 100% no-repeat;box-shadow:none;font-size:32px;font-weight:900;text-shadow:0 2px 4px #000;text-transform:uppercase}.enter-button-title,.enter-button-subtitle{display:block;line-height:1.05}.enter-button-subtitle{margin-top:8px;font-size:22px;letter-spacing:.12em}.enter-button-easy{color:#6bbcff}.enter-button-medium{color:#ffe36b}.enter-button-hard{color:#ff4f3e}.enter-button-single{color:#ffefae}.enter-button-multiplayer{color:#9dffb3}.entry-matchmaking{display:inline-flex;min-width:min(620px,100%);min-height:180px;flex-direction:column;align-items:center;justify-content:center;padding:34px 40px;color:#9dffb3;background:transparent url(../assets/ui/gothic_fantasy_game_ui_frame_transparent.png) center / 100% 100% no-repeat;font-size:30px;font-weight:900;text-shadow:0 2px 4px #000;text-transform:uppercase}.loading-progress{width:100%;margin:0 auto;height:18px;overflow:hidden;border:1px solid rgba(255,239,174,.4);border-radius:999px;background:rgba(255,255,255,.12)}.loading-progress-fill{width:0;height:100%;background:linear-gradient(90deg,#ff4b1f,#fff1a6);transition:width .12s ease}#hud{z-index:4;display:grid;grid-template-areas:"ammo balance";grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 16px;border-top:1px solid rgba(245,180,76,.35);padding:10px 16px max(10px,env(safe-area-inset-bottom));background:rgba(15,8,10,.82);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-sizing:border-box}.hud-center{grid-area:ammo;text-align:center}.ammo-row{display:inline-flex;align-items:center;gap:8px}.hud-right{grid-area:balance;text-align:right;white-space:nowrap}.hud-label{color:#f5b44c;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.hud-sublabel{color:#f5d7b0;font-size:10px;margin-top:3px;white-space:nowrap}.ammo-count,.balance-value{color:#ffefae;font-size:28px;font-weight:800;line-height:1}.hud-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.reload-dock{position:absolute;bottom:10px;left:16px;z-index:6;color:#fff;font-family:Arial,sans-serif;pointer-events:auto}.hud-btn{min-height:28px;padding:3px 8px;font-size:12px;font-weight:700;border:1px solid #f5b44c;border-radius:4px;color:#14080c;background:#f5b44c;cursor:pointer;line-height:1}.hud-btn.selected,.hud-diff.selected{color:#fff;background:#b4371b;border-color:#b4371b}.hud-btn-quit{color:#ffefae;background:#6a1f1f;border-color:#f08a5d;white-space:nowrap}.hud-divider{display:inline-block;width:1px;height:20px;background:rgba(245,180,76,.35);margin:0 2px;vertical-align:middle}.reload-pack{position:relative;width:clamp(116px,14vw,174px);min-height:0;border:0;padding:0;color:#ffefae;background:transparent;cursor:pointer;filter:drop-shadow(0 0 8px rgba(255,79,30,.35));margin-top:-50px;margin-bottom:-50px}.reload-pack-image{display:block;width:100%;height:auto;pointer-events:none}.reload-pack-cost{position:absolute;right:12%;bottom:14%;color:#ffefae;font-size:clamp(11px,1.1vw,15px);font-weight:900;line-height:1;pointer-events:none;text-shadow:0 2px 5px #000,0 0 8px #ff4b1f}@media (min-width: 960px){#hud{gap:10px 28px;padding:14px 28px max(14px,env(safe-area-inset-bottom))}.hud-controls{gap:14px}.reload-pack{width:clamp(165px,13vw,230px);filter:drop-shadow(0 0 12px rgba(255,79,30,.45))}.reload-pack-cost{right:11%;bottom:13%;font-size:clamp(13px,1vw,18px)}.ammo-count,.balance-value{font-size:clamp(32px,2.4vw,42px)}.hud-label{font-size:12px}.hud-btn-quit{min-height:34px;padding:6px 12px;font-size:14px}}@media (max-width: 720px){.feature-grid{grid-template-columns:1fr}.entry-action{width:min(420px,calc(100% - 24px));margin-bottom:max(22px,calc(env(safe-area-inset-bottom) + 14px))}.entry-difficulty-buttons,.entry-mode-buttons{flex-direction:column;align-items:center;gap:0}.enter-button{width:min(360px,100%);min-width:0;min-height:clamp(92px,14dvh,118px);margin:-14px 0;padding:clamp(20px,3dvh,28px) 28px;font-size:clamp(20px,5.4vw,24px)}.enter-button-subtitle{margin-top:5px;font-size:clamp(13px,3.8vw,16px)}#hud{gap:6px 10px;overflow:visible;padding:8px 10px max(8px,env(safe-area-inset-bottom))}.ammo-count,.balance-value{font-size:clamp(18px,5.5vw,26px)}.ammo-row{gap:5px}.hud-btn{min-height:26px;padding:3px 6px;font-size:11px}.reload-pack{width:clamp(82px,28vw,126px)}.reload-dock{position:fixed!important;top:56vh;right:4px;bottom:auto;left:auto;z-index:100;display:block;width:clamp(150px,36vw,220px);min-width:0;padding:4px 0;background:rgba(20,8,12,.72);border-radius:10px;pointer-events:auto}.hud-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;height:auto}.reload-dock .reload-pack{display:block;width:clamp(150px,36vw,220px);margin:-42px 0;opacity:1;visibility:visible}.reload-pack-cost{right:10%;bottom:12%;font-size:10px}}@media (max-width: 480px){#hud{grid-template-areas:"ammo balance";grid-template-columns:minmax(0,1fr) minmax(128px,auto);align-items:end;gap:4px 12px;overflow:visible;padding:9px 12px max(9px,env(safe-area-inset-bottom))}.ammo-row{flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:1px}.hud-btn-quit{min-height:20px;padding:2px 7px;font-size:10px}.balance-value{font-size:clamp(20px,5.6vw,25px)}.hud-label{font-size:10px}}@media (orientation: landscape) and (max-height: 520px){#hud{padding-top:6px;padding-bottom:max(6px,env(safe-area-inset-bottom))}.reload-pack{width:clamp(86px,13vw,126px)}}@media (orientation: landscape) and (pointer: coarse){canvas,#hud{visibility:hidden}#app:after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:24px;color:#ffefae;background:#14080c;content:"Rotate your phone to portrait mode";font-family:Arial,sans-serif;font-size:clamp(22px,6vw,34px);font-weight:900;line-height:1.15;text-align:center;text-transform:uppercase}}
