#settings {position:fixed}
#settings {top:18px}
#settings {right:78px}
#settings {width:38px}
#settings {height:38px}
#settings {border:1px solid #d7bf7d70}
#settings {background:#1b2824df}
#settings {border-radius:10px}
#settings {font-size:21px}
#settings-panel {position:fixed}
#settings-panel {inset:0}
#settings-panel {z-index:30}
#settings-panel {background:#0c1514e8}
#settings-panel {display:grid}
#settings-panel {place-items:center}
#settings-panel {padding:20px}
#settings-panel {overflow:auto}
#settings-panel {touch-action:pan-y}
#settings-panel section {width:min(380px,100%)}
#settings-panel section {padding:24px}
#settings-panel section {background:#1b2d29}
#settings-panel section {border:1px solid #d4bd7840}
#settings-panel section {border-radius:18px}
#settings-panel section {box-shadow:0 20px 70px #0008}
#settings-panel h2 {margin:0 0 22px}
#settings-panel h2 {font-size:24px}
#settings-panel label {display:grid}
#settings-panel label {gap:9px}
#settings-panel label {margin:18px 0}
#settings-panel label {font-size:13px}
#settings-panel label {color:#e9e1c9}
#settings-panel input[type=range] {width:100%}
#settings-panel input[type=range] {accent-color:#d7bf7d}
#settings-panel input[type=range] {min-height:32px}
#settings-panel input[type=range] {touch-action:pan-x}
#settings-panel select {width:100%}
#settings-panel select {padding:12px}
#settings-panel select {color:#f0e8d2}
#settings-panel select {background:#10221d}
#settings-panel select {border:1px solid #8e9e8655}
#settings-panel select {border-radius:8px}
#settings-panel select {font-size:14px}
#settings-panel label.check {display:flex}
#settings-panel label.check {align-items:center}
#settings-panel input[type=checkbox] {width:22px}
#settings-panel input[type=checkbox] {height:22px}
#settings-panel input[type=checkbox] {accent-color:#d7bf7d}
#settings-panel p {font-size:12px}
#settings-panel p {line-height:1.6}
#settings-panel p {color:#b2beb5}
#close-settings {width:100%}
#close-settings {min-height:48px}
#close-settings {background:#d7bf7d}
#close-settings {border:0}
#close-settings {border-radius:9px}
#close-settings {color:#14221e}
#close-settings {font-weight:700}
#hit-label {position:fixed}
#hit-label {top:calc(50% + 27px)}
#hit-label {left:50%}
#hit-label {transform:translateX(-50%)}
#hit-label {font:bold 9px Arial}
#hit-label {letter-spacing:1.5px}
#hit-label {color:#ffe1a2}
#hit-label {pointer-events:none}
#hit-label {opacity:0}
#hit-label {transition:opacity .1s}
#hit-label.show {opacity:1}
#crosshair {font:25px Arial}
#crosshair {text-shadow:0 1px 4px #000}
#crosshair.hit {color:#fff}
#crosshair.hit {transform:translate(-50%,-50%) rotate(45deg)}
#crosshair.hit {font-size:32px}
#crosshair.kill {color:#e7b36a}
#crosshair.kill {transform:translate(-50%,-50%) rotate(45deg)}
#damage-direction {position:fixed}
#damage-direction {left:50%}
#damage-direction {top:50%}
#damage-direction {width:180px}
#damage-direction {height:180px}
#damage-direction {text-align:center}
#damage-direction {color:#f57855}
#damage-direction {font:bold 36px Arial}
#damage-direction {pointer-events:none}
#damage-direction {opacity:0}
#damage-direction {transition:opacity .12s}
#kill-count {font:11px monospace}
#kill-count {color:#c6cbbb}
#game, #play-area, #stick, #fire {touch-action:none}
#objective,#health,#weapon,#minimap,#desktop-help,#hit-label,#damage-direction {pointer-events:none}
#settings {z-index:6}
@media(max-width:600px) {
#hud {top:12px}
#hud {left:16px}
#hud {right:143px}
#hud {height:34px}
.brand strong {font-size:20px}
.brand .eyebrow {display:none}
.top-right {gap:4px}
#timer {display:none}
#kill-count {font-size:10px}
#pause {position:fixed}
#pause {top:12px}
#pause {right:130px}
#pause {width:32px}
#pause {height:34px}
#pause {font-size:13px}
#pov {top:12px}
#pov {bottom:auto}
#pov {left:auto}
#pov {right:48px}
#pov {width:74px}
#pov {height:34px}
#pov {font-size:10px}
#pov {border-radius:9px}
#settings {top:12px}
#settings {right:8px}
#settings {width:32px}
#settings {height:34px}
#settings {font-size:19px}
#health {top:58px}
#health {bottom:auto}
#health {left:17px}
#health {width:145px}
#health {height:18px}
#health {display:flex}
#health {align-items:center}
#health {gap:8px}
#health>span {display:none}
#health .hp-track {width:106px}
#health .hp-track {height:5px}
#health .hp-track {margin:0}
#hp-number {position:static}
#hp-number {font-size:13px}
#objective {top:88px}
#objective {left:16px}
#objective {padding:9px 10px}
#objective {gap:9px}
#objective {max-width:calc(100% - 88px)}
#objective {min-height:42px}
#objective-label {font-size:8px}
#objective-label {letter-spacing:.6px}
#objective-detail {font-size:9px}
#distance {font-size:11px}
#distance {margin-left:2px}
#minimap {top:87px}
#minimap {right:12px}
#minimap {width:55px}
#minimap {height:66px}
#minimap {opacity:.72}
#stick {left:22px}
#stick {bottom:calc(30px + env(safe-area-inset-bottom))}
#stick {width:126px}
#stick {height:126px}
#stick {background:#17252124}
#stick {border-color:#dfdab750}
body.pov #stick::after {content:'HOD'}
body.pov #stick::after {bottom:-17px}
body.pov #stick::after {font-size:8px}
body.pov #stick::after {color:#d1d2bd}
#stick-knob {background:#c9b87745}
#stick-knob {border-color:#e5d7a899}
#actions {right:16px}
#actions {bottom:calc(14px + env(safe-area-inset-bottom))}
#actions {grid-template-columns:repeat(2,46px)}
#actions {gap:10px}
#actions button {width:46px}
#actions button {height:46px}
#actions button {background:#15282280}
#actions button {border-color:#e2dbb840}
#actions button b {font-size:20px}
#actions button small {font-size:7px}
#actions button small {letter-spacing:0}
#fire,body.pov #fire {right:16px}
#fire,body.pov #fire {bottom:calc(128px + env(safe-area-inset-bottom))}
#fire,body.pov #fire {width:78px}
#fire,body.pov #fire {height:68px}
#fire,body.pov #fire {font-size:14px}
#fire,body.pov #fire {border-radius:22px}
#fire,body.pov #fire {background:#ac6039d9}
#aim-down-sights {right:105px}
#aim-down-sights {bottom:calc(136px + env(safe-area-inset-bottom))}
#aim-down-sights {width:58px}
#aim-down-sights {height:50px}
#aim-down-sights {border-radius:16px}
#aim-down-sights {font-size:9px}
#aim-down-sights {background:#1f342dcc}
#weapon {right:18px}
#weapon {bottom:calc(211px + env(safe-area-inset-bottom))}
#weapon {text-align:right}
#weapon>span {font-size:8px}
#weapon>span {letter-spacing:1px}
#ammo {font-size:27px}
#ammo {line-height:1.1}
#ammo span {font-size:13px}
#reload-label {font-size:8px}
#reload-label {letter-spacing:.5px}
#reload-label {margin-top:3px}
#toast {top:161px}
#toast {max-width:calc(100% - 40px)}
#toast {font-size:10px}
#toast {padding:8px 12px}
#toast {line-height:1.5}
#vignette {background:radial-gradient(ellipse at 50% 40%,transparent 52%,#0c141e40 100%)}
}
@media(max-height:520px) and (min-width:601px) {
#hud {top:10px}
#hud {left:16px}
.brand strong {font-size:19px}
.eyebrow {display:none}
#objective {top:53px}
#objective {padding:8px}
#minimap {top:70px}
#minimap {width:60px}
#minimap {height:72px}
#settings {top:10px}
#settings {right:75px}
#health {top:113px}
#health {bottom:auto}
#health {left:18px}
#health {transform:scale(.7)}
#health {transform-origin:top left}
#stick {width:115px}
#stick {height:115px}
#stick {bottom:18px}
#actions {display:flex}
#actions {right:18px}
#actions {bottom:12px}
#actions {gap:8px}
#actions button {width:44px}
#actions button {height:44px}
#actions button b {font-size:20px}
#actions button small {font-size:7px}
#fire,body.pov #fire {bottom:75px}
#fire,body.pov #fire {width:70px}
#fire,body.pov #fire {height:60px}
#aim-down-sights {bottom:80px}
#aim-down-sights {right:110px}
#aim-down-sights {height:50px}
#weapon {bottom:146px}
#weapon {transform:scale(.75)}
#weapon {transform-origin:bottom right}
#pov {top:10px}
#pov {left:160px}
#pov {bottom:auto}
#pov {width:76px}
#pov {height:34px}
#pov {font-size:10px}
}


