@font-face{font-family:'Courier Prime';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/CourierPrime-400.woff2') format('woff2')}
@font-face{font-family:'Courier Prime';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/CourierPrime-700.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/IBMPlexMono-400.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/IBMPlexMono-600.woff2') format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/Archivo-500.woff2') format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/Archivo-600.woff2') format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/Archivo-700.woff2') format('woff2')}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/PublicSans-400.woff2') format('woff2')}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/PublicSans-500.woff2') format('woff2')}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/PublicSans-700.woff2') format('woff2')}
:root{
  /* Client First sizing. A layout picks which container size is in play by
     overriding --size--container-active; nothing else sets a width. */
  --size--container-large:100%;
  --size--container-small:48rem;
  --size--container-active:var(--size--container-large);
  --space--global-padding:2rem;
  --space--section-padding:0rem;

  --image--band:url('img/notebook.jpg');
  --color--background:#F2EBDC;
  --color--background-alt:#E4DAC4;
  --color--surface:#FAF5EA;
  --color--text:#102240;
  --color--text-alt:#2C3A50;
  --color--text-muted:#4E5765;
  --color--action:#17325C; --color--accent:#C9922C;
  --font--display:'Courier Prime'; --font--label:'Courier Prime'; --font--body:'Courier Prime'; --font--mono:'Courier Prime';
  --font-weight--display:400; --font-size--h1:clamp(46px,11.5vw,104px); --line-height--font-size--h1:.9; --letter-spacing--font-size--h1:-.01em;
  --radius--main:0; --radius--pill:0; --border-width--main:1.5px; --border-width--thick:3px; --border-width--marker:10px; --space--card:14px 16px; --space--gap:12px;
  --shadow--main:5px 5px 0 var(--color--text); --transform--press:translate(5px,5px); --color--scrim:rgba(242,235,220,.90);
  --color--brand-word:#F2EBDC;    /* REPORT on dark */
  --color--brand-mark:#D9A538;     /* LOG — the only yellow that carries a word */
  --color--brand-tld:#9AA6BC;     /* .org, stepped back */
  --color--brand-word-light:#102240; /* the same lockup on paper */
  --color--brand-mark-light:#A2731C;
  --color--brand-tld-light:#4E5765;      /* the action. Buttons, and the one rule under the masthead. */
  --color--alert:#B3202C;         /* serious. Status only. */
  --color--border:#BCB49F;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--color--background);color:var(--color--text);
  font-family:var(--font--body),system-ui,sans-serif;font-size:16px;line-height:1.5}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:12px;top:12px;z-index:10;background:var(--color--text);color:var(--color--background);padding:10px 14px}
a:focus-visible,button:focus-visible{outline:3px solid var(--color--text);outline-offset:2px;box-shadow:0 0 0 6px var(--color--background)}
.navbar_component a:focus-visible{outline-color:var(--color--background);box-shadow:0 0 0 6px var(--color--text)}

/* ---------- masthead: a broadside, not a .navbar_menu bar ---------- */
.navbar_wrapper{position:sticky;top:0;z-index:20}
.navbar_component{background:var(--color--background-deep);padding:9px 20px;display:flex;align-items:center;gap:12px}
.navbar_component svg{display:block;flex:0 0 auto}
.navbar_brand{font-family:var(--font--display);font-size:clamp(14px,4.3vw,21px);letter-spacing:.01em;
  text-decoration:none;white-space:nowrap}
.navbar_brand .brand_word{color:var(--color--brand-word)}
.navbar_brand .brand_mark{color:var(--color--brand-mark)}
.navbar_brand .brand_tld{color:var(--color--brand-tld);font-size:.62em;letter-spacing:.06em}
.brand_lockup{font-family:var(--font--display);font-size:clamp(17px,4.6vw,24px);letter-spacing:.01em;
  display:block;text-align:center;margin:22px 0 0}
.brand_lockup .brand_word{color:var(--color--brand-word-light)}
.brand_lockup .brand_mark{color:var(--color--brand-mark-light)}
.brand_lockup .brand_tld{color:var(--color--brand-tld-light);font-size:.62em;letter-spacing:.06em}
.navbar_menu{margin-left:auto;display:flex;gap:20px;font-family:var(--font--label);font-weight:500;font-size:14px;letter-spacing:.09em;text-transform:uppercase}
.navbar_menu a{color:var(--color--brand-tld);text-decoration:none;padding:2px 0}
.navbar_menu a[aria-current="page"]{color:var(--color--brand-tld);font-weight:700;box-shadow:inset 0 -3px 0 var(--color--accent)}
.navbar_menu a:hover{color:var(--color--background)}
.navbar_rule{height:5px;background:var(--color--accent)}

/* ---------- the bill head ---------- */
.hero_component{text-align:center;padding:26px 18px 4px;background:var(--color--background)}
.hero_rule{border-top:3px solid var(--color--text);border-bottom:1px solid var(--color--text);height:5px;max-width:900px;margin:0 auto}
.hero_rule.is-flipped{border-top-width:1px;border-bottom-width:3px}
.text-style-eyebrow{font-family:var(--font--label);font-weight:500;font-size:clamp(12px,2.4vw,15px);letter-spacing:.28em;
  text-transform:uppercase;color:var(--color--text-muted);margin:11px 0}
.text-style-eyebrow.is-status{color:var(--color--brand-secondary);font-weight:600}

.hero_component h1{font-family:var(--font--display);font-weight:var(--font-weight--display);
  font-size:var(--font-size--h1);line-height:var(--line-height--font-size--h1);letter-spacing:var(--letter-spacing--font-size--h1);margin:8px 0 4px}
.hero_component h1 .heading_line{display:block}
.hero_component h1 .heading_line + .heading_line::before{content:""}
body[data-theme="mk1"] .hero_component h1 .heading_line + .heading_line::before,body[data-theme="mk2"] .hero_component h1 .heading_line + .heading_line::before,body[data-theme="plain"] .hero_component h1 .heading_line + .heading_line::before,body[data-theme="foundation"] .hero_component h1 .heading_line + .heading_line::before{content:" "}
.hero_component h1 .heading_line:last-child{color:var(--color--brand-primary)}
.text-size-large{font-size:19px;max-width:44ch;margin:16px auto 24px;color:var(--color--text-alt)}
.button-group{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;padding-bottom:26px}
.button{display:inline-block;background:var(--color--brand-secondary);color:var(--color--on-secondary);font-family:var(--font--label);
  font-weight:600;font-size:18px;letter-spacing:.1em;text-transform:uppercase;padding:15px 32px;
  text-decoration:none;border:var(--border-width--thick) solid var(--color--text);border-radius:var(--radius--pill);box-shadow:var(--shadow--main);
  transition:transform .08s ease,box-shadow .08s ease}
