/* AURAXIS site layer — extends the design system. Tokens only where the DS has no equivalent. */
:root{
  /* Gold is the brand idea; the DS caution hue is its anchor. Used for Engine + data moments only. */
  --gold-300:#e9cd93;--gold-400:#d9b36a;--gold-500:#c79a4b;--gold-600:#a37d36;
  --gold-tint:rgba(199,154,75,.12);--gold-tint-strong:rgba(199,154,75,.22);
  --ax-teal:#5fa8a0;
  --field-dot:rgba(198,202,212,.20);
}
*{box-sizing:border-box}
ax-field{display:block;position:absolute;inset:0}ax-instrument{display:block}
html{scroll-behavior:smooth;overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink-muted);font-family:var(--font-body);-webkit-font-smoothing:antialiased}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-1) var(--ease-standard)}
@media(hover:hover){a:hover{color:var(--accent-300)}}
h1,h2,h3,h4,p{margin:0;text-wrap:pretty}
img,canvas{display:block;max-width:100%}
::selection{background:var(--accent-tint-strong);color:var(--ink)}

/* ---- layout ---- */
.ax-wrap{max-width:var(--width-content);margin:0 auto;padding:0 var(--gut,var(--gutter))}
.ax-sec{border-top:1px solid var(--hairline);position:relative}
.ax-sec-pad{padding-block:var(--space-24)}
.ax-head{max-width:760px}
.ax-head .ax-eyebrow{margin-bottom:14px;color:var(--gold-400)}
.ax-head p{margin-top:16px}
.ax-grid{display:grid;gap:var(--space-4)}
.ax-g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ax-g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ax-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-16);align-items:center}
.ax-rule{height:1px;background:var(--hairline);border:0;margin:0}

/* ---- ambient field ---- */
.ax-field{position:absolute;inset:0;z-index:0;pointer-events:none}
.ax-field-mask{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 50% 0%,transparent 20%,var(--canvas) 78%)}
.ax-abovefield{position:relative;z-index:2}

/* ---- hero ---- */
.ax-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--hairline)}
.ax-hero-in{padding-block:var(--space-32) var(--space-24)}
.ax-h1{font-family:var(--font-display);font-weight:600;font-size:clamp(33px,8.4vw,78px);line-height:1.06;letter-spacing:-.032em;color:var(--ink);text-wrap:balance}
.ax-h2{font-family:var(--font-display);font-weight:600;font-size:clamp(25px,5.6vw,52px);line-height:1.1;letter-spacing:-.026em;color:var(--ink);text-wrap:balance}
.ax-h3{font-family:var(--font-display);font-weight:600;font-size:clamp(22px,4.4vw,38px);line-height:1.14;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.ax-lead{font-size:var(--body-lg-size);line-height:1.55;color:var(--ink-muted);max-width:60ch}
.ax-gold{color:var(--gold-400)}
.ax-ctas{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-8)}

/* ---- strip of mono meta, used under heroes ---- */
.ax-strip{display:flex;flex-wrap:wrap;gap:var(--space-6);border-top:1px solid var(--hairline);padding-top:var(--space-4);margin-top:var(--space-12)}
.ax-strip span{font-family:var(--font-mono);font-size:var(--mono-sm-size);letter-spacing:.02em;color:var(--ink-faint);text-transform:uppercase}

/* ---- five-step scale ---- */
.ax-scale{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--hairline)}
.ax-scale-l{font-size:13px;color:var(--ink-subtle)}
.ax-scale-b{display:flex;gap:3px}
.ax-scale-b i{width:14px;height:4px;border-radius:2px;transition:background var(--dur-2) var(--ease-standard)}
.ax-scale-v{font-family:var(--font-mono);font-size:12px;color:var(--ink);min-width:62px;text-align:right}

/* ---- AXIS ladder (Engine) ---- */
.ax-ladder{border-top:1px solid var(--hairline)}
.ax-rung{display:grid;grid-template-columns:132px minmax(0,1fr) 260px;gap:var(--space-8);padding:var(--space-8) 0;border-bottom:1px solid var(--hairline);align-items:start;transition:background var(--dur-2) var(--ease-standard)}
@media(hover:hover){.ax-rung:hover{background:var(--surface-1)}}
.ax-rung.is-flag{background:var(--surface-1);box-shadow:inset 0 1px 0 var(--edge-top)}
.ax-rung-i{font-family:var(--font-mono);font-size:var(--mono-sm-size);color:var(--ink-faint)}
.ax-rung-code{font-family:var(--font-mono);font-size:17px;letter-spacing:.06em;margin-top:8px}
.ax-rung-name{font-family:var(--font-display);font-weight:500;font-size:21px;letter-spacing:-.014em;color:var(--ink)}
@media(max-width:900px){.ax-rung{grid-template-columns:minmax(0,1fr);gap:var(--space-4);padding-inline:var(--space-4)}.ax-rung-code{margin-top:2px}}

