/* Lucid Labs game, scoped to #ll-root so theme styles stay out */
#ll-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:640px; 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;
}
#ll-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;
}
#ll-root *{margin:0;padding:0;box-sizing:border-box}
#ll-root canvas{
  display:block; width:100%; aspect-ratio:420/640; border-radius:20px;
  box-shadow:var(--panel-shadow); touch-action:manipulation; cursor:pointer;
}
#ll-root .overlay{
  position:absolute; inset:0; 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;
}
#ll-root .overlay::-webkit-scrollbar{display:none}
#ll-root .overlay.hidden{display:none}
#ll-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:330px; margin:auto;
}
#ll-root .badge{
  font-size:10px; font-weight:700; letter-spacing:2px; color:var(--sub);
  border:1px solid var(--ring); border-radius:999px; padding:5px 12px;
  text-transform:uppercase;
}
#ll-root .logo-img{width:100%; max-width:250px; height:auto; display:block}
#ll-root .contest-box{width:100%; background:rgba(245,158,11,.08); border:1px solid #d97706; border-radius:12px; padding:9px 12px; text-align:left}
#ll-root .contest-title{font-size:11px; font-weight:800; letter-spacing:1.5px; color:#d97706; text-transform:uppercase; margin-bottom:4px}
#ll-root .contest-text{font-size:12.5px; line-height:1.4; color:var(--text); text-wrap:pretty}
#ll-root .contest-elig{font-size:12px; margin-top:4px; color:var(--sub)}
#ll-root .contest-elig.ok{color:#059669; font-weight:700}
#ll-root .contest-elig a{color:#045cb4; font-weight:700}
#ll-root[data-theme="dark"] .contest-elig.ok{color:#00e07f}
#ll-root[data-theme="dark"] .contest-elig a{color:#6ea8ff}
#ll-root .wm-text{text-align:left; line-height:1.05}
#ll-root .wm-text b{font-size:26px; letter-spacing:2px; font-weight:800}
#ll-root .wm-text span{display:block; font-size:13px; letter-spacing:7px; color:var(--sub); font-weight:600}
#ll-root .tagline{color:var(--sub); font-size:14px; line-height:1.45; text-wrap:balance}
#ll-root .tagline b{color:var(--text)}
#ll-root .bigscore{font-size:34px; font-weight:800; line-height:1}
#ll-root .score-row{display:flex; align-items:center; justify-content:center; gap:14px}
#ll-root .score-side{display:flex; flex-direction:row; align-items:baseline; gap:7px; text-align:left; white-space:nowrap}
#ll-root #ll-over .card{max-width:420px}
#ll-root .medal{font-size:14px; color:var(--sub)}
#ll-root button{font:inherit; line-height:1.2}
#ll-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;
}
#ll-root button.play:active{transform:scale(.95)}
#ll-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;
}
#ll-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);
}
#ll-root button:disabled{opacity:.5; cursor:default}
#ll-root .hint{font-size:12px; color:var(--sub); text-wrap:balance}
#ll-root .subrow{display:flex; gap:8px; width:100%}
#ll-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;
}
#ll-root .lb{width:100%; max-height:181px; overflow-y:auto; display:flex; flex-direction:column; gap:4px; scrollbar-width:none}
#ll-root .lb::-webkit-scrollbar{display:none}
#ll-root .lb.hidden{display:none}
#ll-root .lb-row{
  display:flex; align-items:center; gap:8px; font-size:13px;
  padding:6px 10px; border-radius:8px; background:var(--inset);
}
#ll-root .lb-row.me{outline:2px solid var(--text)}
#ll-root .lb-rank{color:var(--sub) !important; width:20px; flex:none; font-weight:600}
#ll-root .lb-name{flex:1; text-align:left; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text) !important}
#ll-root .lb-orbs{color:var(--sub) !important; font-size:12px}
#ll-root .lb-score{font-weight:700; color:var(--text) !important}
#ll-root .bigscore, #ll-root .pu-text, #ll-root .tagline b{color:var(--text) !important}
#ll-root .medal, #ll-root .tagline, #ll-root .hint{color:var(--sub) !important}
#ll-root .pu-box{width:100%; background:rgba(4,92,180,.07); border:1px solid #045cb4; border-radius:12px; padding:10px 12px; text-align:left}
#ll-root .pu-title{font-size:15px; font-weight:800; letter-spacing:.2px; color:#045cb4; text-transform:none; margin-bottom:6px}
#ll-root .pu-text{font-size:13px; line-height:1.45; color:var(--text); margin-bottom:8px; text-wrap:pretty}
#ll-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}
#ll-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}
#ll-root .pu-steps li::marker{content:''}
#ll-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}
#ll-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}
#ll-root .pu-text b{font-family:'Courier New',monospace; font-weight:700; letter-spacing:.5px; background:rgba(4,92,180,.12); border-radius:4px; padding:1px 5px}
#ll-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}
#ll-root .pu-btn:hover{background:#034a92; color:#ffffff}
#ll-root .pu-link{font-size:12px; font-weight:700; color:#045cb4; text-decoration:none}
#ll-root .pu-link:hover{text-decoration:underline}
#ll-root[data-theme="dark"] .pu-box{background:rgba(110,168,255,.08); border-color:#3b6fb0}
#ll-root[data-theme="dark"] .pu-title{color:#6ea8ff}
#ll-root[data-theme="dark"] .pu-steps li::before{background:#6ea8ff; color:#08111f}
#ll-root[data-theme="dark"] .pu-steps b{background:rgba(110,168,255,.16)}
#ll-root[data-theme="dark"] .pu-link{color:#6ea8ff}
#ll-root .papf-brand{
  position:absolute; top:10px; right:10px; z-index:5; pointer-events:auto;
  display:flex; flex-direction:column; align-items:flex-end; gap:4px;
  text-decoration:none; text-align:right;
}
#ll-root .papf-brand img{width:100%; max-width:262px; height:auto; display:block}
#ll-root .papf-logo-link{display:block;text-decoration:none}
#ll-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:8px 12px 8px 9px; box-shadow:0 6px 18px rgba(16,24,40,.18);
  max-width:262px; text-align:left; transition:transform .12s, box-shadow .12s;
}
#ll-root .papf-chip:hover{transform:translateY(-1px); box-shadow:0 9px 22px rgba(4,92,180,.28); border-color:#045cb4}
#ll-root .chip-code{
  flex:none; font-size:17px; font-weight:900; letter-spacing:1.5px;
  color:#ffffff; background:linear-gradient(135deg,#045cb4,#0b7ad1);
  border-radius:9px; padding:6px 10px; line-height:1;
  box-shadow:0 3px 8px rgba(4,92,180,.35);
}
#ll-root .chip-copy{font-size:11.5px; line-height:1.35; font-weight:600; color:#5b6b7f}
#ll-root .chip-copy b{display:block; font-size:12.5px; font-weight:800; color:#101828; letter-spacing:.2px; margin-bottom:1px}
#ll-root[data-theme="dark"] .papf-chip{background:#17191d; border-color:#2a2e35; box-shadow:0 6px 18px rgba(0,0,0,.5)}
#ll-root[data-theme="dark"] .chip-copy{color:#9aa3ad}
#ll-root[data-theme="dark"] .chip-copy b{color:#f2f5fb}
#ll-root[data-theme="dark"] .chip-code{background:linear-gradient(135deg,#0b6fd0,#3f9bea)}
@media(max-width:560px){
  #ll-root .papf-brand{max-width:44%}
  #ll-root .papf-chip{display:none}
  #ll-root .papf-brand img{height:auto; width:150px; max-width:100%}
  #ll-root .card{padding:12px 11px; gap:6px}
  #ll-root .wm-text b{font-size:19px; letter-spacing:1px; white-space:nowrap}
  #ll-root .wm-text span{font-size:11px; letter-spacing:4px}
  #ll-root .logo-img{max-width:170px}
  #ll-root .tagline{font-size:12px}
  #ll-root .bigscore{font-size:26px}
  #ll-root .medal{font-size:12px}
  #ll-root .lb{max-height:156px}
  #ll-root .lb-row{font-size:12px; padding:4px 8px}
  #ll-root .pu-box{padding:10px 11px}
  #ll-root .pu-box .pu-title{font-size:14px}
  #ll-root .pu-box .pu-text{font-size:12.5px; line-height:1.4; margin-bottom:8px}
  #ll-root .pu-steps{gap:5px; margin-bottom:9px !important}
  #ll-root .pu-steps li{font-size:12.5px; padding-left:22px; line-height:1.3}
  #ll-root .pu-steps li::before{width:16px; height:16px; line-height:16px; font-size:9.5px}
  #ll-root .pu-btn{display:block; width:100%; text-align:center; padding:9px 10px}
  #ll-root .pu-title{margin-bottom:6px}
  #ll-root #ll-quip{display:none}
  #ll-root .hint{font-size:11px}
  #ll-root button.play{padding:10px 26px; font-size:15px}
  #ll-root button.mini{padding:6px 12px; font-size:12px}
  #ll-root .contest-box{padding:8px 10px}
  #ll-root .contest-text{font-size:11.5px}
  #ll-root .contest-elig{font-size:11px}
  #ll-root .subrow input{padding:7px 10px; font-size:13px}
}
#ll-root #ll-themeBtn{
  position:absolute; bottom:10px; right: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;
}
#ll-root #ll-fsBtn{
  position:absolute; bottom:10px; right: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;
}
#ll-root #ll-themeBtn:hover, #ll-root #ll-fsBtn:hover{opacity:1}
#ll-root.ll-fs{position:fixed; inset:0; width:100%; height:100%; max-width:none; margin:0; z-index:99999; background:#0f1113}
#ll-root.ll-fs canvas{width:100%; height:100%; border-radius:0; box-shadow:none}
#ll-root.ll-fs-rot{position:fixed; top:0; left:0; width:100vh; height:100vw; max-width:none; margin:0; z-index:99999; background:#0f1113; transform:rotate(90deg) translateY(-100%); transform-origin:top left}
#ll-root.ll-fs-rot canvas{width:100%; height:100%; border-radius:0; box-shadow:none}
#ll-root:fullscreen{max-width:none; background:#0f1113}
#ll-root:fullscreen canvas{width:100%; height:100%; border-radius:0}
body.ll-noscroll{overflow:hidden}

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

