/* Canonical suite identity: Precision (id poppy), Creek / Clarity, Ginkgo / Intelligence. */
@font-face {font-family: Newsreader; src: url(/fonts/newsreader.woff2) format("woff2"); font-weight:400 700; font-display:swap;}
/* ---------- The parts every theme shares ---------- */
:root {
  /* Type scale, in rem so the phone's text size applies. */
  --kc-fs-xs: .8125rem;   /* 13px: counts and fine print only */
  --kc-fs-s: .9375rem;    /* 15px: labels, meta */
  --kc-fs-m: 1.0625rem;   /* 17px: body and controls */
  --kc-fs-l: 1.25rem;     /* 20px: card titles */
  --kc-fs-xl: 1.625rem;   /* 26px: section titles */
  --kc-fs-2xl: clamp(2rem, 6vw, 3rem); /* page titles */
  --kc-lh: 1.5;
  --kc-lh-tight: 1.15;
  --kc-measure: 38rem;
  --kc-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* For a reader's own typeface choice (Reading's Aa) when it isn't the theme's. */
  --kc-serif: "Iowan Old Style", Charter, "Source Serif Pro", Georgia, serif;
  --kc-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --kc-target: 44px;      /* smallest tap target */
  --kc-space-1: 4px; --kc-space-2: 8px; --kc-space-3: 12px; --kc-space-4: 16px;
  --kc-space-5: 24px; --kc-space-6: 32px; --kc-space-7: 48px;
  /* The page frame and its rhythm: gutters, widths, and the gaps between the parts of a page. */
  --kc-gutter: clamp(16px, 4vw, 40px);
  --kc-page-max: 72rem;          /* lists, grids, dashboards */
  --kc-page-narrow: 42rem;       /* reading, writing, one column */
  /* Vertical rhythm: every line height and vertical gap is a multiple of this. */
  --kc-rhythm: .25rem;
  --kc-gap-section: 3rem;        /* between sections */
  --kc-gap-block: 1.5rem;        /* between blocks: header, tabs, toolbar, list */
  --kc-gap-item: .75rem;         /* between cards, rows' contents */
  --kc-gap-tight: .5rem;         /* a label and the title it introduces */
  --kc-gap-inline: 8px;          /* between chips and buttons in a row */
  --kc-pad-card: 1rem;
  /* The display size steps with the screen, so its line height stays on the grid. */
  --kc-display-size: 2.5rem;
  --kc-display-leading: 2.75rem;
  --kc-ease: cubic-bezier(.2, .7, .2, 1);
  --kc-dur: .18s;
  --kc-focus: 3px solid var(--kc-accent);
  --kc-focus-offset: 2px;
  /* For the shared components (/kc-ui.css): the height a theme's bottom navigation takes
     (so content can clear it), and the radius of its sheets. Themes override. */
  --kc-nav-h: 0px;
  --kc-sheet-radius: var(--kc-radius-l);
}
@media (min-width: 40rem) {
  :root { --kc-display-size: 3rem; --kc-display-leading: 3.25rem; --kc-gap-section: 4rem; --kc-gap-block: 2rem; --kc-pad-card: 1.5rem; }
}
@media (min-width: 64rem) {
  :root { --kc-display-size: 3.5rem; --kc-display-leading: 3.75rem; --kc-gap-section: 4.5rem; }
}

