/* Starlight Merge: navy night sky, bright gold, jewel-tone accents. No white backgrounds. */
.sm-h1{margin:.2rem 0 .5rem;font-family:"Playfair Display",Georgia,serif;color:#FFD54F}
.sm-stage{position:relative;width:100%;height:clamp(500px,min(150vw,86vh),920px);height:clamp(500px,min(150vw,86dvh),920px);border-radius:18px;overflow:hidden;background:#071634;
  border:3px solid #E8B422;box-shadow:0 0 0 1px #6B4E00,0 14px 40px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,233,168,.35);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;isolation:isolate;color:#F7E7C1}
@media (min-width:900px){.sm-stage{height:max(560px,min(calc(100vh - 120px),860px));height:max(560px,min(calc(100dvh - 120px),860px))}}
@media (orientation:landscape) and (max-height:540px){.sm-stage{height:calc(100vh - 16px);height:calc(100dvh - 16px);min-height:300px}}
.sm-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none;cursor:crosshair}
.sm-canvas:focus-visible{box-shadow:inset 0 0 0 3px #FFE9A8}
.sm-hud{position:absolute;left:0;right:0;top:0;z-index:2;display:flex;align-items:center;gap:6px;padding:6px 8px;padding-top:max(6px,env(safe-area-inset-top));pointer-events:none;
  background:linear-gradient(180deg,rgba(3,10,28,.8),rgba(3,10,28,.3) 80%,rgba(3,10,28,0))}
.sm-stage[data-mode="title"] .sm-hud>.sm-pill,.sm-stage[data-mode="how"] .sm-hud>.sm-pill,.sm-stage[data-mode="levels"] .sm-hud>.sm-pill{visibility:hidden}
.sm-pill{pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:58px;min-height:48px;padding:2px 10px;border-radius:14px;line-height:1.05;
  background:linear-gradient(180deg,rgba(20,40,86,.9),rgba(8,20,50,.9));border:1.5px solid rgba(232,180,34,.85);box-shadow:inset 0 1px 0 rgba(255,233,168,.35)}
.sm-pill small{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:#E9D8A6}
.sm-pill b{font-size:1.3rem;color:#FFE08A;font-variant-numeric:tabular-nums}
.sm-bestp b{color:#9AE6D8}
.sm-nextp{padding:2px 6px}.sm-next{width:30px;height:30px;display:block}
.sm-corner{margin-left:auto;display:flex;gap:6px;pointer-events:auto}
.sm-ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;cursor:pointer;background:rgba(11,37,69,.75);border:1.5px solid rgba(232,180,34,.85);color:#FFD54F;padding:0}
.sm-ico:hover,.sm-ico:focus-visible{background:#13294b;outline:2px solid #FFE9A8;outline-offset:1px}
.sm-bars{width:20px;height:16px;display:block;background:linear-gradient(#FFD54F,#FFD54F) 0 0/100% 3px,linear-gradient(#FFD54F,#FFD54F) 0 50%/100% 3px,linear-gradient(#FFD54F,#FFD54F) 0 100%/100% 3px;background-repeat:no-repeat}
.sm-sndi{width:22px;height:22px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 9h4l5-4v14l-5-4H4z' fill='%23FFD54F'/%3E%3Cpath d='M16 8.5a5 5 0 0 1 0 7M18.5 6a8.5 8.5 0 0 1 0 12' fill='none' stroke='%23FFD54F' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.sm-ico.off .sm-sndi{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 9h4l5-4v14l-5-4H4z' fill='%23FFD54F'/%3E%3Cpath d='M16 9l5 6M21 9l-5 6' fill='none' stroke='%23FF8FA3' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E")}
.sm-fsi{width:18px;height:18px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 9V4h5M15 4h5v5M20 15v5h-5M9 20H4v-5' fill='none' stroke='%23FFD54F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.sm-fsb.on .sm-fsi{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 4v5H4M20 9h-5V4M15 20v-5h5M4 15h5v5' fill='none' stroke='%23FFD54F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.sm-sheet{position:absolute;z-index:5;color:#F7E7C1}
.sm-sheet[hidden]{display:none!important}
.sm-card{left:50%;top:50%;transform:translate(-50%,-50%);width:min(92%,460px);max-height:calc(100% - 70px);margin-top:28px;overflow:auto;padding:1rem 1.2rem 1.2rem;border-radius:22px;text-align:center;
  background:radial-gradient(ellipse at 50% 0,rgba(44,72,150,.96),rgba(11,31,72,.97) 55%,rgba(6,18,46,.98));border:2px solid #E8B422;box-shadow:0 0 0 5px rgba(8,20,50,.6),0 0 0 6px rgba(232,180,34,.45),0 20px 50px rgba(0,0,0,.6);animation:sm-in .4s cubic-bezier(.2,1.3,.5,1)}
@keyframes sm-in{from{opacity:0;transform:translate(-50%,-45%) scale(.9)}}
.g-overlay.sm-card{display:block;inset:auto;left:50%;top:50%}
.sm-kick{margin:0;font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;color:#9AE6D8}
.sm-logo{margin:.1rem 0 .3rem;font:900 clamp(2.1rem,9vw,3.1rem)/1 "Playfair Display",Georgia,serif;background:linear-gradient(180deg,#FFF8DC,#FFD54F 55%,#C99700);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 rgba(3,10,28,.8))}
.sm-logo span{background:linear-gradient(90deg,#46E0C8,#9B59F6,#F06292);-webkit-background-clip:text;background-clip:text}
.sm-tag{margin:.2rem 0 .7rem;color:#E9D8A6;font-size:1.05rem}
.sm-orbrow{display:flex;justify-content:center;align-items:flex-end;gap:6px;margin:.4rem 0}
.sm-orbrow i{display:block;border-radius:50%;animation:sm-bob 3s ease-in-out infinite;box-shadow:0 0 18px currentColor}
.sm-orbrow .o0{width:18px;height:18px;color:#FFC72C;background:radial-gradient(circle at 35% 30%,#FFF6C8,#FFC72C 50%,#8A5A00)}
.sm-orbrow .o2{width:24px;height:24px;color:#1DC9B7;background:radial-gradient(circle at 35% 30%,#C8FFF6,#1DC9B7 50%,#05554E);animation-delay:-.4s}
.sm-orbrow .o4{width:30px;height:30px;color:#2F7BFF;background:radial-gradient(circle at 35% 30%,#D4E6FF,#2F7BFF 50%,#0B2A78);animation-delay:-.8s}
.sm-orbrow .o6{width:36px;height:36px;color:#E8344E;background:radial-gradient(circle at 35% 30%,#FFD9D9,#E8344E 50%,#6E0A1C);animation-delay:-1.2s}
.sm-orbrow .o8{width:42px;height:42px;color:#46E0C8;background:radial-gradient(circle at 35% 30%,#E2FFF8,#46E0C8 45%,#6A2BB8);animation-delay:-1.6s}
.sm-orbrow .o10{width:52px;height:52px;color:#FFD54F;background:radial-gradient(circle at 35% 30%,#FFFDE8,#FFD54F 50%,#E8641E);animation-delay:-2s}
@keyframes sm-bob{50%{transform:translateY(-6px)}}
.sm-modes{display:grid;gap:.5rem;margin:.4rem 0 .7rem}
.sm-mode{display:flex;justify-content:space-between;align-items:center;min-height:56px;padding:.5rem 1rem;border-radius:16px;cursor:pointer;font:inherit;color:#FFF3C4;
  background:linear-gradient(180deg,rgba(20,50,110,.95),rgba(8,22,56,.95));border:2px solid rgba(232,180,34,.8);box-shadow:inset 0 1px 0 rgba(255,233,168,.35),0 4px 12px rgba(0,0,0,.35)}
.sm-mode b{font-size:1.15rem}.sm-mode small{color:#9AE6D8;font-size:.9rem}
.sm-mode:hover,.sm-mode:focus-visible{border-color:#FFE9A8;background:linear-gradient(180deg,#1C4A9C,#0B2460);outline:2px solid #FFE9A8;outline-offset:2px}
#sm-classic{border-color:#46E0C8}#sm-journey{border-color:#9B59F6}#sm-daily{border-color:#F06292}
.sm-title{margin:.15rem 0 .6rem;font:800 1.9rem/1.1 "Playfair Display",Georgia,serif;background:linear-gradient(180deg,#FFF8DC,#FFD54F 55%,#C99700);-webkit-background-clip:text;background-clip:text;color:transparent}
.sm-steps{list-style:none;margin:0;padding:0;display:grid;gap:.45rem;text-align:left}
.sm-steps li{display:flex;gap:.7rem;align-items:center;padding:.45rem .7rem;border-radius:12px;background:rgba(3,10,28,.45);border:1px solid rgba(232,180,34,.35);font-size:1.05rem}
.sm-si{font-size:1.5rem;flex:0 0 auto}
.sm-ebtns{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.8rem}
.sm-stage .btn{min-height:48px;min-width:48px}
.sm-note{color:#CFE8FF;margin:.3rem 0}
.sm-escore{font-size:1.7rem;font-weight:800;color:#FFE08A;margin:.1rem 0}
.sm-eorb{width:96px;height:96px;display:block;margin:0 auto;animation:sm-bob 2.4s ease-in-out infinite}
.sm-lgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:.45rem}
.sm-lv{min-height:52px;border-radius:14px;font:800 1.15rem/1 system-ui,sans-serif;color:#0B1F48;cursor:pointer;border:2px solid #FFE9A8;background:radial-gradient(circle at 35% 30%,#FFF3B0,#E8B422 60%,#8A6100)}
.sm-lv.locked{color:#8FA3C8;background:rgba(3,10,28,.6);border-color:rgba(143,163,200,.4);cursor:not-allowed}
.sm-lv:not(.locked):hover,.sm-lv:focus-visible{outline:3px solid #FFF8DC;outline-offset:2px}
.sm-mgrid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.sm-mgrid #g-resume{grid-column:1/-1}
.sm-bar{margin-top:.7rem}
@media (max-width:420px){.sm-pill{min-width:46px;padding:2px 5px}.sm-pill b{font-size:1.1rem}.sm-ico{width:46px;height:46px}.sm-corner{gap:4px}.sm-hud{gap:4px;padding:5px}}
@media (orientation:landscape) and (max-height:540px){.sm-card{width:min(94%,620px);padding:.6rem 1rem .8rem}.sm-modes{grid-template-columns:repeat(3,1fr)}.sm-orbrow,.sm-tag{display:none}.sm-logo{font-size:2rem}.sm-steps{grid-template-columns:1fr 1fr}.sm-lgrid{grid-template-columns:repeat(10,1fr)}}
.sm-stage.sm-full{border-radius:0;border:0;height:100%;width:100%}
html.sm-fs-on .sm-stage{position:fixed;inset:0;z-index:9999;height:100vh;height:100dvh;width:100vw;border-radius:0;border:0;margin:0}
html.sm-fs-on,html.sm-fs-on body{overflow:hidden;height:100%}
html.sm-fs-on header.site,html.sm-fs-on footer.site,html.sm-fs-on .btt,html.sm-fs-on .skip,html.sm-fs-on [class*="vip-chat"]{display:none!important}
@media (prefers-reduced-motion:reduce){.sm-card,.sm-orbrow i,.sm-eorb{animation:none}}
.sm-stage>#g-snd{display:none!important} /* the game has its own speaker button in the HUD, synced with the site-wide switch */