/* Sky, ink, sunshine and a little arcade energy. One palette across the whole journey. */
:root{color-scheme:light;--bg:#edf7ff;--panel:#fff;--white:#16344f;--muted:#55768c;--blue:#1aabc4;--gold:#ed9f24;--green:#1b8b72;--ink:#16344f;--sky:#37b9ed;--sun:#f9e45d;--pink:#ff859c}
body{background:#122f4c;color:#16344f;background-image:radial-gradient(circle at 18% 24%,#245a73 0,transparent 45%)}
.phone,.phone[data-mode]{color-scheme:light;--bg:#edf7ff;--panel:#fff;--white:#16344f;--muted:#55768c;--blue:#149ab4;--gold:#e69c20;--green:#19856e;--line:#a4c4d4;background:#edf7ff;color:#16344f;border:3px solid #102c45;box-shadow:0 0 0 6px #2f5870,0 0 0 8px #71b1c6}
.device-bar{background:#edf7ff;color:#16344f}.device-island{background:#16344f}.phone[data-mode] .home-indicator{background:#739daf}
.desktop-note,.desktop-footer,.desktop-footer>span{color:#c3e9ed}.tiny-spark{color:#ffe365}
.phone[data-mode] :is(.sound-button,.icon-button){background:#fff;color:#16344f;border:2px solid #16344f;border-radius:8px;box-shadow:0 3px 0 #16344f}
.phone[data-mode] .primary{background:#f9e45d;border:2px solid #16344f;color:#16344f;border-radius:8px;box-shadow:0 4px 0 #16344f;font-size:18px}
.phone[data-mode] .secondary{background:#d9f5f0;border:2px solid #16344f;color:#16344f;border-radius:8px;box-shadow:0 3px 0 #16344f}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px dashed #f17493;outline-offset:4px}button:hover:not(:disabled){filter:brightness(1.035)}
.eyebrow,.screen .eyebrow{color:#247c99;font-size:11px;letter-spacing:1px}.muted,.text-button,.privacy-note,.empty-message,.greeting,.feedback-note,.continue-placeholder,.play-footer{color:#547286}
.welcome{background:#38b9ed;position:relative;overflow-y:auto;padding-bottom:22px}.welcome .topline{padding:17px 23px}.welcome .logo{color:#fff;font-size:22px}.logo-mark:after{color:#16344f}.welcome .logo-mark{color:#f9e45d}.welcome-tag{margin:12px auto 0;display:table;background:#173751;color:#a8f0ed;border:2px solid #0b2c45;padding:5px 9px;font-size:11px;box-shadow:3px 3px 0 #ffffff66;transform:rotate(-2deg)}
.arcade-title{font:58px/.83 var(--pixel);letter-spacing:-2px;text-align:center;color:#fff;transform:rotate(-4deg);margin:23px 15px 0;text-shadow:3px 0 #15354e,-2px 0 #15354e,0 -2px #15354e,0 3px #15354e,5px 6px #15354e;position:relative;z-index:2}.arcade-title span{display:block;color:#f9e45d;font-size:74px;letter-spacing:-3px}.welcome-subtitle{text-align:center;color:#103d59;font-size:14px;margin-top:15px;line-height:1.35}
.welcome .hero-world{margin:17px 16px 0;flex:1 0 200px;min-height:190px;max-height:270px;border:3px solid #16344f;border-radius:12px;box-shadow:4px 5px 0 #16344f;transform:rotate(1deg)}.world-caption{background:#15354ef2;color:#fff;border-color:#a2e7df;border-radius:4px}.live-dot{background:#f9e45d}.hero-characters{margin-top:-16px;gap:22px}.hero-characters .sprite{filter:drop-shadow(2px 3px 0 #123e4b66)}.welcome-bottom{padding-top:5px}.feature-line,.welcome-note{color:#123f59}.feature-line{font-size:13px;margin-bottom:13px}.feature-line i{background:#146b8a}.welcome-note{font-size:12px;margin-top:13px}.welcome .primary{min-height:56px}
.name-input{background:#fff;border:2px solid #83b6c8;color:#16344f;border-radius:8px}.name-input::placeholder{color:#7292a7}.name-label,.character-help{color:#41677e}.step-dots span{background:#bed9e5}.step-dots span.active{background:#1ab3c2}.character-card{background:#fff;border:2px solid #a3c9d8;border-radius:12px;box-shadow:0 3px 0 #bddae5}.character-card.selected{background:#fff1a4;border-color:#183c56;box-shadow:0 4px 0 #183c56}.character-card>span,.character-card.selected :is(strong,span){color:#34546a}.character-card strong{color:#16344f}
.phone[data-mode] .bottom-nav{background:#fff;border-top:2px solid #bad4e1;padding-top:9px}.phone[data-mode] .nav-item{font-size:11px;color:#638297;gap:4px}.phone[data-mode] .nav-item.active{color:#146f8d}.phone[data-mode] .nav-item.active svg{background:#fff19c;border-radius:4px}.bottom-nav svg{width:21px;height:21px}
.phone[data-mode] .avatar-button{background:#fff;border:2px solid #16344f;border-radius:9px;box-shadow:0 3px 0 #bdd5e0}.avatar-button span{color:#16344f}.phone[data-mode] .map-progress{color:#436d83}.phone[data-mode] .progress-track{background:#c3e0eb;border-radius:9px}.progress-track>div{background:#35bcb5;border-radius:9px}.star-count{color:#a66311}.map-heading h1{color:#173a55;font-size:25px}.map-header{padding-top:16px}
.phone[data-mode] .world-tab{background:#fff;color:#416b80;border:2px solid #a9cbd9;border-radius:6px}.phone[data-mode] .world-tab.active{background:#f9e45d;color:#16344f;border:2px solid #16344f}.phone[data-mode] .world-tab.locked.active{background:#cbdce9;color:#31526b;border-color:#7797ad}.world-banner h2{color:#153b55}.phone[data-mode] .world-banner p{color:#577f91}.phone[data-mode] .world-count{color:#356176;border-color:#9cc8d9;background:#d9f1fa;border-radius:6px}.world-return{padding:8px 20px 0;background:none;border:0;text-align:left;color:#1c7c98;font-size:12px}
.journey-scroll{border:3px solid #194e63;border-radius:12px;box-shadow:0 4px 0 #abd7dd}.journey-sign{background:#164d60;border-color:#98dbd8;color:#fff;border-radius:4px}.phone[data-mode] .level-node.current{background:#f9e45d;border:3px solid #fff9c0;color:#15374d;box-shadow:0 5px 0 #805f2f,0 0 0 3px #173d4f;animation:goal-bob 2s ease-in-out infinite}.phone[data-mode] .level-node.complete{background:#35cbb6;border-color:#e7fff4;color:#153b4d}.phone[data-mode] .level-node:disabled{background:#6c8d93;border-color:#c1dbd6;color:#edf6ed}.node-label{color:#16344f;background:#fff2a6;border:2px solid #16344f;border-radius:4px}.world-lock-card{background:#183b56ed;border-color:#91d4e6;color:#fff;border-radius:12px}.world-lock-card p,.world-lock-number{color:#c5e6ec}.world-lock-overlay{background:#102e4c26}.world-lock-icon{color:#f9e45d}
.phone[data-mode] .level-sheet{background:#f6fcff;border:3px solid #16344f;border-radius:15px 15px 0 0;box-shadow:0 -5px 0 #71c3d444}.phone[data-mode] .level-sheet p{color:#4b7389}.sheet-backdrop{background:#0a294b9c}.sheet-handle{background:#aacbd8}.level-sheet h2{color:#183f59}
.game-scene,.game-screen.long-text .game-scene{border:3px solid #2c6776;border-radius:10px}.dialogue-area,.game-screen.long-text .dialogue-area{background:#fffdf1;border:2px solid #296276;border-radius:7px;box-shadow:3px 3px 0 #19445e33}.dialogue-area:after{background:#fffdf1;border-color:#296276}.dialogue-area.player,.dialogue-area.player:after{background:#fff1ac}.dialogue-area :is(.speaker,.dialogue,.listen-button),.speaker,.dialogue-area.player .speaker,.dialogue-area.response .speaker{color:#193d51}.dialogue{font-size:18px}.scene-reaction{background:#fff5cdef;color:#174154;border-color:#44798a;border-radius:6px}.scene-place,.scene-time{background:#163e55ed;color:#fff;border-color:#9adae0;border-radius:4px}.walking-label{background:#fff1a4;color:#16344f;border-color:#193f58}.phone[data-mode] .choice,.game-screen.long-text .choice{background:#fff;color:#1a4055;border:2px solid #a3c5d4;border-radius:8px;box-shadow:0 3px 0 #bed5df;font-size:15px}.choice-letter{background:#d2f2f3;color:#17697d;border-radius:4px}.choice:hover:not(:disabled){background:#fff7c6;border-color:#193e55}.choice-hint{color:#4d7d91}.feedback-note strong{color:#177a68}.question-progress span{background:#b5cedd}.question-progress span.done{background:#24b6a7}
.phone[data-mode] :is(.review-card,.profile-hero,.stat,.journal-card){background:#fff;border:2px solid #bad4e1;border-radius:10px;color:#20465e}.phone[data-mode] .review-card :is(.eyebrow,.review-row),.phone[data-mode] .journal-card :is(p,small){color:#41667c}.profile-hero p,.phone[data-mode] .stat p{color:#5c7a8f}.setting-row{border-color:#bdd6e1}.phone[data-mode] .learning-details,.phone[data-mode] .learning-details summary{background:#e0f1f6;color:#365e75;border-color:#9fc5d6}.phone[data-mode] .toast{background:#163b55;color:#fff7d0;border:2px solid #f9e45d;border-radius:8px}.result-stars .result-star{filter:none}.result-star.earned{color:#e7b130}
/* The atlas dashboard: little worlds with real hit areas over hand-drawn dioramas. */
.atlas-screen{background:#112e4c;color:#fff;overflow:hidden}.atlas-scroll{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none}.atlas-header{padding:20px 20px 9px;display:flex;justify-content:space-between;gap:8px;align-items:center}.atlas-header .eyebrow{color:#8be1e2;font-size:10px}.atlas-header h1{font:31px/1 var(--pixel);margin-top:5px;color:#fff}.atlas-header h1 em{color:#f9e45d;font-style:normal}.atlas-profile{border:2px solid #72d1d4;background:#1d4963;border-radius:9px;width:49px;height:59px;padding:2px;display:grid;place-items:center}.atlas-profile canvas{width:26px;height:48px}.atlas-stats{display:flex;gap:8px;padding:0 20px 9px;align-items:center;font-size:12px;color:#b6dfe6}.atlas-stats span{border:1px solid #3a788f;border-radius:4px;padding:5px 8px}.atlas-stats span:first-child{color:#ffe66b}.atlas-stage{position:relative;width:100%;aspect-ratio:384/462;overflow:hidden;background:#112e4c}.atlas-layer{position:absolute;inset:0;transition:transform .85s cubic-bezier(.4,0,.2,1),opacity .85s}.atlas-layer.zooming{transform:scale(3.8);opacity:0}.atlas-stage canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}.island-hit{position:absolute;width:44%;height:24%;padding:0;border:0;background:none;color:#fff;transform:translate(-50%,-44%);display:flex;align-items:flex-end;justify-content:center;isolation:isolate}.island-hit>span{display:block;font-size:12px;background:#12364cee;border:1px solid #69b6c3;border-radius:4px;padding:5px 7px;line-height:1.1;box-shadow:2px 2px 0 #071e31;white-space:nowrap}.island-hit small{color:#9ee5e3;font-size:10px;margin-right:5px}.island-hit.is-current>span{border:2px solid #ffe46c;color:#ffe46c}.island-hit.is-locked>span{color:#c5d9e4}.island-hit:hover>span{background:#246782;transform:translateY(-2px)}.island-hit:focus-visible{outline-offset:-10px;border-radius:16px}.atlas-secret{position:absolute;border:0;background:none;color:#fff7a4;width:36px;height:38px;padding:0;font:22px var(--pixel);z-index:2}.atlas-secret.balloon{left:79%;top:77%;color:transparent;width:42px;height:50px}.atlas-secret.star{left:50%;top:83%;font-size:20px;animation:twinkle 2.7s infinite}.atlas-help{position:absolute;left:16px;top:5px;font-size:10px;color:#83c8d5;pointer-events:none}.intro-caption{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);padding:12px 16px;border:2px solid #fff19b;background:#153953ee;color:#fff7c8;font-size:15px;white-space:nowrap;pointer-events:none;animation:caption-in 2s both}.intro-skip{position:absolute;right:12px;bottom:3px;background:#173d55;border:1px solid #78b5c8;color:#d6f3f6;border-radius:4px;padding:7px;font-size:11px}
.next-quest{display:flex;align-items:center;gap:13px;width:calc(100% - 32px);margin:5px 16px 12px;padding:12px;text-align:left;background:#fff1a0;color:#173b52;border:2px solid #082c46;border-radius:9px;box-shadow:0 4px 0 #071e34}.next-quest .quest-mark{height:38px;width:38px;display:grid;place-items:center;background:#ff8099;border:2px solid #193d55;border-radius:8px;font-size:23px;flex-shrink:0}.next-quest small{font-size:10px;letter-spacing:.5px}.next-quest strong{display:block;font-size:18px;margin-top:2px}.next-quest .quest-arrow{margin-left:auto;font-size:24px}.atlas-bottom-links{display:flex;justify-content:center;gap:20px;padding-bottom:15px}.atlas-bottom-links button{background:none;border:0;color:#9ddce1;font-size:12px}.atlas-screen .bottom-nav{flex-shrink:0}.map-secret{position:absolute;border:0;background:none;font:24px var(--pixel);color:#ffe18a;padding:6px;width:40px;height:40px;filter:drop-shadow(1px 2px 0 #37565d);z-index:2}.map-secret.found{opacity:.45}.scene-secret{position:absolute;right:7%;top:19%;background:none;border:0;color:#ffed9e;font-size:17px;z-index:2;width:32px;height:32px;animation:twinkle 3s infinite}
/* Optional side quests and a collectible field journal. */
.side-content{padding:20px 20px 28px;flex:1;min-height:0;overflow-y:auto}.side-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px}.side-heading h1{font-size:29px;line-height:1}.side-heading p{font-size:13px;color:#5b7e92;margin-top:6px}.arcade-banner{background:#29b5d2;color:#0d3e56;border:2px solid #16344f;border-radius:12px;padding:15px;box-shadow:3px 4px 0 #16344f;margin-bottom:20px;position:relative}.arcade-banner h2{font-size:30px;color:#fff;text-shadow:2px 2px #18516e}.arcade-banner p{font-size:13px;margin:7px 0 0;line-height:1.4}.minigame-cards{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-bottom:25px}.minigame-card{display:flex;flex-direction:column;text-align:left;padding:14px 11px;border:2px solid #173f56;border-radius:11px;min-height:160px;box-shadow:0 4px 0 #173f56;background:#ffdf90;color:#193f56}.minigame-card:nth-child(2){background:#c3b8fa}.minigame-card .mini-symbol{font-size:35px;line-height:1;margin-bottom:10px}.minigame-card strong{font-size:20px;line-height:1}.minigame-card small{margin-top:8px;font-size:12px;line-height:1.3}.collection-title{display:flex;align-items:center;justify-content:space-between;font-size:22px}.collection-title span{font-size:13px;color:#477b91}.collection-hint{font-size:13px;color:#5a7c90;line-height:1.4;margin:7px 0 14px}.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.discovery-card{border:2px dashed #b1ceda;background:#e1eef5;border-radius:9px;min-height:100px;padding:10px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#7d9aaa;text-align:center}.discovery-card.found{border:2px solid #61baa9;background:#e7fff2;color:#205f5a}.discovery-card span{font-size:29px;line-height:1}.discovery-card small{font-size:11px;line-height:1.2}.discovery-icon{font-size:56px;background:#c9f4ee;border:2px solid #173d55;border-radius:12px;width:90px;height:90px;display:grid;place-items:center;margin:0 auto 15px;color:#237f89}.discovery-popup .level-sheet{text-align:center}.discovery-popup .primary{margin-top:18px;width:100%}
.mini-progress{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#47798f;margin:12px 0}.memory-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.memory-card{min-height:83px;border:2px solid #153e55;border-radius:9px;background:#288bb1;box-shadow:0 4px 0 #153e55;color:#fef2b0;font-size:25px;position:relative}.memory-card small{display:block;font-size:10px;color:#658297}.memory-card.revealed{background:#fff8cb;color:#173e54;font-size:21px}.memory-card.matched{background:#cdf3dc;color:#256859;border-color:#3c9c86;box-shadow:0 3px 0 #3c9c86}.mini-status{min-height:43px;margin-top:18px;color:#416f85;font-size:14px;line-height:1.4;text-align:center}.mini-win{padding:25px 15px;background:#e4fff1;border:2px solid #339b82;border-radius:12px;text-align:center;margin-top:24px}.mini-win h2{font-size:29px;color:#1a776a}.mini-win p{font-size:14px;line-height:1.4;margin:10px 0 18px}.mini-win .primary{width:100%}.firefly-meadow{border:3px solid #143e55;border-radius:12px;min-height:340px;background:#173b56;position:relative;padding:20px 13px;color:#fff;overflow:hidden;background-image:radial-gradient(circle at 15% 20%,#95e3c546 0 1px,transparent 2px);background-size:23px 29px}.firefly-target{text-align:center;font-size:14px;color:#b2e4e5}.firefly-target strong{display:block;font-size:35px;color:#ffe77c;margin:8px 0 28px}.firefly-choice{position:relative;display:block;margin:17px auto;padding:11px 18px;min-width:146px;border:2px solid #f8e37c;background:#2b6570;color:#ffffc7;border-radius:24px;box-shadow:0 0 22px #e5e76b22;font-size:21px;animation:float-fly 3s ease-in-out infinite}.firefly-choice:nth-of-type(2){left:-34px;animation-delay:-1s}.firefly-choice:nth-of-type(3){left:27px;animation-delay:-2s}.firefly-choice::before{content:'✧';color:#fffaa4;margin-right:10px}
@keyframes goal-bob{50%{transform:translate(-50%,-3px)}}@keyframes float-fly{50%{transform:translateY(-5px)}}@keyframes twinkle{50%{opacity:.35;transform:scale(.85)}}@keyframes caption-in{0%{opacity:0}25%,70%{opacity:1}100%{opacity:0}}
@media(max-width:520px){body,.phone[data-mode=adventure]{background:#edf7ff}.phone,.phone[data-mode]{border:0;box-shadow:none}.welcome{padding-top:4px}.arcade-title{font-size:51px;margin-top:17px}.arcade-title span{font-size:65px}.atlas-header{padding-top:18px}.atlas-header h1{font-size:29px}.atlas-stage{margin-top:-3px}.atlas-stats{padding-bottom:1px}}
@media(max-height:760px){.arcade-title{font-size:43px;margin-top:11px}.arcade-title span{font-size:57px}.welcome-tag{margin-top:3px;font-size:10px}.welcome-subtitle{font-size:12px;margin-top:9px}.welcome .hero-world{min-height:155px;margin-top:11px;max-height:210px}.atlas-header h1{font-size:26px}.atlas-header{padding-top:12px}.next-quest strong{font-size:16px}.next-quest{padding:9px}.atlas-header .eyebrow{font-size:9px}}
/* Separate floating islands replace the flat bottom toolbar. */
.phone[data-mode] .island-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;background:#112e4c;border:0;padding:10px 10px max(23px,env(safe-area-inset-bottom));position:relative;isolation:isolate;flex-shrink:0}
.island-nav:before{content:'';position:absolute;left:7%;right:7%;top:45%;border-top:2px dotted #69a6bc55;z-index:-1}
.phone[data-mode] .island-nav-item{min-width:0;min-height:83px;padding:0 1px;display:flex;flex-direction:column;justify-content:flex-end;gap:0;color:#d7e9f2;font-size:12px;line-height:1.2;border-radius:8px;transition:filter .16s}
.phone[data-mode] .island-nav-item.active{color:#ffed9b}
.nav-island{position:relative;display:block;width:72px;max-width:100%;height:64px;animation:menu-island-float 4s ease-in-out infinite;transition:filter .2s}
.island-nav-item:nth-child(2) .nav-island{animation-delay:-1s}.island-nav-item:nth-child(3) .nav-island{animation-delay:-2s}.island-nav-item:nth-child(4) .nav-island{animation-delay:-3s}
.phone[data-mode] .island-nav .nav-island-art,.phone[data-mode] .island-nav .active .nav-island-art{width:100%;height:64px;background:none;border-radius:0;overflow:visible;display:block}
.island-nav-item.active .nav-island{filter:drop-shadow(0 -2px 0 #ffe58a) drop-shadow(0 0 5px #ffe58a44)}
.nav-island-spark{position:absolute;top:1px;left:3px;font-size:12px;color:#fff0a1;opacity:0}
.island-nav-item.active .nav-island-spark{opacity:1}
.nav-island-label{display:block;white-space:nowrap;padding:3px 4px 4px;border:1px solid transparent;max-width:100%}
.island-nav-item.active .nav-island-label{border-color:#b5a467;background:#244859;border-radius:4px}
.island-nav-item:hover .nav-island{filter:drop-shadow(0 -2px 0 #b6eeed)}
.phone[data-mode] .island-nav-item:focus-visible{outline:2px dashed #fff2a3;outline-offset:0}
.phone[data-mode] .island-nav-item:active{transform:translateY(2px)}
@keyframes menu-island-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:350px){.phone[data-mode] .island-nav{padding-left:6px;padding-right:6px;gap:0}.phone[data-mode] .island-nav-item{font-size:11px}.nav-island-label{padding-left:2px;padding-right:2px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.atlas-layer.zooming{transform:none;opacity:1}}