/* ---- allocation console (Engine) ---- */
.ax-seg{display:flex;flex-wrap:wrap;gap:8px}
.ax-seg button{cursor:pointer;min-height:40px;padding:0 16px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:14px;background:transparent;color:var(--ink-subtle);border:1px solid var(--hairline);transition:var(--transition-control)}
@media(hover:hover){.ax-seg button:hover{background:var(--surface-2);color:var(--ink)}}
.ax-seg button[aria-selected=true]{background:var(--surface-3);color:var(--ink);border-color:var(--gold-600)}
.ax-wbar{display:grid;grid-template-columns:96px minmax(0,1fr) 58px;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--hairline)}
.ax-wbar-code{font-family:var(--font-mono);font-size:13px;letter-spacing:.06em}
.ax-wbar-t{position:relative;height:6px;background:var(--surface-3);border-radius:3px;overflow:hidden}
.ax-wbar-f{position:absolute;inset:0 auto 0 0;border-radius:3px;transition:width 520ms var(--ease-standard)}
.ax-wbar-v{font-family:var(--font-mono);font-size:13px;font-variant-numeric:tabular-nums;color:var(--ink);text-align:right}

/* ---- forms ---- */
.ax-formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.ax-ta{background:var(--bg-field);border:1px solid var(--hairline-strong);border-radius:var(--radius-md);color:var(--ink);font-family:var(--font-body);font-size:14px;line-height:1.5;padding:10px var(--pad-field-x);resize:vertical;outline:none;transition:var(--transition-control),box-shadow var(--dur-1) var(--ease-standard);width:100%}
.ax-ta:focus{border-color:var(--accent-500);box-shadow:0 0 0 3px var(--accent-tint)}
/* iOS in-app browsers (Instagram, Facebook) draw their own default focus box around
   inputs, ignoring rounded corners and padding. Force it off and use our own ring. */
input, select, textarea{-webkit-appearance:none;appearance:none;outline:none}
input:focus, select:focus, textarea:focus{outline:none;box-shadow:0 0 0 3px var(--accent-tint)}
.ax-ta::placeholder{color:var(--ink-faint)}
.ax-ctarow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;padding:var(--space-20) var(--gutter)}
@media(max-width:760px){.ax-formgrid{grid-template-columns:minmax(0,1fr)}.ax-ctarow{grid-template-columns:minmax(0,1fr);gap:var(--space-8)}}

/* ---- FUNCTION EXPLAIN reading ---- */
.ax-read{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--space-16);align-items:start}
.ax-read-stick{position:sticky;top:calc(var(--nav-h) + 24px);align-self:start}
.ax-inst-wrap{position:relative}
.ax-readout{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;width:52%}
.ax-readout .n{font-family:var(--font-mono);font-size:var(--mono-sm-size);letter-spacing:.14em;color:var(--gold-400)}
.ax-readout .l{font-family:var(--font-display);font-weight:500;font-size:clamp(15px,1.5vw,21px);letter-spacing:-.014em;color:var(--ink);margin-top:6px}
.ax-stage{min-height:78vh;display:flex;flex-direction:column;justify-content:center;padding:var(--space-8) 0;opacity:.24;transition:opacity 260ms var(--ease-standard)}
.ax-stage.is-on{opacity:1}
.ax-stage-n{font-family:var(--font-mono);font-size:var(--mono-sm-size);letter-spacing:.14em;color:var(--ink-faint);margin-bottom:var(--space-4)}
.ax-stage h3{font-family:var(--font-display);font-weight:600;font-size:clamp(24px,2.6vw,38px);line-height:1.12;letter-spacing:-.022em;color:var(--ink)}
.ax-stage p{margin-top:var(--space-4);font-size:var(--body-lg-size);line-height:1.55;max-width:46ch}
.ax-stage .ax-facts{margin-top:var(--space-6);max-width:420px}
.ax-prog{position:fixed;left:0;top:var(--nav-h);height:1px;background:var(--gold-500);z-index:30;transition:width 90ms linear}
.ax-read-side{display:none}
@media(max-width:1000px){
  .ax-read{grid-template-columns:minmax(0,1fr);gap:var(--space-6)}
  .ax-read-stick{position:sticky;top:var(--nav-h);background:linear-gradient(to bottom,var(--canvas) 72%,transparent);padding-bottom:var(--space-4);z-index:5}
  .ax-inst-wrap{max-width:340px;margin:0 auto}
  .ax-stage{min-height:60svh}
}
/* Phones: the dial docks into a compact strip with the stage read out beside it,
   so the dial stays legible and the copy keeps two thirds of the screen. */
