/* LexDino.com — built by tools/build-pages.py from assets/css/src/. Edit those, not this. */
/* ---- 00-tokens.css ---- */
/* LexDino Design Language — tokens. Every colour, gradient, material, size, space and curve is decided here,
   once. Components read these custom properties and never a literal. */

:root {
  /* ---------- 1. The seven brand colours, exactly as issued ---------- */
  --ld-paper: #FFFCF5;
  --ld-ink: #171A1C;
  --ld-parchment: #E8CE99;
  --ld-leather: #3B2118;
  --ld-copper: #B65A3A;
  --ld-gold: #D6AA35;
  --ld-petrol: #006B70;

  /* ---------- 2. Shades mixed from the seven, each measured on the ground it sits on ---------- */
  --ld-paper-2: #F8F5EE;
  --ld-paper-3: #F3F1EA;
  --ld-rule-soft: #E3E1DB;
  --ld-rule: #D5D3CE;
  --ld-rule-strong: #868684;
  --ld-ink-60: #6B6C6A;       /* 5.2:1 on paper */
  --ld-ink-75: #585959;       /* 6.9:1 on paper */
  --ld-ink-2: #1E2224;        /* a surface on ink */
  --ld-ink-3: #262A2C;
  --ld-ink-rule: #2E3234;
  --ld-ink-rule-strong: #454A4C;
  --ld-paper-60: #8C8C89;     /* 5.0:1 on ink */
  --ld-paper-75: #A2A29E;     /* 6.8:1 on ink */
  --ld-paper-90: #DCDAD4;
  --ld-deep: #0E2A2C;         /* petrol at depth: the ground under the lower courts */
  --ld-copper-deep: #A65437;  /* 5.2:1 on paper */
  --ld-copper-light: #D38E68; /* 6.5:1 on ink */
  --ld-gold-light: #E8C466;   /* 10.4:1 on ink */
  --ld-petrol-deep: #055B5F;
  --ld-petrol-light: #7FB5B2; /* for dots and code only — never for text */
  --ld-leather-text: #B1A49D;

  /* ---------- 3. Light and materials ----------
     Gradients live in grounds only: a faint field of light on dark sections, depth under the lower courts.
     Never on text, lines, marks or buttons. Metal is copper as a flat hairline, never a shine. */
  --ld-grad-depth: linear-gradient(180deg, var(--ld-ink) 0%, #122426 60%, var(--ld-deep) 100%);
  --ld-light-hero: radial-gradient(1100px 700px at 100% -10%, rgba(0,107,112,.26), transparent 60%),
                   radial-gradient(800px 520px at -8% 110%, rgba(182,90,58,.12), transparent 60%);
  --ld-light-ink: radial-gradient(1000px 600px at 88% -12%, rgba(0,107,112,.16), transparent 62%);
  --ld-light-leather: radial-gradient(1200px 700px at 88% 0%, rgba(214,170,53,.12), transparent 60%),
                      radial-gradient(900px 600px at 0% 100%, rgba(0,0,0,.25), transparent 65%);
  --ld-light-parchment: radial-gradient(1200px 700px at 50% -20%, rgba(255,252,245,.45), transparent 60%),
                        radial-gradient(1400px 900px at 50% 130%, rgba(59,33,24,.16), transparent 60%);

  /* Gold leaf on leather, dimmed and rubbed: a flat muted gold, worn through in places by a mask — the gold
     of a spine handled for a century, not a shine. Only on leather (and on the shelf's volumes). */
  --ld-gold-worn: #D6B868;      /* 7.7:1 on leather at full, 3.0:1 where most rubbed */
  --ld-gold-worn-2: #B89A55;
  /* A flat floor of 50% under the wear: however rubbed, the gold never drops below 3:1 on leather. */
  --ld-wear: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)),
             url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.018 .045' numOctaves='5' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.6 2.0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)'/%3E%3C/svg%3E"),
             url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' seed='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -1.6 1.75'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");

  /* Leather grain for the bindings on the shelf: a fine pebble, felt more than seen. */
  --ld-leather-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='3' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 -.28'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E");

  /* Grain: visible on paper, felt elsewhere, never on components. */
  --ld-grain-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .09 0 0 0 0 .1 0 0 0 0 .11 0 0 0 .5 -.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  --ld-grain-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .99 0 0 0 0 .96 0 0 0 .16 -.06'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");

  /* ---------- 4. Type ---------- */
  --ld-font-serif: "Newsreader", "Century Schoolbook", Georgia, serif;
  --ld-font-sans: "Geist", "Helvetica Neue", Arial, system-ui, sans-serif;
  --ld-font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ld-t-12: 0.75rem;  --ld-l-12: 1rem;
  --ld-t-14: 0.875rem; --ld-l-14: 1.25rem;
  --ld-t-16: 1rem;     --ld-l-16: 1.5rem;
  --ld-t-18: 1.125rem; --ld-l-18: 1.75rem;
  --ld-t-20: 1.25rem;  --ld-l-20: 1.875rem;
  --ld-t-24: 1.5rem;   --ld-l-24: 2rem;
  --ld-t-28: 1.75rem;  --ld-l-28: 2.25rem;
  --ld-t-32: 2rem;     --ld-l-32: 2.5rem;
  --ld-t-h3: clamp(1.75rem, 1.2rem + 1.4vw, 2.625rem);
  --ld-t-h2: clamp(2.25rem, 1.4rem + 2.6vw, 3.75rem);
  --ld-t-h1: clamp(2.625rem, 1.2rem + 4.4vw, 5.75rem);
  --ld-t-xl: clamp(3.25rem, 1rem + 6.6vw, 8.5rem);
  --ld-measure: 62ch;
  --ld-measure-lead: 48ch;

  /* ---------- 5. Space, grid, shape ---------- */
  --ld-s-half: 4px; --ld-s-1: 8px; --ld-s-2: 16px; --ld-s-3: 24px; --ld-s-4: 32px; --ld-s-6: 48px;
  --ld-s-8: 64px; --ld-s-10: 80px; --ld-s-12: 96px; --ld-s-16: 128px; --ld-s-20: 160px;
  --ld-section: clamp(80px, 5rem + 6vw, 176px);
  --ld-section-tight: clamp(56px, 3rem + 3vw, 104px);
  --ld-grid-max: 1536px;
  --ld-margin: 16px; --ld-gutter: 16px; --ld-cols: 4;
  --ld-hair: 1px;
  --ld-focus-w: 2px;
  --ld-control-h: 48px;
  --ld-control-h-s: 40px;
  --ld-bar-h: 64px;

  /* ---------- 6. Motion ---------- */
  --ld-ease-productive: cubic-bezier(0.2, 0, 0.38, 0.9);
  --ld-ease-expressive: cubic-bezier(0.4, 0.14, 0.3, 1);
  --ld-ease-enter: cubic-bezier(0, 0, 0.3, 1);
  --ld-ease-exit: cubic-bezier(0.4, 0.14, 1, 1);
  --ld-ease-brand: cubic-bezier(0.45, 0, 0.55, 1);
  --ld-ease-lock: cubic-bezier(0.45, 0, 0.25, 1);
  --ld-dur-fast: 110ms; --ld-dur-moderate: 240ms; --ld-dur-slow: 400ms; --ld-dur-reveal: 700ms;
}
@media (min-width: 672px) { :root { --ld-margin: 32px; --ld-gutter: 24px; --ld-cols: 8; } }
@media (min-width: 1056px) { :root { --ld-margin: 48px; --ld-gutter: 32px; --ld-cols: 16; --ld-bar-h: 72px; } }
@media (min-width: 1584px) { :root { --ld-margin: 64px; } }

/* ---------- Grounds. The site is dark-first: ink carries it, depth and leather deepen it, paper is for reading. */
.ld-ground-ink, :root {
  --ground: var(--ld-ink); --ground-2: var(--ld-ink-2); --ground-3: var(--ld-ink-3);
  --ground-texture: var(--ld-light-ink), var(--ld-grain-light);
  --text: var(--ld-paper); --text-2: var(--ld-paper-75); --text-3: var(--ld-paper-60);
  --rule-soft: var(--ld-ink-rule); --rule: var(--ld-ink-rule-strong); --rule-strong: #6B6C6A;
  --accent: var(--ld-copper-light); --accent-text: var(--ld-copper-light);
  --link: var(--ld-paper); --link-hover: var(--ld-copper-light); --focus: var(--ld-copper-light);
  --button-bg: var(--ld-paper); --button-text: var(--ld-ink); --button-bg-hover: #FFFFFF;
  --selection-bg: #1F4E50;
}
.ld-ground-hero { --ground-texture: var(--ld-light-hero), var(--ld-grain-light); }
.ld-ground-deep {
  --ground: var(--ld-deep); --ground-2: #13383A; --ground-3: #174244;
  --ground-texture: var(--ld-grain-light);
  --text: var(--ld-paper); --text-2: var(--ld-paper-75); --text-3: #9A9A96;
  --rule-soft: #1D4244; --rule: #2A5557; --rule-strong: #6F8D8C;
  --accent: var(--ld-gold-light); --accent-text: var(--ld-gold-light);
  --link: var(--ld-paper); --link-hover: var(--ld-gold-light); --focus: var(--ld-gold-light);
  --button-bg: var(--ld-paper); --button-text: var(--ld-ink); --button-bg-hover: #FFFFFF;
  --selection-bg: #1F4E50;
}
.ld-ground-deep.ld-depth { background-image: var(--ld-grad-depth); }
.ld-ground-paper, .ld-ground-paper-2 {
  --ground: var(--ld-paper); --ground-2: var(--ld-paper-2); --ground-3: var(--ld-paper-3);
  --ground-texture: var(--ld-grain-dark);
  --text: var(--ld-ink); --text-2: var(--ld-ink-75); --text-3: var(--ld-ink-60);
  --rule-soft: var(--ld-rule-soft); --rule: var(--ld-rule); --rule-strong: var(--ld-rule-strong);
  --accent: var(--ld-copper); --accent-text: var(--ld-copper-deep);
  --link: var(--ld-petrol); --link-hover: var(--ld-petrol-deep); --focus: var(--ld-petrol);
  --button-bg: var(--ld-ink); --button-text: var(--ld-paper); --button-bg-hover: #000000;
  --selection-bg: #CFE3E2;
}
.ld-ground-paper-2 { --ground: var(--ld-paper-2); --ground-2: var(--ld-paper-3); --ground-3: var(--ld-paper); }
.ld-ground-leather {
  --ground: var(--ld-leather); --ground-2: #472A1F; --ground-3: #523226;
  --ground-texture: var(--ld-light-leather), var(--ld-grain-light);
  --text: var(--ld-paper); --text-2: var(--ld-leather-text); --text-3: #A1938B;
  --rule-soft: #54372C; --rule: #6A4A3D; --rule-strong: #A1938B;
  --accent: var(--ld-gold-light); --accent-text: var(--ld-gold-light);
  --link: var(--ld-parchment); --link-hover: var(--ld-paper); --focus: var(--ld-gold);
  --button-bg: var(--ld-paper); --button-text: var(--ld-leather); --button-bg-hover: #FFFFFF;
  --selection-bg: #6A4A3D;
}
.ld-ground-parchment {
  --ground: var(--ld-parchment); --ground-2: #E1C48A; --ground-3: #F0DDB5;
  --ground-texture: var(--ld-light-parchment);
  --text: var(--ld-ink); --text-2: #4A4336; --text-3: #5E5544;
  --rule-soft: #D7BC86; --rule: #C4A874; --rule-strong: #80745A;
  --accent: var(--ld-leather); --accent-text: var(--ld-leather);
  --link: var(--ld-ink); --link-hover: var(--ld-leather); --focus: var(--ld-ink);
  --button-bg: var(--ld-ink); --button-text: var(--ld-paper); --button-bg-hover: #000000;
  --selection-bg: #D7BC86;
}