.button:active{transform:var(--transform--press);box-shadow:none}
.button.is-secondary{background:var(--color--background);color:var(--color--brand-secondary);box-shadow:none;border-width:2px}

/* ---------- the cut ---------- */

/* ---------- three promises, as a printed panel ---------- */
.promises_component{background:var(--color--background-deep);color:var(--color--text-on-deep);display:flex;flex-wrap:wrap;
  border-top:6px double var(--color--accent)}
.promises_item{flex:1 1 250px;padding:22px;border-right:1px solid rgba(239,230,214,.18)}
.promises_item:last-child{border-right:none}
.promises_component h2{font-family:var(--font--label);font-weight:600;font-size:17px;letter-spacing:.12em;text-transform:uppercase;
  margin:0 0 9px;color:#E9BC5A}
.promises_component p{margin:0;font-size:16.5px;line-height:1.55;color:var(--color--text-on-deep);max-width:38ch}

/* ---------- the log ---------- */
.log_component{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
.log_main{padding:22px 22px 30px;border-right:1px solid var(--color--border)}
.log_header{display:flex;align-items:center;gap:14px;margin:0 0 16px;
  border-bottom:3px solid var(--color--text);padding-bottom:8px}
.log_header h2{font-family:var(--font--display);font-weight:400;font-size:23px;margin:0}
.log_header .log_count{font-family:var(--font--mono);font-weight:700;font-size:13px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--color--text-muted);margin-left:auto}
.log_item{background:var(--color--surface);border:var(--border-width--main) solid var(--color--text);border-left-width:var(--border-width--marker);border-radius:var(--radius--main);padding:var(--space--card);margin-bottom:var(--space--gap)}
.log_item.is-serious{border-left-color:var(--color--status-serious)}
.log_item.is-confirmed{border-left-color:var(--color--status-confirmed)}
.log_item.is-unassessed{border-left-color:var(--color--border)}
.log_item .log_item-header{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:7px}
.log_item h3{font-family:var(--font--label);font-weight:600;font-size:19px;letter-spacing:.03em;margin:0;text-transform:uppercase}
/* A plain badge is a label. Red is reserved for is-serious, because on this
   product colour carries meaning and a badge that is red for decoration
   spends the one signal that has to mean something. */
.badge{font-family:var(--font--label);font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  padding:3px 9px;border-radius:var(--radius--pill);
  background:transparent;color:var(--color--brand-primary);box-shadow:inset 0 0 0 1.5px var(--color--brand-primary)}
.badge.is-serious{background:var(--color--status-serious);color:var(--color--on-serious);box-shadow:none}
.badge.is-confirmed{background:var(--color--status-confirmed);color:var(--color--background);box-shadow:none}
.badge.is-open{background:transparent;color:var(--color--status-open);box-shadow:inset 0 0 0 1.5px var(--color--text-muted)}
.log_item .log_item-time{margin-left:auto;font-family:var(--font--mono);font-size:12.5px;color:var(--color--text-muted)}
.log_item p{margin:0 0 8px;font-size:15.5px;max-width:62ch}
.log_item .log_item-note{font-family:var(--font--mono);font-size:12.5px;color:var(--color--text-muted)}
.log_more{color:inherit;display:inline-block;font-family:var(--font--label);font-weight:600;font-size:15px;letter-spacing:.12em;
  text-transform:uppercase;text-decoration:none;border-bottom:4px solid var(--color--brand-primary);padding-bottom:2px;margin-top:6px}

/* ---------- aside ---------- */
.log_sidebar{padding:22px 22px 30px;background:var(--color--background-alt)}
.log_sidebar h2{font-family:var(--font--label);font-weight:600;font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  margin:0 0 16px;color:var(--color--text-muted)}
.stat_item{display:flex;align-items:baseline;gap:12px;padding-bottom:9px;margin-bottom:12px;border-bottom:1px solid var(--color--border)}
.stat_item b{font-family:var(--font--mono);font-weight:700;font-size:32px;line-height:1}
.stat_item span{font-size:14.5px;color:var(--color--text-alt)}
.text-size-small{font-size:14.5px;color:var(--color--text-alt);margin:18px 0 22px;max-width:34ch}
.stamp_wrapper{display:flex;justify-content:center;color:var(--color--brand-primary)}



/* ---------- closing call, over the second halftone ---------- */
.cta_component{position:relative;border-top:4px solid var(--color--text);background:var(--color--background)}
.cta_component img{display:block;width:100%;height:auto}
.cta_component .cta_content{position:absolute;left:0;right:0;bottom:0;padding:22px;
  background:linear-gradient(transparent,var(--color--text) 62%);
  display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}
.cta_component h2{font-family:var(--font--display);font-weight:400;font-size:clamp(24px,4.2vw,40px);
  line-height:1.02;margin:0;color:var(--color--background);max-width:16ch}
.cta_component h2 em{font-style:normal;color:var(--color--background);text-decoration:underline;
  text-decoration-color:var(--color--accent);text-decoration-thickness:.085em;text-underline-offset:.14em}
.cta_component p{font-family:var(--font--label);font-weight:500;font-size:15px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--color--background);margin:0 0 4px}
.cta_component .button-group{margin-left:auto}
@media (max-width:700px){
  .cta_component .cta_content{position:static;background:var(--color--background-alt);padding:20px 16px 24px}
  .cta_component .button-group{margin-left:0;margin-top:16px}
}
/* ================= THEMES =================
   A theme owns type, borders, shadows, radii and spacing. It sets NO
   colour: every colour comes from the palette. Theme rules may only
   reference colour through tokens. */