@media(max-width:760px){
  .ax-read{padding-block:var(--space-6) var(--space-16)!important}
  .ax-read-stick{top:calc(var(--nav-h) - 1px);background:var(--canvas);border-bottom:1px solid var(--hairline);padding-block:var(--space-3);margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut);display:grid;grid-template-columns:104px minmax(0,1fr);gap:var(--space-4);align-items:center}
  .ax-read-stick .ax-inst-wrap{max-width:104px;margin:0}
  .ax-read-stick .ax-readout{display:none}
  .ax-read-side{display:block;min-width:0}
  .ax-read-side .n{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--gold-400)}
  .ax-read-side .l{font-family:var(--font-display);font-weight:500;font-size:16px;line-height:1.25;letter-spacing:-.012em;color:var(--ink);margin-top:5px}
  .ax-read-side .b{margin-top:9px;height:2px;background:var(--surface-3);border-radius:1px;overflow:hidden}
  .ax-read-side .b i{display:block;height:100%;background:var(--gold-500);transition:width 150ms linear}
  .ax-stage{min-height:auto;padding-block:var(--space-8);opacity:1;border-bottom:1px solid var(--hairline)}
  .ax-stage:last-child{border-bottom:0}
  .ax-stage h3{font-size:23px}
  .ax-stage p{font-size:15.5px;max-width:none}
  .ax-stage .ax-facts{max-width:none;margin-top:var(--space-4)}
  .ax-stage-n{margin-bottom:var(--space-2)}
  .ax-prog{display:none}
}

/* ---- editorial rows (About) ---- */
.ax-princ{display:grid;grid-template-columns:72px minmax(0,1fr);gap:var(--space-4);padding:var(--space-8) 0;border-bottom:1px solid var(--hairline)}
.ax-princ-n{font-family:var(--font-mono);font-size:var(--mono-sm-size);color:var(--gold-400);padding-top:6px}
.ax-stated{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--space-6);padding:var(--space-6) 0;border-bottom:1px solid var(--hairline);align-items:baseline}
@media(max-width:700px){.ax-princ{grid-template-columns:minmax(0,1fr);gap:var(--space-2)}.ax-stated{grid-template-columns:minmax(0,1fr);gap:var(--space-2)}}

/* ---- apply tiers ---- */
.ax-tier{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--space-12);padding:var(--space-16) 0;border-bottom:1px solid var(--hairline);align-items:start}
.ax-tier-n{font-family:var(--font-mono);font-size:var(--mono-sm-size);color:var(--gold-400);letter-spacing:.14em;margin-bottom:16px}
@media(max-width:900px){.ax-tier{grid-template-columns:minmax(0,1fr);gap:var(--space-6);padding-block:var(--space-12)}}

