.generation-page-navigation { display: none; }
/* Failure details must remain visible on desktop and mobile, including audio refusals. */
body.generation-status-page #status-live > #status-result-summary.is-failed {
  display: grid !important; gap: 12px; padding: 18px !important; margin: 0 0 16px !important;
  border: 1px solid #f0c9bd; border-radius: 14px; background: #fff6f1;
  color: #753c2b; font: 500 16px/1.55 var(--font-ui, Arial, sans-serif);
  height: auto !important; opacity: 1 !important; visibility: visible !important;
}
body.generation-status-page #status-result-summary.is-failed p { margin: 0; }
.generation-copyright-retry { display: grid; gap: 10px; }
.generation-copyright-retry[hidden] { display: none !important; }
.generation-copyright-retry button { justify-self: start; min-height: 44px; white-space: normal; }
.generation-copyright-retry [role="alert"]:empty { display: none; }
body.generation-status-page #status-live[data-generation-failed="true"] > :is(#result-panel, .progress-wrap, #status-checklist) { display: none !important; }
.generation-page-loading { display: none; }
.generator-result-panel.has-limited-playback .generator-result-player { display: none !important; }
.generator-result-preview { min-width: 0; width: 100%; }
.generator-result-preview .song-preview-badge { margin-bottom: 6px; }
@media (max-width: 860px) {
  .generator-result-preview .song-preview-player { grid-template-columns: 44px minmax(0, 1fr); gap: 12px; }
  .generator-result-preview .preview-play { width: 44px; height: 44px; }
  .generator-result-preview .preview-volume { display: none; }
}
body.generation-status-page #app-boot-loader { display: none !important; }
html.generation-status-loading #generator-status-card > :not(.generation-page-loading) { display: none !important; }
body.generation-status-page .site-footer { display: block !important; visibility: visible; }
html.generation-status-loading .generation-page-loading,
body.generation-status-page .generation-page-loading.is-error {
  display: grid; place-items: center; align-content: center; gap: 18px; min-height: 260px; margin: 0; padding: 16px 0;
  color: #726358; font: 500 16px/1.5 var(--font-ui, Arial, sans-serif); text-align: center;
}
/* Vinilul vine din vinyl-loader.css (încărcat blocant și pe această rută). */
#generation-page-loading .account-auth-vinyl-disc { --am-vinyl-size: 76px; margin-bottom: 6px; }
body.generation-status-page #status-live > #result-panel.generator-result-panel { order: -1; }
body.generation-status-page #status-live[data-generation-complete="true"] {
  row-gap: 0 !important;
  transition: row-gap 450ms ease-in-out 700ms;
}
body.generation-status-page #status-live[data-generation-complete="true"] > :is(#status-result-summary, .progress-wrap, #status-checklist) {
  overflow: hidden;
  min-height: 0;
  box-sizing: border-box;
  pointer-events: none;
}
body.generation-status-page #status-live > :is(#status-result-summary, .progress-wrap, #status-checklist)[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  body.generation-status-page #status-live[data-generation-complete="true"] { transition: none; }
}
body.generation-status-page #generator-main-grid { display: block !important; width: min(100%, 760px) !important; max-width: 760px !important; margin: 24px auto !important; }
body.generation-status-page #generator-main-grid > .form-card,
body.generation-status-page #generator-request-card,
body.generation-status-page #viewer-session-card,
body.generation-status-page .gift-mobile-progress,
body.generation-status-page .gift-preview-controls,
body.generation-status-page #generate-another-track { display: none !important; }
body.generation-status-page #generator-side-rail { display: block !important; position: static !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; transform: none !important; }
body.generation-status-page #generator-status-card { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: clamp(16px, 4vw, 28px) !important; box-sizing: border-box; border-radius: 18px !important; border: 1px solid #ebe6e3 !important; background: #fff !important; box-shadow: 0 8px 28px #4c291210 !important; }
html.generation-status-loading #generator-status-card { border-color: transparent !important; background: transparent !important; box-shadow: none !important; }
body.generation-status-page .generation-page-navigation { display: block; margin-bottom: 20px; font-family: var(--font-ui, Arial, sans-serif); }
.generation-page-navigation p { margin: 0 0 14px; color: #728198; font-size: 14px; line-height: 1.5; }
.generation-page-navigation > div { display: flex; gap: 10px; flex-wrap: wrap; }
.generation-page-navigation a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 14px; border: 1px solid #eedfd5; border-radius: 10px; color: #7a3605; background: #fff; font-size: 14px; font-weight: 600; text-decoration: none; }
.generation-page-navigation [data-new-generation] { color: #fff; background: linear-gradient(125deg, #f56d18, #d75100); border-color: #d75100; }
@media (max-width: 860px) {
  body.generation-status-page .page-shell { display: flex; flex-direction: column; min-height: 100svh; padding: 0 0 calc(76px + env(safe-area-inset-bottom)); }
  body.generation-status-page .page-shell > .top-nav { display: none !important; }
  body.generation-status-page .page-shell > .mobile-brand-header {
    display: grid !important; position: relative; flex: none; width: 100%; height: auto;
    min-height: 59px; margin: 0; padding: calc(7px + env(safe-area-inset-top)) 20px 9px;
    grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center;
    border: 0; border-radius: 0; background: #fff; box-sizing: border-box; z-index: 30;
    font: 400 16px/1.5 var(--font-ui, Arial, sans-serif);
  }
  body.generation-status-page .page-shell > .mobile-brand-header .mobile-brand-header-home { justify-self: center; }
  body.generation-status-page .page-shell > .mobile-brand-header .mobile-brand-header-logo { width: 128px; height: auto; }
  body.generation-status-page #generator-main-grid { flex: 1 0 auto; width: calc(100% - 24px) !important; padding: 0 !important; }
  body.generation-status-page .site-footer { display: none !important; }
  body.generation-status-page #generator-main-grid { margin: 12px auto !important; }
  .generation-page-navigation > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .generation-page-navigation a { padding: 9px; font-size: 12px; text-align: center; }
}

/* Minimal first paint while the large shared stylesheets load asynchronously.
   The existing, unlayered site styles take over as soon as they arrive. */
@layer generation-startup {
  body.generation-status-page { margin: 0; color: #2e2019; background: #fdfaf8; font: 400 14px/1.5 Inter, Arial, sans-serif; }
  body.generation-status-page * { box-sizing: border-box; }
  body.generation-status-page .hidden { display: none; }
  body.generation-status-page .page-shell { width: min(1120px, 100%); margin: auto; padding: 16px; }
  body.generation-status-page .top-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 12px 20px; background: #fff; border-radius: 20px; }
  body.generation-status-page .top-nav-brand-image { width: 150px; height: auto; }
  body.generation-status-page .top-nav-links, body.generation-status-page .top-nav-auth { display: flex; gap: 16px; align-items: center; }
  body.generation-status-page a { color: #884720; text-decoration: none; }
  body.generation-status-page .mobile-brand-header { display: none; }
  body.generation-status-page .mobile-brand-header-actions { visibility: hidden; }
  body.generation-status-page .mobile-brand-header-account { display: grid; place-items: center; width: 44px; height: 44px; padding: 10px; border: 1px solid #eedfd5; border-radius: 50%; background: #fff; color: #9b4d18; }
  body.generation-status-page .mobile-brand-header-account svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.5; }
  body.generation-status-page .site-footer { margin-top: 48px; }
  body.generation-status-page .site-footer-panel { padding: 24px; background: #fff; border: 1px solid #ebe6e3; border-radius: 18px; }
  body.generation-status-page .site-footer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; align-items: center; }
  body.generation-status-page .site-footer-logo { display: block; width: 160px; max-width: 100%; }
  body.generation-status-page .site-footer svg { width: 16px; height: 16px; fill: none; stroke: #d69b6f; stroke-width: 2; flex: none; }
  body.generation-status-page .site-footer img { max-width: 100%; height: auto; }
  body.generation-status-page .site-footer-link-list, body.generation-status-page .site-footer-legal-links { display: flex; flex-wrap: wrap; gap: 12px; }
  body.generation-status-page .site-footer-section { display: grid; gap: 12px; }
  body.generation-status-page .site-footer-section-title { display: flex; align-items: center; gap: 8px; color: #244160; font-weight: 500; }
  body.generation-status-page .site-footer-support, body.generation-status-page .site-footer-security-label { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 11px; color: #84919d; }
  body.generation-status-page .site-footer-legal-link { color: #304264; font-size: 12px; }
  body.generation-status-page .site-footer-security { display: grid; justify-items: center; gap: 8px; }
  body.generation-status-page .site-footer-payments { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  body.generation-status-page .site-footer-payment-mark { display: grid; place-items: center; min-height: 44px; padding: 8px; border: 1px solid #ebe0d8; border-radius: 10px; }
  body.generation-status-page .site-footer img.site-footer-payment-logo { max-width: 100%; max-height: 26px; width: auto; }
  @media (max-width: 860px) {
    body.generation-status-page .site-footer-grid { grid-template-columns: 1fr 1fr; grid-template-areas: "brand brand" "explore legal" "security security" "support support"; gap: 24px 0; }
    body.generation-status-page .site-footer-brand { display: contents; }
    body.generation-status-page .site-footer-logo { grid-area: brand; justify-self: center; width: 148px; }
    body.generation-status-page .site-footer-support { grid-area: support; justify-self: center; font-size: 10px; }
    body.generation-status-page .site-footer-explore { grid-area: explore; }
    body.generation-status-page .site-footer-legal { grid-area: legal; border-left: 1px solid #f1e1d5; }
    body.generation-status-page .site-footer-section { padding: 0 8px; align-self: start; }
    body.generation-status-page .site-footer-section-title { justify-content: center; padding-bottom: 12px; border-bottom: 1px dotted #e1bfa6; }
    body.generation-status-page .site-footer-link-list { display: grid; grid-template-columns: 1fr; justify-items: center; gap: 12px; }
    body.generation-status-page .site-footer-security { grid-area: security; }
  }
}
html.generation-status-loading .page-shell > :not(.top-nav):not(.mobile-brand-header):not(#generator-main-grid):not(.site-footer) { display: none !important; }