/* Candle Climber, scoped to #cc-root so theme styles stay out */
#cc-root{
  --bg:#eaf6ff; --panel:#ffffff; --text:#101828; --sub:#5b6b7f;
  --accent:#7c5cff; --accent2:#4cc9ff;
  --btn-bg:#101828; --btn-text:#ffffff;
  --panel-shadow:0 12px 40px rgba(16,24,40,.18);
  --ring:rgba(16,24,40,.12); --inset:rgba(16,24,40,.05);
  position:relative; width:100%; max-width:470px; margin:0 auto;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  color:var(--text); user-select:none; -webkit-user-select:none;
}
#cc-root[data-theme="dark"]{
  --bg:#0f1113; --panel:#17191d; --text:#f2f5fb; --sub:#9aa3ad;
  --btn-bg:#f2f5fb; --btn-text:#101828;
  --panel-shadow:0 12px 40px rgba(0,0,0,.55);
  --ring:#2a2e35; --inset:#1f2228;
}
#cc-root *{margin:0;padding:0;box-sizing:border-box}
#cc-root .cc-stage{position:relative}
#cc-root canvas{
  display:block; width:100%; aspect-ratio:420/704; border-radius:20px;
  box-shadow:var(--panel-shadow); touch-action:none; cursor:pointer;
}
#cc-root .overlay{
  position:absolute; top:0; left:0; right:0; height:0; min-height:100%; display:flex; flex-direction:column;
  align-items:center; text-align:center; gap:14px;
  border-radius:20px; padding:14px; pointer-events:none; overflow-y:auto;
  scrollbar-width:none;
}
#cc-root .overlay::-webkit-scrollbar{display:none}
#cc-root .overlay.hidden{display:none}
#cc-root .card{
  pointer-events:auto; background:var(--panel); border:1px solid var(--ring);
  border-radius:20px; padding:16px 20px; box-shadow:var(--panel-shadow);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  width:100%; max-width:340px; margin:auto;
}
#cc-root .wm-text{text-align:center; line-height:1.1}
#cc-root .wm-title{display:block; font-size:12px; letter-spacing:6px; color:var(--sub); font-weight:700}
#cc-root .wm-text b{font-size:27px; letter-spacing:1.5px; font-weight:800; display:block}
#cc-root .tagline{color:var(--sub); font-size:14px; line-height:1.45; text-wrap:balance}
#cc-root .tagline b{color:var(--text)}
#cc-root .bigscore{font-size:30px; font-weight:800; line-height:1; white-space:nowrap}
#cc-root .score-row{display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap}
#cc-root .score-side{display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left; white-space:nowrap}
#cc-root #cc-over .card{max-width:420px}
#cc-root #cc-overHead{font-size:22px; font-weight:800; letter-spacing:1.4px; color:#e11d2e}
#cc-root[data-theme="dark"] #cc-overHead{color:#ff5470}
#cc-root .medal{font-size:13.5px; color:var(--sub)}
#cc-root button{font:inherit; line-height:1.2}
#cc-root button.play{
  pointer-events:auto; border:0; border-radius:999px; padding:12px 32px;
  font-size:16px; font-weight:700; color:#ffffff;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  cursor:pointer; box-shadow:0 6px 22px rgba(124,92,255,.45); transition:transform .08s;
}
#cc-root button.play:active{transform:scale(.95)}
#cc-root button.mini{
  border:1px solid var(--ring); border-radius:999px; padding:8px 16px;
  font-size:13px; font-weight:700; background:var(--inset); color:var(--text);
  cursor:pointer;
}
#cc-root button.mini.mode-active{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#ffffff; border-color:transparent;
  box-shadow:0 4px 14px rgba(124,92,255,.4);
}
#cc-root button:disabled{opacity:.5; cursor:default}
#cc-root .hint{font-size:12px; color:var(--sub); text-wrap:balance}
#cc-root .subrow{display:flex; gap:8px; width:100%}
#cc-root .subrow input{
  flex:1; min-width:0; background:var(--inset); border:1px solid var(--ring);
  color:var(--text); border-radius:10px; padding:9px 12px; font-size:14px;
}
#cc-root .lb{width:100%; max-height:181px; overflow-y:auto; display:flex; flex-direction:column; gap:4px; scrollbar-width:none}
#cc-root .lb::-webkit-scrollbar{display:none}
#cc-root .lb.hidden{display:none}
#cc-root .lb-row{
  display:flex; align-items:center; gap:8px; font-size:13px;
  padding:6px 10px; border-radius:8px; background:var(--inset);
}
#cc-root .lb-row.me{outline:2px solid var(--text)}
#cc-root .lb-rank{color:var(--sub) !important; width:20px; flex:none; font-weight:600}
#cc-root .lb-name{flex:1; text-align:left; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text) !important}
#cc-root .lb-orbs{color:var(--sub) !important; font-size:12px}
#cc-root .lb-score{font-weight:700; color:var(--text) !important}
#cc-root .bigscore, #cc-root .pu-text, #cc-root .tagline b{color:var(--text) !important}
#cc-root .medal, #cc-root .tagline, #cc-root .hint{color:var(--sub) !important}
#cc-root .pu-box{width:100%; background:rgba(4,92,180,.07); border:1px solid #045cb4; border-radius:12px; padding:10px 12px; text-align:left}
#cc-root .pu-title{font-size:15px; font-weight:800; letter-spacing:.2px; color:#045cb4; text-transform:none; margin-bottom:6px}
#cc-root .pu-steps{list-style:none !important; margin:0 0 10px 0 !important; padding:0 !important; counter-reset:pustep; display:flex; flex-direction:column; gap:6px}
#cc-root .pu-steps li{counter-increment:pustep; position:relative; padding:0 0 0 24px; margin:0 !important; text-align:left; font-size:13px; line-height:1.35; color:var(--text) !important; list-style:none !important}
#cc-root .pu-steps li::marker{content:''}
#cc-root .pu-steps li::before{content:counter(pustep); position:absolute; left:0; top:0; width:17px; height:17px; border-radius:50%; background:#045cb4; color:#ffffff; font-size:10px; font-weight:800; line-height:17px; text-align:center}
#cc-root .pu-steps b{font-family:'Courier New',monospace; font-weight:700; letter-spacing:.5px; background:rgba(4,92,180,.14); border-radius:4px; padding:1px 5px}
#cc-root .pu-btn{display:inline-block; background:#045cb4; color:#ffffff; font-weight:700; font-size:13px; border-radius:8px; padding:8px 14px; text-decoration:none}
#cc-root .pu-btn:hover{background:#034a92; color:#ffffff}
#cc-root .pu-link{font-size:12px; font-weight:700; color:#045cb4; text-decoration:none}
#cc-root .pu-link:hover{text-decoration:underline}
#cc-root[data-theme="dark"] .pu-box{background:rgba(110,168,255,.08); border-color:#3b6fb0}
#cc-root[data-theme="dark"] .pu-title{color:#6ea8ff}
#cc-root[data-theme="dark"] .pu-steps li::before{background:#6ea8ff; color:#08111f}
#cc-root[data-theme="dark"] .pu-steps b{background:rgba(110,168,255,.16)}
#cc-root[data-theme="dark"] .pu-link{color:#6ea8ff}
/* brand lives INSIDE the chart: logo top left, JMU chip top right */
#cc-root .papf-brand{
  position:absolute; top:8px; left:10px; right:10px; z-index:5;
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
  margin:0; text-decoration:none; pointer-events:none;
}
#cc-root .papf-brand a{pointer-events:auto}
#cc-root .papf-brand img{width:100%; max-width:340px; height:auto; display:block; margin-top:8px}
#cc-root .papf-logo-link{display:block;text-decoration:none; flex:0 1 56%; min-width:0}
#cc-root .papf-chip{
  display:flex; align-items:center; gap:9px; text-decoration:none;
  background:#ffffff; border:1px solid rgba(16,24,40,.14); border-radius:14px;
  padding:9px 13px 9px 10px; box-shadow:0 6px 18px rgba(16,24,40,.18);
  max-width:48%; flex:0 0 auto; min-width:225px; text-align:left; transition:transform .12s, box-shadow .12s;
}
#cc-root .papf-chip:hover{transform:translateY(-1px); box-shadow:0 9px 22px rgba(4,92,180,.28); border-color:#045cb4}
#cc-root .chip-code{
  flex:none; font-size:15px; font-weight:900; letter-spacing:1.5px;
  color:#ffffff; background:linear-gradient(135deg,#045cb4,#0b7ad1);
  border-radius:9px; padding:6px 9px; line-height:1;
  box-shadow:0 3px 8px rgba(4,92,180,.35);
}
#cc-root .chip-copy{font-size:11px; line-height:1.35; font-weight:600; color:#5b6b7f}
#cc-root .chip-copy b{display:block; font-size:12px; font-weight:800; color:#101828; letter-spacing:.2px; margin-bottom:1px}
#cc-root[data-theme="dark"] .papf-chip{background:#17191d; border-color:#2a2e35; box-shadow:0 6px 18px rgba(0,0,0,.5)}
#cc-root[data-theme="dark"] .chip-copy{color:#9aa3ad}
#cc-root[data-theme="dark"] .chip-copy b{color:#f2f5fb}
#cc-root[data-theme="dark"] .chip-code{background:linear-gradient(135deg,#0b6fd0,#3f9bea)}
@media(max-width:560px){
  #cc-root .papf-logo-link{flex:0 1 46%}
  #cc-root .papf-brand img{margin-top:4px}
  #cc-root .papf-chip{padding:5px 8px 5px 6px; max-width:54%; min-width:0; gap:6px}
  #cc-root .chip-code{font-size:12px; padding:5px 7px}
  #cc-root .chip-copy{font-size:9.5px; line-height:1.3}
  #cc-root .chip-copy b{font-size:10.5px}
  #cc-root .card{padding:12px 11px; gap:6px}
  #cc-root .wm-text b{font-size:21px; letter-spacing:1px; white-space:nowrap}
  #cc-root .wm-title{font-size:10px; letter-spacing:4px}
  #cc-root #cc-overHead{font-size:18px; white-space:nowrap}
  #cc-root .tagline{font-size:12px}
  #cc-root .bigscore{font-size:24px}
  #cc-root .medal{font-size:12px}
  #cc-root .lb{max-height:156px}
  #cc-root .lb-row{font-size:12px; padding:4px 8px}
  #cc-root .pu-box{padding:10px 11px}
  #cc-root .pu-box .pu-title{font-size:14px}
  #cc-root .pu-steps{gap:5px; margin-bottom:9px !important}
  #cc-root .pu-steps li{font-size:12.5px; padding-left:22px; line-height:1.3}
  #cc-root .pu-steps li::before{width:16px; height:16px; line-height:16px; font-size:9.5px}
  #cc-root .pu-btn{display:block; width:100%; text-align:center; padding:9px 10px}
  #cc-root #cc-quip{display:none}
  #cc-root .hint{font-size:11px}
  #cc-root button.play{padding:10px 26px; font-size:15px}
  #cc-root button.mini{padding:6px 12px; font-size:12px}
  #cc-root .subrow input{padding:7px 10px; font-size:13px}
}
/* controls sit bottom LEFT so they never cover the price axis */
#cc-root #cc-fsBtn{
  position:absolute; bottom:10px; left:10px; z-index:5; pointer-events:auto;
  width:38px; height:38px; border-radius:50%; border:1px solid var(--ring);
  background:var(--panel); color:var(--text); font-size:17px; cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.2); line-height:1; padding:0; opacity:.85;
}
#cc-root #cc-themeBtn{
  position:absolute; bottom:10px; left:56px; z-index:5; pointer-events:auto;
  width:38px; height:38px; border-radius:50%; border:1px solid var(--ring);
  background:var(--panel); color:var(--text); font-size:17px; cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.2); line-height:1; padding:0; opacity:.85;
}
#cc-root #cc-themeBtn:hover, #cc-root #cc-fsBtn:hover{opacity:1}
#cc-root.cc-fs{position:fixed; inset:0; width:100%; height:100%; max-width:none; margin:0; z-index:99999; background:#0f1113; display:flex; align-items:center; justify-content:center}
#cc-root.cc-fs canvas{width:auto; height:100%; max-width:100%; border-radius:0; box-shadow:none; margin:0 auto}
#cc-root:fullscreen{max-width:none; background:#0f1113}
#cc-root:fullscreen canvas{width:auto; height:100%; max-width:100%; margin:0 auto; border-radius:0}
body.cc-noscroll{overflow:hidden}

