/* SRX Hub — Lagoon theme (prompt 236). The same palette as SRX Code's own Lagoon theme
 * (studio-src/src/themes/lagoon/theme-lagoon.base.css), MEASURED from the owner's example: fresh green #63b139 -> teal
 * #3b8096 -> ocean blue #1b5adf. White text on that green is 2.67:1, so the bright gradient only decorates; white text
 * sits on forest #2b7a2f -> ocean #1b5adf (WCAG AA). Keeps the SRX Code mark. Kept in its own file so no other theme is
 * affected. */
html[data-theme="lagoon"] {
  --font: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --heading-font: var(--font);
  --bg: #f4f9f7; --surface: #ffffff; --surface-2: #eef6f3; --line: #dce8e5; --line-strong: #c6d8d3;
  --ink: #0a1a1e; --ink-2: #1d3238; --muted: #4e676f; --link: #1b5adf; --code-bg: #edf5f2;
  --primary: #1b5adf; --primary-strong: #1649b8; --primary-soft: #ebf2ff;
  --primary-bg: linear-gradient(90deg, #2b7a2f 0%, #1b5adf 100%); --primary-ink: #ffffff;
  --primary-shadow: 0 6px 18px rgba(27, 90, 223, .26); --primary-shadow-hover: 0 8px 24px rgba(27, 90, 223, .34);
  --focus: #1b5adf; --ring: rgba(27, 90, 223, .18);
  --radius: 16px; --radius-sm: 12px; --radius-lg: 22px;
  --shadow: 0 1px 2px rgba(6, 27, 36, .04), 0 8px 24px rgba(6, 27, 36, .06);
  --shadow-hover: 0 10px 28px rgba(6, 27, 36, .11);
  --shadow-lg: 0 24px 60px rgba(6, 27, 36, .24);
  --topbar-bg: #061b24; --topbar-ink: #ffffff; --topbar-muted: #a9cfc4; --topbar-line: rgba(255, 255, 255, .12); --topbar-hover: rgba(255, 255, 255, .08);
  --nav-on-line: #63b139; --nav-spacing: 0; --nav-transform: none;
  --hero-bg: radial-gradient(1100px 520px at 100% 0%, rgba(27, 90, 223, .45), transparent 60%), radial-gradient(900px 480px at 0% 100%, rgba(99, 177, 57, .32), transparent 60%), linear-gradient(135deg, #04161d 0%, #08222e 55%, #0a1f3d 100%);
  --hero-ink: #ffffff; --hero-muted: #c5ded7; --hero-accent: #8fd66a; --hero-chip: rgba(99, 177, 57, .2);
  --hero-glow: radial-gradient(circle, rgba(99, 177, 57, .4), rgba(99, 177, 57, 0) 65%);
  --hero-pattern: none;
  --auth-panel-bg: radial-gradient(900px 500px at 100% 100%, #eaf6ee, transparent 60%), #ffffff;
  --tile-bg: linear-gradient(135deg, #eaf6ee, #e3edff); --tile-ink: #1649b8;
  --avatar-bg: linear-gradient(90deg, #2b7a2f, #1b5adf); --avatar-ink: #ffffff;
  --toast-bg: #061b24;
  --btn-spacing: 0; --btn-transform: none;
  --h1-spacing: -.02em; --h1-transform: none; --h2-spacing: -.01em; --h2-transform: none; --h3-spacing: 0; --h3-transform: none;
}