*{box-sizing:border-box}body{margin:0;background:#f7f5ef;color:#202124;font-family:Arial,sans-serif}.app{max-width:680px;margin:auto;padding:20px 16px 42px}
.head{display:flex;justify-content:space-between;align-items:center}h1{font-size:38px;margin:4px 0 0}.sub{font-size:20px;font-weight:700;color:#777;margin-bottom:24px}
button{font:inherit;font-weight:700;background:#fff;border:1.8px solid #555;border-radius:24px;padding:12px 17px}.levels{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0 22px}
.level{border-radius:15px;padding:11px 3px}.level.active{background:#222;color:#fff}.level small{display:block;margin-top:4px}.status{display:flex;justify-content:space-between;font-size:20px;font-weight:bold;margin:8px 3px 17px}
#board{display:grid;width:100%;aspect-ratio:1;border:5px solid #222;border-radius:10px;overflow:hidden;background:#fff}#board{touch-action:none;overscroll-behavior:contain}
.cell{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;overflow:hidden;line-height:1;border-right:1px solid #555;border-bottom:1px solid #555;font-size:clamp(18px,6vw,35px);font-weight:bold;user-select:none}
.cell .x{opacity:.55}.cell.hi{box-shadow:inset 0 0 0 5px #222}
.cell.conflict{background:rgba(255,62,82,.10)!important;box-shadow:inset 0 0 0 3px #ff4d63,0 0 15px rgba(255,77,99,.32);animation:conflictPulse .48s ease-out}
.cell.conflict .lumen-orb{box-shadow:0 0 0 4px rgba(255,77,99,.72),0 0 22px rgba(255,77,99,.62),inset 0 0 14px rgba(255,255,255,.7)}
@keyframes conflictPulse{0%{transform:scale(.9)}55%{transform:scale(1.045)}100%{transform:scale(1)}}
.cell.guided-attempt{background:rgba(255,92,62,.30)!important;box-shadow:inset 0 0 0 4px #ff623f,0 0 24px rgba(255,98,63,.72)!important}.cell.guided-attempt .lumen-orb{background:radial-gradient(circle at 38% 34%,#fff 0 8%,#ffd2c5 15%,#ff7958 38%,#d53f2e 68%,#591b24 100%)!important;box-shadow:0 0 0 4px rgba(255,98,63,.78),0 0 26px rgba(255,74,52,.88),inset 0 0 12px rgba(255,255,255,.55)!important}
.guided-cause{box-shadow:inset 0 0 0 3px #f2b84b,0 0 16px rgba(242,184,75,.45)!important;animation:guidedCausePulse 1.1s ease-in-out infinite alternate}
.guided-path{background-image:linear-gradient(rgba(242,184,75,.20),rgba(242,184,75,.20))!important}
.guided-region{filter:brightness(.92);box-shadow:inset 0 0 0 2px rgba(242,184,75,.8)}
.guided-link{position:absolute;height:4px;background:#f2b84b;border-radius:4px;transform-origin:0 50%;pointer-events:none;z-index:8;box-shadow:0 0 8px rgba(242,184,75,.75)}
#board{position:relative}
.guided-card{margin:12px 0 4px;padding:14px 16px;border:2px solid #f2b84b;border-radius:16px;background:#fff9e8;color:#202124;box-shadow:0 6px 20px rgba(0,0,0,.08)}
.scripted-learn{margin:8px 0 10px;padding:13px 15px;border:1px solid rgba(104,231,255,.28);border-radius:15px;background:rgba(10,31,47,.94);color:#dffcff;line-height:1.4;box-shadow:0 8px 24px rgba(0,0,0,.18)}.scripted-learn[hidden]{display:none}.scripted-learn strong{display:block;color:#68e7ff;margin-bottom:4px}.scripted-focus{position:relative;z-index:3;box-shadow:inset 0 0 0 4px #fff,0 0 0 7px #68e7ff,0 0 30px rgba(104,231,255,.95)!important;animation:scriptedFocus .85s ease-in-out infinite alternate}.scripted-focus:after{content:"♙";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:52%;color:#dffcff;opacity:.72;text-shadow:0 0 12px #68e7ff;pointer-events:none}.scripted-territory{animation:scriptedTerritory 1.15s ease-in-out infinite alternate;filter:brightness(1.18);box-shadow:inset 0 0 0 2px rgba(104,231,255,.8)}.scripted-dim{opacity:.38;filter:saturate(.72)}@keyframes scriptedFocus{to{filter:brightness(1.42);box-shadow:inset 0 0 0 4px #fff,0 0 0 8px #68e7ff,0 0 40px rgba(104,231,255,1)}}@keyframes scriptedTerritory{from{filter:brightness(1.02);box-shadow:inset 0 0 0 2px rgba(104,231,255,.35)}to{filter:brightness(1.38);box-shadow:inset 0 0 0 4px rgba(104,231,255,.95),0 0 16px rgba(104,231,255,.5)}}.manual-cross-tip{position:fixed;left:50%;bottom:22px;z-index:1700;width:min(420px,calc(100vw - 28px));transform:translateX(-50%);padding:14px 16px;border:1px solid #31516a;border-radius:16px;background:#081722;color:#dffcff;box-shadow:0 16px 42px rgba(0,0,0,.48)}.manual-cross-tip[hidden]{display:none}.manual-cross-tip strong{display:block;color:#68e7ff;margin-bottom:4px}.manual-cross-tip button{width:100%;margin-top:10px;padding:9px 12px}
.guided-card[hidden]{display:none}.guided-card strong{display:block;font-size:17px;margin-bottom:5px;color:#5b3b00}.guided-card p{margin:0 0 12px;line-height:1.35;color:#303238}.guided-card button{width:100%;background:#202124;color:#fff;border-color:#202124;padding:10px 14px}
@keyframes guidedCausePulse{from{filter:brightness(1)}to{filter:brightness(.88)}}
.verify-error{background:rgba(255,77,99,.14)!important;box-shadow:inset 0 0 0 3px #ff4d63,0 0 15px rgba(255,77,99,.34)!important;animation:verifyErrorPulse .8s ease-in-out infinite alternate}
.verify-ok{animation:verifyOkPulse .75s ease-out}
.verify-ok .lumen-orb{box-shadow:0 0 0 3px rgba(48,178,108,.5),0 0 20px rgba(48,178,108,.55),inset 0 0 14px rgba(255,255,255,.7)}
.verify-celebration{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:20;overflow:hidden}
.verify-celebration[hidden]{display:none}.verify-check{font-size:clamp(80px,28vw,150px);font-weight:900;color:#24a866;text-shadow:0 5px 20px rgba(36,168,102,.35);animation:verifyCheckPop 1.25s ease both}
.verify-spark{position:absolute;color:#24a866;font-size:24px;animation:verifySpark 1.2s ease-out both}
.verify-card{margin:12px 0 4px;padding:14px 16px;border:2px solid #ff6b72;border-radius:16px;background:#fff6f6;box-shadow:0 6px 20px rgba(0,0,0,.08)}
.verify-card[hidden]{display:none}.verify-card strong{display:block;font-size:17px;margin-bottom:5px}.verify-card p{margin:0 0 12px;line-height:1.35}.verify-card button{width:100%;background:#202124;color:#fff;border-color:#202124;padding:10px 14px}
@keyframes verifyErrorPulse{from{filter:brightness(1)}to{filter:brightness(.9)}}@keyframes verifyOkPulse{0%{transform:scale(1)}45%{transform:scale(1.04)}100%{transform:scale(1)}}@keyframes verifyCheckPop{0%{opacity:0;transform:scale(.3) rotate(-12deg)}45%{opacity:1;transform:scale(1.12) rotate(3deg)}70%{transform:scale(.96)}100%{opacity:0;transform:scale(1)}}@keyframes verifySpark{0%{opacity:0;transform:translate(0,0) scale(.4)}35%{opacity:1}100%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(1.3)}}.actions{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}.msg{min-height:78px;text-align:center;padding:14px 4px;font-weight:700;color:#555}
.proof{text-align:center;color:#666;margin:14px 0 25px}.rules{background:#fff;border:1px solid #ddd;border-radius:18px;padding:18px}
@media(max-width:500px){.levels{gap:5px}.level{font-size:13px;padding:10px 1px}h1{font-size:34px}.head button{padding:10px 12px}}

.play-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:2px 2px 14px}.auto-cross{display:flex;align-items:center;gap:8px;margin:0;min-width:0;white-space:nowrap;font-weight:700;color:#555;font-size:15px;cursor:pointer}
.auto-cross input{width:21px;height:21px;accent-color:#222;flex:0 0 auto}

.cell.auto-x .x{opacity:.38}
.cell.learning-wave{animation:learningWave .38s ease-out}.cell.learning-wave .lumen-dim{filter:brightness(1.8);transform:scale(1.12)}@keyframes learningWave{0%{box-shadow:inset 0 0 0 4px rgba(104,231,255,.95),0 0 22px rgba(104,231,255,.75)}100%{box-shadow:none}}

/* Success celebration */
#successOverlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;
  background:rgba(20,20,20,.42);backdrop-filter:blur(3px);padding:24px}
#successOverlay.show{display:flex;animation:successFade .28s ease-out}
.success-card{position:relative;width:min(430px,92vw);max-height:calc(100dvh - 48px);overflow-y:auto;background:#fff;border-radius:28px;padding:30px 24px 24px;
  text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.28);animation:successPop .55s cubic-bezier(.2,1.45,.35,1)}
.success-gem{font-size:74px;line-height:1;animation:gemBounce .8s ease-in-out}
.success-title{font-size:34px;font-weight:900;margin:10px 0 4px}
.success-sub{font-size:18px;color:#666;font-weight:700;margin-bottom:20px}
.success-time{font-size:24px;font-weight:900;margin:10px 0 22px}
.success-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.success-actions button{border-radius:16px}
#board.win{animation:boardWin .8s ease-in-out}
#board.win{animation:boardWin .55s ease-out both}\n#board.win .lumen-orb{animation-play-state:paused}
.confetti{position:fixed;z-index:1001;top:-24px;width:12px;height:18px;border-radius:3px;pointer-events:none;
  animation:confettiFall var(--dur) linear forwards;transform:rotate(var(--rot))}
@keyframes successFade{from{opacity:0}to{opacity:1}}
@keyframes successPop{0%{opacity:0;transform:scale(.65) translateY(30px)}70%{transform:scale(1.04)}100%{opacity:1;transform:scale(1)}}
@keyframes gemBounce{0%,100%{transform:scale(1) rotate(0)}35%{transform:scale(1.25) rotate(-8deg)}65%{transform:scale(1.12) rotate(8deg)}}
@keyframes boardWin{0%,100%{transform:scale(1)}40%{transform:scale(1.025);box-shadow:0 0 0 8px rgba(255,193,7,.28)}}
@keyframes boardWin{0%,100%{transform:scale(1)}45%{transform:scale(1.012)}}
@keyframes confettiFall{0%{transform:translateY(-5vh) rotate(0deg);opacity:1}100%{transform:translateY(110vh) rotate(720deg);opacity:.9}}
@media (prefers-reduced-motion:reduce){
 #board.win,.success-card,.success-gem,.confetti{animation-duration:.01ms!important;animation-iteration-count:1!important}
}


/* LUMEN — ENERGY MAP */
:root{--void:#090d16;--ink:#edf5ff;--muted:#8190a8;--cyan:#68e7ff}
html{background:#090d16}
body{background:radial-gradient(circle at 50% -8%,rgba(63,118,173,.22),transparent 35%),#090d16;color:var(--ink);min-height:100vh}
.app{max-width:650px;padding:24px 18px 48px}.head{align-items:center;margin-bottom:18px}h1{margin:0}
.lumen-brand{font-size:34px;font-weight:900;letter-spacing:.28em;color:#eafaff;text-shadow:0 0 18px rgba(104,231,255,.38)}
button{background:#121a29;color:#dcecff;border:1px solid #2b3b55;border-radius:14px;box-shadow:inset 0 1px rgba(255,255,255,.04)}
.levels{display:none}.auto-cross{color:#8fa0b8;font-weight:600}.auto-cross input{accent-color:#67dff8}
.status{color:#b8c9dd;font-size:17px}#difficulty{display:none!important}
#board{position:relative;display:grid;width:100%;aspect-ratio:1;border:0!important;border-radius:30px;overflow:hidden;
 padding:12px;gap:3px;background:radial-gradient(circle at 50% 48%,rgba(37,62,92,.72),rgba(11,17,29,.97) 66%),#0d1422!important;
 box-shadow:0 24px 70px rgba(0,0,0,.45),inset 0 0 0 1px rgba(129,179,220,.11)!important}
.cell{position:relative;border:0!important;border-radius:8px;background:rgba(255,255,255,.018)!important;overflow:visible;isolation:isolate;
 transition:background .15s ease,transform .15s ease,box-shadow .15s ease}
.cell:before{content:"";position:absolute;inset:29%;border-radius:50%;border:1px solid rgba(147,178,213,.15);
 background:rgba(9,14,24,.24);z-index:-1}
.cell.hi{box-shadow:inset 0 0 0 2px rgba(104,231,255,.88),0 0 18px rgba(104,231,255,.18)!important}
.cell[data-t="1"]{border-top:3px solid var(--territory)!important}.cell[data-b="1"]{border-bottom:3px solid var(--territory)!important}
.cell[data-l="1"]{border-left:3px solid var(--territory)!important}.cell[data-r="1"]{border-right:3px solid var(--territory)!important}
.lumen-orb{position:relative;width:46%;aspect-ratio:1;border-radius:50%;
 background:radial-gradient(circle at 38% 34%,#fff 0 10%,#c8fbff 16%,#67e6ff 38%,#3185c4 67%,#102b52 100%);
 box-shadow:0 0 7px #dffcff,0 0 17px rgba(104,231,255,.9),0 0 34px rgba(55,144,221,.62);animation:orbPulse 2.1s ease-in-out infinite}
.lumen-orb:after{content:"";position:absolute;inset:-30%;border:1px solid rgba(114,232,255,.2);border-radius:50%}
.lumen-orb.big{width:74px;display:inline-block}
.lumen-dim{width:16%;aspect-ratio:1;border-radius:50%;background:#344158;box-shadow:0 0 0 1px #53627a;opacity:.9}
.cell.auto-x .lumen-dim{opacity:.3}
.guardian-counter-icon{width:12px;height:12px;border-radius:50%;background:#8ef0ff;transform:none;box-shadow:0 0 8px rgba(104,231,255,.85);vertical-align:0}
.rules{background:#101827;border:1px solid #263650;border-radius:20px;color:#b7c6da}.rules b{color:#edf7ff}
.msg{color:#9fb1c8}.success-card{background:linear-gradient(180deg,#121c2d,#0c1320);border:1px solid #2d4966;color:#eefaff}
.success-title{color:#c8f8ff}.success-sub{color:#8da3bb}#successOverlay{background:rgba(4,8,15,.72)}.success-gem{display:flex;justify-content:center}
@keyframes orbPulse{50%{filter:brightness(1.22);transform:scale(1.06)}}
@media(max-width:500px){.app{padding:18px 12px 38px}.lumen-brand{font-size:30px}#board{padding:8px;gap:2px;border-radius:23px}}


/* LUMEN — cell/core contrast */
.cell{box-shadow:inset 0 0 0 1px rgba(124,160,199,.075)}
.cell:before{inset:25%;border:1px solid rgba(164,202,235,.34);background:radial-gradient(circle,rgba(40,68,99,.46),rgba(17,29,47,.58));box-shadow:inset 0 0 10px rgba(85,144,194,.07)}

/* LUMEN — exclusions = amber energy rings */
.lumen-dim,
.cell.auto-x .lumen-dim{
 width:30%;
 aspect-ratio:1;
 border-radius:50%;
 background:rgba(255,166,45,.07);
 border:3px solid #ffad32;
 box-sizing:border-box;
 box-shadow:
   0 0 5px rgba(255,173,50,.72),
   0 0 13px rgba(255,132,28,.30),
   inset 0 0 5px rgba(255,186,71,.16);
 opacity:1;
}


.clear-hint{border-color:#59667a!important;color:#d5deea!important;background:#172131!important}
.clear-hint[hidden]{display:none!important}
.journey{margin:0 0 16px;padding:14px;background:#0f1827;border:1px solid #263650;border-radius:18px}.journey-top,.progress-copy,.map-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.journey-kicker{display:block;color:#71849e;font-size:10px;letter-spacing:.18em}.progress-track{height:5px;background:#202d41;border-radius:9px;margin:10px 0 6px;overflow:hidden}#progressFill{display:block;height:100%;background:#68e7ff}.progress-copy{font-size:12px;color:#8190a8}.map-modal{position:fixed;inset:0;background:rgba(3,7,13,.92);z-index:140;padding:16px;overflow:auto}.map-modal[hidden]{display:none}.map-sheet{max-width:650px;margin:auto;background:#0d1523;border:1px solid #293a54;border-radius:24px;padding:18px}.sector-tabs,.puzzle-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.sector-tabs{margin:18px 0 14px}.sector-tab{font-size:10px!important;padding:8px 2px!important}.sector-tab.locked{opacity:.28}.sector-tab.active{border-color:#68e7ff}.puzzle-card{aspect-ratio:1;padding:5px!important;position:relative}.puzzle-card.done{background:#123044;border-color:#3d9eb8}.performance-grid{box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4px;overflow:hidden}.performance-slot{box-sizing:border-box;min-width:0;min-height:0;width:auto;height:auto;overflow:hidden;display:flex;align-items:center;justify-content:center;border-radius:7px;border:1px solid rgba(104,231,255,.08);color:#34485d;font-size:15px}.performance-slot.earned{color:#dffcff;background:rgba(104,231,255,.11);border-color:rgba(104,231,255,.32);text-shadow:0 0 8px rgba(104,231,255,.45)}.performance-slot.speed.earned{color:#ffe3a1;background:rgba(255,190,70,.10);border-color:rgba(255,190,70,.28)}.performance-slot.no-error.earned{color:#bff7d8;background:rgba(99,224,158,.09);border-color:rgba(99,224,158,.25)}.performance-slot.clean.earned{color:#bff7d8;background:rgba(99,224,158,.09);border-color:rgba(99,224,158,.25)}.performance-slot.assist.earned{color:#d7c7ff;background:rgba(151,118,255,.10);border-color:rgba(151,118,255,.28)}.performance-slot.hint.earned{color:#78eaff;background:rgba(70,205,232,.10);border-color:rgba(70,205,232,.28)}.performance-icon{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.performance-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;margin:10px 0 2px;padding:9px 10px;border:1px solid #22344c;border-radius:12px;background:#0a1320;color:#9fb2c7;font-size:11px}.performance-legend span{display:flex;align-items:center;gap:6px}.performance-legend .performance-icon{width:15px;height:15px;flex:0 0 auto}.performance-legend .hint{color:#78eaff}.performance-legend .speed{color:#ffe3a1}.performance-legend .no-error{color:#bff7d8}.performance-legend .assist{color:#d7c7ff}.performance-legend .clean{color:#bff7d8}.performance-legend{position:relative;cursor:pointer;padding-right:38px;transition:border-color .18s,background .18s}.performance-legend:hover,.performance-legend:focus-visible{border-color:#3d6b86;background:#0d1826;outline:none}.performance-legend-info{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:1px solid #31536a;border-radius:50%;display:flex!important;align-items:center;justify-content:center!important;color:#68e7ff!important;font-size:12px;font-weight:950;background:#102535}.badge-rules-modal{position:fixed;inset:0;z-index:1450;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(2,7,13,.78);backdrop-filter:blur(5px)}.badge-rules-modal[hidden]{display:none}.badge-rules-card{width:min(460px,94vw);max-height:min(680px,88vh);overflow:auto;padding:20px;border:1px solid #29435b;border-radius:20px;background:#08131f;color:#eafaff;box-shadow:0 24px 70px rgba(0,0,0,.45)}.badge-rules-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}.badge-rules-head h2{margin:0;font-size:21px}.badge-rules-close{padding:7px 10px!important}.badge-rules-intro{margin:0 0 14px;color:#9fb2c7;font-size:13px;line-height:1.45}.badge-rule{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:11px 0;border-top:1px solid #1b2b3d}.badge-rule-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:#102535}.badge-rule-icon .performance-icon{width:19px;height:19px}.badge-rule.hint .badge-rule-icon{color:#78eaff}.badge-rule.speed .badge-rule-icon{color:#ffe3a1}.badge-rule.no-error .badge-rule-icon{color:#bff7d8}.badge-rule.assist .badge-rule-icon{color:#d7c7ff}.badge-rule.clean .badge-rule-icon{color:#bff7d8}.badge-rule strong{display:block;margin-bottom:3px;font-size:13px}.badge-rule p{margin:0;color:#a9bdd0;font-size:12px;line-height:1.45}.badge-rules-note{margin:13px 0 0;padding:10px 11px;border-radius:11px;background:#0d1d2b;color:#b9d8e8;font-size:12px;line-height:1.45}.success-rewards{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px 0 4px}.success-reward{min-width:68px;padding:8px 9px;border:1px solid #29435b;border-radius:12px;background:#0c1a29;color:#dffcff;font-size:11px;font-weight:800;display:flex;flex-direction:column;align-items:center;gap:4px}.success-reward .performance-icon{width:22px;height:22px}.success-reward.star{color:#ffe3a1;border-color:rgba(255,190,70,.35);background:rgba(255,190,70,.08)}.success-reward.hint{color:#78eaff}.success-reward.speed{color:#ffe3a1}.success-reward.no-error{color:#bff7d8}.success-reward.assist{color:#d7c7ff}.success-reward.clean{color:#bff7d8}.puzzle-card.current{box-shadow:0 0 0 2px #7deaff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:rgba(104,231,255,.08)}.puzzle-new-icon{color:#7deaff;font-size:18px;line-height:1}.puzzle-new-label{color:#7deaff;font-size:8px;font-weight:950;text-transform:uppercase;letter-spacing:.06em}.puzzle-new-number{color:#c9dcea;font-size:8px;font-weight:800}.badge-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.badge{padding:9px;border:1px solid #263650;border-radius:12px;color:#6f7f96;font-size:11px}.badge.earned{color:#eafaff;background:#102535}.sector-progress{margin-top:8px;color:#b9d8e8;font-size:13px;font-weight:800}.progress-copy strong{color:#eafaff}.sky-entry{width:100%;margin-top:10px;padding:10px 12px!important;border:1px solid #2d5368!important;background:linear-gradient(135deg,#102535,#101d2e)!important;border-radius:14px!important;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#68e7ff!important;text-align:left;box-shadow:0 0 16px rgba(63,203,255,.08)}.sky-entry-main{display:flex;align-items:center;gap:8px;font-weight:900}.sky-entry-progress{font-size:11px;color:#a9bdd0;font-weight:800}.sky-entry-arrow{font-size:18px;color:#68e7ff}.campaign-map-label{margin:0 2px 8px;color:#7f94ad;font-size:12px;font-weight:800;letter-spacing:.06em}.puzzle-card.locked{opacity:.3;cursor:not-allowed}
/* LUMEN desktop viewport fit — keep the whole play surface visible without page scrolling */
@media (min-width: 701px) and (min-height: 650px){
  html,body{height:100%;overflow:hidden}
  body{min-height:0}
  .app{
    width:min(96vw,650px);
    height:100dvh;
    max-width:650px;
    padding:clamp(8px,1.4vh,16px) 18px;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .head{margin-bottom:clamp(6px,1vh,12px);flex:0 0 auto}
  .lumen-brand{font-size:clamp(26px,4vh,34px)}
  button{padding:clamp(7px,1.1vh,10px) 14px}
  .journey{margin:0 0 clamp(6px,1vh,10px);padding:clamp(8px,1.2vh,12px);flex:0 0 auto}
  .progress-track{margin:clamp(5px,.8vh,8px) 0 4px}
  .auto-cross{margin:0 2px clamp(5px,.8vh,9px);font-size:clamp(12px,1.8vh,15px);flex:0 0 auto}
  .auto-cross input{width:18px;height:18px}
  .status{font-size:clamp(14px,2vh,17px);margin:0 3px clamp(5px,.8vh,8px);flex:0 0 auto}
  .campaign-map-label{margin:0 2px clamp(4px,.6vh,7px);font-size:11px;flex:0 0 auto}
  #board{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:none;
    flex:1 1 auto;
    min-height:0;
    aspect-ratio:1;
    align-self:center;
  }
  .actions{margin-top:clamp(6px,1vh,10px);gap:10px;flex:0 0 auto}
  .msg{min-height:clamp(28px,4.5vh,46px);padding:clamp(5px,.8vh,8px) 4px;font-size:14px;flex:0 0 auto}
  .rules{display:none}
}
@media (min-width: 701px) and (max-height: 760px){
  .journey{padding:7px 10px}
  .journey-kicker{display:none}
  .progress-track{margin:4px 0 3px}
  .auto-cross{margin-bottom:4px}
  .msg{min-height:24px;padding:3px 4px}
}

/* LUMEN desktop fit v2 — explicit board sizing from viewport height */
@media (min-width:701px){
  html,body{height:100%;overflow:hidden}
  body{min-height:0}
  .app{
    width:min(96vw,650px);
    height:100dvh;
    padding:10px 18px 8px;
    overflow:hidden;
  }
  .head{height:58px;margin:0 0 8px}
  .lumen-brand{font-size:30px}
  .head button{padding:9px 14px}
  .journey{margin:0 0 8px;padding:9px 12px}
  .journey-top button{padding:8px 12px}
  .progress-track{margin:5px 0 4px}
  .auto-cross{margin:0 2px 7px;font-size:14px}
  .auto-cross input{width:18px;height:18px}
  .status{font-size:15px;margin:0 3px 6px}
  .campaign-map-label{margin:0 2px 5px;font-size:11px}
  #board{
    width:min(100%,48dvh)!important;
    height:auto!important;
    max-width:none!important;
    flex:none!important;
    aspect-ratio:1!important;
    align-self:center;
    padding:8px;
    gap:2px;
    border-radius:22px;
  }
  .actions{width:min(100%,48dvh);align-self:center;margin-top:7px;gap:8px}
  .actions button{padding:8px 12px}
  .msg{width:min(100%,48dvh);align-self:center;min-height:24px;padding:4px;font-size:13px}
  .rules{display:none}
}
@media (min-width:701px) and (max-height:760px){
  .app{padding-top:6px}
  .head{height:48px;margin-bottom:5px}
  .lumen-brand{font-size:27px}
  .journey{padding:6px 10px;margin-bottom:5px}
  .journey-kicker{display:none}
  .sector-progress{margin-top:4px}
  .auto-cross{margin-bottom:4px;font-size:13px}
  .status{margin-bottom:4px}
  .campaign-map-label{margin-bottom:3px}
  #board,.actions,.msg{width:min(100%,46dvh)!important}
  .actions{margin-top:5px}
}

/* LUMEN desktop alignment v3 — center the play area */
@media (min-width:701px){
  #board{margin-left:auto!important;margin-right:auto!important}
  .actions,.msg{margin-left:auto;margin-right:auto}
}

/* LUMEN desktop alignment v4 — true centering inside the app column.
   align-self:center was ineffective because .app is not a flex container in the final cascade. */
@media (min-width:701px){
  #board{
    display:grid!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .actions,.msg{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* LUMEN account / cloud sync */
.auth-box{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:-4px 0 8px;font-size:12px;color:#8fa0b8}
.auth-box button{padding:7px 11px;font-size:12px}
#authUser{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:500px){.auth-box{justify-content:center;flex-wrap:wrap;margin-top:0}}

.daily-card{margin:0 0 10px;padding:11px 13px;border:1px solid #28415b;border-radius:16px;background:linear-gradient(135deg,#101d2e,#0d1725);display:flex;align-items:center;justify-content:space-between;gap:12px}
.daily-kicker{font-size:9px;letter-spacing:.18em;color:#6f8aa8;font-weight:900}.daily-title{font-weight:900;color:#e8faff;font-size:14px;margin:2px 0 5px}.daily-stars{display:flex;gap:5px}.daily-star{font-size:16px;color:#35465c;text-shadow:none}.daily-star.on{color:#68e7ff;text-shadow:0 0 9px rgba(104,231,255,.8)}.daily-star.today{outline:1px solid #68e7ff;border-radius:50%;padding:0 2px}.daily-meta{font-size:11px;color:#8295ad;margin-top:4px}.daily-reward{font-size:10px;color:#ffbd59;font-weight:800;white-space:nowrap}

.learning-note{margin:-8px 2px 10px;text-align:center;font-size:12px;color:#7f94ad;font-weight:700}.speed-countdown{display:inline-flex;align-items:center;gap:7px;width:min(52vw,260px);margin-left:7px;color:#cbb36f;vertical-align:middle;opacity:.78;transition:opacity .3s ease,color .3s ease}.speed-countdown[hidden]{display:none}.speed-countdown-icon{flex:0 0 auto;font-size:15px;line-height:1}.speed-countdown-track{height:7px;flex:1;overflow:hidden;border:1px solid rgba(232,190,105,.26);border-radius:999px;background:rgba(232,190,105,.06)}.speed-countdown-fill{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgba(240,204,122,.5),rgba(240,204,122,.82));transform-origin:left center;transform:scaleX(1);transition:transform .28s linear,background .3s ease,box-shadow .3s ease;box-shadow:0 0 6px rgba(240,204,122,.16)}.speed-countdown.speed-countdown-urgent{color:#f0cc7a;opacity:.95}.speed-countdown.speed-countdown-urgent .speed-countdown-track{border-color:rgba(232,190,105,.38)}.speed-countdown.speed-countdown-urgent .speed-countdown-fill{background:linear-gradient(90deg,rgba(240,204,122,.68),#f0cc7a);box-shadow:0 0 8px rgba(240,204,122,.24)}.reward-live{display:flex;align-items:center;justify-content:center;gap:10px;min-height:28px;margin:4px 0 8px;font-size:12px;font-weight:900;letter-spacing:.03em}.mastery-live{color:#6fe6c5;transition:.25s}.mastery-live.lost{color:#53677b;opacity:.58}.progress-live{color:#83a4bf}.reward-toast{position:fixed;left:50%;top:18%;z-index:1550;transform:translate(-50%,-8px) scale(.96);padding:10px 16px;border:1px solid #31516a;border-radius:999px;background:rgba(7,20,32,.95);color:#dffaff;font-size:13px;font-weight:900;box-shadow:0 10px 36px rgba(0,0,0,.35),0 0 24px rgba(104,231,255,.12);opacity:0;pointer-events:none;transition:.22s}.reward-toast.show{opacity:1;transform:translate(-50%,0) scale(1)}.cell.just-lit .lumen-orb{animation:orbReward .34s ease-out}.board-half{animation:boardHalf .55s ease-out}.win-flight{position:fixed;z-index:1600;font-size:30px;color:#dffcff;text-shadow:0 0 18px #68e7ff;pointer-events:none;animation:starFlight 2.4s cubic-bezier(.2,.75,.25,1) forwards}@keyframes orbReward{0%{transform:scale(.55);filter:brightness(1.8)}70%{transform:scale(1.18)}100%{transform:scale(1)}}@keyframes boardHalf{50%{box-shadow:0 0 0 3px rgba(104,231,255,.38),0 0 28px rgba(104,231,255,.24)}}@keyframes starFlight{0%{left:50%;top:52%;transform:translate(-50%,-50%) scale(.45);opacity:0}12%{transform:translate(-50%,-50%) scale(1.25);opacity:1}42%{left:50%;top:52%;transform:translate(-50%,-50%) scale(1.05);opacity:1}82%{opacity:1}100%{left:50%;top:14%;transform:translate(-50%,-50%) scale(1.5);opacity:0}}.hint-wallet{display:flex;align-items:center;justify-content:center;gap:7px;margin:8px 0 2px}.hint-wallet-label{font-size:10px;font-weight:900;letter-spacing:.12em;color:#8295ad;text-transform:uppercase}.shard-meter{display:flex;gap:5px;padding:5px 7px;border:1px solid #22344c;border-radius:999px;background:#09131f;cursor:pointer}.shard-meter:focus-visible{outline:2px solid #68e7ff;outline-offset:2px}.shard-gem{font-size:16px;line-height:1;color:#33475b;text-shadow:none;transition:.18s}.shard-gem.on{color:#68e7ff;text-shadow:0 0 8px rgba(104,231,255,.8)}.shard-help{font-size:11px;color:#688097}.shard-rules-modal{position:fixed;inset:0;z-index:1460;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(2,7,13,.78);backdrop-filter:blur(5px)}.shard-rules-modal[hidden]{display:none}.shard-rules-card{width:min(430px,94vw);padding:20px;border:1px solid #29435b;border-radius:20px;background:#08131f;color:#eafaff;box-shadow:0 24px 70px rgba(0,0,0,.45)}.shard-rules-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.shard-rules-head h2{margin:0;font-size:21px}.shard-rules-card p{color:#a9bdd0;font-size:13px;line-height:1.5}.shard-rule-list{display:grid;gap:8px;margin-top:12px}.shard-rule{padding:10px 11px;border:1px solid #1b2b3d;border-radius:11px;background:#0d1d2b;color:#b9d8e8;font-size:12px;line-height:1.4}.shard-rule strong{color:#eafaff}
.auto-cross.learning-locked{opacity:.88}.auto-cross.learning-locked input{cursor:not-allowed}
.autonomy-card{width:min(430px,92vw);background:#0d1828;border:1px solid #31506e;border-radius:26px;padding:28px 24px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.45)}
.autonomy-icon{font-size:48px;color:#68e7ff;text-shadow:0 0 22px rgba(104,231,255,.7)}.autonomy-title{font-size:25px;font-weight:950;color:#eefcff;margin:10px 0}.autonomy-copy{color:#9db0c6;line-height:1.45;margin-bottom:18px}

/* Desktop: content added over time must remain reachable. Keep the compact board,
   but allow normal vertical scrolling for rules and long hint explanations. */
@media (min-width:701px){
 html,body{height:auto!important;min-height:100%!important;overflow-x:hidden!important;overflow-y:auto!important}
 body{min-height:100vh!important}
 .app{height:auto!important;min-height:100vh!important;overflow:visible!important}
 .rules{display:block!important;margin-top:8px}
}

/* Responsive workspace: one DOM composition, presentation only changes with CSS.
   The journey and contextual message remain the same elements at every size. */
.game-core{min-width:0}
@media (min-width:1100px){
 html,body{height:100%!important;overflow:hidden!important}
 body{min-height:0!important}
 .app{max-width:620px!important;width:min(56vw,620px)!important;height:100dvh!important;min-height:0!important;padding:12px 18px!important;display:block!important;overflow:hidden!important}
 .game-core{width:100%;max-width:620px;margin:auto;min-width:0}
 .journey{position:fixed;top:80px;left:max(18px,calc(50vw - 510px));width:clamp(190px,22vw,280px);margin:0!important}
 .msg{position:fixed;top:80px;right:max(18px,calc(50vw - 510px));width:clamp(190px,22vw,280px);min-height:180px!important;margin:0!important;padding:18px!important;border:1px solid #28415b;border-radius:20px;background:linear-gradient(145deg,#101d2e,#0b1522);color:#dce9f7;font-size:14px;line-height:1.5;text-align:left!important;box-shadow:0 16px 42px rgba(0,0,0,.16)}
 .msg:empty{display:none}
 #board{width:min(100%,55dvh)!important}
 .actions{width:min(100%,55dvh)!important}
 .head{margin-bottom:5px!important}
 .auth-box{margin-bottom:5px}
 .learning-note{margin-bottom:5px}
}

/* Mobile play-first layout: metadata is compact and the board appears immediately. */
.mobile-streak,.mobile-account,.mobile-auth-popover,.daily-info-popover{display:none}
@media (max-width:700px){
 .app{padding:8px 10px 28px}
 .head{margin:0 0 5px;align-items:center}
 .head h1{margin:0;line-height:1}
 .lumen-brand{font-size:27px!important}
 .head-actions{display:flex;align-items:center;gap:5px}
 .mobile-account{display:inline-flex!important;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border-radius:50%;font-size:18px;background:#101d2e;border:1px solid #28415b;color:#b9cee1}
 .daily-info-popover{display:block;position:absolute;z-index:55;top:55px;right:10px;width:min(315px,calc(100vw - 20px));padding:14px;background:#101d2e;border:1px solid #28415b;border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.38);color:#aebfd0;font-size:12px;line-height:1.45}
 .daily-info-popover[hidden]{display:none!important}
 .daily-info-kicker{font-size:9px;letter-spacing:.16em;color:#68e7ff;font-weight:900}
 .daily-info-title{font-size:17px;color:#eefcff;font-weight:900;margin:3px 0 9px}
 .daily-info-stars{display:flex;gap:7px;margin:6px 0 10px}
 .daily-info-stars span{font-size:20px;color:#35465c}
 .daily-info-stars span.on{color:#68e7ff;text-shadow:0 0 9px rgba(104,231,255,.8)}
 .daily-info-popover p{margin:0 0 9px}
 .daily-info-status{color:#e4f5ff;font-weight:800;margin-bottom:8px}
 .daily-info-reward{padding-top:8px;border-top:1px solid #28415b;color:#ffbd59}
 .mobile-auth-popover{display:block;position:absolute;z-index:130;top:55px;right:10px;width:min(290px,calc(100vw - 20px));padding:12px;background:#101d2e;border:1px solid #28415b;border-radius:15px;box-shadow:0 16px 40px rgba(0,0,0,.35);font-size:12px;color:#9fb3c8}
 .mobile-auth-popover[hidden]{display:none!important}
 .mobile-auth-popover button{width:100%;margin-top:9px;padding:9px 11px;font-size:12px}
 .game-core{position:relative}
 .head #new{font-size:0;width:38px;height:38px;padding:0;border-radius:50%}
 .head #new::after{content:"↻";font-size:21px}
 .mobile-journey{display:flex;align-items:center;gap:7px;border:1px solid #28415b;background:#101d2e;padding:5px 8px;border-radius:13px;color:#a9bdd0;font-size:11px;text-align:left;box-shadow:0 0 12px rgba(63,203,255,.07)}
 .mobile-journey-sky{color:#68e7ff;font-weight:900;white-space:nowrap}
 .mobile-journey:active{transform:scale(.98)}
 .mobile-streak{display:inline-flex;align-items:center;white-space:nowrap;font-size:12px;font-weight:900;color:#68e7ff;border:1px solid #28415b;background:#101d2e;border-radius:18px;padding:7px 9px}
 .levels,.auth-box{display:none!important}
 .journey{display:flex!important;align-items:center;justify-content:space-between;gap:8px;margin:0 0 5px;padding:5px 8px;border-radius:13px}
 .journey-top{width:100%;gap:8px}
 .journey-kicker,.progress-track,.progress-copy,.sector-progress{display:none!important}
 .journey-top>div{min-width:0;display:flex;align-items:center;gap:7px}
 #journeyTitle{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:#d6e6f3;font-weight:900;flex:0 1 auto}.journey-quest-progress{display:block;white-space:nowrap;font-size:13px;font-weight:900;color:#68e7ff;letter-spacing:.01em;flex:0 0 auto}.sky-entry{width:auto;margin:0;padding:5px 8px!important;flex:0 0 auto}.sky-entry-progress,.sky-entry-arrow{display:none}.sky-entry-main{font-size:13px;white-space:nowrap}
 #openMap{padding:5px 8px!important;font-size:11px!important;white-space:nowrap}

 .auto-cross{margin:2px 1px 5px;font-size:12px;gap:6px}
 .auto-cross input{width:17px;height:17px}
 .learning-note{margin:0 2px 5px;font-size:10px;line-height:1.2}
 /* Scripted quests 1-2 need coach space above the board without growing the mobile viewport. */
 .learning-board-wrap.is-learning{padding-top:0}
 .learning-board-wrap.is-learning .scripted-learn{position:fixed;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));top:auto;width:auto;z-index:1250;box-shadow:0 18px 50px rgba(0,0,0,.48)}
 .learning-board-wrap.is-learning .scripted-learn:after,.learning-board-wrap.is-learning .learning-coach-link{display:none}
 .learning-board-wrap .scripted-learn{min-height:0;padding:8px 10px;font-size:11px;line-height:1.25;border-radius:14px;max-height:108px;overflow:visible}
 .learning-board-wrap .scripted-learn strong{font-size:12px}
 .learning-board-wrap .scripted-learn button{padding:5px 8px;margin-top:5px;font-size:11px}
 .learning-coach-nav{gap:5px;margin-top:5px}
 .learning-coach-hint{margin-top:4px;font-size:10px;line-height:1.15}
 #difficulty{display:none}
 .status{font-size:13px;margin:0 3px 4px}
 .campaign-map-label{display:none}
 #board{width:100%!important;height:auto!important;max-height:none!important;padding:6px!important;border-radius:18px!important}
 .actions{margin-top:7px;gap:7px}
 .actions button{padding:8px 10px;font-size:13px}
 .msg{min-height:0;padding:8px 3px;font-size:13px;line-height:1.35}
 .msg:empty{display:none}
 .rules{margin-top:7px;padding:12px;font-size:12px}
}

/* First-run tutorial */
.tutorial-help{width:36px;height:36px;padding:0;border-radius:50%;background:#101d2e;border:1px solid #28415b;color:#b9cee1}
.tutorial-overlay{position:fixed;inset:0;z-index:1400;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(3,7,13,.9);backdrop-filter:blur(7px)}
.tutorial-overlay[hidden]{display:none}
.tutorial-card{width:min(430px,94vw);background:linear-gradient(145deg,#101d2e,#09131f);border:1px solid #2b4964;border-radius:25px;padding:22px;color:#eaf7ff;box-shadow:0 24px 70px rgba(0,0,0,.5)}
.tutorial-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.tutorial-brand{font-size:12px;letter-spacing:.15em;font-weight:900;color:#68e7ff}
.tutorial-skip{border:0;background:transparent;color:#8fa6bd;padding:4px;font-size:12px}
.tutorial-visual{height:116px;display:flex;align-items:center;justify-content:center;gap:12px;margin:4px 0 13px;border-radius:18px;background:#09131f;border:1px solid #20364b;font-size:35px}
.tutorial-mini-grid{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(3,42px);gap:3px}
.tutorial-mini-grid span{display:flex;align-items:center;justify-content:center;border-radius:8px;background:#12253a;border:1px solid #29445e;font-size:20px}
.tutorial-mini-grid .orb{box-shadow:inset 0 0 0 3px #5eeaff;color:#8ff4ff}
.tutorial-mini-grid .dim{color:#ffad32}
.tutorial-title{font-size:25px;font-weight:900;margin-bottom:8px}
.tutorial-copy{min-height:78px;color:#b9c9d8;line-height:1.5;font-size:15px}
.tutorial-dots{display:flex;gap:6px;justify-content:center;margin:14px 0}
.tutorial-dot{width:7px;height:7px;border-radius:50%;background:#29445e}
.tutorial-dot.on{background:#68e7ff;box-shadow:0 0 9px rgba(104,231,255,.7)}
.tutorial-actions{display:grid;grid-template-columns:auto 1fr;gap:8px}
.tutorial-actions button{border-color:#34536d;background:#102238;color:#dceaf6}
#tutorialNext{background:#68e7ff;color:#06202a;border-color:#68e7ff}
@media(max-width:700px){.tutorial-help{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;font-size:15px}.tutorial-card{padding:18px}.tutorial-visual{height:100px}.tutorial-title{font-size:22px}.tutorial-copy{min-height:90px;font-size:14px}}

.feedback-flag{color:#bdefff!important}
.beta-modal{position:fixed;inset:0;z-index:1200;background:rgba(2,9,16,.72);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:18px}.beta-modal[hidden]{display:none}.beta-card{width:min(430px,94vw);background:#0c1928;color:#eaf9ff;border:1px solid rgba(104,231,255,.25);border-radius:22px;padding:20px;box-shadow:0 24px 70px rgba(0,0,0,.45)}.beta-card h2{margin:0 0 6px}.beta-card p{color:#9eb7c8}.beta-kinds,.difficulty-choices{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.beta-kinds button,.difficulty-choices button{background:#12283d;color:#dff8ff;border:1px solid rgba(104,231,255,.22);border-radius:13px;padding:11px 8px;cursor:pointer;touch-action:manipulation;position:relative;z-index:1}.beta-kinds button.selected{background:#17405a;color:#fff;border-color:#68e7ff;box-shadow:0 0 0 2px rgba(104,231,255,.3),0 0 16px rgba(104,231,255,.18)}#feedbackText{width:100%;min-height:90px;box-sizing:border-box;border-radius:13px;padding:11px;background:#07111d;color:#fff;border:1px solid #29465e;resize:vertical}.beta-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}.difficulty-box{margin-top:18px;padding-top:14px;border-top:1px solid rgba(104,231,255,.16)}.difficulty-box.done{opacity:.65}

.return-toast{position:fixed;left:50%;top:max(14px,env(safe-area-inset-top));transform:translateX(-50%);z-index:1150;width:min(430px,calc(100vw - 28px));padding:14px 16px;border:1px solid rgba(104,231,255,.3);border-radius:18px;background:rgba(10,25,40,.97);color:#eafaff;box-shadow:0 16px 44px rgba(0,0,0,.38);transition:opacity .25s,transform .25s}.return-toast[hidden]{display:none}.return-toast.hide{opacity:0;transform:translate(-50%,-10px)}.return-toast-title{font-weight:950;font-size:16px}.return-toast-copy{color:#9fb7ca;font-size:13px;margin-top:4px;line-height:1.35}.return-toast-stars{color:#68e7ff;letter-spacing:3px;margin-top:7px;text-shadow:0 0 8px rgba(104,231,255,.65)}
.xp-card{margin:0 0 10px;padding:10px 13px;border:1px solid #28415b;border-radius:15px;background:#0d1725}.xp-row{display:flex;justify-content:space-between;gap:10px;color:#dff9ff;font-size:12px;font-weight:850}.xp-track{height:5px;background:#1c2c40;border-radius:9px;overflow:hidden;margin-top:7px}.xp-track span{display:block;height:100%;background:#68e7ff}.challenge-banner{margin:0 0 10px;padding:11px 13px;border:1px solid rgba(255,189,89,.45);border-radius:15px;background:#111a28;color:#f4f8ff}.challenge-banner[hidden]{display:none}.challenge-banner strong{color:#ffbd59}.challenge-banner small{display:block;color:#9fb1c5;margin-top:3px}.sky-card{margin:12px 0;padding:13px;border:1px solid #263650;border-radius:16px;background:#091421}.sky-head{display:flex;justify-content:space-between;align-items:center;color:#eafaff;font-size:12px}.sky-name{color:#68e7ff;font-weight:900}.sky-svg{width:100%;height:145px;margin-top:6px}.sky-line{stroke:#34516c;stroke-width:2}.sky-line.on{stroke:#68e7ff;filter:drop-shadow(0 0 4px #68e7ff)}.sky-star{fill:#31455c}.sky-star.on{fill:#eafcff;filter:drop-shadow(0 0 5px #68e7ff)}.sky-label{fill:#9fb7cc;font-size:7px;font-weight:700}.sky-note{margin-top:-5px;color:#7189a0;font-size:10px;line-height:1.35}.quest-start{position:fixed;inset:0;z-index:1080;display:flex;align-items:center;justify-content:center;background:rgba(3,7,13,.96);padding:24px}.quest-start[hidden]{display:none}.quest-start-card{width:min(430px,92vw);text-align:center;padding:30px 24px;border:1px solid rgba(255,189,89,.5);border-radius:26px;background:#0d1725;color:#eefaff;box-shadow:0 22px 70px rgba(0,0,0,.5)}.quest-start-icon{font-size:50px;color:#ffbd59}.quest-start-title{font-size:25px;font-weight:950;margin:8px 0}.quest-start-rule{font-size:16px;line-height:1.45;color:#c9d9e7;margin:12px 0 20px}.quest-start button{width:100%;font-size:18px;background:#ffbd59;color:#111827}.quest-result{margin:10px 0 16px;padding:12px;border-radius:14px;font-weight:900}.quest-result.success{background:#e9fbff;color:#08758c}.quest-result.fail{background:#fff2e2;color:#a55700}.sky-reveal{position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 38%,#102b45 0,#06111e 48%,#02070d 100%);padding:22px;color:#eefaff}.sky-reveal[hidden]{display:none}.sky-reveal-card{width:min(520px,94vw);text-align:center}.sky-reveal-kicker{font-size:12px;font-weight:900;letter-spacing:.16em;color:#ffbd59}.sky-reveal-title{font-size:27px;font-weight:950;margin:7px 0 2px}.sky-reveal-name{color:#68e7ff;font-size:18px;font-weight:900}.sky-reveal-svg{width:100%;height:250px;margin:12px 0}.sky-reveal .new-star{transform-box:fill-box;transform-origin:center;animation:starBirth 1.25s cubic-bezier(.15,1.4,.35,1) both}.sky-reveal .new-line{stroke-dasharray:180;stroke-dashoffset:180;animation:lineBirth .9s .7s ease-out forwards}.sky-reveal button{width:100%;max-width:330px;margin:auto}.sky-reveal.complete-celebration .sky-reveal-card{animation:celebrateCard 1s cubic-bezier(.2,.9,.3,1)}.sky-reveal.complete-celebration .sky-reveal-svg{filter:drop-shadow(0 0 18px rgba(104,231,255,.55));animation:constellationGlow 1.8s ease-in-out 2}.sky-bravo{font-size:34px;font-weight:1000;letter-spacing:.08em;color:#ffd36b;margin:4px 0 0;animation:bravoPop 1s cubic-bezier(.15,1.5,.3,1) both}.sky-spark{position:fixed;z-index:1310;pointer-events:none;color:#ffe28a;font-size:18px;animation:skySpark 1.8s ease-out forwards}@keyframes bravoPop{0%{opacity:0;transform:scale(.35) rotate(-5deg)}55%{opacity:1;transform:scale(1.18) rotate(2deg)}100%{opacity:1;transform:scale(1)}}@keyframes celebrateCard{0%{transform:scale(.94)}55%{transform:scale(1.025)}100%{transform:scale(1)}}@keyframes constellationGlow{50%{filter:drop-shadow(0 0 32px rgba(104,231,255,.95))}}@keyframes skySpark{0%{opacity:0;transform:translateY(0) scale(.4) rotate(0)}18%{opacity:1}100%{opacity:0;transform:translateY(-90px) scale(1.25) rotate(160deg)}}@keyframes starBirth{0%{opacity:0;transform:scale(0)}45%{opacity:1;transform:scale(2.4)}100%{opacity:1;transform:scale(1)}}@keyframes lineBirth{to{stroke-dashoffset:0}}.push-optin{position:fixed;inset:0;z-index:1400;background:rgba(2,9,16,.78);display:flex;align-items:center;justify-content:center;padding:20px}.push-optin[hidden]{display:none}.push-optin-card{width:min(420px,94vw);background:#0c1928;color:#eaf9ff;border:1px solid rgba(104,231,255,.28);border-radius:24px;padding:24px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.5)}.push-optin-icon{font-size:42px}.push-optin-card h2{margin:8px 0}.push-optin-card p{color:#a9bfd0;line-height:1.45}.push-optin-actions{display:grid;gap:9px;margin-top:18px}.push-optin-actions .primary{background:#68e7ff;color:#07111d;border-color:#68e7ff}.push-setting{margin-top:10px;font-size:13px;color:#7891a5;background:transparent;border-color:#29465e}

/* LUMEN — Guardians are puzzle pieces; stars are rewards only */
.lumen-orb{width:46%;aspect-ratio:.82;border:1px solid rgba(150,244,255,.9);border-radius:48% 48% 58% 58%/30% 30% 70% 70%;background:linear-gradient(180deg,#dfffff 0 18%,#57dff5 19% 55%,#147ec8 100%);clip-path:polygon(50% 0,92% 17%,86% 66%,50% 100%,14% 66%,8% 17%);box-shadow:0 0 8px rgba(220,255,255,.95),0 0 20px rgba(104,231,255,.8),0 0 34px rgba(22,151,232,.55);animation:orbPulse 2.1s ease-in-out infinite;color:transparent;text-shadow:none}
.lumen-orb:before{content:"";position:absolute;inset:18% 30% 34%;border:2px solid rgba(255,255,255,.88);border-radius:50%;box-shadow:0 0 8px rgba(255,255,255,.55)}
.lumen-orb:after{content:"";position:absolute;left:50%;top:42%;width:2px;height:30%;transform:translateX(-50%);border:0;border-radius:2px;background:rgba(255,255,255,.75);box-shadow:none}
.lumen-orb.big{width:64px;font-size:0}
.guardian-mini{display:inline-block!important;width:17px!important;height:21px!important;border-radius:45% 45% 55% 55%!important;background:#57dff5!important;clip-path:polygon(50% 0,92% 17%,86% 66%,50% 100%,14% 66%,8% 17%)!important;color:transparent!important}
.reward-star{display:inline-block;font-size:74px;line-height:1;color:#ffe3a1;text-shadow:0 0 8px #fff3bf,0 0 24px rgba(255,190,70,.75);animation:gemBounce .8s ease-in-out}

/* LUMEN — subtle territory wash for faster visual grouping */
.cell{
  background:color-mix(in srgb,var(--territory) 18%,rgba(31,49,73,.20))!important;
}
.cell.hi{
  background:color-mix(in srgb,var(--territory) 25%,rgba(31,49,73,.28))!important;
}
@supports not (background:color-mix(in srgb,#000 50%,#fff)){
  .cell{background:rgba(31,49,73,.24)!important}
}
/* Keep every learning territory visible while explaining one placement. */
#board.scripted-board .cell{background:var(--territory)!important;background:color-mix(in srgb,var(--territory) 48%,#101827)!important;opacity:1;filter:none}
#board.scripted-board .cell[data-t="1"]{border-top-width:4px!important}
#board.scripted-board .cell[data-b="1"]{border-bottom-width:4px!important}
#board.scripted-board .cell[data-l="1"]{border-left-width:4px!important}
#board.scripted-board .cell[data-r="1"]{border-right-width:4px!important}
#board.scripted-board .scripted-territory{animation:none;box-shadow:none}
#board.scripted-board .learning-source{box-shadow:inset 0 0 0 3px #e5fcff,0 0 14px rgba(104,231,255,.55)}
.scripted-learn button{display:block;width:100%;margin-top:12px;padding:10px 14px;background:#dffcff;color:#07111d}
.scripted-learn button[hidden]{display:none}
.territory-label{position:absolute;top:5px;left:5px;min-width:20px;height:20px;padding:2px;border-radius:6px;background:#07111d;color:#fff;font-size:12px;font-weight:900;line-height:16px;pointer-events:none}
#board.scripted-board[data-learning-stage="territories"] .cell:before,#board.scripted-board[data-learning-stage="rule"] .cell:before{opacity:.25}
.learning-board-wrap{position:relative}
.learning-board-wrap.is-learning{padding-top:var(--coach-space,158px)}
.learning-board-wrap .scripted-learn{position:absolute;top:0;z-index:12;width:min(290px,calc(100% - 16px));min-height:130px;margin:0;padding:12px 14px;border:1px solid #e8bd64;border-radius:18px;background:#122233;color:#eaf7ff;font-size:13px;line-height:1.4;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.learning-board-wrap .scripted-learn strong{font-size:14px;color:#ffe1a0}
.learning-board-wrap .scripted-learn:after{content:"";position:absolute;bottom:-8px;left:var(--coach-arrow-x,50%);width:14px;height:14px;background:#122233;border-right:1px solid #e8bd64;border-bottom:1px solid #e8bd64;transform:translateX(-50%) rotate(45deg)}
.learning-board-wrap .scripted-learn button{padding:7px 10px;margin-top:9px;font-size:12px}
.learning-board-wrap .scripted-learn button:disabled{opacity:.6;cursor:wait}
.learning-coach-nav{display:flex;gap:8px;margin-top:9px}
.learning-board-wrap .learning-coach-nav button{flex:1;width:auto;margin:0}
.learning-board-wrap .learning-coach-nav button:first-child{background:transparent;color:#eaf7ff;border-color:#53677b}
.learning-coach-hint{display:block;margin-top:8px;color:#a9bed1;font-size:11px;text-align:center}
.learning-coach-link{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:10}
.learning-coach-link[hidden]{display:none}
#board.scripted-board .learning-zone{box-shadow:inset 0 0 0 2px rgba(255,205,111,.75)}
#board.scripted-board .learning-tick{animation:learningTick .5s ease-out}
#board.scripted-board .lumen-dim{position:relative;display:flex;align-items:center;justify-content:center;width:34%}
#board.scripted-board .lumen-dim:after{content:"✓";font-size:clamp(10px,3vw,18px);line-height:1;color:#ffd06b}
@keyframes learningTick{from{transform:scale(.8);box-shadow:inset 0 0 0 3px #ffd06b,0 0 18px rgba(255,205,111,.55)}to{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){#board.scripted-board .learning-tick{animation:none}}
/* PWA install + viral sharing */.install-optin{position:fixed;inset:0;z-index:1250;display:flex;align-items:center;justify-content:center;background:rgba(3,7,13,.88);padding:24px}.install-optin[hidden]{display:none}.install-card{width:min(420px,100%);background:#0d1a29;color:#eefaff;border:1px solid rgba(104,231,255,.35);border-radius:24px;padding:24px;text-align:center;box-shadow:0 18px 70px rgba(0,0,0,.45)}.install-icon{font-size:42px;color:#eaffff;text-shadow:0 0 14px rgba(104,231,255,.9)}.install-card h2{margin:8px 0 10px}.install-card p{color:#bfd0df;line-height:1.45}.install-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.install-actions .primary{background:#eaffff;color:#07111d}#successShare{border-color:rgba(104,231,255,.7)}
.success-achievement{margin:14px 0 4px;padding:12px 14px;border:1px solid rgba(104,231,255,.28);border-radius:16px;background:rgba(104,231,255,.06);text-align:center}
.success-achievement-kicker{font-size:11px;font-weight:950;letter-spacing:.12em;color:#68e7ff;text-transform:uppercase}
.success-achievement-main{font-size:18px;font-weight:950;color:#eefaff;margin-top:4px}
.success-achievement-detail{font-size:13px;color:#9fb7ca;margin-top:3px}
#successShare.share-primary{background:linear-gradient(135deg,#68e7ff,#8b7cff);color:#07111d;border-color:transparent;box-shadow:0 0 22px rgba(104,231,255,.2)}.success-actions #successNew.success-primary{background:linear-gradient(135deg,#68e7ff,#8b7cff);color:#07111d;border-color:transparent;box-shadow:0 0 22px rgba(104,231,255,.2)}.share-toast{position:fixed;left:50%;bottom:24px;z-index:1400;transform:translateX(-50%);background:#0d1a29;color:#eefaff;border:1px solid rgba(104,231,255,.4);border-radius:999px;padding:10px 16px;font-weight:700;box-shadow:0 8px 28px rgba(0,0,0,.35)}.lumen-version{text-align:center;margin:14px 0 2px;font-size:11px;letter-spacing:.08em;opacity:.45;user-select:text}


/* Issue #27 — play-first viewport and unified Lumen assistance */
.hint-guided-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hint-guided-head strong{margin:0}
.hint-guided-close{width:30px!important;height:30px;padding:0!important;border-radius:50%;font-size:20px;line-height:1;background:transparent!important;color:#5b3b00!important;border-color:rgba(91,59,0,.3)!important}
.hint-guided-card{border-color:#f2b84b}
.help-card h3{margin:16px 0 6px;color:#eafaff;font-size:15px}
.help-learning{margin-top:14px;padding-top:14px;border-top:1px solid #28415b}
.help-learning>strong{color:#eafaff}
.help-learning p{margin:5px 0 11px}
.help-learning button{width:100%}

@media (max-width:700px){
 html,body{height:100%;overflow:hidden}
 body{min-height:0}
 .app{height:100dvh;min-height:0;overflow:hidden;padding-bottom:max(8px,env(safe-area-inset-bottom))}
 .game-core{min-height:0}
 #board{
   width:min(100%,calc(100dvh - 255px))!important;
   margin-left:auto!important;
   margin-right:auto!important;
 }
 .actions{
   width:min(100%,calc(100dvh - 255px));
   margin-left:auto;
   margin-right:auto;
   grid-template-columns:repeat(3,minmax(0,1fr));
   gap:5px;
 }
 .actions button{min-width:0;padding:7px 4px;font-size:11px;line-height:1.15}
 .hint-wallet{margin:4px 0 0}
 .reward-live{min-height:22px;margin:2px 0 4px}
 #guidedCard,#hintCard{
   position:fixed;
   left:10px;
   right:10px;
   bottom:max(10px,env(safe-area-inset-bottom));
   z-index:1200;
   margin:0;
   max-height:min(42dvh,300px);
   overflow:auto;
   box-shadow:0 18px 50px rgba(0,0,0,.42);
 }
}

/* Attempt lifecycle (#36) */
.learning-board-wrap{position:relative}
.attempt-mask{position:absolute;inset:0;z-index:90;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px solid #28415b;border-radius:18px;background:rgba(7,17,29,.96);color:#eefcff;text-align:center;padding:22px;backdrop-filter:blur(14px)}
.attempt-mask[hidden]{display:none!important}
.attempt-mask strong{font-size:18px}
.attempt-mask span{font-size:12px;color:#9fb3c8}
.attempt-controls{display:flex;justify-content:center;gap:7px;margin:0 0 5px}
.attempt-controls button{padding:5px 10px;font-size:11px}
@media(max-width:700px){.attempt-mask{border-radius:18px}.attempt-mask strong{font-size:16px}.attempt-controls{position:static;justify-content:flex-end;margin:-2px 0 4px;min-height:0}.attempt-controls button{padding:4px 9px;font-size:10px}}

/* Must come after the base learning coach rules so mobile does not inherit the 158px desktop spacer. */
@media (max-width:700px){.learning-board-wrap.is-learning{padding-top:0}}

.sky-tour{margin:8px 0 12px;padding:10px 12px;border:1px solid rgba(232,189,100,.45);border-radius:12px;background:rgba(232,189,100,.08);display:grid;gap:6px}.sky-tour[hidden]{display:none}.sky-tour strong{color:#ffe3a1}.sky-tour span{font-size:12px;line-height:1.4;color:#c8d8e5}.sky-tour button{justify-self:end;padding:6px 10px}

/* Social challenges (#18) */
.remarkable-challenge{margin:10px 0;padding:12px;border:1px solid rgba(255,222,126,.45);border-radius:14px;background:rgba(255,214,96,.08);display:grid;gap:3px;text-align:center}.remarkable-challenge[hidden]{display:none}.remarkable-challenge strong{color:#ffe39a;font-size:13px;letter-spacing:.08em}.remarkable-challenge span{color:#dcecff;font-size:12px}
#successShare.remarkable{box-shadow:0 0 0 1px rgba(255,220,115,.65),0 0 24px rgba(255,203,76,.2);font-weight:900}
.social-overlay{position:fixed;inset:0;z-index:1400;background:rgba(2,7,14,.88);display:flex;align-items:center;justify-content:center;padding:18px}.social-overlay[hidden]{display:none}.social-card{width:min(430px,100%);max-height:min(760px,90dvh);overflow:auto;background:linear-gradient(180deg,#10243a,#081522);border:1px solid rgba(104,231,255,.28);border-radius:22px;padding:22px;box-shadow:0 24px 80px rgba(0,0,0,.55);color:#edfaff;text-align:center}.social-card-wide{width:min(620px,100%);text-align:left}.social-icon{font-size:40px;color:#ffe39a;text-shadow:0 0 24px rgba(255,220,120,.65)}.social-card h2{margin:8px 0 10px}.social-card p{color:#b9ccda;line-height:1.45}.social-note{font-size:13px}.social-card input{box-sizing:border-box;width:100%;padding:12px;border-radius:12px;border:1px solid rgba(104,231,255,.3);background:#07131f;color:#fff;font-size:16px;margin:8px 0}.social-error{min-height:18px;color:#ff9c9c;font-size:12px}.social-actions{display:grid;gap:8px;margin-top:14px}.social-card button.primary,.social-actions .primary{background:#68e7ff;color:#06131e;font-weight:900}.social-card canvas{display:block;max-width:220px;width:70%;height:auto;margin:16px auto;background:white;padding:8px;border-radius:12px}.social-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.my-challenges-entry{width:100%;margin:12px 0;padding:11px;border-radius:12px}#challengeUnreadBadge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 4px;border-radius:10px;background:#ffcc63;color:#07111d;font-size:11px;font-weight:900}#challengeUnreadBadge[hidden]{display:none}.challenge-list-item{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}.challenge-list-item:last-child{border-bottom:0}.challenge-list-head{display:flex;justify-content:space-between;gap:10px}.challenge-participant{display:flex;justify-content:space-between;gap:10px;padding:6px 0;color:#c9dce8;font-size:13px}.challenge-result-versus{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.challenge-result-player{padding:12px;border-radius:12px;background:rgba(255,255,255,.05)}.challenge-result-player strong{display:block;margin-bottom:5px}.challenge-result-detail{color:#68e7ff;font-weight:800;margin:12px 0}
@media(max-width:520px){.social-overlay{padding:10px}.social-card{padding:18px;border-radius:18px}.challenge-result-versus{grid-template-columns:1fr}}

/* Learning uses the ordinary board and marks; only this coach layer differs. */
.learning-board-wrap .scripted-learn{position:fixed;inset:auto;z-index:85;box-sizing:border-box;min-height:0;margin:0;padding:14px 16px;border-radius:16px;font-size:13px;line-height:1.45;max-height:calc(100dvh - 24px);overflow:auto}
.learning-board-wrap .scripted-learn:after,.learning-coach-nav:has(button[hidden]),.learning-coach-link{display:none}
.learning-board-wrap .scripted-learn strong{padding-right:24px;font-size:14px}
.learning-board-wrap .scripted-learn .learning-coach-dismiss{position:absolute;right:6px;top:4px;width:30px;height:30px;margin:0;padding:0;background:transparent;color:#eaf7ff;border:0;font-size:22px}
.learning-board-wrap .scripted-learn .learning-coach-dismiss[hidden]{display:none}
#board.learning-guided .coach-dim{opacity:.4;transition:opacity .18s}
#board.learning-guided .coach-zone{box-shadow:inset 0 0 0 2px rgba(255,211,131,.8);transition:box-shadow .18s}
#board.learning-guided .coach-target{box-shadow:inset 0 0 0 3px #ffe3a1,0 0 20px rgba(255,211,131,.4)}
@media(max-width:700px){.learning-board-wrap .scripted-learn{padding:10px 12px;font-size:12px;line-height:1.35;max-height:150px}.learning-board-wrap .scripted-learn strong{font-size:13px;margin-bottom:4px}}
@media(prefers-reduced-motion:reduce){#board.learning-guided .cell{transition:none}}
@media(max-width:700px) and (max-height:700px){#board[data-size="5"],.game-core:has(#board[data-size="5"]) .actions{width:min(100%,calc(100dvh - 400px))!important}}
.learning-coach-hint[hidden]{display:none}
@media(min-width:701px) and (max-width:1100px){#board[data-size="5"],.game-core:has(#board[data-size="5"]) .actions{width:min(100%,max(220px,calc(100dvh - 680px)))!important}}

/* QA new-player simulation */
.qa-banner{position:sticky;top:0;z-index:2000;display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 12px;background:#2b1d06;border-bottom:1px solid #d99b2b;color:#ffe6ad;font-size:12px;letter-spacing:.04em}.qa-banner[hidden]{display:none}.qa-banner span{opacity:.78}.qa-banner button{padding:5px 10px;border:1px solid #d99b2b;background:#171006;color:#ffe6ad;border-radius:9px}.qa-mode .app{padding-top:10px}@media(max-width:600px){.qa-banner{flex-wrap:wrap;gap:6px 10px}.qa-banner span{width:100%;text-align:center;order:3}}

/* Onboarding #71: SEE -> UNDERSTAND -> ACT. Territory numbers are teaching-only. */
.learning-territory-number{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);font-weight:900;font-size:clamp(14px,4vw,22px);color:rgba(255,255,255,.9);text-shadow:0 1px 5px rgba(0,0,0,.8);pointer-events:none}
.learning-intro-cell{cursor:default}
.learning-coach-next{margin-top:10px;width:100%;font-weight:800}

.sky-tour-focus{position:relative;z-index:3;outline:3px solid rgba(95,220,255,.9);outline-offset:5px;border-radius:14px;box-shadow:0 0 0 9999px rgba(2,8,18,.38),0 0 28px rgba(95,220,255,.32)}

/* Mon ciel: bounded height, one responsive component for every catalogue. */
#mapModal{display:flex;align-items:center;justify-content:center;padding:12px;overflow:hidden}#mapModal[hidden]{display:none}
#mapModal .map-sheet{position:relative;width:min(760px,calc(100vw - 24px));height:min(620px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);padding:12px;display:flex;flex-direction:column;gap:8px;overflow:hidden}
#mapModal .map-head{margin:0;flex:0 0 auto}#mapModal .map-head h2{font-size:20px;margin:0}
.sky-navigation{display:grid;gap:6px;flex:0 0 auto;min-width:0}.sky-picker{display:flex;align-items:center;gap:8px;font-size:12px;color:#a9bfd0}.sky-picker select{min-width:0;flex:1;background:#112439;color:#eafaff;border:1px solid #31506e;border-radius:10px;padding:6px}
.adventure-rail{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;min-width:0;scrollbar-width:thin;touch-action:pan-x}.adventure-chip{flex:0 0 auto;white-space:nowrap;padding:8px 10px;font-size:12px}.adventure-chip.selected{border-color:#68e7ff;background:#153749;color:#b8f4ff}.adventure-chip.locked{color:#a7b8ca}
.adventure-summary{font-size:12px;color:#b9d8e8;line-height:1.4}
#sectorTabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:8px;flex:1;min-height:0;margin:0;overflow:hidden}
#sectorTabs .constellation-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:0;padding:8px;border-radius:14px;overflow:hidden;background:#0e2133}
.constellation-card svg{width:100%;height:clamp(30px,7vh,64px);flex:0 1 auto}.constellation-card strong{max-width:100%;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.constellation-card small{font-size:11px;color:#b9d8e8}.constellation-card.locked{opacity:.55}
.constellation-pages{display:flex;align-items:center;justify-content:center;gap:18px;flex:0 0 auto;font-size:12px}.constellation-pages button{padding:5px 16px}.constellation-pages button:disabled{opacity:.3}
.map-detail{display:flex;flex-direction:column;gap:8px;min-height:0;flex:1}.constellation-back{align-self:flex-start;padding:6px 10px;font-size:12px;flex:0 0 auto}
#mapDetail .puzzle-grid{margin:0;grid-template-columns:repeat(auto-fit,minmax(46px,1fr));gap:6px;flex:0 0 auto;max-height:150px;overflow:hidden}#mapDetail .puzzle-card{min-width:0;min-height:42px;padding:6px}
#mapDetail .performance-legend{margin:0;flex:0 0 auto;gap:8px;font-size:11px}#mapDetail .sky-card{margin:0;min-height:0;flex:1;overflow:hidden;padding:10px;display:flex;flex-direction:column}#mapDetail .sky-svg{flex:1;min-height:0;max-height:200px;width:100%}
#mapModal .my-challenges-entry{flex:0 0 auto;margin:0;padding:8px}#mapModal .sky-tour{margin:0;flex:0 0 auto;padding:8px;gap:4px}
#mapModal:has(.sky-tour:not([hidden])):not([data-tour-target="skyNavigation"]) .sky-navigation{display:none}
.adventure-notice{position:absolute;inset:0;z-index:8;display:flex;align-items:center;justify-content:center;background:rgba(2,8,18,.85);padding:20px;border-radius:20px}.adventure-notice>div{padding:20px;max-width:380px;border:1px solid #31506e;border-radius:18px;background:#102235}.adventure-notice p{font-size:14px;line-height:1.5;color:#bfd1df}
#mapDetail[hidden],#sectorTabs[hidden],#constellationPages[hidden],#adventureNotice[hidden]{display:none}
@media(max-width:700px){
 #mapModal{padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom))}
 #mapModal .map-sheet{width:100%;height:100%;max-height:none;border-radius:20px;padding:10px;gap:6px}
 #mapModal .map-head{min-height:44px}
 #mapModal .sky-navigation{gap:5px}
 #mapModal .adventure-summary{line-height:1.25}
 #mapModal #sectorTabs{gap:7px}
 #mapModal .constellation-pages{min-height:34px}
 #mapDetail{gap:10px;flex:0 1 auto}
 #mapDetail .puzzle-grid{max-height:none;overflow:visible;gap:7px}
 #mapDetail .performance-legend{box-sizing:border-box;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px 42px 12px 12px;column-gap:16px;row-gap:10px;width:100%;max-width:100%;min-width:0;overflow:visible;font-size:13px}
 #mapDetail .performance-legend span{min-width:0;white-space:nowrap;font-size:clamp(11px,3.2vw,13px);gap:6px}
 #mapDetail .performance-legend .performance-icon{width:17px;height:17px}
 #mapDetail .sky-card{padding:8px;flex:0 0 auto;min-height:0;max-height:none}
 #mapDetail .sky-svg{height:190px;flex:0 0 190px;max-height:190px}
 #mapModal .my-challenges-entry{min-height:44px}
}
@media(min-width:701px){#sectorTabs{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.constellation-card strong{font-size:14px}}
@media(max-width:700px){.journey-top{flex:1;min-width:0;width:auto}.journey-top>div{flex:1;overflow:hidden}.journey-quest-progress{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}#journeyTitle{display:none}}
.learning-unlock-overlay{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;background:rgba(3,7,13,.88);padding:24px}
.learning-unlock-card{width:min(520px,100%);border:1px solid rgba(95,220,255,.28);border-radius:22px;padding:24px;background:#0d1828;box-shadow:0 24px 70px rgba(0,0,0,.45);text-align:center}
.learning-unlock-card .primary{margin-top:18px;width:100%}
.badge-unlock-overlay{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;background:rgba(3,7,13,.88);padding:24px}
.badge-unlock-card{width:min(520px,100%);border:1px solid rgba(95,220,255,.28);border-radius:22px;padding:24px;background:#0d1828;box-shadow:0 24px 70px rgba(0,0,0,.45);text-align:center}
.badge-unlock-card .primary{margin-top:18px;width:100%}
.learning-unlock-overlay[hidden],.badge-unlock-overlay[hidden]{display:none!important}

.endgame-overlay{position:fixed;inset:0;z-index:1700;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(circle at 50% 30%,rgba(36,80,120,.36),rgba(2,7,13,.96) 58%);backdrop-filter:blur(8px)}
.endgame-overlay[hidden]{display:none}.endgame-card{width:min(520px,94vw);max-height:90dvh;overflow:auto;padding:28px 24px;text-align:center;border:1px solid rgba(126,231,255,.42);border-radius:28px;background:linear-gradient(180deg,#0d2033,#08131f 72%);box-shadow:0 30px 90px rgba(0,0,0,.6),0 0 52px rgba(104,231,255,.13);color:#eefcff}.endgame-crown{font-size:58px;color:#ffe3a1;text-shadow:0 0 28px rgba(255,213,120,.8);animation:endgamePulse 1.8s ease-in-out infinite}.endgame-kicker{margin-top:4px;color:#68e7ff;font-size:11px;font-weight:950;letter-spacing:.2em}.endgame-card h2{margin:10px 0 8px;font-size:clamp(25px,6vw,34px);line-height:1.05}.endgame-card p{color:#a9bdd0;line-height:1.5}.endgame-summary{display:block;margin:16px 0;color:#dffcff}.endgame-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.endgame-stats div{padding:12px 6px;border:1px solid #29435b;border-radius:14px;background:#0b1a29}.endgame-stats strong{display:block;font-size:24px;color:#ffe3a1}.endgame-stats span{display:block;margin-top:2px;font-size:10px;color:#9fb2c7}.endgame-next{font-size:13px}.endgame-actions{display:grid;gap:9px;margin-top:16px}.endgame-spark{position:fixed;z-index:1695;color:#dffcff;font-size:20px;pointer-events:none;opacity:0;animation:endgameSpark 3.2s ease-out forwards}@keyframes endgameSpark{0%{transform:translateY(24px) scale(.4);opacity:0}18%{opacity:1}100%{transform:translateY(-80px) scale(1.35) rotate(120deg);opacity:0}}@keyframes endgamePulse{50%{transform:scale(1.14);filter:brightness(1.25)}}

@media(max-width:700px){#successOverlay{backdrop-filter:none}}

/* Admin beta cockpit (#115) */
.admin-cockpit{position:fixed;inset:0;z-index:10050;background:rgba(2,8,16,.94);overflow:auto;padding:24px}
.admin-cockpit-shell{max-width:1180px;margin:auto;color:#e9f8ff}
.admin-cockpit-head,.admin-cockpit-filters{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.admin-cockpit-head span{font-size:11px;letter-spacing:.18em;color:#68e7ff}.admin-cockpit-head h2{margin:4px 0 0}
.admin-cockpit section{background:#0c1a28;border:1px solid #183a50;border-radius:16px;padding:16px;margin-bottom:16px}
.admin-cockpit h3{margin:0 0 12px}.admin-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:16px}
.admin-kpi{background:#102335;border:1px solid #1d455e;border-radius:12px;padding:12px}.admin-kpi strong{display:block;font-size:25px}.admin-kpi span{font-size:11px;color:#9eb9c8}
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.admin-grid section{min-width:0}
.admin-bars{display:flex;align-items:flex-end;gap:5px;height:150px}.admin-bar{flex:1;min-width:5px;background:#42d7ff;border-radius:4px 4px 0 0;position:relative}.admin-bar:hover:after{content:attr(data-label);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);white-space:nowrap;background:#06101a;padding:4px 6px;border-radius:5px;font-size:10px}
.admin-retention{display:flex;gap:10px}.admin-retention div{flex:1;text-align:center;background:#102335;border-radius:12px;padding:16px}.admin-retention strong{display:block;font-size:24px}
.admin-funnel-row,.admin-player,.admin-feedback,.admin-alert,.admin-event{display:flex;gap:10px;justify-content:space-between;padding:9px 0;border-bottom:1px solid #173044;font-size:13px}
.admin-player{cursor:pointer}.admin-player:hover{background:#102335}.admin-table-wrap{overflow:auto}.admin-cockpit table{width:100%;border-collapse:collapse;font-size:12px}.admin-cockpit th,.admin-cockpit td{text-align:left;padding:8px;border-bottom:1px solid #173044;white-space:nowrap}
.admin-alert{justify-content:flex-start}.admin-alert strong{color:#ffd37a}.admin-feedback{display:block}.admin-feedback small,.admin-event small{color:#8aa7b8}.admin-cockpit-status{min-height:20px;color:#8fdff3;margin-bottom:8px}
@media(max-width:760px){.admin-cockpit{padding:10px}.admin-kpis{grid-template-columns:repeat(2,1fr)}.admin-grid{grid-template-columns:1fr}.admin-cockpit-head{align-items:flex-start}.admin-cockpit-filters{flex-wrap:wrap}}

/* Account onboarding (#114) */
.account-optin{position:fixed;inset:0;z-index:1420;display:flex;align-items:center;justify-content:center;background:rgba(3,7,13,.88);padding:24px}.account-optin[hidden]{display:none}.account-optin-card{width:min(420px,100%);background:#0d1a29;color:#eefaff;border:1px solid rgba(104,231,255,.35);border-radius:24px;padding:24px;text-align:center;box-shadow:0 18px 70px rgba(0,0,0,.45)}.account-optin-icon{font-size:42px;color:#eaffff;text-shadow:0 0 14px rgba(104,231,255,.9)}.account-optin-card h2{margin:8px 0 10px}.account-optin-card p{color:#bfd0df;line-height:1.45}.account-optin-actions{display:grid;gap:9px;margin-top:18px}.account-optin-actions .primary{background:#68e7ff;color:#07111d;border-color:#68e7ff}.account-saved-toast{position:fixed;z-index:1600;left:50%;bottom:max(28px,env(safe-area-inset-bottom));transform:translateX(-50%);padding:10px 15px;border-radius:999px;background:#102535;color:#dffcff;border:1px solid rgba(104,231,255,.35);font-size:13px;font-weight:850;box-shadow:0 10px 35px rgba(0,0,0,.35)}.account-saved-toast[hidden]{display:none}


/* LUMEN — gameplay energy & staged rewards */
#board{--lumen-energy:0;transition:box-shadow .35s ease,filter .35s ease;background-image:radial-gradient(circle at 50% 50%,rgba(104,231,255,calc(.025 + var(--lumen-energy) * .075)),transparent 72%)}
#board.energy-pulse{animation:lumenEnergyPulse .66s cubic-bezier(.18,.8,.3,1)}
#board.board-half{animation:lumenHalfAwake .82s cubic-bezier(.2,.85,.3,1)}
.cell.just-lit .lumen-orb{animation:guardianArrival .66s cubic-bezier(.16,1.35,.3,1) var(--spark-delay,0ms) both}
.cell.victory-wave{animation:victoryCellWave .9s ease-out var(--victory-delay,0ms) both}
.success-reward{opacity:0;transform:translateY(10px) scale(.88);animation:rewardReveal .48s cubic-bezier(.2,1.35,.35,1) var(--reward-delay,0ms) forwards}
#successRewards.mastery-earned{position:relative}
#successRewards.mastery-earned:after{content:"MAÎTRISE";display:block;margin:12px auto 2px;width:max-content;padding:7px 13px;border:1px solid rgba(104,231,255,.55);border-radius:999px;color:#dffcff;font-size:12px;font-weight:950;letter-spacing:.16em;text-shadow:0 0 12px rgba(104,231,255,.8);box-shadow:0 0 24px rgba(104,231,255,.16);opacity:0;animation:masteryReveal .7s ease 1.05s forwards}
@keyframes lumenEnergyPulse{0%{filter:brightness(1)}42%{filter:brightness(1.28) saturate(1.18);box-shadow:0 24px 70px rgba(0,0,0,.45),0 0 calc(28px + 58px * var(--lumen-energy)) rgba(104,231,255,.38),inset 0 0 0 2px rgba(154,238,255,.34)}100%{filter:brightness(1)}}
@keyframes lumenHalfAwake{0%,100%{filter:brightness(1)}38%{filter:brightness(1.34) saturate(1.22);box-shadow:0 0 52px rgba(104,231,255,.48),inset 0 0 24px rgba(104,231,255,.18)}68%{filter:brightness(1.12)}}
@keyframes guardianArrival{0%{transform:scale(.42);filter:brightness(2.5) drop-shadow(0 0 3px rgba(223,252,255,.95))}52%{transform:scale(1.38);filter:brightness(1.8) drop-shadow(0 0 15px rgba(104,231,255,.95))}78%{transform:scale(.94)}100%{transform:scale(1);filter:brightness(1) drop-shadow(0 0 5px rgba(104,231,255,.38))}}
@keyframes victoryCellWave{0%{filter:brightness(1);transform:scale(1)}42%{filter:brightness(2) saturate(1.28);transform:scale(.94);box-shadow:inset 0 0 0 3px rgba(190,248,255,.78),0 0 30px rgba(104,231,255,.62)}72%{transform:scale(1.025)}100%{filter:brightness(1);transform:scale(1)}}
@keyframes rewardReveal{to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes masteryReveal{0%{opacity:0;transform:scale(.72);filter:brightness(2)}70%{opacity:1;transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){#board.energy-pulse,#board.board-half,.cell.just-lit .lumen-orb,.cell.victory-wave,.success-reward,#successRewards.mastery-earned:after{animation-duration:.01ms!important;animation-delay:0ms!important}}


/* Gameplay V2 #137 — logical consequences stay visual, fast and non-blocking. */
.cell.guardian-impact .lumen-orb{animation:guardianImpact .46s cubic-bezier(.2,1.4,.3,1) both}
.cell.cascade-cross .lumen-dim{animation:cascadeCross .38s ease-out var(--resolve-delay,0ms) both}
.cell.unit-resolved{animation:unitResolved .58s ease-out var(--resolve-delay,0ms) both}
.cell.territory-resolved{animation:territoryResolved .68s ease-out var(--resolve-delay,0ms) both}
@keyframes guardianImpact{0%{transform:scale(.72);filter:brightness(2)}55%{transform:scale(1.28);filter:brightness(1.55);filter:drop-shadow(0 0 12px rgba(104,231,255,.75))}100%{transform:scale(1);filter:brightness(1)}}
@keyframes cascadeCross{0%{opacity:.15;transform:scale(.55)}60%{opacity:1;transform:scale(1.18);filter:brightness(1.5)}100%{opacity:1;transform:scale(1);filter:brightness(1)}}
@keyframes unitResolved{0%,100%{box-shadow:none}45%{box-shadow:inset 0 0 0 1px rgba(104,231,255,.42),0 0 12px rgba(104,231,255,.16);filter:brightness(1.1)}}
@keyframes territoryResolved{0%,100%{filter:brightness(1)}45%{filter:brightness(1.16);box-shadow:inset 0 0 14px color-mix(in srgb,var(--territory) 38%,transparent)}}
@media (prefers-reduced-motion:reduce){.cell.guardian-impact .lumen-orb,.cell.cascade-cross .lumen-dim,.cell.unit-resolved,.cell.territory-resolved{animation-duration:.01ms!important;animation-delay:0ms!important}}
