*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --font-display:'Instrument Serif',Georgia,serif;
  --font-body:'DM Sans','Helvetica Neue',sans-serif;
  --text-xs:clamp(0.75rem,0.7rem + 0.25vw,0.875rem);
  --text-sm:clamp(0.875rem,0.8rem + 0.35vw,1rem);
  --text-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);
  --text-lg:clamp(1.125rem,1rem + 0.75vw,1.5rem);
  --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
  --text-2xl:clamp(2rem,1.2rem + 2.5vw,3.5rem);
  --text-3xl:clamp(2.5rem,1rem + 4vw,5rem);
  --space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;
  --space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;
  --space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;
  --radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;
  --transition:180ms cubic-bezier(0.16,1,0.3,1);
  --content-narrow:640px;--content-default:760px;--content-wide:1200px;
}
:root,[data-theme="light"]{
  --color-bg:#f7f6f2;--color-surface:#f9f8f5;--color-surface-2:#fbfbf9;
  --color-surface-offset:#f3f0ec;--color-border:#d4d1ca;--color-divider:#dcd9d5;
  --color-text:#1a1814;--color-text-muted:#6b6a66;--color-text-faint:#bab9b4;
  --color-gold:#b8860b;--color-gold-light:#d4a017;
}
[data-theme="dark"]{
  --color-bg:#111010;--color-surface:#171614;--color-surface-2:#1c1b19;
  --color-surface-offset:#1f1e1c;--color-border:#2e2d2b;--color-divider:#222120;
  --color-text:#e8e6e2;--color-text-muted:#8a8884;--color-text-faint:#4a4946;
  --color-gold:#c9a84c;--color-gold-light:#e2c47a;
}
@media(prefers-color-scheme:light){:root:not([data-theme]){
  --color-bg:#f7f6f2;--color-surface:#f9f8f5;--color-surface-2:#fbfbf9;
  --color-surface-offset:#f3f0ec;--color-border:#d4d1ca;--color-divider:#dcd9d5;
  --color-text:#1a1814;--color-text-muted:#6b6a66;--color-text-faint:#bab9b4;
  --color-gold:#b8860b;--color-gold-light:#d4a017;
}}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:var(--space-16)}
body{min-height:100dvh;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);line-height:1.6}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{text-wrap:balance;line-height:1.15;font-family:var(--font-display)}
p,li{text-wrap:pretty;max-width:68ch}
::selection{background:oklch(from var(--color-gold) l c h/0.2);color:var(--color-text)}
:focus-visible{outline:2px solid var(--color-gold);outline-offset:3px;border-radius:var(--radius-sm)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important}}
a{color:var(--color-gold);transition:color var(--transition),border-color var(--transition);text-decoration:none;border-bottom:1px solid oklch(from var(--color-gold) l c h/0.3);padding-bottom:1px}
a:hover{border-color:var(--color-gold)}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:var(--space-5) var(--space-8);display:flex;align-items:center;justify-content:space-between;background:oklch(from var(--color-bg) l c h/0.85);backdrop-filter:blur(12px);border-bottom:1px solid oklch(from var(--color-text) l c h/0.06)}
.nav-logo{display:flex;align-items:center;gap:var(--space-3);color:var(--color-text);border:none}
.nav-logo:hover{color:var(--color-text)}
.nav-logo-mark{width:32px;height:32px}
.nav-logo-name{font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:-0.01em;color:var(--color-text)}
.nav-right{display:flex;align-items:center;gap:var(--space-4)}
.nav-back{font-size:var(--text-sm);color:var(--color-text-muted);letter-spacing:0.02em;border:none;padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm)}
.nav-back:hover{color:var(--color-text);background:oklch(from var(--color-text) l c h/0.04)}

