/* AISC LLC component stylesheet. Colours, spacing, radii, shadows and font families
   come from tokens.json (tokens.css); this file holds what the token families do not:
   webfonts, the type scale variables the components read, motion, scrims, and base rules. */
:root{
  --size-display-1:64px;--size-display-2:48px;--size-h1:38px;--size-h2:30px;
  --size-h3:24px;--size-h4:20px;--size-body-lg:18px;--size-body:16px;
  --size-body-sm:14px;--size-caption:13px;--size-micro:11px;
  --lh-tight:1.08;--lh-snug:1.22;--lh-normal:1.5;--lh-relaxed:1.62;
  --weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;
  --track-display:-0.02em;--track-heading:-0.01em;--track-body:0;--track-label:0.06em;--track-eyebrow:0.16em;
  --type-eyebrow-font:var(--font-display);--type-eyebrow-size:var(--size-micro);--type-numeric-font:var(--font-mono);
  --content-measure:66ch;
  --scrim-top:linear-gradient(180deg,rgba(29,39,43,.62),rgba(29,39,43,0) 62%);
  --scrim-bottom:linear-gradient(0deg,rgba(29,39,43,.72),rgba(29,39,43,0) 70%);
  --blur-glass:saturate(140%) blur(12px);
  --dur-instant:80ms;--dur-fast:140ms;--dur-base:200ms;--dur-slow:320ms;--dur-page:480ms;
  --ease-standard:cubic-bezier(.2,.6,.25,1);--ease-out:cubic-bezier(0,.5,.2,1);--ease-in:cubic-bezier(.5,0,1,.5);
  --transition-control:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);
  --transition-surface:box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard);
}
@media (prefers-reduced-motion:reduce){:root{--dur-instant:0ms;--dur-fast:0ms;--dur-base:0ms;--dur-slow:0ms;--dur-page:0ms}}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);font-size:var(--size-body);line-height:var(--lh-normal);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:var(--font-display);color:var(--text-heading);font-weight:var(--weight-semibold);letter-spacing:var(--track-heading);line-height:var(--lh-snug);margin:0}
h1{font-size:var(--size-h1);letter-spacing:var(--track-display)}h2{font-size:var(--size-h2)}h3{font-size:var(--size-h3)}h4{font-size:var(--size-h4)}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration-thickness:1px;text-underline-offset:2px;transition:color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover)}
.aisc-eyebrow{font-family:var(--font-display);font-size:var(--size-micro);font-weight:var(--weight-semibold);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-brand)}
.aisc-rule{border:0;border-top:var(--border-width-hair) solid var(--border-subtle);margin:0}
.aisc-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}

