/* The only stylesheet the arcade adds to DUDAS JUMP.
   Loaded after public/dudas-jump/styles.css, which is the drop's own and is
   replaced wholesale by the next one. Two things live here and nothing else:
   the furniture the arcade added to the page, and one gap in the drop's
   portrait layout that only opens on a desktop window. */

/* ---------- the way back, and who is playing ----------
   The WEBCADE brand in the menu header is a link now (see the page). It has to
   keep looking exactly like the word it already was, so this only removes what
   being an anchor added, and gives a thumb somewhere to land. */
.exit-chip{
  text-decoration:none; display:inline-flex; align-items:center; gap:6px;
  padding:6px 2px; margin:-6px -2px;          /* tap target, no visual shift */
  transition:opacity .18s ease;
}
.exit-chip::before{ content:"←"; color:var(--faint); font-weight:700; }
.exit-chip:hover, .exit-chip:focus-visible{ opacity:.75; }
.exit-chip:focus-visible{ outline:2px solid var(--cyan); outline-offset:4px; border-radius:6px; }

/* Sits above BEST HEIGHT and reads as its quieter sibling, because that is
   what it is: the same line of metadata about the same saved runs. */
.who-line{
  font-family:var(--num); font-size:10px; letter-spacing:.2em;
  color:var(--faint); min-height:12px; text-align:center;
}

/* ---------- the desktop portrait gap ----------
   The drop is portrait-only and enforces it twice: it frames the stage as a
   phone-shaped viewport from 760px wide, and it shows its own ROTATE TO
   PORTRAIT gate when the smaller window dimension is under 560px. Those two
   rules do not meet. A browser window between them — 700x600, say — is neither
   framed nor gated, so a portrait-only game renders full-bleed LANDSCAPE, with
   a view about two jumps tall.

   This covers that band with the drop's own frame values rather than changing
   either threshold, so above 760px the drop's rule is still the one that
   applies and nothing here fights it. dudasjumptest pins the 760px so a drop
   that moves it fails loudly here instead of reopening the gap quietly. */
@media (min-width:560px) and (max-width:759.98px) and (min-height:560px){
  body{ padding:18px; }
  #stage{
    width:min(53vh,520px); height:min(94vh,940px); max-height:94vh; border-radius:34px;
    box-shadow:0 0 0 1px rgba(140,255,180,.10), 0 0 0 9px #0a0d10,
      0 0 0 10px rgba(160,255,190,.07),
      0 40px 120px -20px rgba(120,255,60,.14), 0 30px 90px -30px rgba(120,80,255,.22);
  }
}

/* ---------- the wall of names ----------
   The drop's own .board grid is five columns (rank, score, height, toads,
   date) for a list of one player's runs. The arcade wall is a different list —
   many players, one run each — so it re-columns .board rather than inventing a
   second table style: the two sit one above the other in the same modal and
   must read as the same object seen two ways. */
.arcade-wall{ display:flex; flex-direction:column; gap:10px; width:100%;
  padding-top:14px; border-top:1px solid rgba(255,255,255,.07); }
.wall-title{ margin:0; text-align:center; font-size:11px; font-weight:900;
  letter-spacing:.24em; color:var(--cyan); text-shadow:0 0 14px rgba(53,230,255,.4); }
.wall-list li{ grid-template-columns:20px 1fr auto auto auto; }
.wall-list .tm{ color:var(--faint); font-size:10px; }
.wall-list .nm{ color:var(--text); font-family:var(--ui); font-weight:700; font-size:11.5px;
  letter-spacing:.06em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ---------- the rank line on the results card ----------
   Quieter than the NEW HEIGHT RECORD badge above it on purpose. The badge is
   the game telling you that you beat yourself, which is the run's own news; a
   place on a shared wall is smaller and belongs under it, not over it. */
.arcade-rank{ margin:0; min-height:12px; text-align:center;
  font-family:var(--num); font-size:10px; letter-spacing:.2em; color:var(--cyan); }

/* ---------- the prize-pool panel ----------
   The one place this game asks for typing, on a page built for a thumb. The
   input is deliberately plain and wide: an address is 44 characters of base58
   that a player is pasting and then checking, and anything decorative in the
   way of reading it back is working against them. */
.pool-copy{ margin:0; font-size:12px; line-height:1.6; color:var(--muted); text-align:center; }
.pool-label{ font-family:var(--num); font-size:9.5px; letter-spacing:.22em; color:var(--faint); }
.pool-input{
  width:100%; padding:12px 13px; border-radius:12px;
  background:rgba(0,0,0,.45); color:var(--text);
  border:1px solid rgba(53,230,255,.28);
  font-family:var(--num); font-size:11px; letter-spacing:0;
  -webkit-user-select:text; user-select:text;      /* the page disables it globally */
}
.pool-input:focus{ outline:none; border-color:var(--cyan); box-shadow:0 0 0 3px rgba(53,230,255,.16); }
.pool-input::placeholder{ color:rgba(238,245,240,.28); }
/* Warm, not alarming: this is the one irreversible thing in the game, and it
   should read as care rather than as an error that has already happened. */
.pool-warn{ margin:0; font-size:10px; line-height:1.55; color:var(--gold-hi); opacity:.82; text-align:center; }
.pool-error{ margin:0; font-size:10.5px; line-height:1.5; color:var(--danger); text-align:center; }