/* NomNomma themed wheel — per-category skins via CSS variables on .stage-wrap */
.stage-wrap{display:flex;gap:14px;margin-top:6px;
  --rim:#FFF3D6; --stage-bg:radial-gradient(120% 120% at 30% 20%, #6a559e 0%, #463372 55%, #2e2150 100%);
  --board-bg:linear-gradient(160deg,#3d2c63,#5B4A8A); --board-fg:#fff; --board-sub:#cfc4ee; --board-accent:var(--gold);
  --tile-bg:#fff; --tile-fg:var(--ink); --tile-sub:var(--soft); --tile-accent:var(--coral);
  --spin-bg:var(--coral); --spin-shadow:var(--coral-d); --bulb:#F2B33D; --stage-border:var(--gold)}
/* baby: soft pastels */
.stage-wrap.theme-baby{
  --rim:#FFFDF9; --stage-bg:linear-gradient(150deg,#FDE8F1 0%,#E3F0FD 55%,#FFF6E3 100%);
  --board-bg:linear-gradient(160deg,#FBD3E4,#F7A8C4); --board-fg:#6d3550; --board-sub:#96587a; --board-accent:#fff;
  --tile-accent:#7FB3E0; --spin-bg:#F27CA7; --spin-shadow:#cf5d8a; --bulb:#F7A8C4; --stage-border:#F7A8C4}
/* dinner: retro diner */
.stage-wrap.theme-dinner{
  --rim:#FFF6E8; --stage-bg:radial-gradient(120% 120% at 30% 20%, #7a1f1f 0%, #5c1414 60%, #3d0d0d 100%);
  --board-bg:linear-gradient(160deg,#8c2323,#6d1717); --board-sub:#f0c9c9; --board-accent:#F2B33D;
  --tile-accent:#1F9E8E; --spin-bg:#D94836; --spin-shadow:#9e2f21; --bulb:#F2B33D; --stage-border:#F2B33D}
/* puppy: warm & playful */
.stage-wrap.theme-puppy{
  --rim:#FFFBF2; --stage-bg:linear-gradient(150deg,#FFE9C9 0%,#FFD9A8 55%,#FFC98a 100%);
  --board-bg:linear-gradient(160deg,#8a5a2b,#6f451e); --board-sub:#f3ddba; --board-accent:#FFD9A8;
  --tile-accent:#F4604E; --spin-bg:#F2762E; --spin-shadow:#c2541c; --bulb:#F2762E; --stage-border:#F2762E}
/* gamer: dark neon */
.stage-wrap.theme-gamer{
  --rim:#0B0E1A; --stage-bg:radial-gradient(120% 120% at 30% 15%, #1b2450 0%, #101736 55%, #070a1c 100%);
  --board-bg:linear-gradient(160deg,#0d1330,#131c42); --board-sub:#8fa3e8; --board-accent:#22D3EE;
  --tile-bg:#141b3d; --tile-fg:#E6F6FF; --tile-sub:#8fa3e8; --tile-accent:#E879F9;
  --spin-bg:#A855F7; --spin-shadow:#7c3aed; --bulb:#22D3EE; --stage-border:#22D3EE}
/* business: sleek navy & gold */
.stage-wrap.theme-biz{
  --rim:#F5EFE2; --stage-bg:linear-gradient(150deg,#22344d 0%,#16233a 60%,#0e1728 100%);
  --board-bg:linear-gradient(160deg,#1b2a44,#101a2e); --board-sub:#a9b8d0; --board-accent:#C9A227;
  --tile-accent:#C9A227; --spin-bg:#C9A227; --spin-shadow:#93761a; --bulb:#C9A227; --stage-border:#C9A227}

.board{flex:0 0 31%;background:var(--board-bg);border:3px solid var(--board-accent);border-radius:16px;padding:12px;color:var(--board-fg);min-height:300px}
.board h3{margin:0 0 4px;font-size:15px;letter-spacing:2px;text-transform:uppercase;color:var(--board-accent);text-align:center}
.board .bsub{text-align:center;font-size:12px;color:var(--board-sub);margin:0 0 10px}
.board .btile{background:var(--tile-bg);color:var(--tile-fg);border-radius:10px;padding:7px 10px;margin:7px 0;border-left:6px solid var(--tile-accent)}
.board .btile .bn{font-weight:800;font-family:'Trebuchet MS',sans-serif;font-size:16px}
.board .btile .bm{font-size:11.5px;color:var(--tile-sub)}
.board .bempty{color:var(--board-sub);text-align:center;font-size:13.5px;padding:16px 6px}
.stage{position:relative;flex:1;overflow:hidden;border-radius:16px;min-height:430px;background:var(--stage-bg);border:3px solid var(--stage-border)}
.bulbs{position:absolute;left:0;right:0;height:16px;z-index:3;pointer-events:none;
  background-image:radial-gradient(circle,#fff8 3.2px,var(--bulb) 4.2px,transparent 5px);background-size:26px 16px;background-repeat:repeat-x;
  animation:bulbglow 1.6s infinite}
.bulbs.top{top:3px}.bulbs.bot{bottom:3px}
@keyframes bulbglow{0%,100%{opacity:1}50%{opacity:.55}}
.wheelbox{position:absolute;top:50%;right:-52%;width:118%;aspect-ratio:1;transform:translateY(-50%)}
.wheelrot{width:100%;height:100%;will-change:transform}
.wheelrot svg{width:100%;height:100%;display:block;filter:drop-shadow(0 10px 24px rgba(0,0,0,.45))}
.selectorpin{position:absolute;left:-8px;top:50%;transform:translateY(-50%);z-index:4;font-size:36px;color:var(--bulb);
  text-shadow:0 2px 8px rgba(0,0,0,.65);pointer-events:none}
.wheelbox .hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:21%;aspect-ratio:1;border-radius:50%;z-index:2;
  background:radial-gradient(circle at 35% 30%, #ffe9a8, #F2B33D 60%, #c78f1d);border:4px solid #fff3d6;pointer-events:none;
  display:flex;align-items:center;justify-content:center;font-family:'Trebuchet MS',sans-serif;font-weight:800;
  color:#5c4300;font-size:clamp(10px,2.4vw,17px);text-align:center;line-height:1.05;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.spinbtn{position:absolute;left:14px;bottom:16px;z-index:5;background:var(--spin-bg);color:#fff;border:none;
  font-family:'Trebuchet MS',sans-serif;font-size:21px;font-weight:800;padding:13px 30px;border-radius:999px;cursor:pointer;
  box-shadow:0 5px 0 var(--spin-shadow),0 10px 22px rgba(0,0,0,.35)}
.spinbtn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--spin-shadow)}
.spinbtn:disabled{opacity:.6;cursor:wait}
.spotlight{position:absolute;left:50%;bottom:64px;transform:translate(-50%,24px);width:min(92%,430px);z-index:6;
  background:#FFFDF9;border:3px solid var(--gold);border-radius:18px;box-shadow:0 18px 44px rgba(0,0,0,.5);
  padding:16px 18px 14px;text-align:center;opacity:0;pointer-events:none;transition:opacity .35s,transform .35s}
.spotlight.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.spotlight .winner{font-family:'Trebuchet MS',sans-serif;font-size:36px;font-weight:800;letter-spacing:-.5px;color:var(--ink);line-height:1.1}
.spotlight .wmean{color:var(--soft);font-size:15px;margin-top:2px}
.spotlight .wbtns{display:flex;gap:10px;justify-content:center;margin-top:12px;align-items:center}
.wbtn{border:none;border-radius:999px;padding:11px 22px;font-size:16px;font-weight:800;cursor:pointer;font-family:'Trebuchet MS',sans-serif}
.wbtn.hold{background:var(--gold);color:#5c4300;box-shadow:0 3px 0 #c78f1d}
.wbtn.recipe{background:var(--teal,#1F9E8E);color:#fff;box-shadow:0 3px 0 #14685e;text-decoration:none;display:inline-block}
.wbtn.fave{background:#fff;border:3px solid var(--coral);border-radius:50%;width:52px;height:52px;padding:0;font-size:24px;line-height:1;box-shadow:0 3px 0 var(--coral-d)}
.wbtn:active{transform:translateY(2px);box-shadow:none}
.wbtn.done{opacity:.55}
.savedtray{margin-top:14px;background:#FFF3E2;border:2px dashed var(--gold);border-radius:14px;padding:12px 16px;display:none}
.savedtray.show{display:block}
.savedtray h3{margin:0 0 8px;font-size:15px}
.savedtray .fl{display:flex;flex-wrap:wrap;gap:8px}
.savedtray .fi{background:#fff;border:1.5px solid var(--gold);border-radius:999px;padding:4px 12px;font-weight:700;font-size:14px}
.stage .nomatch{position:absolute;left:16px;top:44%;color:#fff;font-size:16px;z-index:5;max-width:55%}
@media (max-width:720px){
  .stage-wrap{flex-direction:column}
  .board{flex:none;min-height:0}
  .stage{min-height:400px}
  .wheelbox{width:150%;right:-78%}
  .spotlight .winner{font-size:30px}
}
.spotx{position:absolute;top:6px;right:10px;background:none;border:none;font-size:22px;line-height:1;color:var(--soft);cursor:pointer;padding:4px}
.hint{position:absolute;left:12px;top:24px;z-index:5;background:rgba(20,16,40,.72);color:#fff;font-size:12.5px;font-weight:700;
  padding:6px 12px;border-radius:999px;pointer-events:none;letter-spacing:.2px}
.wheelchips{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.wheelchips .wclabel{font-size:13.5px;font-weight:700;color:var(--soft);margin-right:2px}
.wchip{background:#fff;border:2px solid var(--line,#eadfce);border-radius:999px;padding:7px 14px;font-size:14.5px;font-weight:700;
  cursor:pointer;font-family:'Trebuchet MS',sans-serif;color:var(--ink)}
.wchip:active{transform:scale(.96)}
.wchip.held{border-color:#FFD94D;background:#FFF7DB}
/* game: epic jewel tones */
.stage-wrap.theme-game{
  --rim:#F5EFE2; --stage-bg:radial-gradient(120% 120% at 30% 20%, #175733 0%, #0e3520 55%, #072416 100%);
  --board-bg:linear-gradient(160deg,#0e3520,#123f27); --board-sub:#a8d5ba; --board-accent:#C9A227;
  --tile-accent:#B03060; --spin-bg:#B03060; --spin-shadow:#7e1f42; --bulb:#C9A227; --stage-border:#C9A227}
/* writers: parchment & ink */
.stage-wrap.theme-writer{
  --rim:#FFFDF4; --stage-bg:linear-gradient(150deg,#F6EAD2 0%,#EFDCB4 55%,#E7CF9E 100%);
  --board-bg:linear-gradient(160deg,#5d4630,#463322); --board-sub:#e3cfa3; --board-accent:#E8DCC3;
  --tile-accent:#7A3049; --spin-bg:#33404F; --spin-shadow:#1e2732; --bulb:#B5651D; --stage-border:#8A6D3B}
/* ai agents: dark circuit teal */
.stage-wrap.theme-ai{
  --rim:#062A2E; --stage-bg:radial-gradient(120% 120% at 30% 15%, #0a3d42 0%, #062a2e 55%, #03181c 100%);
  --board-bg:linear-gradient(160deg,#052226,#083036); --board-sub:#7fd8cf; --board-accent:#2DD4BF;
  --tile-bg:#0a2e33; --tile-fg:#E6FFFB; --tile-sub:#7fd8cf; --tile-accent:#2DD4BF;
  --spin-bg:#14B8A6; --spin-shadow:#0b6e64; --bulb:#2DD4BF; --stage-border:#2DD4BF}
/* prize wheel: carnival gold & red */
.stage-wrap.theme-prize{
  --rim:#FFF6E8; --stage-bg:radial-gradient(120% 120% at 30% 20%, #8c2323 0%, #671414 55%, #420b0b 100%);
  --board-bg:linear-gradient(160deg,#7a1a1a,#571010); --board-sub:#f3cf9f; --board-accent:#FFD94D;
  --tile-accent:#FFD94D; --spin-bg:#E63946; --spin-shadow:#a11f2c; --bulb:#FFD94D; --stage-border:#FFD94D}
.entrybox{background:#FFFDF9;border:2px solid var(--line,#eadfce);border-radius:14px;padding:14px 16px;margin-top:14px}
.entrybox h3{margin:0 0 6px;font-size:16px}
.entrybox p{margin:0 0 8px;font-size:14px;color:var(--soft)}
.entrybox textarea{width:100%;min-height:120px;border:2px solid var(--line,#eadfce);border-radius:10px;padding:10px 12px;
  font-family:'Trebuchet MS',sans-serif;font-size:15px;resize:vertical;box-sizing:border-box}
.entryrow{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;align-items:center}
.loadbtn{background:var(--teal,#1F9E8E);color:#fff;border:none;border-radius:999px;padding:11px 22px;font-size:15.5px;
  font-weight:800;cursor:pointer;font-family:'Trebuchet MS',sans-serif;box-shadow:0 3px 0 #14685e}
.clearbtn{background:#fff;color:var(--ink);border:2px solid var(--line,#eadfce);border-radius:999px;padding:9px 18px;
  font-size:14.5px;font-weight:700;cursor:pointer;font-family:'Trebuchet MS',sans-serif}
.entrymsg{font-size:13.5px;color:var(--soft)}
.shareline{margin-top:10px;font-size:13.5px;color:var(--soft);text-align:center}
.stage .tiebreak{font-family:'Trebuchet MS',sans-serif;font-weight:800;font-size:19px;color:var(--coral-d,#d63c2c);letter-spacing:.4px}
.wbtn.save2{background:#fff;border:2.5px solid var(--gold);color:#5c4300}
#confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:7}
.addrow{display:flex;gap:10px}
.addrow input{flex:1;border:2px solid var(--line,#eadfce);border-radius:999px;padding:13px 18px;font-size:16px;
  font-family:'Trebuchet MS',sans-serif;min-width:0;box-sizing:border-box}
.addrow .loadbtn{flex:0 0 auto;padding:13px 26px;font-size:16px}
.entrylist{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.entrychip{background:#FFF3E2;border:2px solid var(--gold);border-radius:999px;padding:6px 8px 6px 14px;font-weight:700;
  font-size:14.5px;display:inline-flex;align-items:center;gap:6px}
.chipx{background:var(--coral);color:#fff;border:none;border-radius:50%;width:22px;height:22px;font-size:14px;line-height:1;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.noentries{color:var(--soft);font-size:14px}
/* baby facet stage identities */
.stage-wrap.t-girl{--rim:#FCE4EC; --stage-bg:radial-gradient(120% 120% at 30% 20%, #FCE4EC 0%, #F8BBD0 55%, #F48FB1 100%);
  --board-bg:linear-gradient(160deg,#AD1457,#880E4F); --board-sub:#F8BBD0; --board-accent:#FFD1DC;
  --tile-accent:#F48FB1; --spin-bg:#EC407A; --spin-shadow:#AD1457; --bulb:#EC407A; --stage-border:#F48FB1}
.stage-wrap.t-boy{--rim:#E3F2FD; --stage-bg:radial-gradient(120% 120% at 30% 20%, #E3F2FD 0%, #90CAF9 55%, #64B5F6 100%);
  --board-bg:linear-gradient(160deg,#1565C0,#0D47A1); --board-sub:#BBDEFB; --board-accent:#90CAF9;
  --tile-accent:#64B5F6; --spin-bg:#1E88E5; --spin-shadow:#0D47A1; --bulb:#1E88E5; --stage-border:#64B5F6}
.stage-wrap.t-unisex{--rim:#E8F5E9; --stage-bg:radial-gradient(120% 120% at 30% 20%, #E8F5E9 0%, #A5D6A7 55%, #81C784 100%);
  --board-bg:linear-gradient(160deg,#2E7D32,#1B5E20); --board-sub:#C8E6C9; --board-accent:#A5D6A7;
  --tile-accent:#81C784; --spin-bg:#43A047; --spin-shadow:#1B5E20; --bulb:#43A047; --stage-border:#81C784}
.stage-wrap.t-twins{--rim:#F3E5F5; --stage-bg:radial-gradient(120% 120% at 30% 20%, #F3E5F5 0%, #CE93D8 55%, #B39DDB 100%);
  --board-bg:linear-gradient(160deg,#6A1B9A,#4A148C); --board-sub:#E1BEE7; --board-accent:#CE93D8;
  --tile-accent:#B39DDB; --spin-bg:#8E24AA; --spin-shadow:#4A148C; --bulb:#8E24AA; --stage-border:#B39DDB}