/* SKIP LINK */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:200}
.skip-link:focus{left:var(--space-4);top:var(--space-4);width:auto;height:auto;padding:var(--space-3) var(--space-5);background:var(--color-gold);color:#0e0d0b;border-radius:var(--radius-sm);font-size:var(--text-sm)}

/* DOC / ARTICLE */
.doc-main{padding:calc(var(--space-24) + 40px) var(--space-8) var(--space-16);max-width:calc(var(--content-default) + var(--space-16));margin:0 auto}
.doc-article{max-width:var(--content-default);margin:0 auto}
.section-label{font-size:var(--text-xs);letter-spacing:0.15em;text-transform:uppercase;color:var(--color-gold);margin-bottom:var(--space-4);font-family:var(--font-body);font-weight:500}
.doc-h1{font-family:var(--font-display);font-size:var(--text-2xl);letter-spacing:-0.02em;line-height:1.1;color:var(--color-text);margin-bottom:var(--space-4)}
.doc-h1 em{font-style:italic;color:var(--color-gold)}
.doc-meta{font-size:var(--text-xs);letter-spacing:0.08em;text-transform:uppercase;color:var(--color-text-faint);margin-bottom:var(--space-12);font-family:var(--font-body)}
.doc-h2{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:-0.01em;line-height:1.2;color:var(--color-text);margin:var(--space-12) 0 var(--space-5)}
.doc-h2 em{font-style:italic;color:var(--color-gold)}
.doc-h3{font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:-0.01em;line-height:1.25;color:var(--color-text);margin:var(--space-8) 0 var(--space-3)}
.doc-p{font-size:var(--text-base);color:var(--color-text-muted);line-height:1.8;margin-bottom:var(--space-5)}
.doc-p strong{color:var(--color-text);font-weight:500}
.doc-ul,.doc-ol{margin:0 0 var(--space-6) var(--space-6);padding:0}
.doc-ul li,.doc-ol li{font-size:var(--text-base);color:var(--color-text-muted);line-height:1.8;margin-bottom:var(--space-3);padding-left:var(--space-2)}
.doc-ul li::marker{color:var(--color-gold)}
.doc-pullquote{font-family:var(--font-display);font-style:italic;font-size:var(--text-xl);line-height:1.4;color:var(--color-text);margin:var(--space-10) 0;padding:var(--space-6) 0 var(--space-6) var(--space-8);border-left:2px solid var(--color-gold)}
.doc-breadcrumb{font-size:var(--text-xs);letter-spacing:0.05em;color:var(--color-text-faint);margin-bottom:var(--space-6);font-family:var(--font-body)}
.doc-breadcrumb a{color:var(--color-text-faint);border:none;padding:0}
.doc-breadcrumb a:hover{color:var(--color-text-muted)}
.doc-breadcrumb-sep{margin:0 var(--space-2);color:var(--color-text-faint)}
.doc-divider{border:none;border-top:1px solid var(--color-divider);margin:var(--space-12) 0}

/* DATA BLOCK */
.doc-stats{margin:var(--space-8) 0;padding:var(--space-6) var(--space-8);background:var(--color-surface);border:1px solid oklch(from var(--color-text) l c h/0.07);border-radius:var(--radius-lg);display:grid;grid-template-columns:auto 1fr;column-gap:var(--space-6);row-gap:var(--space-3);font-size:var(--text-sm);line-height:1.5;font-family:var(--font-body)}
.doc-stats-caption{grid-column:1/-1;font-size:var(--text-xs);letter-spacing:0.12em;text-transform:uppercase;color:var(--color-gold);font-weight:500;margin-bottom:var(--space-2)}
.doc-stats dt{color:var(--color-text-muted);font-weight:400}
.doc-stats dd{margin:0;color:var(--color-text);font-variant-numeric:tabular-nums;font-feature-settings:"tnum";text-align:right}

/* FOOTER */
footer{padding:var(--space-16) var(--space-8) var(--space-12);border-top:1px solid var(--color-divider)}
.footer-inner{max-width:var(--content-wide);margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 2fr;gap:var(--space-12);align-items:start}
.footer-brand{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-text)}
.footer-brand span{color:var(--color-text-faint);font-family:var(--font-body);font-size:var(--text-xs);display:block;margin-top:var(--space-2);letter-spacing:0.05em}
.footer-disclaimer{font-size:var(--text-xs);color:var(--color-text-faint);line-height:1.7;max-width:72ch}
.footer-disclaimer p{margin-bottom:var(--space-3);max-width:none}
.footer-meta{margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--color-divider);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-4);font-size:var(--text-xs);color:var(--color-text-faint);letter-spacing:0.05em}
.footer-meta a{color:var(--color-text-faint);border:none;padding:0}
.footer-meta a:hover{color:var(--color-text-muted)}
@media(max-width:768px){.footer-inner{grid-template-columns:1fr;gap:var(--space-8)}.doc-main{padding:calc(var(--space-16) + 40px) var(--space-6) var(--space-12)}}