/* M Music Prompt landing page - phase 1 */
:root{
  --landing-bg:#06101f;
  --landing-bg2:#0b1b35;
  --landing-card:rgba(10,24,48,.72);
  --landing-card-border:rgba(125,211,252,.18);
  --landing-text:#eef8ff;
  --landing-muted:#9bb4d1;
  --landing-accent:#38bdf8;
  --landing-accent2:#22d3ee;
  --landing-purple:#a78bfa;
  --landing-shadow:0 24px 80px rgba(0,0,0,.34);
}
body.light-theme{
  --landing-bg:#edf6ff;
  --landing-bg2:#dcecff;
  --landing-card:rgba(255,255,255,.72);
  --landing-card-border:rgba(37,99,235,.14);
  --landing-text:#10233f;
  --landing-muted:#61738d;
  --landing-accent:#0284c7;
  --landing-accent2:#0891b2;
  --landing-purple:#7c3aed;
  --landing-shadow:0 24px 70px rgba(38,78,122,.15);
}
body.mmp-landing-active{overflow:hidden}
body.mmp-landing-active .first-run-modal{display:none!important}
#mmpLanding[hidden]{display:none!important}
#mmpLanding{
  position:fixed;inset:0;z-index:4900;overflow:auto;
  color:var(--landing-text);
  background:
    radial-gradient(circle at 12% 18%,color-mix(in srgb,var(--landing-accent2) 20%,transparent),transparent 33%),
    radial-gradient(circle at 84% 12%,color-mix(in srgb,var(--landing-purple) 18%,transparent),transparent 34%),
    radial-gradient(circle at 50% 100%,color-mix(in srgb,var(--landing-accent) 14%,transparent),transparent 35%),
    linear-gradient(145deg,var(--landing-bg),var(--landing-bg2));
  isolation:isolate;
}
#mmpLanding::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;opacity:.28;
  background-image:linear-gradient(rgba(125,211,252,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(125,211,252,.08) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}
.mmp-landing-orb{position:fixed;border-radius:50%;filter:blur(3px);opacity:.28;pointer-events:none;z-index:-1;animation:mmpOrbFloat 11s ease-in-out infinite alternate}
.mmp-landing-orb.one{width:300px;height:300px;left:-90px;top:18%;background:var(--landing-accent2)}
.mmp-landing-orb.two{width:360px;height:360px;right:-130px;top:38%;background:var(--landing-purple);animation-delay:-4s}
@keyframes mmpOrbFloat{from{transform:translate3d(0,-12px,0) scale(.98)}to{transform:translate3d(18px,24px,0) scale(1.05)}}
.mmp-landing-shell{width:min(1440px,calc(100% - 48px));min-height:100%;margin:0 auto;padding:28px 0 46px;display:flex;flex-direction:column}
.mmp-landing-top{display:flex;align-items:center;justify-content:space-between;gap:20px}
.mmp-landing-brand{display:flex;align-items:center;gap:12px}
.mmp-landing-logo{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(56,189,248,.22))}
.mmp-landing-brand-copy strong{display:block;font-size:17px;letter-spacing:.01em}.mmp-landing-brand-copy span{display:block;margin-top:2px;color:var(--landing-muted);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.mmp-landing-theme-btn{display:inline-flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--landing-card-border);border-radius:12px;background:var(--landing-card);color:var(--landing-text);backdrop-filter:blur(14px);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.mmp-landing-theme-dot{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--landing-accent) 16%,transparent)}
.mmp-landing-hero{text-align:center;padding:64px 10px 44px}
.mmp-landing-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid var(--landing-card-border);border-radius:999px;background:color-mix(in srgb,var(--landing-card) 78%,transparent);color:var(--landing-accent);font-size:12px;font-weight:800;letter-spacing:.05em;backdrop-filter:blur(12px)}
.mmp-landing-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--landing-accent2);box-shadow:0 0 0 6px color-mix(in srgb,var(--landing-accent2) 12%,transparent)}
.mmp-landing-title{margin:18px auto 12px;font-size:clamp(42px,6.2vw,84px);line-height:.98;letter-spacing:-.055em;font-weight:900;max-width:980px;background:linear-gradient(100deg,var(--landing-text) 15%,var(--landing-accent2) 52%,var(--landing-purple) 88%);-webkit-background-clip:text;background-clip:text;color:transparent}
.mmp-landing-subtitle{max-width:720px;margin:0 auto;color:var(--landing-muted);font-size:clamp(15px,1.5vw,19px);line-height:1.75}
.mmp-landing-wave{height:42px;margin:28px auto 0;display:flex;align-items:center;justify-content:center;gap:5px;opacity:.7}
.mmp-landing-wave i{display:block;width:3px;border-radius:999px;background:linear-gradient(to top,var(--landing-accent),var(--landing-purple));animation:mmpWave 1.45s ease-in-out infinite alternate;transform-origin:center}
.mmp-landing-wave i:nth-child(1){height:12px}.mmp-landing-wave i:nth-child(2){height:28px;animation-delay:-.7s}.mmp-landing-wave i:nth-child(3){height:18px;animation-delay:-.2s}.mmp-landing-wave i:nth-child(4){height:36px;animation-delay:-.9s}.mmp-landing-wave i:nth-child(5){height:22px;animation-delay:-.4s}.mmp-landing-wave i:nth-child(6){height:31px;animation-delay:-1.1s}.mmp-landing-wave i:nth-child(7){height:15px;animation-delay:-.55s}.mmp-landing-wave i:nth-child(8){height:25px;animation-delay:-.1s}.mmp-landing-wave i:nth-child(9){height:11px;animation-delay:-.8s}
@keyframes mmpWave{from{transform:scaleY(.5);opacity:.45}to{transform:scaleY(1.15);opacity:1}}
.mmp-landing-section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:0 0 15px}.mmp-landing-section-head h2{margin:0;font-size:18px;letter-spacing:-.02em}.mmp-landing-section-head p{margin:0;color:var(--landing-muted);font-size:14px;line-height:1.55}
.mmp-landing-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.mmp-landing-card{position:relative;min-height:176px;padding:20px;border:1px solid var(--landing-card-border);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--landing-card) 94%,transparent),color-mix(in srgb,var(--landing-card) 72%,transparent));color:var(--landing-text);text-align:left;backdrop-filter:blur(14px);box-shadow:0 12px 34px rgba(0,0,0,.08);overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease}
.mmp-landing-card::after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-52px;bottom:-68px;background:var(--card-accent,var(--landing-accent));opacity:.10;transition:transform .25s ease,opacity .25s ease}
.mmp-landing-card:hover{border-color:color-mix(in srgb,var(--card-accent,var(--landing-accent)) 52%,var(--landing-card-border));box-shadow:0 20px 46px color-mix(in srgb,var(--card-accent,var(--landing-accent)) 13%,rgba(0,0,0,.18)),0 0 0 1px color-mix(in srgb,var(--card-accent,var(--landing-accent)) 8%,transparent)}
.mmp-landing-card:nth-child(odd):hover{transform:translateY(-8px) rotate(-1.15deg) scale(1.018)}
.mmp-landing-card:nth-child(even):hover{transform:translateY(-8px) rotate(1.15deg) scale(1.018)}
.mmp-landing-card:nth-child(3n):hover{transform:translateY(-9px) rotate(.7deg) scale(1.022)}
.mmp-landing-card:hover::after{transform:scale(1.26);opacity:.20}.mmp-landing-card:focus-visible{outline:3px solid color-mix(in srgb,var(--landing-accent) 46%,transparent);outline-offset:3px}
.mmp-landing-card-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:color-mix(in srgb,var(--card-accent,var(--landing-accent)) 14%,transparent);border:1px solid color-mix(in srgb,var(--card-accent,var(--landing-accent)) 22%,transparent);font-size:23px;margin-bottom:25px;transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s ease}
.mmp-landing-card:hover .mmp-landing-card-icon{transform:rotate(-6deg) scale(1.08);box-shadow:0 8px 20px color-mix(in srgb,var(--card-accent,var(--landing-accent)) 18%,transparent)}
.mmp-landing-card:nth-child(even):hover .mmp-landing-card-icon{transform:rotate(6deg) scale(1.08)}
.mmp-landing-card[data-mode="playlist"]:hover .mmp-landing-card-icon{transform:translateY(-10px) rotate(-5deg) scale(1.08)}
.mmp-landing-card-copy strong{display:block;font-size:17px;letter-spacing:-.02em;transition:transform .2s ease}.mmp-landing-card-copy span{display:block;margin-top:7px;color:var(--landing-muted);font-size:14px;line-height:1.6}.mmp-landing-card:hover .mmp-landing-card-copy strong{transform:translateX(2px)}.mmp-landing-card-arrow{position:absolute;right:18px;top:18px;font-size:18px;color:color-mix(in srgb,var(--card-accent,var(--landing-accent)) 72%,var(--landing-text));transition:transform .22s cubic-bezier(.2,.8,.2,1)}.mmp-landing-card:hover .mmp-landing-card-arrow{transform:translate(5px,-5px) rotate(8deg) scale(1.08)}
.mmp-landing-card[data-mode="direct"]{--card-accent:#22d3ee}.mmp-landing-card[data-mode="preset"]{--card-accent:#60a5fa}.mmp-landing-card[data-mode="playlist"]{--card-accent:#a78bfa}.mmp-landing-card[data-mode="bgm"]{--card-accent:#34d399}.mmp-landing-card[data-mode="cutscene"]{--card-accent:#fb7185}.mmp-landing-card[data-mode="video"]{--card-accent:#f59e0b}.mmp-landing-card[data-mode="mastering"]{--card-accent:#c084fc}.mmp-landing-card[data-mode="youtube"]{--card-accent:#38bdf8}.mmp-landing-card[data-mode="community"]{--card-accent:#38bdf8}
.mmp-landing-card[data-mode="playlist"] .mmp-landing-card-icon{transform:translateY(-10px)}
.mmp-landing-card[data-mode="playlist"] .mmp-landing-card-copy{position:relative;top:-10px}

/* 2026-08-16 · align YouTube and disabled/coming-soon card content with the standard landing cards */
.mmp-landing-card[data-mode="youtube"] .mmp-landing-card-icon,
.mmp-landing-card:disabled .mmp-landing-card-icon{position:relative;top:-10px}
.mmp-landing-card[data-mode="youtube"] .mmp-landing-card-copy,
.mmp-landing-card:disabled .mmp-landing-card-copy{position:relative;top:-10px}
.mmp-landing-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:25px;padding:16px 2px 0;color:var(--landing-muted);font-size:13px;line-height:1.5}.mmp-landing-footer strong{color:var(--landing-text);font-weight:700}
.mmp-home-btn{display:inline-flex!important;align-items:center;gap:6px;background:linear-gradient(135deg,rgba(34,211,238,.13),rgba(96,165,250,.12))!important;border-color:rgba(56,189,248,.28)!important;color:#dff7ff!important}.mmp-home-btn span{font-size:15px}
body.light-theme .mmp-home-btn{color:#075985!important;background:linear-gradient(135deg,#eefcff,#eef5ff)!important;border-color:rgba(2,132,199,.22)!important}
@media(max-width:1050px){.mmp-landing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mmp-landing-hero{padding-top:50px}}
@media(max-width:620px){.mmp-landing-shell{width:min(100% - 24px,1440px);padding-top:16px}.mmp-landing-brand-copy span{display:none}.mmp-landing-theme-btn .label{display:none}.mmp-landing-hero{padding:42px 2px 30px}.mmp-landing-grid{grid-template-columns:1fr;gap:10px}.mmp-landing-card{min-height:140px}.mmp-landing-card-icon{margin-bottom:16px}.mmp-landing-section-head{align-items:flex-start;flex-direction:column;gap:4px}.mmp-landing-footer{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.mmp-landing-orb,.mmp-landing-wave i{animation:none!important}.mmp-landing-card,.mmp-landing-card::after,.mmp-landing-card-arrow{transition:none!important}}

/* 2026-08-12 · home button fixed at the left edge of the main utility bar */
body .topbar{position:relative!important}
body .topbar>.mmp-top-home-icon{
  position:absolute!important;
  left:12px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:46px!important;
  height:46px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(56,189,248,.34)!important;
  border-radius:13px!important;
  background:linear-gradient(145deg,rgba(8,20,43,.96),rgba(9,38,68,.94))!important;
  color:#7dd3fc!important;
  box-shadow:0 7px 20px rgba(2,132,199,.16),inset 0 1px 0 rgba(255,255,255,.06)!important;
  cursor:pointer!important;
  z-index:20!important;
  transition:box-shadow .18s ease,border-color .18s ease,background .18s ease!important;
}
body .topbar>.mmp-top-home-icon svg{width:27px!important;height:27px!important;display:block!important;fill:currentColor!important}
body .topbar>.mmp-top-home-icon:hover{border-color:rgba(34,211,238,.65)!important;box-shadow:0 10px 26px rgba(2,132,199,.22),0 0 0 3px rgba(56,189,248,.08)!important}
body .topbar>.mmp-top-home-icon:active{transform:translateY(-50%) scale(.96)!important}
body .topbar>.mmp-top-home-icon:focus-visible{outline:3px solid rgba(56,189,248,.26)!important;outline-offset:2px!important}
body.light-theme .topbar>.mmp-top-home-icon{background:linear-gradient(145deg,#fff,#eaf6ff)!important;color:#0284c7!important;border-color:rgba(14,165,233,.30)!important;box-shadow:0 7px 18px rgba(14,116,144,.13),inset 0 1px 0 #fff!important}
body .topbar>.top-actions{padding-left:58px!important}

/* Community is a public board view: never show startup guidance dialogs there. */
body.settings-mode-community #betaTesterNotice,
body.settings-mode-community #firstRunGuide{display:none!important}