/* ---- 01-base.css ---- */
/* Base: reset, grounds, type roles, grid, reveal. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; background: var(--ld-ink); }
body { margin: 0; background: var(--ld-ink); color: var(--text); font-family: var(--ld-font-sans); font-size: var(--ld-t-16); line-height: 1.55; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
img, svg, video, canvas { display: block; max-width: 100%; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
::selection { background: var(--selection-bg); color: var(--text); }
a { color: inherit; text-decoration: none; }
[id] { scroll-margin-top: calc(var(--ld-bar-h) + 24px); }
:focus { outline: none; }
:focus-visible { outline: var(--ld-focus-w) solid var(--focus); outline-offset: 3px; }

/* A section paints its ground and its material. */
[class*="ld-ground-"] { background-color: var(--ground); background-image: var(--ground-texture); color: var(--text); }

.ld-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ld-skip { position: absolute; left: var(--ld-margin); top: -100px; z-index: 100; background: var(--ld-paper); color: var(--ld-ink); padding: 12px 16px; font-size: var(--ld-t-14); }
.ld-skip:focus { top: 12px; }

/* ---------- Type roles ----------
   Newsreader at 400 carries headlines and product names; Geist sets body, interface and labels; Geist Mono
   sets citations and data. */
.ld-xl, .ld-h1, .ld-h2, .ld-h3, .ld-h4, .ld-title { font-family: var(--ld-font-serif); font-weight: 400; font-optical-sizing: auto; text-wrap: balance; }
.ld-xl { font-size: var(--ld-t-xl); line-height: 0.98; letter-spacing: -0.032em; }
.ld-h1 { font-size: var(--ld-t-h1); line-height: 1.02; letter-spacing: -0.026em; }
.ld-h2 { font-size: var(--ld-t-h2); line-height: 1.06; letter-spacing: -0.022em; }
.ld-h3 { font-size: var(--ld-t-h3); line-height: 1.12; letter-spacing: -0.014em; }
.ld-h4 { font-size: var(--ld-t-24); line-height: 1.25; letter-spacing: -0.006em; }
.ld-title { font-size: clamp(1.625rem, 10cqi, 2.5rem); line-height: 1.06; letter-spacing: -0.02em; }
.ld-recede { color: var(--text-3); }
/* Italic is the one emphasis a headline takes: the serif's own, in the same colour. */
.ld-xl em, .ld-h1 em, .ld-h2 em { font-style: italic; letter-spacing: -0.02em; }

.ld-lead { font-size: var(--ld-t-20); line-height: 1.5; color: var(--text-2); max-width: var(--ld-measure-lead); text-wrap: pretty; }
@media (min-width: 1056px) { .ld-lead { font-size: 1.375rem; } }
.ld-body { font-size: var(--ld-t-18); line-height: var(--ld-l-18); color: var(--text-2); max-width: var(--ld-measure); text-wrap: pretty; }
.ld-body-s { font-size: var(--ld-t-16); line-height: var(--ld-l-16); color: var(--text-2); max-width: var(--ld-measure); text-wrap: pretty; }
.ld-small { font-size: var(--ld-t-14); line-height: var(--ld-l-14); }
.ld-muted { color: var(--text-2); }
.ld-faint { color: var(--text-3); }
.ld-label { font-family: var(--ld-font-mono); font-weight: 500; font-size: 11px; line-height: 16px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-2); }
.ld-mono { font-family: var(--ld-font-mono); font-size: var(--ld-t-12); line-height: var(--ld-l-12); letter-spacing: 0.01em; font-variant-numeric: tabular-nums slashed-zero; }
.ld-mono-m { font-family: var(--ld-font-mono); font-size: var(--ld-t-14); line-height: var(--ld-l-14); }

/* ---------- Gold on leather: dimmed, rubbed gold leaf on every headline and rule set on leather ---------- */
.ld-worn, .ld-ground-leather :is(.ld-xl, .ld-h1, .ld-h2, .ld-h3, .ld-h4, .ld-title) {
  color: var(--ld-gold-worn);
  -webkit-mask-image: var(--ld-wear); mask-image: var(--ld-wear);
  -webkit-mask-size: auto, 260px 260px, 120px 120px; mask-size: auto, 260px 260px, 120px 120px;
  -webkit-mask-composite: source-over, source-in, source-over; mask-composite: add, intersect, add;
}
.ld-ground-leather :is(.ld-xl, .ld-h1, .ld-h2, .ld-h3) .ld-recede { color: var(--ld-gold-worn-2); }
.ld-ground-leather { --accent: var(--ld-gold-worn); --accent-text: var(--ld-gold-worn); }
.ld-ground-leather .ld-kicker::after { background: var(--ld-gold-worn-2); opacity: .6; }
@media print { .ld-worn, .ld-ground-leather :is(.ld-xl, .ld-h1, .ld-h2, .ld-h3, .ld-h4, .ld-title) { -webkit-mask-image: none; mask-image: none; } }

/* ---------- Grid ---------- */
.ld-wrap { width: 100%; max-width: var(--ld-grid-max); margin-inline: auto; padding-inline: var(--ld-margin); }
.ld-grid { display: grid; grid-template-columns: repeat(var(--ld-cols), minmax(0, 1fr)); column-gap: var(--ld-gutter); }
.ld-section { padding: calc(var(--ld-section) + var(--ld-under-bar, 0px)) 0 var(--ld-section); position: relative; }
.ld-section--tight { padding: calc(var(--ld-section-tight) + var(--ld-under-bar, 0px)) 0 var(--ld-section-tight); position: relative; }
[class*="ld-span"] { grid-column: 1 / -1; }
@media (min-width: 672px) { .ld-span-md-4 { grid-column: auto / span 4; } .ld-span-md-8 { grid-column: auto / span 8; } }
@media (min-width: 1056px) {
  .ld-span-lg-4 { grid-column: auto / span 4; } .ld-span-lg-5 { grid-column: auto / span 5; } .ld-span-lg-6 { grid-column: auto / span 6; }
  .ld-span-lg-7 { grid-column: auto / span 7; } .ld-span-lg-8 { grid-column: auto / span 8; } .ld-span-lg-9 { grid-column: auto / span 9; }
  .ld-span-lg-10 { grid-column: auto / span 10; } .ld-span-lg-12 { grid-column: auto / span 12; } .ld-span-lg-16 { grid-column: auto / span 16; }
  .ld-start-lg-5 { grid-column-start: 5; } .ld-start-lg-9 { grid-column-start: 9; } .ld-start-lg-10 { grid-column-start: 10; } .ld-start-lg-11 { grid-column-start: 11; }
}
.ld-stack > * + * { margin-top: var(--stack, var(--ld-s-3)); }

