
:root {
   --ground:#ffffff;
   --ink:#121417;
   --ink-secondary:#3b4048;
   --ink-muted:#68707d;
   --rule:#d8dce2;
   --surface:#f4f6f8;
   --surface-alt:#eceff2;
   --accent:#bc4512;
   --accent-hover:#9e370b;
   --accent-active:#7e2b08;
   --accent-subtle:#fdf1eb;
   --accent-contrast:#ffffff;

   /* Dark mode / dark surface tokens (for footer & terminal surfaces) */
   --surface-dark:#121417;
   --surface-dark-elevated:#1c2025;
   --ink-on-dark:#ffffff;
   --ink-secondary-on-dark:#c2c8d0;
   --ink-muted-on-dark:#8a94a0;
   --rule-on-dark:#2a303a;

   /* Feedback & validation tokens */
   --error-ink:#b91c1c;
   --error-bg:#fef2f2;
   --error-border:#f87171;
   --success-ink:#166534;
   --success-bg:#f0fdf4;
   --success-border:#86efac;

   --zuke-4b4:'Oswald', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   --zuke-78e:'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
   --zuke-3d6:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

   /* Fluid typography scale using clamp() with safe 320px minimums */
   --text-xs:clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
   --text-sm:clamp(0.8125rem, 0.78rem + 0.25vw, 0.9375rem);
   --text-base:clamp(0.9375rem, 0.9rem + 0.35vw, 1.0625rem);
   --text-md:clamp(1.0625rem, 1rem + 0.45vw, 1.25rem);

   --text-lg:clamp(1.25rem, 1.15rem + 0.7vw, 1.5rem);
   --text-xl:clamp(1.5rem, 1.35rem + 1vw, 2rem);
   --text-2xl:clamp(1.875rem, 1.6rem + 1.5vw, 2.75rem);
   --text-3xl:clamp(2.25rem, 1.85rem + 2.2vw, 3.5rem);
   --text-hero:clamp(2.35rem, 1.9rem + 3.2vw, 4.5rem);

   /* Optical tracking and line height */
   --leading-tight:1.08;
   --leading-heading:1.16;
   --leading-snug:1.35;
   --leading-normal:1.6;
   --leading-loose:1.75;
   --tracking-tight:-0.02em;
   --tracking-normal:0em;
   --tracking-wide:0.04em;
   --tracking-wider:0.08em;
   --tracking-display:0.02em;

   --space-2:0.125rem;
   --space-4:0.25rem;
   --space-8:0.5rem;
   --space-12:0.75rem;
   --space-16:1rem;
   --space-20:1.25rem;
   --space-24:1.5rem;
   --space-32:2rem;
   --space-40:2.5rem;
   --space-48:3rem;
   --space-64:4rem;
   --space-80:5rem;
   --space-96:6rem;
   --space-128:8rem;

   /* Boxed frame geometry */
   --container-max:1240px;
   --container-text:74ch;
   --frame-border-width:1px;
   --frame-border-color:var(--ink);
   --frame-margin:clamp(0.5rem, 0.4rem + 0.5vw, 1.25rem);
   --header-height:4.5rem;
   --header-height-condensed:3.5rem;

   --radius-none:0px;
   --radius-chamfer:2px;

   --dur-instant:120ms;
   --dur-fast:180ms;
   --dur-med:320ms;
   --dur-slow:550ms;
   --ease-refined:cubic-bezier(0.16, 1, 0.3, 1);
   --ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);
   --ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);
   --ease-settle:cubic-bezier(0.25, 1, 0.5, 1);

   /* Signature moment: Draughtsman Ledger Rule Lines */
   --ledger-line:1px solid var(--rule);
   --ledger-line-dark:1px solid var(--rule-on-dark);
}

*,
*::before,
*::after {
   box-sizing:border-box;
   margin:0;
   padding:0;
}

html {
   -webkit-text-size-adjust:100%;
   text-size-adjust:100%;
   scroll-behavior:smooth;
   background-color:var(--ground);
}

body {
   background-color:var(--ground);
   color:var(--ink);
   font-family:var(--zuke-78e);
   font-size:var(--text-base);

   font-weight:400;
   line-height:var(--leading-normal);
   letter-spacing:var(--tracking-normal);
   min-height:100vh;
   display:flex;
   flex-direction:column;
   overflow-x:hidden;
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale;
}