/* ===== DOCKET ===== */
body[data-theme="docket"]{--font--display:'Courier Prime'; --font--label:'Courier Prime'; --font--body:'Courier Prime'; --font--mono:'Courier Prime';
  --font-weight--display:700; --font-size--h1:clamp(24px,4.4vw,42px); --line-height--font-size--h1:1.15; --letter-spacing--font-size--h1:.02em;
  --radius--main:0; --radius--pill:0; --border-width--main:1px; --border-width--thick:2px; --border-width--marker:0px; --space--card:14px 18px; --space--gap:0;
  --shadow--main:none; --transform--press:translate(1px,1px);
}
body[data-theme="docket"] .hero_component h1{text-transform:uppercase}
body[data-theme="docket"] .hero_component h1 .heading_line,body[data-theme="docket"] .hero_component h1 .heading_line:last-child{color:var(--color--text)}
body[data-theme="docket"] .hero_component .stars{display:none}
body[data-theme="docket"] .hero_component .text-style-eyebrow{color:var(--color--text-muted);letter-spacing:.2em}
body[data-theme="docket"] .hero_component .text-style-eyebrow.is-status{color:var(--color--brand-primary)}
body[data-theme="docket"] .button{background:var(--color--surface);color:var(--color--text);border:2px solid var(--color--text)}
body[data-theme="docket"] .promises_component{background:var(--color--background-deep)}
body[data-theme="docket"] .promises_component h2{color:var(--color--brand-secondary-on-deep);font-size:13.5px;letter-spacing:.18em}
body[data-theme="docket"] .promises_component p{color:var(--color--text-on-deep);font-size:15px}
body[data-theme="docket"] .log_main{counter-reset:ln;border-left:2px solid var(--color--border);margin-left:10px}
body[data-theme="docket"] .log_item{border:none;border-bottom:1px dotted var(--color--border);background:transparent;
  position:relative;padding-left:44px}
body[data-theme="docket"] .log_item::before{counter-increment:ln;content:counter(ln);position:absolute;
  left:0;top:16px;width:30px;text-align:right;color:var(--color--text-muted);font-size:13px}
body[data-theme="docket"] .log_item h3{text-transform:uppercase;letter-spacing:.06em;font-size:15px}
body[data-theme="docket"] .badge{background:transparent;color:var(--color--brand-primary);box-shadow:inset 0 0 0 1.5px var(--color--brand-primary);
  letter-spacing:.08em}
body[data-theme="docket"] .badge.is-confirmed{color:var(--color--text);box-shadow:inset 0 0 0 1.5px var(--color--text)}
body[data-theme="docket"] .badge.is-open{color:var(--color--status-open);box-shadow:inset 0 0 0 1px var(--color--text-muted)}
body[data-theme="docket"] .footer_component{background:var(--color--background-deep);color:var(--color--text-on-deep)}
body[data-theme="docket"] .footer_component h2{color:var(--color--brand-secondary-on-deep)}

/* ===== TERMINAL ===== */
body[data-theme="terminal"]{--font--display:'IBM Plex Mono'; --font--label:'IBM Plex Mono'; --font--body:'IBM Plex Mono'; --font--mono:'IBM Plex Mono';
  --font-weight--display:600; --font-size--h1:clamp(22px,3.6vw,40px); --line-height--font-size--h1:1.1; --letter-spacing--font-size--h1:.14em;
  --radius--main:0; --radius--pill:0; --border-width--main:1px; --border-width--thick:1px; --border-width--marker:4px; --space--card:9px 11px; --space--gap:6px;
  --shadow--main:none; --transform--press:translate(1px,1px);
}
body[data-theme="terminal"]{background:var(--color--background);
  background-image:repeating-linear-gradient(180deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px);
}
body[data-theme="terminal"] .hero_component,body[data-theme="terminal"] .log_component,
body[data-theme="terminal"] .cta_component{background:transparent;color:var(--color--text-alt)}
body[data-theme="terminal"] .hero_component h1 .heading_line{color:var(--color--brand-secondary)}
body[data-theme="terminal"] .hero_component h1 .heading_line:last-child{color:var(--color--brand-primary)}
body[data-theme="terminal"] .hero_component .hero_rule{border-color:var(--color--border)}
body[data-theme="terminal"] .hero_component .text-style-eyebrow{color:var(--color--text-muted)}
body[data-theme="terminal"] .hero_component .text-size-large,body[data-theme="terminal"] .text-size-small{color:var(--color--text-alt)}
body[data-theme="terminal"] .navbar_component{background:var(--color--background-deep);border-bottom:1px solid var(--color--border)}
body[data-theme="terminal"] .navbar_rule{background:var(--color--border);height:1px}
body[data-theme="terminal"] .promises_component{background:var(--color--surface);border-top:1px solid var(--color--border)}
body[data-theme="terminal"] .promises_component h2{color:var(--color--brand-secondary-on-deep);font-size:12.5px;letter-spacing:.2em}
body[data-theme="terminal"] .promises_component p{color:var(--color--text-alt);font-size:13.5px}
body[data-theme="terminal"] .log_item{border-style:dashed;color:var(--color--text-alt)}
body[data-theme="terminal"] .log_item h3{font-size:14px;letter-spacing:.1em;color:var(--color--brand-primary)}
body[data-theme="terminal"] .log_item p{font-size:13.5px}
body[data-theme="terminal"] .badge{font-size:10.5px}
body[data-theme="terminal"] .badge.is-serious{background:var(--color--status-serious);color:var(--color--on-serious)}
body[data-theme="terminal"] .badge.is-confirmed{background:var(--color--status-confirmed);color:var(--color--background)}
body[data-theme="terminal"] .badge.is-open{background:transparent;color:var(--color--status-open);box-shadow:inset 0 0 0 1px var(--color--border)}
body[data-theme="terminal"] .log_sidebar{background:var(--color--background-alt)}
body[data-theme="terminal"] .log_header{border-bottom:1px solid var(--color--border)}
body[data-theme="terminal"] .log_header h2{font-size:15px;letter-spacing:.16em;color:var(--color--brand-primary)}
body[data-theme="terminal"] .button{background:var(--color--brand-secondary);color:var(--color--on-secondary)}
body[data-theme="terminal"] .button.is-secondary{background:transparent;color:var(--color--brand-secondary);border-color:var(--color--brand-secondary)}
body[data-theme="terminal"] .footer_component{background:var(--color--surface);color:var(--color--text-alt)}
body[data-theme="terminal"] .footer_component h2{color:var(--color--brand-secondary-on-deep)}
body[data-theme="terminal"] .brand_lockup .brand_word{color:var(--color--brand-primary)}
body[data-theme="terminal"] .brand_lockup .brand_mark{color:var(--color--brand-secondary)}
body[data-theme="terminal"] .brand_lockup .brand_tld{color:var(--color--text-muted)}

