/* Chaos combo meter: a slim strip at the top edge, only while a streak is live, never over the middle of play */
.chaos-meter{position:fixed;z-index:14;top:max(14px,env(safe-area-inset-top));right:calc(max(14px,env(safe-area-inset-right)) + 66px);display:flex;align-items:stretch;gap:0;width:236px;height:50px;
  border-radius:12px;background:linear-gradient(180deg,rgba(16,20,26,.9),rgba(10,13,18,.86));box-shadow:0 0 0 1.5px rgba(255,196,64,.55),0 8px 22px rgba(0,0,0,.35);
  color:#f4efe2;font:700 14px/1 'Rajdhani','Arial Narrow',Arial,sans-serif;letter-spacing:.04em;pointer-events:none;overflow:hidden;
  transform:translateY(calc(-100% - 24px));opacity:0;transition:transform .24s cubic-bezier(.2,.9,.3,1.2),opacity .18s ease}
.chaos-meter.show{transform:none;opacity:1}
.chaos-meter .cm-mult{flex:0 0 58px;display:grid;place-items:center;background:linear-gradient(180deg,#ffcf3a,#ff8a1f);color:#1b0f04}
.chaos-meter .cm-mult b{font:900 25px/1 'Rajdhani','Arial Black',sans-serif;letter-spacing:-.02em;transform-origin:50% 55%}
.chaos-meter .cm-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:0 10px 0 9px}
.chaos-meter .cm-row{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.chaos-meter .cm-label{font-size:10px;letter-spacing:.2em;color:#ffcf6a}
.chaos-meter .cm-pts{flex:1;font-size:18px;font-variant-numeric:tabular-nums;text-align:right}
.chaos-meter .cm-cash{font-size:13px;color:#7dff8a;font-variant-numeric:tabular-nums}
.chaos-meter .cm-bar{position:relative;height:4px;border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden}
.chaos-meter .cm-bar i{position:absolute;inset:0;transform-origin:0 50%;background:linear-gradient(90deg,#ff5a3c,#ffcf3a);transition:transform .1s linear}
.chaos-meter .cm-feed{height:10px;font-size:10px;letter-spacing:.14em;color:rgba(244,239,226,.62);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chaos-meter.bump .cm-mult b{animation:cmBump .2s ease-out}
.chaos-meter.multup .cm-mult{animation:cmMult .45s ease-out}
.chaos-meter.urgent .cm-bar i{background:#ff4a3c;animation:cmBlink .35s steps(2) infinite}
.chaos-meter.banked{box-shadow:0 0 0 1.5px rgba(125,255,138,.7),0 8px 22px rgba(0,0,0,.35)}
.chaos-meter.banked .cm-mult{background:linear-gradient(180deg,#9dff9a,#38d36a)}
.chaos-meter.banked .cm-label{color:#9dff9a}
.chaos-meter.banked .cm-cash{font-size:16px}
@keyframes cmBump{0%{transform:scale(1.28)}100%{transform:scale(1)}}
@keyframes cmMult{0%{filter:brightness(2.2)}100%{filter:none}}
@keyframes cmBlink{50%{opacity:.35}}
/* phones: under the HUD capsule, between the HUD and + buttons */
@media (max-width:600px){.chaos-meter{right:auto;left:50%;top:calc(max(12px,env(safe-area-inset-top)) + 129px);width:176px;height:42px;transform:translate(-50%,-160px)}
  .chaos-meter.show{transform:translate(-50%,0)}.chaos-meter .cm-mult{flex-basis:46px}.chaos-meter .cm-mult b{font-size:21px}.chaos-meter .cm-pts{font-size:15px}.chaos-meter .cm-cash{font-size:12px}.chaos-meter .cm-feed{display:none}.chaos-meter .cm-label{font-size:9px;letter-spacing:.14em}}
@media (max-height:540px) and (pointer:coarse){.chaos-meter{top:max(8px,env(safe-area-inset-top));right:auto;left:50%;transform:translate(-50%,-120px);width:176px;height:40px}.chaos-meter.show{transform:translate(-50%,0)}.chaos-meter .cm-feed{display:none}}
body.map-open .chaos-meter{display:none}
@media (prefers-reduced-motion:reduce){.chaos-meter{transition:opacity .15s}.chaos-meter.bump .cm-mult b,.chaos-meter.multup .cm-mult,.chaos-meter.urgent .cm-bar i{animation:none}}

/* BETA stamp on the title art, tucked against the "2032" */
.title-stage{position:relative}
.beta-badge{position:absolute;left:64.5%;top:41%;z-index:3;transform:rotate(-9deg);padding:.32em .62em .26em;border-radius:6px;pointer-events:none;
  font:400 clamp(13px,2.1vw,25px)/1 Silkscreen,'Press Start 2P',monospace;letter-spacing:.12em;color:#16060f;background:linear-gradient(180deg,#5ff6ff,#29d4f0);
  box-shadow:0 0 0 3px #08262e,0 0 0 5px #5ff6ff,0 6px 0 5px rgba(0,0,0,.35),0 0 26px rgba(95,246,255,.55);animation:betaGlow 2.4s ease-in-out infinite}
@keyframes betaGlow{50%{box-shadow:0 0 0 3px #08262e,0 0 0 5px #5ff6ff,0 6px 0 5px rgba(0,0,0,.35),0 0 38px rgba(95,246,255,.85)}}
@media (prefers-reduced-motion:reduce){.beta-badge{animation:none}}