/* Form controls font inherit rule - specifically form controls only */
button,
input,
optgroup,
select,
textarea {
   font:inherit;
   color:inherit;
   letter-spacing:inherit;
}

img,
svg,
video,
canvas {
   display:block;
   max-width:100%;
   height:auto;
}

svg { flex-shrink:0; }

p,
h1,
h2,
h3,
h4,
h5,
h6,
li,
dt,
dd,
figcaption {
   overflow-wrap:break-word;
   word-break:break-word;
}

div,
section,
article,
main,
aside,
header,
footer,
nav { min-width:0; }

/* Links */
a {
   color:inherit;
   text-decoration:none;
   cursor:pointer;
}

/* Lists */
ul,
ol { list-style:none; }

table {
   border-collapse:collapse;
   border-spacing:0;
   width:100%;
}

/* Fieldset */
fieldset {
   border:0;
   margin:0;
   padding:0;

}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family:var(--zuke-4b4);
   font-weight:700;
   line-height:var(--leading-heading);
   letter-spacing:var(--tracking-display);
   text-transform:uppercase;
   color:var(--ink);
}

h1 {
   font-size:var(--text-hero);
   line-height:var(--leading-tight);
   letter-spacing:-0.01em;
}

h2 {
   font-size:var(--text-3xl);
   line-height:var(--leading-heading);
}

h3 {
   font-size:var(--text-2xl);
   line-height:var(--leading-heading);
}

h4 {
   font-size:var(--text-xl);
   line-height:var(--leading-snug);
}

h5 {
   font-size:var(--text-lg);
   line-height:var(--leading-snug);
}

h6 {
   font-size:var(--text-md);
   line-height:var(--leading-snug);
   letter-spacing:var(--tracking-wider);
}

p { color:var(--ink-secondary); }

.text-lead {
   font-size:var(--text-lg);
   line-height:var(--leading-snug);
   color:var(--ink);
   font-weight:400;
}

.text-sm {
   font-size:var(--text-sm);
   line-height:var(--leading-normal);
}

.text-xs {
   font-size:var(--text-xs);
   line-height:var(--leading-snug);
}

.text-muted { color:var(--ink-muted); }

.text-ink { color:var(--ink); }

.text-accent { color:var(--accent); }

/* Monospace & meta typography */
code,
kbd,
samp,
pre,
.font-mono {
   font-family:var(--zuke-3d6);
   font-size:0.9em;
}

.meta-stamp {
   font-family:var(--zuke-3d6);
   font-size:var(--text-xs);
   font-weight:700;
   text-transform:uppercase;
   letter-spacing:var(--tracking-wider);
   color:var(--ink-muted);
}

.price-tag {
   font-family:var(--zuke-3d6);
   font-weight:700;
   color:var(--ink);
   letter-spacing:-0.01em;
}

.prose {
   max-width:var(--container-text);
   color:var(--ink-secondary);
   font-size:var(--text-base);
   line-height:var(--leading-loose);
}

.prose p { margin-bottom:var(--space-20); }

.prose p:last-child { margin-bottom:0; }

.prose h2 {
   margin-top:var(--space-48);
   margin-bottom:var(--space-16);
   color:var(--ink);
}

.prose h3 {
   margin-top:var(--space-32);
   margin-bottom:var(--space-12);
   color:var(--ink);
}

.prose h4 {
   margin-top:var(--space-24);
   margin-bottom:var(--space-8);
   color:var(--ink);
}

.prose ul,
.prose ol {
   margin-top:var(--space-12);
   margin-bottom:var(--space-24);
   padding-left:var(--space-24);
}

.prose ul { list-style:disc; }

.prose ol { list-style:decimal; }

.prose li {
   margin-bottom:var(--space-8);
   padding-left:var(--space-4);
}

.prose strong {
   font-weight:600;
   color:var(--ink);
}

.prose a {
   color:var(--accent);
   text-decoration:underline;
   text-underline-offset:3px;
   text-decoration-thickness:1px;
   transition:color var(--dur-fast) ease, text-decoration-color var(--dur-fast) ease;
}

.prose a:hover { color:var(--accent-hover); }

.prose a:active { color:var(--accent-active); }

.prose a:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.prose blockquote {
   margin:var(--space-32) 0;
   padding:var(--space-16) var(--space-24);
   border-left:3px solid var(--accent);
   background-color:var(--surface);
   color:var(--ink);
   font-style:italic;
}