/* ===== DECISIONDESK ===== */
body[data-theme="decisiondesk"]{--font--display:'Archivo'; --font--label:'Archivo'; --font--body:'Public Sans'; --font--mono:'IBM Plex Mono';
  --font-weight--display:700; --font-size--h1:clamp(30px,7vw,64px); --line-height--font-size--h1:1.0; --letter-spacing--font-size--h1:-.03em;
  --radius--main:4px; --radius--pill:3px; --border-width--main:1px; --border-width--thick:1px; --border-width--marker:6px; --space--card:15px 17px; --space--gap:9px;
  --shadow--main:none; --transform--press:translate(0,1px);
}
body[data-theme="decisiondesk"]{background:var(--color--background);
}
body[data-theme="decisiondesk"] .hero_component,body[data-theme="decisiondesk"] .log_component,
body[data-theme="decisiondesk"] .cta_component{background:var(--color--background);color:var(--color--text)}
body[data-theme="decisiondesk"] .navbar_component{background:var(--color--background-deep);border-bottom:1px solid var(--color--border)}
body[data-theme="decisiondesk"] .navbar_rule{background:var(--color--brand-secondary);height:3px}
body[data-theme="decisiondesk"] .hero_component h1 .heading_line{color:var(--color--text)}
body[data-theme="decisiondesk"] .hero_component h1 .heading_line:last-child{color:var(--color--brand-primary)}
body[data-theme="decisiondesk"] .hero_component .hero_rule{border-color:var(--color--border)}
body[data-theme="decisiondesk"] .hero_component .stars{display:none}
body[data-theme="decisiondesk"] .hero_component .text-style-eyebrow{color:var(--color--text-muted);font-family:var(--font--mono);font-size:12px}
body[data-theme="decisiondesk"] .hero_component .text-style-eyebrow.is-status{color:var(--color--brand-secondary)}
body[data-theme="decisiondesk"] .hero_component .text-size-large{color:var(--color--text-alt)}
body[data-theme="decisiondesk"] .button{background:var(--color--brand-secondary);color:var(--color--on-secondary);border-color:var(--color--brand-secondary);font-weight:700}
body[data-theme="decisiondesk"] .button.is-secondary{background:transparent;color:var(--color--text);border-color:var(--color--border)}
body[data-theme="decisiondesk"] .promises_component{background:var(--color--background-deep);border-top:3px solid var(--color--brand-secondary)}
body[data-theme="decisiondesk"] .promises_component h2{color:var(--color--brand-secondary-on-deep);font-size:13px;letter-spacing:.16em}
body[data-theme="decisiondesk"] .promises_component p{color:var(--color--text-on-deep);font-size:15px}
body[data-theme="decisiondesk"] .log_item{background:var(--color--surface);border-color:var(--color--border);color:var(--color--text)}
body[data-theme="decisiondesk"] .log_item h3{font-size:17px;letter-spacing:0;text-transform:none}
body[data-theme="decisiondesk"] .badge{font-family:var(--font--mono);font-size:11px}
body[data-theme="decisiondesk"] .badge.is-serious{background:var(--color--status-serious);color:var(--color--on-serious)}
body[data-theme="decisiondesk"] .badge.is-confirmed{background:var(--color--status-confirmed);color:var(--color--background)}
body[data-theme="decisiondesk"] .badge.is-open{background:transparent;color:var(--color--status-open);box-shadow:inset 0 0 0 1px var(--color--border)}
body[data-theme="decisiondesk"] .log_header{border-bottom-color:var(--color--border)}
body[data-theme="decisiondesk"] .log_sidebar{background:var(--color--background-alt)}
body[data-theme="decisiondesk"] .stat_item b{color:var(--color--brand-secondary);font-size:40px}
body[data-theme="decisiondesk"] .stat_item span,body[data-theme="decisiondesk"] .text-size-small{color:var(--color--text-alt)}
body[data-theme="decisiondesk"] .log_sidebar h2{color:var(--color--text-muted)}
body[data-theme="decisiondesk"] .footer_component{background:var(--color--background-deep);color:var(--color--text-on-deep)}
body[data-theme="decisiondesk"] .footer_component h2{color:var(--color--brand-secondary-on-deep)}
body[data-theme="decisiondesk"] .brand_lockup .brand_word{color:var(--color--text)}
body[data-theme="decisiondesk"] .brand_lockup .brand_mark{color:var(--color--brand-secondary)}
body[data-theme="decisiondesk"] .brand_lockup .brand_tld{color:var(--color--text-muted)}/* ---------- placeholder page adjustments ---------- */

/* the closing block has no photograph behind it unless one is dropped in */
.cta_component .cta_content{position:static;background:var(--color--background-alt);padding:22px}
body:not([data-image="none"]) .band_image{display:block}

@media (max-width:700px){
  
}

/* single column pages (Impressum, Datenschutz) */
main.is-single{grid-template-columns:1fr}
main.is-single .log_main{border-right:none;max-width:70ch;margin:0 auto;padding:26px 22px 36px}
main.is-single h3{font-family:var(--font--label);font-weight:600;font-size:17px;letter-spacing:.08em;
  text-transform:uppercase;margin:26px 0 8px}
main.is-single p{font-size:16px;max-width:66ch;margin:0 0 12px}
main.is-single ul{margin:0 0 14px;padding-left:20px;max-width:66ch}
main.is-single li{margin-bottom:6px}
main.is-single address{font-style:normal;font-family:var(--font--mono);font-size:15px;margin:0 0 12px}
main.is-single .text-style-label{font-family:var(--font--mono);font-weight:700;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--color--text-muted)}



@media print{.themer_dock{display:none}}

/* without a photograph the closing block is a surface, not a colour field */
body .cta_component .cta_content{position:static;background:var(--color--background-alt);padding:22px}
body .cta_component h2,body .cta_component p{color:var(--color--text)}
body .cta_component h2 em{color:var(--color--text)}
/* the open bubble inverts, which stays readable in every theme */
.themer_bubble[aria-expanded="true"]{background:var(--color--background);color:var(--color--text);border-color:var(--color--text)}

/* Docket's transcript line numbers are absolutely positioned and cannot
   survive the multi-column paper layout, so they step aside there. */
body[data-theme="docket"][data-layout="paper"] .log_item::before{content:none}
/* the mono faces are wide: the front door headline needs a lower ceiling */
/* ================= IMAGE OPTIONS =================
   One band, under the headline. Poster uses the same image behind the
   masthead, under a scrim. A custom image is set as an inline style by
   controls.js and lives only in the open tab. */