@media(max-width:600px) {
#kill-count {position:fixed}
#kill-count {top:60px}
#kill-count {right:18px}
}

@media(max-width:600px) {
#actions {width:102px}
}
@media(max-height:520px) and (min-width:601px) {
#actions {width:200px}
#actions button {flex-shrink:0}
#timer {display:none}
#kill-count {position:fixed}
#kill-count {right:132px}
#kill-count {top:24px}
}

body.pov #stick::after {content:"HOD + OKRET"}
body.pov[data-steering="classic"] #stick::after {content:"HOD + BOČNO"}

.loadout {display:grid}
.loadout {gap:8px}
.loadout {font-size:12px}
.loadout {margin:14px 0}
.loadout select {padding:10px}
.loadout select {background:#152822}
.loadout select {color:#ecdfbd}
.loadout select {border:1px solid #b6a87970}
.loadout select {border-radius:8px}
#smoke,#squad-command {position:fixed}
#smoke,#squad-command {min-height:38px}
#smoke,#squad-command {border:1px solid #b2d9ca80}
#smoke,#squad-command {border-radius:12px}
#smoke,#squad-command {background:#1d3a36d9}
#smoke,#squad-command {font-size:10px}
#smoke,#squad-command {touch-action:none}
#smoke {left:185px}
#smoke {bottom:45px}
#smoke {width:70px}
#squad-command {left:185px}
#squad-command {bottom:93px}
#squad-command {width:90px}
#team-status {position:fixed}
#team-status {left:25px}
#team-status {top:175px}
#team-status {font:9px monospace}
#team-status {color:#a2d9bd}
#team-status {pointer-events:none}
body:not(.playing) #smoke,body:not(.playing) #squad-command {display:none}
@media(max-width:600px) {
#smoke {left:168px}
#smoke {bottom:calc(30px + env(safe-area-inset-bottom))}
#smoke {width:62px}
#squad-command {left:155px}
#squad-command {bottom:calc(78px + env(safe-area-inset-bottom))}
#squad-command {width:76px}
#team-status {left:17px}
#team-status {top:145px}
#briefing {padding:22px}
#briefing h1 {font-size:42px}
#briefing .classification {margin-bottom:12px}
#briefing .brief-details {margin:12px 0}
#briefing p {font-size:12px}
.loadout select {max-width:100%}
}
@media(max-height:520px) {
#team-status {top:144px}
#overlay {overflow:auto}
#briefing {margin:auto}
.loadout {margin:8px 0}
#briefing .instructions {display:none}
}

#change-role {display:block}
#change-role {margin:12px auto 0}
#change-role {background:transparent}
#change-role {color:#ddd2ae}
#change-role {min-height:40px}
#change-role {border:1px solid #ddd2ae55}
#change-role {font-size:11px}

#level-badge {position:fixed}
#level-badge {left:25px}
#level-badge {top:195px}
#level-badge {font:10px monospace}
#level-badge {color:#e0ca90}
#level-badge {pointer-events:none}
#level-description {font-size:10px}
#level-description {color:#b4c5b7}
#next-level {display:block}
#next-level {margin:12px auto}
#next-level {min-height:44px}
#next-level {padding:10px 20px}
#next-level {background:#d7bf7d}
#next-level {color:#152822}
#next-level {border:0}
#next-level {border-radius:10px}
@media(max-width:600px) {
#level-badge {top:161px}
#level-badge {left:17px}
#toast {top:184px}
#briefing .brief-details {display:none}
#briefing .classification {display:none}
#briefing h1 {font-size:34px}
#briefing .loadout {margin:8px 0}
#briefing p {margin:8px 0}
#overlay {overflow:auto}
}

#armor-status {position:fixed}
#armor-status {left:25px}
#armor-status {top:215px}
#armor-status {font:9px monospace}
#armor-status {color:#a8cbd8}
#armor-status {pointer-events:none}
@media(max-width:600px) {
#armor-status {top:177px}
#armor-status {left:17px}
#toast {top:200px}
}
#tactical-tools {position:fixed}
#tactical-tools {left:18px}
#tactical-tools {bottom:205px}
#tactical-tools {display:flex}
#tactical-tools {gap:6px}
#tactical-tools {z-index:12}
#tactical-tools button {height:40px}
#tactical-tools button {padding:0 10px}
#tactical-tools button {font:10px monospace}
#tactical-tools button {color:#e4d49e}
#tactical-tools button {background:#17332ee8}
#tactical-tools button {border:1px solid #c3be8b88}
#tactical-tools button {border-radius:9px}
#tactical-tools button {touch-action:none}
#crouch[aria-pressed="true"] {background:#8c7130}
body:not(.playing) #tactical-tools {display:none}
@media(max-height:520px) {
#tactical-tools {left:180px}
#tactical-tools {bottom:145px}
#tactical-tools button {height:34px}
#armor-status {top:170px}
}

#crosshair::before {content:''}
#crosshair::before {position:absolute}
#crosshair::before {left:50%}
#crosshair::before {top:50%}
#crosshair::before {width:calc(var(--spread-radius, 5px) * 2)}
#crosshair::before {height:calc(var(--spread-radius, 5px) * 2)}
#crosshair::before {transform:translate(-50%,-50%)}
#crosshair::before {border:1px solid #ffffff80}
#crosshair::before {border-radius:50%}
.training #squad-command, .training #plan, .training #exit-route, .training #team-status {display:none}

#range-menu {display:block}
.training #range-menu {display:block}

.arena #exit-route {display:none}

#tactical-tools {max-width:calc(100% - 36px)}
#tactical-tools {flex-wrap:wrap}
@media(min-width:601px) and (min-height:521px) {
#pov {top:18px}
#pov {bottom:auto}
#pov {left:auto}
#pov {right:140px}
#pov {width:90px}
#pov {height:38px}
}