:root {
   --ground: #ffffff;
   --ink: #121416;
   --ink-muted: #4a5056;
   --ink-faint: #7a828a;
   --rule: #d8dce0;
   --rule-dark: #8c939a;
   --rule-strong: #121416;
   --accent: #c0392b;
   --accent-tint: rgba(192, 57, 43, 0.08);
   --surface: #f4f6f8;
   --surface-alt: #eceff2;
   --surface-contrast: #121416;
   --ink-inverse: #ffffff;

   /* Typography Stack */
   --damu-3d7: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   --damu-96f: 'Barlow Semi Condensed', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   --damu-871: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

   /* Type Scale - Fluid clamp scales fitting 320px phone to 1920px desktop */
   --type-display-hero: clamp(2.25rem, 5.5vw + 1rem, 4.75rem);
   --type-display-1: clamp(1.85rem, 3.8vw + 0.8rem, 3.25rem);
   --type-display-2: clamp(1.45rem, 2.4vw + 0.6rem, 2.25rem);
   --type-display-3: clamp(1.2rem, 1.4vw + 0.5rem, 1.65rem);
   --type-subhead: clamp(1.05rem, 0.9vw + 0.5rem, 1.25rem);
   --type-body: clamp(0.975rem, 0.35vw + 0.85rem, 1.075rem);
   --type-body-sm: clamp(0.85rem, 0.25vw + 0.75rem, 0.925rem);
   --type-caption: clamp(0.785rem, 0.2vw + 0.72rem, 0.85rem);
   --type-data: clamp(0.8125rem, 0.2vw + 0.75rem, 0.875rem);

   /* Spacing Rhythm - Tight engineered scale */
   --space-2xs: 0.25rem;
   --space-xs: 0.5rem;
   --space-sm: 0.875rem;
   --space-md: 1.25rem;
   --space-lg: 2rem;
   --space-xl: 3.25rem;
   --space-2xl: 5rem;
   --space-3xl: 7.5rem;

   /* Layout Max Widths */
   --container-max: 1320px;
   --container-narrow: 880px;
   --container-reading: 68ch;
   --gutter: clamp(1rem, 3vw, 2.5rem);

   --motion-fast: 160ms;
   --motion-base: 240ms;
   --motion-slow: 480ms;
   --motion-settle: 720ms;
   --ease-engineered: cubic-bezier(0.16, 1, 0.3, 1);
   --ease-linear: linear;

   /* Radii - Strictly 0-radius technical engineering geometry */
   --radius-none: 0px;

   /* Hairlines and Borders */
   --border-hairline: 1px solid var(--rule);
   --border-ledger: 1px solid var(--rule-dark);
   --border-strong: 2px solid var(--ink);
   --border-signal: 2px solid var(--accent);

   /* Shadows - Minimalist mechanical offset */
   --shadow-ledger: 0 1px 0 var(--rule);
   --shadow-lift: 0 4px 12px rgba(18, 20, 22, 0.08);
   --shadow-plate: 0 8px 24px rgba(18, 20, 22, 0.06);
}

*,
*::before,
*::after {

   box-sizing: border-box;
   margin: 0;
   padding: 0;
}

html {
   font-size: 16px;
   line-height: 1.5;
   -webkit-text-size-adjust: 100%;
   -moz-text-size-adjust: 100%;
   text-size-adjust: 100%;
   scroll-behavior: smooth;
   background-color: var(--ground);
   color: var(--ink);
}

body {
   font-family: var(--damu-96f);
   font-size: var(--type-body);
   font-weight: 400;
   line-height: 1.55;
   letter-spacing: 0.01em;
   color: var(--ink);
   background-color: var(--ground);
   min-height: 100vh;
   display: flex;
   flex-direction: column;
   position: relative;
   overflow-x: hidden;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

/* Form controls reset - font inherit rule specifically restricted to controls */
input,
button,
textarea,
select {
   font: inherit;
   color: inherit;
   letter-spacing: inherit;
}

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

a {
   color: inherit;
   text-decoration: none;
}

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

ul,
ol { list-style: none; }

.ledger-grid {
   position: relative;
   background-image: 
      linear-gradient(to right, var(--rule) 1px, transparent 1px),
      linear-gradient(to bottom, var(--rule) 1px, transparent 1px);
   background-size: 80px 80px;
   background-position: 0 0;
}

.ledger-rule-top { border-top: 1px solid var(--rule); }

.ledger-rule-bottom { border-bottom: 1px solid var(--rule); }

.ledger-rule-all { border: 1px solid var(--rule); }

.ledger-mark {
   font-family: var(--damu-871);
   font-size: 0.72rem;
   letter-spacing: 0.08em;
   text-transform: uppercase;
   color: var(--ink-muted);
}

#ledger-canvas {
   position: fixed;
   inset: 0;
   width: 100%;
   height: 100%;

   pointer-events: none;
   z-index: 0;
   opacity: 0.6;
}

/* Layout Wrappers */
.page-shell {
   position: relative;
   z-index: 1;
   display: flex;
   flex-direction: column;
   min-height: 100vh;
}

.site-main {

   flex: 1 0 auto;
   position: relative;
   z-index: 2;
}

.container {
   width: 100%;
   max-width: var(--container-max);
   margin-inline: auto;
   padding-inline: var(--gutter);
}

.container-narrow {
   width: 100%;
   max-width: var(--container-narrow);
   margin-inline: auto;
   padding-inline: var(--gutter);
}

.container-reading {
   width: 100%;
   max-width: var(--container-reading);
   margin-inline: auto;
   padding-inline: var(--gutter);
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: var(--damu-3d7);
   font-weight: 700;
   line-height: 1.15;
   color: var(--ink);
   letter-spacing: -0.02em;
   text-wrap: balance;
   overflow-wrap: break-word;
}

h1 { font-size: var(--type-display-1); }

h2 { font-size: var(--type-display-2); }

h3 {
   font-size: var(--type-display-3);
   font-weight: 500;
}

h4 {
   font-size: var(--type-subhead);
   font-weight: 500;
   letter-spacing: 0;
}

p {
   margin-bottom: var(--space-md);
   color: var(--ink);
   max-width: var(--container-reading);
}

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

.text-lead {
   font-size: var(--type-subhead);
   line-height: 1.45;
   color: var(--ink);
}

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

.text-mono {
   font-family: var(--damu-871);
   font-size: var(--type-data);
   letter-spacing: -0.01em;
}

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

.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: -100px;
   left: var(--gutter);
   background: var(--ink);
   color: var(--ground);
   padding: var(--space-xs) var(--space-md);
   font-family: var(--damu-871);
   font-size: var(--type-data);
   text-decoration: underline;
   z-index: 9999;
   border: 1px solid var(--accent);
   transition: top var(--motion-fast) var(--ease-engineered);
}

.skip-link:focus {
   top: var(--space-xs);
   outline: 2px solid var(--accent);
   outline-offset: 2px;
}

/* Focus styles for keyboard accessibility */
:focus-visible {
   outline: 2px solid var(--ink);
   outline-offset: 3px;
}

@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;
   }

   #ledger-canvas { display: none !important; }
}