/* luca-ui core 3.0.0. Copy unchanged into projects; calibrate in luca-ui.calibration.css. */
@layer luca-ui {
  :root {
    color-scheme: light dark;

    /* calibration inputs (defaults; the project calibration file is unlayered and wins) */
    --lu-accent: oklch(0.6 0.14 158);
    --lu-accent-fg: #000;
    --lu-tint-hue: 158;
    --lu-tint-strength: 0.04;
    --lu-tint-lift: 0;
    --lu-blur: 24px;
    --lu-wallpaper-image: none;
    --lu-mix-1: #2bb3a3; --lu-mix-2: #3a5bd9; --lu-mix-3: #e05a8a;
    --lu-wall-intensity: 0.9; --lu-wall-speed: 1;
    --lu-glass-opacity: 0.64; --lu-glass-tint: #ffffff; --lu-glass-rim: 0.85;

    /* neutrals */
    --lu-bg: light-dark(#f6f6f6, #0e0e0e);
    --lu-surface: light-dark(#ffffff, #191919);
    --lu-surface-2: light-dark(#fbfbfb, #202020);
    --lu-knob: light-dark(#ffffff, #f2f2f2);
    --lu-fg: light-dark(#171717, #ededed);
    --lu-muted: light-dark(#6b6b6b, #8a8a8a);
    --lu-line: light-dark(rgb(0 0 0 / 0.07), rgb(255 255 255 / 0.08));
    --lu-line-strong: light-dark(rgb(0 0 0 / 0.12), rgb(255 255 255 / 0.14));
    --lu-fill: light-dark(rgb(0 0 0 / 0.045), rgb(255 255 255 / 0.06));
    --lu-fill-strong: light-dark(rgb(0 0 0 / 0.12), rgb(255 255 255 / 0.16));
    --lu-danger: light-dark(oklch(0.52 0.19 27), oklch(0.72 0.16 27));
    --lu-success: light-dark(oklch(0.5 0.13 155), oklch(0.75 0.15 155));
    --lu-warning: light-dark(oklch(0.55 0.13 70), oklch(0.8 0.14 80));

    /* accent derivations */
    --lu-accent-text: var(--lu-accent);
    --lu-accent-text: light-dark(oklch(from var(--lu-accent) min(l, 0.48) c h), oklch(from var(--lu-accent) max(l, 0.8) c h));
    --lu-accent-tint: light-dark(color-mix(in oklab, var(--lu-accent) 12%, transparent), color-mix(in oklab, var(--lu-accent) 24%, transparent));
    --lu-ring: 0 0 0 1px var(--lu-accent), 0 0 0 4px color-mix(in oklab, var(--lu-accent) 22%, transparent);

    /* accent amount: balanced */
    --lu-page: var(--lu-bg);
    --lu-hl-bg: var(--lu-accent-tint);
    --lu-hl-fg: var(--lu-accent-text);
    --lu-hl-shadow: none;
    --lu-primary: var(--lu-accent);
    --lu-primary-fg: var(--lu-accent-fg);
    --lu-link: var(--lu-accent-text);
    --lu-eyebrow: var(--lu-muted);
    --lu-mark: light-dark(color-mix(in oklab, var(--lu-accent) 16%, transparent), color-mix(in oklab, var(--lu-accent) 30%, transparent));

    /* glass */
    --lu-scheme: light dark;
    --lu-material-2: light-dark(rgb(255 255 255 / 0.66), rgb(40 40 44 / 0.55));
    --lu-rim: light-dark(rgb(255 255 255 / var(--lu-glass-rim)), rgb(255 255 255 / calc(var(--lu-glass-rim) * 0.16)));
    --lu-rim-2: light-dark(rgb(255 255 255 / calc(var(--lu-glass-rim) * 0.4)), rgb(255 255 255 / calc(var(--lu-glass-rim) * 0.07)));
    --lu-sheen: light-dark(rgb(255 255 255 / 0.55), rgb(255 255 255 / 0.18));
    --lu-sheen-2: light-dark(rgb(255 255 255 / 0.22), rgb(255 255 255 / 0.08));
    --lu-smoke: light-dark(rgb(12 13 16 / calc(var(--lu-glass-opacity) * 0.9)), rgb(12 13 16 / calc(var(--lu-glass-opacity) * 0.9)));
    --lu-caustic: light-dark(rgb(255 255 255 / 0.16), rgb(255 255 255 / 0.12));
    --lu-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.18'/%3E%3C/svg%3E");
    --lu-shadow-tone: light-dark(rgb(0 0 0 / 0.06), rgb(0 0 0 / 0.4));
    --lu-shadow-tone-strong: light-dark(rgb(0 0 0 / 0.16), rgb(0 0 0 / 0.6));
    --lu-scrim: light-dark(rgb(0 0 0 / 0.18), rgb(0 0 0 / 0.5));

    /* wallpaper (mono) */
    --lu-wall-base: light-dark(oklch(clamp(0, calc(0.9 + var(--lu-tint-lift)), 1) calc(var(--lu-tint-strength) * 0.6) var(--lu-tint-hue)), oklch(clamp(0, calc(0.17 + var(--lu-tint-lift)), 1) calc(var(--lu-tint-strength) * 0.6) var(--lu-tint-hue)));
    --lu-wall-1: light-dark(oklch(clamp(0, calc(0.82 + var(--lu-tint-lift)), 1) var(--lu-tint-strength) var(--lu-tint-hue)), oklch(clamp(0, calc(0.36 + var(--lu-tint-lift)), 1) var(--lu-tint-strength) var(--lu-tint-hue)));
    --lu-wall-2: light-dark(oklch(clamp(0, calc(0.95 + var(--lu-tint-lift)), 1) calc(var(--lu-tint-strength) * 0.5) var(--lu-tint-hue)), oklch(clamp(0, calc(0.22 + var(--lu-tint-lift)), 1) calc(var(--lu-tint-strength) * 0.5) var(--lu-tint-hue)));
    --lu-wall-3: light-dark(oklch(clamp(0, calc(0.73 + var(--lu-tint-lift)), 1) calc(var(--lu-tint-strength) * 1.3) var(--lu-tint-hue)), oklch(clamp(0, calc(0.44 + var(--lu-tint-lift)), 1) calc(var(--lu-tint-strength) * 1.3) var(--lu-tint-hue)));

    /* shadows (colors come from --lu-line and --lu-shadow-tone) */
    --lu-shadow-card: 0 0 0 1px var(--lu-line), 0 2px 8px var(--lu-shadow-tone);
    --lu-shadow-pop: 0 0 0 1px var(--lu-line), 0 12px 32px -8px var(--lu-shadow-tone), 0 2px 6px var(--lu-shadow-tone);
    --lu-shadow-float: 0 8px 30px -12px var(--lu-shadow-tone);

    /* type, space, shape, motion */
    --lu-font: "Inter Variable", "Inter", system-ui, -apple-system, sans-serif;
    --lu-font-display: var(--lu-font); --lu-display-weight: 600; --lu-display-tracking: -0.025em;
    --lu-text-xs: 11px; --lu-text-sm: 12px; --lu-text-base: 14px; --lu-text-md: 15px;
    --lu-text-lg: 18px; --lu-text-xl: 24px; --lu-text-2xl: 34px; --lu-text-3xl: 44px;
    --lu-density: 1; --lu-control-h: 34px;
    --lu-space-1: calc(4px * var(--lu-density)); --lu-space-2: calc(8px * var(--lu-density)); --lu-space-3: calc(12px * var(--lu-density));
    --lu-space-4: calc(16px * var(--lu-density)); --lu-space-5: calc(20px * var(--lu-density)); --lu-space-6: calc(24px * var(--lu-density));
    --lu-space-7: calc(28px * var(--lu-density)); --lu-space-8: calc(32px * var(--lu-density)); --lu-space-9: calc(36px * var(--lu-density));
    --lu-space-10: calc(40px * var(--lu-density));
    --lu-radius-sm: 6px; --lu-radius-md: 8px; --lu-radius-lg: 12px; --lu-radius-xl: 16px; --lu-radius-pill: 999px;
    --lu-radius-control: var(--lu-radius-pill);
    --lu-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --lu-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --lu-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
    --lu-ease-move: cubic-bezier(0.23, 1, 0.32, 1);
    --lu-dur-fast: 120ms; --lu-dur: 160ms; --lu-dur-slow: 300ms; --lu-dur-move: 300ms;
  }

  [data-theme="light"] { color-scheme: light; --lu-scheme: light; }
  [data-theme="dark"] { color-scheme: dark; --lu-scheme: dark; }

  /* style options (spec: calibration v2). Defaults live in :root. */
  [data-neutral="cool"] { --lu-bg: light-dark(#f5f5f7, #0b0c0e); --lu-surface: light-dark(#ffffff, #17181b); --lu-surface-2: light-dark(#fafafb, #1f2023); --lu-fg: light-dark(#1d1d1f, #f5f5f7); --lu-muted: light-dark(#6e6e73, #8e8e93); }
  [data-neutral="warm"] { --lu-bg: light-dark(#f7f5f1, #13120f); --lu-surface: light-dark(#fffefb, #1d1b18); --lu-surface-2: light-dark(#fcfaf6, #24221e); --lu-fg: light-dark(#22201c, #f1ede6); --lu-muted: light-dark(#736c62, #968d81); }
  [data-shape="sharp"] { --lu-radius-sm: 3px; --lu-radius-md: 4px; --lu-radius-lg: 6px; --lu-radius-xl: 8px; }
  [data-shape="round"] { --lu-radius-sm: 8px; --lu-radius-md: 12px; --lu-radius-lg: 18px; --lu-radius-xl: 24px; }
  [data-shape="material"] { --lu-radius-sm: 4px; --lu-radius-md: 8px; --lu-radius-lg: 12px; --lu-radius-xl: 28px; }
  [data-buttons="rounded"] { --lu-radius-control: var(--lu-radius-md); }
  [data-density="regular"] { --lu-density: 1.15; --lu-control-h: 38px; }
  [data-density="airy"] { --lu-density: 1.3; --lu-control-h: 44px; --lu-text-base: 15px; }
  [data-type="geist"] { --lu-font: "Geist Variable", "Geist", system-ui, sans-serif; --lu-font-display: var(--lu-font); --lu-display-tracking: -0.03em; }
  [data-type="system"] { --lu-font: system-ui, -apple-system, "Segoe UI", sans-serif; --lu-font-display: var(--lu-font); --lu-display-tracking: -0.02em; }
  [data-type="serif"] { --lu-font-display: "Fraunces Variable", "Fraunces", Georgia, serif; --lu-display-weight: 500; --lu-display-tracking: -0.01em; }
  [data-type="editorial"] { --lu-font-display: "Instrument Serif", Georgia, serif; --lu-display-weight: 400; --lu-display-tracking: -0.005em; }
  [data-type="material"] { --lu-font: "Roboto Flex Variable", "Roboto Flex", Roboto, system-ui, sans-serif; --lu-font-display: var(--lu-font); --lu-display-weight: 400; --lu-display-tracking: 0em; }
  [data-depth="hairline"] { --lu-shadow-card: 0 0 0 1px var(--lu-line-strong); --lu-shadow-pop: 0 0 0 1px var(--lu-line-strong), 0 8px 24px -12px var(--lu-shadow-tone); }
  [data-depth="elevated"] { --lu-shadow-card: 0 0 0 1px var(--lu-line), 0 10px 30px -12px var(--lu-shadow-tone-strong), 0 1px 3px var(--lu-shadow-tone); --lu-shadow-pop: 0 0 0 1px var(--lu-line), 0 24px 48px -16px var(--lu-shadow-tone-strong); }
  [data-highlight="filled"] { --lu-hl-bg: var(--lu-accent); --lu-hl-fg: var(--lu-accent-fg); }
  [data-highlight="ring"] { --lu-hl-bg: transparent; --lu-hl-fg: var(--lu-fg); --lu-hl-shadow: inset 0 0 0 1.5px var(--lu-accent); }
  [data-highlight="bar"] { --lu-hl-bg: var(--lu-fill); --lu-hl-fg: var(--lu-fg); --lu-hl-shadow: inset 3px 0 0 var(--lu-accent); }
  [data-highlight="ink"] { --lu-hl-bg: var(--lu-fg); --lu-hl-fg: var(--lu-bg); }
  [data-motion="smooth"] { --lu-ease-out: cubic-bezier(0.32, 0.72, 0, 1); --lu-ease-move: cubic-bezier(0.32, 0.72, 0, 1); --lu-dur-fast: 160ms; --lu-dur: 240ms; --lu-dur-slow: 400ms; --lu-dur-move: 400ms; }
  [data-motion="bouncy"] { --lu-ease-move: cubic-bezier(0.34, 1.56, 0.64, 1); --lu-dur-fast: 140ms; --lu-dur: 200ms; --lu-dur-slow: 420ms; --lu-dur-move: 420ms; }
  [data-motion="material"] { --lu-ease-out: cubic-bezier(0.34, 0.8, 0.34, 1); --lu-ease-move: cubic-bezier(0.38, 1.21, 0.22, 1); --lu-dur-fast: 150ms; --lu-dur: 200ms; --lu-dur-slow: 300ms; --lu-dur-move: 500ms; }

  /* accent amount comes after highlight so minimal always wins */
  [data-accent="minimal"] {
    --lu-hl-bg: var(--lu-fill-strong);
    --lu-hl-fg: var(--lu-fg);
    --lu-hl-shadow: none;
    --lu-primary: var(--lu-fg);
    --lu-primary-fg: var(--lu-bg);
    --lu-link: var(--lu-fg);
    --lu-mark: var(--lu-fill-strong);
  }
  [data-accent="expressive"] {
    --lu-eyebrow: var(--lu-accent-text);
    --lu-page: light-dark(color-mix(in oklab, var(--lu-accent) 4%, var(--lu-bg)), color-mix(in oklab, var(--lu-accent) 6%, var(--lu-bg)));
  }
  [data-wall-speed="slow"] { --lu-wall-speed: 0.6; }
  [data-wall-speed="fast"] { --lu-wall-speed: 1.8; }
  [data-wall-colors="mix"] {
    --lu-wall-1: var(--lu-mix-1); --lu-wall-2: var(--lu-mix-2); --lu-wall-3: var(--lu-mix-3);
    --lu-wall-base: light-dark(color-mix(in oklab, var(--lu-mix-1) 22%, #eef0f4), color-mix(in oklab, var(--lu-mix-1) 18%, #0b0c10));
  }
  /* Lava merges blobs with a contrast filter; filters cannot use light-dark(), so the light-mode strength is set per scheme. */
  :root { --lu-lava-contrast: 1.6; }
  @media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --lu-lava-contrast: 1.15; } }
  [data-theme="light"] { --lu-lava-contrast: 1.15; }
  [data-wallpaper="lava"] { --lu-lava-base: light-dark(color-mix(in oklab, var(--lu-wall-3) 30%, #fbf7f2), color-mix(in oklab, var(--lu-wall-3) 30%, #0b0606)); }
  /* Glass materials are custom properties on [data-glass] scopes; .lu-glass reads them, so the nearest scope wins.
     Every material block sets all of them, so nothing leaks down from an ancestor's material. */
  :root, [data-glass] {
    --lu-material: light-dark(color-mix(in srgb, var(--lu-glass-color) calc(var(--lu-glass-opacity) * 100%), transparent), color-mix(in srgb, color-mix(in srgb, var(--lu-glass-color) 14%, #18181b) calc(min(1, var(--lu-glass-opacity) + 0.06) * 100%), transparent));
  }
  :root, [data-glass="frost"] { --lu-glass-color: #ffffff; --lu-glass-layers: none; --lu-glass-fill: var(--lu-material); --lu-glass-scheme: var(--lu-scheme);
    --lu-glass-shadow: inset 0 1px 0 var(--lu-rim), inset 0 0 0 1px var(--lu-rim-2), var(--lu-shadow-float); }
  [data-glass="clear"] { --lu-glass-color: #ffffff; --lu-glass-layers: none; --lu-glass-fill: var(--lu-material); --lu-glass-scheme: var(--lu-scheme);
    --lu-glass-shadow: inset 0 1px 0 var(--lu-rim), inset 0 0 0 1px var(--lu-rim-2); }
  [data-glass="tinted"] { --lu-glass-color: var(--lu-glass-tint); --lu-glass-layers: none; --lu-glass-fill: var(--lu-material); --lu-glass-scheme: var(--lu-scheme);
    --lu-glass-shadow: inset 0 1px 0 var(--lu-rim), inset 0 0 0 1px var(--lu-rim-2), var(--lu-shadow-float); }
  [data-glass="liquid"] { --lu-glass-color: #ffffff; --lu-glass-layers: linear-gradient(135deg, var(--lu-sheen), transparent 28%, transparent 70%, var(--lu-sheen-2));
    --lu-glass-fill: var(--lu-material); --lu-glass-scheme: var(--lu-scheme);
    --lu-glass-shadow: inset 0 1px 1px var(--lu-rim), inset 0 -1px 1px var(--lu-rim-2), inset 0 0 0 1px var(--lu-rim-2), var(--lu-shadow-float); }
  [data-glass="grain"] { --lu-glass-color: #ffffff; --lu-glass-layers: var(--lu-grain); --lu-glass-fill: var(--lu-material); --lu-glass-scheme: var(--lu-scheme);
    --lu-glass-shadow: inset 0 1px 0 var(--lu-rim), inset 0 0 0 1px var(--lu-rim-2), var(--lu-shadow-float); }
  [data-glass="smoke"] { --lu-glass-color: #ffffff; --lu-glass-layers: none; --lu-glass-fill: var(--lu-smoke); --lu-glass-scheme: dark;
    --lu-glass-shadow: inset 0 1px 0 var(--lu-rim), inset 0 0 0 1px var(--lu-rim-2), var(--lu-shadow-float); }

  .lu { background: var(--lu-page); color: var(--lu-fg); font-family: var(--lu-font); font-size: var(--lu-text-base); line-height: 1.5; -webkit-font-smoothing: antialiased; }

  /* backdrop: drift is the base recipe; other kinds override it (spec v3) */
  .lu-wallpaper { position: fixed; inset: 0; z-index: -1; overflow: hidden; background: var(--lu-wall-base); pointer-events: none; }
  .lu-wallpaper > * { position: absolute; opacity: var(--lu-wall-intensity); }
  .lu-wallpaper i { border-radius: 50%; filter: blur(48px); }
  .lu-wallpaper i:nth-child(1) { width: 55%; height: 70%; left: -8%; top: -15%; background: var(--lu-wall-1); }
  .lu-wallpaper i:nth-child(2) { width: 50%; height: 60%; right: -10%; top: 10%; background: var(--lu-wall-2); }
  .lu-wallpaper i:nth-child(3) { width: 45%; height: 55%; left: 25%; bottom: -20%; background: var(--lu-wall-3); }
  .lu-wallpaper u { display: none; }
  [data-wallpaper="none"] .lu-wallpaper { display: none; }
  [data-wallpaper="photo"] .lu-wallpaper { background: var(--lu-wallpaper-image) center / cover no-repeat, var(--lu-wall-base); }
  [data-wallpaper="photo"] .lu-wallpaper > * { display: none; }

  [data-wallpaper="water"] .lu-wallpaper i { left: -25%; right: auto; bottom: auto; width: 200%; height: 44%; border-radius: 0; filter: blur(22px);
    background: radial-gradient(closest-side, var(--lu-wave), transparent) 0 0 / 25% 100% repeat-x; }
  [data-wallpaper="water"] .lu-wallpaper i:nth-child(1) { --lu-wave: var(--lu-wall-1); top: 0%; }
  [data-wallpaper="water"] .lu-wallpaper i:nth-child(2) { --lu-wave: var(--lu-wall-2); top: 28%; }
  [data-wallpaper="water"] .lu-wallpaper i:nth-child(3) { --lu-wave: var(--lu-wall-3); top: 56%; }
  [data-wallpaper="water"] .lu-wallpaper u { display: block; inset: 0; mix-blend-mode: soft-light;
    background: repeating-radial-gradient(circle at 30% 40%, var(--lu-caustic) 0 5px, transparent 6px 34px); }

  [data-wallpaper="lava"] .lu-wallpaper { background: var(--lu-lava-base); filter: blur(18px) contrast(var(--lu-lava-contrast)); }
  [data-wallpaper="lava"] .lu-wallpaper i, [data-wallpaper="lava"] .lu-wallpaper u { display: block; top: auto; right: auto; bottom: auto; width: 22%; height: auto; aspect-ratio: 1; border-radius: 50%; filter: none; }
  [data-wallpaper="lava"] .lu-wallpaper i:nth-child(1) { left: 12%; bottom: -10%; }
  [data-wallpaper="lava"] .lu-wallpaper i:nth-child(2) { left: 44%; bottom: -14%; width: 28%; }
  [data-wallpaper="lava"] .lu-wallpaper i:nth-child(3) { left: 70%; bottom: -8%; }
  [data-wallpaper="lava"] .lu-wallpaper u { left: 30%; top: -10%; width: 30%; background: var(--lu-wall-1); }

  [data-wallpaper="aurora"] .lu-wallpaper i { left: -30%; right: auto; bottom: auto; width: 160%; height: 26%; border-radius: 50%; filter: blur(34px); }
  [data-wallpaper="aurora"] .lu-wallpaper i:nth-child(1) { top: 10%; background: linear-gradient(90deg, transparent, var(--lu-wall-1), var(--lu-wall-2), transparent); }
  [data-wallpaper="aurora"] .lu-wallpaper i:nth-child(2) { top: 34%; background: linear-gradient(90deg, transparent, var(--lu-wall-2), var(--lu-wall-3), transparent); }
  [data-wallpaper="aurora"] .lu-wallpaper i:nth-child(3) { top: 56%; background: linear-gradient(90deg, transparent, var(--lu-wall-3), var(--lu-wall-1), transparent); }

  [data-wallpaper="mesh"] .lu-wallpaper i:nth-child(1) { inset: -30%; width: auto; height: auto; border-radius: 0; filter: blur(60px);
    background: conic-gradient(from 0deg, var(--lu-wall-1), var(--lu-wall-2), var(--lu-wall-3), var(--lu-wall-1)); }
  [data-wallpaper="mesh"] .lu-wallpaper i:nth-child(n + 2) { display: none; }

  .lu-glass {
    color-scheme: var(--lu-glass-scheme);
    color: var(--lu-fg);
    background: var(--lu-glass-layers), var(--lu-glass-fill);
    -webkit-backdrop-filter: blur(var(--lu-blur)) saturate(180%);
    backdrop-filter: blur(var(--lu-blur)) saturate(180%);
    box-shadow: var(--lu-glass-shadow);
    border-radius: var(--lu-radius-lg);
  }
  .lu-card { background: var(--lu-surface); border-radius: var(--lu-radius-lg); box-shadow: var(--lu-shadow-card); }
  .lu-glass .lu-card { background: var(--lu-material-2); }
  [data-depth="glass"] .lu-card { background: var(--lu-material-2); -webkit-backdrop-filter: blur(var(--lu-blur)) saturate(180%); backdrop-filter: blur(var(--lu-blur)) saturate(180%); box-shadow: inset 0 1px 0 var(--lu-rim), inset 0 0 0 1px var(--lu-rim-2), var(--lu-shadow-float); }
  .lu-display { font-family: var(--lu-font-display); font-weight: var(--lu-display-weight); letter-spacing: var(--lu-display-tracking); line-height: 1.05; }

  .lu-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: var(--lu-space-2);
    height: var(--lu-control-h); padding: 0 var(--lu-space-4); border: 0; border-radius: var(--lu-radius-control);
    font: 500 var(--lu-text-base) / 1 var(--lu-font); cursor: pointer; user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: background-color var(--lu-dur) var(--lu-ease-out), filter var(--lu-dur) var(--lu-ease-out), opacity var(--lu-dur);
  }
  .lu-btn--primary { background: var(--lu-primary); color: var(--lu-primary-fg); }
  .lu-btn--secondary { background: var(--lu-fill); color: var(--lu-fg); }
  .lu-btn--ghost { background: transparent; color: var(--lu-link); }
  @media (hover: hover) and (pointer: fine) {
    .lu-btn--primary:hover { filter: brightness(1.07); }
    .lu-btn--secondary:hover { background: var(--lu-fill-strong); }
  }
  .lu-btn:disabled, .lu-btn[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
  .lu-btn[aria-busy="true"] { opacity: 1; cursor: progress; }
  .lu-btn:focus-visible, .lu-input:focus-visible, .lu-chip:focus-visible, .lu-item:focus-visible, .lu-switch:focus-visible { outline: none; box-shadow: var(--lu-ring); }

  .lu-input {
    box-sizing: border-box; width: 100%; height: var(--lu-control-h); padding: 0 var(--lu-space-3); border: 0; border-radius: var(--lu-radius-md);
    background: var(--lu-surface); color: var(--lu-fg); font: var(--lu-text-base) var(--lu-font);
    box-shadow: 0 0 0 1px var(--lu-line-strong); transition: box-shadow var(--lu-dur) var(--lu-ease-out);
  }
  .lu-input::placeholder { color: var(--lu-muted); }
  .lu-input:focus { outline: none; box-shadow: var(--lu-ring); }
  .lu-input[aria-invalid="true"] { box-shadow: 0 0 0 1px var(--lu-danger); }
  .lu-field-error { color: var(--lu-danger); font-size: var(--lu-text-sm); }

  .lu-item {
    display: flex; align-items: center; justify-content: space-between; gap: var(--lu-space-2);
    padding: calc(6px * var(--lu-density)) var(--lu-space-3); border-radius: var(--lu-radius-md); background: transparent; color: var(--lu-fg); cursor: pointer;
    transition: background-color var(--lu-dur) var(--lu-ease-out), color var(--lu-dur) var(--lu-ease-out);
  }
  @media (hover: hover) and (pointer: fine) { .lu-item:hover { background: var(--lu-fill); } }
  .lu-item[aria-selected="true"], .lu-item[aria-current="page"], .lu-item[data-selected]:not([data-selected="false"]) { background: var(--lu-hl-bg); color: var(--lu-hl-fg); box-shadow: var(--lu-hl-shadow); }

  .lu-seg { position: relative; display: inline-flex; padding: 3px; gap: 2px; border-radius: var(--lu-radius-md); background: var(--lu-fill); }
  .lu-seg button { position: relative; z-index: 1; max-width: 22ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0; background: none; padding: 5px 14px; border-radius: calc(var(--lu-radius-md) - 3px); color: var(--lu-muted); font: 500 var(--lu-text-sm) var(--lu-font); cursor: pointer; transition: color var(--lu-dur) var(--lu-ease-out); }
  .lu-seg button[aria-pressed="true"] { color: var(--lu-fg); }
  .lu-seg:not(:has(.lu-seg__thumb)) button[aria-pressed="true"] { background: var(--lu-surface); box-shadow: var(--lu-shadow-card); }
  .lu-seg__thumb { position: absolute; top: 3px; bottom: 3px; border-radius: calc(var(--lu-radius-md) - 3px); background: var(--lu-surface); box-shadow: var(--lu-shadow-card); transition: left var(--lu-dur-move) var(--lu-ease-move), width var(--lu-dur-move) var(--lu-ease-move); }

  .lu-switch { position: relative; width: 42px; height: 26px; flex: none; padding: 0; border: 0; border-radius: var(--lu-radius-pill); background: var(--lu-fill-strong); cursor: pointer; transition: background-color var(--lu-dur) var(--lu-ease-out); }
  .lu-switch[data-checked] { background: var(--lu-accent); }
  .lu-switch__thumb { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--lu-knob); box-shadow: var(--lu-shadow-card); transition: transform var(--lu-dur-move) var(--lu-ease-move); }
  .lu-switch[data-checked] .lu-switch__thumb { transform: translateX(16px); }

  .lu-chip { display: inline-block; max-width: 24ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; height: 26px; line-height: 26px; padding: 0 10px; border: 0; border-radius: var(--lu-radius-control); background: var(--lu-fill); color: var(--lu-muted); font: 500 var(--lu-text-sm) var(--lu-font); cursor: pointer; transition: background-color var(--lu-dur) var(--lu-ease-out), color var(--lu-dur) var(--lu-ease-out); }
  .lu-chip[aria-pressed="true"] { background: var(--lu-hl-bg); color: var(--lu-hl-fg); box-shadow: var(--lu-hl-shadow); }

  .lu-spinner { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 2px solid color-mix(in oklab, currentColor 25%, transparent); border-top-color: currentColor; }
  @keyframes lu-spin { to { transform: rotate(360deg); } }
  @keyframes lu-pulse { 50% { opacity: 0.35; } }

  .lu-eyebrow { color: var(--lu-eyebrow); font-size: var(--lu-text-xs); font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; }
  .lu-link { color: var(--lu-link); font-weight: 500; text-decoration: underline; text-decoration-color: color-mix(in oklab, var(--lu-link) 35%, transparent); text-underline-offset: 3px; }
  .lu-mark { background: var(--lu-mark); color: inherit; border-radius: 4px; padding: 0 3px; }
  .lu-kbd { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: var(--lu-radius-sm); background: var(--lu-fill); color: var(--lu-muted); font: 500 var(--lu-text-xs) var(--lu-font); box-shadow: inset 0 -1px 0 var(--lu-line-strong); }

  .lu-popup { background: var(--lu-surface); color: var(--lu-fg); border-radius: var(--lu-radius-xl); box-shadow: var(--lu-shadow-pop); }
  .lu-backdrop { position: fixed; inset: 0; background: var(--lu-scrim); }

  @media (prefers-reduced-motion: no-preference) {
    .lu-btn, .lu-chip { transition-property: background-color, filter, opacity, transform; }
    .lu-btn:active:not(:disabled), .lu-chip:active { transform: scale(0.97); }
    .lu-spinner { animation: lu-spin 600ms linear infinite; }
    .lu-wallpaper i:nth-child(1) { animation: lu-drift-1 calc(14s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    .lu-wallpaper i:nth-child(2) { animation: lu-drift-2 calc(17s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    .lu-wallpaper i:nth-child(3) { animation: lu-drift-3 calc(19s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="still"] .lu-wallpaper i { animation: none; }
    [data-wallpaper="water"] .lu-wallpaper i:nth-child(1) { animation: lu-flow calc(9s / var(--lu-wall-speed)) linear infinite, lu-bob calc(5s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="water"] .lu-wallpaper i:nth-child(2) { animation: lu-flow calc(13s / var(--lu-wall-speed)) linear infinite reverse, lu-bob calc(6.5s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="water"] .lu-wallpaper i:nth-child(3) { animation: lu-flow calc(11s / var(--lu-wall-speed)) linear infinite, lu-bob calc(4.5s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="water"] .lu-wallpaper u { animation: lu-shimmer calc(6s / var(--lu-wall-speed)) linear infinite; }
    [data-wallpaper="lava"] .lu-wallpaper i:nth-child(1) { animation: lu-lava-rise calc(14s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="lava"] .lu-wallpaper i:nth-child(2) { animation: lu-lava-rise calc(19s / var(--lu-wall-speed)) ease-in-out infinite alternate-reverse; }
    [data-wallpaper="lava"] .lu-wallpaper i:nth-child(3) { animation: lu-lava-rise calc(11s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="lava"] .lu-wallpaper u { animation: lu-lava-sink calc(17s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="aurora"] .lu-wallpaper i:nth-child(1) { animation: lu-ribbon calc(18s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="aurora"] .lu-wallpaper i:nth-child(2) { animation: lu-ribbon calc(23s / var(--lu-wall-speed)) ease-in-out infinite alternate-reverse; }
    [data-wallpaper="aurora"] .lu-wallpaper i:nth-child(3) { animation: lu-ribbon calc(20s / var(--lu-wall-speed)) ease-in-out infinite alternate; }
    [data-wallpaper="mesh"] .lu-wallpaper i:nth-child(1) { animation: lu-mesh-spin calc(40s / var(--lu-wall-speed)) linear infinite; }
  }
  @keyframes lu-drift-1 { to { transform: translate(55%, 30%) scale(1.25); } }
  @keyframes lu-drift-2 { to { transform: translate(-60%, 25%) scale(0.85); } }
  @keyframes lu-drift-3 { to { transform: translate(-25%, -55%) scale(1.2); } }
  @keyframes lu-flow { to { transform: translateX(-25%); } }
  @keyframes lu-bob { from { translate: 0 -6%; } to { translate: 0 8%; } }
  @keyframes lu-shimmer { to { transform: translate(-34px, -34px); } }
  @keyframes lu-lava-rise { 0% { transform: translateY(0) scale(1, 1); } 50% { transform: translateY(-160%) scale(0.85, 1.15); } 100% { transform: translateY(-300%) scale(1.1, 0.9); } }
  @keyframes lu-lava-sink { to { transform: translateY(220%) scale(0.9, 1.1); } }
  @keyframes lu-ribbon { 0% { transform: translateX(-8%) skewY(-6deg) scaleY(0.8); } 100% { transform: translateX(8%) skewY(6deg) scaleY(1.2); } }
  @keyframes lu-mesh-spin { to { transform: rotate(360deg); } }

  @media (prefers-reduced-motion: reduce) {
    :root { --lu-dur-move: 0ms; }
    .lu-seg__thumb, .lu-switch__thumb { transition-duration: 0ms; }
    .lu-wallpaper, .lu-wallpaper * { animation: none; }
    .lu-spinner { animation: lu-pulse 1.2s ease-in-out infinite; }
  }

  @supports not (backdrop-filter: blur(1px)) {
    .lu-glass { background: var(--lu-surface); }
  }
  @supports not (color: oklch(from red l c h)) {
    :root { --lu-accent-text: var(--lu-accent); }
  }
}