/* AISC website: design tokens (from the AISC LLC design system) plus site-wide layout rules. */
:root{
--slate-50:#f4f7f8;--slate-100:#e6eced;--slate-200:#ccd8dc;--slate-300:#a8bcc3;--slate-400:#8299a1;--slate-500:#5d7982;--slate-600:#4c646c;--slate-700:#3c5057;--slate-800:#2b3a3f;--slate-900:#1d272b;
--brass-50:#fbf7ee;--brass-100:#f3e8cf;--brass-200:#e6d0a3;--brass-300:#d4b374;--brass-400:#c2984f;--brass-500:#a97c3f;--brass-600:#8d6631;--brass-700:#6d4e25;
--grey-0:#ffffff;--grey-25:#fafbfb;--grey-50:#f5f6f7;--grey-100:#eceef0;--grey-200:#dfe2e5;--grey-300:#c6cbd0;--grey-400:#9aa2a9;--grey-500:#6f787f;--grey-600:#525a60;--grey-700:#3a4146;--grey-800:#24292d;--grey-900:#14181a;
--green-100:#e0efe7;--green-500:#2f7d5a;--green-700:#1f5a40;--amber-100:#f7ecd4;--amber-500:#b3873a;--amber-700:#7e5d22;--red-100:#f6e3e1;--red-500:#a6403a;--red-700:#7b2b26;--blue-100:#e2edf4;--blue-500:#3f6f8f;--blue-700:#2b4f68;
--brand:var(--slate-500);--brand-strong:var(--slate-700);--brand-soft:var(--slate-100);--accent:var(--brass-500);--accent-soft:var(--brass-50);
--text-heading:var(--slate-900);--text-body:var(--grey-700);--text-muted:var(--grey-500);--text-subtle:var(--grey-400);--text-inverse:var(--grey-0);--text-brand:var(--slate-600);--text-accent:var(--brass-600);--text-link:var(--slate-600);--text-link-hover:var(--slate-800);
--surface-page:var(--grey-25);--surface-card:var(--grey-0);--surface-sunken:var(--grey-50);--surface-raised:var(--grey-0);--surface-brand:var(--slate-500);--surface-brand-dark:var(--slate-800);--surface-brand-soft:var(--slate-50);--surface-accent-soft:var(--brass-50);--surface-hover:var(--grey-50);--surface-active:var(--grey-100);--surface-overlay:rgba(29,39,43,.55);
--border-subtle:var(--grey-200);--border-default:var(--grey-300);--border-strong:var(--grey-400);--border-brand:var(--slate-500);--border-focus:var(--slate-600);--border-inverse:rgba(255,255,255,.28);
--status-success-fg:var(--green-700);--status-success-bg:var(--green-100);--status-success:var(--green-500);--status-warning-fg:var(--amber-700);--status-warning-bg:var(--amber-100);--status-warning:var(--amber-500);--status-danger-fg:var(--red-700);--status-danger-bg:var(--red-100);--status-danger:var(--red-500);--status-info-fg:var(--blue-700);--status-info-bg:var(--blue-100);--status-info:var(--blue-500);
--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--space-32:128px;
--border-width-hair:1px;--border-width-thick:2px;--border-width-rule:3px;--container-max:1200px;--container-narrow:720px;--section-y:96px;--section-y-sm:64px;--gutter:24px;
--radius-none:0;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:10px;--radius-xl:16px;--radius-pill:999px;--radius-circle:50%;
--shadow-none:none;--shadow-xs:0 1px 2px rgba(29,39,43,.06);--shadow-sm:0 1px 3px rgba(29,39,43,.08),0 1px 2px rgba(29,39,43,.04);--shadow-md:0 4px 12px rgba(29,39,43,.08),0 1px 3px rgba(29,39,43,.05);--shadow-lg:0 12px 28px rgba(29,39,43,.10),0 2px 6px rgba(29,39,43,.05);--shadow-xl:0 24px 56px rgba(29,39,43,.14);--shadow-inset:inset 0 1px 0 rgba(255,255,255,.6);--ring-focus:0 0 0 3px rgba(93,121,130,.32);--ring-danger:0 0 0 3px rgba(166,64,58,.28);
--font-display:"Montserrat","Helvetica Neue",Arial,sans-serif;--font-body:"Source Sans 3","Helvetica Neue",Arial,sans-serif;--font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
html{scroll-behavior:smooth}

/* Site header */
.sh{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--border-subtle)}
.sh-in{max-width:var(--container-max);margin:0 auto;padding:0 var(--space-8);height:76px;display:flex;align-items:center;gap:var(--space-8)}
.sh-nav{display:flex;gap:var(--space-6);margin-left:auto;align-self:stretch;align-items:center}
.sh-dd{position:relative;align-self:stretch;display:flex;align-items:center}
.sh-top{text-decoration:none;font:var(--weight-semibold) var(--size-body-sm)/1 var(--font-display);display:flex;align-items:center;gap:5px;color:var(--text-body);padding-bottom:2px;border-bottom:2px solid transparent}
.sh-top.is-active{color:var(--text-heading);border-bottom-color:var(--slate-600)}
.sh-top:hover{color:var(--text-heading)}
.sh-menu{display:none;position:absolute;top:100%;left:-12px;min-width:250px;background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-2);flex-direction:column}
.sh-dd:hover .sh-menu,.sh-dd:focus-within .sh-menu{display:flex}
.sh-menu a{text-decoration:none;padding:10px var(--space-4);border-radius:var(--radius-sm);font-size:var(--size-body-sm);color:var(--text-body);white-space:nowrap}
.sh-menu a:hover{background:var(--surface-sunken);color:var(--text-heading)}
.sh-burger{display:none;margin-left:auto;width:44px;height:44px;align-items:center;justify-content:center;background:transparent;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer}
.sm{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;height:calc(100vh - 64px);overflow-y:auto;background:var(--surface-card);border-top:1px solid var(--border-subtle);padding:var(--space-4) 20px var(--space-10)}
.sm-grp{border-bottom:1px solid var(--border-subtle);padding:var(--space-2) 0}
.sm-top{display:flex;align-items:center;min-height:48px;text-decoration:none;font:var(--weight-semibold) var(--size-body-lg)/1.2 var(--font-display);color:var(--text-body)}
.sm-sub{display:flex;align-items:center;min-height:44px;padding-left:var(--space-4);text-decoration:none;font-size:var(--size-body);color:var(--text-muted)}

