/* Stage-one dev panel. Namespaced under #ps1-panel / .ps1-* so it cannot
   collide with any engine selector. */
#ps1-panel {
  /* Starts below the engine's top bar so Settings and History are never
     covered, and bounded to the viewport bottom so the body can scroll.
     z-index sits under the engine's overlays (45/50) as well, so a popup
     is never blocked by a developer tool. */
  position: fixed; top: 112px; right: 0; bottom: 0; width: 360px;
  z-index: 44; display: flex; flex-direction: column;
  background: #0d0f1c; color: #f2f3fb; border-left: 1px solid #2a2f4d;
  font: 13px/1.45 "Segoe UI", system-ui, sans-serif;
  box-shadow: -8px 0 24px rgba(0,0,0,.45);
}
#ps1-panel.ps1-collapsed .ps1-body { display: none; }
#ps1-panel .ps1-head {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px;
  border-bottom: 1px solid #2a2f4d; background: #141728;
}
#ps1-panel .ps1-badge {
  background: repeating-linear-gradient(45deg,#3a2a00,#3a2a00 8px,#4a3600 8px,#4a3600 16px);
  color: #f4d27a; font-weight: 800; font-size: 10px; letter-spacing: .08em;
  padding: 3px 7px; border-radius: 4px;
}
#ps1-panel .ps1-head button {
  margin-left: auto; background: #1b1f33; color: #f2f3fb; border: 1px solid #2a2f4d;
  border-radius: 6px; width: 24px; height: 22px; cursor: pointer; line-height: 1;
}
/* min-height:0 is what actually lets a flex child scroll; without it the
   body refuses to shrink below its content and the overflow never
   engages. */
#ps1-panel .ps1-body {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  padding: 4px 10px 18px;
}
#ps1-panel .ps1-head { flex: 0 0 auto; }
#ps1-panel .ps1-sec { border-top: 1px solid #22263d; padding: 10px 0 4px; }
#ps1-panel .ps1-sec:first-child { border-top: 0; }
#ps1-panel h4 {
  margin: 0 0 7px; font-size: 11px; text-transform: uppercase;
  letter-spacing: .07em; color: #9aa0c0; font-weight: 700;
}
#ps1-panel .ps1-tiny { font-size: 11px; color: #9aa0c0; }
#ps1-panel code { font-family: ui-monospace, Consolas, monospace; font-size: 11px; color: #8fc4ff; }
#ps1-panel button {
  background: #1b1f33; color: #f2f3fb; border: 1px solid #2a2f4d;
  border-radius: 6px; padding: 4px 9px; cursor: pointer; font-size: 12px;
}
#ps1-panel button:hover { border-color: #7c4dff; }
#ps1-panel button.ps1-primary { background: #7c4dff; border-color: #7c4dff; font-weight: 700; }
/* A switch that is ON has to read as a state, not as an invitation to act. */
#ps1-panel button.ps1-on { background: #1d7a4c; border-color: #27a366; }
#ps1-panel select { background: #0e1020; color: #f2f3fb; border: 1px solid #2a2f4d;
  border-radius: 6px; padding: 4px 6px; font-size: 12px; }
#ps1-panel .ps1-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 6px 0; }
#ps1-panel .ps1-firm { border: 1px solid #22263d; border-radius: 7px; margin-bottom: 6px; overflow: hidden; }
#ps1-panel .ps1-firmhead { background: #171a2e; padding: 4px 8px; font-weight: 700; font-size: 12px; }
#ps1-panel .ps1-prize {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
  padding: 5px 8px; border-top: 1px solid #22263d;
}
#ps1-panel .ps1-prize.ps1-sel { background: #1a1533; }
#ps1-panel .ps1-prize button { margin-left: auto; }
#ps1-panel .ps1-pill {
  font-size: 10px; padding: 1px 6px; border-radius: 99px;
  border: 1px solid #2a2f4d; color: #9aa0c0;
}
#ps1-panel .ps1-state { border: 1px solid #2a2f4d; border-radius: 8px; padding: 9px; }
#ps1-panel .ps1-state h4 { color: #f2f3fb; font-size: 13px; text-transform: none; letter-spacing: 0; }
#ps1-panel .ps1-ok { background: #0d2b1e; border-color: #1c5a3f; }
#ps1-panel .ps1-blocked { background: #2b1018; border-color: #5d2033; }
#ps1-panel .ps1-warn { background: #2a2110; border-color: #6b5015; }
#ps1-panel .ps1-bad { background: #241018; border-color: #5d2033; }
#ps1-panel .ps1-info { background: #101a2b; border-color: #20406a; }
#ps1-panel .ps1-kv {
  display: grid; grid-template-columns: auto 1fr; gap: 2px 8px;
  font-size: 11px; margin-top: 6px;
}
#ps1-panel .ps1-kv div:nth-child(odd) { color: #9aa0c0; }
#ps1-panel .ps1-log { font-size: 11px; max-height: 120px; overflow: auto; }
#ps1-panel .ps1-log div { padding: 2px 0; border-bottom: 1px solid #1c2036; }
/* Keep the engine clear of the panel so nothing is hidden behind it. */
body.ps1-shifted { padding-right: 360px; }
/* ---- left dock -------------------------------------------------------
   Sits in the empty column the engine leaves to the left of the reel. No
   panel chrome: the cells themselves are the interface. Hidden while the
   engine's own left-hand entrants drawer is open. */
#ps1-left {
  position: fixed; left: 18px; top: 104px;
  /* top is recalculated in script so the stack straddles the reel's centre */
  z-index: 900;                 /* under the engine's overlays and drawers */
  font: 13px/1.45 "Segoe UI", system-ui, sans-serif; color: #f2f3fb;
  display: flex; align-items: flex-start; gap: 10px;
}
#ps1-left.ps1-hidden { display: none; }

/* In its own floating window the dock is the whole page, so it stops being a
   fixed overlay and simply fills it. The rail goes with it: there is nothing
   left to fold away from. */
/* Plain block layout, not flex: as a flex row the shell kept its own width
   and the rows ran off the right edge of the window with the profile button
   clipped. Everything here is width:100% inside one padded box, so the gap
   on the right matches the gap on the left. */
#ps1-left.ps1-popped {
  position: static; left: auto; top: auto;
  display: block; width: 100%; box-sizing: border-box;
  /* margin:0 is load-bearing. The narrow-window media queries below are
     written for a cramped ENGINE window, and a popout is narrow by nature,
     so they fired here and added a 12px margin -- which, against width:100%
     and border-box, pushed the whole panel 12px off the right edge. */
  margin: 0;
  padding: 12px 14px;
}
#ps1-left.ps1-popped .ps1-dock-tab { display: none; }
#ps1-left.ps1-popped .ps1-dock-shell {
  flex: none; width: 100%; opacity: 1; overflow: visible;
  transition: none;
}
#ps1-left.ps1-popped .ps1-dock-inner {
  width: 100%; max-height: none; display: block;
}
/* The window itself provides the height limit; the list takes what is left
   under the header. */
#ps1-left.ps1-popped .ps1-inv {
  max-height: calc(100vh - 64px); overflow-y: auto;
}

/* What is left behind in the engine window while the list is popped out. */
/* The "prize list is in its own window" marker used to live here, fixed at
   left:18px top:104px over the board. Nothing is laid over the engine any
   more: the dock's own button travels into the floating window and says it
   there. Kept as a no-op so an older cached build cannot render a stray
   box if one is still in the DOM. */
