/* MUDA MAX 4.7 — connected game dashboard & handheld space explorer */
#screenHome{--gold:#ffe080;--ink:#11162e}
#screenHome .muda-home-hero{min-height:330px;margin:3px 0 12px;border:2px solid #dfb958;background:
  radial-gradient(ellipse at 73% 39%,#e967b36b,transparent 33%),
  radial-gradient(ellipse at 20% 4%,#648cfd75,transparent 60%),
  linear-gradient(150deg,#272252,#121938 63%,#122b41);box-shadow:0 14px 0 #0e142a,0 19px 42px #060a1c;isolation:isolate;padding:27px 25px 124px;overflow:hidden}
#screenHome .muda-home-hero:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:.72;background-image:radial-gradient(#fff 1px,transparent 1px),linear-gradient(115deg,transparent 68%,#80ebf31b 70%,transparent 72%);background-size:39px 40px,100% 100%}
#screenHome .hero-ribbon{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;background:#fff1a6;color:#2a2344;border-radius:999px;font-size:10px;font-weight:1000;letter-spacing:.045em;box-shadow:0 3px 0 #ad7b34}
#screenHome .muda-home-hero .hero-content{max-width:min(620px,68%);margin-top:9px}
#screenHome .muda-home-hero .eyebrow{margin-top:6px}
#screenHome .muda-home-hero h1{margin:8px 0 5px;font-size:clamp(40px,7vw,69px);filter:drop-shadow(0 5px 1px #14142e)}
#screenHome .muda-home-hero .sub{font-size:11px;margin-top:7px;color:#e1dafa}
#screenHome .muda-home-hero p{font-size:12px}
#screenHome .muda-home-hero .hero-emoji{top:25px;right:9%;font-size:clamp(93px,18vw,184px);text-shadow:0 7px #14132d;filter:drop-shadow(0 8px 10px #0008)}
#screenHome .hero-game-badge{position:absolute;top:110px;right:1%;z-index:1;transform:rotate(11deg);font-size:10px;line-height:1.1;padding:7px 12px;color:#3b250a;background:linear-gradient(#fff8bc,#ffaa43);border:3px solid #fff4a9;border-radius:12px;box-shadow:0 4px 0 #9a5f28;font-weight:1000}
#screenHome .hero-game-badge b{font-size:13px}
#screenHome .hero-cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
#screenHome .hero-cta button{min-height:43px;padding:10px 14px;border:2px solid #fff5ac;border-radius:12px;background:linear-gradient(#ffec93,#ffa623);box-shadow:0 5px 0 #a36328;color:#30233e;font-size:12px;font-weight:1000}
#screenHome .hero-cta button+button{color:#fef9ff;background:linear-gradient(#6960b7,#47337f);border-color:#d6baff;box-shadow:0 5px 0 #232043}
#screenHome .hero-cta button:active{transform:translateY(4px);box-shadow:0 1px #9e6a3e}
#screenHome .muda-home-hero .statbar{position:absolute;bottom:10px;left:15px;right:15px;margin:0;gap:8px;z-index:3}
#screenHome .muda-home-hero .stat{padding:11px 12px;border:1px solid #ecd27f;border-radius:13px;background:linear-gradient(150deg,#33315bfa,#171f40f5);box-shadow:inset 0 1px #fff5,0 4px #12172c}
#screenHome .muda-home-hero .stat small{font-size:11px;color:#ffdf91;white-space:nowrap}
#screenHome .muda-home-hero .stat strong{font-size:clamp(21px,4vw,30px);color:#e9ffcb}
#screenHome .home-quick{margin:18px 0 15px;padding:14px 16px;border:1px solid #7cd5dc80;background:linear-gradient(105deg,#182a43,#252346);border-radius:19px;box-shadow:0 7px 17px #0003}
.quick-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:9px}.quick-heading strong{color:#ffffd6;font-size:15px}.quick-heading span{font-size:11px;color:#b9d9e7}.quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.quick-actions button{padding:14px 7px;min-height:56px;border-radius:13px;border:2px solid #d5eff2;color:#fff;background:linear-gradient(145deg,#554797,#323367);font-weight:1000;font-size:13px;box-shadow:0 4px 0 #152141}.quick-actions button:nth-child(2){background:linear-gradient(145deg,#c64a98,#81366b)}.quick-actions button:nth-child(3){background:linear-gradient(145deg,#3798b5,#306189)}.quick-actions button:active{transform:translateY(3px);box-shadow:0 1px #152141}
#screenHome .play-surface{padding:12px;border:2px solid #9d90dd88;background:linear-gradient(140deg,#151d3a,#201d47);border-radius:23px;box-shadow:0 8px 25px #0004}
#screenHome .muda-mission-hud{position:relative;top:auto;z-index:1;display:block;border:3px solid #fce796;border-radius:19px;padding:0;background:linear-gradient(130deg,#302957,#29385e);box-shadow:0 6px 0 #654c35,0 14px 25px #0005;margin:0 0 14px;overflow:hidden}
.muda-mission-top{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:8px 14px;color:#3c270d;background:linear-gradient(#fff7b1,#ffc44e);font-weight:1000;font-size:12px}
#mudaMissionBack{padding:7px 12px;min-height:34px;background:#37284e;border:1px solid #fff6d0;border-radius:10px;color:#fff;font-weight:1000;font-size:11px;white-space:nowrap}
.muda-mission-main{display:flex;align-items:center;gap:13px;padding:13px 16px 7px}
.muda-mission-icon{font-size:43px;filter:drop-shadow(0 3px #181733)}.muda-mission-copy{gap:4px}
.muda-mission-copy small{font-size:12px;color:#f1dfad}.muda-mission-copy strong{font-size:clamp(17px,2.9vw,23px);color:#e5ffa6}.muda-mission-copy span{font-size:clamp(13px,2vw,16px);font-weight:850;color:#fff}
#mudaMissionCount{color:#fff9c1;font-size:clamp(19px,3vw,29px);white-space:nowrap;letter-spacing:-.02em}
.muda-mission-meter{height:13px;background:#0e1632;border:1px solid #959cc3;margin:9px 15px 0;border-radius:99px;overflow:hidden}.muda-mission-meter span{display:block;background:linear-gradient(90deg,#6fe2cb,#b7fb72,#fff09b);height:100%;width:0;transition:width .25s ease}
.muda-mission-foot{font-size:11px;padding:8px 16px 13px;color:#dcd9ee}
#screenHome .now-playing{padding:6px 2px 10px}

/* Space board: a real play space at the top, with independently scrolling lower panels. */
body[data-screen="sky"] .top{display:none}
body[data-screen="sky"] main{padding-top:3px}
body[data-screen="sky"] #screenSky{display:flex;flex-direction:column;height:calc(100dvh - 83px - env(safe-area-inset-bottom,0px));min-height:460px;gap:7px;overflow:hidden;padding:0 1px}
#screenSky .sky-intro{flex:0 0 auto;padding:12px 16px;border:2px solid #ae9bff;border-radius:17px;background:radial-gradient(circle at 90% 50%,#7a49ba70,transparent 50%),#161a39}
#screenSky .sky-intro h1{font-size:25px;margin:3px 0}
#screenSky .sky-intro p{font-size:11px;line-height:1.3}
#screenSky .sky-stats{margin-top:5px;gap:5px}
#screenSky .sky-chip{padding:4px 9px;font-size:10px}
.sky-quest{flex:0 0 auto;border:2px solid #d6c77a;border-radius:15px;background:linear-gradient(120deg,#2c326a,#233d59);padding:9px 12px;color:#fff;box-shadow:0 4px 0 #1a1b39}
.sky-quest-heading,.sky-quest-row,.sky-quest-sub{display:flex;align-items:center;justify-content:space-between;gap:7px}
.sky-quest-heading{color:#f9de8d;font-weight:950;font-size:10px;letter-spacing:.05em}.sky-quest-row{margin-top:4px}.sky-quest-row strong{font-size:clamp(13px,3vw,17px)}.sky-quest-row span{font-size:14px;font-weight:1000;color:#cdffa7}
.sky-quest-meter{height:8px;margin-top:7px;border-radius:99px;background:#10152b;border:1px solid #aaaae5;overflow:hidden}.sky-quest-meter>div{height:100%;width:0;background:linear-gradient(90deg,#51d8ef,#e4ff7a);transition:width .2s}
.sky-quest-sub{color:#e4dffa;font-size:10px;font-weight:800;margin-top:4px}
.sky-quest.completed{border-color:#9eff8f}#skyQuestRestart{min-height:37px;width:100%;font-size:12px;border:0;border-radius:10px;font-weight:1000;color:#2c2540;background:linear-gradient(#fff09f,#ffbc47);margin-top:7px}#skyQuestRestart[hidden]{display:none}
#screenSky .sky-universe{flex:1 1 42%;height:0;min-height:190px;margin:0;border-radius:16px;border:2px solid #58cce7;box-shadow:inset 0 0 45px #9a67fe2d,0 7px 21px #0008;background:radial-gradient(circle at 42% 45%,#4c1e8f99,transparent 36%),radial-gradient(circle at 65% 15%,#106a9e95,transparent 55%),linear-gradient(#11102c,#06192f)}
#screenSky .sky-universe:before{opacity:.9}#screenSky .sky-universe:after{opacity:.4}
#screenSky .sky-object{width:clamp(36px,7vw,52px);height:clamp(36px,7vw,52px);font-size:clamp(22px,5vw,30px);z-index:4}
#screenSky .sky-object.quest-target{border:3px solid #fff77c;box-shadow:0 0 0 4px #fcf68b44,0 0 27px #ffe766;animation:sky-float 1.25s ease-in-out infinite alternate}
#screenSky .sky-object.quest-target:before{content:'★';position:absolute;top:-17px;left:-10px;font-size:18px;color:#fff68a;text-shadow:0 0 6px #000}
#screenSky .sky-ship{z-index:5;font-size:clamp(29px,6vw,40px)}
#screenSky .sky-label{z-index:5;top:9px;left:12px;right:10px;bottom:auto;font-size:10px;color:#c6faff;text-shadow:0 2px 5px #000}
.sky-gamepad{position:absolute;z-index:6;bottom:10px;left:8px;right:8px;height:122px;display:flex;align-items:end;justify-content:space-between;pointer-events:none}
.sky-pad{position:relative;width:130px;height:120px;pointer-events:none}
.sky-pad-key{position:absolute;pointer-events:auto;color:#fff;border:2px solid #8ec0d9;font-size:22px;font-weight:1000;background:linear-gradient(150deg,#414a6f,#1c253f);border-radius:11px;width:42px;height:42px;box-shadow:inset 0 2px #fff4,0 4px 0 #070e1d,0 7px 13px #000a;touch-action:manipulation}
.sky-pad-key:active,.sky-ab button:active{transform:translateY(3px);box-shadow:0 1px #071124}
.sky-up{top:1px;left:44px}.sky-left{top:42px;left:3px}.sky-right{top:42px;left:85px}.sky-down{top:79px;left:44px}
.sky-pad-center{display:grid;place-items:center;position:absolute;left:46px;top:46px;color:#8cb7c6;font-weight:1000;font-size:24px;background:#111d35;border:1px solid #5a7792;width:38px;height:34px;border-radius:8px}
.sky-ab{position:relative;width:138px;height:120px;pointer-events:none}
.sky-ab button{position:absolute;pointer-events:auto;border-radius:100%;width:66px;height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-size:23px;font-weight:1000;border:3px solid #fff6bb;box-shadow:inset 0 3px #fff8,0 5px #19203f,0 9px 15px #000b;touch-action:manipulation}
.sky-ab button small{font-size:9px;line-height:1.1}.sky-ab #skyButtonB{top:14px;left:0;background:linear-gradient(155deg,#76bbff,#3979c6)}.sky-ab #skyButtonA{right:0;bottom:4px;background:linear-gradient(155deg,#ffcd7d,#f06459)}
.sky-ab #skyButtonA:disabled{opacity:.7}
.sky-reset{position:absolute;right:140px;bottom:3px;pointer-events:auto;max-width:68px;border-radius:9px;border:1px solid #bbdfff;color:#fff;background:#162646df;font-size:10px;font-weight:1000;padding:6px 5px}
.sky-pilot-tip{position:absolute;z-index:5;top:32px;left:8px;right:8px;text-align:center;color:#fffce0;font-size:10px;font-weight:900;text-shadow:0 2px 3px #000;pointer-events:none;background:#13203a88;border-radius:9px;padding:5px}
#screenSky .sky-detail-scroll{flex:0 0 25%;min-height:110px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#98a8ee #181833;padding:0 4px 12px;border:1px solid #766ba990;border-radius:14px;background:#12152c;touch-action:pan-y}
#screenSky .sky-details-head{position:sticky;top:0;z-index:3;padding:9px 12px;background:#2c315a;display:flex;justify-content:space-between;gap:8px;color:#ffffe5;font-size:12px}.sky-details-head span{color:#bfc6df;font-size:10px}
#screenSky .sky-message{font-size:12px;line-height:1.6;margin:7px 6px;min-height:0}
#screenSky .sky-grid{gap:8px;padding:0 6px}
#screenSky .sky-panel{margin:6px;padding:12px}
#screenSky .sky-panel h2{font-size:16px}
@media(max-width:650px){
 #screenHome .muda-home-hero{min-height:370px;padding:12px 13px 148px}
 #screenHome .hero-ribbon{font-size:9px}
 #screenHome .muda-home-hero .hero-content{max-width:78%}
 #screenHome .muda-home-hero h1{font-size:39px}
 #screenHome .muda-home-hero .hero-emoji{top:37px;right:-2%;font-size:114px}
 #screenHome .hero-game-badge{top:146px;right:8px;font-size:8px;padding:5px;transform:rotate(8deg)}
 #screenHome .hero-game-badge b{font-size:10px}
 #screenHome .muda-home-hero .statbar{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;left:7px;right:7px;bottom:8px}
 #screenHome .muda-home-hero .stat{padding:9px 7px;min-height:80px}
 #screenHome .muda-home-hero .stat small{font-size:9px;white-space:normal}
 #screenHome .muda-home-hero .stat strong{font-size:22px}
 #screenHome .muda-home-hero .stat strong span{font-size:9px;margin-left:0;display:block}
 #screenHome .hero-cta{gap:6px}.hero-cta button{font-size:11px!important;padding:8px!important;min-height:39px!important}
 .quick-heading span{display:none}.quick-actions button{font-size:11px;padding:10px 3px;min-height:51px}
 #screenHome .muda-mission-hud{border-radius:16px}
 .muda-mission-top{font-size:10px;padding:7px 9px}
 .muda-mission-main{padding:12px 10px 5px;gap:7px;align-items:flex-start}
 .muda-mission-icon{font-size:31px}.muda-mission-copy strong{font-size:17px}.muda-mission-copy span{font-size:13px}
 #mudaMissionCount{font-size:16px}
 #screenSky .sky-intro{padding:9px 12px}#screenSky .sky-intro h1{font-size:21px}
 #screenSky .sky-intro p{font-size:10px;line-height:1.3}
 #screenSky .sky-chip{padding:4px 6px;font-size:9px}
 #screenSky .sky-quest{padding:7px 10px}.sky-quest-row strong{font-size:12px}
 #screenSky .sky-universe{min-height:205px}
 #screenSky .sky-detail-scroll{flex-basis:25%;min-height:95px}
 .sky-gamepad{height:115px;bottom:4px;left:4px;right:4px}
 .sky-pad{transform:scale(.85);transform-origin:left bottom}
 .sky-ab{transform:scale(.88);transform-origin:right bottom}
 .sky-reset{right:117px;bottom:5px}
 #screenSky .sky-label{font-size:9px}
}
@media(max-height:720px) and (max-width:650px){#screenSky .sky-intro p{display:none}#screenSky .sky-universe{min-height:165px}.sky-quest-sub{display:none}#screenSky .sky-detail-scroll{min-height:77px}}
@media(prefers-reduced-motion:reduce){.muda-mission-meter span{transition:none}}
/* Reintroduce the Moai hero on phones (legacy app had it hidden below 540px). */
#screenHome .muda-home-hero{display:block!important}
