/* headlesslaw reading interface — tokens and components
   Server-rendered, works without JavaScript. Separation by space, tone and soft shadow; no rules or outlines.
   Class prefix: hl-. State modifiers: is-*. Every colour comes from a token. */

/* ---------- 1. Tokens ---------- */
:root{
  /* lane design-system-pre-switch (2026-11-01): shadcn/ui zinc neutrals with the approved chip sheet's values; links EU blue.
     Surfaces are cards with a 1 px border (as a box-shadow ring, so no component changes size); ui.css holds the rest. */
  /* surfaces */
  --hl-bg:#FFFFFF; --hl-surface:#FFFFFF; --hl-tone:#F4F4F5; --hl-tone-2:#E4E4E7;
  /* text */
  --hl-ink:#18181B; --hl-ink-2:#3F3F46; --hl-muted:#63636B; --hl-uline:#A1A1AA;
  /* link and focus */
  --hl-link:#003399; --hl-link-wash:#EEF2FA;
  /* states: fill / text on fill */
  --hl-info:#EEF2FA; --hl-info-ink:#002B80;
  --hl-warn:#FFFAE0; --hl-warn-ink:#6B5200;
  --hl-stop:#FEE2E2; --hl-stop-ink:#B91C1C;
  --hl-calm:#F4F4F5; --hl-calm-ink:#3F3F46;
  --hl-ok:#16A34A;
  /* diff */
  --hl-ins:#DCE4F4; --hl-ins-line:#003399; --hl-del:#FEE2E2; --hl-del-ink:#991B1B;
  --hl-mark:#FFF3B0;
  /* depth: shadcn border (1 px ring) + shadow-sm */
  --hl-sh-1:0 0 0 1px #E4E4E7,0 1px 2px rgba(0,0,0,.05);
  --hl-sh-2:0 0 0 1px #D4D4D8,0 4px 14px rgba(0,0,0,.08);
  /* type */
  --hl-serif:'Source Serif 4',Georgia,'Times New Roman',serif;
  --hl-sans:'Source Sans 3',system-ui,-apple-system,'Segoe UI',sans-serif;
  --hl-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  /* shape and space (shadcn radius .625rem: md 8, lg 10, xl 14) */
  --hl-r-row:6px; --hl-r-btn:8px; --hl-r-panel:10px; --hl-r-card:12px; --hl-r-sheet:16px;
  --hl-gutter:76px; --hl-gap:18px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --hl-bg:#09090B; --hl-surface:#111114; --hl-tone:#1C1C20; --hl-tone-2:#2A2A30;
  --hl-ink:#F4F4F5; --hl-ink-2:#D4D4D8; --hl-muted:#A1A1AA; --hl-uline:#71717A;
  --hl-link:#8FAEFF; --hl-link-wash:#0E1A3D;
  --hl-info:#0E1A3D; --hl-info-ink:#AFC3FF; --hl-warn:#2A2205; --hl-warn-ink:#FFE07A;
  --hl-stop:#3B1214; --hl-stop-ink:#FCA5A5; --hl-calm:#1C1C20; --hl-calm-ink:#D4D4D8; --hl-ok:#22C55E;
  --hl-ins:#13234F; --hl-ins-line:#8FAEFF; --hl-del:#3B1214; --hl-del-ink:#FCA5A5; --hl-mark:#4A3F1C;
  --hl-sh-1:0 0 0 1px #2A2A30,0 1px 2px rgba(0,0,0,.3);
  --hl-sh-2:0 0 0 1px #3F3F46,0 4px 14px rgba(0,0,0,.45);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --hl-bg:#09090B; --hl-surface:#111114; --hl-tone:#1C1C20; --hl-tone-2:#2A2A30;
  --hl-ink:#F4F4F5; --hl-ink-2:#D4D4D8; --hl-muted:#A1A1AA; --hl-uline:#71717A;
  --hl-link:#8FAEFF; --hl-link-wash:#0E1A3D;
  --hl-info:#0E1A3D; --hl-info-ink:#AFC3FF; --hl-warn:#2A2205; --hl-warn-ink:#FFE07A;
  --hl-stop:#3B1214; --hl-stop-ink:#FCA5A5; --hl-calm:#1C1C20; --hl-calm-ink:#D4D4D8; --hl-ok:#22C55E;
  --hl-ins:#13234F; --hl-ins-line:#8FAEFF; --hl-del:#3B1214; --hl-del-ink:#FCA5A5; --hl-mark:#4A3F1C;
  --hl-sh-1:0 0 0 1px #2A2A30,0 1px 2px rgba(0,0,0,.3);
  --hl-sh-2:0 0 0 1px #3F3F46,0 4px 14px rgba(0,0,0,.45);
  color-scheme:dark}

/* ---------- 2. Base ---------- */
body{margin:0;background:var(--hl-bg);color:var(--hl-ink);font:400 15px/1.5 var(--hl-sans);-webkit-font-smoothing:antialiased}
a{color:var(--hl-link)}
:focus-visible{outline:3px solid var(--hl-link);outline-offset:2px;border-radius:4px}
.hl-mono{font-family:var(--hl-mono)}
.hl-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hl-skip{position:absolute;left:16px;top:-60px;z-index:50;background:var(--hl-ink);color:var(--hl-bg);padding:10px 14px;border-radius:var(--hl-r-btn)}
.hl-skip:focus{top:12px}
h1,h2,h3{text-wrap:balance}

