/* glen-design: v1 */
:root{ --fn-chart-ink:var(--accent); }
.fn-page{ display:grid; gap:var(--s5); }
.fn-page .page-head{ margin-bottom:0; }
.fn-page .btn{ min-height:var(--h-touch); }
.fn-page .card, .fn-page .btn{ transition:none; }
.fn-figures{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s3); }
.fn-figure{ display:flex; flex-direction:column; gap:var(--s3); min-width:0; }
.fn-figure .fig{ font-size:var(--fs-2xl); }
.fn-note{ font-size:var(--fs-sm); line-height:1.4; }
.fn-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5); }
.fn-panel{ min-width:0; }
.fn-wide{ grid-column:1/-1; }
.fn-panel-head{ display:flex; flex-direction:column; gap:var(--s2); margin-bottom:var(--s5); }
.fn-panel-head p{ margin:0; }
.fn-legend{ display:flex; flex-wrap:wrap; gap:var(--s2) var(--s4); color:var(--ink-dim); font-size:var(--fs-sm); margin-bottom:var(--s4); }
.fn-legend>span{ display:inline-flex; align-items:center; gap:var(--s2); }
.fn-key,.fn-age-key{ display:inline-block; width:16px; height:8px; background:var(--accent); border-radius:2px; flex:none; }
.fn-key-cost{ background:var(--ink-dim); }
.fn-key-dash{ background:repeating-linear-gradient(90deg,var(--accent) 0 3px,transparent 3px 6px); }
.fn-key-warn{ background:var(--warn); }
.fn-key-dot{ width:8px; border-radius:50%; background:var(--warn); }
.fn-waterfall{ display:flex; gap:var(--s2); overflow-x:auto; padding:var(--s3) var(--s1) var(--s4); }
.fn-step{ flex:1 0 64px; min-width:0; display:grid; grid-template-rows:28px 220px 64px; gap:var(--s2); padding:var(--s2) var(--s1); border:0; border-radius:var(--r-sm); background:transparent; text-align:center; cursor:pointer; }
.fn-step[aria-pressed="true"]{ background:var(--surface-2); box-shadow:inset 0 0 0 1px var(--accent); }
.fn-step-value{ font-size:var(--fs-micro); color:var(--ink-dim); align-self:end; }
.fn-step-track{ display:block; position:relative; border-bottom:1px solid var(--line-2); }
.fn-step-track i{ position:absolute; left:8%; right:8%; top:var(--top); height:var(--height); min-height:2px; border-radius:3px; background:var(--ink-dim); }
.fn-total .fn-step-track i{ background:var(--accent); box-shadow:0 4px 16px var(--tint-2); }
.fn-step-name{ font-size:var(--fs-micro); line-height:1.35; overflow-wrap:anywhere; }
.fn-detail{ display:grid; grid-template-columns:minmax(180px,.6fr) minmax(0,1.4fr); gap:var(--s5); align-items:center; padding:var(--s5); background:var(--surface-2); border-radius:var(--r-sm); }
.fn-detail>div:first-child{ display:grid; gap:var(--s3); }
.fn-detail .fig{ font-size:var(--fs-2xl); }
.fn-detail p{ margin:0; }
.fn-plot{ width:100%; height:auto; overflow:visible; }
.fn-plot text{ fill:var(--ink-dim); font:var(--fs-micro) var(--font-mono); }
.fn-line{ fill:none; stroke:var(--fn-chart-ink); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; }
.fn-forecast{ stroke-dasharray:4 5; }
.fn-gridline{ stroke:var(--line); }
.fn-buffer{ stroke:var(--warn); stroke-width:1.5; stroke-dasharray:6 5; }
.fn-point{ fill:var(--accent); opacity:.3; transform-box:fill-box; transform-origin:center; }
.fn-low{ fill:var(--warn); stroke:var(--surface-1); stroke-width:2; transform-box:fill-box; transform-origin:center; }
.fn-cost-row{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(64px,1fr) auto; gap:var(--s4); width:100%; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left; padding:var(--s4) 0; cursor:pointer; align-items:center; }
.fn-cost-row>span:first-child{ display:grid; gap:var(--s1); }
.fn-cost-row b{ font-size:var(--fs-sm); font-weight:600; }
.fn-cost-row small{ font-size:var(--fs-micro); }
.fn-cost-row>.num{ font-size:var(--fs-sm); }
.fn-cost-track{ position:relative; height:8px; background:var(--surface-3); border-radius:var(--r-pill); }
.fn-cost-track i{ position:absolute; height:100%; background:var(--accent); border-radius:inherit; }
.fn-cost-track b{ position:absolute; width:2px; height:16px; top:-4px; background:var(--ink); }
.fn-age-0{ background:var(--accent); color:var(--on-accent); }
.fn-age-1{ background:color-mix(in oklab,var(--warn) 55%,var(--surface-1)); color:var(--ink); }
.fn-age-2{ background:var(--warn); color:var(--surface-1); }
.fn-age-3{ background:color-mix(in oklab,var(--bad) 65%,var(--surface-1)); color:var(--ink); }
.fn-age-4{ background:var(--bad); color:var(--surface-1); }
.fn-age-bar{ display:flex; height:var(--h-touch); gap:2px; border-radius:var(--r-sm); overflow:hidden; }
.fn-age-bar>span{ display:grid; place-items:center; min-width:0; font:var(--fs-micro) var(--font-mono); }
.fn-age-bar>span:focus-visible{ outline-offset:-3px; }
.fn-subhead{ margin:var(--s5) 0 var(--s2); }
.fn-debtor{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--s2) var(--s3); padding:var(--s4) 0; border-bottom:1px solid var(--line); align-items:center; }
.fn-debtor>div{ display:grid; }
.fn-debtor .btn{ justify-self:start; }
.fn-debtor>.num{ font-size:var(--fs-sm); }
.fn-timeline{ padding:0; margin:0; list-style:none; }
.fn-timeline li{ display:grid; grid-template-columns:72px minmax(0,1fr) auto; align-items:center; gap:var(--s3); padding:var(--s4) 0; border-bottom:1px solid var(--line); }
.fn-date{ display:grid; font-size:var(--fs-sm); color:var(--accent); }
.fn-date small{ color:var(--ink-dim); font-size:var(--fs-micro); }
.fn-timeline li>b{ font-size:var(--fs-sm); }
.fn-timeline .num{ font-size:var(--fs-sm); }
.fn-divisions{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:var(--s4); }
.fn-division{ display:grid; gap:var(--s2); padding:var(--s4); background:var(--surface-2); border-radius:var(--r-sm); }
.fn-division .fig{ font-size:var(--fs-2xl); margin:var(--s2) 0; }
.fn-clear{ padding:var(--s4); background:var(--ok-tint); border-radius:var(--r-sm); margin:var(--s4) 0 0; }
.fn-focused{ outline:2px solid var(--accent); outline-offset:4px; }
.fn-page button:disabled{ opacity:.4; pointer-events:none; }
@media (hover:hover) and (pointer:fine){
 .fn-page .card:hover,.fn-debtor:hover,.fn-timeline li:hover,.fn-division:hover{ transform:translateY(-2px); }
 .fn-step:hover,.fn-cost-row:hover,.fn-page .btn:hover{ transform:translateY(-2px); background:var(--surface-2); box-shadow:var(--ring); }
 .fn-point:hover,.fn-low:hover{ transform:scale(1.25); opacity:1; }
 .fn-age-bar>span:hover{ transform:scale(1.05); }
}
.fn-page button:active{ transform:scale(.97); }
@media (prefers-reduced-motion:no-preference){
 .fn-page .card,.fn-page button,.fn-debtor,.fn-timeline li,.fn-division,.fn-point,.fn-low,.fn-age-bar>span{ transition:transform var(--dur-base) var(--ease-out),opacity var(--dur-base) var(--ease-out); }
 .fn-step.reveal.in .fn-step-track i{ animation:fn-drop var(--dur-reveal) var(--ease-out) backwards; animation-delay:calc(var(--i) * var(--stagger)); }
 @keyframes fn-drop{ from{ opacity:0; transform:translateY(-8px); } }
 .fn-page button:active{ transition-duration:var(--dur-instant); }
}
@media (prefers-reduced-motion:reduce){ .fn-page *{ animation:none!important; transition:none!important; } }
@media(max-width:1000px){ .fn-grid{ grid-template-columns:1fr; } .fn-figures{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px){
 .fn-page{ gap:var(--s4); } .fn-panel,.fn-figure{ padding:var(--s4); } .fn-figure .fig{ font-size:var(--fs-xl); }
 .fn-figures{ gap:var(--s2); } .fn-detail{ grid-template-columns:1fr; padding:var(--s4); gap:var(--s3); }
 .fn-waterfall{ scroll-snap-type:x mandatory; } .fn-step{ flex-basis:76px; scroll-snap-align:start; }
 .fn-step{ grid-template-rows:28px 180px 64px; } .fn-cost-row{ gap:var(--s2); } .fn-timeline li{ grid-template-columns:64px minmax(0,1fr); } .fn-timeline .num{ grid-column:2; }
 .fn-age-bar>span>span{ display:none; } .fn-divisions{ grid-template-columns:1fr; }
}