/* Vault page: only what the design system does not define. */

/* Header: stays in view while the page scrolls, with the wallet button on the right of the nav row. */
.site-header { position: sticky; top: 0; background-color: var(--paper); border-bottom: 1px solid var(--line); }
.site-header .nav { height: 64px; }
.site-header .hero__ca { padding-bottom: var(--s-3); }
.site-header .ca-slot { box-shadow: 0 2px 0 var(--navy); padding-top: 5px; padding-bottom: 5px; }

.wallet { margin-left: auto; display: flex; align-items: center; gap: var(--s-2); min-height: 32px; }
.wallet__addr { font-size: 13px; color: var(--ink); padding: 0 10px; line-height: 30px; border-radius: 6px; background: var(--paper-2); }
.wallet[data-state='disconnected'] .wallet__addr,
.wallet[data-state='connecting'] .wallet__addr,
.wallet[data-state='missing'] .wallet__addr,
.wallet[data-state='disconnected'] [data-wallet-disconnect],
.wallet[data-state='connecting'] [data-wallet-disconnect],
.wallet[data-state='missing'] [data-wallet-disconnect] { display: none; }
.wallet[data-state='connected'] [data-wallet-connect] { display: none; }
.wallet[data-state='connecting'] [data-wallet-connect] { opacity: 0.6; pointer-events: none; }

/* Page frame */
.vault-main { padding-top: 0; padding-bottom: var(--s-8); align-items: stretch; }
.vault-main > section, .vault-main > div { min-width: 0; }
.vault-main [hidden] { display: none !important; }
.vault-col { min-width: 0; }
.vault-fill { height: 100%; }
.vault-col-flex { display: flex; flex-direction: column; }
.vault-grow { flex: 1; min-height: 0; }
.vault-col-flex > .panel__foot { margin-top: auto; }
.vault-stack { display: grid; gap: var(--s-6); align-content: start; }
.vault-stack > section { min-width: 0; }
.page-head .coin-picker { flex-shrink: 0; }

/* Stepper */
.stepper__step:last-child { padding-bottom: 0; }
.stepper__body .input-group { flex-wrap: wrap; }
.stepper__body .input-group .input { flex: 1 1 240px; min-width: 0; font-size: 13px; }
.steps-list { margin: 0; padding-left: 20px; display: grid; gap: 6px; color: var(--ink-2); }
.stepper__body .muted { overflow-wrap: anywhere; }
.btn:focus-visible, .pager__btn:focus-visible, .input:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* Vault card */
.panel--stage.vault-fill { display: flex; flex-direction: column; }
.vault-card { display: flex; flex-direction: column; gap: var(--s-5); flex: 1; }
.vault-card__balance { margin-top: var(--s-2); font-size: 46px; color: var(--on-navy); }
.vault-card__clock { display: flex; align-items: center; gap: var(--s-4); padding: 14px 0; border-top: 1px dashed var(--navy-line); border-bottom: 1px dashed var(--navy-line); }
.vault-card__clock .figure { color: var(--on-navy); }
.vault-card__clock .small { margin-top: 4px; }
.vault-card .list__row dd { display: inline-flex; align-items: center; }
.vault-card .list__row dd.addr { font-size: 13px; }

/* Flow */
.flow__node .flow__value { font-size: 30px; }
.flow__node--vault .flow__value { font-size: 38px; }

/* Fee feed */
.feed__title { text-transform: none; }
.feed__sub { display: flex; gap: 10px; }
.feed__sub .addr { font-size: 12px; }
.feed__amount { min-width: 9ch; }
.feed__item[data-side='sell'] .feed__icon { background: var(--bronze-wash); }

/* Schedule */
.schedule-chart { padding: var(--s-5) 20px var(--s-4); border-top: 1px solid var(--line); }
#schedule-table th, #schedule-table td { white-space: nowrap; }

/* Fee feed scrolls inside its panel so it ends level with the schedule and weights beside it. */
#feed-view { max-height: 780px; overflow-y: auto; }