/* Phone layout (below 768px); desktop unchanged */
@media (max-width:768px){
:root{--size-display-1:40px;--size-display-2:34px;--size-h1:30px;--size-h2:26px;--size-h3:21px;--section-y:var(--space-16)}
.aisc-page{overflow-x:hidden}
.m-stack{grid-template-columns:minmax(0,1fr)!important;gap:var(--space-8)!important}
.m-hide,.sh-nav,.sh-cta{display:none!important}
.m-show{display:flex!important}
.sh-burger{display:flex}
.sh-in{height:64px;padding:0 20px}
#root section,.aisc-page footer,.m-pad{padding-left:20px!important;padding-right:20px!important}
#root section{padding-top:var(--space-12)!important;padding-bottom:var(--space-12)!important}
.m-first{position:static!important;order:-1}
.m-toc{position:static!important;order:-1;padding-bottom:var(--space-6);border-bottom:1px solid var(--border-subtle)}
#root div:has(>table){overflow-x:auto;-webkit-overflow-scrolling:touch}
#root table{min-width:520px}
#root h1,#root h2{overflow-wrap:break-word}
#root section button{max-width:100%}
}

/* Export-only rules: what the canvas does with React state, done here with CSS. */
[hidden]{display:none!important}
.aisc-btn:hover{transition:var(--transition-control)}
.aisc-btn--primary:hover{background:var(--slate-700)!important;border-color:var(--slate-700)!important}
.aisc-btn--secondary:hover{background:var(--surface-hover)!important;border-color:var(--border-strong)!important}
.aisc-btn--accent:hover{background:var(--brass-600)!important;border-color:var(--brass-600)!important}
.aisc-btn--ghost:hover{background:rgba(130,153,161,.16)!important}
.aisc-btn--inverse:hover{background:var(--grey-100)!important;border-color:var(--grey-100)!important}
.aisc-btn:active{transform:translateY(1px)!important}
a:focus-visible,button:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
.aisc-card--interactive:hover{box-shadow:var(--shadow-md)!important;transform:translateY(-2px)!important}
.aisc-field:focus{border-color:var(--border-focus)!important;box-shadow:var(--ring-focus)!important}
.aisc-check{position:relative}
.aisc-check-box{width:18px;height:18px;flex:0 0 auto;border-radius:var(--radius-xs);border:1px solid var(--border-strong);background:var(--surface-card);display:flex;align-items:center;justify-content:center;transition:var(--transition-control)}
.aisc-check-box svg{visibility:hidden}
.aisc-check input:checked+.aisc-check-box{background:var(--slate-600);border-color:var(--slate-600)}
.aisc-check input:checked+.aisc-check-box svg{visibility:visible}
.aisc-check input:focus-visible+.aisc-check-box{box-shadow:var(--ring-focus)}
.sh{position:sticky}
body.menu-open{overflow:hidden}