.ps1-dock-home { display: none !important; }

/* ---- the fold-away rail -------------------------------------------------
   The shell carries the width; the inner keeps its own so the contents never
   reflow mid-animation. Collapsed, the shell is zero-width and clipped, and
   only the rail is left on the stage. */
/* Opening uses a damped spring -- the curve a Motion spring of
   visualDuration .42s and bounce .22 produces, sampled into linear(). It
   overshoots to 1.019 and settles, which is what gives the panel its small
   bit of life. Closing is deliberately plain and a touch quicker: a spring
   on the way out reads as indecision. */
:root {
  --ps1-spring: linear(0, 0.1068, 0.321, 0.5419, 0.7243, 0.8556, 0.94, 0.9881,
    1.0113, 1.0193, 1.0192, 1.0155, 1.011, 1.007, 1.0039, 1.0018, 1.0006,
    0.9999, 0.9997, 0.9996, 0.9997, 0.9997, 0.9998, 0.9999, 0.9999, 1, 1);
  --ps1-out: cubic-bezier(.55,.06,.68,.19);
}
.ps1-dockscope .ps1-dock-shell {
  /* flex: none matters. As a plain flex item with a width it still had
     flex-shrink: 1, so when space was tight the panel quietly squeezed to
     ~198px and clipped its own header -- which is how the pop-out and
     profile buttons disappeared off the edge. */
  flex: none;
  width: 300px; overflow: hidden;
  transition: width .54s var(--ps1-spring), opacity .24s ease .06s;
}
/* The dock can never grow past the window again. It used to be a fixed box
   with no height limit and nothing scrollable inside it, so on a short window
   the bottom of the list simply ran off the screen with no way to reach it --
   which is why the only recovery was to maximise the window. */
.ps1-dockscope .ps1-dock-inner {
  width: 300px; display: flex; flex-direction: column;
  max-height: calc(100vh - 28px);
}
.ps1-dockscope .ps1-inv { overflow-y: auto; overscroll-behavior: contain; min-height: 0; }
.ps1-dockscope .ps1-inv::-webkit-scrollbar { width: 8px; }
.ps1-dockscope .ps1-inv::-webkit-scrollbar-thumb {
  background: #2a2f4d; border-radius: 4px;
}
.ps1-dockscope .ps1-inv::-webkit-scrollbar-thumb:hover { background: #3b426b; }
.ps1-dockscope .ps1-inv::-webkit-scrollbar-track { background: transparent; }
#ps1-left.ps1-dock-collapsed .ps1-dock-shell {
  width: 0; opacity: 0; pointer-events: none;
  transition: width .3s var(--ps1-out), opacity .15s ease;
}
/* The very first paint must not animate, or the dock unfurls on every load. */
#ps1-left.ps1-dock-instant .ps1-dock-shell,
#ps1-left.ps1-dock-instant .ps1-dock-tab { transition: none !important; }

/* The rail is the only control left when the panel is folded away, so it
   carries the prize colour rather than the panel chrome's -- the same gold as
   the prize cells, so it reads as "prizes" at a glance on stream. */
.ps1-dockscope .ps1-dock-tab {
  position: relative;
  flex: none; display: flex; flex-direction: column; align-items: center; gap: 11px;
  width: 40px; padding: 15px 0 17px; cursor: pointer;
  border-radius: 13px; border: 1px solid #c9a53f;
  background: linear-gradient(180deg, #f6d87e 0%, #e9c45f 100%);
  color: #241c05; font: inherit;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5),
              0 8px 22px rgba(0,0,0,.42),
              0 0 0 0 rgba(246,216,126,.55);
  transition: box-shadow .22s ease, filter .18s ease,
              transform .4s var(--ps1-spring);
}
.ps1-dockscope .ps1-dock-tab:hover {
  filter: brightness(1.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5),
              0 10px 26px rgba(0,0,0,.45),
              0 0 22px 2px rgba(246,216,126,.45);
}
.ps1-dockscope .ps1-dock-tab:active { transform: scale(.94); }
.ps1-dockscope .ps1-dock-tab:focus-visible { outline: 2px solid #fff0bd; outline-offset: 3px; }
/* Folded away it is the only thing on the stage, so it gets a slow breath to
   say it is still there. */
#ps1-left.ps1-dock-collapsed .ps1-dock-tab { animation: ps1-rail-breathe 3.6s ease-in-out infinite; }
@keyframes ps1-rail-breathe {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.5),
                         0 8px 22px rgba(0,0,0,.42), 0 0 0 0 rgba(246,216,126,.5); }
  50%      { box-shadow: inset 0 1px 0 rgba(255,255,255,.5),
                         0 8px 22px rgba(0,0,0,.42), 0 0 18px 2px rgba(246,216,126,.4); }
}

/* Particles: spawned in script on each toggle, animated with the Web
   Animations API and removed when they finish. The layer never intercepts a
   click and is not part of the button's box. */
.ps1-dockscope .ps1-dock-sparks {
  position: absolute; inset: 0; pointer-events: none; overflow: visible;
}
.ps1-dockscope .ps1-dock-sparks { z-index: 6; }
.ps1-dockscope .ps1-spark {
  position: absolute; top: 50%; left: 50%; width: 7px; height: 7px;
  margin: -3.5px 0 0 -3.5px; border-radius: 50%;
  background: #fff3cd; box-shadow: 0 0 10px 2px rgba(246,216,126,.95);
  /* The flight is a CSS animation rather than a scripted one: each particle
     carries its own direction in custom properties, and the compositor runs
     it. Script-driven timelines were not advancing in a headless capture. */
  animation: ps1-spark-fly var(--ps1-dur, 700ms) cubic-bezier(.2,.7,.3,1) forwards;
}
/* Pop to full size in the first fifth, then travel and fade. Shrinking from
   the first frame -- which is what it did at first -- made the burst almost
   invisible: the particles were already a pixel across before anyone saw
   them. */
@keyframes ps1-spark-fly {
  0%   { transform: translate(0,0) scale(.2); opacity: 0; }
  18%  { transform: translate(calc(var(--ps1-dx, 0) * .22),
                              calc(var(--ps1-dy, 0) * .22))
         scale(var(--ps1-s, 1)); opacity: 1; }
  70%  { opacity: .9; }
  100% { transform: translate(var(--ps1-dx, 0), var(--ps1-dy, 0))
         scale(.2); opacity: 0; }
}
/* A chevron drawn in CSS, so there is no glyph to go missing in OBS. */
.ps1-dockscope .ps1-dock-chev {
  width: 9px; height: 9px; border-left: 2.5px solid currentColor;
  border-bottom: 2.5px solid currentColor; transform: rotate(45deg);
  transition: transform .44s var(--ps1-spring);
}
#ps1-left.ps1-dock-collapsed .ps1-dock-chev { transform: rotate(-135deg); }
/* The gap goes with the shell, so the rail comes to rest flush at the margin
   instead of sitting 10px out from it. */