body[data-image="notebook"]{--image--band:url('img/notebook.jpg')}
body[data-image="desk"]{--image--band:url('img/desk.jpg')}
body[data-image="none"]{--image--band:none}
.band_image{display:block;width:100%;aspect-ratio:1600/300;
  background:var(--image--band) center/cover no-repeat;
  border-top:var(--border-width--thick) solid var(--color--text);border-bottom:var(--border-width--thick) solid var(--color--text)}
body[data-image="none"] .band_image{display:none}
body[data-image="none"][data-layout="poster"] .section_hero{background:var(--color--background)}
/* ================= CONTAINER =================
   Sheet holds the page in a medium container on a tinted ground. The width
   itself lives in --size--container-active; these rules only add the sheet's
   surface and its edges. */
:root{--size--container-medium:62.5rem}

body[data-container="sheet"]{--size--container-active:var(--size--container-medium);
  background:var(--color--background-alt)}
body[data-container="sheet"] .padding-global{--space--global-padding:0rem}
body[data-container="sheet"] .container-large{background:var(--color--surface);
  border-left:1px solid var(--color--border);border-right:1px solid var(--color--border)}
body[data-container="sheet"] .section_hero .container-large{margin-top:1.625rem;
  border-top:1px solid var(--color--border)}
body[data-container="sheet"] .section_footer .container-large{margin-bottom:2.125rem;
  border-bottom:1px solid var(--color--border)}
body[data-container="sheet"] .hero_component{padding-top:2.5rem;
  background:var(--color--surface)}
body[data-container="sheet"] .log_sidebar{background:transparent;
  border-left:1px solid var(--color--border)}
body[data-container="sheet"] .log_main{border-right:none}
body[data-container="sheet"] .cta_component{background:var(--color--surface)}
@media (max-width:66rem){
  body[data-container="sheet"] .container-large{border-left:none;border-right:none}
  body[data-container="sheet"] .section_hero .container-large{margin-top:0;border-top:none}
  body[data-container="sheet"] .section_footer .container-large{margin-bottom:0;border-bottom:none}
}
/* ---------- placeholder page adjustments ---------- */

/* the closing block has no photograph behind it unless one is dropped in */
.cta_component .cta_content{position:static;background:var(--color--background-alt);padding:22px}
body:not([data-image="none"]) .band_image{display:block}

@media (max-width:700px){
  
}

/* single column pages (Impressum, Datenschutz) */
main.is-single{grid-template-columns:1fr}
main.is-single .log_main{border-right:none;max-width:70ch;margin:0 auto;padding:26px 22px 36px}
main.is-single h3{font-family:var(--font--label);font-weight:600;font-size:17px;letter-spacing:.08em;
  text-transform:uppercase;margin:26px 0 8px}
main.is-single p{font-size:16px;max-width:66ch;margin:0 0 12px}
main.is-single ul{margin:0 0 14px;padding-left:20px;max-width:66ch}
main.is-single li{margin-bottom:6px}
main.is-single address{font-style:normal;font-family:var(--font--mono);font-size:15px;margin:0 0 12px}
main.is-single .text-style-label{font-family:var(--font--mono);font-weight:700;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--color--text-muted)}

/* ---------- the corner controls ---------- */
.themer_dock{position:fixed;right:18px;bottom:18px;z-index:60;
  display:flex;flex-direction:column-reverse;align-items:flex-end;gap:10px}
.themer_bubble-wrapper{position:relative}

.themer_bubble{width:52px;height:52px;border-radius:50%;cursor:pointer;
  background:var(--color--text);color:var(--color--background);border:2px solid var(--color--text);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font--label);font-weight:600;font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;line-height:1.05;text-align:center;padding:4px;
  box-shadow:0 2px 0 rgba(0,0,0,.28)}
.themer_bubble:hover{background:var(--color--action);border-color:var(--color--action)}
.themer_bubble[aria-expanded="true"]{background:var(--color--background);color:var(--color--text);border-color:var(--color--text)}

.themer_panel{position:fixed;right:80px;bottom:18px;left:auto;
  min-width:196px;max-width:min(21rem, calc(100vw - 104px));
  max-height:calc(100vh - 36px);max-height:calc(100dvh - 36px);
  overflow-y:auto;overscroll-behavior:contain;
  background:var(--color--surface);color:var(--color--text);
  border:var(--border-width--main) solid var(--color--text);
  padding:10px;box-shadow:0 4px 0 rgba(0,0,0,.22)}
.themer_panel.is-wide{min-width:19rem}
.themer_panel[hidden]{display:none}
.themer_panel .themer_panel-heading{font-family:var(--font--label);font-weight:600;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--color--text-muted);margin:0 0 8px}
.themer_panel button{display:block;width:100%;text-align:left;cursor:pointer;
  background:transparent;color:var(--color--text);border:1px solid transparent;
  font-family:var(--font--body);font-size:15px;padding:7px 9px}
.themer_panel button:hover{background:var(--color--background-alt)}
.themer_panel button[aria-pressed="true"]{border-color:var(--color--text);font-weight:600}
.themer_panel button[aria-pressed="true"]::after{content:" \2022";color:var(--color--brand-primary)}
.themer_panel .themer_note{font-size:13px;color:var(--color--text-muted);margin:0 2px 10px;line-height:1.45}

