/* shadcn Studio static ports; source IDs and adaptation notes in docs/tokenomics-components.md.
   The document's own container, not the viewport, determines component reflow. */
.doc-figure { margin:32px 0; padding:28px; border:1px solid var(--line); border-radius:16px; background:var(--surface); min-width:0; }
.paper-body .doc-heading { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px 24px; margin-bottom:28px; }
.paper-body .doc-heading h3 { margin:0; font-size:1.25rem; letter-spacing:-.02em; font-weight:500; }
.doc-context, .doc-kicker { color:var(--muted); font-size:.75rem; line-height:1.5; }
.paper-body .doc-figure p, .paper-body .doc-goals p, .paper-body .doc-note p, .paper-body .doc-progress p { font-size:.875rem; line-height:1.7; margin-top:8px; }
.paper-body .doc-figure .doc-intro { margin:0 0 24px; }
.doc-figure figcaption { display:block; margin-top:24px; padding-top:20px; border-top:1px solid var(--line); font-size:.8125rem; line-height:1.7; color:var(--muted); }
.doc-figure h4, .doc-figure h5 { margin:0; }
.doc-heading + .doc-timeline { margin-top:0; }
.doc-icon { display:block; width:20px; height:20px; flex:none; stroke-width:1.5; color:var(--ttp-blue); }
.doc-icon-slot { display:flex; align-items:center; justify-content:center; flex:none; width:36px; height:36px; border-radius:8px; background:var(--card-2); }
.doc-features { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.doc-feature { display:flex; align-items:flex-start; gap:12px; min-width:0; }
.doc-feature h4 { font-size:.9375rem; line-height:1.45; font-weight:500; }
.doc-feature p { color:var(--muted); }
.doc-product-image { display:block; width:100%; height:auto; margin-bottom:28px; border-radius:8px; }
.doc-goals { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; margin-top:32px; }
.doc-goals > div { border-top:1px solid var(--line); padding-top:24px; }
.paper-body .doc-goals h3 { font-size:1.25rem; margin-top:16px; }
/* Large ordered nodes with measured Magic UI beam connectors. */
.doc-beam { position:relative; margin:32px 0 28px; container:beam / inline-size; --beam-node:72px; }
.doc-beam ol { position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; list-style:none; padding:0; margin:0; }
.doc-beam li { position:relative; display:flex; flex-direction:column; align-items:center; gap:16px; min-width:0; }
.doc-beam-node { position:relative; z-index:1; width:var(--beam-node); height:var(--beam-node); display:grid; place-items:center; background:var(--surface); border:1px solid var(--line-strong); border-radius:18px; }
.doc-beam-node .doc-icon { display:block; width:34px; height:34px; }
.doc-beam-node:has(img) { border:0; background:transparent; }
.doc-beam-node img { width:var(--beam-node); height:var(--beam-node); object-fit:contain; }
.doc-beam-label { font-size:1rem; line-height:1.4; text-align:center; }
.doc-beam li:not(:last-child)::after { content:""; position:absolute; top:calc(var(--beam-node) / 2 - 1px); left:calc(50% + var(--beam-node) / 2 + 6px); width:calc(100% - var(--beam-node)); height:2px; background:var(--line-strong); }
.doc-beam li:not(:last-child)::before { content:""; position:absolute; top:calc(var(--beam-node) / 2 - 5px); left:calc(150% - var(--beam-node) / 2 - 2px); width:8px; height:8px; border-top:2px solid var(--ttp-blue); border-right:2px solid var(--ttp-blue); transform:rotate(45deg); }
@container beam (max-width:400px) {
 .doc-beam ol { --beam-node:48px; gap:6px; }
 .doc-beam-node { border-radius:12px; }
 .doc-beam-node .doc-icon { display:block; width:26px; height:26px; }
 .doc-beam-label { font-size:.875rem; }
}
.doc-beam[data-enhanced] li::before, .doc-beam[data-enhanced] li::after { display:none; }
.doc-beam-paths { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.doc-beam-base { fill:none; stroke:var(--line-strong); stroke-width:2; }
.doc-flow-pulse { fill:none; stroke:var(--ttp-blue); stroke-width:3; stroke-linecap:round; stroke-dasharray:.16 .84; stroke-dashoffset:1; opacity:0; animation:doc-route-flow 3.6s linear infinite; animation-play-state:paused; pointer-events:none; }
[data-motion-paused="false"] .doc-flow-pulse { animation-play-state:running; }
@keyframes doc-route-flow {
  0% { stroke-dashoffset:1; opacity:0; }
  8% { opacity:.9; }
  40% { opacity:.9; }
  50%, 100% { stroke-dashoffset:0; opacity:0; }
}
@media (prefers-reduced-motion:reduce) { .doc-flow-pulse { display:none; } }
.doc-beam-arrow { fill:none; stroke:var(--ttp-blue); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.doc-goals > .doc-motion-toggle { grid-column:1 / -1; justify-self:end; margin-top:-12px; }
.doc-motion-toggle { border:1px solid var(--line); background:transparent; color:var(--muted); border-radius:6px; padding:10px 14px; min-height:44px; font:inherit; font-size:.75rem; cursor:pointer; }
.doc-motion-toggle[hidden] { display:none; }
.doc-motion-toggle:focus-visible { outline:2px solid var(--ttp-blue); outline-offset:3px; }
.doc-total { display:flex; align-items:center; gap:16px; margin-bottom:28px; }
.doc-total img { object-fit:contain; }
.doc-total > div > span { display:block; color:var(--muted); font-size:.8125rem; margin-bottom:8px; }
.doc-total strong { display:block; font-size:2rem; letter-spacing:-.035em; font-weight:500; line-height:1.15; font-variant-numeric:tabular-nums; }
.doc-total small { font-size:1rem; color:var(--muted); letter-spacing:0; }
.doc-category { display:flex; height:12px; width:100%; border-radius:4px; overflow:clip; }
.doc-color-0 { background:var(--ttp-blue); }
.doc-color-1 { background:#487393; }
.doc-category-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto auto auto; grid-auto-flow:column; gap:0 24px; margin-top:24px; }
.doc-category-legend > div { display:contents; } /* label, value and detail rows align across both columns even when one label wraps */
.doc-category-legend dt { display:flex; align-items:center; align-self:end; gap:8px; color:var(--muted); font-size:.8125rem; line-height:1.5; }
.doc-category-legend dd { font-size:1.75rem; margin:12px 0 8px; letter-spacing:-.025em; }
.doc-swatch { width:8px; height:8px; border-radius:2px; flex:none; }
.doc-timeline { list-style:none; margin:32px 0 0; padding:0; }
.doc-timeline > li { position:relative; display:grid; grid-template-columns:132px 18px minmax(0,1fr); column-gap:16px; padding-bottom:32px; }
.doc-timeline > li:last-child { padding-bottom:0; }
.doc-timeline > li::before { content:""; position:absolute; top:14px; bottom:-1px; left:156px; width:1px; background:var(--line-strong); }
.doc-timeline > li:last-child::before { display:none; }
.doc-timeline-meta { color:var(--muted); font-size:.75rem; line-height:1.65; padding-top:1px; text-align:right; }
.doc-timeline-node { margin-top:3px; display:block; width:16px; height:16px; border:4px solid var(--surface); outline:1px solid var(--line-strong); border-radius:50%; background:var(--ttp-blue); z-index:1; }
.doc-timeline-content { min-width:0; }
.doc-timeline-content h4 { font-size:1rem; font-weight:500; line-height:1.4; }
.doc-timeline-content h5 { font-size:.8125rem; font-weight:500; color:var(--text); }
.doc-timeline-content p { margin-top:6px; }
.doc-inline-note { display:flex; align-items:center; gap:10px; border-top:1px solid var(--line); padding-top:20px; margin-top:28px; font-size:.8125rem; }
.doc-market-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; list-style:none; padding:24px 0; margin-top:24px; border-block:1px solid var(--line); }
.doc-market-list li { display:flex; align-items:center; gap:12px; min-width:0; }
.doc-market-list img { flex:none; }
.doc-market-list strong { display:block; font-size:.875rem; font-weight:500; }
.doc-market-list span { display:block; color:var(--muted); font-size:.75rem; margin-top:4px; }
.doc-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:0; }
.doc-stat { min-width:0; padding:20px; border:1px solid var(--line); border-radius:12px; display:flex; flex-direction:column; align-items:stretch; gap:12px; }
.doc-stat dt { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:.8125rem; line-height:1.5; color:var(--muted); }
.doc-stat dd:not(.doc-stat-detail) { font-size:clamp(1.5rem,4cqi,2rem); margin:0; letter-spacing:-.035em; line-height:1.15; font-variant-numeric:tabular-nums; }
.doc-stat .doc-stat-detail, .doc-category-legend .doc-stat-detail { margin:0; letter-spacing:0; font-weight:400; color:var(--muted); font-size:.75rem; line-height:1.7; }
.doc-stat--positive dd { color:var(--accent); }
/* Exact migration amounts use the sourced statistics anatomy inside the timeline. */
/* Text-relative minimums stack enlarged values while keeping at most two columns. */
.doc-stats--liquidity { margin-block:20px; gap:20px; grid-template-columns:repeat(auto-fit,minmax(min(100%,max(12rem,calc((100% - 20px)/2))),1fr)); }
.doc-stats--liquidity .doc-stat { border:0; border-radius:0; padding:0; gap:8px; }
.doc-stats--liquidity .doc-stat dd:not(.doc-stat-detail) { font-size:1.5rem; white-space:nowrap; }
.doc-stats--burn { grid-template-columns:1fr; }
.doc-stats--summary { margin-bottom:28px; }
.doc-stats--summary .doc-stat { border:0; border-radius:0; padding:0; }
.doc-stats--summary .doc-stat dd:not(.doc-stat-detail) { font-size:clamp(1.5rem,4cqi,2rem); }
.doc-bars { display:grid; gap:8px; margin:0; }
.doc-bar-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:20px; min-height:36px; }
.doc-bar-row dt { position:relative; min-width:0; display:flex; align-items:center; min-height:36px; font-size:.8125rem; }
.doc-bar-fill { position:absolute; inset-block:0; inset-inline-start:0; background:color-mix(in srgb,var(--accent) 20%,transparent); border-radius:3px; }
.doc-bar-fill--accent { background:color-mix(in srgb,var(--ttp-blue) 25%,transparent); }
.doc-bar-row dt > span:last-child { position:relative; padding-inline:10px; }
.doc-bar-row dd { margin:0; min-width:100px; text-align:right; font-size:.8125rem; font-variant-numeric:tabular-nums; white-space:nowrap; }
.doc-bar-labels { display:flex; justify-content:space-between; gap:24px; margin-bottom:12px; font-size:.75rem; color:var(--muted); }
.paper-body .doc-small { font-size:.75rem; margin-top:20px; color:var(--muted); }
.doc-report { display:grid; grid-template-columns:200px minmax(0,1fr); gap:32px; align-items:start; }
.doc-report-document { display:grid; gap:14px; justify-items:start; }
.doc-report-cover { display:block; width:100%; }
.doc-report-cover img { display:block; width:100%; height:auto; border:1px solid var(--line); border-radius:3px; }
.doc-report .doc-stats { gap:0 24px; grid-template-columns:repeat(auto-fit,minmax(min(100%,max(9rem,calc((100% - 24px)/2))),1fr)); }
.doc-report .doc-stat { padding:12px 0; border:0; border-radius:0; border-top:1px solid var(--line); }
.doc-report .doc-stat dd:not(.doc-stat-detail) { order:-1; font-size:clamp(1.5rem,4cqi,2.25rem); }
.doc-report-link { margin:0; font-size:.8125rem; }
.doc-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.doc-comparison > div + div { border-left:1px solid var(--line); padding-left:28px; }
.doc-comparison h4 { font-weight:500; font-size:1rem; margin-bottom:20px; }
.doc-comparison dl { margin:0; display:grid; gap:16px; }
.doc-comparison dt { font-size:.75rem; color:var(--muted); }
.doc-comparison dd { margin:4px 0 0; font-size:.875rem; line-height:1.5; }
.doc-ledger { margin:0 0 28px; }
.doc-ledger > div { display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:14px 0; border-bottom:1px solid var(--line); }
.doc-ledger dt { color:var(--muted); font-size:.8125rem; }
.doc-ledger dd { margin:0; white-space:nowrap; font-size:.9375rem; font-variant-numeric:tabular-nums; }
.doc-ledger .doc-ledger-total { padding-block:20px; }
.doc-ledger-total dt, .doc-ledger-total dd { color:var(--text); font-weight:500; }
.doc-features--two { grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--line); margin-top:24px; padding-top:24px; }
/* Studio tabs-03 controls, made prominent for the four-stage visual model. */
.doc-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:32px; }
.doc-tabs[hidden], .doc-tab-panel[hidden] { display:none; }
.doc-tabs button { font:inherit; color:var(--muted); border:1px solid var(--line); background:transparent; border-radius:8px; font-size:.8125rem; min-height:84px; padding:12px; display:grid; grid-template-columns:28px 1fr; align-items:center; justify-items:start; gap:10px; line-height:1.4; cursor:pointer; text-align:left; }
.doc-tabs button > .doc-icon { display:block; display:none; }
.doc-tab-number { display:grid; place-items:center; width:28px; height:28px; border:1px solid var(--line-strong); border-radius:50%; color:var(--text); font-size:.875rem; font-weight:500; font-variant-numeric:tabular-nums; }
.doc-tabs button[aria-selected="true"] { color:var(--text); border-color:var(--ttp-blue); background:color-mix(in srgb,var(--ttp-blue) 8%,var(--surface)); }
.doc-tabs button[aria-selected="true"] .doc-tab-number { color:var(--bg); border-color:var(--ttp-blue); background:var(--ttp-blue); }
.doc-tabs button:hover { border-color:var(--ttp-blue); }
.doc-tabs button:focus-visible, .doc-tab-panel:focus-visible { outline:2px solid var(--ttp-blue); outline-offset:3px; }
.doc-tab-panel + .doc-tab-panel:not([hidden]) { margin-top:40px; padding-top:32px; border-top:1px solid var(--line); }
.doc-tab-panel h4 { font-size:1rem; font-weight:500; }
.doc-market-charts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:32px; row-gap:0; }
.doc-chart-block { min-width:0; display:grid; grid-row:span 4; grid-template-rows:subgrid; }
.doc-chart-block + .doc-chart-block { position:relative; }
.doc-chart-block + .doc-chart-block::before { content:""; position:absolute; left:-16px; top:0; bottom:0; border-left:1px solid var(--line); }
.doc-chart-heading { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px 12px; }
.doc-chart-heading > span { color:var(--muted); font-size:.75rem; }
.doc-chart-value, .doc-reserve-values { min-height:72px; margin:20px 0 12px; display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; }
.doc-chart-value strong { font-size:2rem; font-weight:500; letter-spacing:-.035em; line-height:1.2; font-variant-numeric:tabular-nums; }
.doc-chart-value > span { font-size:.8125rem; color:var(--ttp-blue); }
.doc-reserve-values { flex-direction:column; justify-content:flex-start; gap:8px; }
.doc-reserve-values > span { display:flex; align-items:center; gap:8px; font-size:.8125rem; color:var(--muted); }
.doc-reserve-values strong { color:var(--text); font-size:1rem; font-weight:500; font-variant-numeric:tabular-nums; }
.doc-chart-svg { display:block; width:100%; height:auto; overflow:visible; }
.doc-chart-svg text { font-family:inherit; font-size:16px; font-variant-numeric:tabular-nums; fill:var(--muted); }
.doc-chart-grid { stroke:var(--line); stroke-dasharray:3 4; }
.doc-chart-baseline { stroke:var(--muted); stroke-dasharray:5 5; }
.doc-chart-line { fill:none; stroke:var(--ttp-blue); stroke-width:3; }
.doc-chart-future { fill:none; stroke:var(--muted); stroke-dasharray:4 6; stroke-width:1.5; }
.doc-chart-dot { fill:var(--surface); stroke:var(--muted); stroke-width:2; }
.doc-chart-selected { fill:var(--ttp-blue); stroke:var(--surface); stroke-width:3; }
.doc-chart-svg .is-selected { fill:var(--text); font-weight:500; }
.doc-chart-bar--0 { fill:var(--ttp-blue); }
.doc-chart-bar--1 { fill:#487393; }
.doc-chart-start { fill:none; stroke:var(--muted); stroke-dasharray:4 4; }
.paper-body .doc-chart-key { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px; color:var(--muted); font-size:.75rem; margin:16px 0 0; line-height:1.5; }
.doc-chart-key-line { width:16px; border-top:2px solid var(--ttp-blue); }
.doc-chart-key-line--future { border-top:2px dashed var(--muted); margin-left:8px; }
.doc-outline-key { width:12px; height:12px; border:1px dashed var(--muted); }
.doc-market-story { display:flex; gap:16px; align-items:flex-start; padding:24px 0; margin-top:24px; border-block:1px solid var(--line); }
.doc-story-icon { display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:10px; background:color-mix(in srgb,var(--ttp-blue) 8%,var(--surface)); }
.doc-story-icon .doc-icon { display:block; width:24px; height:24px; }
.paper-body .doc-market-story p { margin:8px 0 0; }
.doc-supply { margin-top:24px; }
.doc-supply-heading { display:flex; align-items:baseline; flex-wrap:wrap; justify-content:space-between; gap:8px; font-size:.8125rem; color:var(--muted); }
.doc-supply-heading strong { color:var(--text); font-size:1.25rem; font-weight:500; font-variant-numeric:tabular-nums; }
.doc-supply-heading small { font-size:.75rem; font-weight:400; color:var(--muted); }
.doc-supply-bar { display:flex; height:12px; border-radius:3px; overflow:clip; margin:12px 0 16px; background:var(--card-2); }
.doc-supply-bar > span { background:#487393; }
.doc-supply-bar > i { background:repeating-linear-gradient(120deg,transparent 0 3px,var(--ttp-blue) 3px 4px); border:1px solid var(--ttp-blue); box-sizing:border-box; }
.doc-supply-bar > i[style="width:0%"] { border:0; }
.doc-supply-detail { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 24px; font-size:.75rem; color:var(--muted); }
.doc-supply-detail > span { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.doc-supply-detail strong { color:var(--text); font-weight:500; font-variant-numeric:tabular-nums; }
.doc-supply-detail .doc-icon { display:block; width:16px; height:16px; }
.doc-note { display:flex; align-items:flex-start; gap:16px; padding:24px; border:1px solid var(--line); border-radius:12px; background:var(--surface); margin-block:28px; }
.paper-body .doc-note h3 { margin:0; font-size:1rem; }
.doc-wallet { padding:20px; border:1px solid var(--line); border-radius:8px; margin-top:24px; }
.doc-wallet > span { font-size:.8125rem; }
.doc-wallet code { display:block; overflow-wrap:anywhere; font-size:.8125rem; line-height:1.7; margin-top:12px; color:var(--text); }
.doc-wallet a { display:inline-flex; margin-top:16px; font-size:.8125rem; }
.doc-roadmap-tracks { display:grid; gap:20px; margin-top:20px; }
.doc-badge { display:inline-flex; align-items:center; padding:3px 8px; border:1px solid var(--line); border-radius:5px; font-size:.6875rem; line-height:1.5; color:var(--muted); }
.doc-timeline-meta .doc-badge { margin-top:8px; }
.doc-badge--done { color:var(--accent); }
.doc-progress { margin-top:32px; }
.paper-body .doc-progress > h3 { margin:0 0 24px; }
/* Status matrix: common row tracks, with each milestone anchored to a workstream. */
.doc-workstreams { border:1px solid var(--line); border-radius:16px; background:var(--surface); overflow:clip; }
.doc-workstreams-head, .doc-workstream-row { display:grid; grid-template-columns:116px repeat(2,minmax(0,1fr)); }
.doc-workstreams-head { background:var(--card-2); }
.doc-workstreams-head > * { padding:20px; }
.doc-workstreams-head > span { color:var(--muted); font-size:.75rem; align-self:center; }
.paper-body .doc-workstreams-head h4 { display:flex; align-items:center; gap:10px; margin:0; font-size:1rem; font-weight:500; }
.doc-workstreams-head .doc-icon { width:20px; height:20px; flex:none; }
.doc-workstream-row { border-top:1px solid var(--line); }
.paper-body .doc-workstream-status { display:flex; align-items:flex-start; gap:8px; padding:24px 16px; margin:0; font-size:.75rem; font-weight:500; line-height:1.5; color:var(--muted); }
.doc-workstream-status .doc-icon { width:16px; height:16px; margin-top:1px; color:inherit; flex:none; }
.doc-workstream-row--done { background:color-mix(in srgb,var(--accent) 4%,var(--surface)); }
.doc-workstream-row--done .doc-workstream-status { color:var(--accent); }
.doc-workstream-row--active .doc-workstream-status { color:var(--ttp-blue); }
.doc-workstream-cell { min-width:0; padding:24px; border-left:1px solid var(--line); }
.doc-workstreams ul { list-style:none; padding:0; margin:0; display:grid; gap:24px; }
.doc-workstreams li + li { padding-top:24px; border-top:1px solid var(--line); }
.doc-workstream-title { display:block; margin:0; font-size:.875rem; line-height:1.5; font-weight:500; color:var(--text); }
.paper-body .doc-workstreams p { font-size:.8125rem; line-height:1.7; margin:8px 0 0; }
.doc-workstreams .doc-badge { margin-top:8px; }
.doc-workstream-mobile-label { display:none; }
.paper-body .doc-workstreams .doc-workstream-empty { margin:0; font-size:.75rem; }
@container paper (max-width:720px) {
 .doc-workstreams-head, .doc-workstream-row { grid-template-columns:96px repeat(2,minmax(0,1fr)); }
 .doc-workstreams-head > *, .doc-workstream-cell { padding:20px 16px; }
 .paper-body .doc-workstream-status { padding:20px 12px; }
}
@container paper (max-width:560px) {
 .doc-workstreams-head { display:none; }
 .doc-workstream-row { display:block; }
 .doc-workstreams-head + .doc-workstream-row { border-top:0; }
 .paper-body .doc-workstream-status { padding:16px 20px; background:var(--card-2); }
 .doc-workstream-cell { border-left:0; padding:24px 20px; }
 .doc-workstream-cell + .doc-workstream-cell { border-top:1px solid var(--line); }
 .doc-workstream-mobile-label { display:block; color:var(--muted); font-size:.75rem; margin-bottom:16px; }
}
.doc-stats--current { grid-template-columns:repeat(auto-fit,minmax(min(100%,max(12rem,calc((100% - 32px)/3))),1fr)); margin-top:28px; }
.doc-stats--current .doc-stat { background:var(--surface); }
.doc-stats--current .doc-stat dd:not(.doc-stat-detail) { font-size:2rem; }
.doc-sources { margin-top:24px; }
.doc-sources > div { display:grid; grid-template-columns:140px minmax(0,1fr); gap:24px; padding-block:16px; border-bottom:1px solid var(--line); }
.doc-sources dt { font-size:.75rem; color:var(--muted); line-height:1.6; padding-top:2px; }
.doc-sources dd { margin:0; font-size:.8125rem; line-height:1.7; }
.doc-sources ul { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
@container paper (max-width:720px) {
 .doc-figure { padding:24px; }
 .doc-features { grid-template-columns:1fr; gap:20px; }
 .doc-features--two { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .doc-stats--current, .doc-stats--liquidity { grid-template-columns:1fr; }
 .doc-stats--current .doc-stat { display:grid; grid-template-columns:110px minmax(0,1fr); gap:10px 24px; }
 .doc-stats--current .doc-stat dt { grid-row:span 2; align-self:start; }
 .doc-stats--current .doc-stat dd:not(.doc-stat-detail) { font-size:1.75rem; }
 .doc-stats--current .doc-stat .doc-stat-detail { margin:0; letter-spacing:0; font-weight:400; grid-column:2; }
}
@container paper (max-width:560px) {
 .doc-goals, .doc-comparison, .doc-features--two { grid-template-columns:1fr; }
 .doc-goals { gap:24px; }
 .doc-timeline > li { grid-template-columns:18px minmax(0,1fr); gap:8px 14px; }
 .doc-timeline > li::before { left:8px; top:14px; }
 .doc-timeline-node { grid-column:1; grid-row:1 / span 2; }
 .doc-timeline-meta { grid-column:2; grid-row:1; text-align:left; }
 .doc-timeline-meta br { display:none; }
 .doc-timeline-meta .doc-badge { margin:0 0 0 8px; }
 .doc-timeline-content { grid-column:2; }
 .doc-report { grid-template-columns:1fr; gap:24px; }
 .doc-report-document { gap:12px; }
 .doc-report-cover { width:140px; }
 .doc-report .doc-stat dd:not(.doc-stat-detail) { font-size:1.5rem; white-space:nowrap; }
 .doc-comparison > div + div { border-left:0; padding-left:0; border-top:1px solid var(--line); padding-top:24px; }
 .doc-comparison dl > div { display:grid; grid-template-columns:100px minmax(0,1fr); gap:16px; }
 .doc-comparison dd { margin:0; }
 .doc-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .doc-tabs button { min-height:64px; }
 .doc-market-charts { grid-template-columns:1fr; gap:32px; }
 .doc-chart-block { grid-template-rows:auto auto auto auto; }
 .doc-chart-block + .doc-chart-block { border-top:1px solid var(--line); padding-top:24px; }
 .doc-chart-block + .doc-chart-block::before { display:none; }
 .doc-chart-value, .doc-reserve-values { min-height:0; margin-bottom:24px; }
 .doc-chart-svg { max-width:420px; margin-inline:auto; }

 .doc-market-list { grid-template-columns:1fr; gap:20px; }
 .doc-market-list li { gap:16px; }
 .doc-sources > div { grid-template-columns:1fr; gap:12px; }
}
@container paper (max-width:340px) { .doc-report .doc-stats { grid-template-columns:minmax(0,1fr); } } /* 320px phones: a nowrap "2020–2026" needs the full width */
@container paper (max-width:390px) {
 .doc-figure { padding:20px 16px; border-radius:12px; }
 .doc-heading { margin-bottom:24px; }
 .doc-chart-svg text { font-size:17px; }
 .doc-market-story { gap:12px; }
 .doc-story-icon { width:36px; height:36px; }
 .doc-category-legend { gap:0 16px; }
 .doc-category-legend dd { font-size:1.5rem; }
 .doc-total strong { font-size:1.75rem; }
 .doc-total img { width:48px; height:48px; }
 .doc-stats--summary { grid-template-columns:1fr; gap:20px; }
 .doc-stats--summary .doc-stat dd:not(.doc-stat-detail) { font-size:1.75rem; }
 .doc-bar-row { gap:12px; }
 .doc-bar-row dd { min-width:94px; font-size:.75rem; }
 .doc-bar-row dt { font-size:.75rem; }
 .doc-bar-row dt > span:last-child { padding-inline:6px; }
 .doc-note { padding:20px 16px; gap:12px; }
 .doc-ledger > div { gap:12px; }
 .doc-ledger dt { font-size:.75rem; }
 .doc-ledger dd { font-size:.8125rem; }


 .doc-stat dt { font-size:.75rem; }
 .doc-stats--current .doc-stat { display:flex; }
}
@media (forced-colors:active) { .doc-bar-fill, .doc-category > span,  .doc-chart-bar { border:1px solid CanvasText; } .doc-tabs button[aria-selected="true"] { outline:2px solid Highlight; } }

/* Studio chart / report composition: money movements and execution sequence. */
.doc-return-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-bottom:28px; }
.doc-return-summary > div > span { color:var(--muted); font-size:.8125rem; display:block; margin-bottom:10px; }
.doc-return-summary strong { display:block; font-size:clamp(1.5rem,4cqi,2rem); letter-spacing:-.035em; font-weight:500; font-variant-numeric:tabular-nums; }
.doc-return-summary small { font-size:1rem; letter-spacing:0; white-space:nowrap; }
.doc-positive { color:var(--accent); }
.doc-waterfall { padding-block:12px; }
.doc-waterfall .doc-chart-svg { max-width:720px; margin:auto; }
.doc-waterfall .doc-chart-svg text { font-size:16px; }
.doc-waterfall .doc-chart-svg .doc-waterfall-value { fill:var(--text); font-weight:500; }
.doc-waterfall-link { fill:none; stroke:var(--muted); stroke-dasharray:3 4; }
.doc-allocation-branches { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-block:24px 32px; }
.doc-allocation-branches > div { position:relative; padding-top:20px; border-top:2px solid var(--ttp-blue); }
.doc-allocation-branches > div + div { border-color:var(--accent); }
.doc-allocation-symbol { display:block; margin-bottom:12px; }
.doc-allocation-symbol .doc-icon { display:block; width:28px; height:28px; }
.doc-allocation-branches > div + div .doc-icon { display:block; color:var(--accent); }
.doc-allocation-branches h4 { margin:10px 0 0; font-size:1.75rem; font-weight:500; letter-spacing:-.025em; }
.doc-allocation-branches h4 > span { display:block; font-size:1rem; letter-spacing:0; margin-top:8px; }
.doc-risk-comparison { display:grid; grid-template-columns:1fr 1.1fr; gap:28px; padding-block:24px; border-block:1px solid var(--line); }
.doc-risk-comparison h4, .doc-purchase-plan h4 { font-size:1.125rem; font-weight:500; }
.doc-risk-comparison dl { display:grid; gap:16px; margin:0; }
.doc-risk-comparison dt { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:.8125rem; }
.doc-risk-comparison dt > span { color:var(--text); font-variant-numeric:tabular-nums; }
.doc-risk-comparison small { color:var(--accent); font-size:.75rem; padding-left:6px; }
.doc-risk-comparison dd { margin:10px 0 0; height:12px; background:var(--card-2); border-radius:3px; overflow:clip; }
.doc-risk-comparison i { display:block; height:100%; background:#487393; }
.doc-risk-comparison dl > div + div i { background:var(--accent); }
.doc-purchase-plan { margin-top:32px; }
.doc-order-heading { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:12px; margin:28px 0 16px; }
.doc-order-heading strong { font-size:1.75rem; font-weight:500; letter-spacing:-.035em; }
.doc-order-heading > span { color:var(--muted); font-size:.8125rem; }
.doc-order-series { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; padding:0; margin:0; list-style:none; }
.doc-order-series li { display:flex; flex-direction:column; gap:10px; min-width:0; }
.doc-order-series li > span { color:var(--muted); font-size:.75rem; }
.doc-order-series strong { font-size:1rem; font-weight:500; font-variant-numeric:tabular-nums; }
.doc-order-series i { display:block; height:48px; background:color-mix(in srgb,var(--ttp-blue) 30%,transparent); border-top:3px solid var(--ttp-blue); border-radius:3px; }
.doc-purchase-flow { margin-top:24px; }
.doc-purchase-flow .doc-beam { max-width:620px; margin:32px auto 24px; }
.doc-purchase-flow > button { display:block; margin-left:auto; }
.doc-purchase-flow > button[hidden] { display:none; }
@container paper (max-width:560px) {
 .doc-return-summary, .doc-allocation-branches, .doc-risk-comparison { grid-template-columns:1fr; }
 .doc-return-summary { gap:20px; }
 .doc-order-series { grid-template-columns:1fr; gap:10px; }
 .doc-order-series li { display:grid; grid-template-columns:50px 1fr 68px; gap:12px; align-items:center; }
 .doc-order-series i { grid-column:2; grid-row:1; height:20px; border:0; border-right:3px solid var(--ttp-blue); }
 .doc-order-series strong { grid-column:3; grid-row:1; font-size:.875rem; text-align:right; }
 .doc-waterfall { padding-inline:12px; } /* ponytail: "$500k" axis label crossed the frame border at 390/430px (web #259 review) */
 .doc-waterfall .doc-chart-svg text { font-size:20px; }
 .doc-purchase-flow .doc-beam-label { font-size:.875rem; }
}
.doc-execution-definitions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; margin-block:28px; }
.doc-execution-definitions h4 { font-size:1.125rem; font-weight:500; margin:0; }
.paper-body .doc-execution-definitions p { margin:10px 0 0; }
@container paper (max-width:560px) { .doc-execution-definitions { grid-template-columns:1fr; gap:24px; } }

/* One measured orbit, bounded nodes and endpoint-aligned arrowheads. The
   rectangular node includes its label, so connectors never cross that label. */
.doc-flywheel { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:32px; align-items:center; }
.doc-flywheel-visual { min-width:0; }
.doc-flywheel-orbit { position:relative; width:100%; aspect-ratio:2/3; max-width:480px; margin:auto; container:orbit / inline-size; }
.doc-flywheel-svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.doc-cycle-path { fill:none; stroke:#487393; stroke-width:2; }
.doc-cycle-path[data-active="true"] { stroke:var(--ttp-blue); }
.doc-flywheel .doc-flow-pulse { animation-name:doc-cycle-flow; }
@keyframes doc-cycle-flow {
  0% { stroke-dashoffset:1; opacity:0; }
  2%, 19% { opacity:1; }
  25%, 100% { stroke-dashoffset:0; opacity:0; }
}
.doc-cycle-share-leader { fill:none; stroke:var(--ttp-blue); stroke-width:1; }
.doc-cycle-branch { fill:none; stroke:var(--ttp-blue); stroke-width:2; }
.doc-cycle-chevron { fill:none; stroke:var(--ttp-blue); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.doc-cycle-share { position:absolute; transform:translate(-50%,-50%); color:var(--ttp-blue); font-size:.8125rem; font-weight:500; line-height:1; padding:5px 7px; border:1px solid var(--line-strong); border-radius:20px; background:var(--surface); }
.doc-cycle-share--retain { left:25.25%; top:49.83%; }
.doc-cycle-share--burn { left:50%; top:75.17%; }
.doc-flywheel-center { position:absolute; left:50%; top:33.333333%; transform:translate(-50%,-50%); width:27%; }
.doc-flywheel-center img { display:block; width:100%; height:auto; }
.doc-cycle-node { position:absolute; transform:translate(-50%,-50%); width:clamp(76px,22cqi,106px); min-height:100px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; background:var(--surface); border:1px solid var(--line-strong); border-radius:12px; color:var(--text); padding:12px 6px; cursor:pointer; font:inherit; }
.doc-cycle-node--0 { left:50%; top:10%; }
.doc-cycle-node--1 { left:85%; top:33.333333%; }
.doc-cycle-node--2 { left:50%; top:56.666667%; }
.doc-cycle-node--3 { left:15%; top:33.333333%; }
.doc-cycle-node > span { display:grid; place-items:center; line-height:0; }
.doc-cycle-node .doc-icon { width:28px; height:28px; }
.doc-cycle-node[aria-pressed="true"] { border-color:var(--ttp-blue); background:color-mix(in srgb,var(--ttp-blue) 8%,var(--surface)); }
.doc-cycle-node:focus-visible { outline:2px solid var(--ttp-blue); outline-offset:3px; }
.doc-cycle-node strong { font-size:clamp(.75rem,3cqi,.8125rem); line-height:1.35; font-weight:500; text-align:center; }
.doc-cycle-burn { position:absolute; left:85%; top:88%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; width:clamp(76px,22cqi,106px); min-height:100px; padding:12px 6px; border:1px solid var(--line-strong); background:var(--surface); border-radius:12px; }
.doc-cycle-burn .doc-icon { width:28px; height:28px; flex:none; }
.doc-cycle-burn > span { text-align:center; line-height:1.35; font-size:clamp(.75rem,3cqi,.8125rem); }
/* Reserve two caption lines so one-line labels keep the same icon baseline. */
.doc-cycle-node strong, .doc-cycle-burn > span { min-height:2.7em; }
.doc-flywheel-visual > .doc-motion-toggle { display:block; margin:16px auto 0; }
.doc-flywheel-visual > .doc-motion-toggle[hidden] { display:none; }
.doc-flywheel-details { display:grid; gap:24px; }
.doc-flywheel-details > div { padding-left:16px; border-left:2px solid transparent; }
.doc-flywheel-details > div[data-active="true"] { border-color:var(--ttp-blue); }
.doc-flywheel-details h4 { font-size:1rem; font-weight:500; }
.paper-body .doc-flywheel-details p { font-size:.8125rem; margin:8px 0 0; }
@container paper (max-width:720px) {
 .doc-flywheel { grid-template-columns:1fr; }
 .doc-flywheel-orbit { max-width:440px; }
 .doc-flywheel-details { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@container paper (max-width:390px) {
 .doc-flywheel-details { grid-template-columns:1fr; }
 .doc-cycle-node, .doc-cycle-burn { min-height:84px; padding:8px 4px; }
 .doc-cycle-node .doc-icon, .doc-cycle-burn .doc-icon { width:24px; height:24px; }
 .doc-cycle-burn { gap:8px; }
 .doc-cycle-share { font-size:.75rem; padding:4px; }
}
.doc-cycle-node:hover { border-color:var(--ttp-blue); }

@container orbit (max-width:260px) {
 .doc-cycle-node, .doc-cycle-burn { width:70px; min-height:80px; padding:8px 3px; gap:4px; }
 .doc-cycle-node .doc-icon, .doc-cycle-burn .doc-icon { width:22px; height:22px; }
 .doc-cycle-burn > span { text-align:center; }
}

/* Phone-sized paper columns: a consistent 16px internal rhythm and natural
   content heights. Charts retain their aspect ratios and all explanations. */
@container paper (max-width:560px) {
 .doc-figure { margin-block:24px; padding:20px 16px; }
 .paper-body .doc-heading { margin-bottom:20px; gap:8px 16px; }
 .paper-body .doc-heading h3 { font-size:1.125rem; line-height:1.4; }
 .paper-body .doc-figure p, .paper-body .doc-goals p,
 .paper-body .doc-note p, .paper-body .doc-progress p { line-height:1.6; }
 .doc-figure figcaption { margin-top:20px; padding-top:16px; line-height:1.6; }
 .doc-features, .doc-goals, .doc-comparison, .doc-flywheel-details { gap:16px; }
 .doc-features--two { margin-top:20px; padding-top:20px; }
 .doc-icon-slot { width:28px; height:28px; }
 .doc-icon-slot .doc-icon { width:16px; height:16px; }
 .doc-product-image { margin-bottom:20px; }
 .doc-total { gap:12px; margin-bottom:20px; }
 .doc-total strong { font-size:1.5rem; }
 .doc-total img { width:36px; height:36px; }
 .doc-timeline { margin-top:24px; }
 .doc-timeline > li { padding-bottom:24px; column-gap:12px; }
 .doc-timeline > li:last-child { padding-bottom:0; }
 .doc-stat { padding:16px; gap:8px; }
 .doc-stats--current { margin-top:24px; gap:12px; }
 .doc-stats--current .doc-stat { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
 .doc-stats--current .doc-stat dt { grid-row:auto; }
 .doc-stats--current .doc-stat .doc-stat-detail { grid-column:auto; }
 .doc-stats--current .doc-stat dd:not(.doc-stat-detail) { font-size:1.5rem; }
 .doc-stats--summary { grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr)); gap:16px; margin-bottom:20px; }
 .doc-stats--summary .doc-stat dd:not(.doc-stat-detail) { font-size:min(1.25rem,10cqi); white-space:nowrap; }
 .doc-stats--liquidity .doc-stat dd:not(.doc-stat-detail) { font-size:min(1.5rem,8cqi); white-space:nowrap; }
 .doc-report { gap:20px; }
 .doc-report-document { grid-template-columns:96px minmax(0,1fr); align-items:center; }
 .doc-report-cover { width:96px; }
 /* 320px / DPR3 second-line ink: Chromium text 101–128, arrow 106–123;
    WebKit text 103–130, arrow 107–124. Inline icon stays with the last line. */
 .doc-report-link a { min-height:44px; display:block; padding-block:8px; }
 .doc-report .doc-stats { grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr)); }
 .doc-report .doc-stat dd:not(.doc-stat-detail) { font-size:1.25rem; }
 .doc-comparison > div + div { padding-top:20px; }
 .doc-comparison h4 { margin-bottom:16px; }
 .doc-comparison dl { gap:12px; }
 .doc-ledger { margin-bottom:20px; }
 .doc-ledger > div { padding-block:12px; gap:8px 12px; flex-wrap:wrap; }
 .doc-ledger dd { margin-left:auto; white-space:nowrap; text-align:right; }
 .doc-tabs { margin-bottom:24px; }
 .doc-tabs button { min-height:56px; padding:8px; gap:8px; grid-template-columns:24px 1fr; }
 .doc-tab-number { width:24px; height:24px; }
 .doc-market-charts { gap:24px; }
 .doc-chart-block + .doc-chart-block { padding-top:20px; }
 .doc-chart-value, .doc-reserve-values { margin-block:16px; }
 .doc-chart-value strong { font-size:1.5rem; }
 .doc-market-story { margin-top:20px; padding-block:20px; }
 .doc-note { padding:16px; gap:12px; margin-block:24px; }
 .doc-wallet { padding:16px; margin-top:20px; }
 .doc-wallet a { min-height:44px; align-items:center; margin-top:8px; }
 .doc-progress { margin-top:24px; }
 .paper-body .doc-progress > h3 { margin-bottom:20px; }
 .paper-body .doc-workstream-status { padding:12px 16px; }
 .doc-workstream-cell { padding:16px; }
 .doc-workstream-mobile-label { margin-bottom:12px; }
 .doc-workstreams ul { gap:12px; }
 .doc-workstreams li + li { padding-top:12px; }
 .doc-return-summary, .doc-allocation-branches, .doc-risk-comparison,
 .doc-execution-definitions { gap:20px; margin-block:20px; }
 .doc-risk-comparison { padding-block:20px; }
 .doc-purchase-plan { margin-top:24px; }
 .doc-order-heading { margin-top:20px; }
 .doc-execution-definitions h4, .doc-risk-comparison h4,
 .doc-purchase-plan h4 { font-size:1rem; }
 .doc-flywheel { gap:24px; }
 .doc-sources ul { gap:4px; }
 .doc-sources a { min-height:44px; display:block; padding-block:8px; }
}
/* Stack status labels when enlarged text leaves too little room beside them. */
@container paper (max-width:24rem) {
 .doc-stats--current { grid-template-columns:1fr; }
 .doc-stats--current .doc-stat { display:flex; }
 .doc-stats--current .doc-stat dt { align-self:auto; }
}
/* Keep the enlarged status phrase inside a narrow card without splitting words.
   320px / 200% text / DPR3: Chromium and WebKit ink ends at x534 of 714px;
   both leave 179 device pixels clear on the right. */
.doc-stats--current .doc-stat--text dd:not(.doc-stat-detail) { font-size:min(1.5rem,10cqi); line-height:1.25; }