/* ---------- 3. Page shell ---------- */
.hl-top{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:linear-gradient(to bottom,var(--hl-bg) 62%,transparent)}
.hl-top__in{max-width:1400px;margin:0 auto;box-sizing:border-box;padding:16px 32px 30px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.hl-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--hl-ink);font:600 18px/1 var(--hl-sans);letter-spacing:-.01em}
.hl-logo svg{color:var(--hl-ink)}
.hl-search{flex:1 1 320px;max-width:600px;display:flex;align-items:center;gap:10px;height:46px;padding:0 8px 0 16px;background:var(--hl-surface);border-radius:16px;box-shadow:var(--hl-sh-1);transition:box-shadow .2s}
.hl-search:hover,.hl-search:focus-within{box-shadow:var(--hl-sh-2)}
.hl-search input{flex:1;min-width:0;border:0;background:transparent;font:400 15px var(--hl-sans);color:var(--hl-ink);outline:none}
.hl-search input::placeholder{color:var(--hl-muted)}
.hl-kbd{font:400 12px var(--hl-mono);color:var(--hl-muted);background:var(--hl-tone);border-radius:6px;padding:2px 7px}
.hl-actions{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.hl-layout{max-width:1400px;margin:0 auto;box-sizing:border-box;padding:0 32px;display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.hl-nav{flex:0 1 224px;min-width:0}
.hl-main{flex:999 1 560px;min-width:0;max-width:800px;padding-bottom:72px}
.hl-aside{flex:0 1 300px;min-width:0;display:flex;flex-direction:column;gap:32px;padding-bottom:72px}
.hl-head{margin-left:calc(var(--hl-gutter) + var(--hl-gap))}
.hl-foot{max-width:1400px;margin:0 auto;box-sizing:border-box;padding:32px 32px 40px;display:flex;flex-wrap:wrap;gap:12px 24px;font-size:13px;color:var(--hl-muted)}
.hl-foot a{color:var(--hl-ink-2);text-decoration:none}
.hl-foot__release{margin-left:auto;font:400 12px var(--hl-mono)}

/* buttons: tonal, never outlined */
.hl-btn{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 14px;border:0;border-radius:var(--hl-r-btn);background:var(--hl-tone);color:var(--hl-ink);font:500 14px var(--hl-sans);text-decoration:none;cursor:pointer}
.hl-btn:hover{background:var(--hl-tone-2)}
.hl-btn.is-ghost{background:transparent;color:var(--hl-ink-2)}
.hl-btn.is-ghost:hover{background:var(--hl-tone)}
.hl-btn.is-strong{background:var(--hl-ink);color:var(--hl-bg)}
.hl-btn.is-on{background:var(--hl-link-wash);color:var(--hl-link)}

/* reserved slots for account-dependent parts (hydrated after load, fixed size, no layout shift) */
.hl-slot{display:inline-block;min-height:38px;border-radius:var(--hl-r-btn)}
.hl-slot--watch{width:92px}
.hl-slot--account{width:38px;border-radius:50%}
.hl-slot--export{display:block;width:100%;min-height:0}
.hl-slot:empty{background:transparent}
/* header (operator 2026-10-31 E): an empty reserved slot takes no room, so As of today · .md · .json sit together (nothing
   fills a slot until accounts exist; reinstate the reservation with them) */
.hl-actions>.hl-slot:empty{display:none}

/* ---------- 4. Trust line ---------- */
.hl-title{font:600 35px/1.2 var(--hl-serif);letter-spacing:-.012em;margin:0 0 14px}
.hl-trust{font:italic 400 16.5px/1.5 var(--hl-serif);color:var(--hl-ink-2);margin:0 0 18px}
.hl-trust.is-unverified{display:inline-block;color:var(--hl-warn-ink);background:var(--hl-warn);border-radius:var(--hl-r-row);padding:4px 10px}
.hl-trust.is-unverified a{color:inherit}

/* ---------- 5. Limits ---------- */
.hl-limits{background:var(--hl-tone);color:var(--hl-ink-2);border-radius:12px;margin:0 0 14px;font-size:13.5px}
.hl-limits>summary{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;min-height:40px;padding:4px 14px;cursor:pointer}
.hl-limits>summary::-webkit-details-marker{display:none}
.hl-limits__label{font-weight:600;color:var(--hl-ink)}
.hl-limits__more{margin-left:auto;color:var(--hl-muted)}
.hl-limits[open] .hl-limits__more{visibility:hidden}
.hl-limits dl{display:grid;grid-template-columns:112px minmax(0,1fr);gap:6px 14px;margin:0;padding:4px 14px 14px;line-height:1.45}
.hl-limits dt{color:var(--hl-muted)}
.hl-limits dd{margin:0}
.hl-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--hl-ok);margin-right:6px;transform:translateY(-1px)}
.hl-limits.is-warn{background:var(--hl-warn);color:var(--hl-warn-ink)}
.hl-limits.is-stop{background:var(--hl-stop);color:var(--hl-stop-ink)}
.hl-limits.is-info{background:var(--hl-info);color:var(--hl-info-ink)}
.hl-limits.is-warn .hl-limits__label,.hl-limits.is-stop .hl-limits__label,.hl-limits.is-info .hl-limits__label,
.hl-limits.is-warn dt,.hl-limits.is-stop dt,.hl-limits.is-info dt,
.hl-limits.is-warn .hl-limits__more,.hl-limits.is-stop .hl-limits__more,.hl-limits.is-info .hl-limits__more{color:inherit}
.hl-limits a{color:inherit}

/* ---------- 6. Banners (one at most, above the title) ---------- */
.hl-banner{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:flex-start;border-radius:var(--hl-r-card);padding:16px 18px;margin:0 0 26px}
.hl-banner__body{flex:1 1 320px;min-width:0}
.hl-banner__title{display:block;font-weight:600;font-size:16px;margin:0 0 3px}
.hl-banner__text{display:block;font-size:14px;line-height:1.5}
.hl-banner__act{flex:0 0 auto;display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:var(--hl-r-btn);background:var(--hl-surface);color:var(--hl-ink);font-size:14px;font-weight:500;text-decoration:none}
.hl-banner.is-info{background:var(--hl-info);color:var(--hl-info-ink)}
.hl-banner.is-warn{background:var(--hl-warn);color:var(--hl-warn-ink)}
.hl-banner.is-stop{background:var(--hl-stop);color:var(--hl-stop-ink)}
.hl-banner.is-calm{background:var(--hl-calm);color:var(--hl-calm-ink)}
.hl-banner a:not(.hl-banner__act){color:inherit}
/* stands in for text we do not hold — never filled with current text */
.hl-none{border-radius:12px;padding:16px;background:repeating-linear-gradient(135deg,var(--hl-tone) 0 6px,transparent 6px 12px);color:var(--hl-muted);font-size:14px}

/* ---------- 7. Version timeline (an ordered list of links; drawn as a track) ---------- */
.hl-timeline{background:var(--hl-tone);border-radius:var(--hl-r-panel);padding:14px 20px;margin:0 0 40px}
.hl-timeline__head{display:flex;justify-content:space-between;gap:12px;font-size:13px;margin-bottom:10px}
.hl-timeline__head b{font-weight:600}
.hl-timeline ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px;position:relative}
.hl-timeline li{position:relative;padding-top:20px;font:400 12px var(--hl-mono);color:var(--hl-ink-2)}
.hl-timeline li::before{content:"";position:absolute;left:0;top:3px;width:13px;height:13px;border-radius:50%;background:var(--hl-surface);box-shadow:inset 0 0 0 2px var(--hl-muted)}
.hl-timeline li.is-shown{color:var(--hl-ink);font-weight:500}
.hl-timeline li.is-shown::before{background:var(--hl-ink);box-shadow:none}
.hl-timeline li.is-date{color:var(--hl-muted)}
.hl-timeline li.is-date::before{width:3px;left:5px;border-radius:2px;background:var(--hl-muted);box-shadow:none}
.hl-timeline li.is-viewing{color:var(--hl-link);font-weight:500}
.hl-timeline li.is-viewing::before{width:3px;left:5px;border-radius:2px;background:var(--hl-link);box-shadow:none}
.hl-timeline a{color:inherit;text-decoration:none}
.hl-timeline a:hover{text-decoration:underline}

/* date picker: a GET form (?at=YYYY-MM-DD); script only opens it as a popover */
.hl-datepick{background:var(--hl-surface);border-radius:var(--hl-r-card);box-shadow:var(--hl-sh-2);padding:16px;width:min(340px,100%);box-sizing:border-box}
.hl-datepick label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}
/* the aside's one versions/date block (operator 2026-10-31 D): version count + compare link on top, in the aside's width */
.hl-datepick.is-versions{width:100%}
.hl-datepick__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13px;margin:0 0 12px}
.hl-datepick__head b{font-weight:600}
.hl-datepick a.hl-datepick__cmp{display:inline;padding:0;border-radius:0;color:var(--hl-link);font-size:13px;text-decoration:none}
.hl-datepick a.hl-datepick__cmp:hover{background:none;text-decoration:underline}
.hl-datepick.is-versions label{font-weight:500;color:var(--hl-ink-2)}
.hl-datepick__row{display:flex;gap:8px;margin-bottom:12px}
.hl-datepick input[type=date]{flex:1;min-width:0;height:42px;border:0;border-radius:var(--hl-r-btn);background:var(--hl-tone);padding:0 12px;font:400 15px var(--hl-mono);color:var(--hl-ink)}
.hl-datepick__cap{font:600 12px var(--hl-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--hl-muted);margin:10px 0 4px 12px}
.hl-datepick a{display:flex;justify-content:space-between;gap:12px;padding:9px 12px;border-radius:var(--hl-r-btn);color:var(--hl-ink);text-decoration:none;font-size:14px}
.hl-datepick a:hover,.hl-datepick a[aria-current]{background:var(--hl-tone)}
.hl-datepick a span{font:400 12.5px var(--hl-mono);color:var(--hl-muted)}