#ps1-left.ps1-dock-collapsed { gap: 0; }
.ps1-dockscope .ps1-dock-tab-label {
  writing-mode: vertical-rl; text-orientation: mixed;
  font-size: 11px; font-weight: 900; letter-spacing: .2em;
  text-transform: uppercase; color: #3a2d06;
}
.ps1-dockscope .ps1-dock-count {
  min-width: 20px; padding: 3px 5px; border-radius: 10px;
  background: #241c05; color: #f6d87e; font-size: 11px; font-weight: 900;
  text-align: center; font-variant-numeric: tabular-nums;
}
@media (prefers-reduced-motion: reduce) {
  .ps1-dockscope .ps1-dock-shell, .ps1-dockscope .ps1-dock-chev,
  .ps1-dockscope .ps1-dock-tab { transition: none; animation: none; }
  .ps1-dockscope .ps1-dock-sparks { display: none; }
}
/* Title, then the cycle taking whatever room is left, then the actions
   pinned right. Previously nothing was allowed to shrink and both buttons
   asked for the same auto margin, so in 300px the labels wrapped onto three
   lines and the controls were unreadable. */
.ps1-dockscope .ps1-left-head {
  display: flex; align-items: center; gap: 8px; margin: 0 2px 9px;
}
.ps1-dockscope .ps1-left-title {
  flex: none; white-space: nowrap;
  font-size: 11px; font-weight: 800; letter-spacing: .14em;
  text-transform: uppercase; color: #9aa0c0;
}
.ps1-dockscope .ps1-left-cycle {
  flex: 1 1 auto; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 11px; color: #6f7496;
}
.ps1-dockscope .ps1-head-actions {
  flex: none; display: flex; align-items: center; gap: 6px;
}
/* One wide cell per firm, stacked. Clicking a cell drops that firm's
   accounts open directly beneath it -- no separate menu, nothing to
   navigate away to. */
.ps1-dockscope .ps1-cells { display: flex; flex-direction: column; gap: 9px; }
.ps1-dockscope .ps1-group { display: flex; flex-direction: column; }
.ps1-dockscope .ps1-cell {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; padding: 13px 20px 13px 15px; border-radius: 12px;
  cursor: pointer;
  text-align: left; font: inherit;
  background: linear-gradient(180deg, #f6d87e 0%, #e9c45f 100%);
  border: 1px solid #c9a53f; color: #241c05;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 6px 18px rgba(0,0,0,.35);
}
.ps1-dockscope .ps1-cell:hover { filter: brightness(1.05); border-color: #fff0bd; }
.ps1-dockscope .ps1-cell-open {
  border-radius: 12px 12px 0 0; box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
}
.ps1-dockscope .ps1-cell-firm { font-weight: 800; font-size: 15px; line-height: 1.15; }
.ps1-dockscope .ps1-cell-right { display: flex; align-items: baseline; gap: 5px; }
.ps1-dockscope .ps1-cell-count { font-size: 24px; font-weight: 900; line-height: 1; }
.ps1-dockscope .ps1-cell-unit {
  font-size: 10px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .07em; opacity: .62;
}
/* Exhausted: same size, same place in the stack, clearly spent but still
   legible and still openable. */
.ps1-dockscope .ps1-cell-spent {
  background: rgba(38,34,20,.88); border-color: #5a5231; color: #cdc091;
  box-shadow: none; cursor: pointer;
}
.ps1-dockscope .ps1-cell-spent:hover { filter: none; border-color: #8a7c4a; }
.ps1-dockscope .ps1-cell-spent .ps1-cell-count { color: #e6d9a8; }
.ps1-dockscope .ps1-cell-spent .ps1-cell-unit { opacity: .8; letter-spacing: .08em; }
.ps1-dockscope .ps1-cell-spent + .ps1-drop { border-color: #5a5231; }
/* the drop-down body, visually hanging off its cell */
.ps1-dockscope .ps1-drop {
  border: 1px solid #c9a53f; border-top: 0; border-radius: 0 0 12px 12px;
  overflow: hidden; background: rgba(13,15,28,.95); backdrop-filter: blur(3px);
}
.ps1-dockscope .ps1-acct {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 10px 20px 10px 14px; border: 0; border-top: 1px solid #262a44;
  background: transparent; color: #f2f3fb; cursor: pointer;
  text-align: left; font: inherit;
}
.ps1-dockscope .ps1-acct:first-child { border-top: 0; }
.ps1-dockscope .ps1-acct:hover:not(:disabled) { background: #1d1740; }
.ps1-dockscope .ps1-acct-sel { background: #1d1740; box-shadow: inset 3px 0 0 #f4d27a; }
.ps1-dockscope .ps1-acct-out { opacity: .45; cursor: default; }
.ps1-dockscope .ps1-acct-size {
  font-weight: 900; font-size: 15px; color: #f4d27a; min-width: 50px;
}
.ps1-dockscope .ps1-acct-label { font-weight: 600; font-size: 14px; }
.ps1-dockscope .ps1-tick { margin-left: auto; color: #f4d27a; font-weight: 900; }
.ps1-dockscope .ps1-pill {
  margin-left: auto; font-size: 10px; padding: 1px 7px; border-radius: 99px;
  border: 1px solid #3a3550; color: #9aa0c0;
}
.ps1-dockscope .ps1-kv {
  display: grid; grid-template-columns: auto 1fr; gap: 2px 9px;
  font-size: 11px; margin-top: 10px; padding: 9px 10px;
  border: 1px solid #3a3550; border-radius: 11px; background: rgba(13,15,28,.92);
}
.ps1-dockscope .ps1-kv div:nth-child(odd) { color: #9aa0c0; }
.ps1-dockscope code { font-family: ui-monospace, Consolas, monospace; font-size: 11px; color: #8fc4ff; }
.ps1-dockscope .ps1-tiny { font-size: 11px; color: #9aa0c0; }
.ps1-dockscope button[id] { font: inherit; }
@media (max-width: 1500px) { #ps1-left { width: 250px; }
}
@media (max-width: 1200px) { #ps1-left { position: static; width: auto; margin: 12px; }
}
/* The accounts a cell drops open are part of the same block, so the whole
   group is measured when the stack is centred on the wheel. */
.ps1-dockscope .ps1-group { position: relative; }
.ps1-dockscope .ps1-acct[disabled] { cursor: default; }
/* Outcome pills on accounts that can no longer be picked. */
.ps1-dockscope .ps1-pill-done {
  border-color: #1c5a3f; color: #6fe3b0; background: rgba(13,43,30,.65);
}
.ps1-dockscope .ps1-pill-hold {
  border-color: #6b5015; color: #f0c76a; background: rgba(42,33,16,.65);
}
.ps1-dockscope .ps1-acct-out { opacity: .72; }
/* readable, not ghosted */
.ps1-dockscope .ps1-acct-out .ps1-acct-size { color: #c7b682; }
.ps1-dockscope .ps1-acct-out .ps1-acct-label { color: #b9bdd4; }

/* One-line explanation above the detail on a failed or unconfirmed
   submission. Higher contrast than .ps1-tiny on purpose. */
#ps1-panel .ps1-lead {
  margin: 0 0 6px; font-size: 12px; line-height: 1.4; color: #e8eaf6;
}

/* ---- profile switcher ---- */
#ps1-panel .ps1-head #ps1-switch {
  margin-left: 0; width: auto; padding: 2px 8px; font-size: 11px;
  background: #1b1f33; color: #9aa0c0; border: 1px solid #2a2f4d; border-radius: 6px;
}
#ps1-panel .ps1-head #ps1-switch:hover { color: #f2f3fb; border-color: #7c4dff; }
#ps1-panel .ps1-head #ps1-min { margin-left: 6px; }
#ps1-switcher {
  position: fixed; inset: 0; z-index: 2147483100; display: flex;
  align-items: center; justify-content: center; background: rgba(4,5,12,.72);
  font: 13px/1.45 "Segoe UI", system-ui, sans-serif; color: #f2f3fb;
}
#ps1-switcher .ps1-switcher-box {
  width: 420px; max-width: 92vw; background: #141728; color: #f2f3fb;
  border: 1px solid #2a2f4d; border-radius: 14px; padding: 16px 18px;
  box-shadow: 0 24px 70px rgba(0,0,0,.6);
}
#ps1-switcher h4 { margin: 0 0 6px; font-size: 15px; }
#ps1-switcher .ps1-tiny { font-size: 11px; color: #9aa0c0; }
#ps1-switcher .ps1-switch-list {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px; margin: 12px 0;
}
#ps1-switcher .ps1-switch-user {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
  padding: 8px 10px; border-radius: 9px; cursor: pointer; text-align: left;
  background: #1b1f33; border: 1px solid #2a2f4d; color: #f2f3fb; font: inherit;
}
#ps1-switcher .ps1-switch-user:hover { border-color: #7c4dff; }
#ps1-switcher .ps1-su-chosen { border-color: #7c4dff; background: #231c45; }
#ps1-switcher .ps1-su-name { font-weight: 700; font-size: 13px; }
#ps1-switcher .ps1-su-role { font-size: 11px; color: #9aa0c0; }
#ps1-switcher .ps1-su-me { font-size: 10px; color: #f4d27a; font-weight: 700; }
#ps1-switcher .ps1-row { display: flex; gap: 7px; align-items: center; margin-top: 4px; }
#ps1-switcher input {
  flex: 1 1 auto; background: #0e1020; color: #f2f3fb; border: 1px solid #2a2f4d;
  border-radius: 7px; padding: 6px 9px; font: inherit;
}
#ps1-switcher button {
  background: #1b1f33; color: #f2f3fb; border: 1px solid #2a2f4d;
  border-radius: 7px; padding: 6px 11px; cursor: pointer; font: inherit;
}
#ps1-switcher .ps1-primary { background: #7c4dff; border-color: #7c4dff; font-weight: 700; }

/* ---- unresolved operations ---- */
#ps1-panel .ps1-badge-count {
  margin-left: auto; width: auto; height: auto; padding: 2px 8px; font-size: 10px;
  font-weight: 800; letter-spacing: .04em; cursor: pointer;
  background: #3a2a10; color: #f0c76a; border: 1px solid #6b5015; border-radius: 99px;
}
#ps1-panel .ps1-badge-count:hover { border-color: #f0c76a; }
#ps1-panel .ps1-unres {
  border: 1px solid #6b5015; background: rgba(42,33,16,.5);
  border-radius: 10px; padding: 9px 10px; margin-bottom: 8px;
}
#ps1-panel .ps1-unres-top {
  display: flex; align-items: center; gap: 8px; justify-content: space-between;
}
#ps1-panel .ps1-unres .ps1-pill {
  font-size: 10px; padding: 1px 7px; border-radius: 99px;
  border: 1px solid #6b5015; color: #f0c76a;
}
#ps1-panel .ps1-unres .ps1-row { margin-bottom: 2px; }
#ps1-panel .ps1-unres button[disabled] { opacity: .6; cursor: default; }

/* ======================================================================
   Official Winner popup - submission states
   ====================================================================== */
#winner-prize {
  margin: 10px 0 2px; font-size: 17px; font-weight: 700; color: #cfd3ee;
  letter-spacing: .01em;
}
#winner-prize .winner-prize-name { color: #f4d27a; font-weight: 900; }