/* ---------- Motion: headlines rise word by word; kicker rules draw ---------- */
.ld-word { display: inline-block; overflow: hidden; vertical-align: top; padding: 0 .06em .14em 0; margin: 0 -.06em -.14em 0; }
.ld-word__in { display: inline-block; }
/* Each word starts wholly below its clip — a word’s ascenders never show before it rises. */
.has-motion .ld-words .ld-word__in { transform: translateY(135%); transition: transform 1s cubic-bezier(.2,.75,.1,1) calc(var(--wi) * 55ms); }
.has-motion .ld-words.is-in .ld-word__in { transform: none; }
/* The hero's lead and actions follow the headline in. */
.has-motion .ld-hero__copy > :not(h1), .has-motion .ld-pagehero .ld-lead, .has-motion .ld-pagehero .ld-actions { animation: ld-follow .9s cubic-bezier(.2,.75,.1,1) both; animation-delay: .75s; }
.has-motion .ld-hero__copy > .ld-actions, .has-motion .ld-pagehero .ld-actions { animation-delay: .9s; }
.has-motion .ld-hero__copy > .ld-label { animation-delay: 0s; }
@keyframes ld-follow { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.has-motion .ld-kicker::after { transform: scaleX(0); transform-origin: left; transition: transform 1.1s cubic-bezier(.4,.1,.2,1) .15s; }
.has-motion .ld-kicker.is-in::after { transform: none; }

/* ---------- Reveal ---------- */
.ld-reveal { opacity: 0; transform: translateY(16px); }
.ld-reveal.is-in { opacity: 1; transform: none; transition: opacity var(--ld-dur-reveal) var(--ld-ease-expressive), transform var(--ld-dur-reveal) var(--ld-ease-expressive); transition-delay: var(--delay, 0ms); }
.no-js .ld-reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ld-reveal, .ld-reveal.is-in { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* ---- 10-controls.css ---- */
/* Controls: the D button, the D-mark, the caret, the O01 loader. Every control is drawn from the logo. */

/* ---------- The button is the D: a flat stem side, a round bowl ---------- */
.ld-btn {
  --btn-bg: var(--button-bg); --btn-fg: var(--button-text); --btn-bd: var(--button-bg);
  position: relative; display: inline-flex; align-items: center; gap: 10px;
  min-height: var(--ld-control-h); padding: 0 34px 0 22px;
  background: var(--btn-bg); color: var(--btn-fg); border: var(--ld-hair) solid var(--btn-bd);
  border-radius: 0 999px 999px 0;
  font-family: var(--ld-font-sans); font-size: var(--ld-t-16); font-weight: 500; line-height: 1; white-space: nowrap;
  transition: background-color var(--ld-dur-fast) var(--ld-ease-productive), border-color var(--ld-dur-fast) var(--ld-ease-productive), color var(--ld-dur-fast) var(--ld-ease-productive);
}
.ld-btn:hover { --btn-bg: var(--button-bg-hover); --btn-bd: var(--button-bg-hover); }
/* On hover the D's stem appears and completes the letter. */
.ld-btn::before { content: ""; position: absolute; left: 8px; top: 26%; bottom: 26%; width: 2px; background: var(--ld-copper-light); transform: scaleY(0); transition: transform var(--ld-dur-moderate) var(--ld-ease-lock); }
.ld-btn:hover::before, .ld-btn:focus-visible::before { transform: scaleY(1); }
.ld-btn--s { min-height: var(--ld-control-h-s); font-size: var(--ld-t-14); padding: 0 26px 0 16px; }
.ld-btn--s::before { left: 6px; }
/* The open D: the secondary button has no stem side at all. */
.ld-btn--ghost { --btn-bg: transparent; --btn-fg: var(--text); --btn-bd: var(--rule-strong); border-left-color: transparent; padding-left: 16px; }
.ld-btn--ghost:hover { --btn-bg: transparent; --btn-bd: var(--text); }
.ld-btn--ghost::before { left: 0; }
/* The accent: the D in copper — once per page, for the one action that matters most. Ink on copper light: 6.5:1. */
.ld-btn--accent { --btn-bg: var(--ld-copper-light); --btn-fg: var(--ld-ink); --btn-bd: var(--ld-copper-light); }
.ld-btn--accent:hover { --btn-bg: #E0A77A; --btn-bd: #E0A77A; }
.ld-btn--accent::before { background: var(--ld-ink); }
.ld-btn[aria-busy="true"] { pointer-events: none; opacity: .92; }
.ld-btn .lexdino-loader { width: 20px; height: 20px; }
.ld-actions { display: flex; flex-wrap: wrap; gap: var(--ld-s-2); align-items: center; }

/* The arrow: the wordmark's X, its V turned to point ahead and a shaft cut at the angle and gap of the X's break.
   It stands on the baseline, as tall as the capitals, right after the words it belongs to. (The D, the n and the
   cut E are the book; they are never used as pointers.) */
.ld-arrow { display: inline-block; flex: none; width: 0.68em; height: 0.72em; fill: currentColor; vertical-align: baseline; transition: transform var(--ld-dur-moderate) var(--ld-ease-lock), opacity var(--ld-dur-moderate) var(--ld-ease-productive), color var(--ld-dur-fast) var(--ld-ease-productive); }
@supports (height: 1cap) { .ld-arrow { width: calc(1cap * 179 / 189.3); height: 1cap; } }
a:hover .ld-arrow, a:focus-visible .ld-arrow { transform: translateX(3px); color: var(--accent-text); }
.ld-textlink { display: inline-flex; align-items: baseline; gap: 8px; font-size: var(--ld-t-16); font-weight: 500; color: var(--text); padding-bottom: 4px; background: linear-gradient(var(--rule-strong), var(--rule-strong)) left bottom / 100% 1px no-repeat; transition: background-size var(--ld-dur-slow) var(--ld-ease-expressive); }
.ld-textlink:hover { background-image: linear-gradient(var(--accent), var(--accent)); }
.ld-link { color: var(--link); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.22em; }
.ld-link:hover { color: var(--link-hover); }

/* ---------- The caret: the V at the top of the wordmark's X ---------- */
.ld-caret { width: 8px; height: 7px; flex: none; opacity: .7; transition: transform var(--ld-dur-moderate) var(--ld-ease-lock); }
[aria-expanded="true"] > .ld-caret, details[open] > summary .ld-caret { transform: rotate(180deg); }

/* ---------- The O01 loader, as issued: the only loader on the site, and only while work runs ---------- */
.lexdino-loader { display: inline-block; flex: none; width: var(--lexdino-loader-size, 24px); height: var(--lexdino-loader-size, 24px); color: currentColor; vertical-align: middle; }
.lexdino-loader__part { transform-box: view-box; transform-origin: 50% 50%; animation: var(--lexdino-loader-duration, 3.2s) cubic-bezier(.45, 0, .55, 1) infinite; }
.lexdino-loader__part--upper { animation-name: lexdino-o01-exchange-upper; }
.lexdino-loader__part--lower { animation-name: lexdino-o01-exchange-lower; }
@keyframes lexdino-o01-exchange-upper {
  0%, 9% { transform: rotate(0deg) translate(0, 0); } 18%, 22% { transform: rotate(-8deg) translate(1.5px, -1.5px); }
  39% { transform: rotate(184deg) translate(1.5px, -1.5px); } 46%, 57% { transform: rotate(180deg) translate(0, 0); }
  66%, 70% { transform: rotate(172deg) translate(1.5px, -1.5px); } 87% { transform: rotate(364deg) translate(1.5px, -1.5px); }
  94%, 100% { transform: rotate(360deg) translate(0, 0); }
}
@keyframes lexdino-o01-exchange-lower {
  0%, 13% { transform: rotate(0deg) translate(0, 0); } 22%, 24% { transform: rotate(-8deg) translate(-1.5px, 1.5px); }
  41% { transform: rotate(184deg) translate(-1.5px, 1.5px); } 48%, 61% { transform: rotate(180deg) translate(0, 0); }
  70%, 72% { transform: rotate(172deg) translate(-1.5px, 1.5px); } 89% { transform: rotate(364deg) translate(-1.5px, 1.5px); }
  96%, 100% { transform: rotate(360deg) translate(0, 0); }
}
@media (prefers-reduced-motion: reduce) { .lexdino-loader__part { animation: none; } }

/* ---------- Tags and chips ---------- */
.ld-tag { font-family: var(--ld-font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-3); }
/* A list of kinds of record is a line of words, not a row of boxes. */
.ld-chips { display: flex; flex-wrap: wrap; gap: 4px 0; font-size: var(--ld-t-14); line-height: 1.5; }
.ld-chip { color: var(--text); }
.ld-chip + .ld-chip::before { content: "·"; margin-inline: 8px; color: var(--text-3); }

/* ---- 12-topbar.css ---- */
/* The topbar, as the great sites carry it: clear over the hero, ink and blur once the page moves; one sheet under
   it that grows to the menu it holds and slides between menus; a copper marker that follows the pointer; the page
   dims while a menu is open; the bar steps aside going down and returns going up. */

.ld-topbar {
  position: sticky; top: 0; z-index: 60; margin-bottom: calc(var(--ld-bar-h) * -1);
  --text: var(--ld-paper); --text-2: var(--ld-paper-75); --text-3: var(--ld-paper-60);
  --rule-soft: var(--ld-ink-rule); --rule: var(--ld-ink-rule-strong); --rule-strong: #6B6C6A; --accent-text: var(--ld-copper-light);
  --button-bg: var(--ld-paper); --button-text: var(--ld-ink); --button-bg-hover: #FFFFFF; --focus: var(--ld-copper-light);
  color: var(--text); transition: transform 420ms var(--ld-ease-lock);
}
.ld-topbar.is-away { transform: translateY(-100%); }
/* The ground of the bar is a layer of its own (a filter on the bar would trap the fixed menus inside it). */
.ld-topbar::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(18, 21, 23, .82); -webkit-backdrop-filter: saturate(150%) blur(16px); backdrop-filter: saturate(150%) blur(16px); opacity: 0; transition: opacity 320ms var(--ld-ease-productive); }
.ld-topbar::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--ld-ink-rule-strong); opacity: 0; transition: opacity 320ms var(--ld-ease-productive); }
.ld-topbar.is-solid::before, .ld-topbar.is-open::before, .ld-topbar.is-menu::before { opacity: 1; }
.ld-topbar.is-solid::after, .ld-topbar.is-open::after, .ld-topbar.is-menu::after { opacity: 1; }
.ld-topbar.is-open::before { background: #121517; }
/* The first section runs under the clear bar. */
main > :first-child { --ld-under-bar: var(--ld-bar-h); }

.ld-topbar__bar { height: var(--ld-bar-h); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--ld-s-4); }
.ld-topbar__brand { display: block; width: 112px; padding-block: 8px; color: var(--ld-paper); }
.ld-topbar__brand svg { width: 100%; height: auto; }
.ld-topbar__nav { display: none; justify-content: center; }
.ld-topbar__list { display: flex; gap: 2px; }
.ld-topbar__link {
  position: relative; display: inline-flex; align-items: center; gap: 7px; height: var(--ld-bar-h); padding: 0 16px; border: 0; background: transparent;
  font-size: var(--ld-t-14); font-weight: 450; letter-spacing: .005em; color: var(--text-2);
  transition: color var(--ld-dur-fast) var(--ld-ease-productive);
}
.ld-topbar__link:hover, .ld-topbar__link[aria-expanded="true"], .ld-topbar__link[aria-current="page"], .ld-topbar__link.is-current { color: var(--text); }
.ld-topbar__link:focus-visible { outline-offset: -8px; }
/* The marker: a copper hairline that runs to the item under the pointer, and rests under the current page. */
.ld-topbar__marker { position: absolute; bottom: 0; left: 0; height: 1px; width: var(--mw, 0); transform: translateX(var(--mx, 0)); background: var(--ld-copper-light); opacity: var(--mo, 0); transition: transform 380ms var(--ld-ease-lock), width 380ms var(--ld-ease-lock), opacity 200ms var(--ld-ease-productive); pointer-events: none; }
.ld-topbar__end { grid-column: -2; display: flex; align-items: center; justify-content: flex-end; gap: var(--ld-s-2); }
.ld-topbar__signin { display: none; font-size: var(--ld-t-14); color: var(--text-2); padding: 8px 6px; }
.ld-topbar__signin:hover { color: var(--text); }
/* On phones and tablets the bar holds the logo and the menu only; Contact sales opens the menu (Harvey, Stripe). */
.ld-topbar__end .ld-btn { display: none; }
@media (min-width: 1056px) {
  .ld-topbar__brand { width: 128px; }
  .ld-topbar__nav { display: flex; }
  .ld-topbar__signin { display: inline-block; }
  .ld-topbar__end .ld-btn { display: inline-flex; }
  .ld-burger { display: none !important; }
}

/* ---------- The sheet and its panels ---------- */
.ld-topbar__sheet { position: absolute; left: 0; right: 0; top: 100%; height: var(--sheet-h, 0px); background: #121517; border-bottom: 1px solid var(--ld-ink-rule); box-shadow: 0 40px 80px -30px rgba(0,0,0,.7); transition: height 420ms var(--ld-ease-lock); pointer-events: none; }
.ld-topbar:not(.is-open) .ld-topbar__sheet { border-bottom-color: transparent; box-shadow: none; }
.ld-topbar__scrim { position: fixed; inset: var(--ld-bar-h) 0 0 0; z-index: -2; background: rgba(8, 10, 11, .5); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity 320ms var(--ld-ease-productive); }
.ld-topbar.is-open .ld-topbar__scrim { opacity: 1; pointer-events: auto; }
.ld-panel { position: absolute; left: 0; right: 0; top: 100%; z-index: 1; opacity: 0; visibility: hidden; transform: translateX(var(--from, 0)); transition: opacity 220ms var(--ld-ease-productive), transform 420ms var(--ld-ease-lock), visibility 0s linear 220ms; }
.ld-panel.is-open { opacity: 1; visibility: visible; transform: none; transition-delay: 60ms, 0s, 0s; }
.ld-panel > .ld-wrap { padding-block: var(--ld-s-4) var(--ld-s-3); }
.ld-panel__cols { display: grid; grid-template-columns: 5fr 4fr 4fr; gap: var(--ld-s-4); }
.ld-panel__col { display: grid; align-content: start; gap: var(--ld-s-2); }
.ld-panel__label { color: var(--ld-paper-60); padding-bottom: 10px; border-bottom: 1px solid var(--ld-ink-rule); }
.ld-panel__feature { display: grid; gap: 8px; padding: var(--ld-s-3); background: #1B1F21; border-top: 1px solid var(--ld-copper-light); transition: background-color var(--ld-dur-moderate) var(--ld-ease-productive); }
.ld-panel__feature:hover { background: #202527; }
.ld-panel__feature b { font-family: var(--ld-font-serif); font-weight: 400; font-size: var(--ld-t-28); line-height: 1.1; letter-spacing: -0.015em; }
.ld-panel__feature span { font-size: var(--ld-t-14); line-height: 1.5; color: var(--ld-paper-75); }
.ld-panel__links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.ld-panel__links a { font-size: var(--ld-t-14); color: var(--ld-paper-75); padding-block: 5px; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: .28em; transition: color var(--ld-dur-fast), text-decoration-color var(--ld-dur-fast); }
.ld-panel__links a:hover { color: var(--ld-paper); text-decoration-color: var(--ld-copper-light); }
.ld-panel__items { display: grid; }
.ld-panel__item { display: grid; gap: 3px; padding: 12px 0; border-bottom: 1px solid var(--ld-ink-rule); }
.ld-panel__item b { font-family: var(--ld-font-serif); font-weight: 400; font-size: var(--ld-t-20); color: var(--ld-paper); transition: color var(--ld-dur-fast) var(--ld-ease-productive); }
.ld-panel__item span { font-size: var(--ld-t-14); line-height: 1.45; color: var(--ld-paper-75); }
.ld-panel__item .ld-arrow { opacity: 0; transform: translateX(-6px); margin-left: 4px; }
.ld-panel__item:hover b, .ld-panel__item:focus-visible b { color: var(--ld-copper-light); }
.ld-panel__item:hover .ld-arrow, .ld-panel__item:focus-visible .ld-arrow { opacity: 1; transform: none; }
.ld-panel__foot { display: flex; gap: var(--ld-s-4); margin-top: var(--ld-s-3); padding-top: var(--ld-s-2); border-top: 1px solid var(--ld-ink-rule); font-size: var(--ld-t-14); }
.ld-panel__foot a { color: var(--ld-paper-75); padding-block: 4px; }
.ld-panel__foot a:hover { color: var(--ld-paper); }
.has-motion .ld-panel.is-open .ld-panel__col { animation: ld-panel-in 520ms var(--ld-ease-lock) both; }
.has-motion .ld-panel.is-open .ld-panel__col:nth-child(2) { animation-delay: 40ms; }
.has-motion .ld-panel.is-open .ld-panel__col:nth-child(3) { animation-delay: 80ms; }
@keyframes ld-panel-in { from { opacity: 0; transform: translateY(8px); } }
@media (max-width: 1055px) { .ld-panel, .ld-topbar__sheet, .ld-topbar__scrim { display: none; } }

/* ---------- The menu button: the three bars of the E, locking into the wordmark's X ---------- */
.ld-burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; margin-right: -10px; border: 0; background: none; color: var(--text); font-size: var(--ld-t-14); }
.ld-burger svg { width: 22px; height: 22px; overflow: visible; }
.ld-burger .e, .ld-burger .x { transform-box: view-box; transform-origin: 12px 12px; transition: transform 420ms var(--ld-ease-lock), opacity 260ms var(--ld-ease-productive); }
.ld-burger .x { opacity: 0; }
.ld-burger .x-v { transform: translateY(-4px); }
.ld-burger .x-l { transform: translate(-3.5px, 3.5px); }
.ld-burger .x-r { transform: translate(3.5px, 3.5px); }
.ld-burger[aria-expanded="true"] .e { opacity: 0; }
.ld-burger[aria-expanded="true"] .e1 { transform: translateY(3px) scaleX(.4); }
.ld-burger[aria-expanded="true"] .e2 { transform: scaleX(0); }
.ld-burger[aria-expanded="true"] .e3 { transform: translateY(-3px) scaleX(.4); }
.ld-burger[aria-expanded="true"] .x { opacity: 1; transform: none; }
.ld-burger[aria-expanded="true"] .x-l { transition-delay: 60ms; }
.ld-burger[aria-expanded="true"] .x-r { transition-delay: 120ms; }

/* The phone menu: the site's own index — numbered kickers, names in the serif with a line of description,
   hairlines, and the two D buttons held at the foot. */
.ld-menu { position: fixed; inset: var(--ld-bar-h) 0 0 0; z-index: 59; display: flex; flex-direction: column; background-color: var(--ld-ink); background-image: var(--ld-light-ink), var(--ld-grain-light); color: var(--ld-paper); }
.ld-menu[hidden] { display: none; }
.ld-menu:focus { outline: none; }
.ld-menu__body { flex: 1; overflow-y: auto; padding: var(--ld-s-4) var(--ld-margin) var(--ld-s-6); display: grid; gap: var(--ld-s-6); align-content: start; }
.ld-menu__group { display: grid; }
.ld-menu__group .ld-kicker { margin-bottom: var(--ld-s-1); }
.ld-menu__item { display: grid; gap: 2px; padding-block: 14px; border-bottom: 1px solid var(--ld-ink-rule); }
.ld-menu__item:first-of-type { border-top: 1px solid var(--ld-ink-rule-strong); }
.ld-menu__item b { font-family: var(--ld-font-serif); font-weight: 400; font-size: var(--ld-t-24); line-height: 1.2; letter-spacing: -0.012em; }
.ld-menu__item span { font-size: var(--ld-t-14); line-height: 1.45; color: var(--ld-paper-75); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ld-menu__item:hover b, .ld-menu__item[aria-current] b { color: var(--ld-copper-light); }
.ld-menu__places { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--ld-s-3); border-top: 1px solid var(--ld-ink-rule-strong); }
.ld-menu__places a { padding-block: 12px; font-size: var(--ld-t-16); border-bottom: 1px solid var(--ld-ink-rule); }
.ld-menu__end { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ld-s-1); padding: var(--ld-s-2) var(--ld-margin) calc(var(--ld-s-2) + env(safe-area-inset-bottom)); border-top: 1px solid var(--ld-ink-rule-strong); background: var(--ld-ink); }
.ld-menu__end .ld-btn { justify-content: center; }
@media (min-width: 1056px) { .ld-menu { display: none !important; } }

/* ---- 20-sections.css ---- */
/* Sections: heroes, section heads, statements, the horizon, the strip, contact, footer. */

/* ---------- The rule between chapters on dark grounds ---------- */
.ld-horizon-line { position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--rule-soft); pointer-events: none; }

