/* Staking on the shared ASM portal shell (portal.css: .portal-rail, .portal-main, .portal-top).
   Shared tokens only; no wallet or mint scripts. Headings follow the portal's bold uppercase. */
body.staking{--st-base:var(--bg-deepest);--st-surface:var(--bg-base);--st-raised:var(--bg-elevated);--st-line:var(--line-strong);--st-text:var(--ink);--st-muted:var(--muted);--st-accent:var(--accent-bright);--st-ink:var(--accent-ink)}
/* The portal shell owns the layout; staking.css's own header, rail and widths are not used. */
body.staking .st-main{margin:0 0 0 245px;width:auto;max-width:none;min-width:0;padding:24px 36px 80px}
body.staking .st-main>*{max-width:1420px}
body.staking .portal-top{gap:12px}
body.staking .portal-top>div{align-items:center;flex-wrap:wrap;justify-content:flex-end}
body.staking .portal-top .button{min-height:44px;padding:10px 20px;font-size:11px;letter-spacing:.04em}
body.staking .st-account{max-width:220px}
body.staking .portal-rail nav a>span{width:20px;text-align:center;font-size:18px;opacity:.7}

/* Hero: eyebrow, big bold h1 and the not-live badge. */
body.staking .st-title-row{margin-bottom:24px;align-items:flex-end}
body.staking .st-breadcrumb{margin:0 0 10px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
body.staking .st-title-row h1{margin:0;font-size:clamp(44px,6vw,84px);font-weight:800;line-height:.9;letter-spacing:-.05em;text-transform:uppercase}
body.staking :is(.st-main h2,.st-panel-heading h2,.st-section-heading h2){font-weight:800;letter-spacing:-.03em;text-transform:uppercase}
body.staking .st-feature h2{font-weight:800;letter-spacing:-.045em;line-height:.98}

/* Sub-tabs: horizontal strip with 44px targets. */
body.staking .st-nav{margin:0 0 24px;flex-direction:row;overflow-x:auto;padding:0 0 12px;border-bottom:1px solid var(--line);gap:8px}
body.staking .st-nav-button{flex:0 0 auto;font-size:12px;padding:11px 16px;min-height:44px}
body.staking .st-nav-button[aria-selected=true]{background:var(--bg-elevated);color:var(--ink)}

/* Actions use the shared portal buttons (.button / .button.filled from public.css):
   uppercase labels, the monochrome fill, 44px targets. */
body.staking .button{min-height:44px;gap:10px;font-size:11px}
body.staking .button .st-icon{width:16px;height:16px;flex-shrink:0}
body.staking .st-link-button{margin-top:14px;align-self:flex-start}
body.staking .st-section-heading>.st-link-button{margin-top:0}
body.staking .st-preview-note{background:var(--bg-base);border:1px solid var(--line);border-left:3px solid var(--accent);padding:14px 18px;max-width:none;border-radius:4px;color:var(--ink-secondary)}
body.staking #st-coming-soon-note strong{display:block;color:var(--ink);font-size:15px;margin-bottom:6px}
body.staking #st-coming-soon-note p{margin:0;max-width:80ch;font-size:13px;line-height:1.65}
/* Enrollment and claims are postponed, not disabled calls-to-action to sell. */
body.staking .st-view .button:disabled{display:none}
body.staking .st-feature{min-height:310px;border:1px solid var(--line);border-radius:12px}
body.staking .st-panel,body.staking .st-pool-panel{border-color:var(--line);border-radius:12px}
body.staking .st-badge-preview{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.3);color:var(--ink)}
body.staking .st-badge{white-space:normal;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
/* The hero status pill stays on one line; the title row wraps instead on phones. */
body.staking .st-title-row{flex-wrap:wrap}
body.staking .st-title-row>.st-badge{white-space:nowrap;flex-shrink:0;font-size:11px;padding:6px 10px}

/* Minimum readable sizes: no staking text below 11px. */
body.staking :is(.st-art-credit,dt,.st-pool-details dt,.st-key-values dt,.st-breadcrumb,.st-nft-copy small,.st-collection-weight small,.st-collection-row p,.st-eligibility-note,.st-simulator-form small,.st-share-ring span,.st-inventory-footer>span,.st-history-panel .st-fine,.st-history-table th,.st-feature .st-small-label){font-size:11px}
body.staking .st-art-credit{color:var(--muted)}

/* What is decided / still open: plain facts, no figures that are not decided. */
body.staking .st-facts{margin-top:34px;display:grid;gap:16px}
body.staking .st-facts-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
body.staking .st-facts-card{padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--bg-base)}
body.staking .st-facts-card h3{margin:0 0 12px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
body.staking .st-facts-card ul{margin:0;padding-left:18px;display:grid;gap:8px;color:var(--ink-secondary);font-size:13px;line-height:1.6}
body.staking .st-facts-card.is-open{border-style:dashed}

@media(max-width:750px){
  /* At 11px the art credit would meet the hero button: move it to the top corner. */
  body.staking .st-art-credit{top:14px;bottom:auto}
  body.staking .st-main{margin:0;padding:20px 16px 60px}
  body.staking .portal-rail nav a>span{display:none}
  body.staking .st-account{display:none}
  body.staking .st-nav{margin-bottom:20px}
  body.staking .st-title-row{align-items:flex-start}
}