#ll-root .lbcard{max-width:360px; gap:10px}
#ll-root .lbtitle{font-size:13px; font-weight:800; letter-spacing:1.6px; text-transform:uppercase; color:var(--text)}
#ll-root .lb.lbfull{max-height:340px}
#ll-root .lbmine{width:100%}
#ll-root .lbmine.hidden{display:none}
#ll-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}
#ll-root #ll-lbNote{font-size:11.5px}
#ll-root #ll-lbLink{color:#045cb4; font-weight:700; text-decoration:underline; cursor:pointer}
#ll-root[data-theme="dark"] #ll-lbLink{color:#6ea8ff}
@media(max-width:560px){
  #ll-root .lb.lbfull{max-height:250px}
  #ll-root .lbtitle{font-size:12px}
}

#ll-root .namewrap a{color:var(--sub); text-decoration:underline; font-weight:600; cursor:pointer; margin-left:4px}
#ll-root .namewrap a:hover{color:var(--text)}
#ll-root .nameform{display:flex; gap:6px; align-items:center; justify-content:center; width:100%; flex-wrap:wrap}
#ll-root .nameform.hidden{display:none}
#ll-root #ll-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}
#ll-root #ll-nameInput:focus{outline:2px solid #045cb4; outline-offset:1px}

#ll-root .namewrap.hidden{display:none}

#ll-root #ll-updBar{position:absolute; left:50%; transform:translateX(-50%); top:10px; 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)}
#ll-root #ll-updBar button{background:#fff; color:#045cb4; border:0; border-radius:7px; cursor:pointer;
  font:inherit; font-weight:800; padding:6px 11px; white-space:nowrap}
#ll-root #ll-updBar button:hover{background:#eaf2fb}
@media(max-width:560px){
  #ll-root #ll-updBar{font-size:11.5px; padding:7px 10px; gap:8px; top:6px}
  #ll-root #ll-updBar button{padding:5px 9px}
}
/* development-page badge: shown only when an admin forces a non-live edition */
#ll-root #ll-devTag{position:absolute; left:10px; bottom: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)}
#ll-root #ll-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}