/* ---------- Home hero: the record, written in the arch window ---------- */
.ld-hero { position: relative; overflow: hidden; }
/* The hero is sized so the shelf beneath it stands in the first screen. */
.ld-hero__grid { align-items: end; row-gap: var(--ld-s-6); padding-top: calc(clamp(24px, 1rem + 2.4vw, 64px) + var(--ld-under-bar, 0px)); }
.ld-hero__copy { grid-column: 1 / -1; padding-bottom: var(--ld-s-6); }
.ld-hero__copy > * + * { margin-top: var(--ld-s-3); }
.ld-hero__copy .ld-actions { margin-top: var(--ld-s-4); }
@media (min-width: 1056px) {
  .ld-hero__copy { padding-bottom: var(--ld-s-4); }
  .ld-hero .ld-xl { font-size: clamp(2.75rem, 1rem + 4.2vw, 6rem); }
  .ld-hero .ld-lead { font-size: var(--ld-t-20); max-width: 60ch; }
}
.ld-hero__visual { display: none; }
@media (min-width: 672px) {
  .ld-hero__copy { grid-column: 1 / span 5; }
  .ld-hero__visual { display: block; grid-column: 6 / span 3; grid-row: 1; max-width: 240px; width: 100%; justify-self: end; }
}
@media (min-width: 1056px) {
  .ld-hero__copy { grid-column: 1 / span 9; }
  .ld-hero__visual { grid-column: 11 / span 6; max-width: 520px; }
}
/* The window: the arch as issued, dark inside, the record passing in paper-toned lines, a copper hairline around it. */
.ld-window { position: relative; aspect-ratio: 4 / 5; width: 100%; }
@media (min-width: 1056px) { .ld-window { width: min(100%, max(300px, calc((100svh - var(--ld-bar-h) - 400px) * .8))); margin-left: auto; } }
.ld-window__arch { position: absolute; inset: 0; border-radius: 100vmax 100vmax 0 0; overflow: hidden; background: #202325; }
.ld-window__arch canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.ld-window__frame { position: absolute; inset: -12px -12px 0; border: 1px solid var(--ld-copper); border-bottom: 0; border-radius: 100vmax 100vmax 0 0; pointer-events: none; }
/* Phones: the record runs as a band on the threshold. */

/* ---------- Page hero (inner pages) ---------- */
.ld-pagehero { position: relative; overflow: hidden; padding: calc(clamp(56px, 3rem + 5vw, 136px) + var(--ld-under-bar, 0px)) 0 var(--ld-section-tight); }
.ld-pagehero::after { content: ""; position: absolute; right: -10%; top: -30%; width: 70%; height: 140%; background: radial-gradient(closest-side, rgba(0,107,112,.22), transparent); pointer-events: none; }
.ld-ground-leather.ld-pagehero::after { background: radial-gradient(closest-side, rgba(214,170,53,.10), transparent); }
.ld-pagehero > * { position: relative; z-index: 1; }

/* ---------- Section head: index, label, headline, lead, link ---------- */
.ld-head { row-gap: var(--ld-s-3); margin-bottom: var(--ld-s-8); }
.ld-kicker { display: flex; align-items: center; align-self: start; gap: 12px; }
.ld-kicker__num { font-family: var(--ld-font-mono); font-size: 11px; color: var(--accent-text); letter-spacing: .08em; }
.ld-kicker::after { content: ""; flex: 1; height: 1px; max-width: 88px; background: var(--rule); }
.ld-head__text > * + * { margin-top: var(--ld-s-3); }

/* ---------- Statement ---------- */
.ld-statement { max-width: 20ch; }

/* ---------- The shelf: a working law library ----------
   Real bindings are round, ribbed, grained and rubbed; so are these. The spine's roundness is the one place a
   shade runs across a surface — it is the object's form, not decoration. Nothing moves on its own: the volumes
   settle once when the shelf comes into view, and the row drifts only as the reader scrolls. */
.ld-shelf { --s: .8; position: relative; background: #0F1213; border-top: 1px solid var(--rule-soft); padding-top: 34px; overflow: hidden; }
@media (min-width: 672px) { .ld-shelf { --s: 1; } }
.ld-shelf__viewport { overflow: hidden; touch-action: pan-y; cursor: grab; }
.ld-shelf__viewport.is-dragging { cursor: grabbing; }
.ld-shelf__viewport::-webkit-scrollbar { display: none; }
.ld-shelf__viewport:focus-visible { outline-offset: -2px; }
.ld-shelf__row { display: flex; align-items: flex-end; gap: 1px; width: max-content; padding-inline: var(--ld-margin) 0; will-change: transform; }

.ld-book {
  --b: #3B2118; --t: rgba(214,184,104,.78); --lab: #141110; --tilt: 0; --mr: 0;
  position: relative; flex: none; display: flex; flex-direction: column; align-items: center; gap: 8px;
  min-width: calc(var(--w) * 1px * var(--s)); height: calc(var(--h) * 1px * var(--s)); padding: calc(32px * var(--s)) 7px calc(28px * var(--s));
  margin-right: calc(var(--mr) * 1px * var(--s));
  background-color: var(--b);
  background-image:
    linear-gradient(90deg, rgba(0,0,0,.5) 0%, rgba(255,240,210,.10) 16%, rgba(255,240,210,.03) 38%, rgba(0,0,0,.10) 72%, rgba(0,0,0,.55) 100%),
    var(--ld-leather-grain);
  background-size: auto, 180px 180px;
  color: var(--t); border-radius: 4px 4px 1px 1px;
  box-shadow: 0 -1px 0 rgba(255,240,210,.06) inset, 2px 0 3px rgba(0,0,0,.35);
  transform-origin: 100% 100%; transform: rotate(calc(var(--tilt) * 1deg));
  transition: transform 520ms var(--ld-ease-lock), opacity 520ms var(--ld-ease-productive);
}
/* Raised bands at head and foot, each ruled in rubbed gold. */
.ld-book::before, .ld-book::after {
  content: ""; position: absolute; left: 0; right: 0; height: 7px;
  background: rgba(0,0,0,.22); border-block: 1px solid rgba(214,184,104,.62);
  box-shadow: 0 1px 0 rgba(255,240,210,.10), 0 -1px 0 rgba(0,0,0,.35);
  -webkit-mask-image: var(--ld-wear); mask-image: var(--ld-wear); -webkit-mask-size: auto, 260px 260px, 120px 120px; mask-size: auto, 260px 260px, 120px 120px;
  -webkit-mask-composite: source-over, source-in, source-over; mask-composite: add, intersect, add;
}
.ld-book::before { top: calc(var(--ot, 12) * 1px * var(--s)); } .ld-book::after { bottom: calc(var(--ob, 10) * 1px * var(--s)); }
.ld-book__head, .ld-book__foot { font-family: var(--ld-font-serif); font-size: calc(10px * var(--s)); letter-spacing: .08em; line-height: 1; white-space: nowrap; }
/* The title is stamped straight onto the leather, across the spine, between two tooled rules — no box. */
.ld-book__label { display: grid; place-items: center; margin-top: calc(8px * var(--s)); padding: calc(9px * var(--s)) 0; width: 100%;
  border-block: 1px solid rgba(214,184,104,.5); box-shadow: 0 3px 0 -2px rgba(214,184,104,.3), 0 -3px 0 -2px rgba(214,184,104,.3); }
.ld-book__foot { margin-top: auto; }
.ld-book__title {
  font-family: var(--ld-font-serif); font-size: calc(11px * var(--s) * var(--fit, 1)); line-height: 1.35; letter-spacing: .03em; white-space: nowrap;
  color: var(--ld-gold-worn); text-align: center; text-shadow: 0 1px 0 rgba(0,0,0,.35);
  -webkit-mask-image: var(--ld-wear); mask-image: var(--ld-wear); -webkit-mask-size: auto, 260px 260px, 120px 120px; mask-size: auto, 260px 260px, 120px 120px;
  -webkit-mask-composite: source-over, source-in, source-over; mask-composite: add, intersect, add;
}
.ld-book--series .ld-book__title { font-size: calc(11px * var(--s) * var(--fit, 1) * var(--fs, 1)); text-transform: uppercase; letter-spacing: .09em; }
.ld-book--case .ld-book__title { font-size: calc(12.5px * var(--s) * var(--fit, 1) * var(--fs, 1)); }
/* Vellum is smooth and its titles are inked, not gilt: no pebble grain, no wear. */
.ld-book--parchment { background-image: linear-gradient(90deg, rgba(60,35,15,.34) 0%, rgba(255,250,235,.18) 18%, rgba(255,250,235,.05) 40%, rgba(60,35,15,.08) 72%, rgba(60,35,15,.4) 100%); }
.ld-book--parchment .ld-book__title { color: #3B2118; font-weight: 500; text-shadow: none; -webkit-mask-image: none; mask-image: none; }
.ld-book--parchment .ld-book__label { border-color: rgba(74,42,24,.5); }
.ld-book--oxblood { --b: #5A2417; } .ld-book--deep { --b: #0F2B2D; } .ld-book--ink { --b: #25292B; } .ld-book--petrol { --b: #0A4B4E; }
.ld-book--parchment { --b: #CDB483; --t: #3B2118; } .ld-book--black { --b: #191513; } .ld-book--green { --b: #16322A; }
.ld-book--lean { z-index: 1; }
.ld-book[tabindex]:hover, .ld-book[tabindex]:focus-visible { transform: translateY(-10px) rotate(calc(var(--tilt) * 1deg)); }
.ld-book[tabindex] { cursor: default; }
.ld-book[tabindex]:focus-visible { outline-offset: 3px; }

/* A stack lying on the shelf, as the E lies: each book on its side, spine out, title across. */
.ld-pile { flex: none; display: flex; flex-direction: column-reverse; align-items: flex-start; margin-inline: 4px 6px; }
.ld-book--flat {
  flex-direction: row; justify-content: space-between; gap: 10px; min-width: 0; margin: 0; padding: 0 14px;
  width: calc(var(--len) * 1px * var(--s)); height: calc(var(--th) * 1px * var(--s)); transform: translateX(calc(var(--dx) * 1px));
  background-image: linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(255,240,210,.10) 22%, rgba(0,0,0,.08) 70%, rgba(0,0,0,.5) 100%), var(--ld-leather-grain);
  border-radius: 1px 3px 3px 1px;
}
.ld-book--flat::before, .ld-book--flat::after { top: 0; bottom: 0; left: auto; right: auto; width: 5px; height: auto; border-block: 0; border-inline: 1px solid rgba(214,184,104,.6); }
.ld-book--flat::before { left: 8px; } .ld-book--flat::after { right: 8px; }
.ld-book--flat .ld-book__title { writing-mode: horizontal-tb; font-size: calc(9.5px * var(--s)); text-transform: uppercase; letter-spacing: .12em; white-space: nowrap; }
.ld-book--flat .ld-book__foot { color: var(--ld-gold-worn); opacity: .8; }

/* Every volume its own: six faces a binder might have used, six ways of tooling a spine. */
.ld-face--news { --face: var(--ld-font-serif); }
.ld-face--garamond { --face: "EB Garamond", Garamond, serif; --fs: 1.08; }
.ld-face--cinzel { --face: "Cinzel", "Trajan Pro", serif; --fs: .86; }
.ld-face--caslon { --face: "Libre Caslon Text", "Big Caslon", serif; --fs: .92; }
.ld-face--playfair { --face: "Playfair Display", Didot, serif; --fs: .95; }
.ld-face--fell { --face: "IM Fell English", serif; --fs: 1.04; }
.ld-book .ld-book__title, .ld-book .ld-book__head, .ld-book .ld-book__foot { font-family: var(--face, var(--ld-font-serif)); }
.ld-face--playfair .ld-book__title { font-weight: 700; letter-spacing: .04em; }
.ld-face--garamond.ld-book--case .ld-book__title, .ld-face--fell.ld-book--case .ld-book__title { font-style: italic; }
.ld-book--tan { --b: #6A4526; --t: rgba(232,206,153,.85); }
/* Tooling. ribs: raised bands in relief; dots: a dotted roll; band: one broad gilt band; fleuron: a single rule and an
   ornament; blind: pressed into the leather without gold. */
.ld-orn--ribs::before, .ld-orn--ribs::after { height: 9px; border: 0; background: linear-gradient(rgba(255,240,210,.16), rgba(0,0,0,.4)); box-shadow: 0 2px 2px rgba(0,0,0,.35); -webkit-mask-image: none; mask-image: none; }
.ld-orn--ribs .ld-book__label { border-block: 0; box-shadow: 0 -8px 0 -7px rgba(214,184,104,.5), 0 8px 0 -7px rgba(214,184,104,.5); }
.ld-orn--dots::before, .ld-orn--dots::after { height: 5px; border-block: 2px dotted rgba(214,184,104,.7); background: none; }
.ld-orn--dots .ld-book__label { border-block-style: dotted; border-width: 2px 0; }
.ld-orn--band::before, .ld-orn--band::after { height: 12px; border: 0; background: rgba(214,184,104,.62); }
.ld-orn--band .ld-book__label { border-block: 0; box-shadow: none; }
.ld-orn--fleuron::before, .ld-orn--fleuron::after { height: 1px; border: 0; border-top: 1px solid rgba(214,184,104,.6); background: none; box-shadow: none; }
.ld-orn--fleuron .ld-book__label { box-shadow: none; }
.ld-orn--fleuron .ld-book__head { font-size: calc(14px * var(--s)); }
.ld-orn--blind::before, .ld-orn--blind::after { border-block-color: rgba(0,0,0,.5); background: rgba(0,0,0,.18); box-shadow: 0 1px 0 rgba(255,240,210,.12); -webkit-mask-image: none; mask-image: none; }
.ld-orn--blind .ld-book__label { border-block-color: rgba(0,0,0,.45); box-shadow: 0 1px 0 rgba(255,240,210,.1), 0 -1px 0 rgba(255,240,210,.06); }
/* More tooling: some spines carry no rules at all — only an ornament, or nothing but the title. */
.ld-book:is(.ld-orn--plain, .ld-orn--lozenge, .ld-orn--stars, .ld-orn--leaf, .ld-orn--panel) .ld-book__label { border-block: 0; box-shadow: none; }
.ld-orn--plain::before, .ld-orn--plain::after { display: none; }
.ld-book:is(.ld-orn--lozenge, .ld-orn--stars, .ld-orn--leaf)::before, .ld-book:is(.ld-orn--lozenge, .ld-orn--stars, .ld-orn--leaf)::after {
  height: auto; border: 0; background: none; box-shadow: none; text-align: center; line-height: 1; color: rgba(214,184,104,.82); font-family: var(--ld-font-serif); }
.ld-orn--lozenge::before, .ld-orn--lozenge::after { content: "◆"; font-size: calc(7px * var(--s)); }
.ld-orn--stars::before, .ld-orn--stars::after { content: "✶ ✶ ✶"; font-size: calc(7px * var(--s)); letter-spacing: .15em; }
.ld-orn--leaf::before { content: "❧"; font-size: calc(13px * var(--s)); }
.ld-orn--leaf::after { content: "❦"; font-size: calc(13px * var(--s)); }
.ld-orn--single::before, .ld-orn--single::after { height: 1px; border: 0; background: rgba(214,184,104,.6); box-shadow: none; }
.ld-orn--single .ld-book__label { border-block-width: 1px 0; box-shadow: none; }
/* A gilt panel framed down the spine, with its corners cut. */
.ld-orn--panel::before { top: calc(var(--ot, 12) * 1px * var(--s)); bottom: calc(var(--ob, 10) * 1px * var(--s)); left: 6px; right: 6px; height: auto; background: none; box-shadow: none;
  border: 1px solid rgba(214,184,104,.55); border-radius: 6px 6px 6px 6px / 10px 10px 10px 10px; }
.ld-orn--panel::after { display: none; }
.ld-orn--band::after { display: none; }
.ld-orn--band::before { top: calc(var(--ot, 12) * 1.6px * var(--s)); }
.ld-orn--ribs::before, .ld-orn--ribs::after { content: ""; }
.ld-book--flat .ld-book__foot { writing-mode: vertical-rl; transform: rotate(180deg); align-self: center; margin: 0 10px 0 0; padding-inline: 0; font-size: calc(8.5px * var(--s)); line-height: 1; letter-spacing: .06em; }

/* The pause control: the shelf moves on its own, so it can always be stopped (WCAG 2.2.2). */
.ld-shelf__toggle { position: absolute; top: 8px; right: var(--ld-margin); z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--rule); border-radius: 999px; background: rgba(15,18,19,.7); color: var(--ld-paper-75); cursor: pointer; transition: color var(--ld-dur-fast), border-color var(--ld-dur-fast); }
.ld-shelf__toggle:hover { color: var(--ld-paper); border-color: var(--ld-paper-60); }
.ld-shelf__pause { width: 8px; height: 10px; border-inline: 2px solid currentColor; }
.ld-shelf__toggle .ld-arrow { display: none; width: 10px; height: 10px; }
.ld-shelf__toggle[aria-pressed="true"] .ld-shelf__pause { display: none; }
.ld-shelf__toggle[aria-pressed="true"] .ld-arrow { display: block; }
.ld-shelf:not(.is-moving) .ld-shelf__toggle { display: none; }
/* Out of sight until the keyboard reaches it: pointer and touch already stop the shelf by resting on it. */
.ld-shelf__toggle:not(:focus-visible) { clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; border: 0; padding: 0; }

/* The volumes settle once, from above, when the shelf first comes into view. */
.has-motion [data-shelf-row]:not(.is-in) .ld-book:not(.ld-book--flat), .has-motion [data-shelf-row]:not(.is-in) .ld-pile { opacity: 0; transform: translateY(-28px) rotate(calc(var(--tilt) * 1deg)); }
.has-motion [data-shelf-row] > * { transition-delay: calc(var(--i, 0) * 22ms); }
.ld-pile { transition: transform 520ms var(--ld-ease-lock), opacity 520ms var(--ld-ease-productive); }
/* The board the volumes stand on. */
.ld-shelf__board { height: 14px; background: #2A1810; border-top: 1px solid #4A2C1E; box-shadow: 0 8px 18px rgba(0,0,0,.5); margin-bottom: 26px; }

/* ---------- The corpus: the name set in the objects of the law ----------
   The photograph is the ground: its own paper runs under the headline (the image is composed from the
   photograph's paper, the tagline taken out), and the section below takes the colour of its last row. It opens a
   little close and settles as the reader scrolls toward it. */
.ld-ground-linen { --ground: #F1E8DF; --ground-2: #EAE0D5; --ground-texture: none; --accent-text: #93462C; background-color: #F1E8DF; }
.ld-ground-linen.ld-section { padding-top: 0; }
.ld-corpus { position: relative; margin: 0 0 var(--ld-s-8); }
.ld-corpus__frame { overflow: hidden; width: min(100% - 2 * var(--ld-margin), 1240px); margin-inline: auto;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(#000 86%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(#000 86%, transparent);
  -webkit-mask-composite: source-in; mask-composite: intersect; }
.ld-corpus__img { display: block; width: 100%; height: auto; transform: scale(var(--z, 1)); transform-origin: 50% 30%; will-change: transform; }
.ld-corpus figcaption { display: grid; gap: var(--ld-s-3); justify-items: center; text-align: center; padding-top: var(--ld-s-2); }
@media (min-width: 672px) { .ld-corpus figcaption { position: absolute; left: 0; right: 0; top: 60%; padding-top: 0; } }
.ld-corpus .ld-kicker::after { display: none; }
.ld-corpus__line { max-width: 24ch; }

/* ---------- Contact band ---------- */
.ld-contact { position: relative; overflow: hidden; }
.ld-contact::before { content: ""; position: absolute; left: -20%; bottom: -60%; width: 90%; height: 140%; background: radial-gradient(closest-side, rgba(182,90,58,.10), transparent); pointer-events: none; }
.ld-contact > * { position: relative; }
.ld-contact__grid { row-gap: var(--ld-s-8); align-items: start; }

/* ---------- Footer ---------- */
/* The footer is the house: leather, and above it the reading room drawn as an architect's elevation, in the
   same rubbed gold as the wordmark at its foot. A picture of a place, not a claim about one. */
.ld-footer { position: relative; overflow: hidden; color: var(--text); }
.ld-footer__house { height: clamp(150px, 9rem + 10vw, 300px); color: var(--ld-gold-worn); opacity: .72; overflow: hidden; border-bottom: 1px solid var(--ld-gold-worn-2);
  -webkit-mask-image: var(--ld-wear); mask-image: var(--ld-wear); -webkit-mask-size: auto, 260px 260px, 120px 120px; mask-size: auto, 260px 260px, 120px 120px;
  -webkit-mask-composite: source-over, source-in, source-over; mask-composite: add, intersect, add; }
.ld-footer__house svg { display: block; width: 100%; height: 100%; }
/* The drawing draws itself once: hairlines first, left to right, then the volumes rise onto their shelves. */
.has-motion .ld-footer__house line, .has-motion .ld-footer__house path { stroke-dasharray: var(--len) var(--len); stroke-dashoffset: var(--len); transition: stroke-dashoffset 1.6s cubic-bezier(.4,.1,.2,1) calc(var(--d) * 1s); }
.has-motion .ld-footer__house rect { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform .7s cubic-bezier(.2,.7,.1,1) calc(var(--d) * 1s); }
.has-motion .ld-footer__house.is-drawn line, .has-motion .ld-footer__house.is-drawn path { stroke-dashoffset: 0; }
.has-motion .ld-footer__house.is-drawn rect { transform: none; }
.ld-footer__top { row-gap: var(--ld-s-6); padding-block: var(--ld-section-tight) var(--ld-s-8); }
.ld-footer__intro { grid-column: 1 / -1; display: grid; gap: var(--ld-s-2); align-content: start; }
.ld-footer__col { grid-column: span 2; }
.ld-footer__col h2 { margin-bottom: var(--ld-s-2); color: var(--text-3); }
.ld-footer__col ul { display: grid; gap: 10px; }
.ld-footer__col a { font-size: var(--ld-t-14); color: var(--text-2); transition: color var(--ld-dur-fast) var(--ld-ease-productive); }
.ld-footer__col a:hover { color: var(--text); }
/* The wordmark, full width, in the rubbed gold. */
.ld-footer__mark { aspect-ratio: 427.16 / 74.95; background: var(--ld-gold-worn); opacity: .42; -webkit-mask: url("../brand/lexdino-wordmark.svg") center / contain no-repeat; mask: url("../brand/lexdino-wordmark.svg") center / contain no-repeat; }
.ld-footer__legal { display: flex; flex-wrap: wrap; gap: var(--ld-s-2) var(--ld-s-4); justify-content: space-between; padding-block: var(--ld-s-3) var(--ld-s-4); border-top: 1px solid var(--rule-soft); font-size: var(--ld-t-12); color: var(--text-3); }
.ld-footer__legal nav { display: flex; gap: var(--ld-s-3); }
.ld-footer__legal a { display: inline-block; padding-block: 6px; }
.ld-footer__legal a:hover { color: var(--text); }
@media (min-width: 1056px) { .ld-footer__intro { grid-column: span 4; } .ld-footer__col { grid-column: span 3; } .ld-footer__col:first-of-type { grid-column: 5 / span 3; } }
/* Glyph ornaments keep to the very head and foot of the spine, clear of the volume number. */
.ld-book:is(.ld-orn--lozenge, .ld-orn--stars, .ld-orn--leaf)::before { top: calc(8px * var(--s)); }
.ld-book:is(.ld-orn--lozenge, .ld-orn--stars, .ld-orn--leaf)::after { bottom: calc(5px * var(--s)); }
.ld-book:is(.ld-orn--lozenge, .ld-orn--stars, .ld-orn--leaf) { padding-bottom: calc(34px * var(--s)); }

/* ---- 30-surfaces.css ---- */
/* Surfaces: the product itself, shown as it is used — dark panels with a gradient edge, on any ground. */

.ld-surface {
  position: relative; container-type: inline-size;
  --ground: #1B1F21; --ground-2: #202527; --text: var(--ld-paper); --text-2: var(--ld-paper-75); --text-3: var(--ld-paper-60);
  --rule-soft: #2B3032; --rule: #3A4042; --rule-strong: #6B6C6A; --accent: var(--ld-copper-light); --accent-text: var(--ld-copper-light);
  --link: var(--ld-paper);
  background: #1B1F21; color: var(--text);
  border: 1px solid #33393B;
  box-shadow: 0 40px 80px -40px rgba(0,0,0,.6);
  font-size: var(--ld-t-14); line-height: var(--ld-l-14);
}
.ld-surface__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--ld-s-2); padding: 12px var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); }
.ld-surface__bar .ld-label { color: var(--text); }
.ld-surface__head { display: grid; gap: 6px; padding: var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); }
.ld-surface__title { font-family: var(--ld-font-serif); font-size: clamp(1.25rem, 5cqi, 1.625rem); line-height: 1.25; letter-spacing: -0.01em; }

/* ---------- Console: steps, then the result. Only the working step shows the loader. ---------- */
.ld-steps { display: grid; padding: 10px var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); }
.ld-step { display: grid; grid-template-columns: 22px 1fr auto; gap: 12px; align-items: center; padding: 7px 0; color: var(--text-3); transition: color var(--ld-dur-moderate) var(--ld-ease-productive); }
.ld-step__mark { display: grid; place-items: center; width: 22px; height: 22px; }
.ld-step__mark::before { content: ""; width: 6px; height: 6px; border-radius: 1px; border: 1px solid var(--rule-strong); }
.ld-step.is-active { color: var(--text); }
.ld-step.is-active .ld-step__mark::before { display: none; }
.ld-step.is-active .ld-step__mark { color: var(--ld-copper-light); }
.ld-step.is-done { color: var(--text-2); }
.ld-step.is-done .ld-step__mark::before { border: 0; background: var(--ld-paper-90); }
.ld-step__state { font-family: var(--ld-font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
.ld-step.is-done .ld-step__state { color: var(--text-2); }
.ld-result { opacity: 0; transform: translateY(8px); transition: opacity var(--ld-dur-reveal) var(--ld-ease-enter), transform var(--ld-dur-reveal) var(--ld-ease-enter); }
.is-done > .ld-result, .ld-surface.is-done .ld-result { opacity: 1; transform: none; }
.ld-answer { display: grid; gap: var(--ld-s-2); padding: var(--ld-s-3); }
.ld-answer p { font-family: var(--ld-font-serif); font-size: var(--ld-t-18); line-height: 1.6; color: var(--text); }
/* Citations: footnote numerals, as a court or a law review sets them. */
.ld-cite { font-family: var(--ld-font-sans); font-size: 0.68em; font-weight: 600; line-height: 0; vertical-align: super; margin-left: 1px; color: var(--ld-copper-light); }
.ld-source__n { font-family: var(--ld-font-mono); font-size: var(--ld-t-12); color: var(--text-3); padding-top: 2px; grid-row: span 2; }
.ld-sources { display: grid; border-top: 1px solid var(--rule-soft); }
.ld-source { display: grid; grid-template-columns: 26px 1fr; gap: 2px 10px; padding: 10px 0; border-bottom: 1px solid var(--rule-soft); }
.ld-source b { font-weight: 500; }
.ld-source span:last-child { color: var(--text-3); font-family: var(--ld-font-mono); font-size: var(--ld-t-12); }

/* ---------- Screening result: one cell per kind of list, with a wash when it flags ---------- */
.ld-risk { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@container (min-width: 520px) { .ld-risk { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ld-risk__cell { display: grid; gap: 6px; padding: var(--ld-s-2) var(--ld-s-3); border-right: 1px solid var(--rule-soft); border-bottom: 1px solid var(--rule-soft); }
.ld-risk__cell span { font-size: var(--ld-t-12); color: var(--text-3); }
.ld-risk__cell b { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; font-size: var(--ld-t-14); }
.ld-risk__cell b::before { content: ""; width: 6px; height: 6px; border-radius: 1px; flex: none; background: var(--dot, var(--ld-paper-90)); }
.ld-risk__cell--flag { background: rgba(211,142,104,.07); }
.ld-risk__cell--flag b { --dot: var(--ld-copper-light); }
.ld-risk__cell--none b { --dot: #6B6C6A; color: var(--text-2); }

/* ---------- Record: a decision with its source ---------- */
.ld-record__rows { display: grid; padding: 0 var(--ld-s-3); }
.ld-record__row { display: grid; grid-template-columns: 110px 1fr; gap: var(--ld-s-2); padding: 10px 0; border-bottom: 1px solid var(--rule-soft); }
.ld-record__row dt { color: var(--text-3); }
.ld-record__row dd { min-width: 0; overflow-wrap: anywhere; }
@container (max-width: 380px) { .ld-record__row { grid-template-columns: 1fr; gap: 2px; } }
.ld-record__source { display: flex; align-items: center; gap: 10px; padding: 14px var(--ld-s-3); color: var(--text-2); }
.ld-record__source::before { content: ""; width: 14px; height: 14px; flex: none; background: currentColor; -webkit-mask: url("../brand/lexdino-o.svg") center / contain no-repeat; mask: url("../brand/lexdino-o.svg") center / contain no-repeat; }

/* ---------- Docket ---------- */
.ld-events { display: grid; padding: var(--ld-s-3); }
.ld-event { position: relative; display: grid; grid-template-columns: 96px 1fr; gap: var(--ld-s-2); padding-bottom: var(--ld-s-3); }
.ld-event::before { content: ""; position: absolute; left: 103px; top: 8px; bottom: -6px; width: 1px; background: var(--rule); }
.ld-event:last-child::before { display: none; }
.ld-event__date { color: var(--text-3); }
.ld-event__body { position: relative; padding-left: var(--ld-s-3); display: grid; gap: 2px; }
.ld-event__body::before { content: ""; position: absolute; left: -11px; top: 5px; width: 7px; height: 7px; border-radius: 1px; background: #1B1F21; border: 1px solid var(--rule-strong); }
.ld-event--now .ld-event__body::before { background: var(--ld-copper-light); border-color: var(--ld-copper-light); }
.ld-event--next { color: var(--text-3); }

/* ---------- Report table ---------- */
.ld-table { width: 100%; border-collapse: collapse; }
.ld-table th { text-align: left; font-weight: 400; font-size: var(--ld-t-12); color: var(--text-3); padding: 10px var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); }
.ld-table td { padding: 12px var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); vertical-align: top; }
@container (max-width: 600px) { .ld-table .ld-hide-s { display: none; } }
@container (max-width: 440px) { .ld-table th, .ld-table td { padding-inline: 12px; } .ld-table td:first-child { font-size: var(--ld-t-12); } }

/* ---------- Code ---------- */
.ld-code pre { margin: 0; padding: var(--ld-s-3); overflow-x: auto; font-family: var(--ld-font-mono); font-size: 13px; line-height: 1.7; color: var(--ld-paper-90); }
.ld-code .k { color: var(--ld-petrol-light); } .ld-code .s { color: var(--ld-gold-light); } .ld-code .m { color: var(--ld-copper-light); }
.ld-stack-gap { display: grid; gap: var(--ld-gutter); }

/* ---------- Versions: one provision, stacked as it changed ---------- */
/* The three versions share one cell, each a step down and to the right of the one before. */
.ld-versions { display: grid; padding: 0 8% 64px 0; }
.ld-version { grid-area: 1 / 1; position: relative; display: grid; gap: 9px; align-content: start; padding: var(--ld-s-3); }
.ld-version:nth-child(1) { opacity: .55; }
.ld-version:nth-child(2) { transform: translate(4%, 32px); opacity: .8; }
.ld-version:nth-child(3) { transform: translate(8%, 64px); }
.ld-versions figcaption { grid-area: 2 / 1; margin-top: calc(var(--ld-s-3) + 64px) !important; }
.ld-version .ld-mono { color: var(--text-3); margin-bottom: 4px; }
.ld-version i { display: block; height: 2px; background: #3A4042; }
.ld-version i:nth-of-type(2n) { width: 86%; } .ld-version i:nth-of-type(3n) { width: 62%; }
.ld-version i.is-changed { background: var(--ld-copper-light); height: 3px; }

/* ---- 31-coverage.css ---- */
/* Coverage: the catalogue and its drawers, the tribunals index, the court levels. */

.ld-catalog { display: grid; gap: var(--ld-s-6); }
.ld-catalog__region { display: grid; gap: var(--ld-s-2); }
.ld-catalog__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--ld-s-2); padding-bottom: var(--ld-s-1); border-bottom: 1px solid var(--rule); }
.ld-catalog__head h3 { color: var(--text); }
.ld-catalog__tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); border-top: 1px solid var(--rule-soft); border-left: 1px solid var(--rule-soft); }
.ld-tile { position: relative; display: flex; flex-direction: column; gap: 6px; min-height: 108px; padding: 14px; text-align: left; background: transparent; color: var(--text); border: 0; border-right: 1px solid var(--rule-soft); border-bottom: 1px solid var(--rule-soft); transition: background-color var(--ld-dur-moderate) var(--ld-ease-productive); }
.ld-tile::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--ld-copper-light); transform: scaleX(0); transform-origin: left; transition: transform var(--ld-dur-slow) var(--ld-ease-expressive); }
.ld-tile:hover, .ld-tile[aria-expanded="true"] { background: rgba(255,252,245,.035); }
.ld-tile[aria-expanded="true"] { background: rgba(211,142,104,.07); }
.ld-tile:hover::before, .ld-tile[aria-expanded="true"]::before { transform: scaleX(1); }
/* A tile leads with the name; the code and what the record holds sit quietly at its foot. */
.ld-tile__name { font-family: var(--ld-font-serif); font-size: var(--ld-t-18); line-height: 1.2; color: var(--text); }
.ld-tile__match { font-size: var(--ld-t-12); line-height: 1.35; color: var(--accent-text); }
.ld-tile__match:empty { display: none; }
.ld-tile__meta { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: auto; }
.ld-tile__code { font-family: var(--ld-font-mono); font-size: 11px; letter-spacing: .08em; color: var(--text-3); }
.ld-tile__kinds, .ld-tile__since { font-size: 11px; line-height: 1.3; color: var(--text-2); text-align: right; }
.ld-tile__since { font-family: var(--ld-font-mono); color: var(--accent-text); }
.ld-catalog__region--wide .ld-catalog__tiles { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
@media (min-width: 1056px) {
  .ld-catalog__region { grid-template-columns: 4fr 12fr; column-gap: var(--ld-gutter); align-items: start; }
  .ld-catalog__head { flex-direction: column; border-bottom: 0; border-top: 1px solid var(--rule); padding: var(--ld-s-2) 0 0; }
}
.ld-drawer { position: relative; display: grid; gap: var(--ld-s-3); margin-top: -1px; padding: var(--ld-s-3); background: rgba(255,252,245,.03); border: 1px solid var(--rule-soft); animation: ld-drawer var(--ld-dur-slow) var(--ld-ease-enter); }
.ld-drawer::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 2px; background: var(--ld-copper-light); }
.ld-drawer[hidden] { display: none; }
@keyframes ld-drawer { from { opacity: 0; transform: translateY(-6px); } }
.ld-drawer__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px var(--ld-s-3); }
.ld-drawer__title { font-family: var(--ld-font-serif); font-size: var(--ld-t-32); line-height: 1.1; letter-spacing: -0.015em; }
.ld-drawer__meta { display: flex; flex-wrap: wrap; gap: 8px 20px; color: var(--text-2); font-size: var(--ld-t-14); }
.ld-drawer__meta b { font-weight: 500; color: var(--text); }
.ld-drawer__cols { display: grid; gap: var(--ld-s-3); }
@media (min-width: 672px) { .ld-drawer__cols { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } }
.ld-drawer__courts { display: grid; gap: var(--ld-s-2); align-content: start; }
.ld-drawer__group { display: grid; gap: 4px; padding-bottom: var(--ld-s-2); border-bottom: 1px solid var(--rule-soft); }
@media (min-width: 672px) { .ld-drawer__group { grid-template-columns: 140px minmax(0, 1fr); gap: var(--ld-s-2); } }
.ld-drawer__group dt { font-family: var(--ld-font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); padding-top: 4px; }
.ld-drawer__group dd { font-size: var(--ld-t-14); line-height: 1.6; }
.ld-drawer__group dd span + span::before { content: " · "; color: var(--text-3); }
.ld-drawer__side { display: grid; gap: var(--ld-s-3); align-content: start; }
.ld-close { display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; margin: -8px -10px 0 0; border: 0; background: none; color: var(--text-2); font-size: var(--ld-t-14); }
.ld-close svg { width: 17px; height: 14px; }
.ld-close:hover { color: var(--text); }

/* ---------- Tribunals ---------- */
.ld-tribunals { border-top: 1px solid var(--rule); }
.ld-tribunal { border-bottom: 1px solid var(--rule-soft); }
.ld-tribunal summary { list-style: none; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--ld-s-2); padding-block: var(--ld-s-3); cursor: pointer; }
.ld-tribunal summary::-webkit-details-marker { display: none; }
.ld-tribunal summary .ld-h4 { font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.875rem); transition: color var(--ld-dur-fast) var(--ld-ease-productive); }
.ld-tribunal summary:hover .ld-h4 { color: var(--accent-text); }
.ld-tribunal summary .ld-caret { width: 12px; height: 10px; }
.ld-tribunal__list { columns: 1; column-gap: var(--ld-gutter); padding-bottom: var(--ld-s-4); }
@media (min-width: 672px) { .ld-tribunal__list { columns: 2; } }
@media (min-width: 1056px) { .ld-tribunal__list { columns: 3; } }
.ld-tribunal__list li { break-inside: avoid; display: flex; justify-content: space-between; gap: var(--ld-s-2); padding: 7px 0; border-bottom: 1px dashed var(--rule-soft); font-size: var(--ld-t-14); line-height: 1.4; }
.ld-tribunal__list li span:last-child { font-family: var(--ld-font-mono); font-size: 11px; color: var(--text-3); padding-top: 2px; }

