/* Adapted from Beautiful UI app/globals.css @ 44a274e. MIT Shane Levine.
   Overlay shadows: shadow-plugin 2.1.0, MIT Florian Kiem.
   Card elevation is deliberately shallower for Apeul's dense study workspace.
   Notices ship in public/licenses. Brand and semantic answer colors stay Apeul. */
:root {
  --bui-page: oklch(0.985 0.001 286.376);
  --bui-canvas: oklch(0.961 0.002 247.84);
  --bui-surface: oklch(1 0 0);
  --bui-inset: oklch(0.979 0.002 247.839);
  --bui-hover: oklch(0.97 0.002 247.839);
  --bui-hover-2: oklch(0.933 0.003 247.86);
  --bui-ink: oklch(0.247 0.006 258.361);
  --bui-ink-2: oklch(0.506 0.01 264.477);
  --bui-ink-3: oklch(0.695 0.009 264.505);
  --bui-line: oklch(0.946 0.003 264.542);
  --bui-line-strong: oklch(0.912 0.005 258.326);
  --bui-line-soft: oklch(0.966 0.002 264.542);
  --bui-field: oklch(0.961 0.001 286.375);
  --bui-shadow-hairline: 0 0 0 1px var(--bui-line);
  --bui-shadow-btn: 0 0 0 1px var(--bui-line-strong), var(--bui-shadow-xs);
  --bui-shadow-card: 0 0 0 1px var(--bui-line), var(--bui-shadow-sm);
  --bui-shadow-raised: 0 0 0 1px var(--bui-line), var(--bui-shadow-md);
  --bui-shadow-overlay: 0 0 0 1px var(--bui-line), var(--bui-shadow-lg);
  --bui-shadow-inset-field: inset 0 1px 2px oklch(0 0 0 / 0.12);
}
.dark {
  --destructive: #f28b82;
  --bui-page: oklch(0.209 0.004 264.477);
  --bui-canvas: oklch(0.231 0.004 264.487);
  --bui-surface: oklch(0.26 0.006 271.191);
  --bui-inset: oklch(0.243 0.004 264.492);
  --bui-hover: oklch(0.289 0.006 271.22);
  --bui-hover-2: oklch(0.318 0.007 274.747);
  --bui-ink: oklch(0.964 0.002 247.839);
  --bui-ink-2: oklch(0.731 0.008 260.731);
  --bui-ink-3: oklch(0.541 0.01 264.484);
  --bui-line: oklch(0.308 0.006 258.354);
  --bui-line-strong: oklch(0.356 0.007 264.474);
  --bui-line-soft: oklch(0.278 0.006 258.354);
  --bui-field: oklch(0.293 0.006 271.223);
  --bui-shadow-hairline: 0 0 0 1px var(--bui-line);
  --bui-shadow-btn: 0 0 0 1px oklch(1 0 0 / 0.1), 0 1px 2px oklch(0 0 0 / 0.3);
  --bui-shadow-card: 0 0 0 1px oklch(1 0 0 / 0.11), 0 1px 2px oklch(0 0 0 / 0.2),
    0 2px 6px oklch(0 0 0 / 0.2);
  --bui-shadow-raised: 0 0 0 1px oklch(1 0 0 / 0.13), 0 2px 10px oklch(0 0 0 / 0.22);
  --bui-shadow-overlay: 0 0 0 1px oklch(1 0 0 / 0.15), 0 8px 28px oklch(0 0 0 / 0.34);
  --bui-shadow-inset-field: inset 0 1px 2px oklch(0 0 0 / 0.4);
}
:root {
  --bui-shadow-xs: 0 0 4px 0 rgba(0, 0, 0, 0.04);
  --bui-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.035), 0 3px 8px rgba(0, 0, 0, 0.025);
  --bui-shadow-md: 0 17.54px 23.39px 0 rgba(0, 0, 0, 0.04), 0 9.4px 12.5px 0 rgba(0, 0, 0, 0.03),
    0 5.25px 7px 0 rgba(0, 0, 0, 0.02), 0 2.79px 3.72px -2px rgba(0, 0, 0, 0.01),
    0 1.16px 1.5px 0 rgba(0, 0, 0, 0.01);
  --bui-shadow-lg: 0 25px 50px 0 rgba(0, 0, 0, 0.05), 0 12px 24px 0 rgba(0, 0, 0, 0.04),
    0 6px 12px 0 rgba(0, 0, 0, 0.03), 0 3px 6px 0 rgba(0, 0, 0, 0.02),
    0 1.5px 3px 0 rgba(0, 0, 0, 0.02);
  --bui-ease: cubic-bezier(0.23, 1, 0.32, 1);
}
:root, .dark {
  --background: var(--bui-surface);
  --foreground: var(--bui-ink);
  --canvas: var(--bui-canvas);
  --card: var(--bui-surface);
  --card-foreground: var(--bui-ink);
  --popover: var(--bui-surface);
  --popover-foreground: var(--bui-ink);
  --muted: var(--bui-field);
  --muted-foreground: var(--bui-ink-2);
  --secondary: var(--bui-hover-2);
  --secondary-foreground: var(--bui-ink);
  --accent: var(--bui-hover);
  --accent-foreground: var(--bui-ink);
  --border: var(--bui-line-strong);
  --hairline: var(--bui-line);
  --input: var(--bui-line-strong);
}
/* LoadingState's Drive grid. No demo timer or artificial output pacing. */
.bui-loader { display: grid; flex-shrink: 0; grid-template-columns: repeat(3, 4px); gap: 1.5px; }
.bui-loader > span { width: 4px; height: 4px; border-radius: 1px; background: var(--foreground); opacity: .15; animation: bui-pixel-on 650ms ease-in-out infinite; }
@keyframes bui-pixel-on { 0%,100% { opacity: .15; } 18%,42% { opacity: 1; } 62% { opacity: .15; } }
@media (prefers-reduced-motion: reduce) { .bui-loader > span { animation: none; opacity: .5; } }