/* One Pool, many doors. The Roomful (G2 Open House) and Circular (B3 Circled) panels carry their own package tokens,
   scoped to their frames so nothing leaks into the Charter page around them. Values copied from PK/out/<slug>/tokens.css. */
[hidden]{display:none!important}
.doors{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));align-items:start;margin:8px 0 26px}
.door{min-width:0;display:flex;flex-direction:column;gap:12px}
.door-label h3{font-size:var(--t-xl);margin:2px 0 4px}
.door-label p{margin:0;font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:var(--t-sm);color:var(--ink-2)}
.door-label .his{margin-top:6px;color:var(--ink);font-weight:600}
.door.is-his .frame{outline:3px solid var(--brand-ink);outline-offset:3px}
.tag-inv{display:inline-block;font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:var(--t-cap);letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--ink-2)!important;margin:0 0 4px!important}
.door-go{margin:0}
.same{font-family:var(--f-display);font-variation-settings:var(--fvs-display);font-size:var(--t-xl);line-height:1.25;max-width:34em;margin:6px 0 0;border-top:2px solid var(--ink);padding-top:14px;text-wrap:balance}
.frame{border-radius:6px;overflow:hidden;min-width:0;background:var(--bg);color:var(--ink);font-family:var(--f-text);font-variation-settings:var(--fvs-text);border:1px solid var(--line-strong)}
.frame p{margin:0}

/* Roomful · G2 Open House, day by default, night with the page */
.frame.rf{--bg:#E3E8DB;--surface:#EEF1E8;--raised:#FFFFFF;--line:#CBD3C2;--line-strong:#6C7563;--ink:#1D1B16;--ink-2:#45423A;--ink-3:#57544B;--brand:#492312;--on-brand:#FAF4EC;--brand-ink:#492312;--brand-tint:#EEE2D5;--yes:#256593;--caution:#65625D;--stripe:#D8DFCE;
  --f-display:"Anybody", system-ui, sans-serif;--f-text:"Newsreader", Georgia, serif;--f-ui:"Anybody", system-ui, sans-serif;--f-mono:"Azeret Mono", ui-monospace, monospace;--fvs-display:"wdth" 72;--fvs-text:normal;--fvs-ui:"wdth" 96;--fvs-mono:normal;--r-1:3px;--r-2:7px;
  background:repeating-linear-gradient(90deg,var(--bg) 0 23px,var(--stripe) 23px 24px);padding:0 14px 16px}
:root[data-theme="dark"] .frame.rf{--bg:#1B1512;--surface:#231B17;--raised:#2C231E;--line:#43362D;--line-strong:#8B7A6B;--ink:#F3ECE4;--ink-2:#D3C6B8;--ink-3:#B4A696;--brand:#E4C9AE;--on-brand:#1B1512;--brand-ink:#EDD6C0;--brand-tint:#3A2C24;--yes:#A5CDE9;--caution:#99948F;--stripe:#221A16}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.rf{--bg:#1B1512;--surface:#231B17;--raised:#2C231E;--line:#43362D;--line-strong:#8B7A6B;--ink:#F3ECE4;--ink-2:#D3C6B8;--ink-3:#B4A696;--brand:#E4C9AE;--on-brand:#1B1512;--brand-ink:#EDD6C0;--brand-tint:#3A2C24;--yes:#A5CDE9;--caution:#99948F;--stripe:#221A16}}
.rf-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 -14px 14px!important;padding:8px 14px;background:var(--surface);border-bottom:1px solid var(--line);font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:13px;color:var(--ink-2)}
.rf-word{font-family:var(--f-display);font-variation-settings:var(--fvs-display);font-weight:760;font-size:22px;color:var(--brand-ink);letter-spacing:-.01em}
.rf-doorhead{display:grid;gap:8px;padding-bottom:12px;margin-bottom:22px;border-bottom:5px solid var(--brand)}
.rf-h{font-family:var(--f-display);font-variation-settings:var(--fvs-display);font-weight:720;font-size:26px;line-height:1.05;color:var(--ink);display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline}
.rf-h small{font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:14px;font-weight:600;color:var(--ink-2)}
.rf-facts{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:14px;color:var(--ink-2)}
.rf-vis{display:inline-flex;align-items:center;gap:6px;font-weight:650;color:var(--yes)}
.rf-charter{font-size:16px;line-height:1.5;font-style:italic;color:var(--ink-2)}
.rf-cards{display:grid;gap:26px}
.rf-card{position:relative;background:var(--raised);border:1px solid var(--line-strong);border-radius:var(--r-2);padding:34px 14px 14px;display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.rf-via{position:absolute;top:-1px;left:12px;display:inline-flex;align-items:center;gap:6px;font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:13px;font-weight:600;color:var(--brand-ink);background:var(--brand-tint);border:1px solid var(--line-strong);border-top:0;border-radius:0 0 var(--r-2) var(--r-2);padding:4px 10px 5px}
.rf-name{font-family:var(--f-display);font-variation-settings:var(--fvs-display);font-weight:700;font-size:22px;line-height:1.15;color:var(--ink)}
.rf-pro{font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-weight:500;font-size:14px;color:var(--ink-2)}
.rf-where{font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:14px;color:var(--ink-2)}
.rf-about{font-size:16.5px;line-height:1.5}
.rf-url{font-family:var(--f-mono);font-size:12.5px;color:var(--ink-3);overflow-wrap:anywhere}
.rf-can{font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:13.5px;font-weight:550;line-height:1.35;border-top:1px solid var(--line);padding-top:9px;width:100%}
.rf-end{margin-top:18px!important;font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:14px;font-weight:600;color:var(--ink-2)}
.frame.rf .kd-level{font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);background:var(--surface);color:var(--ink-2);border-color:var(--line-strong);font-size:13.5px}
.frame.rf .kd-level svg{color:var(--brand-ink)}

