/* Shared page scale. Opt in explicitly so editor canvases and admin workspaces keep their geometry. */
body[data-site-layout] {
  --site-content-width: 1540px;
  --site-gutter: 24px;
  --site-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --site-title-size: 36px;
  --site-section-size: 32px;
  font-family: var(--site-font);
  -webkit-font-smoothing: antialiased;
}
body[data-site-layout]:not([data-site-layout="workspace"]):not([data-site-layout="tool"]) { font-size: 16px; }
body[data-site-layout] :is(button, input, select, textarea) { font-family: var(--site-font); }

/* Content pages share the same outside edges; their internal grids remain product-specific. */
body[data-site-layout]:not([data-site-layout="workspace"]) :is(.home-shell, .aihub-shell, .credits-shell, .page-shell) {
  width: 100%; max-width: none; margin: 0; border: 0; border-radius: 0; box-shadow: none;
}
body[data-site-layout="home"], body[data-site-layout="catalog"] { background: var(--paper, #fffdfb); }
body[data-site-layout] :is(.hero-section, .home-section, .site-footer, .start-main, .selection-shell, .aihub-main, .myalbums-main, .credits-main, .paint-shell, .old-photo-workspace),
body[data-site-layout="form"] > main,
body[data-site-layout="pricing"] main {
  width: min(var(--site-content-width), calc(100% - var(--site-gutter) * 2));
  max-width: none; margin-inline: auto; padding-inline: 0;
}
body[data-site-layout] :is(.start-main, .aihub-main, .myalbums-main, .credits-main),
body[data-site-layout="form"] > main { padding-top: 36px; }
body[data-site-layout="start"] :is(.theme-grid, .start-practical-tools, .recent-use) { width: 100%; }

/* Standard navigation text and alignment, including the existing compact tool headers. */
body[data-site-layout] :is(.site-nav, .start-nav, .selection-site-nav, .tool-site-header-nav, .entry-nav, .legal-topbar nav) > a { font-size: 16px; }
body[data-site-layout] :is(.site-nav, .start-nav) { display: flex; align-items: stretch; gap: 24px; }
body[data-site-layout] :is(.site-nav, .start-nav) > a { display: inline-flex; align-items: center; padding: 0; font-weight: 600; }
body[data-site-layout] .site-nav__link::after { bottom: 15px; }
body[data-site-layout] nav > [data-account-entry] { font-size: 14px; }
body[data-site-layout] :is(.site-header, .start-header, .tool-site-header, .entry-header, .legal-topbar) {
  padding-inline: max(var(--site-gutter), calc((100% - var(--site-content-width)) / 2));
}
body[data-site-layout] .site-header:has(> .site-header-inner) { padding-inline: 0; }
body[data-site-layout] .site-header-inner {
  width: min(var(--site-content-width), calc(100% - var(--site-gutter) * 2));
}
body[data-site-layout] :is(.site-header, .start-header):has(> :is(.brand, .start-brand)) {
  grid-template-columns: 240px minmax(0, 1fr) auto; min-height: 76px;
}
body[data-site-layout] :is(.site-nav, .start-nav) { height: 76px; }
body[data-site-layout] :is(.brand-copy, .start-brand__copy) strong { font-size: 20px; }
body[data-site-layout] :is(.brand-copy, .start-brand__copy) small { font-size: 12px; }
body[data-site-layout] :is(.brand-mark, .start-brand__mark):has(svg) { width: 40px; height: 40px; }
body[data-site-layout] :is(.membership-button, .start-membership, .avatar-button, .start-avatar, .site-account-entry) { font-size: 14px; }

/* Page titles share a scale; the homepage retains the larger introductory headline. */
body[data-site-layout] :is(.start-intro h1, .selection-intro h1, .myalbums-title, .aihub-hero__title, .tools-heading h1, .credits-hero h1, .page-heading h1, .checkout-intro h1, .paint-hero h1, .legal-hero h1),
body[data-site-layout="form"] > main > h1 {
  font-size: var(--site-title-size); line-height: 1.3;
}
body[data-site-layout] :is(.start-intro p, .start-practical-heading p, .selection-intro p, .myalbums-sub, .aihub-hero__sub, .page-heading p, .paint-hero p) { font-size: 16px; line-height: 1.65; }
body[data-site-layout] :is(.home-section h2, .start-practical-heading h2) { font-size: var(--site-section-size); line-height: 1.35; }
body[data-site-layout] :is(.making-section-head h2, .credits-section h2, .section__title) { font-size: 28px; line-height: 1.4; }

body[data-site-layout="home"] .hero-section {
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr); gap: 48px; padding-block: 48px 36px;
}
body[data-site-layout="home"] .hero-copy h1 { font-size: 48px; }
body[data-site-layout="home"] .hero-description { font-size: 18px; }
body[data-site-layout="home"] .home-mode-link { min-height: 88px; }
body[data-site-layout="home"] .home-mode-link strong { font-size: 18px; }
body[data-site-layout="home"] .home-mode-link small { font-size: 14px; }
body[data-site-layout="home"] .hero-resume { font-size: 14px; }
body[data-site-layout="home"] .home-section { padding-block: 40px; }
body[data-site-layout="home"] .home-process-card h3 { font-size: 24px; }
body[data-site-layout="home"] :is(.home-section-heading p, .home-process-card header p, .home-process-steps p, .home-fee-grid p, .home-faq details p, .home-ai-copy p) { font-size: 16px; }
body[data-site-layout="home"] :is(.home-process-steps strong, .home-text-link, .home-faq summary, .home-ai-link) { font-size: 16px; }
body[data-site-layout="home"] :is(.home-process-note, .home-pricing-rule, .home-pricing-notes p) { font-size: 14px; }
body[data-site-layout="home"] .home-ai h2 { font-size: 26px; }
body[data-site-layout="home"] .site-footer { padding-block: 24px; }
body[data-site-layout="home"] :is(.home-pricing, .home-ai) {
  /* Extend the section background to the viewport without narrowing its content. */
  box-shadow: 0 0 0 100vmax #fcf8f3; clip-path: inset(0 -100vmax);
}

body[data-site-layout="catalog"] .making-section-head p { font-size: 16px; }
body[data-site-layout="catalog"] .making-mode strong { font-size: 16px; }
body[data-site-layout="catalog"] .making-mode small { font-size: 13px; }
body[data-site-layout="catalog"] .making-product p { font-size: 16px; }
body[data-site-page="more-tools"] { padding: 0; }
body[data-site-page="more-tools"] .tools-shell { padding: 0; border: 0; border-radius: 0; box-shadow: none; }
body[data-site-page="more-tools"] .site-header { margin: 0 0 36px; }
body[data-site-page="more-tools"] :is(.tools-heading, .tool-directory) { width: min(var(--site-content-width), calc(100% - var(--site-gutter) * 2)); max-width: none; margin-inline: auto; }
body[data-site-layout="tool"] .old-photo-workspace { padding-bottom: 18px; }
body[data-site-layout="photos"] .selection-group-head h3 { font-family: var(--site-font); }
body[data-site-layout="form"] .design-dock { width: min(var(--site-content-width), calc(100% - var(--site-gutter) * 2)); }
body[data-site-layout="pricing"] .hero h1 { font-family: var(--site-font); font-size: 44px; }
body[data-site-layout="pricing"] .section-heading h2 { font-family: var(--site-font); font-size: var(--site-section-size); }
body[data-site-layout="legal"] .legal-shell { width: min(980px, calc(100% - var(--site-gutter) * 2)); max-width: none; padding-inline: 0; }
body[data-site-layout="legal"] :is(.legal-hero p, .legal-card p, .legal-card li) { font-size: 16px; }

@media (min-width: 1281px) {
  body[data-site-layout] :is(.site-header, .start-header):has(> :is(.brand, .start-brand)) { padding-block: 0; }
}

@media (max-width: 1280px) {
  body[data-site-layout] :is(.site-header, .start-header):has(> :is(.brand, .start-brand)) {
    grid-template-columns: minmax(0, 1fr) auto; height: auto; padding-block: 14px;
  }
  body[data-site-layout] :is(.site-header > .site-nav, .start-nav) {
    grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; flex-wrap: wrap;
    height: auto; overflow: visible; gap: 6px 18px; padding-top: 10px;
  }
  body[data-site-layout] :is(.site-header > .site-nav, .start-nav) a { min-height: 32px; }
  body[data-site-layout] :is(.site-nav__link, .start-nav a)[aria-current="page"]::after,
  body[data-site-layout] .site-nav__link.is-active::after { bottom: 0; }
  body[data-site-layout="home"] .hero-section { gap: 32px; }
  body[data-site-layout="home"] .hero-copy h1 { font-size: 42px; }
}
@media (max-width: 980px) {
  body[data-site-layout] { --site-gutter: 20px; }
  body[data-site-layout="home"] .hero-section { grid-template-columns: 1fr; gap: 28px; padding-block: 32px; }
  body[data-site-layout="home"] .hero-actions { max-width: 520px; }
  body[data-site-layout="form"] .site-header-inner { flex-wrap: wrap; }
  body[data-site-layout="form"] .site-header .entry-nav { justify-content: flex-start; }
}
@media (max-width: 620px) {
  body[data-site-layout] { --site-gutter: 16px; --site-title-size: 30px; --site-section-size: 26px; }
  body[data-site-layout] :is(.start-main, .aihub-main, .myalbums-main, .credits-main),
  body[data-site-layout="form"] > main { padding-top: 28px; }
  body[data-site-layout] :is(.brand-copy, .start-brand__copy) strong { font-size: 17px; }
  body[data-site-layout] :is(.brand-mark, .start-brand__mark):has(svg) { width: 36px; height: 36px; }
  body[data-site-layout] :is(.site-header, .start-header):has(> :is(.brand, .start-brand)) {
    display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between;
  }
  body[data-site-layout] :is(.site-header > .site-nav, .start-nav) { flex-basis: 100%; order: 3; padding-top: 0; }
  body[data-site-layout] :is(.header-actions, .start-header__actions) { gap: 10px; }
  body[data-site-layout] :is(.membership-button, .start-membership, .avatar-button, .start-avatar, .site-account-entry) { font-size: 12px; }
  body[data-site-layout] nav > [data-account-entry] { font-size: 12px; }
  body[data-site-layout] :is(.making-section-head h2, .credits-section h2, .section__title) { font-size: 24px; }
  body[data-site-layout] :is(.start-intro p, .start-practical-heading p, .selection-intro p, .myalbums-sub, .aihub-hero__sub, .page-heading p, .paint-hero p) { font-size: 15px; }
  body[data-site-layout="home"] .hero-copy h1 { font-size: 34px; }
  body[data-site-layout="home"] .hero-description { font-size: 16px; }
  body[data-site-layout="home"] .home-section { padding-block: 30px; }
  body[data-site-layout="home"] .home-mode-link { padding: 14px 12px; }
  body[data-site-layout="home"] .home-mode-link strong { font-size: 16px; }
  body[data-site-layout="home"] .home-mode-link small { font-size: 12px; }
  body[data-site-layout="home"] .home-process-card h3 { font-size: 22px; }
  body[data-site-layout="home"] .home-ai h2 { font-size: 24px; }
  body[data-site-layout="pricing"] .hero h1 { font-size: 34px; }
  body[data-site-layout="tool"] .tool-site-header { padding-inline: var(--site-gutter); }
  body[data-site-layout="legal"] .legal-topbar { flex-wrap: wrap; }
  body[data-site-layout="legal"] .legal-topbar nav { justify-content: flex-start; }
}
@media (max-width: 380px) {
  body[data-site-layout="home"] .home-mode-link { padding-inline: 10px; }
  body[data-site-layout="home"] .home-mode-link strong { font-size: 15px; }
}