/* ---- interactive flowchart ---- */
.ax-fc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:var(--space-12);align-items:start}
.ax-fc-chart{min-width:0}
.ax-fc-row{display:grid;gap:var(--space-3)}
.ax-fc-row-1{grid-template-columns:minmax(0,1fr);max-width:320px;margin:0 auto}
.ax-fc-row-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ax-fc-node{display:flex;flex-direction:column;gap:6px;width:100%;min-height:44px;text-align:left;cursor:pointer;background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:13px 15px;transition:background var(--dur-2) var(--ease-standard),border-color var(--dur-2) var(--ease-standard)}
@media(hover:hover){.ax-fc-node:hover{background:var(--surface-2);border-color:var(--hairline-strong)}}
.ax-fc-node .m{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;color:var(--ink-faint);transition:color var(--dur-2) var(--ease-standard)}
.ax-fc-node .t{font-family:var(--font-display);font-weight:500;font-size:15px;letter-spacing:-.008em;color:var(--ink-muted);transition:color var(--dur-2) var(--ease-standard)}
.ax-fc-node.is-sel{background:var(--surface-3);border-color:var(--gold-600);box-shadow:inset 0 1px 0 var(--edge-top)}
.ax-fc-node.is-sel .m{color:var(--gold-400)}
.ax-fc-node.is-sel .t{color:var(--ink)}
.ax-fc-node.is-live{border-color:var(--hairline-strong)}
.ax-fc-node.is-live .t{color:var(--ink)}
.ax-fc-node.is-mono .t{font-family:var(--font-mono);font-size:14px;letter-spacing:.06em}
.ax-fc-conn{position:relative;height:40px}
.ax-fc-conn i,.ax-fc-conn b{position:absolute;background:var(--hairline-strong);transition:background var(--dur-2) var(--ease-standard)}
.ax-fc-conn i{width:1px}
.ax-fc-conn b{height:1px;left:16.6667%;right:16.6667%;top:20px}
.ax-fc-conn.is-live i,.ax-fc-conn.is-live b{background:var(--gold-600)}
.ax-fc-straight i.c{left:50%;top:0;bottom:0}
.ax-fc-straight b,.ax-fc-straight i.l,.ax-fc-straight i.r,.ax-fc-straight i.m{display:none}
.ax-fc-out i.c{left:50%;top:0;height:20px}
.ax-fc-out i.l{left:16.6667%;top:20px;bottom:0}
.ax-fc-out i.m{left:50%;top:20px;bottom:0}
.ax-fc-out i.r{left:83.3333%;top:20px;bottom:0}
.ax-fc-in i.l{left:16.6667%;top:0;height:20px}
.ax-fc-in i.m{left:50%;top:0;height:20px}
.ax-fc-in i.r{left:83.3333%;top:0;height:20px}
.ax-fc-in i.c{left:50%;top:20px;bottom:0}
.ax-fc-dot{position:absolute;left:calc(50% - 1.5px);width:3px;height:3px;border-radius:50%;background:var(--gold-300);opacity:0;animation:ax-drop 1.9s linear infinite}
@keyframes ax-drop{0%{top:0;opacity:0}18%{opacity:1}82%{opacity:1}100%{top:100%;opacity:0}}
.ax-fc-detail{position:sticky;top:calc(var(--nav-h) + 24px)}
.ax-fc-hint{font-family:var(--font-mono);font-size:var(--mono-sm-size);color:var(--ink-faint);letter-spacing:.06em;margin-bottom:var(--space-4)}
@media(max-width:1000px){.ax-fc{grid-template-columns:minmax(0,1fr);gap:var(--space-8)}.ax-fc-detail{position:static}}
@media(max-width:760px){
  .ax-fc-row-3{grid-template-columns:minmax(0,1fr)}
  .ax-fc-row-1{max-width:none}
  .ax-fc-conn b,.ax-fc-conn i.l,.ax-fc-conn i.r,.ax-fc-conn i.m{display:none}
  .ax-fc-conn i.c{display:block;left:50%;top:0;bottom:0;height:auto}
}
@media(prefers-reduced-motion:reduce){.ax-fc-dot{display:none}}

/* ---- reveal on scroll ---- */
.ax-rev{opacity:0;transform:translateY(8px);transition:opacity 380ms cubic-bezier(.2,0,.2,1),transform 380ms cubic-bezier(.2,0,.2,1)}
.ax-rev.is-in{opacity:1;transform:none}

/* ---- gold accent moments ---- */
.ax-goldline{position:relative}
.ax-goldline::before{content:"";position:absolute;left:0;top:0;width:28px;height:1px;background:var(--gold-500)}
.ax-kv{display:flex;justify-content:space-between;gap:var(--space-4);padding:12px 0;border-bottom:1px solid var(--hairline)}
.ax-kv dt{font-family:var(--font-body);font-size:13px;color:var(--ink-subtle)}
.ax-kv dd{margin:0;font-family:var(--font-mono);font-size:13px;font-variant-numeric:tabular-nums;color:var(--ink)}
.ax-pending{color:var(--ink-faint)}

/* ---- footer ---- */
.ax-foot-top{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:var(--space-8);padding-block:var(--space-16) var(--space-10)}
.ax-foot-col{display:flex;flex-direction:column;gap:10px}
.ax-foot-col a{font-size:13px;color:var(--ink-subtle);min-height:24px;display:flex;align-items:center}

