/* Optical OSD: local contrast fields, registration corners and quiet legends. */
:root { --accent:#fff; --accent2:#fff; --gold:#eee; --ok:#fff; --text:#fafafa; --muted:#bbb; --panel:rgba(8,8,8,.92); --panel-border:#555; --slab:#191919; --slab-hi:#333; --well:#090909; --bevel:none; --well-shadow:none; }
body.fpv-interface { color:#fff; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.demo-mode #fpv-nav [data-pvp],.demo-mode #npcBtn,.demo-mode #fpv-nav [data-map-picker],.demo-mode #fpv-nav [data-chat],
.demo-mode .chat,.demo-mode #scoreboard,.demo-mode #pilot-name,.demo-mode label[for="pilot-name"] { display:none!important; }
#demo-connection-status { position:fixed; top:58px; left:18px; z-index:15; padding:7px 10px; color:#e3ecf2; background:#080c10dd; font:10px ui-monospace,monospace; }
/* Set in HTML, before modules load: never paint the legacy join layout. */
body.hud-pending #welcome,body.hud-pending #overlay,
body.hud-pending #crosshair,body.hud-pending #bodyCue,
body.hud-pending #touch-controls,body.hud-pending #touchControls { visibility:hidden; }
.fpv-interface button,.fpv-interface select { border:1px solid #777; border-radius:0; background:#151515; color:#fff; box-shadow:none; font:inherit; cursor:pointer; }
.fpv-interface button:hover { background:#363636; }
.fpv-interface button:focus-visible,.fpv-interface input:focus-visible { outline:2px solid white; outline-offset:3px; }
.fpv-interface button[aria-pressed=true] { color:#000; background:#fff; }
.fpv-interface #topleft,.fpv-interface #skins,.fpv-interface #dock,.fpv-interface .instruments,.fpv-interface .topbar,.fpv-interface .location-tag,.fpv-interface #combatHud,.fpv-interface #muteBtn,.fpv-interface #musicBtn,.fpv-interface #respawn-button,.fpv-interface #aircraft-respawn { display:none!important; }
#fpv-hud { position:fixed; z-index:15; bottom:0; left:0; right:0; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:6px 24px calc(6px + env(safe-area-inset-bottom)); background:transparent; color:#fff; font:11px ui-monospace,monospace; }
#fpv-hud label { display:block; margin:0; font-size:8px; line-height:1.2; letter-spacing:.12em; color:#a5a8ab; }
.hud-stats { display:flex; gap:8px; align-items:stretch; }
.hud-number,.hud-instrument { position:relative; background:#07090bbc; border:1px solid transparent; padding:5px 8px; }
.hud-number { width:132px; flex:0 0 132px; min-width:0; display:grid; grid-template-columns:minmax(0,1fr) auto; align-content:center; align-items:baseline; column-gap:5px; }
.hud-number strong { display:block; min-width:0; white-space:nowrap; text-align:right; font-size:22px; font-weight:500; line-height:1.2; font-variant-numeric:tabular-nums slashed-zero; margin:0; letter-spacing:-.025em; text-shadow:0 1px 1px #000; }
.hud-number small { color:#b5b9bc; font-size:8px; letter-spacing:.03em; text-align:right; }
.hud-instrument { display:flex; align-items:center; }
.hud-instrument canvas { height:56px; width:auto; }
.hud-control-row { display:flex; align-items:center; gap:4px; }
.hud-profiles { display:contents; }
#fpv-hud .hud-controls>label { display:none; }
#fpv-hud button { position:relative; font-size:10px; font-weight:500; letter-spacing:.05em; height:36px; padding:6px; border:1px solid transparent; background:#07090bd9; color:#d0d4d7; }
#fpv-hud button:hover { background:#25292de8; color:#fff; }
#fpv-hud button[aria-pressed=true] { background:#1b2025e6; color:#fff; border-color:transparent; box-shadow:inset 0 -2px #e6ecef; }
#fpv-hud button:active { transform:none; box-shadow:none; }
.fpv-interface kbd { font:10px ui-monospace,monospace; color:inherit; background:transparent; border:1px solid #888; border-radius:0; padding:2px 4px; margin-right:6px; box-shadow:none; }
#fpv-hud kbd { border:0; border-right:1px solid #ffffff30; padding:1px 5px 1px 0; margin:0 5px 0 0; color:#9da5ac; opacity:1; font-size:9px; }
#fpv-hud .hud-reload #combatAmmo { display:inline-block; width:6ch; margin-left:8px; text-align:right; font:inherit; font-variant-numeric:tabular-nums slashed-zero; color:#fff; white-space:nowrap; }
#fpv-nav { position:fixed; top:0; left:0; right:0; z-index:16; display:flex; justify-content:space-between; align-items:center; padding:12px 24px; background:transparent; text-shadow:0 1px 3px #000,0 0 3px #000; font-size:11px; letter-spacing:.12em; }
#fpv-nav b { color:#bbb; font-weight:400; }
#fpv-nav button { position:relative; padding:7px 10px; margin-left:8px; font-size:10px; font-weight:500; letter-spacing:.08em; border:1px solid transparent; background:#07090bc9; }
#fpv-nav button:hover { background:#25292de8; }
#fpv-nav button[aria-pressed=true] { color:#fff; background:#1b2025e6; box-shadow:inset 0 -2px #e6ecef; }
#fpv-nav kbd { border:0; padding:0; margin-right:4px; color:#aeb5bc; }
/* Four crisp corner brackets, with the middle of each edge left open. */
.hud-number::before,.hud-instrument::before,#fpv-hud button::before,#fpv-nav button::before,#sensitivity-dialog::before {
  content:""; position:absolute; inset:-1px; border:1px solid #d4dde180; pointer-events:none;
  mask: linear-gradient(#000 0 0) top left / 6px 6px no-repeat,
        linear-gradient(#000 0 0) top right / 6px 6px no-repeat,
        linear-gradient(#000 0 0) bottom left / 6px 6px no-repeat,
        linear-gradient(#000 0 0) bottom right / 6px 6px no-repeat;
}
#fpv-hud button[aria-pressed=true]::before { border-color:#e6ecef; }
#sensitivity-dialog { width:min(340px,calc(100vw - 32px)); padding:20px; color:#edf3f5; background:#080c10f5; border:1px solid transparent; border-radius:0; font:12px ui-monospace,monospace; }
#sensitivity-dialog::backdrop { background:#0008; }
#sensitivity-dialog h2 { margin:0 0 12px; font:14px ui-monospace,monospace; letter-spacing:.05em; }
#sensitivity-dialog p { color:#b7c3cb; line-height:1.6; }
#sensitivity-dialog label { display:block; margin:12px 0 6px; }
#sensitivity-dialog input { width:100%; padding:9px; font:16px ui-monospace,monospace; }
#sensitivity-dialog form>div { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
#sensitivity-dialog button { padding:7px 12px; font:11px ui-monospace,monospace; }
.fpv-interface #chat,.fpv-interface .chat { position:fixed; left:24px; top:var(--fpv-chat-top,64px); bottom:var(--fpv-chat-bottom,98px); width:40vw; max-width:calc(100vw - 48px); display:flex; flex-direction:column; min-height:0; background:#080a0de8; border:1px solid #ffffff24; box-shadow:none; padding:12px; z-index:16; }
.fpv-interface .chat { right:auto; }
.fpv-interface #chat:not(:focus-within):not(.chat-open):not(.chat-preview),.fpv-interface .chat:not(:focus-within):not(.chat-open):not(.chat-preview) { display:none; }
.fpv-interface .chat-preview:not(.chat-open):not(:focus-within) { pointer-events:none; }
.fpv-interface #chatLog,.fpv-interface #chat-log { flex:1; height:auto; min-height:0; max-height:none; overflow-y:auto; overflow-wrap:anywhere; background:transparent; font-size:13px; line-height:1.6; margin:0 0 10px; scrollbar-width:thin; scrollbar-color:#7b858d transparent; }
.fpv-interface #chat-log { display:block; }
.fpv-interface #chatInput,.fpv-interface #chat-input { width:100%; padding:9px 2px; font-size:13px; background:transparent; border:0; border-top:1px solid #ffffff40; box-shadow:none; }
.fpv-interface #chatInput,.fpv-interface #chat-form { flex-shrink:0; }
.fpv-interface #chat .title { display:none; }
@media(max-width:760px) {
  body.fpv-interface #chat,body.fpv-interface .chat { width:calc(100vw - 20px); max-width:none; }
}
.fpv-interface input { background:#111; color:white; border:1px solid #777; border-radius:0; }
.fpv-interface #topright { top:58px; }
.fpv-interface #teleport { display:none; }
.fpv-interface:has(#worldmap:not(.hidden)) #teleport { display:block; }
.fpv-interface #overlay { background:#0008; cursor:default; }
.fpv-interface #overlay .card,.fpv-interface #welcome { position:fixed; left:50%; top:50%; bottom:auto; transform:translate(-50%,-50%); width:min(680px,calc(100vw - 32px)); max-width:680px; max-height:calc(100dvh - 32px); overflow:auto; padding:28px; margin:0; background:rgba(6,6,6,.96); border:1px solid #999; border-radius:0; box-shadow:0 20px 100px #0009; text-align:left; z-index:30; }
.fpv-interface #overlay h1,.fpv-interface #welcome h2 { font-size:28px; letter-spacing:.08em; border:0; padding:0; margin:12px 0; color:#fff; }
.fpv-interface .eyebrow { color:#bbb; font-size:10px; letter-spacing:.16em; }
.fpv-interface .control-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:20px 0; }
.fpv-interface .control-grid>div { display:flex; align-items:center; gap:8px; font-size:11px; }
.fpv-interface .control-grid kbd { white-space:nowrap; }
.fpv-interface .primary { display:block; width:100%; background:#fff; color:#000; padding:13px; font-size:13px; font-weight:bold; letter-spacing:.1em; }
.fpv-interface .primary:hover { background:#ddd; }
.fpv-interface #overlay h1 { display:block; }
.fpv-interface .arena-session { display:none; }
.fpv-interface .flight-directions { font-size:12px; line-height:1.8; color:#ccc; margin:18px 0; }
.fpv-interface .touch-note { display:none; font-size:12px; line-height:1.6; color:#ccc; }
@media(pointer:coarse) { .fpv-interface .touch-note { display:block; } }
.fpv-interface .arena-session { top:62px; background:#0009; border:1px solid #666; border-radius:0; box-shadow:none; }
.fpv-interface #bodyCue { border-color:#fff; }
.fpv-interface .crosshair { color:#fff; }
.fpv-interface #fire-button,.fpv-interface #btnFire { background:#111b; color:#fff; border-color:#aaa; box-shadow:none; }
.fpv-interface #death-overlay,.fpv-interface #aircraft-down { background:#090909ee!important; border:1px solid #888!important; border-radius:0; color:#fff; }
.fpv-interface #map-picker { background:#0b0b0b!important; color:#fff!important; border-color:#888!important; border-radius:0!important; font-family:ui-monospace,monospace!important; }
.fpv-interface #map-picker::backdrop { background:#000b; }
.fpv-interface #map-picker .map-card { background:#151515; color:#fff; border-color:#666; border-radius:0; }
.fpv-interface #map-picker .map-card:hover { background:#292929; border-color:#fff; }
.fpv-interface #map-picker .map-copy span { color:#bbb; }
.fpv-interface #map-picker button { background:#222!important; color:white!important; border-radius:0!important; }
body.ui-hidden #fpv-hud,body.ui-hidden #fpv-nav { display:none; }
@media(max-width:1000px) { #fpv-hud { gap:10px; padding:6px 14px calc(6px + env(safe-area-inset-bottom)); } .hud-stats { gap:6px; } .hud-control-row,.hud-profiles { gap:3px; } .hud-profiles { padding-right:4px; margin-right:0; } #fpv-hud button { padding:4px; font-size:9px; } .hud-number strong { font-size:20px; } .hud-number { width:96px; flex-basis:96px; grid-template-columns:minmax(0,1fr); row-gap:2px; } .hud-number,.hud-instrument { padding:5px; } .hud-instrument canvas { height:48px; } .hud-ammo { min-width:82px; padding-left:6px; margin-left:2px; } }
@media(max-width:760px) { #fpv-hud { flex-wrap:wrap; gap:6px; padding-inline:10px; } .hud-stats,.hud-controls { width:100%; min-width:0; } .hud-stats { justify-content:space-between; gap:6px; } .hud-control-row { justify-content:space-between; } #fpv-hud button { font-size:8px; padding:4px 2px; height:36px; } #fpv-hud kbd { font-size:8px; padding:1px 2px; margin-right:3px; } .hud-profiles { padding-right:3px; margin-right:0; } .hud-ammo { min-width:68px; margin-left:2px; padding-left:6px; } .hud-ammo b,.hud-ammo strong { font-size:12px; } .hud-number strong { font-size:20px; } .hud-number small { font-size:8px; } .fpv-interface #chat,.fpv-interface .chat { left:10px; } #fpv-nav { padding:10px; font-size:9px; } #fpv-nav>div { display:flex; } #fpv-nav button { padding:6px; margin-left:4px; font-size:9px; } #fpv-nav b { display:none; } .fpv-interface .control-grid { grid-template-columns:1fr; gap:10px; } }
@media(pointer:coarse) { #fpv-hud { bottom:120px; } .fpv-interface #mobileGrid { display:none; } .fpv-interface #move-pad { bottom:8px; left:16px; background:#0006; border-color:#aaa; } .fpv-interface .touch-lift { bottom:14px; right:16px; display:grid; grid-template-columns:repeat(2,48px); } .fpv-interface .touch-lift button { background:#111b; font-size:10px; } }
@media(max-width:400px) {
  #fpv-hud button { height:38px; }
  #fpv-hud kbd { display:block; width:max-content; margin:0 auto 2px; padding:0 2px; }
}
@media(max-width:360px) { #fpv-nav>span { display:none; } #fpv-nav>div { width:100%; justify-content:space-between; } #fpv-nav button { margin-left:0; }
  .hud-number { width:80px; flex-basis:80px; } .hud-number strong { font-size:16px; } .hud-instrument canvas { height:42px; }
}