/* ---------- Every level: the courts in the record, by where they sit ---------- */
.ld-levels { border-top: 1px solid var(--rule); }
.ld-level { display: grid; gap: var(--ld-s-2); padding-block: var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); }
.ld-level__name { display: flex; align-items: baseline; gap: var(--ld-s-2); }
.ld-level__name .ld-h4 { font-size: var(--ld-t-24); }
.ld-level__courts { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: var(--ld-t-14); line-height: 1.45; }
.ld-level__courts li { display: inline-flex; gap: 6px; }
@media (min-width: 1056px) { .ld-level { grid-template-columns: 5fr 11fr; align-items: baseline; gap: var(--ld-gutter); } }

/* ---------- The coverage search ---------- */
.ld-covsearch { display: grid; gap: 10px; max-width: 720px; margin-top: var(--ld-s-2); }
.ld-covsearch__input { font-size: var(--ld-t-18); min-height: 56px; }
.ld-covsearch__jump { display: flex; flex-wrap: wrap; gap: 4px 20px; margin-top: 6px; font-size: var(--ld-t-14); }
.ld-covsearch__jump a { color: var(--text-2); padding-block: 6px; text-decoration: underline; text-decoration-color: var(--rule-strong); text-underline-offset: .25em; }
.ld-covsearch__jump a:hover { color: var(--text); text-decoration-color: currentColor; }