#cc-root .subrow.skins{justify-content:center; gap:6px}
#cc-root .subrow.skins .mini{flex:1; padding:7px 6px; font-size:12px}
@media(max-width:560px){ #cc-root .subrow.skins .mini{padding:6px 4px; font-size:11px} }

#cc-root .lbcard{max-width:360px; gap:10px}
#cc-root .lbtitle{font-size:13px; font-weight:800; letter-spacing:1.6px; text-transform:uppercase; color:var(--text)}
#cc-root .lb.lbfull{max-height:340px}
#cc-root .lbmine{width:100%}
#cc-root .lbmine.hidden{display:none}
#cc-root .lb-gap{font-size:10px; font-weight:800; letter-spacing:2px; text-transform:uppercase; color:var(--sub); margin:8px 0 4px; text-align:left}
#cc-root #cc-lbNote{font-size:11.5px}
#cc-root #cc-lbLink{color:#045cb4; font-weight:700; text-decoration:underline; cursor:pointer}
#cc-root[data-theme="dark"] #cc-lbLink{color:#6ea8ff}
@media(max-width:560px){
  #cc-root .lb.lbfull{max-height:250px}
  #cc-root .lbtitle{font-size:12px}
}

#cc-root .namewrap a{color:var(--sub); text-decoration:underline; font-weight:600; cursor:pointer; margin-left:4px}
#cc-root .namewrap a:hover{color:var(--text)}
#cc-root .namewrap.hidden{display:none}
#cc-root .nameform{display:flex; gap:6px; align-items:center; justify-content:center; width:100%; flex-wrap:wrap}
#cc-root .nameform.hidden{display:none}
#cc-root #cc-nameInput{flex:1; min-width:120px; max-width:190px; padding:7px 10px; border-radius:8px; border:1px solid var(--ring); background:var(--panel); color:var(--text); font:inherit; font-size:13px}
#cc-root #cc-nameInput:focus{outline:2px solid #045cb4; outline-offset:1px}

#cc-root #cc-updBar{position:absolute; left:50%; transform:translateX(-50%); top:78px; z-index:9; pointer-events:auto;
  display:flex; align-items:center; gap:10px; max-width:92%;
  background:#045cb4; color:#fff; font-size:12.5px; font-weight:600; line-height:1.3;
  padding:8px 12px; border-radius:10px; box-shadow:0 6px 18px rgba(0,0,0,.28)}
#cc-root #cc-updBar button{background:#fff; color:#045cb4; border:0; border-radius:7px; cursor:pointer;
  font:inherit; font-weight:800; padding:6px 11px; white-space:nowrap}
#cc-root #cc-updBar button:hover{background:#eaf2fb}
@media(max-width:560px){
  #cc-root #cc-updBar{font-size:11.5px; padding:7px 10px; gap:8px; top:72px}
  #cc-root #cc-updBar button{padding:5px 9px}
}
/* development-page badge: shown only when an admin forces a non-live edition */
#cc-root #cc-devTag{position:absolute; left:10px; top:10px; z-index:9; pointer-events:none;
  background:#b3006b; color:#fff; font-size:11.5px; font-weight:700; letter-spacing:.02em;
  padding:5px 9px; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.25)}
#cc-root #cc-seedWait{position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); z-index:8; pointer-events:none;
  background:rgba(4,92,180,.92); color:#fff; font-size:13px; font-weight:700; padding:8px 14px; border-radius:10px}
