/* Compact trading workspace: preserve actions and precision, reduce empty space. */
body:has(.swap-workspace){min-height:100dvh;display:flex;flex-direction:column}
body:has(.swap-workspace)>.header{flex-shrink:0}
body:has(.swap-workspace)>.demo-footer{margin-top:auto}

#feature-page:has(.swap-workspace) #live-message{font-size:12px;line-height:1.4;padding:7px 10px;margin:6px 0}
#feature-page:has(.swap-workspace) #live-message:empty{display:none}
#feature-page:has(.swap-workspace) .season-route-links{margin:2px 0 6px}
#feature-page:has(.swap-workspace) .season-route-links button{font-size:11px;padding:3px 0}
.swap-workspace{grid-template-columns:minmax(0,460px) minmax(220px,290px);gap:28px;margin:4px auto 0;align-items:start}
.swap-panel{padding:14px 18px}
.swap-network{padding:4px 7px;font-size:9px}
.swap-tabs{margin:9px 0;padding:3px;gap:4px}
.swap-tabs button{padding:7px;font-size:13px;min-height:32px}
.swap-market-label{margin:7px 0;font-size:12px}
.swap-market-label select{padding:6px 9px;font-size:12px;min-height:30px}
.swap-amount-box{padding:10px 12px}
.swap-amount-box>div:first-child{font-size:12px}
.swap-input-row{margin:6px 0;gap:10px}
.swap-input-row input{font-size:29px;letter-spacing:-.7px;line-height:1.15}
.swap-input-row b{font-size:13px}
.swap-percent{gap:6px}
.swap-percent button{padding:5px 9px;font-size:11px;min-height:27px}
.swap-direction-arrow{width:22px;height:22px;margin:-7px auto;font-size:12px}
.swap-output-box{padding:9px 12px}
.swap-output-box>span:first-child{font-size:11px;margin-bottom:4px}
.swap-output-box strong{font-size:27px;line-height:1.15}
.swap-output-box>span:last-child{font-size:12px;margin-left:8px}
.swap-settings{margin:9px 0 6px;padding-bottom:7px}
.swap-settings summary{font-size:12px;min-height:18px}
.swap-settings label{font-size:12px;margin-top:8px}
.swap-settings select{padding:5px}
.swap-panel #swap-quote{font-size:12px;line-height:1.4;min-height:33px;margin:7px 0}
.swap-panel #swap-submit{padding:10px;font-size:14px;min-height:38px}
.swap-connect{padding:8px;min-height:36px;font-size:13px;margin-top:6px}
.swap-help{margin-top:8px}
.swap-help>summary{font-size:11px;color:#718463;cursor:pointer;min-height:17px}
.swap-footnote{font-size:11px;line-height:1.5;margin:6px 0 0}
.swap-wallet-panel{min-width:0}
.swap-wallet-panel>summary{font-size:12px;padding:10px 12px;border:1px solid #c6d1b9;background:#edf2e4;cursor:pointer}
.swap-aside{padding:14px 0 0}
.swap-aside h2{font-size:25px;margin:8px 0 14px}
.swap-wallet-row{padding:10px 0;font-size:13px}
.swap-wallet-row b{font-size:13px}
.swap-aside .text-action{margin:15px 0;font-size:13px}
.swap-reserves{padding:12px 0;margin:8px 0}
.swap-reserves summary{font-size:12px}
.swap-test-note{padding:12px;font-size:12px;line-height:1.5;margin:12px 0}
.swap-aside>.primary-button{padding:10px 12px;font-size:12px}
@media(min-width:851px){.swap-wallet-panel[open]>summary{display:none}}
@media(max-width:850px){
 .swap-workspace{grid-template-columns:minmax(0,460px);gap:8px}
 .swap-wallet-panel[open]>.swap-aside{padding:12px}

}
@media(max-width:600px){

 .swap-panel{padding:11px 13px}
 .swap-panel-heading{display:none}
 .swap-tabs{margin:0 0 7px}
 .swap-tabs button{min-height:34px}
 .swap-market-label{margin:6px 0}
 .swap-input-row input{font-size:28px}
 .swap-percent button{min-height:30px;padding:5px 10px}
 .swap-amount-box{padding:8px 11px}
 .swap-output-box{padding:8px 11px}
 .swap-panel #swap-submit{min-height:40px}
 .swap-settings{margin:7px 0 5px;padding-bottom:5px}
 .swap-panel #swap-quote{min-height:32px;margin:5px 0}
 .swap-help{margin-top:6px}
 .swap-wallet-panel>summary{padding:9px 11px;min-height:36px}
}
/* Inventory picker keeps six hardware choices per page, with a smaller selection panel. */
#modal:has(.inventory-layout){width:min(960px,calc(100vw - 28px));padding:18px 20px;max-height:calc(100dvh - 28px)}
#modal:has(.inventory-layout) .modal-header{padding-bottom:9px;margin-bottom:9px}
#modal:has(.inventory-layout) .modal-header h2{font-size:25px;margin:4px 0 0}
#modal:has(.inventory-layout) .modal-header .eyebrow{font-size:9px}
#modal:has(.inventory-layout) #live-message{padding:7px 10px;margin:0 0 7px;font-size:12px;line-height:1.4}
.inventory-overview{padding:7px 0;gap:20px}
.inventory-overview b{font-size:18px;margin-right:5px}
.inventory-bays{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:8px 0 12px}
.inventory-bays button{padding:7px;min-width:0;min-height:40px}
.inventory-bays small{font-size:9px;margin-bottom:4px}
.inventory-bays span{display:block;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inventory-layout{grid-template-columns:minmax(0,1fr) 225px;gap:16px}
.inventory-heading{margin-bottom:7px}
.inventory-heading h3{font-size:18px;margin:0}
.inventory-clear{font-size:11px;padding:6px 8px;border:1px solid #c4cfb8;background:#f1f5e8;min-height:30px}
.inventory-machines{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-content:start}
.inventory-machine{padding:8px;min-height:117px}
.inventory-machine[hidden]{display:none}
.inventory-machine img{height:64px;width:100%;aspect-ratio:auto;object-fit:contain}
.inventory-machine strong{font-size:12px;line-height:1.2;margin:4px 0}
.inventory-machine small{font-size:10px;line-height:1.3}
.inventory-machine em{font-size:9px;margin-top:3px}
.inventory-owned{font-size:10px;right:7px;top:7px}
.inventory-selection{padding:13px;align-self:start;display:block}
.inventory-selection>.catalog-kicker{font-size:9px;letter-spacing:.5px}
.inventory-selection img{width:100%;height:92px;aspect-ratio:auto;object-fit:contain}
.empty-selection{height:92px;font-size:45px}
.inventory-selection h3{font-size:20px;margin:6px 0}
.inventory-selection>p{font-size:12px;line-height:1.4;margin:6px 0}
.inventory-select-label{font-size:11px;gap:5px;margin:10px 0}
.inventory-select-label select{padding:7px;font-size:12px;min-height:32px}
.inventory-selection>button{font-size:13px;padding:10px 8px;min-height:38px}
.inventory-selection>.chain-note{font-size:11px;line-height:1.4;margin:8px 0 0}
.inventory-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px}
.inventory-pagination button{font-size:12px;min-height:32px;padding:6px 10px;border:1px solid #c4cfb8;background:#eef3e5}
.inventory-pagination span{font:11px var(--mono);color:#728565}
.inventory-empty{grid-column:1/-1;min-height:100px;font-size:13px;color:#748268}
@media(max-width:750px){
 #modal:has(.inventory-layout){width:calc(100vw - 20px);padding:12px 14px;max-height:calc(100dvh - 20px)}
 #modal:has(.inventory-layout) .modal-header{padding-bottom:7px;margin-bottom:7px}
 #modal:has(.inventory-layout) .modal-header h2{font-size:21px}
 #modal:has(.inventory-layout) #live-message{padding:6px 8px;font-size:11px;margin-bottom:5px}
 .inventory-overview{gap:12px;padding:5px 0;flex-wrap:nowrap}
 .inventory-overview>span{font-size:9px;white-space:nowrap}
 .inventory-overview b{font-size:16px}
 .inventory-read{margin-left:auto}
 .inventory-bays{gap:4px;margin:6px 0 9px}
 .inventory-bays button{padding:5px 3px;min-height:37px}
 .inventory-bays small{font-size:8px;margin-bottom:3px}
 .inventory-bays span{font-size:9px}
 .inventory-layout{grid-template-columns:1fr;gap:10px}
 .inventory-selection{grid-row:1;padding:9px 11px;display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:12px}
 .inventory-selection>.catalog-kicker{grid-column:1/-1;font-size:9px;line-height:1.2}
 .inventory-selection #inventory-selection-art{grid-row:2/5;grid-column:1;align-self:center}
 .inventory-selection img,.empty-selection{height:76px}
 .inventory-selection h3{font-size:18px;margin:4px 0;grid-column:2}
 .inventory-selection #inventory-selection-meta{font-size:11px;line-height:1.3;margin:0 0 3px;grid-column:2}
 .inventory-select-label{margin:3px 0 6px;gap:0;font-size:0;grid-column:2}
 .inventory-select-label select{padding:5px 7px;min-height:30px;font-size:12px}
 .inventory-selection>button{grid-column:1/-1;min-height:36px;padding:8px;font-size:12px}
 .inventory-selection>.chain-note{display:none}
 .inventory-heading{margin-bottom:6px}
 .inventory-heading h3{font-size:16px}
 .inventory-clear{min-height:28px;padding:5px 8px}
 .inventory-machines{gap:6px}
 .inventory-machine{padding:6px;min-height:91px}
 .inventory-machine img{height:45px}
 .inventory-machine strong{font-size:11px;line-height:1.2;margin:3px 0}
 .inventory-machine small{font-size:9px;line-height:1.2}
 .inventory-machine em{font-size:8px}
 .inventory-owned{font-size:9px;right:5px;top:5px}
 .inventory-pagination{padding-top:7px}
 .inventory-pagination button{min-height:30px;font-size:11px;padding:5px 9px}
}

body:has(.swap-workspace)>.demo-footer{padding:4px 10px;font-size:8px;line-height:1.4}
#feature-page:has(.swap-workspace) .season-route-links{display:none}
.swap-panel{padding-block:12px}.swap-tabs{margin-block:6px}.swap-panel #swap-submit{margin:0}
#modal:has(.inventory-layout) .inventory-selection>button{margin:0}
#modal:has(.inventory-layout) .inventory-selection>.chain-note{font-size:11px!important;line-height:1.4!important}
@media(max-width:750px){.swap-panel{padding-block:11px}.swap-tabs{margin-top:0;margin-bottom:7px}}
html:has(#modal[open]){overflow:hidden;scrollbar-gutter:stable}

/* Swap heading inherits the shared tab styles without overrides. */

.swap-input-row input{font-size:32px}
.swap-output-box strong{font-size:30px}

.swap-panel #swap-quote{min-height:24px;margin-block:4px}

#feature-page:has(.swap-workspace){width:100%;min-height:0;flex:1}