@font-face { font-family: Inter; src: url('/fonts/inter.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'DM Sans'; src: url('/fonts/dm-sans.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }

:root, [data-kc-theme="poppy"], [data-kc-theme="creek"], [data-kc-theme="ginkgo"] {
  --kc-brand: #ff6600;
  /* The Popi mark (a California poppy) in every theme and scheme: 3:1 or more on every page
     background. Point it at var(--kc-accent-fill) to have the mark follow each theme instead. */
  --kc-brand-mark: #e06f14;
  --kc-accent-fill: var(--kc-brand);
  --kc-on-accent: #18283f;
  --kc-font-ui: Inter, 'Helvetica Neue', Arial, sans-serif;
  --kc-font-text: var(--kc-font-ui);
  --kc-font-display: var(--kc-font-ui);
  --kc-font-editorial: Newsreader, Georgia, serif;
  --kc-display-weight: 400;
  --kc-display-style: normal;
  --kc-strong-weight: 600;
  --kc-display-tracking: -.03em;
  --kc-type-display: 400 var(--kc-display-size)/var(--kc-display-leading) var(--kc-font-display);
  --kc-type-editorial: 400 clamp(1.75rem, 4vw, 2.25rem)/2.5rem var(--kc-font-editorial);
  --kc-type-title: 400 1.5rem/1.75rem var(--kc-font-display);
  --kc-type-heading: 500 1.1875rem/1.5rem var(--kc-font-display);
  --kc-type-body: 400 1.0625rem/1.5rem var(--kc-font-ui);
  --kc-type-reading: 400 1.125rem/1.75rem var(--kc-font-text);
  --kc-type-meta: 400 .875rem/1.25rem var(--kc-font-ui);
  --kc-type-ui: 500 .9375rem/1.25rem var(--kc-font-ui);
  --kc-type-field: 400 1rem/1.5rem var(--kc-font-ui);
  --kc-type-label: 500 .75rem/1rem var(--kc-font-ui);
  --kc-track-display: -.035em;
  --kc-track-editorial: -.02em;
  --kc-track-title: -.025em;
  --kc-track-heading: -.015em;
  --kc-track-label: .075em;
  --kc-label-case: uppercase;
  --kc-label-caps: normal;
  --kc-label-tracking: .04em;
  --kc-numerals: lining-nums tabular-nums;
  --kc-border-w: 1px;
  --kc-head-rule: 1px solid var(--kc-line);
  --kc-glass: none;
  --kc-mark-radius: 0;
  --kc-shadow: none;
  --kc-shadow-soft: 0 2px 10px rgb(0 0 0 / .05);
  --kc-shadow-float: 0 12px 36px rgb(0 0 0 / .14);
  --kc-page-image: none;
  --kc-nav-h: 0px;
  --kc-sheet-radius: var(--kc-radius-l);
  --kc-dur: .16s;
  --kc-ease: cubic-bezier(.2, .7, .2, 1);
  --kc-quiet-bg: transparent;
  --kc-quiet-border: 1px solid var(--kc-line-strong);
  --kc-field-bg: var(--kc-surface);
  --kc-field-border: 1px solid var(--kc-line-strong);
  --kc-card-border: 1px solid var(--kc-line);
  --kc-surface-bar: var(--kc-bg);
  --kc-accent-soft: var(--kc-surface-2);
  --kc-selected-bg: var(--kc-ink);
  --kc-selected-ink: var(--kc-bg);
  --kc-hero-bg: #f6f4fb;
  --kc-hero-border: #e6e0f2;
  --kc-hero-glow: radial-gradient(circle at 50% 42%, rgb(138 121 196 / .17) 0%, rgb(138 121 196 / .06) 44%, transparent 72%);
  --kc-hero-seg-bg: #ebe7f5;
  --kc-orb-bg: #f2eef9;
  --kc-orb-border: #dfd8ef;
  --kc-orb-ink: #6e5f9e;
  --kc-orb-shadow: 0 10px 28px rgb(110 95 158 / .18), 0 0 0 8px rgb(138 121 196 / .07);
  --kc-wave-color: #beb5dc;
  --kc-pill-bg: var(--kc-surface);
  --kc-pill-border: #d8d2e7;
  --kc-ok: #205d39; --kc-ok-soft: #e8f3eb;
  --kc-warn: #754900; --kc-warn-soft: #fbefda;
  --kc-bad: #a02828; --kc-bad-soft: #fcebea;
  --kc-focus: 3px solid var(--kc-accent);
  color-scheme: light;
}
:root, [data-kc-theme="poppy"] {
  --kc-bg: #faf9f6; --kc-surface: #ffffff; --kc-surface-2: #e9eff8;
  --kc-ink: #18283f; --kc-ink-2: #354760; --kc-muted: #526174;
  --kc-accent: #244c91; --kc-line: #dce3ec; --kc-line-strong: #758298;
  --kc-radius-s: 2px; --kc-radius: 2px; --kc-radius-l: 2px; --kc-radius-pill: 2px;
}
[data-kc-theme="creek"] {
  --kc-bg: #f5f8f6; --kc-surface: #ffffff; --kc-surface-2: #e2efeb;
  --kc-ink: #173c43; --kc-ink-2: #35575d; --kc-muted: #49666a;
  --kc-accent: #235d78; --kc-line: #d5e3df; --kc-line-strong: #6e8988;
  --kc-font-ui: 'DM Sans', 'Helvetica Neue', Arial, sans-serif;
  --kc-track-display: -.025em; --kc-track-title: -.015em; --kc-track-heading: -.005em;
  --kc-radius-s: 12px; --kc-radius: 12px; --kc-radius-l: 12px; --kc-radius-pill: 12px;
  --kc-hero-bg: #f1f6f5; --kc-hero-border: #d9e6e3; --kc-hero-seg-bg: #e3eeec;
  --kc-hero-glow: radial-gradient(circle at 50% 42%, rgb(35 93 120 / .13) 0%, rgb(35 93 120 / .04) 44%, transparent 72%);
  --kc-orb-bg: #eaf3f1; --kc-orb-border: #cde0dc; --kc-orb-ink: #235d78;
  --kc-orb-shadow: 0 10px 28px rgb(35 93 120 / .15), 0 0 0 8px rgb(35 93 120 / .06);
  --kc-wave-color: #9abbbd; --kc-pill-border: #c8dcd8;
}
[data-kc-theme="ginkgo"] {
  --kc-bg: #f8f6ef; --kc-surface: #ffffff; --kc-surface-2: #eee7cd;
  --kc-ink: #222d40; --kc-ink-2: #414b5a; --kc-muted: #5d6269;
  --kc-accent: #344e72; --kc-line: #e3dcc7; --kc-line-strong: #858174;
  --kc-gold: #d7b75b;
  --kc-font-display: Newsreader, Georgia, serif;
  --kc-font-text: Newsreader, Georgia, serif;
  --kc-type-reading: 400 1.25rem/1.75rem var(--kc-font-text);
  --kc-track-display: -.02em; --kc-track-title: -.01em; --kc-track-heading: 0;
  --kc-radius-s: 6px; --kc-radius: 6px; --kc-radius-l: 6px; --kc-radius-pill: 6px;
  --kc-hero-bg: #f6f3fa; --kc-hero-border: #e5dfee; --kc-hero-seg-bg: #eae5f3;
  --kc-hero-glow: radial-gradient(circle at 50% 42%, rgb(126 112 178 / .16) 0%, rgb(215 183 91 / .06) 44%, transparent 72%);
  --kc-orb-bg: #f1ecf9; --kc-orb-border: #ddd5ec; --kc-orb-ink: #63558f;
  --kc-orb-shadow: 0 10px 28px rgb(99 85 143 / .17), 0 0 0 8px rgb(126 112 178 / .07);
  --kc-wave-color: #b9b0d4; --kc-pill-border: #d6cfe4;
}
[data-kc-scheme="dark"]:is([data-kc-theme="poppy"], [data-kc-theme="creek"], [data-kc-theme="ginkgo"]) {
  --kc-ok: #9dd9af; --kc-ok-soft: #193324;
  --kc-warn: #f1cf91; --kc-warn-soft: #372a18;
  --kc-bad: #ffb1aa; --kc-bad-soft: #402323;
  --kc-shadow-soft: 0 2px 12px rgb(0 0 0 / .28);
  --kc-shadow-float: 0 12px 36px rgb(0 0 0 / .4);
  color-scheme: dark;
}
[data-kc-theme="poppy"][data-kc-scheme="dark"] {
  --kc-bg: #111a27; --kc-surface: #182436; --kc-surface-2: #223149;
  --kc-ink: #edf1f8; --kc-ink-2: #cbd5e4; --kc-muted: #a8b6ca;
  --kc-accent: #acc8ff; --kc-line: #33445d; --kc-line-strong: #7f91ac;
  --kc-hero-bg: #162033; --kc-hero-border: #2c3c59; --kc-hero-seg-bg: #1f2d45;
  --kc-hero-glow: radial-gradient(circle at 50% 42%, rgb(148 132 214 / .2) 0%, rgb(104 138 214 / .07) 44%, transparent 72%);
  --kc-orb-bg: #202c45; --kc-orb-border: #3a4d73; --kc-orb-ink: #c6b8f3;
  --kc-orb-shadow: 0 12px 32px rgb(0 0 0 / .45), 0 0 0 8px rgb(148 132 214 / .1);
  --kc-wave-color: #6d6994; --kc-pill-border: #3b4d71;
}
[data-kc-theme="creek"][data-kc-scheme="dark"] {
  --kc-bg: #101f23; --kc-surface: #182b30; --kc-surface-2: #223b3f;
  --kc-ink: #e8f2ef; --kc-ink-2: #c6dcd6; --kc-muted: #a5c1bb;
  --kc-accent: #a5d6ed; --kc-line: #345056; --kc-line-strong: #809e9f;
  --kc-hero-bg: #15262b; --kc-hero-border: #2b454b; --kc-hero-seg-bg: #1d3439;
  --kc-hero-glow: radial-gradient(circle at 50% 42%, rgb(105 178 198 / .18) 0%, rgb(105 178 198 / .06) 44%, transparent 72%);
  --kc-orb-bg: #1d3339; --kc-orb-border: #35565e; --kc-orb-ink: #a5d6ed;
  --kc-orb-shadow: 0 12px 32px rgb(0 0 0 / .45), 0 0 0 8px rgb(105 178 198 / .09);
  --kc-wave-color: #567d84; --kc-pill-border: #36575f;
}
[data-kc-theme="ginkgo"][data-kc-scheme="dark"] {
  --kc-bg: #1b1e25; --kc-surface: #252932; --kc-surface-2: #373528;
  --kc-ink: #f3efdf; --kc-ink-2: #ddd7c5; --kc-muted: #bebbae;
  --kc-accent: #b7cbea; --kc-line: #49483e; --kc-line-strong: #969487;
  --kc-hero-bg: #21232d; --kc-hero-border: #393a47; --kc-hero-seg-bg: #2b2d3a;
  --kc-hero-glow: radial-gradient(circle at 50% 42%, rgb(154 139 204 / .18) 0%, rgb(215 183 91 / .06) 44%, transparent 72%);
  --kc-orb-bg: #2b2d3b; --kc-orb-border: #47485c; --kc-orb-ink: #d1c6f0;
  --kc-orb-shadow: 0 12px 32px rgb(0 0 0 / .45), 0 0 0 8px rgb(154 139 204 / .09);
  --kc-wave-color: #777193; --kc-pill-border: #48495d;
}
/* Only the baseline shared recipes apply. Appearance never moves a destination. */
:focus-visible { outline: var(--kc-focus); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

html[data-kc-theme] {background:var(--kc-bg);color:var(--kc-ink)}
/* ---------- The theme picker (mounted by /kc-theme.js at the end of the site bar) ---------- */
.kc-theme { position: relative; margin-left: auto; font: 400 14px/1.4 var(--kc-font-ui); }
.kc-theme-btn {
  display: inline-flex; align-items: center; gap: 6px; min-height: var(--kc-target); padding: 0 2px;
  font: inherit; color: var(--kc-muted); background: none; border: 0; cursor: pointer;
}
.kc-theme-btn:hover, .kc-theme-btn[aria-expanded="true"] { color: var(--kc-ink); }
.kc-theme-btn:focus-visible, .kc-theme-opt:focus-visible, .kc-theme-mode button:focus-visible {
  outline: var(--kc-focus); outline-offset: var(--kc-focus-offset);
}
.kc-theme-dot { width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--kc-line-strong);
  background: linear-gradient(90deg, var(--kc-ink) 50%, var(--kc-bg) 50%); flex: none; }
.kc-theme-panel {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 1000; width: min(19rem, calc(100vw - 32px));
  padding: 12px; display: grid; gap: 8px; max-height: calc(100dvh - 72px); overflow-y: auto;
  background: var(--kc-bg); color: var(--kc-ink); border: 1px solid var(--kc-line);
  border-radius: var(--kc-radius-l); box-shadow: var(--kc-shadow-float);
}
.kc-theme-panel[hidden] { display: none; }
.kc-theme-title { margin: 0 2px 2px; font-size: 13px; color: var(--kc-muted); }
.kc-theme-opt {
  display: grid; grid-template-columns: 56px 1fr; align-items: center; gap: 12px; width: 100%;
  min-height: 56px; padding: 4px 6px; text-align: left; cursor: pointer;
  font: inherit; color: var(--kc-ink); background: none;
  border: 1px solid transparent; border-radius: var(--kc-radius);
}
.kc-theme-opt:hover { border-color: var(--kc-line); }
.kc-theme-opt[aria-checked="true"] { border-color: var(--kc-ink); }
.kc-theme-opt b { display: block; font-weight: 600; }
.kc-theme-opt small { display: block; color: var(--kc-muted); font-size: 13px; }
/* Each swatch draws in its own theme (data-kc-theme on the swatch). */
.kc-theme-swatch {
  position: relative; overflow: hidden; height: 44px; display: grid; place-items: center;
  background: var(--kc-page-image), var(--kc-bg); color: var(--kc-ink);
  border: 1px solid var(--kc-line); border-radius: var(--kc-radius-l);
  font: var(--kc-display-style) var(--kc-display-weight) 20px/1 var(--kc-font-display); letter-spacing: var(--kc-display-tracking);
}
.kc-theme-swatch i {
  position: absolute; right: 6px; bottom: 6px; width: 12px; height: 12px;
  background: var(--kc-accent-fill); border-radius: var(--kc-mark-radius);
}
.kc-theme-mode { display: flex; gap: 4px; margin-top: 4px; padding: 3px; background: var(--kc-surface-2); border-radius: var(--kc-radius); }
.kc-theme-mode button {
  flex: 1; min-height: 38px; font: inherit; font-size: 13px; color: var(--kc-ink-2); background: none;
  border: 0; border-radius: calc(var(--kc-radius) - 2px); cursor: pointer;
}
.kc-theme-mode button[aria-checked="true"] { background: var(--kc-selected-bg); color: var(--kc-selected-ink); }
@media (prefers-reduced-motion: no-preference) {
  .kc-theme-panel:not([hidden]) { animation: kc-pop var(--kc-dur) var(--kc-ease); }
  @keyframes kc-pop { from { opacity: 0; transform: translateY(-4px); } }
}

.kc-theme-scope {font:var(--kc-type-meta);color:var(--kc-muted);margin:0}
.kc-theme-actions {display:flex;gap:8px;flex-wrap:wrap}
.kc-theme-actions button {min-height:var(--kc-target);font:var(--kc-type-ui);background:var(--kc-surface);color:var(--kc-ink);border:1px solid var(--kc-line-strong);border-radius:var(--kc-radius);padding:6px 10px}

/* Sparse, static identity marks accompany completed-action feedback. */
[data-kc-theme="poppy"]{--kc-signature:url(/theme-marks/poppy-bloom.svg)}
[data-kc-theme="creek"]{--kc-signature:url(/theme-marks/creek-ripple.svg)}
[data-kc-theme="ginkgo"]{--kc-signature:url(/theme-marks/ginkgo-fan.svg)}
.kc-toast-text::before{content:"";display:inline-block;width:18px;height:18px;background:var(--kc-signature) center/contain no-repeat;margin-right:8px;vertical-align:middle}
