/* Minimal HUD (settings: HUD layout = MINIMAL, the default; body.hud-min). Loaded after hud-celestial.css.
   Principle: during play only the crosshair, a faint vitals line, ammo and small ability icons are on screen. Everything else
   appears when it matters: vitals rise in contrast when hurt, the compass ticks in while turning fast, the radar and the
   controls reference sit behind held keys, and short cues (js/hud.js cues()) say what to press the first time it is relevant.
   Same tokens as hud-celestial.css (--cel*, --f-cel). STANDARD layout (body without .hud-min) keeps the old look. */

/* ---- both layouts: the chase-cam hint and the build string are never part of the in-match HUD (build string stays on menus) ---- */
#hud .h-cam { display: none !important; }
body.playing .build-tag { display: none; }

/* ---- both layouts: contextual cue + hold-to-show controls overlay ---- */
#hud .h-cue { position: absolute; left: 50%; top: calc(50% + 118px * var(--hu)); translate: -50% 0; scale: var(--hu); transform-origin: 50% 0; display: flex; align-items: center; gap: 10px; padding: 0; opacity: 0; pointer-events: none; font: 500 12px/1 var(--f-cel); letter-spacing: .26em; color: var(--cel); text-shadow: 0 1px 8px #000, 0 0 3px #000; white-space: nowrap; }
#hud .h-cue.on { animation: cueIn 3.2s ease both; }
@keyframes cueIn { 0% { opacity: 0; transform: translateY(6px); } 10%, 78% { opacity: .95; transform: none; } 100% { opacity: 0; } }
#hud .h-keys { position: absolute; inset: 0; display: none; place-items: center; background: radial-gradient(ellipse at center, rgba(7, 8, 20, .72), rgba(5, 6, 14, .86)); pointer-events: none; }
#hud .h-keys.on { display: grid; animation: keysIn .18s ease-out; }
@keyframes keysIn { from { opacity: 0; } to { opacity: 1; } }
#hud .h-keys .kk { scale: var(--hu); width: min(560px, 86vw); padding: 26px 30px 20px; border: 1px solid var(--cel-line); outline: 1px solid var(--cel-faint); outline-offset: 6px; background: rgba(8, 9, 24, .8); text-align: center; }
#hud .kk-h { font: 500 15px/1 var(--f-cel); letter-spacing: .4em; color: var(--cel); padding-bottom: 14px; margin-bottom: 8px; border-bottom: 1px solid var(--cel-faint); }
#hud .kk-g { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 34px; text-align: left; }
#hud .kk-r .glyph { white-space: nowrap; font-size: 9px; }
#hud .kk-r { display: flex; align-items: center; gap: 12px; height: 34px; }
#hud .kk-r span:not(.glyph) { font: 500 11px/1 var(--f-cel); letter-spacing: .16em; color: var(--cel-2); }
#hud .kk-f { margin-top: 12px; font: 500 9px/1 var(--f-cel); letter-spacing: .3em; color: var(--cel-dim); }
@media (max-height: 560px) { #hud .kk-r { height: 26px; } #hud .h-keys .kk { padding: 14px 20px; } }

/* ======================= MINIMAL ======================= */
/* the first-match field manual panel is replaced by cues + the hold overlay */
body.hud-min #hud .h-tut { display: none !important; }
/* the first-match hint strip: whisper-quiet, no frame, no close button */
body.hud-min #hud .h-hint { top: auto; bottom: calc(var(--m) + 96px * var(--hu) + var(--safe-b)); background: none; border: 0; backdrop-filter: none; padding: 0; }
body.hud-min #hud .h-hint .hh-x { display: none; }
body.hud-min #hud .h-hint .hh em { font-family: var(--f-cel); color: var(--cel-dim); text-shadow: 0 1px 6px #000; }

/* --- vitals: one hairline pair under the crosshair, almost invisible when full, readable when hurt --- */
body.hud-min #hud .h-top { display: contents; }
body.hud-min #hud .vit { position: absolute; left: 50%; right: auto; top: calc(50% + 74px * var(--hu)); width: 150px; margin: 0; translate: -50% 0; display: flex; flex-direction: column; gap: 4px; scale: var(--hu); transform-origin: 50% 0; opacity: .2; transition: opacity .45s ease; }
body.hud-min #hud.hurt .vit { opacity: .95; transition-duration: .12s; }
body.hud-min #hud .vit-r { display: block; width: 100%; height: 4px; }
body.hud-min #hud .vit-r.vit-sh { order: 1; } body.hud-min #hud .vit-r.vit-hp { order: 2; }
body.hud-min #hud .vit-l, body.hud-min #hud .vit-k, body.hud-min #hud .vit-n { display: none; }
body.hud-min #hud .vit .trap, body.hud-min #hud .vit .hp-row { height: 4px; border: 0; border-radius: 2px; background: rgba(6, 7, 18, .6); padding: 0; box-shadow: 0 0 0 1px rgba(244, 228, 188, .38); }
body.hud-min #hud .vit .trap-in { inset: 0; border-radius: 2px; background: none; }
body.hud-min #hud .vit .hp-row { gap: 2px; background: none; box-shadow: none; }
body.hud-min #hud .vit .hp-row i:not(.on) { box-shadow: inset 0 0 0 1px rgba(244, 228, 188, .3); }
body.hud-min #hud .vit .hp-row i { border: 0; background: none; border-radius: 1px; }
body.hud-min #hud .vit .hp-row i.on { background: var(--cel); }
body.hud-min.low-health #hud .vit .hp-row i.on { background: var(--cel-foe); }
body.hud-min #hud .vit .sh-fill { background: var(--cel-2); }
body.hud-min #hud.hurt .vit { filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .9)); }

/* --- compass: only while turning fast; power-up timers sit where it would be --- */
body.hud-min #hud .compass { position: absolute; left: 50%; top: calc(var(--m) * .7 + var(--safe-t)); width: min(420px, 34vw); margin: 0; translate: -50% 0; scale: var(--hu); transform-origin: 50% 0; opacity: 0; transition: opacity .3s ease; }
body.hud-min #hud.cmp .compass { opacity: .8; transition-duration: .1s; }
body.hud-min #hud .h-top .pu-row { position: absolute; left: 50%; top: calc(var(--m) * .7 + 40px * var(--hu) + var(--safe-t)); translate: -50% 0; margin: 0; }

/* --- score: one small corner line, only the numbers that matter --- */
body.hud-min #hud .h-score { width: auto; padding: 0; background: none; backdrop-filter: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; max-width: 280px; opacity: .8; text-shadow: 0 1px 6px #000, 0 0 2px #000; }
body.hud-min #hud .sc-meta { order: 3; display: block; height: auto; margin: 0; padding: 0; border: 0; }
body.hud-min #hud .sc-mode { display: none; }
body.hud-min #hud .sc-clock { font: 500 13px/1 var(--f-cel); color: var(--cel-2); letter-spacing: .1em; }
body.hud-min #hud .sc-row { display: flex; align-items: baseline; gap: 0; height: auto; width: auto; }
body.hud-min #hud .sc-row .sq, body.hud-min #hud .sc-row .sc-nm, body.hud-min #hud .sc-row .sc-bar { display: none; }
body.hud-min #hud .sc-row .sc-n { font: 500 22px/1 var(--f-cel); min-width: 0; color: var(--cel-2); }
body.hud-min #hud .sc-row.mine { order: 1; } body.hud-min #hud .sc-row.mine .sc-n { color: var(--cel); }
body.hud-min #hud .sc-row:not(.mine) { order: 2; } body.hud-min #hud .sc-row:not(.mine) .sc-n { color: var(--cel-foe); }
body.hud-min #hud .sc-lead { display: none; }
body.hud-min #hud .h-obj { order: 4; flex-basis: 100%; }

/* --- radar: hidden; held key shows it, 'Corner' setting keeps it in the bottom-left corner --- */
body.hud-min #hud .h-radar { display: none; scale: calc(var(--hu) * .78); opacity: .8; }
body.hud-min.mm-corner #hud .h-radar, body.hud-min #hud.mmh .h-radar { display: block; }
body.hud-min #hud .h-radar .rd-place { display: none; }

/* --- weapon: just the ammo; the name whispers in on a swap --- */
body.hud-min #hud .h-weapon { width: auto; text-align: right; }
body.hud-min #hud .wp-thumbs, body.hud-min #hud .wp-sec, body.hud-min #hud .wp-star { display: none; }
body.hud-min #hud .wp-ammo { margin: 0; gap: 6px; opacity: .6; transition: opacity .2s; }
body.hud-min #hud .wp-mag { font-size: 24px; }
body.hud-min #hud .wp-res { font-size: 11px; opacity: .7; }
body.hud-min #hud .wp-mag.low { color: var(--cel-foe); }
body.hud-min #hud .h-weapon:has(.wp-mag.low) .wp-ammo { opacity: 1; }
body.hud-min #hud .wp-name { opacity: 0; margin-top: 4px; justify-content: flex-end; }
body.hud-min #hud .wp-name.swapped { animation: wpSwapMin 1.8s ease both; }
body.hud-min #hud .wp-name.swapfail { animation: wpSwapMin 1.4s ease both; }
@keyframes wpSwapMin { 0% { opacity: 0; transform: translateX(8px); } 12%, 70% { opacity: .9; transform: none; } 100% { opacity: 0; } }
body.hud-min #hud .wp-reload { font: 500 9px/1 var(--f-cel); letter-spacing: .2em; color: var(--cel-foe); margin-top: 3px; text-shadow: 0 1px 6px #000; }
body.hud-min #hud .wp-reload:empty { display: none; }

/* --- abilities: small and dim; bright and breathing only when ready or active; cooldown is the thin ring --- */
body.hud-min #hud .h-bl { scale: calc(var(--hu) * .64); bottom: calc(var(--m) * .6 + var(--safe-b)); }
body.hud-min #hud .h-bl .h-tiles { gap: 22px; padding-bottom: 6px; }
body.hud-min #hud .ab { opacity: .4 !important; transition: opacity .3s; }
body.hud-min #hud .ab.ready, body.hud-min #hud .ab.cast { opacity: 1 !important; }
body.hud-min #hud .gt { opacity: .22; } body.hud-min #hud .gt.sel { opacity: .42; } body.hud-min #hud .gt.sel.ready { opacity: .55; }
body.hud-min #hud .ab:not(.ready):not(.cast) { animation: none !important; filter: none; }
body.hud-min #hud .ab.nova:not(.ready) .ic { translate: 0 0; opacity: .6; }
body.hud-min #hud .ab.nova:not(.ready):not(.cast) .pct { font-size: 9px; bottom: 7px; }
body.hud-min #hud .ab .ring .pg, body.hud-min #hud .gt .ring .pg { stroke-width: 1.8; }
body.hud-min #hud .gt .kd, body.hud-min #hud .ab .kd { opacity: 0; transition: opacity .3s; }
body.hud-min #hud .ab.ready .kd, body.hud-min #hud .ab.cast .kd, body.hud-min #hud .gt.sel .kd { opacity: 1; }
body.hud-min #hud .gt .n { opacity: 0; } body.hud-min #hud .gt.sel .n, body.hud-min #hud .gt.cd .n { opacity: .9; }

/* --- prompts and feed --- */
body.hud-min #hud .h-prompt { left: 50%; right: auto; bottom: calc(var(--m) + 104px * var(--hu) + var(--safe-b)); translate: -50% 0; transform-origin: 50% 100%; background: none; border: 0; box-shadow: none; backdrop-filter: none; padding: 0; height: auto; text-shadow: 0 1px 8px #000; }
body.hud-min #hud .feed { left: auto; right: calc(var(--m) + var(--safe-r)); top: calc(var(--m) + var(--safe-t)); width: 280px; transform-origin: 100% 0; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
body.hud-min #hud .feed-item { height: auto; padding: 0; border: 0; background: none; backdrop-filter: none; font-size: 11px; opacity: .6; text-shadow: 0 1px 6px #000; }
body.hud-min #hud .feed-item.me { opacity: 1; }
body.hud-min #hud .feed-item:nth-last-child(n+4) { display: none; }
body.hud-min #hud .pw-chip { display: none; }

/* shield-gone alarm tint should still read on the faint line */
body.hud-min.low-shield #hud .vit { opacity: .7; }
@media (prefers-reduced-motion: reduce) { #hud .h-cue.on { animation: none; opacity: .95; } }

/* ---- menus: one clear primary call to action per screen (DROP IN), everything else quiet ---- */
#setup .su-head .btn.primary { box-shadow: 0 0 26px rgba(244, 228, 188, .28); }
#setup .su-head .btn:not(.primary), .panel-foot .btn:not(.primary) { background: none; border-color: transparent; box-shadow: none; opacity: .6; }
#setup .su-head .btn:not(.primary):hover, #setup .su-head .btn:not(.primary):focus-visible, .panel-foot .btn:not(.primary):hover, .panel-foot .btn:not(.primary):focus-visible { opacity: 1; }
#setup .prompts, .sh3-foot .prompts { opacity: .4; }
#setup #opView .ov-card p { opacity: .7; }