.themer_swatches{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.themer_swatches button{display:flex;align-items:center;gap:8px;font-size:14px;padding:6px 7px}
.themer_swatches button i{width:14px;height:14px;flex:0 0 auto;display:block;
  border:1px solid rgba(0,0,0,.25)}
.themer_swatches button[aria-pressed="true"]::after{margin-left:auto}

.themer_link-row{display:flex;gap:6px;margin-bottom:8px}
.themer_link-row input{flex:1 1 auto;min-width:0;font-family:var(--font--mono);font-size:12px;
  padding:8px;color:var(--color--text);background:var(--color--background);
  border:var(--border-width--main) solid var(--color--border)}
.themer_link-row button{width:auto;flex:0 0 auto;border-color:var(--color--text);
  font-family:var(--font--label);font-weight:600;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;padding:8px 12px}
.themer_panel button.is-reset{font-size:13px;color:var(--color--text-muted);padding:6px 0}

@media (max-width:600px){
  .themer_dock{right:12px;bottom:12px;gap:8px}
  .themer_bubble{width:46px;height:46px;font-size:9px}
  /* clear of the bubble column: the dock is five bubbles tall, so a panel
     that only cleared the bottom one still ran underneath the rest */
  .themer_panel{left:12px;right:70px;bottom:12px;min-width:0;max-width:none;
    max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
  .themer_panel.is-wide{min-width:0}
}

@media print{.themer_dock{display:none}}

/* without a photograph the closing block is a surface, not a colour field */
body .cta_component .cta_content{position:static;background:var(--color--background-alt);padding:22px}
body .cta_component h2,body .cta_component p{color:var(--color--text)}
body .cta_component h2 em{color:var(--color--text)}
/* the open bubble inverts, which stays readable in every theme */
.themer_bubble[aria-expanded="true"]{background:var(--color--background);color:var(--color--text);border-color:var(--color--text)}

/* Docket's transcript line numbers are absolutely positioned and cannot
   survive the multi-column paper layout, so they step aside there. */
body[data-theme="docket"][data-layout="paper"] .log_item::before{content:none}
/* the mono faces are wide: the front door headline needs a lower ceiling */


/* ================= IMAGE OPTIONS =================
   One band, under the headline. Poster uses the same image behind the
   masthead, under a scrim. A custom image is set as an inline style by
   controls.js and lives only in the open tab. */
body[data-image="notebook"]{--image--band:url('img/notebook.jpg')}
body[data-image="desk"]{--image--band:url('img/desk.jpg')}
body[data-image="none"]{--image--band:none}
.band_image{display:block;width:100%;aspect-ratio:1600/300;
  background:var(--image--band) center/cover no-repeat;
  border-top:var(--border-width--thick) solid var(--color--text);border-bottom:var(--border-width--thick) solid var(--color--text)}
body[data-image="none"] .band_image{display:none}
body[data-image="none"][data-layout="poster"] .section_hero{background:var(--color--background)}

/* ================= BODY ARRANGEMENT =================
   What the entry list and the side panel do. Shared by every layout that
   ends in the same word, which is why Wide board and Poster board are one
   rule set rather than two. */

/* ---- board: the entries as a wall ---- */
body[data-layout="board"] .log_component{grid-template-columns:1fr}
body[data-layout="board"] .log_main{border-right:none;border-bottom:1px solid var(--color--border)}
body[data-layout="board"] .log_list{display:grid;
  grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:14px;align-items:start}
body[data-layout="board"] .log_item{margin-bottom:0;border-left-width:var(--border-width--main);
  border-top-style:solid;border-top-width:6px}
body[data-layout="board"] .log_item.is-serious{border-top-color:var(--color--status-serious);order:1}
body[data-layout="board"] .log_item.is-confirmed{border-top-color:var(--color--status-confirmed);order:2}
body[data-layout="board"] .log_item.is-unassessed{border-top-color:var(--color--border);order:3}
body[data-layout="board"] .log_item p{max-width:none}
body[data-layout="board"] .log_sidebar{display:flex;flex-wrap:wrap;gap:10px 34px;align-items:baseline}
body[data-layout="board"] .log_sidebar h2{flex:1 0 100%}
body[data-layout="board"] .stat_item{border-bottom:none;padding-bottom:0;margin-bottom:0}
body[data-layout="board"] .text-size-small{flex:1 0 100%;margin:8px 0 0;max-width:70ch}
body[data-layout="board"] .stamp_wrapper{margin-left:auto}
body[data-layout="board"] .brand_lockup{display:none}

/* ---- paper: the printable edition ---- */
body[data-layout="paper"] .navbar_wrapper{position:static}
body[data-layout="paper"] .button-group,body[data-layout="paper"] .cta_component{display:none}
body[data-layout="paper"] .log_component{grid-template-columns:1fr;border-top:none}
body[data-layout="paper"] .log_main{border-right:none;padding:34px 46px 10px}
body[data-layout="paper"] .hero_component{padding:44px 46px 34px}
body[data-layout="paper"] .log_header{margin-bottom:20px}
body[data-layout="paper"] .log_list{column-count:2;column-gap:34px;counter-reset:pe}
body[data-layout="paper"] .log_item{break-inside:avoid;counter-increment:pe;background:transparent;
  border:none;border-bottom:1px solid var(--color--border);border-radius:0;box-shadow:none;
  padding:0 0 12px;margin-bottom:14px}
body[data-layout="paper"] .log_item h3::before{content:counter(pe) ". ";color:var(--color--text-muted)}
body[data-layout="paper"] .log_item p{max-width:none;font-size:14.5px}
body[data-layout="paper"] .log_sidebar{padding:6px 46px 40px;background:transparent;border-left:none;
  display:grid;grid-template-columns:repeat(3,auto) 1fr;gap:0 26px;align-items:end}
body[data-layout="paper"] .log_sidebar h2{grid-column:1/-1;border-bottom:2px solid var(--color--text);
  padding-bottom:6px;margin-bottom:14px}
body[data-layout="paper"] .stat_item{display:block;border-bottom:none;padding:0;margin:0}
body[data-layout="paper"] .stat_item b{display:block;font-size:30px}
body[data-layout="paper"] .stat_item span{display:block;font-size:12.5px}
body[data-layout="paper"] .text-size-small{grid-column:1/-1;margin-top:18px;padding-top:12px;
  border-top:1px solid var(--color--border);max-width:70ch}
/* the transcript line numbers are absolutely positioned and cannot survive
   the multi-column paper flow */
body[data-theme="docket"][data-layout="paper"] .log_item::before{content:none}

/* ---- poster: the masthead carries the image ---- */
/* the ground runs the full width; only the content is held off the edges */
body[data-layout="poster"] .section_hero{background:linear-gradient(var(--color--scrim),var(--color--scrim)),
  var(--image--band) center/cover}
body[data-layout="poster"] .hero_component{background:transparent;padding:26px 0 34px}
body[data-layout="poster"] .hero_component h1{font-size:clamp(52px,12.5vw,150px);line-height:.86;
  margin:12px 0 6px;letter-spacing:-.02em}
body[data-layout="poster"] .hero_component h1 .heading_line{display:block}
body[data-layout="poster"] .hero_component h1 .heading_line + .heading_line::before{content:""}
body[data-layout="poster"] .hero_component .text-style-eyebrow{font-size:clamp(12px,2.2vw,17px);letter-spacing:.4em}
body[data-layout="poster"] .hero_component .text-size-large{font-size:20px;max-width:52ch}
body[data-layout="poster"] .band_image{display:none}
/* ================= PALETTES =================
   GENERATED by tools/build-palettes.mjs. Do not edit by hand: edit the
   palette definitions in that file and re-run it.

   A palette owns every colour. A theme owns type, borders and shadows and
   sets no colour at all. Semantic colours are authored rather than derived,
   because serious has to be red whatever the brand is.

   Every value below was checked against WCAG AA at build time. */

/* ---- Paper ---- */
body[data-palette="paper"]{
  --color--background:#F6F4EF;
  --color--background-alt:#EBE8E0;
  --color--background-deep:#1F1D1A;
  --color--surface:#FFFFFF;
  --color--border:#C9C4B8;
  --color--scrim:rgba(246,244,239,0.9);

  --color--text:#17150F;
  --color--text-alt:#3C382F;
  --color--text-muted:#5E5849;
  --color--text-on-deep:#F4F1E8;

  --color--brand-primary:#8A6307;
  --color--brand-primary-on-deep:#E0B356;
  --color--brand-secondary:#3F5E8C;
  --color--brand-secondary-on-deep:#9BB6DD;
  --color--on-brand:#FFFFFF;
  --color--on-secondary:#FFFFFF;

  /* meaning, not brand. Serious is red in every palette. */
  --color--status-serious:#C0392B;
  --color--status-confirmed:#17150F;
  --color--status-open:#5E5849;
  --color--on-serious:#FFFFFF;

  /* role aliases the stylesheet reads */
  --color--action:#8A6307;
  --color--accent:#9BB6DD;
  --color--brand-word:#F4F1E8;
  --color--brand-mark:#E0B356;
  --color--brand-tld:#5E5849;
  --color--brand-word-light:#17150F;
  --color--brand-mark-light:#8A6307;
  --color--brand-tld-light:#5E5849;
}

/* ---- Bureau ---- */
body[data-palette="bureau"]{
  --color--background:#F3F5F8;
  --color--background-alt:#E7EBF1;
  --color--background-deep:#121A26;
  --color--surface:#FFFFFF;
  --color--border:#C2CBD8;
  --color--scrim:rgba(243,245,248,0.9);

  --color--text:#0F1620;
  --color--text-alt:#33414F;
  --color--text-muted:#566371;
  --color--text-on-deep:#EDF2F8;

  --color--brand-primary:#1F5AA8;
  --color--brand-primary-on-deep:#78AEF0;
  --color--brand-secondary:#146A63;
  --color--brand-secondary-on-deep:#5FC9BE;
  --color--on-brand:#FFFFFF;
  --color--on-secondary:#FFFFFF;

  /* meaning, not brand. Serious is red in every palette. */
  --color--status-serious:#C0392B;
  --color--status-confirmed:#0F1620;
  --color--status-open:#566371;
  --color--on-serious:#FFFFFF;

  /* role aliases the stylesheet reads */
  --color--action:#1F5AA8;
  --color--accent:#5FC9BE;
  --color--brand-word:#EDF2F8;
  --color--brand-mark:#78AEF0;
  --color--brand-tld:#566371;
  --color--brand-word-light:#0F1620;
  --color--brand-mark-light:#1F5AA8;
  --color--brand-tld-light:#566371;
}

/* ---- Sage ---- */
body[data-palette="sage"]{
  --color--background:#F2F5F0;
  --color--background-alt:#E5EAE1;
  --color--background-deep:#17211A;
  --color--surface:#FCFDFB;
  --color--border:#C1CBBD;
  --color--scrim:rgba(242,245,240,0.9);

  --color--text:#131A14;
  --color--text-alt:#35422F;
  --color--text-muted:#57634F;
  --color--text-on-deep:#EEF4EC;

  --color--brand-primary:#2F6B45;
  --color--brand-primary-on-deep:#7DCB99;
  --color--brand-secondary:#8A5A15;
  --color--brand-secondary-on-deep:#E3B361;
  --color--on-brand:#FFFFFF;
  --color--on-secondary:#FFFFFF;

  /* meaning, not brand. Serious is red in every palette. */
  --color--status-serious:#C0392B;
  --color--status-confirmed:#131A14;
  --color--status-open:#57634F;
  --color--on-serious:#FFFFFF;

  /* role aliases the stylesheet reads */
  --color--action:#2F6B45;
  --color--accent:#E3B361;
  --color--brand-word:#EEF4EC;
  --color--brand-mark:#7DCB99;
  --color--brand-tld:#57634F;
  --color--brand-word-light:#131A14;
  --color--brand-mark-light:#2F6B45;
  --color--brand-tld-light:#57634F;
}

/* ---- Night ---- */
body[data-palette="night"]{
  --color--background:#11161F;
  --color--background-alt:#161C28;
  --color--background-deep:#0A0E15;
  --color--surface:#1A2230;
  --color--border:#2C3648;
  --color--scrim:rgba(17,22,31,0.9);

  --color--text:#EDF1F7;
  --color--text-alt:#C3CCDA;
  --color--text-muted:#8E9BAD;
  --color--text-on-deep:#EDF1F7;

  --color--brand-primary:#E0A93C;
  --color--brand-primary-on-deep:#E0A93C;
  --color--brand-secondary:#4FBFAC;
  --color--brand-secondary-on-deep:#4FBFAC;
  --color--on-brand:#111111;
  --color--on-secondary:#111111;

  /* meaning, not brand. Serious is red in every palette. */
  --color--status-serious:#E06055;
  --color--status-confirmed:#EDF1F7;
  --color--status-open:#8E9BAD;
  --color--on-serious:#111111;

  /* role aliases the stylesheet reads */
  --color--action:#E0A93C;
  --color--accent:#4FBFAC;
  --color--brand-word:#EDF1F7;
  --color--brand-mark:#E0A93C;
  --color--brand-tld:#8E9BAD;
  --color--brand-word-light:#EDF1F7;
  --color--brand-mark-light:#E0A93C;
  --color--brand-tld-light:#8E9BAD;
}

/* ---- Carbon ---- */
body[data-palette="carbon"]{
  --color--background:#161616;
  --color--background-alt:#1C1C1C;
  --color--background-deep:#0D0D0D;
  --color--surface:#202020;
  --color--border:#343434;
  --color--scrim:rgba(22,22,22,0.9);

  --color--text:#F0EFED;
  --color--text-alt:#C9C7C3;
  --color--text-muted:#94918B;
  --color--text-on-deep:#F0EFED;

  --color--brand-primary:#E2714A;
  --color--brand-primary-on-deep:#E2714A;
  --color--brand-secondary:#7FA9D6;
  --color--brand-secondary-on-deep:#7FA9D6;
  --color--on-brand:#111111;
  --color--on-secondary:#111111;

  /* meaning, not brand. Serious is red in every palette. */
  --color--status-serious:#E06055;
  --color--status-confirmed:#F0EFED;
  --color--status-open:#94918B;
  --color--on-serious:#111111;

  /* role aliases the stylesheet reads */
  --color--action:#E2714A;
  --color--accent:#7FA9D6;
  --color--brand-word:#F0EFED;
  --color--brand-mark:#E2714A;
  --color--brand-tld:#94918B;
  --color--brand-word-light:#F0EFED;
  --color--brand-mark-light:#E2714A;
  --color--brand-tld-light:#94918B;
}

/* ---- Phosphor ---- */
body[data-palette="phosphor"]{
  --color--background:#0A0D0A;
  --color--background-alt:#0E120E;
  --color--background-deep:#060806;
  --color--surface:#111611;
  --color--border:#27301F;
  --color--scrim:rgba(10,13,10,0.9);

  --color--text:#D6E4CE;
  --color--text-alt:#B4C4AC;
  --color--text-muted:#879181;
  --color--text-on-deep:#D6E4CE;

  --color--brand-primary:#6BE37F;
  --color--brand-primary-on-deep:#6BE37F;
  --color--brand-secondary:#E0C453;
  --color--brand-secondary-on-deep:#E0C453;
  --color--on-brand:#111111;
  --color--on-secondary:#111111;

  /* meaning, not brand. Serious is red in every palette. */
  --color--status-serious:#E06055;
  --color--status-confirmed:#D6E4CE;
  --color--status-open:#879181;
  --color--on-serious:#111111;

  /* role aliases the stylesheet reads */
  --color--action:#6BE37F;
  --color--accent:#E0C453;
  --color--brand-word:#D6E4CE;
  --color--brand-mark:#6BE37F;
  --color--brand-tld:#879181;
  --color--brand-word-light:#D6E4CE;
  --color--brand-mark-light:#6BE37F;
  --color--brand-tld-light:#879181;
}
/* ================= CLIENT FIRST STRUCTURE =================
   page-wrapper > main-wrapper > section_* > padding-global > container-large
   Every horizontal gutter is padding-global. Every width is the container. */

.page-wrapper{overflow-x:hidden}
.padding-global{padding-left:var(--space--global-padding);
  padding-right:var(--space--global-padding)}
.container-large{width:100%;max-width:var(--size--container-active);
  margin-left:auto;margin-right:auto}
.u-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap}

/* ---- sections carry the ground, components carry the arrangement ---- */
.section_hero{background:var(--color--background)}
.section_band .padding-global,.section_promises .padding-global{--space--global-padding:0rem}
body[data-container="sheet"] .section_band .container-large,
body[data-container="sheet"] .section_promises .container-large,
body[data-container="sheet"] .section_log .container-large,
body[data-container="sheet"] .section_cta .container-large{background:var(--color--surface)}
/* inside the sheet the container's own edge is the gutter */
body[data-container="sheet"] .section_log .padding-global,
body[data-container="sheet"] .section_cta .padding-global,
body[data-container="sheet"] .section_footer .padding-global,
body[data-container="sheet"] .section_hero .padding-global{--space--global-padding:0rem}

/* ---- Poster: ground runs full width, content is held off the edges ---- */
body[data-layout="poster"] .section_hero .padding-global{--space--global-padding:5%}

/* ---------- footer ---------- */
.footer_component{background:var(--color--background-deep);color:var(--color--text-on-deep);
  padding:0 0 34px}
.footer_rule{height:5px;background:var(--color--accent)}
.footer_grid{display:flex;flex-wrap:wrap;gap:26px;padding:28px 22px 0}
.footer_grid-item{flex:1 1 240px}
.footer_component h2{font-family:var(--font--label);font-weight:600;font-size:14px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--color--brand-secondary-on-deep);margin:0 0 8px}
.footer_component p{margin:0 0 8px;font-size:15px;max-width:42ch}
.footer_component a{color:inherit;text-decoration:underline;text-underline-offset:2px;
  display:inline-block;padding:4px 0}