#winner-submit-state { margin-top: 14px; }
#winner-submit-state .ws {
  border-radius: 12px; padding: 12px 14px; font-size: 14px; line-height: 1.45;
  border: 1px solid #2a2f4d; background: rgba(13,15,28,.9); text-align: left;
  max-width: 460px; margin: 0 auto;
}
#winner-submit-state .ws b { display: block; font-size: 15px; margin-bottom: 4px; }
#winner-submit-state .ws-pending { color: #cfd3ee; text-align: center; }
#winner-submit-state .ws-blocked {
  border-color: #5d2033; background: rgba(43,16,24,.92); color: #ffc2d0;
}
#winner-submit-state .ws-review {
  border-color: #6b5015; background: rgba(42,33,16,.92); color: #f0c76a;
}
#winner-submit-state .ws-ok {
  border-color: #1f5d3a; background: rgba(15,38,26,.92); color: #8ff0b5;
}
#winner-submit-state .ws-failed {
  border-color: #5d2033; background: rgba(36,16,24,.92); color: #ffc2d0;
}
#winner-submit-state .ws-actions {
  display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap;
}
#winner-submit-state .ws-actions button {
  background: #7c4dff; color: #fff; border: 1px solid #7c4dff; font-weight: 700;
  border-radius: 9px; padding: 8px 14px; cursor: pointer; font-size: 14px;
}
#winner-submit-state .ws-actions button:nth-child(2) {
  background: transparent; border-color: #3a3550; color: #cfd3ee; font-weight: 600;
}
#winner-submit-state .ws-actions button[disabled] { opacity: .55; cursor: default; }
/* The way out. Styled apart from the primary action and never dimmed by the
   nth-child rule above, because whatever else a failure card offers, leaving
   it must always be obviously available. */
#winner-submit-state .ws-actions button.ps1-back-btn {
  background: transparent; border-color: #5a5480; color: #e8eaf7;
  font-weight: 700; margin-left: auto;
}
#winner-submit-state .ws-actions button.ps1-back-btn:hover {
  border-color: #cfd3ee; background: rgba(255,255,255,.06);
}
#winner-submit-state .ws-actions { display: flex; flex-wrap: wrap; gap: 8px;
  align-items: center; }
#winner-submit-state .ws-note {
  margin-top: 8px; font-size: 12px; opacity: .8;
}

/* ======================================================================
   Modal backdrop
   The engine draws its own backdrop (rgba(4,4,8,0.6)) at z-index 45 across
   the whole viewport. Rather than imitate it, the dock sits below that
   layer, so a popup dims it with the identical treatment automatically.
   ====================================================================== */
#ps1-left { z-index: 40; }

/* The selected row, copied above the overlay so it alone stays sharp.
   Inert: this is a readout during an award, not a control. */
#ps1-lift {
  position: fixed; z-index: 46; pointer-events: none;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 10px;
  background: #1d1740; color: #f2f3fb;
  box-shadow: inset 3px 0 0 #f4d27a, 0 0 0 1px rgba(244,210,122,.5),
              0 10px 30px rgba(0,0,0,.5);
  font: 13px/1.45 "Segoe UI", system-ui, sans-serif;
}
#ps1-lift .ps1-acct-size { font-weight: 900; font-size: 15px; color: #f4d27a; min-width: 50px; }
#ps1-lift .ps1-acct-label { font-weight: 600; font-size: 14px; }
#ps1-lift .ps1-tick { margin-left: auto; color: #f4d27a; font-weight: 900; }

/* Nothing on the board is clickable while a popup is up. */
body.ps1-modal #ps1-left { pointer-events: none; }

/* ======================================================================
   Removed from both the countdown and the winner screens.
   ====================================================================== */
#pending-odds, #winner-story { display: none !important; }