/* ---------- 8. Provision tree ---------- */
.hl-text{font:400 19px/1.62 var(--hl-serif)}
.hl-text p{margin:0}
/* the phone never scrolls sideways (found by lane design-fixes-pre-switch): an unbroken token (a long URL in an L3 footnote)
   breaks only where it cannot fit a line by itself; a code block scrolls inside its own box */
.hl-text,.hl-main{overflow-wrap:break-word}
.hl-main pre{overflow-x:auto;max-width:100%}
.hl-text p+p{margin-top:12px}
/* a small gap (about half a line) between numbered items of the text: recitals and numbered lists (operator 2026-10-31) */
.hl-text ol>li+li{margin-top:.8em}
.hl-block{display:grid;grid-template-columns:var(--hl-gutter) minmax(0,1fr);column-gap:var(--hl-gap);border-radius:10px;padding:3px 12px 3px 0;position:relative;scroll-margin-top:100px}
.hl-block+.hl-block.is-para{margin-top:22px}
/* the number column holds only the number (.hl-addr): text without a number sits in the text column; bare anchors take no cell */
.hl-block>.hl-addr{grid-column:1}
.hl-block>:not(.hl-addr):not(.hl-copy){grid-column:2}
.hl-block>a[id]:not(.hl-addr){position:absolute;width:0;height:0}
.hl-addr{font:400 12.5px/31px var(--hl-mono);color:var(--hl-muted);text-align:right;text-decoration:none;white-space:nowrap}
.hl-addr:hover{color:var(--hl-link)}
.hl-n{font-weight:600;margin-right:6px}
.hl-point{display:grid;grid-template-columns:44px minmax(0,1fr)}
.hl-point.is-l2{margin-left:44px}
.hl-point.is-l3{margin-left:88px}
.hl-point>b{font-weight:600}
.hl-note{color:var(--hl-muted)}
.hl-note a{color:inherit}
.hl-block:target{background:var(--hl-link-wash);padding-top:12px;padding-bottom:14px}
.hl-block:target .hl-addr{color:var(--hl-link);font-weight:500}
/* copy bar: visible on hover, keyboard focus and :target; plain links without script */
.hl-copy{position:absolute;right:12px;top:-20px;display:none;gap:2px;background:var(--hl-ink);border-radius:var(--hl-r-btn);padding:3px;box-shadow:var(--hl-sh-2)}
.hl-block:hover .hl-copy,.hl-block:focus-within .hl-copy,.hl-block:target .hl-copy{display:flex}
.hl-copy a,.hl-copy button{border:0;border-radius:8px;background:transparent;color:var(--hl-bg);font:500 13px var(--hl-sans);padding:7px 12px;text-decoration:none;cursor:pointer}
.hl-copy small{font:400 12px var(--hl-mono);opacity:.7;margin-left:4px}
.hl-text.is-unverified{color:var(--hl-ink-2)}
.hl-text.is-unverified .hl-block{grid-template-columns:10px minmax(0,1fr)}
.hl-text.is-unverified .hl-addr{font-size:0;border-radius:5px;background:repeating-linear-gradient(135deg,var(--hl-warn) 0 6px,transparent 6px 12px)}
.hl-text.is-unverified .hl-copy{display:none}
/* tables: zebra by tone, merged cells keep rowspan/colspan, scroll inside their own box */
.hl-scroll{overflow-x:auto;margin:12px 0}
.hl-table{border-collapse:separate;border-spacing:0 6px;font:400 16px/1.5 var(--hl-serif);min-width:100%}
.hl-table th,.hl-table td{text-align:left;vertical-align:top;padding:10px 14px}
.hl-table thead th{font-weight:600;background:var(--hl-tone)}
.hl-table tbody tr:nth-child(even)>*{background:var(--hl-bg)}
.hl-table tr>:first-child{border-radius:10px 0 0 10px}
.hl-table tr>:last-child{border-radius:0 10px 10px 0}

/* defined terms and popover (popover is script-enhanced; the link works alone) */
.hl-term{color:inherit;text-decoration:underline dotted var(--hl-uline);text-decoration-thickness:1.5px;text-underline-offset:4px}
.hl-term:hover,.hl-term:focus{color:var(--hl-link)}
.hl-pop{width:min(440px,90vw);box-sizing:border-box;background:var(--hl-surface);color:var(--hl-ink);border-radius:var(--hl-r-panel);box-shadow:var(--hl-sh-2);padding:16px 18px;font:400 14px/1.5 var(--hl-sans)}
.hl-pop__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}
.hl-pop__head b{font-weight:600}
.hl-pop__head span{font:400 12px var(--hl-mono);color:var(--hl-muted)}
.hl-pop__text{font:400 16px/1.55 var(--hl-serif)}
.hl-pop a{display:inline-block;margin-top:10px;font-size:13px;text-decoration:none}

/* ---------- 9. Info block (Level 2 and Level 3) ---------- */
.hl-info{display:grid;grid-template-columns:190px minmax(0,1fr);background:var(--hl-surface);border-radius:var(--hl-r-card);box-shadow:var(--hl-sh-1);padding:10px 22px;margin:0 0 36px;font-size:14.5px;line-height:1.5}
.hl-info dt{color:var(--hl-muted);padding:9px 0}
.hl-info dd{margin:0;padding:9px 0}
.hl-info dd.is-empty{color:var(--hl-muted)}
.hl-info a{text-decoration:none}
/* a long legal-nature tag wraps inside the info block (it pushed the phone page sideways; found by lane design-fixes-pre-switch) */
.hl-info .hl-tag{white-space:normal}

/* ---------- 10. Related panel ---------- */
.hl-cap{font:600 12px var(--hl-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--hl-muted);margin:0 0 6px}
.hl-cap span{font:400 12px var(--hl-mono);letter-spacing:0}
.hl-row{display:flex;gap:12px;align-items:baseline;padding:8px 10px;margin:0 -10px;border-radius:var(--hl-r-row);color:var(--hl-ink);text-decoration:none;font-size:14px;line-height:1.4}
.hl-row:hover{background:var(--hl-tone)}
.hl-row__k{font:400 12px var(--hl-mono);color:var(--hl-muted);flex:0 0 auto;min-width:56px}
.hl-empty{font-size:14px;line-height:1.5;color:var(--hl-ink-2);margin:0}
.hl-empty.is-failed{color:var(--hl-stop-ink);background:var(--hl-stop);border-radius:var(--hl-r-row);padding:8px 10px}
.hl-data{background:var(--hl-tone);border-radius:var(--hl-r-panel);padding:14px 16px;font-size:13px;line-height:1.9}
.hl-data a{display:block;font:400 12.5px var(--hl-mono);text-decoration:none}