/* ---- 32-lists.css ---- */
/* Lists: the product index, pillars, type tiles, the ledger, the deployment table. */

/* ---------- Product index: every product on a ruled line; light passes along it on hover ---------- */
.ld-index { border-top: 1px solid var(--rule); }
.ld-index__row { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px var(--ld-s-3); align-items: center; padding-block: var(--ld-s-3); border-bottom: 1px solid var(--rule-soft); }
.ld-index__row::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform var(--ld-dur-reveal) var(--ld-ease-expressive); }
.ld-index__row:hover::after { transform: scaleX(1); }
.ld-index__name { font-family: var(--ld-font-serif); font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.75rem); line-height: 1.05; letter-spacing: -0.022em; transition: color var(--ld-dur-moderate) var(--ld-ease-productive); }
.ld-index__row:hover .ld-index__name { color: var(--accent-text); }
.ld-index__desc { grid-column: 1 / -1; color: var(--text-2); font-size: var(--ld-t-16); line-height: var(--ld-l-16); max-width: 56ch; }
/* The arrow follows the product name and shows only on the row being pointed at or focused. */
.ld-index__name .ld-arrow { margin-left: .12em; opacity: 0; transform: translateX(-6px); }
.ld-index__row:hover .ld-arrow, .ld-index__row:focus-visible .ld-arrow { opacity: 1; transform: none; color: var(--accent-text); }
@media (min-width: 1056px) {
  .ld-index__row { grid-template-columns: 5fr 7fr; padding-block: var(--ld-s-4); }
  .ld-index__desc { grid-column: 2; }
}

