/* Shared surface and semantic colours follow the existing CoinMadang themes. */
.onchain-loading{display:grid;place-items:center;min-height:104px;padding:20px}.onchain-loading-spinner{display:block;width:24px;height:24px;border:3px solid var(--ui-line);border-top-color:var(--ui-accent);border-radius:50%;animation:onchain-loading-spin .8s linear infinite}
@keyframes onchain-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.onchain-loading-spinner{animation:none}}
.onchain-freshness{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 12px;color:var(--ui-muted);font-size:12px;line-height:1.6;overflow-wrap:anywhere}.onchain-freshness time{font-variant-numeric:tabular-nums}
.onchain-table strong[data-usd] { color:var(--ui-text); }
.onchain-section { min-width:0; margin:28px 0; padding:24px; border:1px solid var(--ui-line); border-radius:14px; background:var(--ui-surface); box-shadow:var(--ui-shadow); }
.onchain-section h2 { margin:0 0 20px; font-size:20px; letter-spacing:-.025em; }
.onchain-section .section-inline-heading { align-items:center; margin-bottom:16px; gap:12px; }
.onchain-section .section-inline-heading h2 { margin:0; }
.onchain-section .section-inline-heading>a { display:inline-flex; align-items:center; min-height:44px; font-size:12px; }
.onchain-section .stablecoin-card-grid { gap:12px; grid-auto-flow:row; grid-auto-columns:auto; overflow:visible; scroll-snap-type:none; }
.onchain-section .stablecoin-card { overflow:hidden; padding:0; border:1px solid var(--ui-line); }
.onchain-section .stablecoin-card>header { padding:16px; min-height:74px; margin:0; }
.onchain-section .stablecoin-total { margin:0; padding:14px 16px; border-block:1px solid var(--ui-line); }
.onchain-section .stablecoin-total>strong { font-size:25px; }
.onchain-section .stablecoin-network-heading { margin:0; padding:8px 16px; }
.onchain-section .stablecoin-network-list { margin:0 12px 12px; max-height:244px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.onchain-section .stablecoin-network-row { min-height:58px; padding:10px 4px; }
.onchain-section .stablecoin-network-share progress { accent-color:var(--ui-accent); }
.onchain-source,.onchain-note { color:var(--ui-muted); font-size:12px; line-height:1.7; }
.onchain-source { margin:14px 0 0; text-align:right; overflow-wrap:anywhere; }
.onchain-source a { color:inherit; text-underline-offset:3px; }
.onchain-page-heading h1 { margin:12px 0; font-size:28px; }
.onchain-page-heading p { color:var(--ui-muted); font-size:14px; line-height:1.7; }
.onchain-section .chain-picker-rail { display:grid!important; grid-template-columns:44px minmax(0,1fr) 44px; align-items:center; gap:10px; margin-bottom:20px; }
.onchain-section .chain-picker-track { position:relative; display:flex; gap:8px; overflow-x:auto; padding:4px 1px; scrollbar-width:none; scroll-behavior:smooth; mask-image:none; }
.onchain-section .chain-picker-track button { display:flex; flex:0 0 auto; align-items:center; gap:8px; min-height:44px; padding:8px 14px; border:1px solid var(--ui-line); border-radius:9px; background:var(--ui-surface); color:var(--ui-text); font:inherit; font-size:13px; cursor:pointer; }
.onchain-section .chain-picker-track button[aria-pressed=true] { background:var(--ui-text); color:var(--ui-surface); border-color:var(--ui-text); }
.onchain-section .chain-logo-wrap,.onchain-section .chain-logo { width:24px; height:24px; flex-basis:24px; }
.onchain-section .chain-picker-arrow { position:static; width:44px; height:44px; min-height:44px; border:1px solid var(--ui-line); border-radius:50%; background:var(--ui-surface); color:var(--ui-muted); font-size:26px; cursor:pointer; }
.onchain-section .chain-picker-arrow:disabled { opacity:.4; cursor:default; }
.onchain-section .chain-detail { margin:0; padding:0; border:0; background:none; }
.onchain-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0; }
.onchain-kpis>div { padding:18px; min-width:0; border:1px solid var(--ui-line); border-radius:10px; }
.onchain-kpis dt { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13px; color:var(--ui-muted); }
.onchain-kpis dd { margin:20px 0 0; }
.onchain-kpis strong { display:block; font-size:clamp(20px,2.1vw,30px); letter-spacing:-.035em; overflow-wrap:anywhere; }
.onchain-kpis small { display:block; margin-top:6px; color:var(--ui-muted); font-size:14px; }
.onchain-section .change { white-space:nowrap; font-size:12px; font-weight:600; }
.onchain-ranking { margin-top:30px; }
.onchain-ranking h3 { margin:0 0 12px; font-size:19px; }
.onchain-note { margin:0 0 12px; }
.onchain-table-scroll { max-width:100%; overflow-x:auto; border:1px solid var(--ui-line); border-radius:8px; }
.onchain-table { width:100%; border-collapse:collapse; white-space:nowrap; font-size:13px; font-variant-numeric:tabular-nums; }
.onchain-table th,.onchain-table td { padding:14px 18px; text-align:right; border-bottom:1px solid var(--ui-line); }
.onchain-table thead th { background:var(--ui-subtle); color:var(--ui-muted); font-weight:500; font-size:12px; }
.onchain-table th:first-child,.onchain-table td:first-child { width:42px; color:var(--ui-muted); text-align:center; }
.onchain-table th:nth-child(2),.onchain-table th:nth-child(3),.onchain-table td:nth-child(3) { text-align:left; }
.onchain-table tbody th { font-weight:500; }
.onchain-table tbody tr:last-child>* { border-bottom:0; }
.onchain-table td strong { font-weight:500; }
.onchain-table td small { display:block; color:var(--ui-muted); margin-top:4px; }
.onchain-identity { display:flex; align-items:center; gap:12px; color:var(--ui-text); }
.onchain-identity>span { color:var(--ui-text); }
.onchain-identity img { object-fit:contain; border-radius:50%; }
.onchain-identity>span:last-child { white-space:normal; overflow-wrap:anywhere; }
[data-defi-list] .onchain-table :is(th,td):nth-child(3) { text-align:left; }
[data-defi-list] .onchain-category { white-space:normal; overflow-wrap:anywhere; }
@media(max-width:767px) { .onchain-section .onchain-table :is(th,td) { padding:10px 8px; }.onchain-section .onchain-identity { gap:8px; } }
.onchain-category { display:inline-block; padding:4px 8px; border-radius:5px; background:var(--ui-accent-soft); color:var(--ui-accent); font-size:11px; font-weight:500; }
.onchain-section :focus-visible { outline:2px solid var(--ui-focus); outline-offset:3px; }
.onchain-section[hidden],.onchain-section [hidden] { display:none!important; }
.onchain-page #stablecoins { scroll-margin-top:100px; }
.onchain-page #stablecoins [data-featured] { display:none; }
.onchain-page #stablecoins .indicator-grid { margin:16px 0; }
.onchain-page #stablecoins button,.onchain-page #stablecoins select { min-height:44px; }
@media(max-width:980px) { .onchain-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }.onchain-section .stablecoin-card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.onchain-section .stablecoin-card>header { padding:12px; }.onchain-section .stablecoin-total { padding:14px 12px; }.onchain-section .stablecoin-total>strong { font-size:20px; } }
@media(max-width:767px) { .onchain-section { padding:16px 12px; margin:22px 0; }.onchain-section h2 { font-size:17px; }.onchain-section .section-inline-heading { flex-wrap:wrap; gap:4px; }.onchain-section .stablecoin-card-grid { grid-template-columns:1fr; }.onchain-section .stablecoin-card>header { padding:16px; }.onchain-section .stablecoin-total { padding:14px 16px; }.onchain-section .stablecoin-total>strong { font-size:24px; }.onchain-section .chain-picker-rail { gap:5px; }.onchain-section .chain-picker-track button { padding:8px 10px; }.onchain-kpis { gap:8px; }.onchain-kpis>div { padding:12px; }.onchain-kpis dt { flex-wrap:wrap; font-size:11px; min-height:32px; }.onchain-kpis dd { margin-top:10px; }.onchain-kpis strong { font-size:20px; }.onchain-kpis small { font-size:12px; }.onchain-table th,.onchain-table td { padding:12px; }.onchain-source { text-align:left; }.onchain-ranking h3 { font-size:17px; }.onchain-section .indicator-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(prefers-reduced-motion:reduce) { .onchain-section .chain-picker-track { scroll-behavior:auto; } }

.onchain-section .stablecoin-card.is-expanded .stablecoin-network-list { max-height:244px; }

.onchain-section .stablecoin-network-list { box-sizing:content-box; height:240px; max-height:240px; padding:0; }.onchain-section .stablecoin-network-row { box-sizing:border-box; height:60px; min-height:60px; }.onchain-section .stablecoin-total>strong>small { display:inline; font-size:12px; color:var(--ui-muted); }
.onchain-controls { display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0; }.onchain-controls label { display:flex;align-items:center;gap:8px; }.onchain-controls select,.onchain-controls button { min-height:44px;padding:8px 12px;background:var(--ui-surface);color:var(--ui-text);border:1px solid var(--ui-line);border-radius:8px; }.onchain-controls button:disabled { opacity:.45; }.onchain-controls span { font-variant-numeric:tabular-nums; }

.onchain-section .chain-picker-arrow{display:grid;place-items:center;border-radius:9px;font-size:inherit;transition:background .15s,color .15s}.chain-picker-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.onchain-section .chain-picker-arrow:not(:disabled):hover{background:var(--ui-accent-soft);color:var(--ui-accent)}.onchain-tabs{display:flex;gap:4px;background:var(--ui-subtle);padding:4px;border:1px solid var(--ui-line);border-radius:10px;margin:24px 0 16px}.onchain-tabs button{flex:1;min-height:44px;padding:10px 16px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--ui-muted);font:inherit;font-size:14px;cursor:pointer}.onchain-tabs button[aria-selected=true]{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-line);box-shadow:var(--ui-shadow)}.onchain-ranking{margin-top:0}.onchain-table td:nth-child(3){text-align:right}.onchain-table thead th:nth-child(3){text-align:right}#stablecoins>.stablecoin-card-grid{margin:16px 0 24px}
