/* GENERATED by bin/site-css from bin/themekit.py — do not edit.
   Run `bin/site-css` after changing the theme; tests/test_site.py
   fails if this file and the theme have drifted apart. */
:root{color-scheme:dark;
/* colour roles — Material 3 dark scheme, jade anchor #5ee9a5 */
--md-sys-color-primary:#52de9b;
--md-sys-color-on-primary:#003921;
--md-sys-color-primary-container:#005232;
--md-sys-color-on-primary-container:#72fcb6;
--md-sys-color-secondary:#adceba;
--md-sys-color-on-secondary:#1a3627;
--md-sys-color-secondary-container:#304d3d;
--md-sys-color-on-secondary-container:#c9ead6;
--md-sys-color-tertiary:#88d2e1;
--md-sys-color-on-tertiary:#00363e;
--md-sys-color-tertiary-container:#004e5a;
--md-sys-color-on-tertiary-container:#a5eefd;
--md-sys-color-error:#ffb3b0;
--md-sys-color-on-error:#680016;
--md-sys-color-error-container:#920023;
--md-sys-color-on-error-container:#ffdad8;
--md-sys-color-success:#52de9b;
--md-sys-color-on-success:#003921;
--md-sys-color-success-container:#005232;
--md-sys-color-on-success-container:#72fcb6;
--md-sys-color-warning:#ffba40;
--md-sys-color-on-warning:#432c00;
--md-sys-color-warning-container:#604100;
--md-sys-color-on-warning-container:#ffddb2;
--md-sys-color-serious:#ff8c58;
--md-sys-color-on-serious:#571e00;
--md-sys-color-serious-container:#802a00;
--md-sys-color-on-serious-container:#ffdbcc;
--md-sys-color-voice-user:#43d6ff;
--md-sys-color-on-voice-user:#003543;
--md-sys-color-voice-user-container:#004e60;
--md-sys-color-on-voice-user-container:#b5ebff;
--md-sys-color-surface:#0e1511;
--md-sys-color-surface-dim:#0e1511;
--md-sys-color-surface-bright:#343b37;
--md-sys-color-surface-container-lowest:#07100b;
--md-sys-color-surface-container-low:#171d19;
--md-sys-color-surface-container:#1b211d;
--md-sys-color-surface-container-high:#252b28;
--md-sys-color-surface-container-highest:#303632;
--md-sys-color-on-surface:#dce4df;
--md-sys-color-on-surface-variant:#b7cbbf;
--md-sys-color-surface-variant:#394b40;
--md-sys-color-outline:#82958a;
--md-sys-color-outline-variant:#394b40;
--md-sys-color-inverse-surface:#dce4df;
--md-sys-color-inverse-on-surface:#2b322e;
--md-sys-color-inverse-primary:#006d44;
--md-sys-color-scrim:#000000;
--md-sys-color-shadow:#000000;
--md-sys-color-on-scrim:#ffffff;
--bg:var(--md-sys-color-surface);
--card:var(--md-sys-color-surface-container);
--ink:var(--md-sys-color-on-surface);
--fg:var(--md-sys-color-on-surface);
--amt:var(--md-sys-color-on-surface);
--vink:var(--md-sys-color-on-surface);
--dim:var(--md-sys-color-on-surface-variant);
--m:var(--md-sys-color-on-surface-variant);
--mute:var(--md-sys-color-on-surface-variant);
--lab:var(--md-sys-color-on-surface-variant);
--line:var(--md-sys-color-outline-variant);
--c:var(--md-sys-color-outline-variant);
--grid:var(--md-sys-color-outline-variant);
--track:var(--md-sys-color-surface-container-highest);
--chip:var(--md-sys-color-surface-container-high);
--lift:var(--md-sys-color-surface-container-high);
--hover:var(--md-sys-color-surface-container-high);
--e:var(--md-sys-color-surface-container-high);
--ec:var(--md-sys-color-surface-container-high);
--s:var(--md-sys-color-surface-container-high);
--accent:var(--md-sys-color-primary);
--acc:var(--md-sys-color-primary);
--sel:var(--md-sys-color-primary);
--ser:var(--md-sys-color-serious);
--accent-ink:var(--md-sys-color-on-primary);
--ok:var(--md-sys-color-success);
--good:var(--md-sys-color-success);
--go:var(--md-sys-color-success);
--live:var(--md-sys-color-success);
--y:var(--md-sys-color-success);
--soon:var(--md-sys-color-serious);
--quote:var(--md-sys-color-surface-container-high);
--st-live:var(--md-sys-color-success);
--up:var(--md-sys-color-success);
--fav:var(--md-sys-color-warning);
--tick:var(--md-sys-color-success);
--warn:var(--md-sys-color-warning);
--wait:var(--md-sys-color-warning);
--down:var(--md-sys-color-warning);
--over:var(--md-sys-color-warning);
--stop:var(--md-sys-color-error);
--bad:var(--md-sys-color-error);
--crit:var(--md-sys-color-error);
--n:var(--md-sys-color-error);
--shadow:none;
/* type — Material 3 type scale */
--md-sys-font-brand:system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
--md-sys-font-plain:system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
--md-sys-font-mono:ui-monospace, SFMono-Regular, Menlo, monospace;
--md-sys-display-large:3.5rem;
--md-sys-display-medium:2.8rem;
--md-sys-display-small:2.25rem;
--md-sys-headline-large:2rem;
--md-sys-headline-medium:1.75rem;
--md-sys-headline-small:1.5rem;
--md-sys-title-large:1.375rem;
--md-sys-title-medium:1rem;
--md-sys-title-small:0.875rem;
--md-sys-body-large:1rem;
--md-sys-body-medium:0.875rem;
--md-sys-body-small:0.75rem;
--md-sys-label-large:0.875rem;
--md-sys-label-medium:0.75rem;
--md-sys-label-small:0.6875rem;
/* shape — corner radii */
--md-sys-shape-none:0;
--md-sys-shape-xs:4px;
--md-sys-shape-sm:8px;
--md-sys-shape-md:12px;
--md-sys-shape-lg:16px;
--md-sys-shape-xl:28px;
--md-sys-shape-full:999px;
/* spacing — the 4dp grid */
--md-sys-space-1:4px;
--md-sys-space-2:8px;
--md-sys-space-3:12px;
--md-sys-space-4:16px;
--md-sys-space-5:24px;
--md-sys-space-6:32px;
--md-sys-space-7:48px;
--md-sys-space-8:64px;
/* state layer opacities */
--md-sys-state-hover:0.08;
--md-sys-state-focus:0.10;
--md-sys-state-press:0.12;
--md-sys-state-drag:0.16;
--md-sys-disabled-content:0.38;
--md-sys-disabled-container:0.12;
/* motion — standard easing and durations */
--md-sys-ease-standard:cubic-bezier(0.2, 0, 0, 1);
--md-sys-ease-emphasized:cubic-bezier(0.2, 0, 0, 1);
--md-sys-dur-short:150ms;
--md-sys-dur-medium:250ms;
--md-sys-dur-long:400ms;
}
/* The square ghost. A phone paints its own highlight over a tapped element's
   BOX and ignores `border-radius` entirely, so a circle flashes a rectangle and
   a rounded card flashes a rectangle with corners outside itself. Reported
   against a circular control; it was on every tappable thing on every page
   here. `voicepage` has turned it off since it was written, nothing else had.

   No names in this file's comments, by the way, and it is not squeamishness:
   every byte of it is served from britton.life, where the household's own
   narrative has no business being. It is also what broke a recipe-page test,
   which searched a rendered page for a first name and found it in the
   stylesheet.

   Turned off house-wide, and replaced below rather than simply removed — an
   element that acknowledges nothing when pressed is worse than one that
   acknowledges it in the wrong shape. */
