/* Moii public landing module. Layered after existing layouts; no global bundle. */
body.moii-brand {
  --pink: #ff6fb2;
  --pink-deep: #e0007a;
  --text-main: #111827;
  --text-sub: #6b7280;
  --brand-line: rgba(142, 108, 158, .16);
  --brand-shadow: 0 12px 38px rgba(94, 57, 119, .07);
  --shadow-soft: 0 20px 60px rgba(255,182,213,.45);
  background: linear-gradient(135deg, #fff8fc 0%, #f8f3ff 48%, #f5f9ff 100%);
  background-size:100% 100%;
  animation:none;
  padding: 108px 24px 48px;
}
.moii-brand .page-wrap { width: 100%; max-width: 1200px; }
.moii-brand .top-bar {
  max-width: 1280px; width: calc(100% - 48px); top: 18px; padding: 12px 22px;
  border-radius: 999px; border: 1px solid rgba(255,255,255,.52);
  background: rgba(255,255,255,.88); box-shadow: 0 10px 24px rgba(224,164,210,.14),0 4px 18px rgba(151,161,224,.08);
  outline: none;
}
.moii-brand.scrolled .top-bar,
body.moii-brand.scrolled .top-bar {
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 24px rgba(224,164,210,.13),0 4px 18px rgba(151,161,224,.07);
}
.moii-brand .logo-side { gap: 15px; }
.moii-brand .logo-text-main { letter-spacing: 1px; font-size: 17px; }
.moii-brand .logo-text-sub { font-size: 10px; color: var(--text-sub); }
.moii-brand .top-links { gap: 14px; }
.moii-brand .top-links > a { font-size: 12px; color: var(--text-sub); }
.moii-brand .top-auth-btn { box-shadow: none; }
.moii-brand .top-auth-btn.login { background: linear-gradient(115deg,#ff78bf,#8c80f8); }
.moii-brand .hero-intro { min-height: 68vh; gap: 60px; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); padding: 38px 12px 48px; }
.moii-brand .hero-left { padding: 12px 0; }
.moii-brand .hero-intro > .hero-left { grid-column: 1; grid-row: 1; }
.moii-brand .hero-intro > .hero-right-login { grid-column: 2; grid-row: 1; }
.moii-brand .hero-left-inner { max-width: 600px; }
.moii-brand .hero-left-title { font-size: clamp(28px,2.4vw,34px); line-height: 1.5; letter-spacing: 1px; font-weight: 700; margin-bottom: 16px; }
.moii-brand .brand-title-accent { display: inline; color: #d83f93; background: linear-gradient(110deg,#d83f93,#8c77df); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.moii-brand .hero-left-sub { font-size: 14px; line-height: 1.95; max-width: 530px; margin-bottom: 22px; }
.moii-brand .hero-badges { display: grid; gap: 8px; margin-bottom: 26px; }
.moii-brand .hero-badge { width: fit-content; max-width: 100%; border-radius: 999px; padding: 6px 12px; background: rgba(255,246,252,.92); border-color: rgba(255,219,238,.9); color: var(--text-main); font-size: 12px; gap: 10px; line-height: 1.5; }
.moii-brand .hero-badge i { width: 20px; text-align: center; }
.moii-brand .hero-cta-row { flex-direction: row; align-items: center; opacity: 1; }
.moii-brand .hero-cta { border-radius: 999px; min-height: 44px; padding: 11px 24px; font-size: 14px; justify-content: center; }
.moii-brand .hero-cta.primary, .moii-brand .bottom-cta-btn:not(.secondary), .moii-brand .btn-main {
  background: linear-gradient(115deg,var(--pink),var(--pink-deep)); box-shadow: 0 12px 28px rgba(255,111,178,.55);
}
.moii-brand .hero-cta.secondary { border-color: var(--brand-line); box-shadow: none; }
.moii-brand .hero-right-login { padding-right: 0; }
.moii-brand .auth-panel { max-width: 400px; border-radius: 28px; padding: 20px; background: rgba(255,255,255,.9); box-shadow: var(--shadow-soft); border: 1px solid rgba(255,255,255,.96); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.moii-brand .auth-panel:hover { transform: none; box-shadow: var(--shadow-soft); }
.moii-brand .auth-tabs { border-radius: 999px; background: rgba(255,255,255,.96); border-color: rgba(255,219,238,.95); margin-bottom: 18px; }
.moii-brand .auth-tabs::before { border-radius: 999px; width: calc(50% - 3px); background: linear-gradient(115deg,var(--pink),var(--pink-deep)); box-shadow: 0 8px 20px rgba(255,111,178,.4); }
.moii-brand .auth-tabs.tab-staff::before { transform: translateX(calc(100% + 3px)); }
.moii-brand .auth-tab { min-height: 36px; font-size: 13px; }
.moii-brand .auth-title { font-size: 17px; line-height: 1.5; }
.moii-brand .auth-sub { font-size: 12px; line-height: 1.75; margin: 6px 0 14px; }
.moii-brand .mode-tabs { gap: 7px; margin-bottom: 14px; }
.moii-brand .mode-btn { min-height: 34px; border-radius: 999px; font-size: 12px; }
.moii-brand .mode-btn.active { background: linear-gradient(135deg,var(--pink-soft),#fff); border-color: rgba(255,182,213,.9); box-shadow: 0 8px 18px rgba(255,182,213,.4); }
.moii-brand .field { margin-bottom: 12px; }
.moii-brand .field-label { font-size: 12px; margin-bottom: 6px; line-height: 1.5; gap: 8px; flex-wrap: wrap; }
.moii-brand .field-label span.right { font-size: 10px; opacity: 1; }
.moii-brand .field-input, .moii-brand .phone-row { border-radius: 999px; border-color: rgba(209,213,219,.95); background: rgba(255,255,255,.96); }
.moii-brand .input { min-height: 42px; font-size: 16px; }
.moii-brand .phone-area { font-size: 13px; }
.moii-brand .field-input:focus-within, .moii-brand .phone-row:focus-within { border-color: var(--pink); box-shadow: 0 0 0 3px rgba(197,45,120,.08); }
.moii-brand .btn-send { min-height: 42px; border-radius: 999px; font-size: 12px; }
.moii-brand .confirm-row { line-height: 1.8; margin: 12px 0; font-size: 11px; }
.moii-brand .btn-main { border-radius: 999px; min-height: 44px; font-size: 14px; }
.moii-brand .auth-footer { font-size: 11px; line-height: 1.75; margin-top: 14px; }
.moii-brand .third-icon-btn { border-radius: 999px; box-shadow: none; border: 1px solid rgba(255,219,238,.6); background: rgba(255,255,255,.6); }
.moii-brand :where(button, a, [tabindex]):focus-visible { outline: 3px solid #9964b5; outline-offset: 4px; }
.moii-brand .auth-panel:focus { outline: none; }
.moii-brand :where(button:disabled) { cursor: not-allowed; box-shadow: none; }
.moii-brand :where(button:disabled):hover { transform: none; }
.moii-brand .brand-chapter { display: flex; align-items: center; gap: 10px; position: relative; z-index: 1; font-size: 11px; font-weight: 650; color: #976284; letter-spacing: 1.5px; margin-bottom: 18px; }
.moii-brand .brand-chapter span { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid #ecdde9; border-radius: 9px; color: #a33e7d; background: rgba(255,255,255,.8); font-variant-numeric: tabular-nums; letter-spacing: 0; }
.moii-brand :is(#intro,#system,#xiaodaidai,#features,#why) { margin-top: 26px; border-radius: 28px; border: 1px solid rgba(151,121,164,.12); box-shadow: var(--brand-shadow); }
.moii-brand #intro { margin-top: 0; }
.moii-brand :is(#intro,#system,#xiaodaidai,#features) > .section-title { font-size: clamp(22px,2.3vw,30px); line-height: 1.45; letter-spacing: -.6px; text-wrap: balance; }
.moii-brand :is(#intro,#system,#xiaodaidai,#features) > .section-sub { font-size: 13px; line-height: 1.9; }
.moii-brand #intro { background:linear-gradient(150deg,#fffafd,#ffffff 55%,#f9f7ff); }
.moii-brand #intro .brand-chapter { justify-content: center; }
.moii-brand #intro .desktop-mock { border-radius: 16px; border-color: #e3dce9; box-shadow: 0 15px 35px rgba(94,57,119,.09); }
.moii-brand #intro .desktop-mock-bar { background: #f5f1f8; }
.moii-brand #intro .phone-frame { box-shadow: 0 15px 35px rgba(94,57,119,.12); }
.moii-brand #intro .moii-story-principle { background: rgba(255,255,255,.9); border-radius: 14px; border: 1px solid #eee6f0; padding: 16px; }
.moii-brand #intro .moii-story-panel { border-radius: 20px; background: linear-gradient(140deg,#fff5fa,#f5f3ff); }
.moii-brand #intro .moii-story-tab.is-active { background: #fdf1f7; }
.moii-brand #system { background: linear-gradient(120deg,#f7f5ff,#fff 65%); }
.moii-brand #system .moii-route-step { border-color: #ded8ed; }
.moii-brand #system .moii-route-marker { color: #a57acb; }
.moii-brand #xiaodaidai { background: linear-gradient(140deg,#fff9fd,#fff 55%,#f5f2fc); }
.moii-brand #xiaodaidai .moii-assistant-preview { border-radius: 24px; border-color: #eadfec; box-shadow: var(--brand-shadow); }
.moii-brand #xiaodaidai .moii-assistant-detail { border-radius: 14px; }
.moii-brand #features { background: linear-gradient(140deg,#f9f7ff,#fff 60%); }
.moii-brand #features .moii-role-tabs { border-radius: 18px; overflow: hidden; }
.moii-brand #features .moii-role-tab:is(.active,.is-active,[aria-selected="true"]) { background: #f5eefa; color: #963e86; }
.moii-brand #features .moii-role-item { border-radius: 14px; padding: 18px; background: rgba(255,255,255,.72); }
.moii-brand #why { background: linear-gradient(120deg,#fff9fc,#f9f7ff); }
.moii-brand #why .moii-proof-list { border: 0; gap: 12px; }
.moii-brand #why .moii-proof-item { border: 1px solid #eee5f0; border-radius: 16px; background: rgba(255,255,255,.84); padding: 20px 16px; }
.moii-brand #why .moii-proof-item:hover { background: #fff; }
.moii-brand #creators { margin-top: 26px; padding: 36px 44px; border-radius: 28px; background: linear-gradient(150deg,#fff9fc,#faf8ff); border: 1px solid var(--brand-line); box-shadow: var(--brand-shadow); }
.moii-brand #creators .creator-bg-bubble { opacity: .22; }
.moii-brand #creators .creator-title { font-size: 28px; letter-spacing: -.6px; line-height: 1.45; }
.moii-brand #creators .creator-sub { font-size: 13px; line-height: 1.85; margin-bottom: 26px; }
.moii-brand #creators :is(.works-part,.creator-list-part,.creator-cloud-part) { position: relative; border-top: 1px solid var(--brand-line); padding-top: 20px; margin-top: 20px; }
.moii-brand #creators .creator-subtitle { max-width: none; text-align: left; margin: 0 0 14px; font-size: 16px; line-height: 1.75; }
.moii-brand #creators .creator-subtitle span:first-child { color: var(--text-main); font-size: 16px; font-weight: 700; }
.moii-brand #creators :is(.works-grid,.creator-list) { max-width: none; gap: 14px; }
.moii-brand #creators .showcase-empty-state { display: flex; align-items: center; justify-content: center; gap: 18px; min-height: 112px; padding: 22px; border: 1px solid #ede4f0; border-radius: 16px; background: rgba(255,255,255,.82); box-shadow: none; color: #766780; font-size: 13px; }
.moii-brand #creators .showcase-empty-state::before { content: '✦'; display: grid; place-items: center; flex: 0 0 44px; height: 44px; border-radius: 15px; background: linear-gradient(135deg,#fae7f1,#eee8fc); color: #b874aa; font-size: 22px; }
.moii-brand #creators .work-card { border-radius: 16px; padding: 16px; border-color: #ece1ef; box-shadow: none; }
.moii-brand #creators .work-cover img { object-fit: contain; }
.moii-brand #creators .creator-card { border-color: #ece1ef; box-shadow: none; }
.moii-brand #creators .creator-avatars-wrap.is-empty { min-height: 112px; height: auto; padding: 0; }
.moii-brand #care { margin-top: 26px; padding: 36px 28px; border-radius: 28px; box-shadow: var(--brand-shadow); border: 1px solid var(--brand-line); background: linear-gradient(130deg,#fff5fa,#f3effc); }
.moii-brand #care .brand-chapter { justify-content: center; }
.moii-brand #care .care-section-title { font-size: 28px; line-height: 1.5; }
.moii-brand #care .care-section-sub { font-size: 13px; line-height: 1.85; }
.moii-brand .bottom-cta { border-radius: 22px; padding: 28px 32px; box-shadow: var(--brand-shadow); border: 1px solid var(--brand-line); background: rgba(255,255,255,.9); gap: 20px; }
.moii-brand .bottom-cta strong { font-size: 18px; line-height: 1.65; }
.moii-brand .bottom-cta span { font-size: 12px; line-height: 1.85; }
.moii-brand .bottom-cta-btn { min-height: 44px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.moii-brand .site-footer { margin-top: 36px; color: #7d7287; line-height: 1.9; }
.moii-brand :is(.detail-modal,.reset-modal,.ks-modal,.nav-drawer) { border-radius: 22px; border: 1px solid #eee4f0; box-shadow: 0 24px 80px rgba(55,31,76,.17); background: #fffdff; max-height: calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; }
.moii-brand .detail-modal-body { max-height: none; }
.moii-brand .detail-modal-head { position: sticky; top: 0; z-index: 2; background: #fffdff; border-color: #eee4f0; }
.moii-brand .detail-modal-cover img { object-fit: contain; }
.moii-brand .toast { border-radius: 12px; box-shadow: var(--brand-shadow); max-width: calc(100% - 32px); }
/* Contents remain readable even if the module script is unavailable. */
.moii-brand :is(.section-shell,.creator-showcase,.care-section,.bottom-cta) { opacity: 1; transform: none; }
.moii-brand :is(.section-shell,.creator-showcase,.care-section,.bottom-cta,.why-card) { transition: box-shadow .2s ease, background-color .2s ease; }
.moii-brand.moii-motion-paused, .moii-brand.moii-motion-paused *, .moii-brand.moii-motion-paused *::before, .moii-brand.moii-motion-paused *::after { animation-play-state: paused !important; }
@media (max-width: 1200px) {
  .moii-brand .top-links { display: none; }
  .moii-brand .top-right-mobile { display: flex; }
  .moii-brand .top-auth-pill.compact { display: inline-flex; }
}
@media (max-width: 900px) {
  .moii-brand .hero-intro { display: grid; grid-template-columns: 1fr; min-height: 0; gap: 24px; padding: 24px 0 12px; }
  .moii-brand .hero-left-inner { max-width: 100%; }
  .moii-brand .hero-right-login { justify-content: center; }
  .moii-brand .auth-panel { max-width: 560px; }
}
@media (max-width: 760px) {
  .moii-brand .hero-intro > .hero-left,
  .moii-brand .hero-intro > .hero-right-login { grid-column: 1; grid-row: auto; }
  body.moii-brand { padding: 88px 14px max(24px,env(safe-area-inset-bottom)); }
  .moii-brand .top-bar { top: max(10px,env(safe-area-inset-top)); width: calc(100% - 20px); padding: 9px 10px; border-radius: 999px; }
  .moii-brand .logo-side { gap: 8px; }
  .moii-brand .logo-side img { height: 30px; }
  .moii-brand .logo-text-main { font-size: 12px; letter-spacing: .3px; }
  .moii-brand .logo-text-sub { font-size: 9px; }
  .moii-brand .hero-intro { padding-top: 12px; gap: 18px; margin-top: 0; }
  .moii-brand .hero-left { padding: 0 4px; }
  .moii-brand .hero-left-title { font-size: 26px; line-height: 1.4; letter-spacing: .6px; margin-bottom: 12px; }
  .moii-brand .hero-left-sub { font-size: 13px; line-height: 1.8; margin-bottom: 14px; }
  .moii-brand .hero-badges { gap: 6px; margin-bottom: 16px; }
  .moii-brand .hero-badge { font-size: 11px; padding: 6px 9px; border-radius: 999px; }
  .moii-brand .hero-cta-row { display: flex; flex-direction: row; gap: 10px; }
  .moii-brand .hero-cta-row .hero-cta { width: auto; flex: 1; min-height: 44px; padding: 10px 14px; font-size: 13px; }
  .moii-brand .auth-panel { padding: 18px; border-radius: 26px; }
  .moii-brand .auth-tabs { margin-bottom: 12px; }
  .moii-brand .auth-title { font-size: 15px; }
  .moii-brand .auth-sub { font-size: 11px; margin-bottom: 12px; }
  .moii-brand .auth-panel .input, .moii-brand .reset-modal .input { font-size: 16px; }
  .moii-brand :is(#intro,#system,#xiaodaidai,#features,#why) { padding: 22px 18px; border-radius: 22px; margin-top: 20px; }
  .moii-brand .brand-chapter { margin-bottom: 12px; font-size: 10px; }
  .moii-brand :is(#intro,#system,#xiaodaidai,#features) > .section-title { font-size: 21px; }
  .moii-brand :is(#intro,#system,#xiaodaidai,#features) > .section-sub { font-size: 12px; }
  .moii-brand #intro .moii-story-principle { padding: 12px; }
  .moii-brand #why .moii-proof-item { padding: 16px 12px; }
  .moii-brand #creators { padding: 22px 18px; border-radius: 22px; margin-top: 20px; }
  .moii-brand #creators .creator-title, .moii-brand #care .care-section-title { font-size: 22px; }
  .moii-brand #creators .creator-sub { font-size: 12px; }
  .moii-brand #creators .showcase-empty-state { font-size: 12px; padding: 18px 14px; gap: 12px; text-align: left; }
  .moii-brand #creators .creator-subtitle span { display: block; }
  .moii-brand #care { padding: 24px 18px; margin-top: 20px; border-radius: 22px; }
  .moii-brand .bottom-cta { padding: 22px 18px; border-radius: 20px; }
  .moii-brand .bottom-cta-actions { width: 100%; display: flex; gap: 10px; }
  .moii-brand .bottom-cta-btn { flex: 1; text-align: center; justify-content: center; }
  .moii-brand :is(.detail-modal,.reset-modal,.ks-modal) { width: calc(100% - 24px); max-height: calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .moii-brand .nav-drawer { width: calc(100% - 20px); top: 78px; max-height: calc(100dvh - 96px - env(safe-area-inset-bottom)); }
}
@media (max-width: 420px) {
  .moii-brand .logo-text { max-width: 116px; }
  .moii-brand .top-auth-pill.compact .top-auth-btn { padding: 0 7px; min-height: 34px; font-size: 11px; }
  .moii-brand .nav-toggle { width: 34px; height: 34px; }
  .moii-brand .top-right-mobile { gap: 4px; }
  .moii-brand .hero-left-title { font-size: 24px; }
  .moii-brand .auth-panel { padding: 16px 14px; }
  .moii-brand .auth-tab { font-size: 12px; }
  .moii-brand :is(#intro,#system,#xiaodaidai,#features,#why,#creators) { padding: 20px 14px; }
  .moii-brand #features .moii-role-item { padding: 14px 10px; }
  .moii-brand .btn-send { padding: 7px 8px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .moii-brand, .moii-brand *, .moii-brand *::before, .moii-brand *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* The inspiration scene is CSS-only: animate composited transforms, never layout. */
.moii-brand .hero-left {
  isolation: isolate;
  overflow: visible;
  border-radius: 0;
  padding: 28px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.moii-brand .hero-left-inner { max-width: none; }
.moii-brand .brand-hero-kicker { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; color: #a65291; font-size: 11px; font-weight: 650; letter-spacing: 1.6px; }
.moii-brand .brand-hero-kicker span { color: #df5ba5; font-size: 17px; }
.moii-brand .hero-left-title { font-size: clamp(30px,2.5vw,38px); line-height: 1.36; letter-spacing: .4px; text-shadow: 0 8px 24px rgba(121,73,124,.08); }
@media (max-width: 900px) {
  .moii-brand .hero-intro > .hero-left,
  .moii-brand .hero-intro > .hero-right-login { grid-column: 1; grid-row: auto; }
}
.moii-brand .hero-left-sub { margin-bottom: 24px; max-width: 560px; }
.moii-brand .hero-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; max-width: 590px; }
.moii-brand .hero-badge { width: fit-content; padding: 9px 14px 9px 10px; border-radius: 999px; gap: 9px; border: 1px solid rgba(255,165,211,.52); background: rgba(255,255,255,.5); box-shadow: 0 8px 22px rgba(173,102,165,.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.moii-brand .hero-badge i { display: grid; place-items: center; flex: 0 0 28px; height: 28px; border-radius: 50%; background: linear-gradient(145deg,#ffe2f1,#f4e9ff); color: #e0007a; font-size: 12px; }
.moii-brand .hero-badge:nth-child(2) i { background: linear-gradient(145deg,#eee8ff,#fff1f9); color: #9964d5; }
.moii-brand .hero-badge:nth-child(3) i { background: linear-gradient(145deg,#e5f5ff,#f5edff); color: #8185db; }
.moii-brand .hero-badge:nth-child(2) { border-color: rgba(181,153,231,.42); }
.moii-brand .hero-badge:nth-child(3) { border-color: rgba(145,190,229,.42); }
.moii-brand .hero-cta-row { margin-top: 2px; }
/* One masked scene; transparent edges blend into the page at every width. */
.moii-brand > .bg-orb, .moii-brand > .star { display:none; }
.moii-brand .hero-intro { position:relative; isolation:isolate; overflow:visible; background:transparent; }
.moii-brand .hero-intro::before, .moii-brand .hero-intro::after { content:none; }
.moii-brand .hero-intro > :not(.brand-hero-scene) { position:relative; z-index:1; }
.moii-brand .brand-hero-scene {
  position:absolute; z-index:0; left:50%; right:auto; top:-108px; bottom:-130px; width:100vw;
  transform:translateX(-50%); overflow:hidden; pointer-events:none; contain:layout paint;
  -webkit-mask-image:linear-gradient(transparent,#000 15%,#000 72%,transparent);
  mask-image:linear-gradient(transparent,#000 15%,#000 72%,transparent);
}
.moii-brand .brand-hero-scene::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 35% 49%,rgba(255,252,255,.48),transparent 55%),radial-gradient(ellipse at 79% 50%,rgba(255,255,255,.58),transparent 35%);
}
.moii-brand .brand-scene-wave { position:absolute; left:-6%; top:8%; width:68%; height:auto; animation:moii-symbol-float 30s ease-in-out infinite alternate; }
.moii-brand .brand-scene-lower { position:absolute; left:-8%; bottom:9%; width:75%; opacity:.7; transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0); transition:transform .6s ease-out,opacity .6s ease; }
.moii-brand .brand-scene-lower svg { display:block; width:100%; height:auto; animation:moii-symbol-float 32s ease-in-out infinite alternate; }
.moii-brand .hero-intro.brand-pointer-active .brand-scene-lower { opacity:1; }
.moii-brand .brand-hero-scene::before { content:''; position:absolute; left:-12%; bottom:6%; width:65%; height:25%; background:radial-gradient(ellipse,rgba(221,176,242,.32),transparent 70%); transform:rotate(-12deg); }
.moii-brand .brand-hero-ribbon { position:absolute; width:78%; height:36%; border-radius:50%; opacity:.65; animation:moii-ribbon-float 28s ease-in-out infinite alternate; }
.moii-brand .brand-hero-ribbon--pink { left:-18%; top:5%; background:radial-gradient(ellipse,rgba(255,143,206,.65),rgba(255,182,223,.35) 42%,transparent 72%); --tilt:-16deg; }
.moii-brand .brand-hero-ribbon--blue { right:-23%; bottom:6%; background:radial-gradient(ellipse,rgba(124,171,240,.5),rgba(178,207,252,.28) 42%,transparent 72%); --tilt:16deg; animation-duration:36s; animation-delay:-12s; }
.moii-brand .brand-hero-ribbon--lilac { left:18%; top:0; width:85%; height:30%; background:radial-gradient(ellipse,rgba(177,140,234,.38),rgba(218,189,247,.2) 42%,transparent 72%); --tilt:-10deg; animation-duration:24s; animation-delay:-7s; }
.moii-brand .brand-hero-trace { position:absolute; width:85%; height:38%; border-top:1px solid rgba(182,126,211,.28); border-radius:50%; animation:moii-trace-float 32s ease-in-out infinite alternate; }
.moii-brand .brand-hero-trace--one { left:-14%; top:12%; --tilt:-12deg; }
.moii-brand .brand-hero-trace--two { right:-22%; bottom:5%; border-color:rgba(123,160,219,.3); --tilt:16deg; animation-delay:-15s; }
.moii-brand .brand-hero-spark, .moii-brand .brand-scene-symbol { position:absolute; line-height:1; color:rgba(169,108,202,.38); animation:moii-symbol-float 20s ease-in-out infinite alternate; }
.moii-brand .brand-hero-spark--one { left:33%; top:18%; font-size:17px; }
.moii-brand .brand-hero-spark--two { right:8%; bottom:13%; font-size:22px; animation-delay:-8s; }
.moii-brand .brand-scene-symbol--music { left:5%; top:22%; font-size:48px; --tilt:-12deg; }
.moii-brand .brand-scene-symbol--creative { left:55%; top:14%; font-size:46px; animation-delay:-9s; }
.moii-brand .brand-scene-symbol--star { left:45%; bottom:15%; font-size:25px; animation-delay:-5s; }
.moii-brand .brand-scene-particle { position:absolute; left:var(--x); top:var(--y); width:var(--size,4px); height:var(--size,4px); border-radius:50%; background:rgba(184,146,221,.65); box-shadow:0 0 9px rgba(196,165,230,.25); animation:moii-particle-float var(--duration,18s) ease-in-out var(--delay,0s) infinite alternate; }
.moii-brand .brand-scene-paused .brand-hero-scene * { animation-play-state:paused; }
.moii-brand .auth-panel { scroll-margin-top:90px; }
@keyframes moii-ribbon-float { from { transform:translate3d(-3%,0,0) rotate(var(--tilt,0deg)); opacity:.5; } to { transform:translate3d(5%,7%,0) rotate(calc(var(--tilt,0deg) + 5deg)); opacity:.8; } }
@keyframes moii-trace-float { from { transform:translate3d(0,0,0) rotate(var(--tilt,0deg)); } to { transform:translate3d(3%,-14px,0) rotate(calc(var(--tilt,0deg) + 3deg)); } }
@keyframes moii-symbol-float { from { transform:translate3d(0,0,0) rotate(var(--tilt,0deg)); opacity:.45; } to { transform:translate3d(8px,-14px,0) rotate(calc(var(--tilt,0deg) + 6deg)); opacity:.8; } }
@keyframes moii-particle-float { from { transform:translate3d(0,0,0); opacity:.2; } to { transform:translate3d(10px,-22px,0); opacity:.75; } }
@media (max-width:760px) {
  .moii-brand .brand-scene-wave { width:110%; left:-20%; top:3%; opacity:.6; }
  .moii-brand .brand-scene-lower { width:110%; left:-18%; bottom:0; opacity:.45; }
  .moii-brand .hero-left { padding:12px 4px; }
  .moii-brand .hero-left-title { font-size:25px; letter-spacing:.4px; }
  .moii-brand .hero-left-sub { font-size:13px; margin-bottom:16px; }
  .moii-brand .brand-hero-kicker { font-size:10px; margin-bottom:10px; }
  .moii-brand .hero-badges { margin-bottom:18px; gap:7px; }
  .moii-brand .hero-badge { padding:8px 10px; gap:9px; font-size:11px; }
  .moii-brand .brand-hero-scene { top:-88px; bottom:-90px; }
  .moii-brand .brand-hero-ribbon { width:120%; opacity:.45; }
  .moii-brand .brand-scene-particle:nth-of-type(n+7) { display:none; }
}
@media (max-width:420px) { .moii-brand .hero-left-title { font-size:23px; } .moii-brand .hero-left-sub { font-size:12.5px; } }
@media (prefers-reduced-motion:reduce) { .moii-brand .brand-hero-scene * { animation:none !important; } }
@media (min-width:901px) {
  .moii-brand .auth-panel { max-width:360px; padding:16px 18px; border-radius:24px; }
  .moii-brand .auth-tabs { margin-bottom:12px; }
  .moii-brand .auth-sub { line-height:1.6; margin:5px 0 10px; }
  .moii-brand .mode-tabs { margin-bottom:10px; }
  .moii-brand .field { margin-bottom:9px; }
  .moii-brand .field-label { margin-bottom:4px; }
  .moii-brand .input, .moii-brand .btn-send { min-height:40px; }
  .moii-brand .confirm-row { margin:9px 0; }
  .moii-brand .auth-footer { margin-top:9px; line-height:1.6; }
  .moii-brand .third-party-row { margin-top:10px; margin-bottom:6px; }
}
@media (max-width:760px) {
  .moii-brand .brand-scene-symbol--music { left:2%; top:3%; font-size:36px; opacity:.6; }
  .moii-brand .brand-scene-symbol--creative { left:82%; top:5%; font-size:40px; opacity:.6; }
  .moii-brand .brand-scene-symbol--star { display:none; }
}