/* the email digest: plain text, the page's own mono */
.frame.dg{background:var(--raised);font-family:var(--f-mono);font-variation-settings:var(--fvs-mono);font-size:13.5px;line-height:1.6}
.dg-head{padding:12px 16px;border-bottom:1px solid var(--line);background:var(--surface)}
.dg-head span{display:inline-block;min-width:8ch;color:var(--ink-3)}
.dg-body{padding:14px 16px 18px;display:grid;gap:10px}
.dg-charter{color:var(--ink-2)}
.dg-rule{color:var(--ink-3);overflow:hidden;white-space:nowrap}
.dg-item{display:grid;gap:2px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.dg-item b{font-weight:700}
.dg-url{overflow-wrap:anywhere;color:var(--ink-2)}
.frame.dg .kd-level{font-family:var(--f-mono);font-variation-settings:var(--fvs-mono);font-size:12.5px;font-weight:400;background:transparent;border-color:var(--line)}
:root[data-font="readable"] .frame.dg{font-family:"Atkinson Hyperlegible Mono", ui-monospace, monospace}

/* The Circular · B3 Circled */
.frame.ci{--bg:#F2E6B2;--surface:#F8F0D0;--raised:#FCF8E8;--line:#D6C893;--line-strong:#807350;--ink:#1C1A15;--ink-2:#413C30;--ink-3:#574F3D;--brand:#1C1A15;--on-brand:#FCF8E8;--brand-ink:#1C1A15;--brand-tint:#E7DAA3;--accent:#D3261B;--rule:#1C1A15;
  --f-display:"Libre Franklin", system-ui, sans-serif;--f-text:"Crimson Pro", Georgia, serif;--f-ui:"Libre Franklin", system-ui, sans-serif;--f-mono:"Fragment Mono", ui-monospace, monospace;--fvs-display:normal;--fvs-text:normal;--fvs-ui:normal;--r-1:0px;--r-2:0px;
  border-radius:0;border:0;border-top:4px solid var(--rule);padding:10px 16px 18px;max-width:420px;margin-inline:auto;width:100%}
:root[data-theme="dark"] .frame.ci{--bg:#1D1C1A;--surface:#272623;--raised:#312F2B;--line:#3F3C37;--line-strong:#8B8573;--ink:#F0E8C8;--ink-2:#D2C9A9;--ink-3:#B1A98C;--brand:#F0E8C8;--on-brand:#1D1C1A;--brand-ink:#F0E8C8;--brand-tint:#34322C;--accent:#FF5E57;--rule:#8B8573}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.ci{--bg:#1D1C1A;--surface:#272623;--raised:#312F2B;--line:#3F3C37;--line-strong:#8B8573;--ink:#F0E8C8;--ink-2:#D2C9A9;--ink-3:#B1A98C;--brand:#F0E8C8;--on-brand:#1D1C1A;--brand-ink:#F0E8C8;--brand-tint:#34322C;--accent:#FF5E57;--rule:#8B8573}}
.ci-mast{display:flex;flex-direction:column;gap:2px;padding-bottom:8px;margin-bottom:12px!important;border-bottom:3px double var(--rule);font-family:var(--f-ui);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--ink-2)}
.ci-title{font-family:var(--f-display);font-weight:900;font-size:30px;letter-spacing:-.02em;line-height:1;color:var(--ink);text-transform:uppercase}
.ci-band{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;background:var(--brand);color:var(--on-brand);padding:7px 10px;font-family:var(--f-ui);font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.ci-kept{margin-top:8px!important;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-family:var(--f-ui);font-size:14px}
.ci-facts{font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2);padding-bottom:8px;border-bottom:1px solid var(--line-strong);margin-top:4px!important}
.ci-charter{font-style:italic;font-size:16.5px;line-height:1.45;color:var(--ink-2);padding:8px 0 10px;border-bottom:1px solid var(--line-strong)}
.ci-ad{padding:12px 0 12px;border-bottom:1px solid var(--line-strong);display:grid;gap:5px}
.ci-code{font-family:var(--f-mono);font-size:12px;color:var(--ink-3)}
.ci-body{font-size:17px;line-height:1.45}
.ci-body b{font-family:var(--f-ui);font-weight:800;font-size:14.5px;letter-spacing:.02em;text-transform:uppercase}
.ci-meta{font-family:var(--f-ui);font-size:13.5px;font-weight:600}
.ci-host{font-family:var(--f-mono);font-weight:400;overflow-wrap:anywhere}
.ci-rule{font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2)}
.ci-end{margin-top:10px!important;font-family:var(--f-ui);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;text-align:center}
.frame.ci .kd-level{font-family:var(--f-ui);font-weight:700;font-size:13.5px;border:2px solid var(--rule);border-radius:0;background:var(--raised);color:var(--ink)}
.frame.ci .kd-level svg{color:var(--ink)}
:root[data-font="readable"] .frame.rf,:root[data-font="readable"] .frame.ci{--f-text:var(--f-readable);--f-ui:var(--f-readable);--fvs-text:normal;--fvs-ui:normal}