.footer_colophon{font-family:var(--font--mono);font-size:12.5px;color:inherit;opacity:.8;
  margin:26px 22px 0;padding-top:14px;border-top:1px solid var(--color--border)}

/* ---------- headline fitting (Poster) ----------
   controls.js measures each line and sets --fit on it. Without JavaScript the
   clamp in the Poster block is what renders. */
body[data-layout="poster"] .heading_line{display:block;white-space:nowrap;
  width:max-content;margin-left:auto;margin-right:auto}
body[data-layout="poster"] .heading_line[style*="--fit"]{font-size:calc(var(--fit) * 1px)}

/* ---------- responsive ---------- */
@media (max-width:880px){
  .log_component{grid-template-columns:minmax(0,1fr)}
  .log_main,.log_sidebar{min-width:0}
  .log_main{border-right:none;border-bottom:1px solid var(--color--border)}
  body[data-container="sheet"] .log_sidebar{border-left:none}
  body[data-layout="paper"] .log_list{column-count:1}
  body[data-layout="paper"] .log_main{padding:22px 18px 10px}
  body[data-layout="paper"] .log_sidebar{padding:6px 18px 30px;
    grid-template-columns:repeat(3,minmax(0,auto));gap:0 18px}
  .navbar_menu{gap:13px;font-size:12.5px;letter-spacing:.06em}
}
@media (max-width:479px){
  :root{--space--global-padding:1.25rem}
  body[data-layout="poster"] .section_hero .padding-global{--space--global-padding:6%}
  .navbar_menu a:not([aria-current]){display:none}
  .text-style-eyebrow{letter-spacing:.18em}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.themer_dock{display:none}}

/* ---------- palette panel ----------
   One palette per row, so the swatch can show the ground and the accent side
   by side at a size worth looking at. */
#pop-palette .themer_swatches{grid-template-columns:1fr}
#pop-palette .themer_swatches button i{width:30px;height:18px;border-radius:0}
#pop-palette .themer_panel-heading:first-child{margin-top:0}