/* ---- mobile nav ---- */
.ax-navbar nav{gap:var(--space-5)}
.ax-menu-btn{display:none}
.ax-scrim-nav{position:fixed;inset:0;z-index:38;background:var(--scrim);border:0;padding:0;cursor:default;animation:ax-fade 150ms var(--ease-standard)}
@keyframes ax-fade{from{opacity:0}to{opacity:1}}
.ax-drawer{position:fixed;inset:var(--nav-h) 0 0;z-index:39;background:var(--surface-1);border-top:1px solid var(--hairline-strong);padding:var(--space-2) var(--gutter-mobile) calc(var(--space-8) + env(safe-area-inset-bottom));display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;animation:ax-slide 200ms var(--ease-standard)}
@keyframes ax-slide{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.ax-drawer a{display:flex;align-items:center;justify-content:space-between;min-height:56px;font-family:var(--font-display);font-weight:500;font-size:19px;letter-spacing:-.014em;color:var(--ink-subtle);border-bottom:1px solid var(--hairline)}
.ax-drawer a[aria-current]{color:var(--ink)}
.ax-drawer a[aria-current]::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold-400)}
.ax-drawer-i{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--ink-faint);padding:var(--space-4) 0 var(--space-2)}
.ax-drawer-cta{margin-top:auto;padding-top:var(--space-6)}
.ax-drawer-cta button{width:100%}
.ax-drawer-mail{display:block;margin-top:var(--space-4);font-family:var(--font-mono);font-size:12px;color:var(--ink-faint);word-break:break-all}
@media(prefers-reduced-motion:reduce){.ax-drawer,.ax-scrim-nav{animation:none}}

@media(max-width:1000px){
  .ax-split{grid-template-columns:minmax(0,1fr);gap:var(--space-10)}
  .ax-g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ax-sec-pad{padding-block:var(--space-20)}
  .ax-hero-in{padding-block:var(--space-20) var(--space-16)}
  .ax-foot-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8)}
}

/* ================= MOBILE ( ≤760px ) =================
   Phone layout is authored, not inherited: single column, 44px+ targets,
   full-width actions, and every dense desktop grid re-flowed by hand. */
