/* Shared score clarity, with compact desktop status and supply controls.
   Desktop HUD type scale (tokens in styles.css): 11 px labels and keys, 12 px names and running text, 24 px numerals.
   The touch HUD keeps its own compact sizes in mobile.css. */
/* HUD text sits straight on the world, so every label gets a thin dark halo that keeps it legible over bright grass and sand. */
body:not(.touch-playing) .hud{text-shadow:0 0 3px #0b241dd9,0 1px 4px #0b241d99}
/* HUD chips: every small readout that sits straight on the world gets one translucent backing (--hud-chip, 80% panel green), which holds labels above 4.5:1 over sand and lawn alike. Big numerals and bars rely on the edge washes in styles.css. */
.score-item,.touch-playing .score-item{background:var(--hud-chip);border:0;border-radius:6px;box-shadow:none;opacity:1;color:#ff9a9e;text-shadow:0 1px 4px #172c23}
body:not(.touch-playing) .score-item{text-shadow:0 0 3px #0b241dd9,0 1px 5px #0b241d99}
.score-item.alive-item,.touch-playing .score-item.alive-item{color:#b8ffce}
.score-item .icon,.touch-playing .score-item .icon{color:inherit;opacity:1}
#kill-count{color:#ff9a9e;opacity:1}
.storm-pill{min-width:0;padding:7px 14px 7px 12px;gap:9px;background:var(--hud-chip);border:1px solid transparent;box-shadow:none}
.storm-pill.danger,.touch-playing .storm-pill.danger{background:#642e43e6;border-color:#ff7370}
.storm-pill strong{font-size:var(--fs-num)}.storm-pill span{font-size:var(--fs-label);letter-spacing:.9px}.storm-pill>.icon{width:22px;height:22px}
.survival-tools{display:grid;grid-template-columns:repeat(2,max-content);gap:var(--sp-2) var(--sp-4);align-items:center}
#desktop-shield{display:flex;align-items:center;gap:6px;background:#19463d99;border:1px solid #91dbec55;border-radius:5px;color:#a6e9ff;padding:7px 10px;font-size:var(--fs-label);font-weight:800;letter-spacing:.4px;min-height:34px}
#desktop-shield:disabled{opacity:.45}#desktop-shield:hover:not(:disabled){background:#285f52}
.touch-playing #desktop-shield{display:none}
body:not(.touch-playing) .kill-feed{max-width:330px;display:flex;flex-direction:column;gap:5px}
body:not(.touch-playing) .feed-line{font-size:var(--fs-text);line-height:1.4;padding:7px 10px;background:#102e27d9;border-left:2px solid #b2dab6;color:#f4f6e6;opacity:1;animation:feed-in .18s ease-out}
body:not(.touch-playing) .feed-line.you{border-left-color:#ff626a;background:#252f29eb}
body:not(.touch-playing) .hud-brand{font-size:18px}body:not(.touch-playing) .score-cluster{margin-top:12px;gap:9px}
body:not(.touch-playing) .score-item{height:34px;padding:0 10px}body:not(.touch-playing) .score-item strong{font-size:var(--fs-num)}body:not(.touch-playing) .score-item span{font-size:var(--fs-label);letter-spacing:1px}
body:not(.touch-playing) .player-label{font-size:var(--fs-label);letter-spacing:1.4px}
body:not(.touch-playing) .survival-tools>span{font-size:var(--fs-label);letter-spacing:.5px;background:var(--hud-chip);padding:5px 8px;border-radius:5px}.vitals{background:var(--hud-chip);padding:var(--sp-2) var(--sp-3);border-radius:6px}body:not(.touch-playing) .survival-tools kbd{font-size:var(--fs-label);min-width:22px;padding:3px 5px}
body:not(.touch-playing) .hud-bottom-right{width:316px}
body:not(.touch-playing) .ammo-readout>kbd{font-size:var(--fs-label)}body:not(.touch-playing) .reload-label{font-size:var(--fs-label);letter-spacing:1.1px}
body:not(.touch-playing) .weapon-slot{min-height:58px;padding:10px 9px 9px 10px;gap:7px 8px;background:var(--hud-chip);opacity:1;text-shadow:0 1px 3px #102e27;color:#fff6d6}
body:not(.touch-playing) .weapon-slot.active{background:#12363bcc;border-color:#fff9d455;border-bottom-color:var(--weapon-color,#95c5b4);color:#fff6d6;box-shadow:0 0 9px #fff9d411}
body:not(.touch-playing) .weapon-drawing{width:40px;flex-shrink:0}
body:not(.touch-playing) .weapon-drawing .icon{width:29px;height:29px}/* The gun is drawn flat at its own 50:28 shape: no tilt, so the silhouettes keep their edges at this size. */body:not(.touch-playing) .weapon-drawing .gun-icon{width:40px;height:auto;aspect-ratio:50/28;transform:none}@media(max-width:1100px){body:not(.touch-playing) .weapon-drawing{width:36px}body:not(.touch-playing) .weapon-drawing .gun-icon{width:36px}}
body:not(.touch-playing) .weapon-slot>kbd{font-size:var(--fs-label);min-width:19px;padding:2px 5px}
body:not(.touch-playing) .weapon-name,body:not(.touch-playing) .weapon-slot.empty .weapon-name{font-size:var(--fs-text);letter-spacing:.3px}
body:not(.touch-playing) .weapon-rarity,body:not(.touch-playing) .weapon-slot.empty .weapon-rarity{font-size:var(--fs-label);letter-spacing:.8px;opacity:1}body:not(.touch-playing) .weapon-name{display:flex;align-items:center;min-height:2.2em}body:not(.touch-playing) .weapon-tag{letter-spacing:.4px}body:not(.touch-playing) .weapon-slot.empty .weapon-rarity{color:#dfe8d2}
body:not(.touch-playing) .weapon-hint{font-size:var(--fs-label);letter-spacing:.3px;line-height:1.35;align-items:flex-start;margin-top:var(--sp-2);padding:5px 8px;background:var(--hud-chip);border-radius:5px}body:not(.touch-playing) .weapon-hint>span:last-child{font-weight:800;letter-spacing:.8px}
body:not(.touch-playing) .weapon-hint>span:first-child{flex:1;min-width:0;max-width:none}
/* Top right: the minimap's place name, its hint line and the pause key share the label size. */
body:not(.touch-playing) .map-north{font-size:var(--fs-label)}
/* Place names vary in length ("Clementine Orchard"), so the name wraps onto a second line instead of being cut short with an ellipsis. */
body:not(.touch-playing) .map-location{padding:10px 8px 6px;font-size:var(--fs-label);line-height:1.25;letter-spacing:.9px;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
/* The hint takes the full width of the map (two balanced lines at most) and the pause key sits under it, right-aligned, so neither is squeezed by the other. */
body:not(.touch-playing) .map-caption{margin-top:8px;gap:var(--sp-2);flex-wrap:wrap;justify-content:flex-end}
body:not(.touch-playing) .map-caption>span{flex:1 1 100%;min-width:0;max-width:none;padding:5px 8px;background:var(--hud-chip);border-radius:5px;font-size:var(--fs-label);letter-spacing:.6px;line-height:1.3;text-wrap:balance}
body:not(.touch-playing) .pause-button{gap:5px;padding:4px 8px}body:not(.touch-playing) .pause-button>.icon{width:13px;height:13px}body:not(.touch-playing) .pause-button kbd{font-size:var(--fs-label)}
/* The drop banner sits on the world (touch included), so it gets a soft dark scrim of its own (a feathered ellipse behind the
   text, wider than the block): flowers, roofs and shadows never cross the letters. It is anchored above the screen centre,
   which keeps the landing ring below it at any window height. */
.drop-banner{top:auto;bottom:calc(50% + 40px);min-width:620px;padding:24px 40px 22px;background:none;text-shadow:0 1px 3px #071c1a,0 2px 10px #071c1a}
.drop-banner:before{content:"";position:absolute;inset:-34px -70px;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,#0d2a2bb8 0,#0d2a2ba3 50%,#0d2a2b52 80%,#0d2a2b00 100%)}
.drop-banner>.eyebrow{font-size:var(--fs-label);margin-bottom:10px}
.drop-banner>h2{text-shadow:0 2px 0 #071c1a66,0 2px 12px #071c1a}
.drop-banner>p{font-size:var(--fs-name);margin-top:9px;color:#eaf1df}
.drop-countdown{margin-top:14px;gap:10px}.drop-countdown>span{font-size:32px}.drop-countdown>small{font-size:var(--fs-label);letter-spacing:1.2px}
/* Prompts and notices. */
body:not(.touch-playing) .interaction-prompt{font-size:var(--fs-text)}body:not(.touch-playing) .interaction-prompt kbd{font-size:var(--fs-label)}
body:not(.touch-playing) .game-toast{font-size:var(--fs-text);padding:11px 18px}
body:not(.touch-playing) .award-kicker{font-size:var(--fs-label);letter-spacing:2.6px}
body:not(.touch-playing) .fps-counter{font-size:var(--fs-label)}
@media(min-width:1800px){body:not(.touch-playing) .hud-bottom-right{width:360px}}
@media(max-width:700px){body:not(.touch-playing) .hud-bottom-right{width:260px}.drop-banner{min-width:0;width:100%;padding:20px 24px 18px}.drop-banner:before{inset:-40px 0}}
/* Landscape phones: the banner shrinks to a compact block above the centre and drops its eyebrow, so the landing ring stays clear. */
@media(orientation:landscape) and (max-height:600px){.drop-banner{bottom:calc(50% + 26px);padding:8px 24px 6px}.drop-banner:before{inset:-14px -48px}.drop-banner>.eyebrow{display:none}.drop-banner>h2{font-size:clamp(22px,3.4vw,28px)}.drop-banner>p{font-size:var(--fs-text);margin-top:3px}.drop-countdown{margin-top:6px}.drop-countdown>span{font-size:26px}}
@media(max-height:680px){body:not(.touch-playing) .hud-top-right{width:175px}}
/* Supply-drop notices share the feed with defeats, in the colour of the crate. */
.feed-line.notice,body:not(.touch-playing) .feed-line.notice{border-left:2px solid var(--yellow);background:#2b3a1fe6;color:var(--yellow-light)}
.feed-line.notice .icon{opacity:1;color:var(--yellow)}
.feed-line.notice strong{font-weight:800;letter-spacing:.3px}