/* One Pool, three layers. Each app's panel carries its own package tokens (PK/out/h1-h4/tokens.css) and the page's
   panel carries Midspan's (J3 Bascule, from its site.css), scoped to the frame, day by default and night with the page. */
.lay2{display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));align-items:start;margin:8px 0 34px}
.lay{min-width:0;display:flex;flex-direction:column;gap:12px}
.lay > h3{font-size:var(--t-xl);margin:0}
.lay > p{margin:0;max-width:var(--measure)}
.lay-n{font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:var(--t-cap);letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--brand-ink)!important}
.lay-apps{border-top:1px solid var(--line-strong);padding-top:22px}
.lapps{display:grid;gap:34px 30px;grid-template-columns:minmax(0,1fr);align-items:start;margin:10px 0 8px}
@media (min-width:900px){.lapps{grid-template-columns:repeat(2,minmax(0,1fr))}}
.adoor{min-width:0;display:flex;flex-direction:column;gap:12px}
.adoor .door-label h4{font-family:var(--f-display);font-variation-settings:var(--fvs-display);font-size:var(--t-xl);margin:2px 0 4px;color:var(--ink)}
.ld-yes{margin:0;font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-size:var(--t-sm);color:var(--ink)}
.ld-yes .lab{display:inline;margin-right:6px}
.also{margin:18px 0 0;padding-left:20px;max-width:var(--measure);display:grid;gap:8px}
.also q{color:var(--ink-2)}
.door-go.ctas{display:flex;flex-wrap:wrap;gap:10px}
.frame .kd-level{font-size:13px}