.prose hr {
   border:0;
   border-top:var(--ledger-line);
   margin:var(--space-40) 0;
}

.site-frame {
   display:flex;
   flex-direction:column;
   min-height:100vh;
   margin:var(--frame-margin);
   border:var(--frame-border-width) solid var(--frame-border-color);
   background-color:var(--ground);
   position:relative;
   box-shadow:0 0 0 1px rgba(18, 20, 23, 0.05);
}

.container {
   width:100%;
   max-width:var(--container-max);
   margin-left:auto;
   margin-right:auto;
   padding-left:clamp(1rem, 0.8rem + 1vw, 2rem);
   padding-right:clamp(1rem, 0.8rem + 1vw, 2rem);
}

.container-narrow {
   width:100%;
   max-width:880px;
   margin-left:auto;
   margin-right:auto;
   padding-left:clamp(1rem, 0.8rem + 1vw, 2rem);
   padding-right:clamp(1rem, 0.8rem + 1vw, 2rem);
}

.main-content {
   flex:1 0 auto;
   display:flex;
   flex-direction:column;
}

.ledger-rule {
   border:0;
   border-top:var(--ledger-line);
   width:100%;
   display:block;
}

.ledger-border-top { border-top:var(--ledger-line); }

.ledger-border-bottom { border-bottom:var(--ledger-line); }

.ledger-border-left { border-left:var(--ledger-line); }

.ledger-border-right { border-right:var(--ledger-line); }

.ledger-grid-row {
   display:grid;
   border-top:var(--ledger-line);
   border-bottom:var(--ledger-line);
}

/* Technical indicator pill / chip */
.tech-chip {
   display:inline-flex;
   align-items:center;
   gap:var(--space-8);
   font-family:var(--zuke-3d6);
   font-size:var(--text-xs);
   font-weight:700;
   text-transform:uppercase;
   letter-spacing:var(--tracking-wider);
   padding:var(--space-4) var(--space-12);
   border:1px solid var(--rule);
   background-color:var(--surface);
   color:var(--ink-secondary);
   border-radius:var(--radius-chamfer);
   line-height:1.2;
}

.tech-chip--accent {
   border-color:#b53f0f;
   background-color:var(--accent-subtle);
   color:#b53f0f;
}

.tech-chip--dark {
   border-color:var(--rule-on-dark);
   background-color:var(--surface-dark-elevated);
   color:var(--ink-on-dark);
}

/* Status indicator pip */
.status-pip {
   display:inline-block;
   width:8px;
   height:8px;
   background-color:#16a34a;
   border-radius:50%;
   box-shadow:0 0 0 2px rgba(22, 163, 74, 0.2);
}

.status-pip--amber {
   background-color:var(--accent);
   box-shadow:0 0 0 2px rgba(200, 78, 26, 0.2);
}

.sr-only,
.visually-hidden {
   position:absolute !important;
   width:1px !important;
   height:1px !important;
   padding:0 !important;
   margin:-1px !important;
   overflow:hidden !important;
   clip:rect(0, 0, 0, 0) !important;
   white-space:nowrap !important;
   border:0 !important;
}

.skip-link {
   position:absolute;
   top:var(--space-8);
   left:var(--space-8);
   z-index:10000;
   padding:var(--space-12) var(--space-20);
   background-color:var(--ink);
   color:var(--ink-on-dark);
   font-family:var(--zuke-4b4);
   font-weight:700;
   text-transform:uppercase;
   letter-spacing:var(--tracking-wider);
   border:2px solid var(--accent);
   border-radius:var(--radius-chamfer);
   transform:translateY(-150%);
   transition:transform var(--dur-fast) ease;
   min-height:44px;
   display:inline-flex;
   align-items:center;
}

.skip-link:focus {
   transform:translateY(0);
   outline:2px solid var(--accent);
   outline-offset:2px;
}

/* Focus visible universal fallback */
:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

@media (prefers-reduced-motion: reduce) {
   *,
   *::before,
   *::after {
      animation-duration:0.01ms !important;
      animation-iteration-count:1 !important;
      transition-duration:0.01ms !important;
      scroll-behavior:auto !important;
   }
}

.meta-stamp {
   white-space:normal !important;
   word-break:normal;
   overflow-wrap:break-word;
}