/* ---------- Pillars ---------- */
.ld-pillars { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--rule); }
.ld-pillar { container-type: inline-size; display: flex; flex-direction: column; gap: var(--ld-s-2); padding: var(--ld-s-4) 0 var(--ld-s-6); border-bottom: 1px solid var(--rule-soft); }
.ld-pillar .ld-textlink { margin-top: auto; align-self: flex-start; }
@media (min-width: 1056px) {
  .ld-pillars { grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); }
  .ld-pillar { padding: var(--ld-s-4) var(--ld-s-4) var(--ld-s-8); border-bottom: 0; border-left: 1px solid var(--rule-soft); }
  .ld-pillar:first-child { border-left: 0; padding-left: 0; }
}

/* ---------- Type tiles ---------- */
.ld-types { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--rule-soft); border-left: 1px solid var(--rule-soft); }
@media (min-width: 672px) { .ld-types { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1056px) { .ld-types { grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); } }
.ld-type { position: relative; display: grid; gap: var(--ld-s-1); align-content: start; padding: var(--ld-s-3); min-height: 190px; border-right: 1px solid var(--rule-soft); border-bottom: 1px solid var(--rule-soft); transition: background-color var(--ld-dur-moderate) var(--ld-ease-productive); }
.ld-type:hover { background: var(--ground-2); }
.ld-type .ld-label { color: var(--accent-text); margin-bottom: 4px; }
.ld-type h3 { font-family: var(--ld-font-serif); font-weight: 400; font-size: var(--ld-t-24); line-height: 1.2; letter-spacing: -0.01em; }
.ld-type p { color: var(--text-2); font-size: var(--ld-t-14); line-height: 1.55; }

/* ---------- Ledger ---------- */
.ld-ledger { border-top: 1px solid var(--rule); }
.ld-ledger__row { display: grid; gap: 4px; padding: var(--ld-s-2) 0; border-bottom: 1px solid var(--rule-soft); }
.ld-ledger__row dt { font-weight: 500; }
.ld-ledger__row dd { color: var(--text-2); }
@media (min-width: 672px) { .ld-ledger__row { grid-template-columns: 5fr 7fr; gap: var(--ld-gutter); } }

/* ---------- Deployment table ---------- */
.ld-scroll { overflow-x: auto; }
.ld-deploy { width: 100%; min-width: 640px; border-collapse: collapse; font-size: var(--ld-t-14); line-height: 1.5; }
.ld-deploy th, .ld-deploy td { text-align: left; vertical-align: top; padding: 14px var(--ld-s-2) 14px 0; border-bottom: 1px solid var(--rule-soft); }
.ld-deploy thead th { font-family: var(--ld-font-serif); font-weight: 400; font-size: var(--ld-t-20); border-bottom: 1px solid var(--rule); }
.ld-deploy tbody th { font-weight: 500; color: var(--text-2); width: 22%; }
.ld-deploy .is-featured { background: rgba(211,142,104,.07); padding-left: var(--ld-s-2); }

