/* Landing composition only. Colors and typography come from the existing
   Surface Meridian tokens -> existing public-site brand pipeline.
   No copied palette. Device geometry stays in playground.css. */
body[data-page="landing"].titanium-concept {
  color-scheme: light;
  --canvas: var(--md-canvas);
  --surface: var(--md-surface);
  --ink: var(--md-ink);
  --muted: var(--md-muted);
  --line: var(--md-border);
  --accent: var(--md-accent);
  --sans: var(--ordax-font);
  --serif: var(--ordax-font-display);
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--sans);
  overflow-x: clip;
}
body[data-page="landing"] :focus-visible { outline: 2px solid var(--md-focus); outline-offset: 5px; }
body[data-page="landing"] section[id] { scroll-margin-top: 112px; }
body[data-page="landing"] .site-header {
  position: sticky; top: 12px; z-index: 130;
  max-width: 1344px; min-height: 68px; padding: 10px 24px; gap: 20px;
  background: var(--md-surface); border: 1px solid var(--md-border); border-radius: var(--md-radius); margin: 16px auto 0; box-shadow: var(--md-shadow-small);
}
body[data-page="landing"] .brand-name { color: var(--ink); font-family: var(--sans); font-weight: 650; }
body[data-page="landing"] .site-header > .brand { flex-shrink: 0; gap: 8px; min-height: 44px; }
body[data-page="landing"] .site-header .brand-name { font-size: 28px; }
body[data-page="landing"] .site-header .brand-mark { width: 30px; height: 30px; }
body[data-page="landing"] .site-nav { gap: 18px; font-size: 13px; white-space: nowrap; }
body[data-page="landing"] .site-nav a, body[data-page="landing"] .site-actions > a { min-height: 44px; display: inline-flex; align-items: center; }
body[data-page="landing"] .site-nav a { color: var(--muted); }
body[data-page="landing"] .site-nav a:hover { color: var(--ink); border-color: var(--accent); }
body[data-page="landing"] .site-actions { flex-shrink: 0; gap: 12px; }
body[data-page="landing"] .site-actions .nav-cta { background: var(--md-accent); color: var(--md-accent-text); border: 1px solid transparent; border-radius: var(--md-radius-small); padding: 12px 18px; }
body[data-page="landing"] .nav-cta [data-auth-nav-label] { margin: 0; }
body[data-page="landing"] .public-locale-select { min-height: 44px; max-width: 158px; font-size: 11px; color: var(--ink); border-color: var(--line); border-radius: var(--md-radius-small); }
body[data-page="landing"] .landing-locale-slot { display: inline-flex; align-items: center; }
body[data-page="landing"] .landing-locale-slot .public-locale-switcher { margin: 0; }
body[data-page="landing"] .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
body[data-page="landing"] .public-locale-select option { color: var(--ink); background: var(--canvas); }
body[data-page="landing"] .eyebrow { color: var(--accent); font-size: 10px; font-weight: 600; letter-spacing: .16em; line-height: 1.6; margin: 0 0 10px; }
body[data-page="landing"] .live-dot { background: var(--accent); box-shadow: 0 0 0 5px var(--md-sage-soft); }
body[data-page="landing"] .hero {
  max-width: 1440px; padding: 32px 48px 0; overflow: visible; text-align: center;
  background: radial-gradient(ellipse at 50% 0%, var(--md-sage-soft), transparent 67%);
}
body[data-page="landing"] .hero .eyebrow { justify-content: center; font-family: var(--sans); font-weight: 600; color: var(--accent); letter-spacing: .16em; }
body[data-page="landing"] .hero-copy { max-width: 960px; margin: auto; }
body[data-page="landing"] .hero h1 { font: 520 clamp(38px, 4.8vw, 64px)/1.1 var(--sans); letter-spacing: -.055em; text-wrap: balance; margin: 0; }
body[data-page="landing"] .hero h1 span { color: var(--md-sage); background: none; -webkit-text-fill-color: currentColor; text-shadow: none; }
body[data-page="landing"] .hero-lead { max-width: 640px; margin: 18px auto 0; font-size: 16px; line-height: 1.7; color: var(--muted); }
body[data-page="landing"] .hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 20px 0 0; }
body[data-page="landing"] .button { min-height: 48px; padding: 14px 22px; font-size: 13px; border-radius: var(--md-radius-small); gap: 24px; font-weight: 600; }
body[data-page="landing"] .button-primary { background: var(--md-accent); color: var(--md-accent-text); border-color: transparent; box-shadow: none; }
body[data-page="landing"] .button-primary:hover { background: var(--md-accent-hover); }
body[data-page="landing"] .button-quiet { color: var(--ink); border-color: var(--line); background: var(--md-subtle); }
body[data-page="landing"] .button-quiet:hover { background: var(--md-subtle); }
body[data-page="landing"] .prototype-note { text-align: center; color: var(--md-muted); font-size: 12px; margin: 12px 0 0; }
body[data-page="landing"] .landing-intro-line { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 24px 0 0; padding: 6px 0; border-block: 1px solid var(--line); text-align: left; }
body[data-page="landing"] .landing-intro-line > span { font-size: 9px; letter-spacing: .13em; color: var(--md-muted); }
body[data-page="landing"] .landing-intro-line p { font-size: 14px; color: var(--muted); margin: 0; }
body[data-page="landing"] .landing-intro-line a { display: flex; gap: 18px; font-size: 12px; color: var(--accent); padding: 10px 0; }
body[data-page="landing"] .landing-purpose > .landing-heading { max-width: none; display: grid; grid-template-columns: 1.15fr 1fr; gap: 0 32px; align-items: end; }
body[data-page="landing"] .landing-purpose > .landing-heading .eyebrow { grid-column: 1 / -1; }
body[data-page="landing"] .landing-purpose > .landing-heading > p:not(.eyebrow) { margin: 0; }
/* Only the frame around the original notebook and phone changes. */
body[data-page="landing"] .playground { display: block; padding-top: 12px; padding-bottom: 32px; }
body[data-page="landing"] .landing-demo-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--line); }
body[data-page="landing"] .landing-demo-heading .demo-recipes { max-width: 100%; flex-wrap: wrap; flex-shrink: 0; gap: 4px; margin: 0; padding: 4px; background: var(--md-subtle); border: 1px solid var(--line); border-radius: var(--md-radius); }
body[data-page="landing"] .playground-heading { text-align: left; position: static; width: auto; height: auto; overflow: visible; clip-path: none; }
body[data-page="landing"] .device-stage { margin-top: 12px; }
body[data-page="landing"] .playground-heading .eyebrow { display: block; margin-bottom: 8px; }
body[data-page="landing"] .playground-heading h2 { color: var(--ink); font: 500 clamp(24px, 2.7vw, 32px)/1.2 var(--sans); letter-spacing: -.04em; }
body[data-page="landing"] .playground-heading > p:last-child { color: var(--muted); max-width: 580px; margin: 10px 0 0; font-size: 14px; line-height: 1.7; }
body[data-page="landing"] .demo-recipes button { padding: 10px 12px; min-height: 44px; border: 1px solid transparent; color: var(--muted); border-radius: var(--md-radius-small); }
body[data-page="landing"] .demo-recipes button:hover { background: var(--md-subtle); }
body[data-page="landing"] .demo-recipes button[aria-pressed="true"] { background: var(--md-surface); border-color: var(--line); color: var(--md-accent); box-shadow: var(--md-shadow-small); }
body[data-page="landing"] .demo-status, body[data-page="landing"] .demo-sync-note { color: var(--muted); font-size: 12px; }
body[data-page="landing"] .demo-sync-note { max-width: 820px; line-height: 1.8; }
body[data-page="landing"] .demo-tools button { min-height: 44px; color: var(--ink); border-color: var(--line); background: var(--md-subtle); border-radius: var(--md-radius-small); }
body[data-page="landing"] .demo-tools button:hover { background: var(--md-subtle); }
body[data-page="landing"] .landing-section { max-width: 1344px; margin: 0 auto; padding: 44px 48px; border-top: 1px solid var(--line); }
body[data-page="landing"] .landing-heading { max-width: 740px; }
body[data-page="landing"] .landing-heading h2, body[data-page="landing"] .landing-closing h2 { font: 500 clamp(30px, 3.4vw, 44px)/1.14 var(--sans); letter-spacing: -.045em; margin: 0; text-wrap: balance; }
body[data-page="landing"] .landing-heading h2 span { color: var(--md-sage); }
body[data-page="landing"] .landing-heading p:not(.eyebrow) { color: var(--muted); font-size: 15px; line-height: 1.7; max-width: 610px; margin: 16px 0 0; }
body[data-page="landing"] .landing-heading-split { max-width: none; display: grid; grid-template-columns: 1.15fr 1fr; align-items: end; gap: 32px; }
body[data-page="landing"] .landing-heading-split > p:not(.eyebrow) { margin: 0; }
body[data-page="landing"] .landing-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
body[data-page="landing"] .landing-icon { width: 24px; height: 24px; flex-shrink: 0; color: var(--accent); }
body[data-page="landing"] .landing-benefits article { display: grid; grid-template-columns: 44px minmax(0,1fr); column-gap: 14px; align-content: start; align-items: center; border: 1px solid var(--line); padding: 22px; background: var(--md-surface); border-radius: var(--md-radius); }
body[data-page="landing"] .landing-benefits h3 { font-size: 20px; font-weight: 500; letter-spacing: -.02em; margin: 0; }
body[data-page="landing"] .landing-benefits p { grid-column: 1/-1; padding-top: 14px; font-size: 14px; line-height: 1.7; color: var(--muted); margin: 0; }
body[data-page="landing"] .landing-space-board { margin-top: 24px; border: 1px solid var(--line); border-radius: var(--md-radius-large); background: var(--surface); overflow: hidden; }
body[data-page="landing"] .landing-board-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
body[data-page="landing"] .landing-board-top > span:first-child { display: flex; align-items: center; gap: 12px; font-size: 14px; }
body[data-page="landing"] .landing-tag { max-width: 100%; display: inline-flex; align-items: center; width: fit-content; padding: 5px 9px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 10px; line-height: 1.5; flex-shrink: 0; }
body[data-page="landing"] .landing-space-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 16px; background: var(--md-canvas); }
body[data-page="landing"] .landing-space-card { padding: 20px; border: 1px solid var(--line); border-radius: var(--md-radius); background: var(--surface); display: grid; grid-template-columns: 36px minmax(0,1fr); grid-template-rows: auto auto 1fr auto; gap: 0 10px; align-items: start; min-width: 0; }
body[data-page="landing"] .landing-space-card > .landing-icon { width: 36px; height: 36px; padding: 8px; border: 1px solid var(--line); border-radius: var(--md-radius-small); background: var(--md-sage-soft); }
body[data-page="landing"] .landing-card-kicker { color: var(--accent); font-size: 11px; line-height: 1.5; margin: 0; align-self: center; }
body[data-page="landing"] .landing-space-card h3 { grid-column: 1/-1; padding-top: 16px; font-size: 20px; font-weight: 500; line-height: 1.3; letter-spacing: -.025em; margin: 0 0 10px; }
body[data-page="landing"] .landing-space-card > p:not(.landing-card-kicker) { grid-column: 1/-1; color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0 0 16px; }
body[data-page="landing"] .landing-space-card small { grid-column: 1/-1; color: var(--md-muted); font-size: 10px; line-height: 1.7; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); }
body[data-page="landing"] .landing-caption { color: var(--md-muted); font-size: 12px; line-height: 1.7; margin: 12px 0 0; }
body[data-page="landing"] .landing-space-board > .landing-caption { margin: 0; padding: 12px 20px; border-top: 1px solid var(--line); }
body[data-page="landing"] .landing-network { margin-top: 14px; display: flex; gap: 16px; align-items: center; padding: 18px 20px; background: var(--md-subtle); border-radius: var(--md-radius); }
body[data-page="landing"] .landing-network h3 { margin: 0 0 8px; font-size: 16px; font-weight: 500; }
body[data-page="landing"] .landing-network p { margin: 0; font-size: 13px; line-height: 1.8; color: var(--muted); }
body[data-page="landing"] .landing-intelligence { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 32px; align-items: start; }
body[data-page="landing"] .landing-text-link { display: inline-flex; align-items: center; gap: 18px; color: var(--accent); font-size: 13px; min-height: 44px; line-height: 1.6; }
body[data-page="landing"] .landing-heading .landing-text-link { margin-top: 12px; }
body[data-page="landing"] .landing-text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
body[data-page="landing"] .landing-context-card { background: radial-gradient(ellipse at 100% 0, var(--md-sage-soft), transparent 65%), var(--surface); border: 1px solid var(--line); border-radius: var(--md-radius-large); }
body[data-page="landing"] .landing-context-card .landing-board-top { flex-wrap: wrap; }
body[data-page="landing"] .landing-context-steps, body[data-page="landing"] .landing-start-steps { list-style: none; margin: 0; padding: 0 22px; }
body[data-page="landing"] .landing-context-steps li, body[data-page="landing"] .landing-start-steps li { display: flex; align-items: start; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
body[data-page="landing"] .landing-context-steps li:last-child, body[data-page="landing"] .landing-start-steps li:last-child { border-bottom: 0; }
body[data-page="landing"] .landing-context-steps li > span { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--md-surface); }
body[data-page="landing"] .landing-context-steps li > span, body[data-page="landing"] .landing-start-steps li > span { color: var(--accent); font-size: 11px; padding-top: 4px; }
body[data-page="landing"] .landing-context-steps h3, body[data-page="landing"] .landing-start-steps h4 { font-size: 16px; font-weight: 500; margin: 0 0 9px; }
body[data-page="landing"] .landing-context-steps p, body[data-page="landing"] .landing-start-steps p { font-size: 13px; line-height: 1.8; color: var(--muted); margin: 0; }
body[data-page="landing"] .landing-context-card > .landing-caption { border-top: 1px solid var(--line); padding: 12px 22px; margin: 0; }
body[data-page="landing"] .landing-ai-footnotes { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; grid-column: 1/-1; }
body[data-page="landing"] .landing-ai-footnotes p { color: var(--muted); font-size: 13px; line-height: 1.8; margin: 0; }
body[data-page="landing"] .landing-ai-footnotes strong { display: block; font-weight: 500; color: var(--ink); margin-bottom: 8px; }
body[data-page="landing"] .landing-app-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
body[data-page="landing"] .landing-app-grid article { display: flex; align-items: center; gap: 12px; padding: 18px 16px; border: 1px solid var(--line); border-radius: var(--md-radius-small); background: var(--md-subtle); }
body[data-page="landing"] .landing-app-grid h3 { font-size: 14px; margin: 0 0 6px; font-weight: 500; }
body[data-page="landing"] .landing-app-grid p { font-size: 11px; line-height: 1.6; color: var(--muted); margin: 0; }
body[data-page="landing"] .landing-feature-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 16px; margin-top: 24px; }
body[data-page="landing"] .landing-feature-grid > article { padding: 26px; border: 1px solid var(--line); border-radius: var(--md-radius-large); background: var(--surface); }
body[data-page="landing"] .landing-feature-grid > .landing-studio { background: radial-gradient(ellipse at 0 100%, var(--md-sage-soft), transparent 70%), var(--surface); }
body[data-page="landing"] .landing-feature-title { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
body[data-page="landing"] .landing-feature-title .eyebrow { margin: 0; }
body[data-page="landing"] .landing-feature-grid h3 { margin: 0 0 14px; font-size: clamp(26px, 2.7vw, 32px); font-weight: 500; line-height: 1.15; letter-spacing: -.04em; }
body[data-page="landing"] .landing-feature-grid p:not(.eyebrow):not(.landing-caption) { color: var(--muted); font-size: 14px; line-height: 1.8; margin: 0; }
body[data-page="landing"] .landing-studio-flow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 0; margin: 16px 0; border-block: 1px solid var(--line); color: var(--accent); font-size: 10px; letter-spacing: .1em; }
body[data-page="landing"] .landing-store-list { padding: 0; margin: 16px 0; list-style: none; }
body[data-page="landing"] .landing-store-list li { display: flex; justify-content: space-between; gap: 15px; padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
body[data-page="landing"] .landing-store-list li span { color: var(--md-muted); }
body[data-page="landing"] .landing-modes { margin-top: 24px; border-top: 1px solid var(--line); }
body[data-page="landing"] .landing-mode { border-radius: var(--md-radius-small); display: grid; grid-template-columns: 36px minmax(0, 1fr) 145px 220px; align-items: center; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--line); }
body[data-page="landing"] .landing-mode-number { color: var(--md-muted); font-size: 11px; align-self: start; margin-top: 6px; }
body[data-page="landing"] .landing-mode h3 { font-size: 18px; font-weight: 500; margin: 0 0 10px; }
body[data-page="landing"] .landing-mode p { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0; }
body[data-page="landing"] .landing-mode:first-child .landing-tag { background: var(--md-sage-soft); color: var(--md-sage); }
body[data-page="landing"] .landing-usb { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 28px; padding: 28px; border: 1px solid var(--line); border-radius: var(--md-radius-large); background: var(--surface); }
body[data-page="landing"] .landing-usb h3 { font-size: clamp(28px, 3vw, 40px); line-height: 1.15; font-weight: 500; letter-spacing: -.035em; margin: 0; }
body[data-page="landing"] .landing-usb .button { margin-top: 16px; }
body[data-page="landing"] .landing-start-steps { padding: 0; }
body[data-page="landing"] .landing-control { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
body[data-page="landing"] .landing-control-list article { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
body[data-page="landing"] .landing-control-list article:first-child { padding-top: 0; }
body[data-page="landing"] .landing-control-list h3 { margin: 0 0 10px; font-size: 18px; font-weight: 500; }
body[data-page="landing"] .landing-control-list p { font-size: 14px; line-height: 1.8; color: var(--muted); margin: 0; }
body[data-page="landing"] .landing-faq { display: grid; grid-template-columns: .7fr 1.3fr; gap: 32px; }
body[data-page="landing"] .landing-questions details { border-bottom: 1px solid var(--line); }
body[data-page="landing"] .landing-questions details:first-child { border-top: 1px solid var(--line); }
body[data-page="landing"] .landing-questions summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 16px 0; font-size: 15px; line-height: 1.5; cursor: pointer; list-style: none; }
body[data-page="landing"] .landing-questions summary::-webkit-details-marker { display: none; }
body[data-page="landing"] .landing-questions summary span { color: var(--accent); font-size: 22px; transition: transform .18s; }
body[data-page="landing"] .landing-questions details[open] summary span { transform: rotate(45deg); }
body[data-page="landing"] .landing-questions details[open] summary { color: var(--md-accent); }
body[data-page="landing"] .landing-questions details > p { max-width: 65ch; font-size: 14px; line-height: 1.7; color: var(--muted); margin: 0 32px 24px 0; }
body[data-page="landing"] .landing-closing { text-align: center; padding: 56px 24px; border-top: 1px solid var(--line); background: radial-gradient(ellipse at 50% 100%, var(--md-sage-soft), transparent 65%); }
body[data-page="landing"] .landing-closing .eyebrow { justify-content: center; }
body[data-page="landing"] .landing-closing h2 { font-size: clamp(38px, 5vw, 60px); }
body[data-page="landing"] .landing-closing h2 span { color: var(--md-sage); }
body[data-page="landing"] .landing-closing > p:not(.eyebrow) { margin: 16px 0 0; font-size: 15px; line-height: 1.8; color: var(--muted); }
body[data-page="landing"] .landing-closing > .landing-text-link { margin-top: 12px; }
body[data-page="landing"] .site-footer { max-width: 1440px; padding: 24px 48px; border-color: var(--line); }
body[data-page="landing"] .site-footer nav { gap: 10px 20px; max-width: 630px; justify-content: end; }
body[data-page="landing"] .site-footer nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; color: var(--muted); }
body[data-page="landing"] .site-footer p { font-size: 12px; line-height: 1.8; }
@media (max-width: 1280px) {
  body[data-page="landing"] .site-header { gap: 16px; padding-inline: 20px; }
  body[data-page="landing"] .site-nav { gap: 12px; font-size: 12px; }
  body[data-page="landing"] .landing-demo-heading { align-items: start; flex-direction: column; gap: 16px; }
}
@media (max-width: 960px) {
  body[data-page="landing"] .site-header { flex-wrap: wrap; gap: 4px 16px; padding: 10px 20px; }
  body[data-page="landing"] .site-nav { order: 3; width: 100%; justify-content: center; flex-wrap: nowrap; gap: 20px; padding-top: 4px; border-top: 1px solid var(--line); overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; }
  body[data-page="landing"] .site-nav a { flex-shrink: 0; }
  body[data-page="landing"] .site-actions { margin-left: auto; }
  body[data-page="landing"] section[id] { scroll-margin-top: 140px; }
}
@media (max-width: 1120px) {
  body[data-page="landing"] .landing-section { padding: 44px 32px; }
  body[data-page="landing"] .landing-space-grid, body[data-page="landing"] .landing-app-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-page="landing"] .landing-intelligence, body[data-page="landing"] .landing-heading-split, body[data-page="landing"] .landing-control, body[data-page="landing"] .landing-faq { gap: 28px; }
  body[data-page="landing"] .landing-mode { grid-template-columns: 28px minmax(0, 1fr) 150px; }
  body[data-page="landing"] .landing-mode .landing-text-link { grid-column: 2/-1; }
  body[data-page="landing"] .landing-usb { gap: 30px; padding: 30px; }
  body[data-page="landing"] .landing-feature-grid > article { padding: 24px; }
}
@media (max-width: 760px) {
  body[data-page="landing"] .site-header { top: 6px; padding: 10px 14px; gap: 8px; }
  body[data-page="landing"] section[id] { scroll-margin-top: 140px; }
  body[data-page="landing"] .site-nav { flex-wrap: nowrap; justify-content: start; gap: 20px; padding-top: 4px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; }
  body[data-page="landing"] .site-nav a { flex-shrink: 0; }
  body[data-page="landing"] .site-actions { gap: 10px; }
  body[data-page="landing"] .site-actions .nav-cta { padding: 10px 12px; }
  body[data-page="landing"] .hero { padding: 32px 22px 0; }
  body[data-page="landing"] .hero h1 { font-size: clamp(37px, 7.5vw, 58px); }
  body[data-page="landing"] .hero-lead { font-size: 15px; }
  body[data-page="landing"] .hero .eyebrow { font-size: 9px; }
  body[data-page="landing"] .landing-intro-line { flex-wrap: wrap; justify-content: center; text-align: center; gap: 6px 20px; margin-top: 24px; }
  body[data-page="landing"] .landing-intro-line > span { width: 100%; }
  body[data-page="landing"] .playground { padding: 24px 22px 28px; }
  body[data-page="landing"] .demo-toolbar { align-items: start; }
  body[data-page="landing"] .demo-tools { flex-wrap: wrap; margin: 0; }
  body[data-page="landing"] .landing-section { padding: 36px 22px; }
  body[data-page="landing"] .landing-heading-split, body[data-page="landing"] .landing-intelligence, body[data-page="landing"] .landing-feature-grid, body[data-page="landing"] .landing-usb, body[data-page="landing"] .landing-control, body[data-page="landing"] .landing-faq { grid-template-columns: minmax(0, 1fr); }
  body[data-page="landing"] .landing-purpose > .landing-heading { grid-template-columns: minmax(0, 1fr); gap: 0; }
  body[data-page="landing"] .landing-purpose > .landing-heading > p:not(.eyebrow) { margin-top: 16px; }
  body[data-page="landing"] .landing-benefits { gap: 14px; grid-template-columns: minmax(0, 1fr); margin-top: 22px; }
  body[data-page="landing"] .landing-benefits h3 { margin-top: 0; }
  body[data-page="landing"] .landing-demo-heading .demo-recipes { width: 100%; flex-wrap: wrap; }
  body[data-page="landing"] .landing-board-top { flex-wrap: wrap; padding: 16px 18px; }
  body[data-page="landing"] .landing-space-card { padding: 18px; }
  body[data-page="landing"] .landing-space-grid { padding: 12px; gap: 10px; }
  body[data-page="landing"] .landing-network { flex-wrap: wrap; align-items: start; padding: 20px; }
  body[data-page="landing"] .landing-network > div { flex: 1; min-width: 190px; }
  body[data-page="landing"] .landing-network > .landing-tag { margin-left: 44px; }
  body[data-page="landing"] .landing-ai-footnotes { gap: 24px; grid-template-columns: minmax(0, 1fr); }
  body[data-page="landing"] .landing-app-grid { gap: 10px; }
  body[data-page="landing"] .landing-app-grid article { align-items: start; flex-direction: column; padding: 20px; }
  body[data-page="landing"] .landing-mode { gap: 14px; grid-template-columns: 24px minmax(0, 1fr); }
  body[data-page="landing"] .landing-mode .landing-tag, body[data-page="landing"] .landing-mode .landing-text-link { grid-column: 2; }
  body[data-page="landing"] .landing-usb { padding: 26px; gap: 20px; }
  body[data-page="landing"] .landing-closing { padding: 40px 22px; }
  body[data-page="landing"] .site-footer { padding: 24px 22px; flex-direction: column; align-items: start; gap: 20px; }
  body[data-page="landing"] .site-footer nav { margin: 0; justify-content: start; }
}
@media (max-width: 520px) {
  body[data-page="landing"] .site-header { position: relative; top: 0; }
  body[data-page="landing"] .site-header > .brand { flex: 1 0 100%; justify-content: center; }
  body[data-page="landing"] .site-actions { width: 100%; margin: 0; justify-content: space-between; }
  body[data-page="landing"] section[id] { scroll-margin-top: 24px; }
  body[data-page="landing"] .site-actions { gap: 10px; }
  body[data-page="landing"] .public-locale-select { width: 158px; padding-right: 14px; }
  body[data-page="landing"] .site-actions .nav-cta { font-size: 11px; padding-inline: 10px; }
  body[data-page="landing"] .site-actions .nav-cta > span:last-child { display: none; }
  body[data-page="landing"] .brand { gap: 6px; }
  body[data-page="landing"] .brand-name { font-size: 23px; }
  body[data-page="landing"] .brand-mark { width: 24px; height: 24px; }
}
@media (max-width: 400px) {
  body[data-page="landing"] .landing-space-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-page="landing"] .site-actions { gap: 8px; }
  body[data-page="landing"] .public-locale-select { width: 138px; font-size: 10px; }
  body[data-page="landing"] .hero-actions > .button { width: 100%; }
  body[data-page="landing"] .site-actions { gap: 10px; font-size: 11px; }
  body[data-page="landing"] .brand-name { font-size: 22px; }
  body[data-page="landing"] .landing-studio-flow { letter-spacing: 0; font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(body[data-page="landing"]) { scroll-behavior: auto; }
  body[data-page="landing"] *, body[data-page="landing"] *::before, body[data-page="landing"] *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* The device shells stay Titanium; the experience inside them uses Meridian.
   All following changes are paint only: viewport sizes and demo behavior stay intact. */
body[data-page="landing"][data-meridian] .demo-screen {
  --demo-bg:var(--md-canvas);--demo-ink:var(--md-ink);--demo-muted:var(--md-muted);
  --demo-line:var(--md-border);--demo-panel:var(--md-surface);
  color:var(--md-ink);background:var(--md-canvas);
}
body[data-page="landing"][data-meridian] .demo-topbar {background:var(--md-subtle);color:var(--md-muted);border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .demo-topbar b {color:var(--md-ink)}
body[data-page="landing"][data-meridian] .demo-topbar b::before {color:var(--md-sage)}
body[data-page="landing"][data-meridian] .demo-dock {background:var(--md-rail);border-color:var(--md-rail-border)}
body[data-page="landing"][data-meridian] .demo-dock button {color:var(--md-rail-muted)}
body[data-page="landing"][data-meridian] .demo-dock button[aria-pressed="true"] {background:var(--md-rail-selected);color:var(--md-rail-text);box-shadow:inset 2px 0 var(--md-art-clay)}
body[data-page="landing"][data-meridian] .demo-windowbar {background:var(--md-surface);color:var(--md-ink);border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .demo-windowbar > span {color:var(--md-muted)}
body[data-page="landing"][data-meridian] .demo-content {background:var(--md-canvas);color:var(--md-ink)}
body[data-page="landing"][data-meridian] .project-badge {color:var(--md-muted);border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .project-tabs button {color:var(--md-muted)}
body[data-page="landing"][data-meridian] .project-tabs button[aria-pressed="true"] {color:var(--md-accent);border-color:var(--md-accent)}
body[data-page="landing"][data-meridian] .project-ai {background:var(--md-surface);border-color:var(--md-border);box-shadow:var(--md-shadow-small);color:var(--md-ink)}
body[data-page="landing"][data-meridian] .project-ai :is(p,small,.response-label),
body[data-page="landing"][data-meridian] .project-milestones small,
body[data-page="landing"][data-meridian] .project-heading > div > p:last-child {color:var(--md-muted)}
body[data-page="landing"][data-meridian] .project-ai-points {border-color:var(--md-border);color:var(--md-muted)}
body[data-page="landing"][data-meridian] .project-ai-points ul {color:var(--md-ink)}
body[data-page="landing"][data-meridian] .project-ai-points li::marker {color:var(--md-sage)}
body[data-page="landing"][data-meridian] .project-ai-footnote {background:var(--md-sage-soft);border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .project-ai-footnote > span {color:var(--md-sage)}
body[data-page="landing"][data-meridian] .milestone-check {background:var(--md-sage-soft);color:var(--md-sage)}
body[data-page="landing"][data-meridian] .milestone-check.pending {background:transparent;border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .intelligence-cta {background:var(--md-accent);color:var(--md-accent-text)}
body[data-page="landing"][data-meridian] .ai-blue-dot {background:var(--md-sage);box-shadow:none}
body[data-page="landing"][data-meridian] .intelligence-orb {background:var(--md-sage-soft);border-color:var(--md-border);color:var(--md-sage);box-shadow:var(--md-shadow-small)}
body[data-page="landing"][data-meridian] :is(.response-label,.analysis-finding>b,.context-document::before) {color:var(--md-sage)}
body[data-page="landing"][data-meridian] :is(.concept-disclosure,.demo-local) {color:var(--md-muted)}
body[data-page="landing"][data-meridian] .context-detail {border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .demo-expanded {background:var(--md-canvas);color:var(--md-ink);border-color:var(--md-border)}
body[data-page="landing"][data-meridian] .expanded-header p {color:var(--md-muted)}
body[data-page="landing"][data-meridian] .expanded-header button {background:var(--md-surface);color:var(--md-ink);border-color:var(--md-border)}
body[data-page="landing"] .stage-orbit {inset:0 0 5%;overflow:hidden;opacity:.5;background:radial-gradient(ellipse at center,var(--md-sage-soft),transparent 70%)}
body[data-page="landing"] .stage-orbit::before {border-color:var(--md-border);box-shadow:none}
body[data-page="landing"] .stage-orbit::after {background:var(--md-art-clay);border-color:var(--md-accent-soft);box-shadow:var(--md-shadow-small)}
body[data-page="landing"] .landing-benefits .landing-icon {box-sizing:border-box;width:44px;height:44px;padding:10px;background:var(--md-sage-soft);color:var(--md-sage);border-radius:var(--md-radius-small)}
body[data-page="landing"] .landing-space-card:nth-child(2)>.landing-icon {background:var(--md-accent-soft);color:var(--md-accent)}
body[data-page="landing"] .landing-space-card:nth-child(3)>.landing-icon {background:var(--md-blue-soft);color:var(--md-blue)}
body[data-page="landing"] .landing-space-card:nth-child(4)>.landing-icon {background:var(--md-rose-soft);color:var(--md-rose)}
body[data-page="landing"] .landing-feature-grid > .landing-studio {background:var(--md-rail);color:var(--md-rail-text)}
body[data-page="landing"] .landing-studio :is(.eyebrow,.landing-icon,.landing-studio-flow) {color:var(--md-art-clay)}
body[data-page="landing"] .landing-feature-grid > .landing-studio p:not(.eyebrow),
body[data-page="landing"] .landing-studio .landing-caption {color:var(--md-rail-muted)}
body[data-page="landing"] .landing-studio-flow {border-color:var(--md-rail-border)}
body[data-page="landing"] .landing-app-grid article {background:var(--md-surface);box-shadow:var(--md-shadow-small)}
body[data-page="landing"] .landing-context-card {box-shadow:var(--md-shadow-small)}
@media(max-width:1400px){body[data-page="landing"] .site-header{margin-inline:24px}}
@media(max-width:760px){body[data-page="landing"] .site-header{margin:12px 12px 0}body[data-page="landing"] .landing-benefits article{padding:22px}}