*,*::before,*::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--md-sys-color-surface);
  color:var(--md-sys-color-on-surface);
  font-family:var(--md-sys-font-plain);font-size:var(--md-sys-body-large);
  line-height:1.5}
/* There was a radial lift on the body here, echoing the glow in the screenshot
   this palette came from. It is gone, and the reason is worth keeping: that
   screenshot is a marketing hero and these are dense report pages, and most of
   them have a sticky header painted with a flat `var(--bg)`. A gradient makes
   the top of the page the *lightest* part of it, so the header painted its flat
   surface over the lightest band of the gradient and left a hard seam across
   the full width, on every page that has one. Visible immediately in a
   screenshot of the gardener page and invisible to every assertion about it.
   A flat ground is also the honest reading of the spec: elevation in M3 is
   carried by the surface roles, and a page that gradients its own background
   has started competing with them. */
a{color:var(--md-sys-color-primary);text-decoration-thickness:1px;
  text-underline-offset:2px}
h1,h2,h3,h4{font-family:var(--md-sys-font-brand);line-height:1.2;
  letter-spacing:-0.01em}
code,pre,kbd{font-family:var(--md-sys-font-mono);font-size:0.9em}
hr{border:0;border-top:1px solid var(--md-sys-color-outline-variant)}
::selection{background:var(--md-sys-color-primary);
  color:var(--md-sys-color-on-primary)}