/* ---- dock header controls ---- */
.ps1-dockscope .ps1-dock-btn {
  flex: none; white-space: nowrap;
  background: #1b1f33; color: #9aa0c0;
  border: 1px solid #2a2f4d; border-radius: 6px; padding: 3px 7px;
  font-size: 10px; letter-spacing: .02em; line-height: 1.3; cursor: pointer;
}
.ps1-dockscope .ps1-dock-btn:hover { color: #f2f3fb; border-color: #7c4dff; }
/* The popout is the one control nobody goes looking for, so it is the one
   that has to be findable. */
.ps1-dockscope .ps1-dock-btn.ps1-pop-btn {
  color: #f6d87e; border-color: #8a6f22; background: #241c05;
  font-weight: 700;
}
.ps1-dockscope .ps1-dock-btn.ps1-pop-btn:hover {
  color: #241c05; background: #f6d87e; border-color: #f6d87e;
}
/* Present but unusable: say so rather than disappear. */
.ps1-dockscope .ps1-dock-btn.ps1-pop-off,
.ps1-dockscope .ps1-dock-btn.ps1-pop-off:hover {
  color: #6f7496; background: #15182a; border-color: #2a2f4d;
  cursor: not-allowed; font-weight: 400;
}
.ps1-dockscope .ps1-board-pick {
  display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
  margin: 0 2px 9px;
}
.ps1-dockscope .ps1-board-btn {
  background: #141728; color: #9aa0c0; border: 1px solid #2a2f4d;
  border-radius: 6px; padding: 3px 8px; font-size: 11px; cursor: pointer;
}
.ps1-dockscope .ps1-board-btn:hover { border-color: #7c4dff; color: #f2f3fb; }
.ps1-dockscope .ps1-board-on {
  background: #231c45; border-color: #7c4dff; color: #f2f3fb; font-weight: 700;
}
/* The dock header must stay usable while the rest of the board is inert. */
body.ps1-modal .ps1-dockscope .ps1-left-head,
body.ps1-modal .ps1-dockscope .ps1-board-pick { pointer-events: none; opacity: .5; }

/* ---- collapsed to an edge tab ---- */
#ps1-panel.ps1-collapsed {
  width: auto; bottom: auto; border-radius: 10px 0 0 10px;
  border: 1px solid #2a2f4d; border-right: 0;
}
#ps1-panel.ps1-collapsed .ps1-head { border-bottom: 0; padding: 6px 8px; }
#ps1-panel.ps1-collapsed .ps1-badge,
#ps1-panel.ps1-collapsed #ps1-who,
#ps1-panel.ps1-collapsed #ps1-switch { display: none; }
#ps1-panel.ps1-collapsed #ps1-unres-badge { margin-left: 0; }
#ps1-panel.ps1-collapsed #ps1-min {
  margin-left: 0; width: auto; padding: 3px 9px; font-size: 10px;
  font-weight: 800; letter-spacing: .08em; color: #f4d27a;
}

/* ======================================================================
   Bootcamp mode: the PropScore board is replaced, not merely hidden, so
   the operator can see which business the round belongs to.
   ====================================================================== */
#ps1-bootcamp-banner {
  position: fixed; left: 18px; top: 112px; width: 268px; z-index: 44;
  border-radius: 14px; padding: 14px 16px;
  border: 1px solid #4a3a16; background: rgba(32, 25, 10, .94);
  color: #f0c76a; font-size: 13px; line-height: 1.45;
  backdrop-filter: blur(6px);
}
#ps1-bootcamp-banner.ps1-hidden { display: none; }
#ps1-bootcamp-banner .ps1-bc-title {
  font-weight: 700; font-size: 14px; margin-bottom: 6px; color: #ffd98a;
}
#ps1-bootcamp-banner .ps1-bc-body { opacity: .9; }
#ps1-bootcamp-banner .ps1-bc-note { margin-top: 8px; font-size: 12px; opacity: .8; }

/* A draw needs a prize. The control stays visible and clickable-looking
   until it is pressed, so the reason can be stated plainly rather than the
   operator being left with a dead button and no explanation. */