/* ---------- 11. Search ---------- */
.hl-result{display:block;padding:18px 22px;border-radius:var(--hl-r-card);text-decoration:none;color:var(--hl-ink)}
.hl-result:hover{background:var(--hl-surface);box-shadow:var(--hl-sh-1)}
.hl-result__cite{font:500 13px var(--hl-mono);color:var(--hl-link)}
.hl-result__where{font-size:13px;color:var(--hl-muted)}
.hl-result__snip{font:400 17px/1.55 var(--hl-serif);color:var(--hl-ink-2);margin-top:6px}
.hl-result__meta{font-size:13px;color:var(--hl-muted);margin-top:8px}
.hl-result__meta .is-warn{color:var(--hl-warn-ink);background:var(--hl-warn);border-radius:6px;padding:1px 7px}
.hl-result mark{background:var(--hl-mark);color:inherit;border-radius:3px;padding:0 2px}
.hl-cov{margin:8px 0 0;padding:0 0 0 18px;font-size:14px;line-height:1.7;color:var(--hl-ink-2)}

/* ---------- 12. Compare ---------- */
ins{text-decoration:underline;text-decoration-color:var(--hl-ins-line);text-decoration-thickness:2px;text-underline-offset:4px;background:var(--hl-ins);border-radius:4px;padding:1px 2px}
del{color:var(--hl-del-ink);background:var(--hl-del);border-radius:4px;padding:1px 2px}

/* ---------- 13. Imprint ---------- */
.hl-imprint{display:grid;grid-template-columns:240px minmax(0,1fr);gap:0 28px;background:var(--hl-surface);border-radius:20px;box-shadow:var(--hl-sh-1);padding:14px 30px 26px;margin:0;font-size:16px;line-height:1.6}
.hl-imprint dt{color:var(--hl-muted);padding:14px 0 0;font-size:14.5px}
.hl-imprint dd{margin:0;padding:14px 0 0}

/* ---------- 14. Phone ---------- */
@media (max-width:720px){
  .hl-top__in{padding:8px 16px 18px}
  .hl-layout,.hl-foot{padding-left:16px;padding-right:16px}
  .hl-title{font-size:27px;line-height:1.22}
  .hl-trust{font-size:15px}
  .hl-head{margin-left:0}
  .hl-text{font-size:18px;line-height:1.6}
  .hl-block{grid-template-columns:minmax(0,1fr);padding-right:0}
  .hl-block>.hl-addr,.hl-block>:not(.hl-addr):not(.hl-copy){grid-column:1}
  .hl-addr{order:-1;text-align:right;line-height:20px}
  .hl-point.is-l2{margin-left:24px} .hl-point.is-l3{margin-left:48px}
  .hl-copy{position:static;display:flex;flex-wrap:wrap;margin-top:12px;background:transparent;box-shadow:none;padding:0;gap:8px}
  .hl-copy a,.hl-copy button{background:var(--hl-ink);min-height:44px;border-radius:12px}
  .hl-block:not(:target) .hl-copy{display:none}
  .hl-info,.hl-imprint,.hl-limits dl{grid-template-columns:minmax(0,1fr)}
  .hl-info dt,.hl-imprint dt{padding-bottom:0}
  .hl-btn{min-height:44px}
  .hl-nav{display:none}
}

