/* Layout repair: foundation classes referenced by app.mjs were missing from the
   inherited stylesheet. This file is also used by the read-only UI renderer. */
:root { --font-body:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --field-bg:var(--surface); --error-bg:#fff9e8; --error-border:#ead895; --error-ink:#6c5419; --overlay:#11111199; }
[data-theme="dark"] { --field-bg:var(--surface); --error-bg:#211d10; --error-border:#4a3b14; --error-ink:#e3d5a1; --overlay:#000000aa; }
body { font-family:var(--font-body); }
.shell { width:min(1200px,calc(100% - 64px)); margin-inline:auto; }
.page-pad { padding:34px 0 54px; }
.site-header { position:sticky; top:0; z-index:30; }
.site-header .header-inner { min-height:76px; height:auto; padding:0; gap:24px; }
.desktop-nav { gap:3px; }
.desktop-nav a { padding:9px 12px; line-height:1.4; }
.desktop-nav a.active { color:var(--ink); background:var(--surface-muted); }
.header-actions { gap:12px; }
.network-label { display:flex; align-items:center; gap:7px; white-space:nowrap; font-size:10px; }
.network-label i,.preview-dot { width:6px; height:6px; border-radius:100%; flex:none; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:42px; padding:10px 16px; border:1px solid var(--border); background:var(--surface); color:var(--ink); font-size:12px; font-weight:650; line-height:1.4; white-space:nowrap; transition:transform .12s ease,background .12s ease; }
.button:hover:not(:disabled) { transform:translateY(-1px); }
.button.wallet-button { background:#111111; color:#F7F7F2; border-color:#111111; }
.icon-button { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; flex:none; border:1px solid var(--border); background:var(--surface); color:var(--ink); }
.icon-button:hover { background:var(--surface-muted); }
.mobile-menu { display:none; }
.chain-banner { display:flex; align-items:center; justify-content:center; gap:10px; font-size:10px; line-height:1.5; }
.chain-banner strong { font-weight:600; }
.chain-mobile-nav[hidden] { display:none!important; }
.chain-mobile-nav:not([hidden]) { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; padding:18px; border-top:1px solid var(--border); font-size:12px; }
.chain-hero { isolation:isolate; }
.chain-hero-copy { max-width:75%; }
.chain-hero p { max-width:565px; }
.chain-hero h1 { font-weight:800; }
.chain-hero-art { z-index:0; pointer-events:none; }
.chain-hero-foot { z-index:2; }
.chain-stats { display:grid; margin-top:20px; border-radius:14px!important; border-top:1px solid var(--border)!important; }
.chain-stats>div { display:flex; flex-direction:column; gap:9px; min-width:0; border-right:1px solid var(--border); }
.chain-stats>div:last-child { border:0; }
.stat-label { font-size:10px; line-height:1.4; color:var(--muted); }
.stat-sub { color:var(--muted); font-size:10px; line-height:1.5; }
.chain-stats strong { display:block; font-weight:700; line-height:1.15; font-variant-numeric:tabular-nums; }
.chain-alert { font-size:11px; padding:14px 18px; line-height:1.6; }
.chain-alert a { font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.chain-explainer h2 { letter-spacing:-.2px; }
.chain-table-head { text-transform:none; }
.coin-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.coin-identity>span:last-child { min-width:0; }
.row-rank { width:18px; color:var(--muted); font-size:11px; flex:none; }
.mobile-label { display:none; }
.chain-coin-row strong { color:var(--ink); }
.chain-coin-row:hover { background:var(--surface-hover); }
.chain-toolbar { margin-top:24px; margin-bottom:8px; }
.search-input { display:flex; align-items:center; gap:11px; height:44px; border:1px solid var(--border); border-radius:10px; background:var(--surface); padding:0 14px; }
.search-input>svg { color:var(--muted); flex:none; }
.search-input input { border:0!important; outline:none; padding:0; flex:1; width:100%; min-width:0; color:var(--ink); font-size:12px; background:transparent!important; }
.search-input:focus-within { outline:2px solid #f0b90b66; outline-offset:2px; }
.sort-control { display:flex; align-items:center; gap:8px; font-size:10px; color:var(--muted); white-space:nowrap; }
.sort-control select { border:1px solid var(--border); padding:10px; color:var(--ink); font-size:11px; outline:none; }
.directory-footer { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:18px; font-size:10px; color:var(--muted); }
.page-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin:12px 0 28px; }
.page-heading h1 { margin:9px 0 12px; font-size:38px; font-weight:750; line-height:1.15; }
.page-heading p { font-size:13px; color:var(--muted); }
.wizard-layout { display:grid; grid-template-columns:minmax(0,1fr) 350px; gap:24px; }
.chain-form-panel { padding:30px; }
.chain-form-panel h2 { margin:0 0 24px; font-size:21px; }
.chain-form-panel .chain-two { gap:20px; }
.chain-form-panel label { margin-top:21px; }
.chain-form-panel input,.chain-form-panel textarea { font-size:12px; line-height:1.5; }
.chain-form-panel input[type=file] { color:var(--muted); }
.chain-form-panel input[type=file]::file-selector-button { border:0; border-radius:6px; padding:8px 12px; margin-right:12px; background:var(--surface-muted); color:var(--ink); font:inherit; }
.chain-form-panel input[type=checkbox] { accent-color:#f0b90b; flex:none; }
.chain-form-panel .chain-check { align-items:flex-start; }
.chain-form-panel .chain-check span { font-size:11px; color:var(--muted); }
.chain-summary { padding:28px; }
.chain-summary h2 { margin:14px 0; font-size:24px; }
.chain-token-heading { margin-top:0; }
.chain-token-heading .button { font-size:11px; }
.chain-trade .chain-segmented button.active { color:var(--ink)!important; }
.chain-trade select { width:100%; padding:12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); color:var(--ink); margin-top:8px; font-size:12px; }
.chain-trade .chain-fine { font-size:10px!important; }
.coin-tabs { border-bottom:1px solid var(--border); overflow-x:auto; }
.coin-tabs button { white-space:nowrap; }
.chain-chart-label small { font-weight:400; }
.chain-empty { justify-content:center; }
.chain-empty h2 { margin:0; }
.chain-position { align-items:center; }
.chain-position:hover { background:var(--surface-hover); }
.chain-claims .button { min-height:36px; padding:8px 15px; }
.chain-panel.chain-prose { overflow-wrap:anywhere; }
.site-footer.shell { display:grid; grid-template-columns:1fr auto auto; gap:36px; align-items:start; margin-top:10px; padding:30px 0 34px; }
.site-footer p { margin-top:14px; font-size:12px; color:var(--muted); }
.site-footer small { display:block; max-width:340px; margin-top:5px; font-size:10px; color:var(--muted); }
.site-footer nav { display:flex; flex-direction:column; gap:10px; font-size:11px; padding-top:5px; }
.site-footer .footer-chain { font-size:10px; padding-top:6px; }
[data-theme=dark] .chain-hero { background:#111!important; }
[data-theme=dark] .chain-hero-foot { background:transparent!important; }
[data-theme=dark] .chain-stats { background:var(--surface); }
[data-theme=dark] .chain-pill { color:#e4bd45; }
[data-theme=dark] .chain-state.ok { color:#e4bd45!important; }
[data-theme=dark] .chain-coin-row:hover { background:var(--surface-hover); }
@media(max-width:1150px) { .network-label { display:none; } .desktop-nav a { padding-inline:9px; } .site-header .header-inner { gap:14px; } }
@media(max-width:1000px) { .desktop-nav { display:none!important; } .mobile-menu { display:inline-flex!important; } .chain-hero-copy { max-width:82%; } .chain-hero h1 { font-size:49px; max-width:580px; } .chain-hero p { max-width:440px; } .chain-hero-art { left:63%; } .chain-hero-art>img { width:160px!important; height:160px!important; right:15%!important; } .wizard-layout { grid-template-columns:minmax(0,1fr) 300px; } }
@media(max-width:850px) { .wizard-layout { grid-template-columns:1fr; } .chain-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .chain-stats>div:nth-child(-n+2) { border-bottom:1px solid var(--border); } .chain-stats>div:nth-child(2) { border-right:0; } .chain-stats>div:nth-child(3) { border-right:1px solid var(--border); } .site-footer.shell { grid-template-columns:1fr auto; } .footer-chain { grid-column:1/-1; } .chain-position { align-items:flex-start; } }
@media(max-width:760px) { .shell { width:calc(100% - 36px); } .site-header .header-inner { min-height:68px; } .page-pad { padding-top:22px; } .chain-hero-copy { max-width:100%; } .chain-hero h1 { font-size:43px; } .chain-hero-art { inset:auto 0 38px 0; } .chain-hero-art>img { width:125px!important; height:125px!important; right:calc(50% - 62.5px)!important; } .chain-hero p { max-width:100%; font-size:12px; } .chain-toolbar { gap:9px; } .sort-control select { max-width:135px; } .directory-footer { align-items:flex-start; flex-direction:column; gap:6px; } .page-heading h1 { font-size:33px; } .chain-stats>div { padding:20px 17px!important; } .site-footer.shell { gap:24px; } }
@media(max-width:480px) { .header-actions { gap:6px; } .button.wallet-button { padding:9px 10px; min-height:35px; } .header-actions>.icon-button:not(.mobile-menu) { display:none; } .icon-button { width:33px; height:33px; } .chain-hero { min-height:447px; border-radius:17px; } .chain-hero-copy { padding:32px 25px 172px; } .chain-hero h1 { font-size:35px; letter-spacing:-1.7px; line-height:1.04; margin:20px 0; } .chain-hero .eyebrow { font-size:8px; letter-spacing:1.4px; } .chain-hero-art { opacity:1; } .chain-alert { padding:13px 14px; gap:10px; font-size:10px; } .chain-stats strong { font-size:20px; } .chain-explainer { padding:19px 17px; gap:13px; } .chain-icon-circle { width:34px; height:34px; } .chain-explainer h2 { font-size:14px; } .chain-two { gap:0; } .chain-form-panel { padding:23px!important; } .chain-toolbar .sort-control>span { display:none; } .chain-toolbar>.button { padding:10px 11px; font-size:10px; } .chain-token-heading>.button { min-height:32px; padding:7px; font-size:9px; } .site-footer.shell { grid-template-columns:1fr; } .site-footer nav { flex-direction:row; flex-wrap:wrap; gap:16px; } }

.chain-hero h1 .hero-accent { color:#F0B90B; }