/* Controls inherit the page rather than the platform. `accent-color` is what
   stops a checkbox rendering as the browser's own blue on a jade page. */
input,select,textarea,button{font:inherit;color:inherit;
  accent-color:var(--md-sys-color-primary)}
:focus-visible{outline:2px solid var(--md-sys-color-primary);outline-offset:2px}
/* What replaces it, everywhere. Opacity has no shape of its own, so it cannot
   be the wrong one: a circle dims as a circle and a pill dims as a pill. Any
   component with something better to say on press — the circle does — overrides
   this with its own rule. */
a:active,button:active,summary:active,[role="button"]:active{opacity:.72}
/* The state layer: one rule, every interactive thing. The overlay is the
   foreground colour at the spec's opacity, so it works on any container
   without knowing which one it is sitting on. */
.md-state{position:relative;isolation:isolate}
.md-state::after{content:"";position:absolute;inset:0;border-radius:inherit;
  background:currentColor;opacity:0;pointer-events:none;
  transition:opacity var(--md-sys-dur-short) var(--md-sys-ease-standard)}
@media (hover:hover){.md-state:hover::after{opacity:var(--md-sys-state-hover)}}
.md-state:active::after{opacity:var(--md-sys-state-press)}
/* Cards and chips: tonal elevation, never a shadow. */
.md-card{background:var(--md-sys-color-surface-container);
  border:1px solid var(--md-sys-color-outline-variant);
  border-radius:var(--md-sys-shape-md);padding:var(--md-sys-space-4)}
.md-chip{display:inline-flex;align-items:center;gap:var(--md-sys-space-1);
  background:var(--md-sys-color-surface-container-high);
  color:var(--md-sys-color-on-surface-variant);
  border-radius:var(--md-sys-shape-full);
  padding:var(--md-sys-space-1) var(--md-sys-space-3);
  font-size:var(--md-sys-label-medium)}
.md-btn{display:inline-flex;align-items:center;justify-content:center;
  gap:var(--md-sys-space-2);border:0;cursor:pointer;
  background:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);
  border-radius:var(--md-sys-shape-full);
  padding:var(--md-sys-space-3) var(--md-sys-space-5);
  font-size:var(--md-sys-label-large);font-weight:600}
.md-btn[disabled]{opacity:var(--md-sys-disabled-content);cursor:default}
.md-btn-text{background:none;color:var(--md-sys-color-primary);
  padding:var(--md-sys-space-2) var(--md-sys-space-3)}
.md-btn-outlined{background:none;color:var(--md-sys-color-primary);
  border:1px solid var(--md-sys-color-outline)}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:0.01ms !important;transition-duration:0.01ms !important}}

:root{
  --rule:var(--md-sys-color-outline-variant);
  --link:var(--md-sys-color-primary);
}

/* --- the site's own voice, which is not colour --------------------------- */
body{
  padding:var(--md-sys-space-7) var(--md-sys-space-4) var(--md-sys-space-8);
  font:17px/1.65 ui-serif,Georgia,"Times New Roman",serif;
}
main{max-width:34rem;margin:0 auto}
h1{font-family:inherit;font-size:1.6rem;font-weight:600;letter-spacing:-0.01em;
   margin:0 0 var(--md-sys-space-1)}
h2{font-family:inherit;font-size:1.05rem;font-weight:600;
   margin:var(--md-sys-space-6) 0 var(--md-sys-space-1)}
p,li{margin:var(--md-sys-space-2) 0}
ul{padding-left:1.1rem}
.lede{color:var(--md-sys-color-on-surface-variant);margin-top:0}
.stamp{color:var(--md-sys-color-on-surface-variant);font-size:0.85rem;
       margin:0 0 var(--md-sys-space-5)}
.nav{margin-top:var(--md-sys-space-7);padding-top:var(--md-sys-space-3);
     border-top:1px solid var(--rule);font-size:0.9rem}
.nav a{margin-right:1.1rem}
/* The pulled-out passage. A container role rather than a rule and bare text:
   on a dark ground a left border alone is nearly invisible, and this is the
   one thing on the legal pages a reader is meant to stop at. */
.key{background:var(--md-sys-color-surface-container);
     border-left:2px solid var(--md-sys-color-primary);
     border-radius:0 var(--md-sys-shape-sm) var(--md-sys-shape-sm) 0;
     padding:var(--md-sys-space-3) var(--md-sys-space-4);
     color:var(--md-sys-color-on-surface)}
code{font:0.9em ui-monospace,SFMono-Regular,Menlo,monospace}
