/* Wheel prize board (js/wheelboard.js). Replaces the plain odds list when present. */
#wheelNote .wfree,#wheelNote .wodds{display:none}
.wboard{position:relative;margin:14px 0 4px;padding:16px 16px 12px;text-align:left;background:linear-gradient(180deg,#22231b,#181912);border:1.5px solid #c9a227;box-shadow:inset 0 0 0 3px #1a1b15,inset 0 0 0 4px rgba(201,162,39,.45),0 6px 18px rgba(0,0,0,.45)}
/* marquee bulbs around the edge, same dots as the wheel rim */
.wboard::before{content:"";position:absolute;inset:4px;pointer-events:none;
  background:radial-gradient(circle,#fafafa 1.6px,transparent 2.2px) 0 0/14px 8px repeat-x,radial-gradient(circle,#fafafa 1.6px,transparent 2.2px) 0 100%/14px 8px repeat-x,
    radial-gradient(circle,#fafafa 1.6px,transparent 2.2px) 0 0/8px 14px repeat-y,radial-gradient(circle,#fafafa 1.6px,transparent 2.2px) 100% 0/8px 14px repeat-y;opacity:.85}
.wb-head{padding:6px 0 10px;text-align:center}
.wb-title{display:block;font-family:var(--font-display);font-weight:400;font-size:30px;line-height:1;letter-spacing:1px;color:#ffb300;text-shadow:0 0 14px rgba(255,179,0,.45),0 2px 0 #7a5200}
.wb-sub{display:block;margin-top:6px;font-family:var(--font-ui);font-size:15px;font-weight:700;color:#fafafa}
.wb-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.wb-row{position:relative;display:grid;grid-template-columns:12px minmax(0,auto) 1fr auto;align-items:center;gap:10px;padding:9px 12px 9px 0;background:#2a2b23;border:1px solid #3a3b32;overflow:visible;white-space:nowrap}
.wb-chip{display:block;width:12px;align-self:stretch;margin:-9px 0}
.wb-name{display:flex;align-items:baseline;gap:8px;font-family:var(--font-ui);font-size:17px;font-weight:700;color:#fafafa}
.wb-name em{font-style:normal;font-family:var(--font-display);font-size:11px;letter-spacing:.8px;color:#1a1b15;background:#ffb300;padding:2px 6px}
.wb-bar{height:8px;background:#1a1b15;border:1px solid #3a3b32;min-width:24px}
.wb-bar u{display:block;height:100%;background:#8a8c7a;text-decoration:none}
.wb-pct{min-width:44px;text-align:center;font-family:var(--font-ui);font-size:15px;font-weight:700;color:#fafafa;background:#1a1b15;border:1px solid #4a4c3f;border-radius:999px;padding:2px 9px;font-variant-numeric:tabular-nums}
.wb-row.gold{background:linear-gradient(90deg,#3b2f10,#2a2b23 70%);border-color:#c9a227;box-shadow:0 0 14px rgba(255,179,0,.28)}
.wb-row.gold .wb-name{color:#ffd45a}
.wb-row.gold .wb-bar u{background:linear-gradient(90deg,#ffb300,#ffe08a)}
.wb-row.gold .wb-pct{color:#ffd45a;border-color:#c9a227}
.wb-row.hit{border-color:#fafafa;background:#34362b;animation:wbpulse .9s ease-out 2}
.wb-row.gold.hit{background:#4a3a12}
.wb-dot{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;pointer-events:none;animation:wbdot 1s ease-out forwards}
@keyframes wbpulse{0%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,91,31,.9)}40%{transform:scale(1.035);box-shadow:0 0 0 8px rgba(255,91,31,0)}100%{transform:scale(1)}}
@keyframes wbdot{0%{transform:translate(0,0);opacity:1}100%{transform:translate(var(--dx),var(--dy));opacity:0}}
@keyframes wbshimmer{0%,100%{box-shadow:0 0 10px rgba(255,179,0,.2)}50%{box-shadow:0 0 20px rgba(255,179,0,.5)}}
@keyframes wbbulb{0%,100%{opacity:.85}50%{opacity:.45}}
@media (prefers-reduced-motion:no-preference){ .wb-row.gold{animation:wbshimmer 2.4s ease-in-out infinite} .wb-row.gold.hit{animation:wbpulse .9s ease-out 2} .wboard::before{animation:wbbulb 1.6s ease-in-out infinite} }
@media (prefers-reduced-motion:reduce){ .wb-row.hit{animation:none;outline:2px solid #fafafa} }
@media (max-width:360px){ .wb-name{font-size:16px} .wb-name em{display:none} .wb-row{gap:8px} }

/* compact wheel screen: fits 375x667 without scrolling; odds sit behind "See the odds" (still shown, just closed) */
#wheelNote .wweighted{display:none}
#wheelV .panel{padding-top:14px;padding-bottom:12px}
#wheelV .panel h2:where(:not(.h1)){margin:0 0 2px}
#wheelV .panel :is(h1,h2:where(.h1)){font-size:22px;margin:0 0 8px}
#wheelV .say{padding:6px 10px;margin:0 0 4px;gap:10px}
#wheelV .say .face{width:28px;height:28px}
#wheelV .say .who{display:none}
#wheelV .say p{margin:0;font-size:14px;line-height:1.3}
#wheelV #wSay{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#wheelV .wheelwrap{width:212px;margin:10px auto 0}
#wheelV #spinBtn{margin-top:8px;padding-top:12px;padding-bottom:12px}
#wheelV #skipBtn{margin-top:6px!important;padding-top:10px;padding-bottom:10px}
#wheelV #wheelNote{margin:6px 0 0;font-size:13px;line-height:1.3}
.wboard{margin:8px 0 0;padding:0;border-width:1px;box-shadow:none}
.wboard::before{display:none}
.wb-det summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:8px 10px;min-height:40px;white-space:nowrap}
.wb-det summary::-webkit-details-marker{display:none}
.wb-title{font-family:var(--font-display);font-size:15px;letter-spacing:.6px;color:#ffb300;text-shadow:none}
.wb-sub{font-family:var(--font-ui);font-size:13px;font-weight:700;color:#fafafa;flex:1;overflow:hidden;text-overflow:ellipsis}
.wb-more{font-family:var(--font-ui);font-size:13px;font-weight:700;color:#ffd45a;text-decoration:underline}
.wb-more::after{content:" \25BE"}
.wb-det[open] .wb-more::after{content:" \25B4"}
.wb-det[open]{padding-bottom:8px}
.wb-det .wb-list{margin:0 8px;gap:4px}
.wb-det .wb-row{padding:6px 10px 6px 0}
.wb-det .wb-chip{margin:-6px 0}
.wb-weighted{display:block;margin:6px 10px 0;font-family:var(--font-ui);font-size:12px;color:#c9c3b2}

/* odds bar redesign (Apollo QA 28): one UI-font element, a button like the others, no gold box */
#wheelV .wboard{margin:8px 0 0;padding:0;border:0;background:none;box-shadow:none}
#wheelV .wboard::before,#wheelV .wboard::after{display:none}
#wheelV .wb-det summary{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:10px 12px;font-family:var(--font-ui);font-size:13px;font-weight:700;letter-spacing:.5px;color:#fafafa;background:transparent;border:1px solid var(--nj-line);border-radius:3px;white-space:nowrap}
#wheelV .wb-title{display:none}
#wheelV .wb-sub{display:none}
#wheelV .wb-more{flex:0 0 auto;font:inherit;color:inherit;text-decoration:none;text-transform:none}
#wheelV .wb-det[open] .wb-sub{display:block;position:absolute;left:-9999px}
#wheelV .wb-det .wb-list{margin:8px 0 0}
#wheelV .wb-det .wb-weighted{display:block;margin-top:6px;font-family:var(--font-ui);font-size:12px;color:#a8a393}
#wheelV .wb-det{padding:0;margin:0;border:0;min-height:0}
#wheelV .wb-det summary{font-family:"JetBrains Mono","SF Mono",Menlo,monospace;font-size:12px;font-weight:400;letter-spacing:1.2px;text-transform:uppercase;color:#a8a393;padding:10px 8px;min-height:0;border-color:#2a2b24}
#wheelV .wb-more{text-transform:inherit}

/* odds row, quiet version (Apollo DM 02:18): one plain line under Skip, label left, odds link right, no box or pill */
#wheelV .wboard{margin:10px 0 0}
#wheelV .wb-det summary{justify-content:space-between;gap:12px;min-height:40px;padding:8px 2px;border:0;border-top:1px solid #2a2b24;border-radius:0;background:none;
  font-family:var(--font-ui);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:#a8a393}
#wheelV .wb-sub,#wheelV .wb-det[open] .wb-sub{display:block;position:static;flex:1 1 auto;min-width:0;text-align:left;font:inherit;color:inherit;overflow:hidden;text-overflow:ellipsis}
#wheelV .wb-more{flex:0 0 auto;font:inherit;font-weight:700;color:#ffd45a;text-decoration:underline;text-underline-offset:3px;text-transform:none}
#wheelV .wb-more::after{content:" \25BE";text-decoration:none;display:inline-block;margin-left:2px}
#wheelV .wb-det[open] .wb-more::after{content:" \25B4"}
#wheelV .wb-det summary:focus-visible{outline:2px solid #ffd45a;outline-offset:2px}
#wheelV .wb-det .wb-list{margin:4px 0 0}
/* Julian's photo on the wheel keeps its square (Apollo 03:14: it looked squashed): the shared .say .face.julian rule's
   44 px flex-basis was winning over the 28 px width here, so it rendered 40 by 28 */
#wheelV .say .face,#wheelV .say .face.julian{width:64px;height:64px;flex:0 0 64px;aspect-ratio:1/1;object-fit:cover;border-radius:0;border:1px solid var(--panel-edge,#2a2b24)}
/* Apollo 03:19: the photo read as a tiny tile; it is now the size of the character portraits on the reactor sheet (64 px),
   56 px on short screens so the wheel still fits 375x667 */
@media (max-height:700px){ #wheelV .say .face,#wheelV .say .face.julian{width:56px;height:56px;flex-basis:56px} }
#wheelV #wSay{-webkit-line-clamp:3}   /* the bigger photo leaves room for a third line beside it */
