/* MUDA MAX v4.2 - Three separate screen surfaces, one obvious bottom navigator */
.muda-screen[hidden]{display:none!important}
body{padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}
body[data-screen='roadmap'] .app-command,body[data-screen='sky'] .app-command{display:none}
body[data-screen='roadmap'] .command-scrim,body[data-screen='sky'] .command-scrim{display:none!important}
.screen-heading{display:flex;justify-content:space-between;align-items:center;gap:13px;padding:19px 20px;margin:0 0 13px;border:1px solid #a586ed83;border-radius:20px;background:radial-gradient(ellipse at 100% 0,#9860ff36,transparent 60%),#1c1b3b}
.screen-heading small{display:block;color:#b8ff79;font-size:10px;font-weight:950;letter-spacing:.14em}
.screen-heading h1{font-size:clamp(23px,4vw,33px);margin:5px 0 4px;letter-spacing:-.055em}
.screen-heading p{margin:0;color:#cfcbe8;font-size:12px;line-height:1.6}
.screen-mini-btn{background:#36405a;border:1px solid #c3ff8d86;border-radius:13px;color:#ecffdd;font-weight:900;padding:11px 13px;flex-shrink:0}
#screenHome>.screen-heading{margin-bottom:12px}
#screenHome .hero{margin:16px 0}
#screenHome .statbar{margin-bottom:10px}
#screenHome .install-panel{margin-top:6px}
#screenRoadmap .roadmap-hub{margin-top:0}
#screenRoadmap .roadmap-scroll{max-height:min(65vh,700px)}
.muda-dock{position:fixed;bottom:0;left:0;right:0;z-index:155;background:#101326f6;border-top:1px solid #958ade83;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);padding:8px max(12px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));display:flex;justify-content:center;gap:clamp(7px,2vw,16px);box-shadow:0 -14px 40px #030412ba}
.muda-dock-btn{color:#c6c2de;background:transparent;min-width:0;width:min(29vw,170px);min-height:58px;padding:5px 7px;border-radius:16px;border:1px solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:transform .14s,background .14s}
.muda-dock-btn strong{font-size:11px;letter-spacing:-.015em}.muda-dock-btn .dock-emoji{font-size:23px;line-height:1.12}
.muda-dock-btn.active{background:linear-gradient(120deg,#b8ff78,#89f1e8);color:#1d2431;border-color:#d8ffb1;box-shadow:0 3px 16px #a4fa8c27}
.muda-dock-btn:active{transform:scale(.96)}.muda-dock-btn:focus-visible{outline:3px solid #ffe982;outline-offset:2px}
#roadmapCelebration{bottom:calc(82px + env(safe-area-inset-bottom,0px))}
#screenSky{min-height:70vh}
.sky-intro{padding:23px;border:1px solid #a694ea88;border-radius:24px;background:radial-gradient(circle at 89% 3%,#5834a6aa,transparent 50%),#17182f;position:relative;overflow:hidden}
.sky-eyebrow{font-size:10px;font-weight:1000;letter-spacing:.18em;color:#7ff2ff}
.sky-intro h1{font-size:clamp(27px,5vw,43px);margin:5px 0 7px;letter-spacing:-.065em;line-height:1.18}
.sky-intro p{color:#c6c4e4;font-size:13px;line-height:1.7;margin:0}
.sky-stats{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.sky-chip{border:1px solid #736da79c;border-radius:999px;padding:7px 12px;background:#222646bd;font-size:11px;font-weight:800;color:#dff3ff}
.sky-universe{position:relative;height:clamp(290px,57vw,465px);border-radius:22px;overflow:hidden;border:1px solid #5b7ac6b8;margin:14px 0;background:radial-gradient(circle at 72% 30%,#5e31bcad,transparent 34%),radial-gradient(circle at 12% 85%,#007b9e66,transparent 45%),linear-gradient(135deg,#08142d,#110b28 62%,#0c2135)}
.sky-universe::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.48;background-image:radial-gradient(circle,#fff9 1.3px,transparent 1.9px),radial-gradient(circle,#d4aaffd0 1px,transparent 1.6px);background-size:51px 53px,89px 101px;background-position:0 0,29px 37px}
.sky-universe::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at center,transparent 35%,#0205128a 100%)}
.sky-object{position:absolute;left:var(--sx);top:var(--sy);z-index:2;transform:translate(-50%,-50%);display:grid;place-items:center;width:clamp(48px,10vw,78px);height:clamp(48px,10vw,78px);background:#342d66a8;border:1px solid #ffffff70;border-radius:50%;font-size:clamp(25px,5vw,40px);box-shadow:0 0 24px #9e78ff61;animation:sky-float 4.5s ease-in-out infinite alternate;animation-delay:var(--delay)}
.sky-object:hover,.sky-object:focus-visible{border-color:#e8ff98;box-shadow:0 0 0 3px #cfff9954,0 0 30px #8bffde}
.sky-object.found{background:#214c54d9;border-color:#8effd5}.sky-object.found::after{content:'✓';position:absolute;right:-3px;top:-8px;font-size:13px;border-radius:100%;background:#c8ff7b;color:#17231b;width:22px;height:22px;display:grid;place-items:center;font-weight:1000}
.sky-label{position:absolute;z-index:2;bottom:13px;left:14px;right:14px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;pointer-events:none;color:#d3efff;font-size:11px;font-weight:800;text-shadow:0 2px 10px #000}
.sky-panel{padding:16px;border:1px solid #9c90d27a;background:linear-gradient(145deg,#24213e,#18253c);border-radius:18px;margin:11px 0}
.sky-panel h2{font-size:17px;margin:0 0 6px}.sky-panel p{color:#c5c2dc;font-size:12px;margin:0 0 12px;line-height:1.7}
.sky-message{background:#0d1530;padding:14px 16px;border-radius:13px;border:1px solid #6577b6a3;min-height:76px;color:#e3efff;font-size:14px;line-height:1.65;margin-top:12px}
.sky-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sky-ctrls{display:flex;flex-wrap:wrap;gap:8px}
.sky-btn{color:#eaf8ff;font-size:13px;font-weight:900;background:#343261;border:1px solid #b19bf598;border-radius:12px;padding:11px 14px;min-height:44px}
.sky-btn.primary{background:#c8ff7a;color:#21332c;border-color:#d9ffac}
.sky-btn:active{transform:scale(.97)}.sky-btn:focus-visible{outline:3px solid #fff1a3;outline-offset:2px}
.sky-result{color:#f9eab4;font-size:12px;min-height:32px;margin-top:8px;line-height:1.6}
.sky-counter{font-size:36px;font-weight:1000;color:#b8ff85;margin:4px 0}
.sky-name-row{display:flex;flex-wrap:wrap;gap:8px}
.sky-name-row input{color:#fff;background:#10172e;border:1px solid #8684c5;border-radius:11px;min-width:120px;flex:1;padding:11px 12px}
.sky-name-row input:focus-visible{outline:3px solid #c8ff79}
@keyframes sky-float{from{translate:0 -3px}to{translate:0 7px}}
@media(max-width:650px){.sky-grid{grid-template-columns:1fr}.sky-intro{padding:18px}.sky-object{width:53px;height:53px;font-size:29px}.screen-heading{padding:14px}.screen-mini-btn{font-size:11px;padding:10px}.sky-universe{height:340px}.muda-dock{gap:4px}.muda-dock-btn{width:33.33%;min-height:57px}.muda-dock-btn strong{font-size:11px}body{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))}}
@media(max-width:390px){.muda-dock-btn strong{font-size:10px}}
@media(prefers-reduced-motion:reduce){.sky-object{animation:none}.muda-dock-btn{transition:none}}

.sky-ship{position:absolute;left:50%;top:50%;z-index:3;font-size:36px;line-height:1;transform:translate(-50%,-50%);filter:drop-shadow(0 0 12px #83faff);pointer-events:none;transition:left .22s ease,top .22s ease}
@media(prefers-reduced-motion:reduce){.sky-ship{transition:none}}


/* v4.4 shell tweaks */
#screenHome .screen-heading{display:none}
#screenHome .statbar{margin:0 0 12px}
#screenHome #playSurface{margin-top:0}
#screenRoadmap{padding-top:0}

body[data-screen="roadmap"] .top{display:none}
#screenHome .statbar{margin:0 0 14px}
#screenHome #playSurface{margin:0}