/* ---------- Documents: legal pages and policies ---------- */
.ld-doc__toc { grid-column: 1 / -1; display: grid; gap: var(--ld-s-2); align-content: start; margin-bottom: var(--ld-s-6); }
.ld-doc__toc ol { display: grid; border-top: 1px solid var(--rule); }
.ld-doc__toc a { display: flex; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--rule-soft); font-size: var(--ld-t-14); color: var(--text-2); }
.ld-doc__toc a:hover { color: var(--text); }
.ld-doc__toc .ld-mono { color: var(--accent-text); padding-top: 2px; }
.ld-doc { grid-column: 1 / -1; max-width: 68ch; font-size: var(--ld-t-18); line-height: 1.7; color: var(--text-2); }
.ld-doc h2 { display: flex; align-items: baseline; gap: 14px; margin: var(--ld-s-8) 0 var(--ld-s-2); padding-top: var(--ld-s-2); border-top: 1px solid var(--rule); font-family: var(--ld-font-serif); font-weight: 400; font-size: var(--ld-t-32); line-height: 1.15; letter-spacing: -0.015em; color: var(--text); }
.ld-doc h2:first-child { margin-top: 0; }
.ld-doc__n { font-size: var(--ld-t-12); color: var(--accent-text); }
.ld-doc h3 { margin: var(--ld-s-4) 0 var(--ld-s-1); font-size: var(--ld-t-18); font-weight: 500; color: var(--text); }
.ld-doc p + p, .ld-doc p + ul, .ld-doc ul + p, .ld-doc table + p { margin-top: var(--ld-s-2); }
.ld-doc ul { display: grid; gap: 8px; margin-top: var(--ld-s-2); }
.ld-doc ul li { position: relative; padding-left: 20px; }
.ld-doc ul li::before { content: ""; position: absolute; left: 2px; top: .72em; width: 6px; height: 1px; background: var(--accent-text); }
.ld-doc b { font-weight: 500; color: var(--text); }
.ld-doc a { color: var(--link); text-decoration: underline; text-underline-offset: .2em; }
.ld-doc table { width: 100%; margin-top: var(--ld-s-3); border-collapse: collapse; font-size: var(--ld-t-14); line-height: 1.5; }
.ld-doc th, .ld-doc td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--rule-soft); }
.ld-doc th { font-weight: 500; color: var(--text); border-bottom-color: var(--rule); }
.ld-doc .ld-btn { margin-top: var(--ld-s-3); }
@media (min-width: 1056px) {
  .ld-doc__toc { grid-column: 1 / span 4; position: sticky; top: calc(var(--ld-bar-h) + var(--ld-s-4)); margin-bottom: 0; }
  .ld-doc { grid-column: 6 / span 10; }
}

/* ---- 40-forms.css ---- */
/* Forms: fields, choices and the contact form. */

/* Forms, in the site's own language: the label is a mono caption, the field is one hairline that turns copper
   when it holds focus, and a choice is a D — open when off, filled when on. No boxes. */
.ld-form { display: grid; gap: var(--ld-s-4); }
.ld-form__row { display: grid; gap: var(--ld-s-4); }
@media (min-width: 672px) { .ld-form__row { grid-template-columns: 1fr 1fr; column-gap: var(--ld-s-4); } }
.ld-field { position: relative; display: grid; gap: 6px; align-content: start; }
.ld-field__label { font-family: var(--ld-font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--text-2); }
.ld-field__label em { font-style: normal; font-weight: 400; letter-spacing: .06em; text-transform: none; color: var(--text-3); margin-left: 4px; }
.ld-field__error { font-size: var(--ld-t-12); color: var(--ld-copper-light); min-height: 0; }
.ld-input {
  width: 100%; min-height: 48px; padding: 6px 0 10px; background: transparent; color: var(--text);
  border: 0; border-bottom: 1px solid var(--rule-strong); border-radius: 0;
  font-family: var(--ld-font-sans); font-size: var(--ld-t-18); line-height: 1.4;
  transition: border-color var(--ld-dur-fast) var(--ld-ease-productive), box-shadow var(--ld-dur-moderate) var(--ld-ease-productive);
}
.ld-input::placeholder { color: var(--text-3); }
.ld-input:hover { border-bottom-color: var(--text-2); }
.ld-input:focus-visible { outline: none; border-bottom-color: var(--focus); box-shadow: 0 1px 0 0 var(--focus); }
.ld-input[aria-invalid="true"] { border-bottom-color: var(--ld-copper-light); }
textarea.ld-input { min-height: 120px; resize: vertical; font-family: var(--ld-font-sans); font-size: var(--ld-t-18); line-height: 1.55; padding-top: 10px; }
select.ld-input { appearance: none; cursor: pointer; padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='431.5 190.2 189.3 99'%3E%3Cpath fill='%23A2A29E' d='M431.5 190.2H470.7L525.8 248.2L582.0 190.2H620.8L525.8 289.2Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 4px center; background-size: 12px 7px; }
select.ld-input option { color: var(--ld-ink); font-family: var(--ld-font-sans); font-size: 16px; }

/* Interests: a line of words, each ticked with the i's square when chosen — words, not buttons. */
.ld-choices { display: flex; flex-wrap: wrap; gap: 4px 26px; border: 0; padding: 0; margin: 0; }
.ld-choices legend { margin-bottom: 12px; padding: 0; }
.ld-choice { position: relative; }
.ld-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ld-choice span { display: inline-flex; align-items: center; gap: 10px; min-height: 36px; font-size: var(--ld-t-18); color: var(--text-2); transition: color var(--ld-dur-fast); }
.ld-choice span::before { content: ""; width: 7px; height: 7px; border-radius: 1px; box-shadow: inset 0 0 0 1px var(--rule-strong); transition: background-color var(--ld-dur-fast), box-shadow var(--ld-dur-fast); }
.ld-choice input:hover + span { color: var(--text); }
.ld-choice input:checked + span { color: var(--text); }
.ld-choice input:checked + span::before { background: var(--ld-copper-light); box-shadow: none; }
.ld-choice input:focus-visible + span { outline: var(--ld-focus-w) solid var(--focus); outline-offset: 3px; }

/* The listbox: the field's hairline opens into a ruled, numbered list. */
.ld-pick { position: relative; }
.ld-pick__button { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; padding: 6px 2px 10px 0; background: none; border: 0; border-bottom: 1px solid var(--rule-strong); color: var(--text-3); font-family: var(--ld-font-sans); font-size: var(--ld-t-18); text-align: left; cursor: pointer; transition: border-color var(--ld-dur-fast), box-shadow var(--ld-dur-moderate); }
.ld-pick.has-value .ld-pick__button { color: var(--text); }
.ld-pick__button:hover { border-bottom-color: var(--text-2); }
.ld-pick__button:focus-visible, .ld-pick.is-open .ld-pick__button { outline: none; border-bottom-color: var(--focus); box-shadow: 0 1px 0 0 var(--focus); }
.ld-pick__button .ld-caret { width: 10px; height: 6px; }
.ld-pick__list { position: absolute; left: 0; right: 0; top: 100%; z-index: 5; margin: 0; padding: 6px 0; list-style: none; background: #15181A; border: 1px solid #33393B; border-top: 0; box-shadow: 0 30px 60px -20px rgba(0,0,0,.6); max-height: 320px; overflow: auto; }
.ld-pick__list:focus { outline: none; }
.ld-pick__list[hidden] { display: none; }
.ld-pick__list li { display: flex; gap: 14px; align-items: baseline; padding: 11px 16px; font-size: var(--ld-t-16); color: var(--ld-paper-75); cursor: pointer; }
.ld-pick__list li .ld-mono { color: var(--ld-paper-60); font-size: 11px; }
.ld-pick__list li.is-active { background: rgba(255,252,245,.05); color: var(--ld-paper); }
.ld-pick__list li[aria-selected="true"] { color: var(--ld-copper-light); }
.ld-pick__list li[aria-selected="true"] .ld-mono { color: var(--ld-copper-light); }

.ld-form__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ld-s-2); padding-top: var(--ld-s-1); }
.ld-form__status { font-size: var(--ld-t-14); color: var(--text-2); }
.ld-form__status.is-error { color: var(--ld-copper-light); }
.ld-form__done { display: grid; gap: var(--ld-s-2); padding: var(--ld-s-4); border: 1px solid var(--rule-soft); background: rgba(255,252,245,.03); }
.ld-form__done[hidden] { display: none; }

/* ---------- The cookie panel: a card in the corner, never a wall ---------- */
.ld-cookies {
  position: fixed; left: var(--ld-margin); bottom: var(--ld-margin); z-index: 70; width: min(400px, calc(100vw - 2 * var(--ld-margin)));
  display: grid; gap: 14px; padding: 20px 20px 18px; background: #15181A; color: var(--ld-paper);
  --text: var(--ld-paper); --text-2: var(--ld-paper-75); --text-3: var(--ld-paper-60); --rule-strong: #6B6C6A; --focus: var(--ld-copper-light);
  --button-bg: var(--ld-paper); --button-text: var(--ld-ink); --button-bg-hover: #FFFFFF; --link: var(--ld-paper);
  border: 1px solid #33393B; border-top: 1px solid var(--ld-copper-light); box-shadow: 0 30px 60px -20px rgba(0,0,0,.55);
  opacity: 0; transform: translateY(16px); transition: opacity 320ms var(--ld-ease-productive), transform 420ms var(--ld-ease-lock);
}
.ld-cookies.is-in { opacity: 1; transform: none; }
.ld-cookies[hidden], .ld-cookies [hidden] { display: none !important; }
.ld-cookies__head .ld-label { color: var(--ld-paper-75); }
.ld-cookies__text { font-size: var(--ld-t-14); line-height: 1.55; color: var(--ld-paper-75); }
.ld-cookies__text a { color: var(--ld-paper); text-decoration: underline; text-underline-offset: .2em; }
.ld-cookies__prefs { display: grid; border-top: 1px solid var(--ld-ink-rule); }
.ld-cookies__prefs[hidden] { display: none; }
.ld-cookies__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--ld-ink-rule); cursor: pointer; }
.ld-cookies__row > span { display: grid; gap: 2px; font-size: var(--ld-t-14); }
.ld-cookies__row b { font-weight: 500; }
.ld-cookies__row > span span { font-size: var(--ld-t-12); line-height: 1.45; color: var(--ld-paper-75); }
/* The switch: a track in the site's hairline, the i's square dot as the knob. */
.ld-cookies__row input { appearance: none; flex: none; position: relative; width: 40px; height: 24px; margin: 0; border: 1px solid #6B6C6A; border-radius: 999px; background: transparent; cursor: pointer; transition: background-color var(--ld-dur-fast), border-color var(--ld-dur-fast); }
.ld-cookies__row input::before { content: ""; position: absolute; top: 50%; left: 5px; width: 10px; height: 10px; margin-top: -5px; border-radius: 2px; background: var(--ld-paper-75); transition: transform var(--ld-dur-moderate) var(--ld-ease-lock), background-color var(--ld-dur-fast); }
.ld-cookies__row input:checked { background: rgba(211,142,104,.18); border-color: var(--ld-copper-light); }
.ld-cookies__row input:checked::before { transform: translateX(15px); background: var(--ld-copper-light); }
.ld-cookies__row input:disabled { opacity: .7; cursor: default; }
.ld-cookies__row input:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.ld-cookies__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ld-cookies__actions .ld-btn { flex: 1 1 0; justify-content: center; }
.ld-cookies__reject { border-left-color: var(--ld-paper-75) !important; --btn-bd: var(--ld-paper-75); }
.ld-cookies__more { min-height: 40px; padding: 0 6px; border: 0; background: none; color: var(--ld-paper); font-size: var(--ld-t-14); text-decoration: underline; text-underline-offset: .25em; cursor: pointer; }
.ld-footer__cookie { padding: 6px 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.ld-footer__cookie:hover { color: var(--text); }
@media (prefers-reduced-motion: reduce) { .ld-cookies { transition: none; } }