@font-face{font-family:PumpTitle;src:url("Fonts/BarlowCondensed-ExtraBoldItalic.ttf") format("truetype");font-style:italic;font-weight:800;font-display:swap}
@font-face{font-family:PumpBody;src:url("Fonts/BarlowCondensed-SemiBold.ttf") format("truetype");font-style:normal;font-weight:600;font-display:swap}

/* Same tokens as PumpUi (Ink / Paper / Gold / Pink = P1 / Cyan = P2 / Muted). */
:root{
  color-scheme:dark;
  --ink:#080a14;--ink-bar:#0c0e1a;--paper:#f8f2e2;--gold:#f2c96f;--pink:#ff3478;--cyan:#2ecbf6;--muted:#9899b1;
  --line:rgba(248,242,226,.12);
  /* Shell bar under the game (never over the canvas) + iOS home-indicator inset. */
  --bar:calc(40px + env(safe-area-inset-bottom, 0px));
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink)}
body{display:flex;flex-direction:column;font-family:PumpBody,system-ui,sans-serif;color:var(--paper)}
[hidden]{display:none!important}

/* Game area: everything above the bar. The canvas is a centred 16:9 stage; the rest is ink letterbox. */
#unity-fullscreen-container{position:relative;flex:1 1 auto;min-height:0;width:100vw;height:calc(100vh - var(--bar));height:calc(100dvh - var(--bar));display:grid;place-items:center;isolation:isolate;overflow:hidden;background:var(--ink)}
#unity-canvas{display:block;width:min(100%,calc((100vh - var(--bar)) * 16 / 9));width:min(100%,calc((100dvh - var(--bar)) * 16 / 9));height:auto;aspect-ratio:16 / 9;max-height:100%;outline:none;touch-action:none;background:var(--ink)}
/* No frame around the game: keyboard focus is reported in the shell bar ("KEYBOARD ACTIVE"). */
#unity-canvas:focus,#unity-canvas:focus-visible{outline:none}
#unity-fullscreen-container:fullscreen{width:100vw;height:100vh}
#unity-fullscreen-container:fullscreen #unity-canvas{width:min(100vw,calc(100vh * 16 / 9))}

/* Loading / error screen (covers the whole game area, letterbox included). */
.loading-screen{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:48px 24px;overflow:auto;background:var(--ink)}
.arena-backdrop{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,10,20,.96),rgba(8,10,20,.6) 55%,rgba(8,10,20,.82)),linear-gradient(0deg,var(--ink),transparent 70%),url("pump-arena.png") center/cover no-repeat}
.loading-content{width:min(640px,86vw);position:relative}
.brand-badge{display:block;margin-bottom:14px}
.eyebrow{color:var(--gold);letter-spacing:.22em;font-size:16px;margin:0 0 12px}
h1{font:800 italic clamp(76px,12vw,152px)/.8 PumpTitle,Impact,sans-serif;letter-spacing:-.012em;margin:0 0 38px;text-shadow:4px 5px 0 rgba(0,0,0,.45)}
h1 span{color:var(--gold)}
.load-details{display:flex;justify-content:space-between;align-items:baseline;gap:16px;letter-spacing:.08em;font-size:18px}
.load-details p{margin:0 0 12px}
#loading-percent{color:var(--gold);font-variant-numeric:tabular-nums}
.progress-track{height:8px;background:var(--line);overflow:hidden;transform:skewX(-13deg)}
.progress-fill{width:100%;height:100%;background:linear-gradient(90deg,var(--pink),var(--gold));transform:scaleX(0);transform-origin:left center;transition:transform .12s linear}
.loading-note{color:var(--muted);font-size:16px;letter-spacing:.035em;line-height:1.5;margin:15px 0 0}
.error-message{background:rgba(255,52,120,.08);border-left:3px solid var(--pink);padding:14px 17px;color:var(--paper);line-height:1.5;overflow-wrap:anywhere;font-size:16px}
.has-error .progress-track,.has-error #loading-percent{display:none}
.retry-button{font:600 16px PumpBody,system-ui,sans-serif;letter-spacing:.08em;border:0;background:var(--gold);color:var(--ink);padding:12px 20px;cursor:pointer}
.retry-button:hover{background:var(--paper)}
button:focus-visible{outline:2px solid var(--paper);outline-offset:3px}

/* Shell bar: 40 px band below the game. Outside the fullscreen element, so hidden in fullscreen. */
.player-tools{position:relative;z-index:30;flex:0 0 var(--bar);height:var(--bar);display:flex;align-items:center;gap:16px;
  padding:0 max(16px,env(safe-area-inset-right)) env(safe-area-inset-bottom,0px) max(16px,env(safe-area-inset-left));
  background:var(--ink-bar);border-top:1px solid var(--line)}
.tool-brand{font:800 italic 18px PumpTitle,Impact,sans-serif;letter-spacing:.035em;color:var(--paper);white-space:nowrap}
.tool-brand span{color:var(--gold)}
.tool-hint{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:14px;letter-spacing:.08em}
#fullscreen-button{display:flex;align-items:center;gap:8px;height:28px;padding:0 12px;border:0;background:var(--gold);color:var(--ink);cursor:pointer;font:600 14px PumpBody,system-ui,sans-serif;letter-spacing:.08em;white-space:nowrap;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
#fullscreen-button svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:square}
#fullscreen-button:disabled{background:#1d2030;color:var(--muted);cursor:default}
#fullscreen-button:not(:disabled):hover{background:var(--paper)}

.message-banner{position:absolute;z-index:40;top:max(18px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);max-width:min(760px,90vw);padding:13px 18px;border-left:3px solid var(--gold);background:rgba(8,10,20,.96);color:var(--paper);font-size:17px;line-height:1.4;box-shadow:0 8px 30px #0005}
.message-banner.is-warning{border-color:var(--pink)}
.noscript-message{position:absolute;z-index:50;inset:0;display:grid;place-items:center;padding:30px;text-align:center;background:var(--ink);font-size:22px}

@media(max-width:700px){
  .loading-screen{padding:32px 22px}
  .loading-content{width:min(500px,88vw)}
  h1{font-size:clamp(70px,18vw,118px);margin-bottom:28px}
  .eyebrow{font-size:13px}
  .load-details{font-size:15px}
  .brand-badge{width:40px;height:40px}
  .tool-hint{display:none}
  .player-tools{justify-content:space-between}
}
@media(max-height:540px){
  .brand-badge{display:none}
  h1{font-size:74px;line-height:.86;margin-bottom:18px}
  h1 br{display:none}
  h1 span{margin-left:14px}
  .eyebrow{margin-bottom:14px}
  .loading-screen{padding-top:20px}
  .loading-note{margin-top:9px}
}
@media(prefers-reduced-motion:reduce){.progress-fill{transition:none}}