/* the site layer: Midspan's board (J3 Bascule) */
.frame.ms{--bg:#EEF1F2;--surface:#F7F8F9;--raised:#FFFFFF;--line:#D3D9DD;--line-strong:#6B7580;--ink:#141C26;--ink-2:#374350;--ink-3:#4F5B68;--brand:#1D43A6;--on-brand:#FFFFFF;--brand-ink:#1D43A6;--brand-tint:#DCE4F6;--focus:#00718B;
  --f-display:"Sofia Sans Condensed", system-ui, sans-serif;--f-text:"Source Sans 3", system-ui, sans-serif;--f-ui:"Source Sans 3", system-ui, sans-serif;--fvs-display:normal;--fvs-text:normal;--fvs-ui:normal;--r-2:6px;
  background:var(--raised);border:1px solid var(--line-strong);border-radius:6px}
:root[data-theme="dark"] .frame.ms{--bg:#0E141B;--surface:#141C25;--raised:#1B2530;--line:#2A3643;--line-strong:#6A7887;--ink:#E8EDF2;--ink-2:#BEC7D0;--ink-3:#9EA9B4;--brand:#8FAAF2;--on-brand:#0E141B;--brand-ink:#A3BAF7;--brand-tint:#1C2A4A;--focus:#63D2E4}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.ms{--bg:#0E141B;--surface:#141C25;--raised:#1B2530;--line:#2A3643;--line-strong:#6A7887;--ink:#E8EDF2;--ink-2:#BEC7D0;--ink-3:#9EA9B4;--brand:#8FAAF2;--on-brand:#0E141B;--brand-ink:#A3BAF7;--brand-tint:#1C2A4A;--focus:#63D2E4}}
.ms-bar{display:flex;justify-content:space-between;gap:10px;background:var(--brand);color:var(--on-brand);padding:10px 16px;font-family:var(--f-ui);font-weight:700;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase}
.ms-in{padding:14px 18px 8px}
.ms-facts{font-size:15px;line-height:1.5;color:var(--ink-2);margin-bottom:10px!important}
.ms-mono{font-family:var(--f-mono);font-variation-settings:var(--fvs-mono);font-size:13px;overflow-wrap:anywhere}
.ms-roll{list-style:none;margin:0;padding:0}
.ms-roll li{padding:10px 0;border-top:1px solid var(--line)}
.ms-roll li.is-him{border-left:4px solid var(--brand-ink);padding-left:10px;margin-left:-14px}
.ms-who{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.ms-who b{font-family:var(--f-display);font-variation-settings:var(--fvs-display);font-weight:760;font-size:21px;line-height:1.1}
.ms-note{margin-top:4px!important;font-size:15px;color:var(--brand-ink);font-weight:600}
.frame.ms .kd-level{font-family:var(--f-ui);font-weight:600;border-radius:2px;background:var(--raised);border-color:var(--line-strong);color:var(--ink-2)}
.frame.ms .kd-level svg{color:var(--brand-ink)}

/* the data layer: the page's own mono */
.frame.js{background:var(--surface)}
.js-bar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:9px 14px;border-bottom:1px solid var(--line);font-family:var(--f-mono);font-variation-settings:var(--fvs-mono);font-size:13px;color:var(--ink-2)}
.frame.js pre.json.js-pre{margin:0;border:0;border-radius:0;max-height:440px;font-size:12.5px;background:var(--surface);white-space:pre-wrap;overflow-wrap:anywhere}
.js-mid{border-top:1px solid var(--line)}
.frame.js pre.json.js-pre:first-of-type{max-height:300px}
.frame.js pre.json.js-pre:focus-visible{outline-offset:-3px}

/* Face Up · H1 Face Card */
.frame.fu{--bg:#EDEFF3;--surface:#F6F7F9;--raised:#FFFFFF;--line:#D7DAE1;--line-strong:#767C8C;--ink:#141820;--ink-2:#404654;--ink-3:#575D6C;--brand:#E5550F;--brand-ink:#1E2638;--brand-tint:#FFE6D6;--yes:#AA470E;--focus:#141820;--table:#E3E6EC;
  --f-display:"Red Hat Display", system-ui, sans-serif;--f-text:"Hanken Grotesk", system-ui, sans-serif;--f-ui:"Hanken Grotesk", system-ui, sans-serif;--fvs-display:normal;--fvs-text:normal;--fvs-ui:normal;--r-1:10px;--r-2:16px;
  padding:0 14px 16px;border-radius:16px}
:root[data-theme="dark"] .frame.fu{--bg:#131722;--surface:#1A1F2C;--raised:#222836;--line:#303848;--line-strong:#7A8397;--ink:#F1F3F7;--ink-2:#BEC5D2;--ink-3:#A0A8B7;--brand:#FF7A33;--brand-ink:#E4E8F0;--brand-tint:#3A2619;--yes:#FB9856;--focus:#F1F3F7;--table:#0F131C}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.fu{--bg:#131722;--surface:#1A1F2C;--raised:#222836;--line:#303848;--line-strong:#7A8397;--ink:#F1F3F7;--ink-2:#BEC5D2;--ink-3:#A0A8B7;--brand:#FF7A33;--brand-ink:#E4E8F0;--brand-tint:#3A2619;--yes:#FB9856;--focus:#F1F3F7;--table:#0F131C}}
.fu-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 -14px 14px!important;padding:9px 14px;background:var(--surface);border-bottom:1px solid var(--line);font-family:var(--f-ui);font-size:13.5px;font-weight:600;color:var(--ink-2)}
.fu-word{font-family:var(--f-display);font-weight:800;font-size:22px;letter-spacing:-.02em;color:var(--ink)}
.fu-card{background:var(--raised);border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 0 var(--line),0 10px 24px -18px rgba(20,24,32,.5);overflow:hidden}
.fu-pic{background:repeating-linear-gradient(135deg,var(--table) 0 6px,var(--surface) 6px 12px);padding:26px 16px;display:grid;place-items:center;border-bottom:1px solid var(--line)}
.fu-tile{display:flex;flex-direction:column;align-items:center;gap:0}
.fu-ini{display:grid;place-items:center;width:150px;height:110px;background:var(--raised);border-radius:16px;font-family:var(--f-display);font-weight:900;font-size:78px;letter-spacing:-.04em;color:var(--ink);line-height:1}
.fu-cap{margin-top:-12px;background:var(--raised);border:1px solid var(--line);border-radius:999px;padding:3px 12px;font-family:var(--f-ui);font-weight:700;font-size:13.5px;color:var(--ink)}
.fu-body{padding:14px 16px 16px;display:grid;gap:7px;justify-items:start}
.fu-name{font-family:var(--f-display);font-weight:800;font-size:30px;line-height:1;letter-spacing:-.02em}
.fu-meta{font-family:var(--f-ui);font-size:15px;color:var(--ink-2)}
.fu-from{font-family:var(--f-ui);font-size:14.5px;color:var(--ink-2)}
.fu-from b{color:var(--ink)}
.fu-ch{font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.fu-src{font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2)}
.frame.fu a{color:var(--ink);font-weight:700}
.fu-note,.fu-rule{margin-top:12px!important;font-family:var(--f-ui);font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.fu-rule{color:var(--ink);font-weight:600}
.frame.fu .kd-level{font-family:var(--f-ui);font-weight:700;border-radius:999px;border:1.5px solid var(--ink);background:transparent;color:var(--ink)}

/* Heartwood · H2 End Grain */
.frame.hw{--bg:#F3EDE6;--surface:#FAF6F1;--raised:#FFFFFF;--line:#E2D6CC;--line-strong:#8E766A;--ink:#2A1914;--ink-2:#584139;--ink-3:#6B554B;--brand:#5A2418;--brand-ink:#5A2418;--brand-tint:#F1E1D7;--accent:#B0721F;--focus:#1D5F8A;--grain:#E8DDD2;--ring:#CDB8A8;
  --f-display:"Petrona", Georgia, serif;--f-text:"Petrona", Georgia, serif;--f-ui:"Schibsted Grotesk", system-ui, sans-serif;--fvs-display:normal;--fvs-text:normal;--fvs-ui:normal;--r-1:4px;--r-2:10px;
  padding:0 14px 16px;border-radius:10px}
:root[data-theme="dark"] .frame.hw{--bg:#251513;--surface:#2E1C18;--raised:#38241F;--line:#4D352E;--line-strong:#9E8074;--ink:#F6ECE4;--ink-2:#DCC8BC;--ink-3:#C4AC9E;--brand:#F2D0B8;--brand-ink:#F2D0B8;--brand-tint:#462C23;--accent:#E1A04A;--focus:#8EC3EE;--grain:#2E1C18;--ring:#654B40}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.hw{--bg:#251513;--surface:#2E1C18;--raised:#38241F;--line:#4D352E;--line-strong:#9E8074;--ink:#F6ECE4;--ink-2:#DCC8BC;--ink-3:#C4AC9E;--brand:#F2D0B8;--brand-ink:#F2D0B8;--brand-tint:#462C23;--accent:#E1A04A;--focus:#8EC3EE;--grain:#2E1C18;--ring:#654B40}}
.hw-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 -14px 14px!important;padding:9px 14px;background:var(--brand);color:var(--bg);font-family:var(--f-ui);font-size:13.5px;font-weight:600}
:root[data-theme="dark"] .hw-bar{color:#251513}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .hw-bar{color:#251513}}
.hw-word{font-family:var(--f-display);font-size:20px;font-weight:600}
.hw-card{background:var(--raised);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:10px;padding:16px 16px 18px;display:grid;gap:9px;justify-items:start}
.hw-from{font-family:var(--f-ui);font-size:14px;line-height:1.6;color:var(--ink-2)}
.hw-from .kd-level{vertical-align:middle}
.hw-from b{color:var(--ink)}
.hw-ch{font-style:italic;font-size:17px;line-height:1.45;color:var(--ink-2)}
.hw-tags{font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2)}
.hw-three{font-family:var(--f-ui);font-size:14px;color:var(--ink-2);padding-bottom:10px;border-bottom:1px dashed var(--line-strong);width:100%}
.frame.hw a{color:var(--brand-ink);font-weight:600}
.hw-nopic{display:flex;gap:14px;align-items:center;border:1.5px dashed var(--line-strong);border-radius:14px;padding:12px 14px;width:100%}
.hw-ring{flex:none;display:grid;place-items:center;width:72px;height:72px;border-radius:50%;border:2px dashed var(--line-strong);font-family:var(--f-display);font-size:28px;color:var(--ink)}
.hw-nopic p{font-family:var(--f-ui);font-size:14px;line-height:1.45;color:var(--ink-2)}
.hw-name{font-family:var(--f-display);font-size:32px;line-height:1.05;font-weight:500}
.hw-name span{font-family:var(--f-ui);font-size:15px;color:var(--ink-2);margin-left:6px}
.hw-where{font-family:var(--f-ui);font-size:15px;color:var(--ink-2)}
.hw-lab{font-family:var(--f-ui);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink-2);margin-top:6px!important}
.hw-about{font-size:18px;line-height:1.55}
.hw-rule{margin-top:12px!important;font-family:var(--f-ui);font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.frame.hw .kd-level{font-family:var(--f-ui);border-radius:999px;background:var(--brand-tint);border-color:var(--line);color:var(--ink)}

/* Sundial · H3 Gnomon */
.frame.sd{--bg:#F5E9DE;--surface:#FBF4EC;--raised:#FFFBF6;--line:#E4D5C7;--line-strong:#8C7A6B;--ink:#1E1B2A;--ink-2:#4A4556;--ink-3:#5E5869;--brand:#2F2C4A;--on-brand:#FBF4EC;--brand-ink:#2F2C4A;--brand-tint:#E9E0E4;--accent:#E0914A;--focus:#5B4FC4;--light:#F7DAB4;--cast:#DDD2CC;
  --f-display:"Josefin Sans", system-ui, sans-serif;--f-text:"Source Serif 4", Georgia, serif;--f-ui:"Archivo", system-ui, sans-serif;--fvs-display:normal;--fvs-text:normal;--fvs-ui:normal;--r-1:2px;--r-2:4px;
  padding:0 14px 16px;border-radius:4px}
:root[data-theme="dark"] .frame.sd{--bg:#1B1A24;--surface:#23212E;--raised:#2C2A39;--line:#3B384A;--line-strong:#87809A;--ink:#F2EAE1;--ink-2:#CFC5BD;--ink-3:#ADA3A0;--brand:#DCD4EA;--on-brand:#1B1A24;--brand-ink:#DCD4EA;--brand-tint:#34304A;--accent:#EEA863;--focus:#B7A8FF;--light:#4A3627;--cast:#121119}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.sd{--bg:#1B1A24;--surface:#23212E;--raised:#2C2A39;--line:#3B384A;--line-strong:#87809A;--ink:#F2EAE1;--ink-2:#CFC5BD;--ink-3:#ADA3A0;--brand:#DCD4EA;--on-brand:#1B1A24;--brand-ink:#DCD4EA;--brand-tint:#34304A;--accent:#EEA863;--focus:#B7A8FF;--light:#4A3627;--cast:#121119}}
.sd-bar{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 -14px 14px!important;padding:10px 14px;border-bottom:1px solid var(--line);font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2)}
.sd-word{font-family:var(--f-display);font-size:21px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink)}
.sd-card{background:var(--raised);border:1px solid var(--line-strong);border-radius:4px;padding:12px;box-shadow:8px 8px 0 var(--cast);display:grid;gap:8px;justify-items:start;margin-right:8px}
.sd-nopic{background:linear-gradient(115deg,var(--surface) 55%,var(--light));border:1px solid var(--line);padding:16px 16px 18px;width:100%;display:grid;gap:8px}
.sd-nopic p{font-family:var(--f-ui);font-size:14px;line-height:1.5;color:var(--ink-2)}
.sd-host{font-family:var(--f-mono);font-variation-settings:var(--fvs-mono);font-size:13px!important}
.sd-name{font-family:var(--f-display);font-size:30px;line-height:1.1;letter-spacing:.02em}
.sd-meta{font-family:var(--f-ui);font-size:15px;color:var(--ink-2)}
.sd-notes{list-style:none;margin:18px 0 0;padding:0;border:1px solid var(--line-strong);background:var(--raised)}
.sd-notes li{padding:10px 12px;font-family:var(--f-ui);font-size:14px;line-height:1.45;color:var(--ink-2);border-top:1px solid var(--line)}
.sd-notes li:first-child{border-top:0}
.sd-notes b{color:var(--ink)}
.sd-under{margin-top:16px;display:grid;gap:6px;border-top:3px solid var(--brand);padding-top:10px}
.sd-lab{font-family:var(--f-display);font-size:14px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink)}
.sd-pool{font-family:var(--f-text);font-size:18px}
.sd-pool b{font-weight:600;margin-right:6px}
.sd-ch{font-size:15.5px;line-height:1.45;color:var(--ink-2)}
.sd-tags,.sd-kept,.sd-links{font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2)}
.sd-kept{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.frame.sd a{color:var(--brand-ink);font-weight:600}
.frame.sd .kd-level{font-family:var(--f-ui);border-radius:2px;border:1px solid var(--ink-2);background:var(--raised);color:var(--ink)}

/* Card Catalog · H4 Filed Under */
.frame.cc{--bg:#E5E6E1;--surface:#F2F2EE;--raised:#FFFFFF;--line:#CDCEC7;--line-strong:#6F716B;--ink:#17181A;--ink-2:#3C3F42;--ink-3:#565A5E;--brand:#7A4A1F;--brand-ink:#7A4A1F;--brand-tint:#F3E9DD;--focus:#0B63CE;--oak:#8A5A30;--rule:#C23B32;
  --f-display:"Libre Franklin", system-ui, sans-serif;--f-text:"Source Sans 3", system-ui, sans-serif;--f-ui:"Source Sans 3", system-ui, sans-serif;--f-mono:"IBM Plex Mono", ui-monospace, monospace;--fvs-display:normal;--fvs-text:normal;--fvs-ui:normal;--fvs-mono:normal;--r-1:2px;--r-2:4px;
  padding:0 14px 16px;border-radius:4px}
:root[data-theme="dark"] .frame.cc{--bg:#161412;--surface:#1F1C19;--raised:#292521;--line:#3A3530;--line-strong:#857C71;--ink:#EFEBE4;--ink-2:#CBC5BB;--ink-3:#ACA59A;--brand:#D6A870;--brand-ink:#D6A870;--brand-tint:#3A2B1D;--focus:#8FC2FF;--oak:#5C3F27;--rule:#E0766C}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .frame.cc{--bg:#161412;--surface:#1F1C19;--raised:#292521;--line:#3A3530;--line-strong:#857C71;--ink:#EFEBE4;--ink-2:#CBC5BB;--ink-3:#ACA59A;--brand:#D6A870;--brand-ink:#D6A870;--brand-tint:#3A2B1D;--focus:#8FC2FF;--oak:#5C3F27;--rule:#E0766C}}
.cc-bar{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 -14px 14px!important;padding:9px 14px;background:var(--oak);color:#FFF8EE;font-family:var(--f-mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase}
.cc-word{font-family:var(--f-display);font-weight:800;font-size:20px;letter-spacing:-.01em;text-transform:none}
.cc-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;background:var(--raised);border:1px solid var(--line-strong);border-left:4px solid var(--brand);padding:14px}
.cc-nopic{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:80px;height:100px;border:1px dashed var(--line-strong);font-family:var(--f-display);font-weight:800;font-size:24px;line-height:1;color:var(--ink);text-align:center}
.cc-nopic small{font-family:var(--f-mono);font-weight:400;font-size:10.5px;line-height:1.2;letter-spacing:.04em;color:var(--ink-2)}
.cc-body{display:grid;gap:7px;justify-items:start;min-width:0}
.cc-call{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.cc-name{font-family:var(--f-display);font-weight:800;font-size:24px;line-height:1.1;letter-spacing:-.01em;border-bottom:2px solid var(--rule);padding-bottom:4px;width:100%}
.cc-meta{font-size:15px;color:var(--ink-2)}
.cc-ch{font-style:italic;font-size:15.5px;line-height:1.45;color:var(--ink-2)}
.cc-filed{font-family:var(--f-mono);font-size:12.5px;line-height:1.6;color:var(--ink)}
.cc-kept{font-size:14.5px;color:var(--ink-2)}
.frame.cc a{color:var(--brand-ink);font-weight:600}
.cc-rule{margin-top:14px!important;border:1px solid var(--line-strong);background:var(--raised);padding:10px 12px;font-weight:700;font-size:15px;line-height:1.4}
.frame.cc .kd-level{font-family:var(--f-ui);font-weight:600;border-radius:2px;border:1px solid var(--line-strong);background:var(--raised);color:var(--ink)}
@media (max-width:420px){.cc-card{grid-template-columns:minmax(0,1fr)}.cc-nopic{width:100%;height:64px;flex-direction:row;gap:10px}}
:root[data-font="readable"] .frame.ms,:root[data-font="readable"] .frame.fu,:root[data-font="readable"] .frame.hw,:root[data-font="readable"] .frame.sd,:root[data-font="readable"] .frame.cc{--f-text:var(--f-readable);--f-ui:var(--f-readable);--fvs-text:normal;--fvs-ui:normal}

/* switch apps, lose nothing */
.sw{display:grid;gap:22px;align-items:start;margin-bottom:26px}
@media (min-width:900px){.sw{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.sw-me p{margin:0 0 8px}
.sw-me .who{display:block}
.sw-me .host{color:var(--ink-3)}
.sw-ctl .lab{margin:0 0 8px}
.sw-ctl .k-yn{margin-bottom:10px}
.seg{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 20px}
.seg button{all:unset;box-sizing:border-box;cursor:pointer;min-height:48px;display:inline-flex;align-items:center;padding:8px 16px;border:1px solid var(--brand-ink);border-radius:var(--r-2);font-family:var(--f-ui);font-variation-settings:var(--fvs-ui);font-weight:var(--w-ui);color:var(--brand-ink)}
.seg button[aria-pressed="true"]{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.seg button:hover{background:var(--brand-tint)}
.seg button[aria-pressed="true"]:hover{background:var(--brand)}
.seg button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.sw-said{margin:4px 0 6px}
.sw-tbl .url{display:block}
.sw-tbl .sub{display:block;color:var(--ink-2);font-size:var(--t-sm)}
.sw-tbl td.v{font-size:var(--t-base);font-family:var(--f-text);color:var(--ink)}
.chg-tag{display:inline-flex;align-items:center;gap:6px;font-weight:600;padding:2px 9px;border-radius:var(--r-1);border:1px solid var(--line-strong);color:var(--ink);margin-right:6px}
.chg-tag.is-changed{border:2px solid var(--brand-ink);color:var(--brand-ink)}
.chg .was{color:var(--ink-2)}
@media (max-width:760px){.sw-tbl td.v{font-size:var(--t-sm)}}