@media(max-width:760px){
  :root{--gut:var(--gutter-mobile)}
  .ax-g3,.ax-g2{grid-template-columns:minmax(0,1fr)}
  .ax-grid{gap:var(--space-3)}
  .ax-sec-pad{padding-block:var(--space-12)}
  .ax-split{gap:var(--space-8)}

  /* nav: wordmark left, menu hard right. TopBar styles its own nav inline,
     so hiding it on phones has to outrank that inline display:flex. */
  .ax-navbar{padding-inline:var(--gutter-mobile)!important;gap:var(--space-4)!important}
  .ax-navbar nav{display:none!important}
  .ax-navbar>div:last-child{margin-left:auto}
  .ax-menu-btn{display:inline-flex}
  .ax-menu-btn button{width:44px!important;height:44px!important}
  .ax-menu-hide{display:none}

  /* hero: text first, dial as a contained instrument below it */
  .ax-hero-in{padding-block:var(--space-10) var(--space-12)}
  .ax-hero .ax-split{gap:var(--space-8)}
  .ax-hero .ax-inst-wrap{max-width:min(300px,72vw);margin-inline:auto}
  .ax-lead{font-size:15.5px;line-height:1.6}
  .ax-head{margin-bottom:var(--space-6)!important}
  .ax-field-mask{background:radial-gradient(150% 80% at 50% 0%,transparent 12%,var(--canvas) 72%)}

  /* actions: full-width, thumb-sized */
  .ax-ctas{gap:var(--space-2);margin-top:var(--space-6)}
  .ax-ctas>a,.ax-ctas>span{display:block;width:100%}
  .ax-ctas button{width:100%;justify-content:center;min-height:48px}
  .ax-ctarow{padding-block:var(--space-12)}

  /* meta strip reads as a list, not ragged wrap */
  .ax-strip{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-top:var(--space-8)}
  .ax-strip span{display:flex;align-items:center;gap:8px}
  .ax-strip span::before{content:"";width:3px;height:3px;border-radius:50%;background:var(--gold-500);flex:none}

  /* flowchart: vertical, branch groups bracketed */
  .ax-fc{gap:var(--space-6)}
  .ax-fc-hint{margin-bottom:var(--space-3)}
  .ax-fc-node{min-height:56px;padding:14px 16px;border-radius:var(--radius-lg)}
  .ax-fc-node .m{font-size:9.5px}
  .ax-fc-node .t{font-size:16px}
  .ax-fc-branch{position:relative;padding-left:var(--space-5);display:grid;gap:var(--space-2)}
  .ax-fc-branch::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:var(--hairline-strong)}
  .ax-fc-branch.is-live::before{background:var(--gold-600)}
  .ax-fc-branch-l{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;color:var(--ink-faint);margin-bottom:2px}
  .ax-fc-inline{margin:var(--space-2) 0 var(--space-1)}
  .ax-fc-conn{height:22px}

  /* engine: regime picker stacks, weight bars go two-line */
  .ax-seg{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-2)}
  .ax-seg button{min-height:50px;text-align:left;padding-inline:16px;font-size:15px}
  .ax-seg button[aria-selected=true]{box-shadow:inset 2px 0 0 var(--gold-500)}
  .ax-wbar{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding-block:14px}
  .ax-wbar-code{grid-area:1/1;font-size:14px}
  .ax-wbar-v{grid-area:1/2}
  .ax-wbar-t{grid-area:2/1/3/3;height:7px}

  /* AXIS ladder */
  .ax-rung{padding-inline:0;padding-block:var(--space-6);gap:var(--space-3)}
  .ax-rung>div:first-child{display:flex;align-items:center;gap:12px}
  .ax-rung-i{order:2}
  .ax-rung-code{margin-top:0;font-size:16px}
  .ax-rung.is-flag{margin-inline:calc(var(--gut)*-1);padding-inline:var(--gut)}
  .ax-rung-name{font-size:19px}
  .ax-scale{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}
  .ax-scale-b{grid-area:2/1/3/3}
  .ax-scale-v{min-width:0}

  /* apply tiers + about rows */
  .ax-tier{padding-block:var(--space-10)}
  .ax-tier .ax-body-lg{font-size:16.5px}
  .ax-princ{padding-block:var(--space-6)}
  .ax-stated{padding-block:var(--space-5)}

  /* forms: 48px controls, 16px text (anything smaller makes iOS zoom on focus) */
  .ax-formgrid{gap:var(--space-4)}
  .ax-ta{font-size:16px;padding:12px 13px}
  .ax-formgrid input,.ax-formgrid select{min-height:48px!important;font-size:16px!important}
  .ax-formgrid label{min-height:44px}
  .ax-formgrid input[type=checkbox]{min-height:0!important;width:22px!important;height:22px!important;flex:none}
  .ax-formgrid label:has(input[type=checkbox]){align-items:flex-start;gap:12px;padding-block:8px}
  .ax-flowfoot{margin-top:var(--space-6)!important;padding-top:var(--space-5)!important;gap:var(--space-2)!important}
  .ax-flowfoot button{flex:1;min-height:48px;justify-content:center}
  .ax-stepstrip .ax-mono-sm{font-size:9px}
  .ax-foot-top{grid-template-columns:minmax(0,1fr);gap:var(--space-8);padding-block:var(--space-12) var(--space-8)}

  /* dialogs become bottom sheets */
  div:has(>[role=dialog]){padding:0!important;align-items:flex-end!important}
  .ax-dialog{max-width:none!important;border-radius:var(--radius-xl) var(--radius-xl) 0 0!important;max-height:92dvh;display:flex;flex-direction:column}
  .ax-dialog>div:first-child{padding:var(--space-5) var(--gutter-mobile) var(--space-3)!important}
  .ax-dialog>div:first-child+div{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:var(--space-3) var(--gutter-mobile) var(--space-5)!important}
  .ax-dialog>div:last-child{padding:var(--space-4) var(--gutter-mobile) calc(var(--space-4) + env(safe-area-inset-bottom))!important;gap:var(--space-2)!important}
  .ax-dialog>div:last-child button{flex:1;min-height:48px;justify-content:center}
}

/* ---- narrow phones ( ≤400px ) ---- */
@media(max-width:400px){
  :root{--gut:16px}
  .ax-strip span{font-size:10px}
  .ax-fc-node .t{font-size:15px}
  .ax-rung-name{font-size:18px}
  .ax-kv{gap:var(--space-2)}
  .ax-kv dt{font-size:12.5px}
  .ax-kv dd{font-size:12.5px;text-align:right}
  .ax-drawer a{font-size:18px;min-height:52px}
}

@media(prefers-reduced-motion:reduce){
  .ax-rev{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}