[data-ps1-blocked="1"] {
  opacity: 0.55;
  filter: saturate(0.4);
  cursor: not-allowed;
}
.ps1-gate-note {
  position: fixed;
  left: 50%;
  bottom: calc(24px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  z-index: 99999;
  max-width: min(92vw, 420px);
  padding: 11px 18px;
  border-radius: 8px;
  border: 1px solid rgba(242, 85, 90, 0.5);
  background: #2a1418;
  color: #ffd9db;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5);
}

/* ----------------------------------------------------------------------
   Winner pasted from Neon's own engine.

   Sits under the prize list inside the dock's scrolling column, so it
   cannot push the list off a short window -- the dock already caps its own
   height and scrolls internally, and this block has to live inside that.
   ---------------------------------------------------------------------- */
.ps1-dockscope .ps1-neon {
  flex: none;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #2a2f4d;
  border-top-color: #3a3f63;
  border-radius: 8px;
  background: #151829;
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}
/* Hiding it has to be said here: the rule above sets display, and an
   author rule beats the browser's own [hidden], so the attribute alone
   left this box on every board. */
.ps1-dockscope .ps1-neon[hidden],
.ps1-nstage .ps1-neon[hidden] { display: none; }
.ps1-dockscope .ps1-neon-head {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #f6d87e;
}
.ps1-dockscope .ps1-neon-text {
  width: 100%;
  box-sizing: border-box;
  resize: vertical;
  min-height: 62px;
  max-height: 180px;
  padding: 7px 8px;
  border: 1px solid #2a2f4d;
  border-radius: 6px;
  background: #0f1220;
  color: #d7dbf0;
  font: 11px/1.45 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
.ps1-dockscope .ps1-neon-text:focus {
  outline: none;
  border-color: #7c4dff;
}
.ps1-dockscope .ps1-neon-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
/* The committing action is the one that must not be hit by accident, so it
   is the one that looks different and starts out disabled. */
.ps1-dockscope .ps1-dock-btn.ps1-neon-go {
  color: #f6d87e;
  border-color: #8a6f22;
  background: #241c05;
  font-weight: 700;
}
.ps1-dockscope .ps1-dock-btn.ps1-neon-go:hover:not(:disabled) {
  color: #241c05;
  background: #f6d87e;
  border-color: #f6d87e;
}
.ps1-dockscope .ps1-dock-btn.ps1-neon-go:disabled {
  opacity: .45;
  filter: saturate(.4);
  cursor: not-allowed;
}
.ps1-dockscope .ps1-neon-out:empty { display: none; }
.ps1-dockscope .ps1-neon-out {
  font-size: 11px;
  line-height: 1.5;
  color: #9aa0c0;
  word-break: break-word;
}
.ps1-dockscope .ps1-neon-rec {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 6px 8px;
  margin-bottom: 5px;
  border-radius: 6px;
  background: #0f1220;
  border: 1px solid #2a2f4d;
}
.ps1-dockscope .ps1-neon-rec b { color: #f2f3fb; font-size: 12px; }
.ps1-dockscope .ps1-neon-dim {
  color: #7f86a8;
  font: 10px/1.4 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
.ps1-dockscope .ps1-neon-note { margin: 4px 0 0; color: #9aa0c0; }
.ps1-dockscope .ps1-neon-ok .ps1-neon-note { color: #9fe0b4; }
.ps1-dockscope .ps1-neon-bad {
  color: #ffd9db;
  padding: 7px 9px;
  border-radius: 6px;
  border: 1px solid rgba(242, 85, 90, .45);
  background: #2a1418;
}
.ps1-dockscope .ps1-neon-busy { color: #f6d87e; }

/* A paste holding more than one award gives each winner its own prize
   picker, so a MOC Double can be awarded in one pass without the second
   winner having to survive a clear-and-re-paste. */
.ps1-dockscope .ps1-neon-pick {
  margin-top: 5px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 4px 6px;
  font: 11px/1.4 inherit;
  color: #f2f3fb;
  background: #161a2e;
  border: 1px solid #39406a;
  border-radius: 5px;
}
.ps1-dockscope .ps1-neon-pick:focus {
  outline: none;
  border-color: #f6d87e;
}
.ps1-dockscope .ps1-neon-pick:disabled {
  opacity: .6;
  cursor: not-allowed;
}
.ps1-dockscope .ps1-neon-st:empty { display: none; }
.ps1-dockscope .ps1-neon-st {
  margin-top: 4px;
  font-size: 10px;
}
/* The row status is a line inside a card, never the red panel the whole
   output box uses for a refusal. */
.ps1-dockscope .ps1-neon-st.ps1-neon-bad {
  padding: 0;
  border: 0;
  background: none;
  color: #ff9ea3;
}
.ps1-dockscope .ps1-neon-st.ps1-neon-ok { color: #9fe0b4; }
.ps1-dockscope .ps1-neon-warn { color: #f6d87e; }

/* ------------------------------------------------------------------
   Neon's Version.

   He draws on his own engine, so the wheel in the middle of the stage is
   not just unused -- it tells the room the draw happens here. Switched on,
   the reel and its controls stand down and the stage carries the two
   things he does use: the board on the left, the paste box on the right.

   Everything here is scoped to the switch being on, so the engine is
   untouched for every other streamer and for every Bootcamp round.
   ------------------------------------------------------------------ */
body.ps1-neonstage-on .reel-shell,
body.ps1-neonstage-on #spin-btn,
body.ps1-neonstage-on #spin-speed-row,
body.ps1-neonstage-on #empty-hint,
body.ps1-neonstage-on #capture-launcher,
body.ps1-neonstage-on #giveaway-account-row { display: none !important; }

/* The dock is empty while its contents are on the stage; the rail would
   just be a handle on nothing. */
#ps1-left.ps1-dock-off { display: none; }

.ps1-nstage {
  width: min(1180px, calc(100vw - 72px));
  margin: 6px auto 10px;
  font: 13px/1.45 "Segoe UI", system-ui, sans-serif;
  color: #f2f3fb;
  text-align: left;
}
.ps1-nstage[hidden] { display: none; }
.ps1-nstage-head {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 0 2px 8px;
}
.ps1-nstage-title {
  font-size: 13px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: #f6d87e;
}
.ps1-nstage-sub { font-size: 11px; color: #9aa0c0; flex: 1 1 auto; }
.ps1-nstage-panes {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.ps1-nstage-pane {
  min-width: 0;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid #2a2f4d;
  background: rgba(12, 15, 28, .82);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .38);
}
.ps1-nstage-pt {
  font-size: 11px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: #8d93b5; margin-bottom: 8px;
}
/* On the stage the board is wide, so the firm cells sit side by side and
   the whole list is open at once -- no hunting for an account mid-stream. */
.ps1-nstage .ps1-dock-inner,
.ps1-nstage .ps1-dock-shell { width: auto; max-height: none; }
.ps1-nstage .ps1-inv {
  max-height: min(58vh, 560px);
  overflow-y: auto;
  padding-right: 4px;
}
.ps1-nstage .ps1-neon {
  margin-top: 0;
  border: 0;
  background: none;
  padding: 0;
}
.ps1-nstage .ps1-neon-text { min-height: 150px; }
.ps1-nstage .ps1-neon-out { max-height: 42vh; overflow-y: auto; }

@media (max-width: 1100px) {
  .ps1-nstage-panes { grid-template-columns: minmax(0, 1fr); }
  .ps1-nstage .ps1-inv { max-height: 34vh; }
}

/* The switch itself. It travels with the board: in the dock while the
   engine is normal, in the stage header once the stage is on, so it is
   always directly above the prizes. */
/* The corner the Sniff Counter used to hold. It is a switch for the whole
   stage, so it sits on the stage furniture rather than inside one of the
   panels it moves about -- and it stays in the same place whether the stage
   is on or off, so turning it back off is never a search. */
.ps1-neon-vhost {
  position: absolute; top: 16px; left: 20px; z-index: 950;
  font: 13px/1.45 "Segoe UI", system-ui, sans-serif;
}
.ps1-neon-vhost[hidden] { display: none; }
.ps1-vtoggle {
  display: inline-flex; align-items: center; gap: 10px;
  cursor: pointer; user-select: none;
  padding: 9px 14px; border-radius: 10px;
  border: 1px solid #39406a; background: rgba(12, 15, 28, .92);
  box-shadow: 0 10px 26px rgba(0, 0, 0, .42);
  transition: border-color .18s ease, background .18s ease;
}
.ps1-vtoggle:hover { border-color: #6a74ad; }
.ps1-neon-vhost .ps1-vtoggle:has(input:checked) {
  border-color: #f6d87e;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .42), 0 0 0 1px rgba(246, 216, 126, .35);
}
.ps1-vtoggle input {
  position: absolute; opacity: 0; width: 0; height: 0;
}
.ps1-vtoggle-track {
  position: relative; flex: none;
  width: 46px; height: 24px; border-radius: 12px;
  background: #242a44; border: 1px solid #39406a;
  transition: background .18s ease, border-color .18s ease;
}
.ps1-vtoggle-dot {
  position: absolute; top: 2px; left: 2px;
  width: 18px; height: 18px; border-radius: 50%;
  background: #8d93b5;
  transition: transform .18s ease, background .18s ease;
}
.ps1-vtoggle input:checked + .ps1-vtoggle-track {
  background: #4a3c12; border-color: #f6d87e;
}
.ps1-vtoggle input:checked + .ps1-vtoggle-track .ps1-vtoggle-dot {
  transform: translateX(22px); background: #f6d87e;
}
.ps1-vtoggle input:focus-visible + .ps1-vtoggle-track {
  outline: 2px solid #f6d87e; outline-offset: 2px;
}
.ps1-vtoggle-label {
  font-size: 12.5px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; color: #9aa0c0;
}
.ps1-vtoggle input:checked ~ .ps1-vtoggle-label { color: #f6d87e; }

/* A row on his stage is a readout. It keeps the look of a live account --
   dimming every row would say the prizes had gone -- and simply does
   nothing when it is pressed. */
.ps1-dockscope .ps1-acct.ps1-acct-inert {
  cursor: default;
  opacity: 1;
}
.ps1-dockscope .ps1-acct.ps1-acct-inert:hover { background: inherit; }

/* The same handle, already awarded inside this show's own window. */
.ps1-dockscope .ps1-neon-warn-box {
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px;
  margin-top: 6px; padding: 8px 9px;
  border-radius: 6px;
  border: 1px solid rgba(246, 216, 126, .5);
  background: #2a2412;
  color: #f7e4a8;
  font-size: 11px; line-height: 1.45;
}
.ps1-dockscope .ps1-neon-warn-box b { color: #f6d87e; }
.ps1-dockscope .ps1-neon-warn-box .ps1-neon-dim { color: #c2ab6d; }
.ps1-dockscope .ps1-neon-warn-box .ps1-neon-confirm {
  align-self: stretch;
  border-color: rgba(246, 216, 126, .55);
  color: #f6d87e;
}
.ps1-dockscope .ps1-neon-warn-done {
  border-color: rgba(159, 224, 180, .45);
  background: #13251a;
  color: #9fe0b4;
}

/* The dock's controls while the dock is away. */
.ps1-nstage-actions {
  display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.ps1-nstage-actions .ps1-board-pick {
  display: inline-flex; align-items: center; gap: 6px;
  margin: 0; padding: 0; border: 0; background: none;
}
.ps1-nstage-actions .ps1-board-pick[hidden] { display: none; }


/* ======================================================================
   Winner card: firm large, account under it.
   ====================================================================== */
.ps1-won-label { display:block; font-size:0.42em; letter-spacing:0.18em;
  text-transform:uppercase; opacity:0.55; margin-bottom:0.25em; font-weight:800 }
.ps1-won-stack { display:flex; flex-direction:column; align-items:center;
  line-height:1.05; gap:0.12em }
.ps1-won-firm { display:block; font-weight:900; letter-spacing:-0.02em }
.ps1-won-acct { display:block; font-size:0.52em; font-weight:700;
  letter-spacing:0.01em; opacity:0.72 }

/* ======================================================================
   A firm whose accounts are all identical: one click takes the next.
   ====================================================================== */


/* ======================================================================
   Background submission queue, in the dock where the streamer is looking.
   ====================================================================== */
/* Quiet on purpose, opposite the chat note: the board is on stream. */
.ps1-subq { position:fixed; left:16px; bottom:16px; z-index:80; display:flex; flex-direction:column;
  gap:7px; max-width:min(320px, calc(100vw - 32px)) }
.ps1-subq[hidden] { display:none }

.ps1-subq-live { display:flex; align-items:center; gap:8px; padding:7px 10px;
  border-radius:8px; font-size:11.5px; line-height:1.35;
  background:rgba(171,132,255,0.10); border:1px solid rgba(171,132,255,0.32);
  color:#E0DBFF }
.ps1-subq-live b { font-weight:800 }
.ps1-subq-more { opacity:0.7 }
.ps1-subq-try { margin-left:auto; font-size:9.5px; font-weight:800;
  letter-spacing:0.08em; text-transform:uppercase; color:#FFC45C }
.ps1-subq-spin { flex:none; width:11px; height:11px; border-radius:50%;
  border:2px solid rgba(171,132,255,0.35); border-top-color:#AB84FF;
  animation:ps1-subq-rot 0.7s linear infinite }
@keyframes ps1-subq-rot { to { transform:rotate(360deg) } }

.ps1-subq-bad { border-radius:8px; overflow:hidden;
  background:rgba(229,72,77,0.09); border:1px solid rgba(229,72,77,0.42) }
.ps1-subq-bad-head { padding:6px 10px; font-size:10px; font-weight:800;
  letter-spacing:0.1em; text-transform:uppercase; color:#FF9B9E;
  background:rgba(229,72,77,0.12) }
.ps1-subq-item { padding:8px 10px; font-size:11.5px; line-height:1.4;
  border-top:1px solid rgba(229,72,77,0.22) }
.ps1-subq-item:first-of-type { border-top:0 }
.ps1-subq-who { display:flex; flex-wrap:wrap; gap:6px; align-items:baseline }
.ps1-subq-who b { font-weight:800; color:#fff }
.ps1-subq-who span { font-size:10.5px; opacity:0.65 }
.ps1-subq-why { margin-top:3px; opacity:0.82 }
.ps1-subq-acts { display:flex; gap:6px; margin-top:7px; flex-wrap:wrap }
.ps1-subq-drop { opacity:0.7 }

.ps1-fast-on { border-color:rgba(171,132,255,0.5) !important;
  color:#C0B5FF !important; background:rgba(171,132,255,0.14) !important }


/* ======================================================================
   The prize dock, calmed down.

   The firm cells were a solid gold gradient with near-black text. Next to
   the engine's near-black stage that reads as a warning strip rather than a
   list, and on stream it pulls the eye off the wheel. They are dark raised
   surfaces now, and the gold is kept where it carries meaning -- how many
   are left, and the account sizes -- instead of covering the whole block.
   ====================================================================== */
.ps1-dockscope .ps1-cell {
  background: linear-gradient(180deg, rgba(29,29,37,0.96) 0%, rgba(19,19,25,0.96) 100%);
  border: 1px solid rgba(255,255,255,0.09);
  color: #F3F2F7;
  box-shadow: 0 2px 10px rgba(0,0,0,0.32);
  align-items: center;
}
.ps1-dockscope .ps1-cell:hover {
  filter: none;
  background: linear-gradient(180deg, rgba(36,36,45,0.97) 0%, rgba(25,25,32,0.97) 100%);
  border-color: rgba(232,200,121,0.40);
}
.ps1-dockscope .ps1-cell-open {
  border-color: rgba(171,132,255,0.48);
  box-shadow: none;
}
.ps1-dockscope .ps1-cell-firm { color: #F3F2F7; }
.ps1-dockscope .ps1-cell-count { color: #E8C879; }
.ps1-dockscope .ps1-cell-unit { color: #9796A3; opacity: 1; }

/* Spent: still in place, still openable, clearly done. */
.ps1-dockscope .ps1-cell-spent {
  background: rgba(16,16,20,0.92);
  border-color: rgba(255,255,255,0.06);
  color: #6f6e7a;
  box-shadow: none;
}
.ps1-dockscope .ps1-cell-spent:hover { border-color: rgba(255,255,255,0.14); }
.ps1-dockscope .ps1-cell-spent .ps1-cell-firm { color: #8d8c98; }
.ps1-dockscope .ps1-cell-spent .ps1-cell-count { color: #7f7768; }
.ps1-dockscope .ps1-cell-spent .ps1-cell-unit { color: #6b6a75; }

/* The drop body hangs off its cell, so it takes the cell's border. */
.ps1-dockscope .ps1-drop { border-color: rgba(171,132,255,0.48); }
.ps1-dockscope .ps1-cell-spent + .ps1-drop { border-color: rgba(255,255,255,0.06); }

/* ======================================================================
   "5 x 50K Eval" -- its own line under the firm name.
   ====================================================================== */
.ps1-dockscope .ps1-cell-main {
  display: flex; flex-direction: column; gap: 3px;
  min-width: 0; flex: 1 1 auto;
}
.ps1-dockscope .ps1-cell-same {
  display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.03em;
  color: #E8C879; opacity: 0.92;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ps1-dockscope .ps1-cell-run {
  display: inline-block; margin-left: 7px; padding: 1px 7px; border-radius: 999px;
  font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  color: #CDB4FF; background: rgba(171,132,255,0.16);
  border: 1px solid rgba(171,132,255,0.42); vertical-align: 1px;
}
.ps1-dockscope .ps1-cell-spent .ps1-cell-same { color: #8a8270; opacity: 0.8; }

/* ======================================================================
   The folded rail, to match the cells.

   It was the same gold slab, and once the list behind it went dark it was
   the brightest thing on the stage. Dark body, gold kept for the label and
   the count so it still reads as the prize dock at a glance.
   ====================================================================== */
.ps1-dockscope .ps1-dock-tab {
  border-color: rgba(232,200,121,0.34);
  background: linear-gradient(180deg, rgba(29,29,37,0.97) 0%, rgba(19,19,25,0.97) 100%);
  color: #E8C879;
  box-shadow: 0 6px 20px rgba(0,0,0,0.42);
}
.ps1-dockscope .ps1-dock-tab:hover {
  filter: none;
  border-color: rgba(232,200,121,0.62);
  box-shadow: 0 8px 24px rgba(0,0,0,0.48), 0 0 18px 1px rgba(232,200,121,0.18);
}
.ps1-dockscope .ps1-dock-tab:focus-visible {
  outline-color: rgba(232,200,121,0.75);
}
.ps1-dockscope .ps1-dock-tab-label { color: #E8C879; }
.ps1-dockscope .ps1-dock-count {
  background: rgba(232,200,121,0.14); color: #E8C879;
  border: 1px solid rgba(232,200,121,0.34);
}

/* Folded away it is still the only thing on the stage, so it keeps its
   breath -- but a dark rail needs a hint that it is alive, not a lamp. */
#ps1-left.ps1-dock-collapsed .ps1-dock-tab {
  animation: ps1-rail-breathe-calm 3.6s ease-in-out infinite;
}
@keyframes ps1-rail-breathe-calm {
  0%, 100% { box-shadow: 0 6px 20px rgba(0,0,0,0.42),
                         0 0 0 0 rgba(232,200,121,0); }
  50%      { box-shadow: 0 6px 20px rgba(0,0,0,0.42),
                         0 0 16px 1px rgba(232,200,121,0.24); }
}


/* ======================================================================
   The prize on the stage: firm over account, fitted to the width.

   The underlying input keeps the value the engine reads; this is what is
   on screen while a prize is selected. Sizes are set by fitText(), so the
   rules below deliberately do not fix a font-size.
   ====================================================================== */
.ps1-acctview {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  width: min(520px, 76vw); max-width: 100%;
  padding: 9px 18px; border-radius: 12px;
  background: rgba(16,16,22,0.92); border: 1px solid rgba(255,255,255,0.09);
  text-align: center;
}
.ps1-acctview[hidden] { display: none; }
.ps1-acctview-firm {
  display: block; max-width: 100%; white-space: nowrap; overflow: hidden;
  font-weight: 900; letter-spacing: -0.02em; line-height: 1.1; color: #F3F2F7;
}
.ps1-acctview-acct {
  display: block; max-width: 100%; white-space: nowrap; overflow: hidden;
  font-weight: 700; letter-spacing: 0.01em; line-height: 1.2; color: #E8C879;
}

/* The winner card. The whole stream is looking at this one. */
.ps1-won-stack { gap: 0.06em; width: 100%; }
.ps1-won-firm {
  max-width: 100%; white-space: nowrap; overflow: hidden;
  line-height: 1.06;
}
.ps1-won-acct {
  max-width: 100%; white-space: nowrap; overflow: hidden;
  /* Kept proportional rather than inherited. fitText() sets an explicit
     pixel size on both lines at render time and wins over this, but it
     bails out when the card has no width yet -- and an inherited size made
     the account exactly as big as the firm in that window. */
  font-size: 0.52em; opacity: 0.8; color: #E0DBFF; line-height: 1.2;
}

/* ======================================================================
   The draw status, moved under Settings in the header's right cluster.
   display is deliberately not set here, so the engine's own
   `body.is-capturing .status-line { display: none }` still hides it while
   entries are open.
   ====================================================================== */
.header-right { flex-wrap: wrap; justify-content: flex-end; }
.header-right .ps1-status-moved {
  flex-basis: 100%; justify-content: flex-end;
  margin-top: 5px; white-space: nowrap;
}

/* Its own row, under Settings. A slot we own, because the engine rewrites
   the status node's className whenever the draw state changes. */
.header-right .ps1-status-slot {
  width: 100%; flex: 0 0 100%; order: 99;
  display: flex; justify-content: flex-end; margin-top: 5px;
}


/* Prize transfer, in the ops panel. A list of what has been moved tonight,
   each with the way back. */
.ps1-xfer-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 5px 8px; margin-top: 4px; border-radius: 7px;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.07);
  font-size: 11px; line-height: 1.35;
}
.ps1-xfer-item button { flex: 0 0 auto; font-size: 10px; padding: 2px 7px; }
.ps1-xfer-msg { color: #E8C879; }


/* The transfer and release pickers are full-width: a dist id plus a firm and
   an account name does not fit a shared row at panel width. */
#ps1-xfer-from, #ps1-xfer-prize, #ps1-rel-streamer { width: 100%; }
#ps1-xfer-to { flex: 1 1 auto; min-width: 0; }
#ps1-rel-prize { flex: 1 1 auto; min-width: 0; }


/* ======================================================================
   CURRENT GIVEAWAY, on stream: firm over account.

   Sizes are relative so they ride the overlay's own clamp -- the parent is
   clamp(33.6px, 4.56vw, 57.6px), so the account lands at ~30px when the
   firm is at its full 57.6px, the same ratio the winner display uses. The
   gold is the board's gold, so the dock and the overlay agree.
   ====================================================================== */
.capture-giveaway .ps1-cap-firm {
  display: block; font-weight: 900; letter-spacing: -0.02em;
  line-height: 1.05; text-wrap: balance;
}
.capture-giveaway .ps1-cap-acct {
  display: block; font-size: 0.52em; font-weight: 700;
  letter-spacing: 0.01em; line-height: 1.2; margin-top: 0.14em;
  color: #E8C879; text-wrap: balance;
}


/* =========================================================================
   Narrow windows.  ps1-cap-lbl-sized
   ========================================================================= */

/* Disco Mode is pinned to the centre of the header with position:absolute.
   The engine notes that this "costs no layout height", which is true, and is
   also why nothing in the header can push it aside. Measured on the real
   header at a range of widths:

       1440px and below   it overlaps the entry count / right-hand group
        900px and below   it overlaps the Bootcamp toggle

   Below 1480 it stops being absolute and takes part in the layout like
   everything else. The header is already justify-content:space-between, so
   three items land as brand / Disco / right-hand group -- the same reading
   order, and Disco still sits in the middle. Wrapping is allowed so that at
   genuinely small widths the header grows a second line instead of stacking
   controls on top of each other.

   This leaves the engine's own HTML untouched: the panel's stylesheet is
   injected after it, so an equally specific rule here wins on order alone. */
@media (max-width: 1480px) {
  .app-header {
    flex-wrap: wrap;
    row-gap: 8px;
    column-gap: 12px;
  }
  .app-header .disco-btn {
    position: static;
    transform: none;
    order: 1;
  }
  .app-header .brand        { order: 0; }
  .app-header .header-right { order: 2; }
}

/* Below about 1300 the three groups genuinely do not fit on one line -- the
   right-hand group alone is ~670px wide -- so the header takes a second row.
   Left to space-between that put Disco Mode out on its own at the far right
   and dropped the controls to an arbitrary offset below. Instead Disco stays
   with the cluster it belongs to, and the controls keep the right edge they
   have at every other width, so the second row reads as a toolbar rather
   than as something that fell off the first one. */
@media (max-width: 1300px) {
  .app-header .disco-btn { margin-right: auto; }
  .app-header .header-right { flex: 1 1 100%; justify-content: flex-end; }
}

/* Narrower still and the brand block alone fills the line, so the toggles and
   the controls get one of their own rather than being squeezed. */
@media (max-width: 820px) {
  .app-header .brand { flex: 1 1 100%; }
}

/* "CURRENT GIVEAWAY" rendered at 48px -- measured on screen, and all but the
   size of the firm name under it. A label should not compete with the thing
   it labels, so it is sized like one: small, tracked, quiet, sitting above
   the firm rather than beside it in weight. */
.capture-giveaway .lbl {
  font-size: clamp(11px, 1.05vw, 15px);
  letter-spacing: 0.24em;
  margin-bottom: 10px;
  opacity: 0.68;
}