/* ---------- 15. Print: the text, its addresses and its trust line ---------- */
@media print{
  :root{--hl-bg:#fff;--hl-ink:#000;--hl-ink-2:#222;--hl-muted:#444}
  .hl-top,.hl-nav,.hl-aside,.hl-actions,.hl-copy,.hl-slot,.hl-timeline,.hl-search{display:none!important}
  .hl-text{font-size:11pt}
  .hl-limits{background:none;padding:0}
  .hl-limits dl{display:grid}
  .hl-main a[href^="http"]::after{content:" <" attr(href) ">";font:9pt var(--hl-mono)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
/* =====================================================================
   v2 — 18 Oct 2026: L2 article and annex views, source line, front door
   ===================================================================== */

/* ---------- 16. Document context (L2 article and annex views) ---------- */
/* Which act this article belongs to: path, act name and date, the act's official title in full, and the way back. */
.hl-context{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;align-items:start;background:var(--hl-tone);border-radius:var(--hl-r-card);padding:14px 18px 16px;margin:0 0 26px}
.hl-crumbs{grid-column:1/-1;margin:0 0 4px;font-size:13px;color:var(--hl-muted)}
.hl-crumbs a{color:inherit;text-decoration:none}
.hl-crumbs a:hover{color:var(--hl-link);text-decoration:underline}
.hl-context__act{display:block;font:600 18px/1.35 var(--hl-serif);color:var(--hl-ink);text-decoration:none}
.hl-context__act:hover{color:var(--hl-link)}
.hl-context__act span{font-weight:400;color:var(--hl-ink-2)}
.hl-context__title{margin:2px 0 0;font:400 15px/1.5 var(--hl-serif);color:var(--hl-ink-2)}
.hl-context__side{display:flex;flex-direction:column;align-items:flex-end;gap:8px;padding-top:2px}
.hl-context__pos{font:400 12.5px var(--hl-mono);color:var(--hl-muted);white-space:nowrap}
.hl-btn.is-surface{background:var(--hl-surface);box-shadow:var(--hl-sh-1)}
.hl-btn.is-surface:hover{box-shadow:var(--hl-sh-2)}

/* ---------- 17. Source line (L2 and L3) ---------- */
/* Text = page.source_line, byte for byte. The renderer may wrap the legal-nature segment(s) in .hl-nature and the
   trailing [lifecycle] in .hl-source__life; it never adds, drops or reorders words. Sits between title and trust line. */
.hl-source{max-width:76ch;margin:-4px 0 8px;font:400 15.5px/1.6 var(--hl-sans);color:var(--hl-ink-2)}
.hl-source+.hl-trust{margin-top:0}
.hl-nature{font-weight:600;color:var(--hl-ink);white-space:nowrap}
.hl-source__life{color:var(--hl-muted)}
.hl-source__quote{font-family:var(--hl-serif);color:var(--hl-ink)}
/* not law: a quiet blue label; draft / not adopted: amber. Law (binding) stays plain, like Level 1. */
.hl-source.is-not-law .hl-nature,.hl-tag.is-not-law,.hl-pin.is-not-law{background:var(--hl-info);color:var(--hl-info-ink)}
.hl-source.is-draft .hl-nature,.hl-tag.is-draft,.hl-pin.is-draft{background:var(--hl-warn);color:var(--hl-warn-ink)}
.hl-source.is-not-law .hl-nature,.hl-source.is-draft .hl-nature{border-radius:6px;padding:1px 7px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* the same nature, as a tag in lists and info blocks, and pinned in the sticky header while the page scrolls */
.hl-tag{display:inline-block;border-radius:6px;padding:1px 7px;font:600 12.5px/1.5 var(--hl-sans);white-space:nowrap;background:var(--hl-tone);color:var(--hl-ink-2)}
.hl-tag.is-law{background:var(--hl-tone);color:var(--hl-ink)}
.hl-pin{display:inline-flex;align-items:center;min-height:30px;padding:0 10px;border-radius:9px;font:600 13px var(--hl-sans);white-space:nowrap;text-decoration:none}

/* ---------- 18. Info block v2: attribution first, dates as a list ---------- */
.hl-info dt.is-gap,.hl-info dt.is-gap+dd{padding-top:22px}
.hl-info .hl-dates{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:3px 14px;margin:0}
.hl-info .hl-dates dt,.hl-info .hl-dates dd{padding:0}
.hl-info .hl-dates dt{color:var(--hl-ink-2)}
.hl-info .hl-dates dd{font-variant-numeric:tabular-nums}
.hl-info strong{font-weight:600}
/* on article views the act's info block folds away; the context card and source line already say what the act is */
.hl-about{margin:0 0 30px}
.hl-about>summary{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border-radius:var(--hl-r-btn);background:var(--hl-tone);font-size:14px;font-weight:500;cursor:pointer;list-style:none}
.hl-about>summary::-webkit-details-marker{display:none}
.hl-about>summary::after{content:"";width:7px;height:7px;border-right:2px solid var(--hl-muted);border-bottom:2px solid var(--hl-muted);transform:translateY(-2px) rotate(45deg)}
.hl-about[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.hl-about[open]>.hl-info{margin-top:12px}

/* ---------- 19. Contents column, pager, unit headings ---------- */
.hl-toc{position:sticky;top:96px;max-height:calc(100vh - 120px);overflow:auto;overflow-x:hidden;padding:0 6px 24px 0;font-size:13.5px;line-height:1.35}
/* L1 article contents (operator 2026-10-31 C/H): the act's titles folded, the current one open; in the page flow (no box
   scrollbar), starting below the headline */
.hl-toc--l1{position:static;max-height:none;overflow:visible;margin-top:128px;padding-right:0}
.hl-toc--l1.is-below-banner{margin-top:250px}
.hl-toc__part>summary,.hl-toc__ch>summary{list-style:none;cursor:pointer;display:flex;gap:8px;padding:6px 10px;margin:0 -10px;border-radius:var(--hl-r-row);color:var(--hl-ink-2)}
.hl-toc__part>summary::-webkit-details-marker,.hl-toc__ch>summary::-webkit-details-marker{display:none}
.hl-toc__part>summary::before,.hl-toc__ch>summary::before{content:"";flex:0 0 auto;width:0;height:0;margin-top:5px;border:4px solid transparent;border-left:5px solid var(--hl-muted);border-right:0;transition:transform .15s}
.hl-toc__part[open]>summary::before,.hl-toc__ch[open]>summary::before{transform:rotate(90deg)}
.hl-toc__part>summary:hover,.hl-toc__ch>summary:hover{background:var(--hl-tone);color:var(--hl-ink)}
.hl-toc__part[open]>summary{color:var(--hl-ink);font-weight:600}
.hl-toc__ch{margin-left:13px}
.hl-toc__ch>summary{font-size:12.5px;color:var(--hl-muted)}
.hl-toc__ch[open]>summary{color:var(--hl-ink-2);font-weight:500}
.hl-toc__part>ol,.hl-toc__ch>ol{margin:2px 0 6px 13px}
.hl-toc ol{list-style:none;margin:0;padding:0}
.hl-toc a{display:flex;gap:10px;padding:6px 10px;margin:0 -10px;border-radius:var(--hl-r-row);color:var(--hl-ink-2);text-decoration:none}
.hl-toc a:hover{background:var(--hl-tone);color:var(--hl-ink)}
.hl-toc a[aria-current]{background:var(--hl-link-wash);color:var(--hl-ink);font-weight:500}
.hl-toc__n{flex:0 0 auto;min-width:30px;font:400 12px/1.6 var(--hl-mono);color:var(--hl-muted)}
.hl-toc__grp{margin:14px 0 4px;font-size:12.5px;font-weight:600;color:var(--hl-muted)}
.hl-toc__act{display:block;margin:0 0 14px;font:600 14px/1.35 var(--hl-sans);color:var(--hl-ink);text-decoration:none}
.hl-toc__act:hover{color:var(--hl-link)}
.hl-toc-m{display:none}
.hl-pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:56px 0 0}
.hl-pager a{display:block;padding:14px 18px;border-radius:var(--hl-r-card);background:var(--hl-surface);box-shadow:var(--hl-sh-1);color:var(--hl-ink);text-decoration:none}
.hl-pager a:hover{box-shadow:var(--hl-sh-2)}
.hl-pager small{display:block;margin:0 0 3px;font-size:12.5px;color:var(--hl-muted)}
.hl-pager b{font:600 16px/1.35 var(--hl-serif)}
.hl-pager .is-next{grid-column:2;text-align:right}
.hl-pager__all{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px;margin-top:6px;font-size:14px;color:var(--hl-muted)}
.hl-pager__all a{display:inline;padding:0;background:none;box-shadow:none;color:var(--hl-link);font-weight:500}
/* act page: each article and annex heading opens its own page */
.hl-unit-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:44px 0 16px;font:600 22px/1.3 var(--hl-serif);scroll-margin-top:100px}
.hl-unit-head>a:first-child{color:inherit;text-decoration:none}
.hl-unit-head>a:first-child:hover{text-decoration:underline;text-decoration-color:var(--hl-uline);text-underline-offset:5px}
.hl-unit-head__open{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:8px;background:var(--hl-tone);color:var(--hl-ink-2);font:500 13px var(--hl-sans);text-decoration:none}
.hl-unit-head__open:hover{background:var(--hl-tone-2);color:var(--hl-ink)}
.hl-row__scope{flex:0 0 auto;margin-left:auto;font-size:12px;color:var(--hl-muted)}

/* ---------- 20. Home ---------- */
.hl-links{margin-left:auto;display:flex;flex-wrap:wrap;gap:4px}
.hl-links a{display:inline-flex;align-items:center;min-height:38px;padding:0 12px;border-radius:var(--hl-r-btn);color:var(--hl-ink-2);text-decoration:none;font-size:14.5px}
.hl-links a:hover{background:var(--hl-tone);color:var(--hl-ink)}
.hl-wrap{max-width:1180px;margin:0 auto;box-sizing:border-box;padding:0 32px 72px}
.hl-hero{max-width:780px;margin:44px auto 72px;text-align:center}
.hl-hero h1{margin:0 0 16px;font:600 52px/1.08 var(--hl-serif);letter-spacing:-.02em}
.hl-hero>p{max-width:62ch;margin:0 auto 30px;font-size:18px;line-height:1.55;color:var(--hl-ink-2)}
.hl-search.is-hero{max-width:none;height:60px;padding:0 8px 0 20px;border-radius:20px}
.hl-search.is-hero input{font-size:17px}
.hl-search__go{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:12px;background:var(--hl-ink);color:var(--hl-bg);cursor:pointer}
.hl-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0 0}
.hl-chip{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border-radius:8px;background:var(--hl-tone);color:var(--hl-ink-2);font:400 13px var(--hl-mono);text-decoration:none}
.hl-chip:hover{background:var(--hl-tone-2);color:var(--hl-ink)}
.hl-group{margin:0 0 36px}
.hl-acts{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.hl-act{display:flex;flex-direction:column;gap:2px;padding:16px 18px;border-radius:var(--hl-r-card);background:var(--hl-surface);box-shadow:var(--hl-sh-1);color:var(--hl-ink);text-decoration:none}
.hl-act:hover{box-shadow:var(--hl-sh-2)}
.hl-act b{font:600 17px/1.3 var(--hl-sans)}
.hl-act span{font-size:14px;line-height:1.4;color:var(--hl-ink-2)}
.hl-act small{margin-top:auto;padding-top:8px;font:400 12px var(--hl-mono);color:var(--hl-muted)}
.hl-act__cov{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px;font-size:12.5px;color:var(--hl-muted)}
.hl-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin:8px 0 48px}
.hl-tile{display:block;padding:18px 22px;border-radius:var(--hl-r-card);background:var(--hl-tone);color:var(--hl-ink);text-decoration:none}
.hl-tile b{display:block;margin:0 0 4px;font:600 17px var(--hl-sans)}
.hl-tile p{margin:0;font-size:14.5px;line-height:1.5;color:var(--hl-ink-2)}
.hl-tile code{font:400 13px var(--hl-mono)}
.hl-fine{max-width:76ch;font-size:14px;line-height:1.6;color:var(--hl-ink-2)}
.hl-fine h2{margin:28px 0 6px;font:600 15px var(--hl-sans);color:var(--hl-ink)}
.hl-fine p{margin:0 0 8px}

/* ---------- 21. Act landing and document lists ---------- */
.hl-eyebrow{margin:0 0 8px;font:400 12.5px var(--hl-mono);color:var(--hl-muted)}
.hl-eyebrow a{color:inherit;text-decoration:none}
.hl-keydates{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;margin:4px 0 36px}
.hl-keydate{padding:10px 14px;border-radius:12px;background:var(--hl-tone)}
.hl-keydate small{display:block;font-size:12.5px;color:var(--hl-ink-2)}
.hl-keydate b{display:block;margin:2px 0;font:500 15px var(--hl-mono)}
.hl-keydate span{font-size:12.5px;color:var(--hl-muted)}
.hl-part{margin:0 0 8px;border-radius:var(--hl-r-card);background:var(--hl-surface);box-shadow:var(--hl-sh-1)}
.hl-part>summary{display:flex;align-items:baseline;gap:14px;min-height:28px;padding:14px 18px;list-style:none;cursor:pointer}
.hl-part>summary::-webkit-details-marker{display:none}
.hl-part__k{flex:0 0 auto;min-width:64px;font:400 12.5px var(--hl-mono);color:var(--hl-muted)}
.hl-part__t{flex:1;min-width:0;font:500 16px/1.35 var(--hl-sans)}
.hl-part__r{flex:0 0 auto;font:400 12px var(--hl-mono);color:var(--hl-muted)}
.hl-part__body{padding:0 18px 16px 96px}
.hl-chapter{margin:12px 0 4px;font-size:13px;font-weight:600;color:var(--hl-ink-2)}
.hl-art{display:flex;gap:14px;align-items:baseline;padding:5px 8px;margin:0 -8px;border-radius:var(--hl-r-row);color:var(--hl-ink);text-decoration:none;font-size:14.5px;line-height:1.4}
.hl-art:hover{background:var(--hl-tone)}
.hl-art>span:first-child{flex:0 0 auto;min-width:30px;font:400 12.5px var(--hl-mono);color:var(--hl-muted)}
.hl-art em{font-style:normal;font-size:12.5px;color:var(--hl-muted)}
.hl-pills{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.hl-pill{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;border-radius:9px;background:var(--hl-tone);color:var(--hl-ink);font-size:13.5px;text-decoration:none}
.hl-pill span{font:400 12px var(--hl-mono);color:var(--hl-muted)}
.hl-pill:hover{background:var(--hl-tone-2)}
.hl-doc{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:2px 14px;padding:9px 10px;margin:0 -10px;border-radius:var(--hl-r-row);color:var(--hl-ink);text-decoration:none;font-size:14px;line-height:1.4}
.hl-doc:hover{background:var(--hl-tone)}
.hl-doc__k{grid-row:span 2;min-width:76px;font:400 12px/1.7 var(--hl-mono);color:var(--hl-muted)}
.hl-doc__meta{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;font-size:12.5px;color:var(--hl-muted)}
.hl-more{display:inline-block;margin-top:8px;font-size:14px;font-weight:500;text-decoration:none}
/* act landing side column (operator 2026-10-31 B): Level 2 and Level 3 as two cards in the column's full width; one key
   column width so every row's title starts at the same place */
.hl-layer{background:var(--hl-surface);border-radius:var(--hl-r-card);box-shadow:var(--hl-sh-1);padding:18px 22px 16px}
.hl-layer .hl-doc{grid-template-columns:156px minmax(0,1fr)}
.hl-layer .hl-doc__k{min-width:0;overflow-wrap:anywhere}

/* ---------- 22. Search page ---------- */
.hl-searchpage{display:grid;grid-template-columns:220px minmax(0,1fr);gap:40px;align-items:start}
.hl-filters fieldset{margin:0 0 22px;padding:0;border:0;min-width:0}
.hl-filters legend{padding:0;margin:0 0 6px;font:600 12px var(--hl-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--hl-muted)}
.hl-check{display:flex;align-items:flex-start;gap:10px;padding:7px 0;font-size:15px;line-height:1.35;cursor:pointer}
.hl-check input{flex:0 0 auto;width:18px;height:18px;margin:1px 0 0;accent-color:var(--hl-link)}
.hl-check span{font:400 12px var(--hl-mono);color:var(--hl-muted)}
.hl-filters input[type=date]{width:100%;box-sizing:border-box;height:42px;border:0;border-radius:var(--hl-r-btn);background:var(--hl-tone);padding:0 12px;font:400 15px var(--hl-mono);color:var(--hl-ink)}
.hl-filters details>summary{display:inline-block;margin-top:4px;font-size:14px;color:var(--hl-link);cursor:pointer;list-style:none}
.hl-filters-m{display:none}
.hl-result__source{margin-top:4px;font-size:13.5px;line-height:1.5;color:var(--hl-ink-2)}
.hl-result__title{display:block;margin-top:4px;font:500 17px/1.4 var(--hl-sans);color:var(--hl-ink)}

/* ---------- 23. Error pages ---------- */
.hl-error{max-width:640px;margin:48px auto 96px;padding:0 16px}
.hl-error .hl-path{display:inline-block;margin:0 0 18px;padding:4px 10px;border-radius:8px;background:var(--hl-tone);font:400 14px var(--hl-mono);color:var(--hl-ink-2);word-break:break-all}
.hl-error p{font-size:16px;line-height:1.6;color:var(--hl-ink-2);margin:0 0 14px}
.hl-error .hl-search{max-width:none;margin:24px 0 16px}
.hl-error__links{display:flex;flex-wrap:wrap;gap:8px}

/* ---------- 24. Phone and print for v2 ---------- */
@media (max-width:720px){
  .hl-context{grid-template-columns:minmax(0,1fr);padding:12px 14px 14px;margin-bottom:20px}
  .hl-context__side{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between}
  .hl-source{font-size:15px}
  .hl-context__title{font-size:14px}
  .hl-info dd{padding-top:2px}
  .hl-info dt.is-gap{padding-top:22px}
  .hl-info dt.is-gap+dd{padding-top:2px}
  .hl-toc-m{display:block;margin:0 0 22px}
  .hl-toc-m>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;padding:0 14px;border-radius:12px;background:var(--hl-tone);font-size:15px;font-weight:500;list-style:none;cursor:pointer}
  .hl-toc-m>summary::-webkit-details-marker{display:none}
  .hl-toc-m>summary span{font:400 12.5px var(--hl-mono);color:var(--hl-muted)}
  .hl-toc-m .hl-toc{position:static;max-height:none;padding:10px 12px 4px}
  .hl-toc-m .hl-toc a{min-height:40px;align-items:center}
  .hl-pager{grid-template-columns:minmax(0,1fr)}
  .hl-pager .is-next{grid-column:1;text-align:left}
  .hl-unit-head{font-size:20px}
  .hl-wrap{padding:0 16px 56px}
  .hl-hero{margin:20px auto 44px;text-align:left}
  .hl-hero h1{font-size:36px}
  .hl-hero>p{font-size:16.5px;margin-bottom:22px}
  .hl-chips{justify-content:flex-start}
  .hl-search.is-hero{height:56px;padding-left:16px}
  .hl-links{display:none}
  .hl-part__body{padding:0 14px 14px 14px}
  .hl-part>summary{padding:14px}
  .hl-part__k{min-width:0}
  .hl-searchpage{grid-template-columns:minmax(0,1fr);gap:0}
  .hl-filters{display:none}
  .hl-filters-m{display:block;margin:0 0 14px}
  .hl-filters-m>summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:12px;background:var(--hl-tone);font-size:15px;font-weight:500;list-style:none;cursor:pointer}
  .hl-filters-m>summary::-webkit-details-marker{display:none}
  .hl-filters-m .hl-filters{display:block;padding:14px 4px 0}
  .hl-result{padding:16px 4px}
  .hl-check{min-height:44px;box-sizing:border-box;padding:11px 0}
}
@media print{
  .hl-context{background:none;padding:0}
  .hl-context__side,.hl-pager,.hl-toc,.hl-toc-m,.hl-pin,.hl-unit-head__open,.hl-filters,.hl-filters-m{display:none!important}
  .hl-source .hl-nature{background:none!important;color:#000!important;padding:0!important;text-decoration:underline}
  .hl-about>.hl-info{display:grid}
}
.hl-main>.hl-crumbs{margin-bottom:8px}
/* v2.1 (18 Oct 2026) contrast fix: light underline token reaches 3:1 on bg, surface and tone (was #9A9DA6, 2.53:1). See docs/contrast-audit.md. */
:root{--hl-uline:#84878F}
/* ---------- 25. Reading layout (operator's mobile review 2026-10-31 16:24; lane design-fixes-2) ---------- */
/* 1. one head line (status · Official source); the rest of the head in the folded `About this text` panel, the aside's
   first block (on a phone the aside follows the text, so the panel comes after the article) */
.hl-trust.is-head{margin:0 0 22px}
.hl-trust__about{display:none}
.hl-abt{background:var(--hl-tone);border-radius:var(--hl-r-card);font-size:14px;line-height:1.5}
.hl-abt>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 16px;font-weight:600;color:var(--hl-ink);cursor:pointer;border-radius:var(--hl-r-card)}
.hl-abt>summary::-webkit-details-marker{display:none}
.hl-abt>summary::after{content:"";flex:0 0 auto;width:7px;height:7px;border-right:2px solid var(--hl-muted);border-bottom:2px solid var(--hl-muted);transform:translateY(-2px) rotate(45deg)}
.hl-abt[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.hl-abt>summary:hover{background:var(--hl-tone-2)}
.hl-abt__body{padding:2px 16px 16px}
.hl-abt .hl-source{margin:0 0 10px;font-size:14px;line-height:1.55}
.hl-abt__trust{margin:0 0 12px;color:var(--hl-ink-2)}
.hl-abt .hl-limits{background:var(--hl-surface);margin:0 0 12px;font-size:13px}
.hl-abt .hl-limits dl{grid-template-columns:minmax(0,1fr)}
.hl-abt .hl-info{grid-template-columns:minmax(0,1fr);margin:0;padding:8px 14px;box-shadow:none;font-size:13.5px}
.hl-abt .hl-info dt{padding:8px 0 0}
.hl-abt .hl-info dd{padding:1px 0 4px}
.hl-abt .hl-info dt.is-gap{padding-top:14px}
.hl-abt .hl-info dt.is-gap+dd{padding-top:1px}
.hl-abt .hl-cap{margin:14px 0 6px}
/* 4. surfaces: the text on a white raised tile; navigation (contents, previous / next, related) on tinted tiles */
.hl-text.is-tile{background:var(--hl-surface);border-radius:var(--hl-r-card);box-shadow:var(--hl-sh-1);padding:28px 32px 32px 20px}
.hl-text.is-tile>:first-child{margin-top:0}
/* the L1 contents tile starts below the head (a title of two lines included), below a banner lower by the banner */
.hl-toc--l1{margin-top:150px}
.hl-toc--l1.is-below-banner{margin-top:272px}
.hl-nav>.hl-toc{background:var(--hl-tone);border-radius:var(--hl-r-card);padding:16px 18px 14px}
.hl-nav>.hl-toc a:hover,.hl-nav>.hl-toc .hl-toc__part>summary:hover,.hl-nav>.hl-toc .hl-toc__ch>summary:hover{background:var(--hl-tone-2)}
.hl-nav>.hl-toc a[aria-current]{background:var(--hl-surface)}
.hl-aside>section:not(.hl-data):not(.hl-layer):not(.hl-map__panel):not(.ui-tile){background:var(--hl-tone);border-radius:var(--hl-r-card);padding:14px 16px}
.hl-aside>section .hl-row:hover{background:var(--hl-tone-2)}
/* 3. previous / next: two tinted tiles under the text, side by side (stacked on a phone) */
.hl-pager{margin:20px 0 0;gap:12px}
.hl-pager>a{background:var(--hl-tone);box-shadow:none;padding:14px 18px 16px}
.hl-pager>a:hover{background:var(--hl-tone-2);box-shadow:none}
.hl-pager__where{grid-column:1/-1;grid-row:1;margin:0 0 -2px;font-size:13.5px;line-height:1.45;color:var(--hl-muted)}
.hl-pager__where a{display:inline;padding:0;border-radius:0;background:none;box-shadow:none;color:var(--hl-ink-2);text-decoration:underline;text-decoration-color:var(--hl-uline)}
.hl-pager small{font-weight:500}
.hl-pager b{display:block}
/* the page's Related lists (definitions used, related Level 1 / 2 / 3): a tinted tile under the text */
.hl-reltile{box-sizing:border-box;width:100%;margin:20px 0 0;padding:6px 22px 18px;background:var(--hl-tone);border-radius:var(--hl-r-card);font-size:15px;line-height:1.5}
.hl-reltile h2,.hl-reltile h3{margin:14px 0 6px;font:600 12px var(--hl-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--hl-muted)}
.hl-reltile ul{margin:0;padding:0 0 0 18px}
.hl-reltile li+li{margin-top:4px}
/* 2. a small gap between numbered paragraphs, recitals and list items (about a third of a line), not a blank line */
.hl-block+.hl-block.is-para{margin-top:6px}
.hl-text ol>li+li{margin-top:.55em}
@media (max-width:720px){
  .hl-aside{flex-basis:100%}
  /* the aside (About this text first) follows the text on a phone: no long empty run between them */
  .hl-layout>.hl-main{padding-bottom:8px}
  .hl-trust__about{display:inline;margin-left:4px;font:500 13.5px var(--hl-sans);font-style:normal}
  .hl-text.is-tile{padding:16px 16px 20px;border-radius:14px}
  /* the paragraph's number sits at the right of its first line, not on a line of its own */
  .hl-block{display:block}
  .hl-block>.hl-addr{float:right;margin:0 0 0 10px;line-height:28.8px}
  /* a point flows around that number too: its label hangs in a 44 px indent (a grid would keep the whole point clear of it) */
  .hl-point{display:block;padding-left:44px}
  .hl-point>b{float:left;width:44px;margin-left:-44px}
  .hl-point.is-l2{margin-left:24px} .hl-point.is-l3{margin-left:48px}
  .hl-reltile{padding:4px 16px 16px}
}
@media print{
  /* the printed page keeps what the head had: the panel's contents print, open, after the text */
  .hl-layout>.hl-aside{display:block!important}
  .hl-aside>:not(.hl-abt):not(.ui-about){display:none!important}
  .hl-abt,.ui-about{background:none}
  .hl-abt>summary,.ui-about>summary{display:none}
  .hl-abt::details-content{content-visibility:visible;display:block}
  .ui-tile::details-content{content-visibility:visible;display:block}
  details.ui-tile>summary::after{display:none}
  .hl-text.is-tile{box-shadow:none;padding:0}
  .hl-reltile{background:none;padding:0}
}
/* ---------- 26. Status and stage, even columns, compact date line (operator 2026-11-01 07:34; lane ux-pass-pre-switch) ---------- */
/* nature chip (what weight the text has: the source line's own nature word, a dot) and stage chip (where the text is in
   its life: a funnel of steps, only the current one filled, then the word). Kit §26 proposal; colours are kit tokens. */
.hl-nat,.hl-stage{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:0 9px;border-radius:999px;font:600 12.5px/1.2 var(--hl-sans);font-style:normal;white-space:nowrap;vertical-align:middle;background:var(--hl-tone);color:var(--hl-ink-2)}
.hl-nat__dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:currentColor}
.hl-nat.is-not-law{background:var(--hl-info);color:var(--hl-info-ink)}
.hl-nat.is-draft{background:var(--hl-warn);color:var(--hl-warn-ink)}
.hl-stage{font-weight:500;color:var(--hl-ink)}
.hl-stage__steps{display:inline-flex;gap:1px}
.hl-stage__steps{align-items:center}
.hl-stage__steps i{width:10px;height:7px;background:var(--hl-muted);clip-path:polygon(0 0,70% 0,100% 50%,70% 100%,0 100%,30% 50%)}
.hl-stage__steps i:first-child{clip-path:polygon(0 0,70% 0,100% 50%,70% 100%,0 100%)}
.hl-stage__steps i.is-now{height:12px;width:12px;background:var(--hl-ink-2)}
.hl-stage.is-live .hl-stage__steps i.is-now{background:var(--hl-ok)}
.hl-stage.is-early .hl-stage__steps i.is-now{background:var(--hl-warn-ink)}
.hl-stage.is-ended{color:var(--hl-ink-2)}
.hl-stage__steps i.is-end{margin-left:3px;border-radius:2px;clip-path:none;width:8px;background:var(--hl-muted)}
.hl-trust.is-head.has-chips{line-height:2}
.hl-trust.is-head.has-chips>.hl-nat{margin-right:2px}
/* not yet verified, with chips: the warning on its own words, not a box around the chips */
.hl-trust.is-head.has-chips.is-unverified{display:block;background:none;padding:0;color:var(--hl-ink-2)}
.hl-trust__unv{color:var(--hl-warn-ink);background:var(--hl-warn);border-radius:var(--hl-r-row);padding:2px 8px}
.hl-doc__meta .hl-nat,.hl-doc__meta .hl-stage,.hl-result__meta .hl-nat,.hl-result__meta .hl-stage{min-height:22px;font-size:12px;padding:0 8px}
.hl-doc__life{color:var(--hl-muted);font-size:.9em}
/* the compact date line: one line with a dot, the date facts and the way back (informational states only) */
.hl-banner.is-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:6px 6px 6px 14px;margin:0 0 16px;border-radius:12px}
.hl-banner__dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:currentColor}
.hl-banner.is-line .hl-banner__text{display:inline;flex:1 1 240px;font-size:14px;line-height:1.45}
.hl-banner.is-line .hl-banner__act{min-height:32px;padding:0 12px;font-size:13.5px}
/* even side columns: one width (the same basis and shrink), all three columns start at the top of the layout */
.hl-nav{flex:0 1 272px}
.hl-aside{flex:0 1 272px}
.hl-toc--l1,.hl-toc--l1.is-below-banner{margin-top:0}
/* the act landing: key dates as one compact list; `Contents on a date` as a small date form with its purpose line */
.hl-keydates.is-compact{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 30px}
.hl-keydates.is-compact .hl-keydate{flex:1 1 150px;margin:0;padding:8px 12px;border-radius:12px}
.hl-keydates.is-compact dt{font-size:12.5px;color:var(--hl-ink-2)}
.hl-keydates.is-compact dd{margin:1px 0 0}
.hl-keydates.is-compact dd b{display:inline;font:500 14.5px var(--hl-mono)}
.hl-keydates.is-compact dd span{display:block;font-size:12px;color:var(--hl-muted)}
.hl-ondate{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:4px 0 16px;padding:10px 12px;border-radius:12px;background:var(--hl-tone);font-size:14px}
.hl-ondate>label{font-weight:600;color:var(--hl-ink)}
.hl-ondate__row{display:inline-flex;gap:6px;align-items:center}
.hl-ondate input{min-height:36px;padding:0 10px;border:0;border-radius:var(--hl-r-btn);background:var(--hl-surface);color:var(--hl-ink);font:400 14px var(--hl-mono)}
.hl-ondate .hl-btn{min-height:36px}
.hl-ondate__why{flex:1 1 100%;font-size:13px;color:var(--hl-muted)}
.hl-art.has-tag .hl-tag,.hl-art .hl-stage{margin-left:6px}
.hl-datepick a>span{white-space:nowrap}
.hl-result__meta .hl-nat{margin-right:4px}
.hl-result__meta .hl-stage{margin-right:6px}
/* a list page (recitals, annexes, Level 2/3 lists, definitions): navigation, no text tile; document rows as doc-list rows */
.hl-text.is-list{font-size:17px;line-height:1.55}
.hl-text.is-list li:has(>.hl-doc){list-style:none}
.hl-text.is-list ul:has(>li>.hl-doc){padding:0}
.hl-text.is-list .hl-doc{grid-template-columns:150px minmax(0,1fr);margin:0;padding:10px 12px;font:400 15.5px/1.45 var(--hl-sans)}
.hl-text.is-list .hl-doc__k{overflow-wrap:anywhere;font-size:12.5px}
.hl-text.is-list li+li{margin-top:2px}
.hl-text.is-list ul:has(>li.is-link){padding:0;list-style:none}
.hl-text.is-list li.is-link>a:not(.hl-doc){display:block;padding:8px 12px;border-radius:var(--hl-r-row);color:var(--hl-ink);text-decoration:none;font:400 16px/1.4 var(--hl-sans)}
.hl-text.is-list li.is-link>a:not(.hl-doc):hover{background:var(--hl-tone)}
.hl-text.is-list ul.hl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:6px}
.hl-text.is-list ul.hl-grid>li+li{margin-top:0}
.hl-text.is-list ul.hl-grid a{background:var(--hl-tone);text-align:center;min-height:28px}
.hl-text.is-list ul.hl-grid a:hover{background:var(--hl-tone-2)}
@media (max-width:720px){
  .hl-aside{flex-basis:100%}
  .hl-keydates.is-compact{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .hl-keydates.is-compact .hl-keydate{padding:7px 10px}
  .hl-ondate input,.hl-ondate .hl-btn{min-height:44px}
  .hl-text.is-list .hl-doc{grid-template-columns:minmax(0,1fr);padding:10px 4px;min-height:44px}
  .hl-text.is-list .hl-doc__k{grid-row:auto}
  .hl-banner.is-line{padding:8px 8px 8px 12px}
  .hl-banner.is-line .hl-banner__act{min-height:44px}
}
@media print{
  .hl-stage__steps,.hl-nat__dot,.hl-banner__dot{display:none}
  .hl-nat,.hl-stage{padding:0;background:none}
}
