/* Porcelain production theme. Loaded after styles.css; all operational states stay visible. */
body[data-refinement="porcelain"] {
  --bg:#faf9fc;
  --paper:#fff;
  --ink:#242239;
  --muted:#6d687e;
  --line:#ece9f2;
  --blue:#7352c7;
  --blue-soft:#f3effb;
  --jade:#376fae;
  --jade-soft:#edf4fc;
  --coral:#b85e6d;
  --coral-soft:#fbf0f2;
  --radius:15px;
  color:var(--ink);
  background:var(--bg);
  font-family:'Avenir Next',-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  font-size:15px;
  line-height:1.55;
  color-scheme:light;
}
body[data-refinement="porcelain"] { min-width:280px; }
button,input,select,summary { touch-action:manipulation; }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible {
  outline:3px solid #ae94df;
  outline-offset:3px;
}
button { transition:background-color .15s ease,border-color .15s ease,color .15s ease; }
a:hover { text-decoration:underline; text-underline-offset:3px; }
button:disabled { opacity:.55; }
button:disabled:hover { cursor:not-allowed; }
[hidden] { display:none!important; }
.skip-link { position:fixed; left:15px; top:-80px; z-index:100; padding:10px 15px; color:var(--blue); background:#fff; border:2px solid var(--blue); border-radius:8px; }
.skip-link:focus { top:8px; }
#main:focus { outline:none; }
.simulation-banner { background:#f2eff8; color:#655c78; font-size:12px; line-height:1.6; letter-spacing:0; padding:6px 18px; }
.banner-dot { background:#a08abb; }
.banner-separator { color:#b7aec7; }
.app-header { height:70px; gap:48px; padding:0 max(3%,calc((100vw - 1536px)/2)); background:#fff; border-color:var(--line); }
.brand { color:var(--ink); font-size:23px; line-height:1; font-weight:750; letter-spacing:-1px; white-space:nowrap; }
.brand:hover { text-decoration:none; }
.brand svg { color:var(--blue); width:28px; height:28px; }
.brand-period { color:var(--blue); }
.event-mark { display:flex; width:27px; height:29px; gap:3px; align-items:center; transform:skewX(-18deg); color:var(--blue); flex:none; }
.event-mark i { display:block; width:6px; height:20px; background:currentColor; }
.event-mark i:nth-child(2) { height:28px; }
.event-mark i:nth-child(3) { height:15px; align-self:flex-end; }
nav { gap:27px; }
.nav-link { color:var(--muted); font-size:15px; white-space:nowrap; }
.nav-link.active { color:var(--ink); }
.nav-link.active:after { height:2px; background:var(--blue); }
.header-right { min-width:0; gap:14px; }
.network-pill { font-size:13px; color:var(--muted); white-space:nowrap; }
.network-pill i { background:#a08abb; flex:none; }
.wallet-button { display:inline-flex; align-items:center; justify-content:center; flex:none; min-width:0; height:44px; min-height:44px; gap:9px; padding:0 14px; border:1px solid transparent; border-radius:10px; background:var(--blue); color:#fff; font-size:14px; font-weight:600; line-height:1; white-space:nowrap; box-sizing:border-box; }
.wallet-button:hover { background:#6342b6; border-color:#6342b6; }
.wallet-button>span { display:inline-flex; align-items:center; line-height:1; }
.wallet-button-icon { display:block; width:16px; height:16px; flex:none; }
.wallet-button-chevron { flex:none; font-size:14px; line-height:1; opacity:.75; }
svg.wallet-button-chevron { width:12px; height:12px; opacity:.6; }
.wallet-button[data-state="connected"],.wallet-button[data-state="wrong-network"] { gap:8px; padding:0 12px; border-color:#e5dcf2; background:#fff; color:var(--ink); }
.wallet-button[data-state="connected"]:hover { background:#faf8fd; border-color:#d2c4e8; }
.wallet-button-avatar { position:relative; flex:none; color:#7a6c98; }
.wallet-button .wallet-button-status { display:block; position:absolute; right:-3px; bottom:-2px; width:8px; height:8px; border-radius:50%; background:#4b9c78; box-shadow:0 0 0 2px #fff; }
.wallet-button .wallet-button-address { font-size:14px; font-weight:600; line-height:1; font-variant-numeric:tabular-nums; letter-spacing:.2px; }
.wallet-button[data-state="wrong-network"] { border-color:#ead4a4; background:#fffaf0; color:#79520f; }
.wallet-button[data-state="wrong-network"] .wallet-button-status { background:#c58a25; box-shadow:0 0 0 2px #fffaf0; }
.wallet-button[data-state="wrong-network"] .wallet-button-avatar { color:inherit; }
.wallet-button[data-state="wrong-network"] .wallet-button-chevron { color:#79520f; }
.network-button { display:inline-flex; align-items:center; justify-content:center; flex:none; height:44px; min-height:44px; gap:8px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink); font-size:14px; font-weight:550; line-height:1; white-space:nowrap; }
.network-button:hover:not(:disabled) { background:#f7f3fc; border-color:#d6c7ec; }
.network-button .network-icon { display:block; flex:none; width:18px; height:18px; color:#8247e5; }
.network-button #network-name { display:inline; }
.network-button #environment-label { font-size:10px; font-weight:600; letter-spacing:.4px; color:var(--muted); }
.network-button[data-state="wrong-network"] { border-color:#ead4a4; background:#fffaf0; }
.network-button[data-state="switching"] { cursor:progress; }
.balance-chip { display:inline-flex; gap:7px; align-items:center; color:#514b65; font-size:14px; font-variant-numeric:tabular-nums; }
.claim-count { font-size:12px; background:var(--blue-soft); color:var(--blue); border-radius:4px; padding:2px 5px; margin-left:5px; }
main { width:100%; max-width:1536px; padding:25px 3% 42px; margin:0 auto; }
h1 { color:var(--ink); font-size:25px; line-height:1.2; font-weight:700; letter-spacing:-.7px; }
.icon-button { color:#857394; font-size:20px; }
.outline-button { color:var(--blue); border:1px solid #e2d8f2; border-radius:8px; background:var(--blue-soft); padding:9px 12px; font-size:14px; font-weight:550; }
.outline-button:hover:not(:disabled) { border-color:#b9a1dd; background:#eee7f8; }
.workbench { display:grid; grid-template-columns:300px minmax(0,1fr) 340px; gap:22px; align-items:start; }
.workbench>* { min-width:0; }
.panel { background:#fff; border:1px solid var(--line); border-radius:15px; box-shadow:0 5px 20px rgb(43 31 71 / 3.5%); }
.small-label { color:var(--muted); letter-spacing:.7px; font-size:12px; }
.source-panel { overflow:hidden; }
.panel-top { padding:18px 17px 13px; gap:10px; }
.panel-top h2 { font-size:15px; font-weight:650; }
.panel-top .small-label { font-size:10px; letter-spacing:.5px; }
.search-box { margin:0 13px; padding:10px; background:#fbfafe; border-color:var(--line); border-radius:8px; }
.search-box svg { color:#88799b; }
.search-box input { font-size:14px; color:var(--ink); }
.search-box input::placeholder { color:#9a91a9; }
.search-box:focus-within { border-color:var(--blue); box-shadow:0 0 0 2px #7352c710; }
.source-event,.source-reason { font-size:11px; color:#81758f; line-height:1.6; margin-top:5px; overflow-wrap:anywhere; }
.source-reason { color:#74677e; }
.source-outcomes { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; color:#6f637e; font-size:11px; }
.source-outcomes span { background:#efebf5; padding:2px 5px; border-radius:4px; overflow-wrap:anywhere; }
.market-image { position:relative; display:block; flex:none; overflow:hidden; background:#f0edf7; border-radius:12px; isolation:isolate; }
.market-image-list { width:48px; height:48px; border-radius:11px; }
.market-image-detail { width:88px; height:88px; }
.market-image-create,.market-image-compact,.asset-market-image { width:40px; height:40px; border-radius:9px; }
.market-image img { display:block; width:100%; height:100%; object-fit:cover; }
.image-fallback { display:none; position:absolute; inset:0; place-items:center; color:#81719e; background:linear-gradient(145deg,#f2eef9,#e8e1f4); font-size:18px; }
.image-unavailable .image-fallback { display:grid; }
.image-unavailable img { visibility:hidden; }
.status-tag { color:var(--jade); background:var(--jade-soft); font-size:11px; padding:2px 6px; line-height:1.6; }
.status-tag.neutral { color:#7a6c8b; background:#f2eef7; }
.status-tag.warn { color:var(--coral); background:var(--coral-soft); }
.detail-column { display:flex; flex-direction:column; min-width:0; gap:14px; }
.market-overview { padding:23px; }
.market-heading { display:flex; align-items:center; gap:15px; }
.market-heading-copy { min-width:0; }
.market-kicker { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 14px; }
.market-end-time { display:inline-flex; align-items:center; gap:5px; margin-left:5px; color:var(--muted); font-size:12px; line-height:1.6; font-variant-numeric:tabular-nums; }
.market-end-time svg { flex:none; width:13px; height:13px; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; }
.category-tag { font-size:12px; letter-spacing:.2px; color:#706782; background:#f5f2f8; padding:3px 6px; }
.coverage-chip { color:#81738f; background:#fff; border-color:var(--line); font-size:10px; }
.market-verification { display:inline-flex; align-items:center; gap:5px; max-inline-size:100%; min-block-size:24px; padding:3px 8px; border:1px solid var(--line); border-radius:7px; background:var(--bg); color:var(--muted); font-size:12px; line-height:1.5; }
.market-verification svg { flex:none; inline-size:12px; block-size:12px; color:var(--blue); stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.verification-label { white-space:nowrap; }
.market-verification time { min-inline-size:0; color:#514c60; font-size:13px; font-weight:550; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.verification-state { display:inline-flex; align-items:center; gap:5px; min-block-size:24px; padding:3px 8px; border:1px solid var(--line); border-radius:7px; font-size:12px; line-height:1.5; }
.verification-state::before { content:''; flex:none; inline-size:5px; block-size:5px; border-radius:50%; background:currentColor; }
.verification-state.is-delayed { color:#9b642f; border-color:#efdfc8; background:#fff8ed; }
.verification-state.is-refreshing { color:var(--blue); border-color:#e8e0f5; background:var(--blue-soft); }
.market-overview h2 { font-size:24px; line-height:1.3; font-weight:700; letter-spacing:-.5px; overflow-wrap:anywhere; }
.market-subline,.source-reference { display:flex; flex-wrap:wrap; align-items:center; gap:6px 9px; color:var(--muted); font-size:12px; margin-top:14px; }
.market-subline { justify-content:space-between; margin:16px 0 19px; font-size:13px; }
.market-subline a,.source-reference a { color:var(--blue); }
.source-reference .vertical-bar { color:#d3cadd; }
.quote-rails { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px; margin-top:20px; }
.quote-rail { padding:13px 15px; border-radius:10px; background:var(--jade-soft); border-color:#e0ebf8; color:var(--jade); }
.quote-rail.no { background:var(--coral-soft); border-color:#f3dfe5; color:var(--coral); }
.quote-rail:hover { border-color:#9ebce0; }
.quote-rail.no:hover { border-color:#dfacb8; }
.quote-rail:disabled { opacity:1; }
.rail-top { font-size:13px; letter-spacing:.2px; }
.rail-price { margin-top:5px; font-size:31px; line-height:1.2; font-weight:550; font-variant-numeric:tabular-nums; letter-spacing:-.7px; overflow-wrap:anywhere; }
.rail-price small { display:block; font-size:11px; letter-spacing:0; margin:4px 0 0; }
.rail-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px; }
.rail-price .rail-unit { display:inline; font-size:13px; font-weight:500; letter-spacing:0; line-height:1.4; }
.pool-switcher { display:grid; gap:6px; margin-top:18px; min-width:0; }
.pool-switcher label { color:var(--muted); font-size:12px; }
.pool-switcher .pool-select { margin:0; min-width:0; background:#fbfafe; border-color:var(--line); color:#5f536f; font-size:13px; }
.price-note,.overview-footer { font-size:12px; color:var(--muted); line-height:1.65; margin-top:10px; }
.market-metrics { display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; border-color:var(--line); margin-top:18px; padding-top:16px; }
.market-metrics>div { min-width:0; flex:1; }
.metric-label { font-size:12px; color:var(--muted); }
.metric-value { color:var(--ink); font-size:16px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.metric-value small { display:block; font-size:11px; color:var(--muted); margin-left:0; }
.source-details { padding:18px 22px; }
.section-head { margin-bottom:12px; align-items:center; }
.section-head h2 { font-size:13px; font-weight:650; }
.section-head .small-label { font-size:11px; }
.text-button { color:var(--blue); font-size:13px; line-height:1.5; }
.local-account-select { background:#fbfafe; border-color:var(--line); color:#5f536f; font-size:13px; }
.pool-note,.source-details p { font-size:13px; color:var(--muted); line-height:1.8; overflow-wrap:anywhere; }
.source-details .section-head { align-items:flex-start; }
.identity-disclosure,.resolution-disclosure,.chart-disclosure,.order-details { border-top:1px solid var(--line); margin-top:17px; padding-top:13px; }
.identity-disclosure summary,.resolution-disclosure>summary,.chart-disclosure>summary,.order-details>summary { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--muted); font-size:13px; cursor:pointer; list-style:none; }
.identity-disclosure summary::-webkit-details-marker,.resolution-disclosure>summary::-webkit-details-marker,.chart-disclosure>summary::-webkit-details-marker,.order-details>summary::-webkit-details-marker { display:none; }
.identity-disclosure summary:after,.resolution-disclosure>summary:after,.chart-disclosure>summary:after,.order-details>summary:after { content:'+'; color:var(--blue); font-size:16px; line-height:1; }
.identity-disclosure[open] summary:after,.resolution-disclosure[open]>summary:after,.chart-disclosure[open]>summary:after,.order-details[open]>summary:after { content:'−'; }
.resolution-disclosure>p { font-size:13px; color:var(--muted); line-height:1.8; margin-top:10px; white-space:pre-line; }
.identity-grid { grid-template-columns:88px minmax(0,1fr); font-size:12px; gap:9px; margin-top:15px; }
.identity-grid dt { color:var(--muted); }
.identity-grid dd { color:#504b60; }
.market-information { min-width:0; }
.market-information-body { padding:2px 0 20px; }
.market-rules-copy { color:#494458; font-size:14px; line-height:1.9; white-space:pre-line; overflow-wrap:anywhere; }
.market-rules-empty { color:var(--muted); font-size:14px; line-height:1.8; }
.market-rules-empty a { color:var(--blue); }
.market-information-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.market-information-links>.information-card:only-child { grid-column:1/-1; }
.information-card { display:flex; align-items:center; min-width:0; gap:10px; padding:14px 12px; color:var(--ink); background:#faf8fd; border:1px solid var(--line); border-radius:11px; text-decoration:none; transition:background-color .15s,border-color .15s; }
a.information-card:hover { background:var(--blue-soft); border-color:#d6c7ec; text-decoration:none; }
.information-card-static { background:#fcfbfe; }
.information-icon { display:grid; place-items:center; flex:none; width:33px; height:33px; color:var(--blue); background:#eee8f8; border-radius:10px; }
.information-icon svg { width:18px; height:18px; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.information-card-copy { display:flex; flex-direction:column; gap:3px; min-width:0; flex:1; }
.information-label { color:var(--muted); font-size:12px; line-height:1.3; }
.information-value { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--blue); font-size:14px; font-weight:600; line-height:1.5; }
.information-address { font-family:ui-monospace,'SFMono-Regular',monospace; font-size:13px; font-weight:500; }
.information-note { color:var(--muted); font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
.information-external { width:15px; height:15px; flex:none; color:#8e7eaa; }
@media(max-width:520px) {
  .market-information-links { grid-template-columns:minmax(0,1fr); gap:8px; }
  .information-card { padding:13px; }
  .market-rules-copy { font-size:14px; line-height:1.85; }
}
.pool-identity,.asset-holdings { font-size:13px; color:var(--muted); overflow-wrap:anywhere; }
.available-balance { font-size:12px; color:var(--muted); margin-top:9px; }
.trade-holdings { display:flex; align-items:center; flex-wrap:wrap; gap:4px 12px; margin-block:14px 6px; padding:4px 12px; border:1px solid var(--line); border-radius:10px; background:var(--bg); }
.trade-holdings-heading { flex:0 0 auto; margin:0; }
.trade-holdings-heading .text-button { display:inline-flex; align-items:center; gap:5px; min-block-size:44px; color:var(--ink); font-size:14px; font-weight:650; }
.trade-holdings-heading .text-button span { color:var(--blue); }
.trade-holdings-heading .text-button:hover { color:var(--blue); }
.trade-holdings-list { display:flex; align-items:center; flex-wrap:wrap; gap:6px 20px; min-inline-size:0; flex:1; padding-block:4px; }
.trade-holding { display:flex; align-items:center; flex-wrap:wrap; gap:4px 6px; min-inline-size:0; }
.trade-holding-label { min-inline-size:0; padding:2px 6px; border-radius:5px; color:var(--jade); background:var(--jade-soft); font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.trade-holding.no .trade-holding-label { color:var(--coral); background:var(--coral-soft); }
.trade-holding-quantity { display:flex; align-items:baseline; flex-wrap:wrap; gap:3px 5px; min-inline-size:0; }
.trade-holding-quantity strong { min-inline-size:0; color:var(--ink); font-size:20px; font-weight:600; letter-spacing:-.3px; line-height:1.4; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.trade-holding-quantity>span { color:var(--muted); font-size:13px; }
.market-chart { padding:17px 0 12px; border-top:1px solid var(--line); margin-top:18px; }
.chart-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.chart-heading h3 { font-size:12px; }
.chart-ranges { display:flex; padding:3px; background:#f6f4f9; border-radius:7px; }
.chart-ranges button { min-width:32px; padding:5px 8px; color:var(--muted); font-size:12px; border-radius:5px; }
.chart-ranges button.active { background:#fff; color:var(--blue); box-shadow:0 1px 3px #211a3510; }
.market-chart svg { width:100%; height:188px; }
.chart-grid { stroke:#eeebf3; }
.chart-line { fill:none; stroke:var(--blue); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.chart-fill { fill:var(--blue); opacity:.08; }
.chart-axis { fill:#746c82; font-size:12px; }
.chart-disclosure .market-chart { border-top:0; margin-top:8px; }
.ticket-column { min-width:0; position:sticky; top:15px; }
.ticket { padding:22px; box-shadow:0 7px 24px rgb(43 31 71 / 5.5%); }
.ticket-title { margin-bottom:17px; gap:10px; }
.ticket-title h2 { font-size:16px; font-weight:700; }
.ticket-title .small-label { font-size:10px; letter-spacing:.6px; }
.trade-mode { display:flex; margin-bottom:15px; padding:3px; background:#f6f3fa; border:0; border-radius:8px; }
.trade-mode button { font-size:14px; color:var(--muted); padding:8px; border-radius:6px; }
.trade-mode button.active { color:var(--ink); background:#fff; box-shadow:0 1px 4px #2419360a; }
.trade-mode button.active:after { content:none; }
.trade-mode button:disabled,.side-selector button:disabled,.quick-shares button:disabled { color:#9b93a6; background:#f0eef3; border-color:#e7e3eb; cursor:not-allowed; opacity:.72; }
.side-selector button.active:disabled { color:#8f8799; background:#f0eef3; border-color:#e7e3eb; }
.quantity-card:has(input:disabled) { background:#f4f2f6; border-color:#e7e3eb; }
.quantity-card input:disabled { color:#8f8799; background:transparent; cursor:not-allowed; }
.quantity-card:has(input:disabled) .share-token,.quantity-card:has(input:disabled) .field-top span { color:#91899c; }
.slippage-row input:disabled { color:#8f8799; background:#f3f1f5; cursor:not-allowed; }
.quote-status-row:has(+ .trade-button:disabled) .quote-status { color:#746b80; }
.side-selector { gap:8px; margin-bottom:19px; }
.side-selector button { padding:12px 10px; background:#fcfbfe; color:var(--muted); border-color:var(--line); font-size:14px; }
.side-selector .yes.active { color:var(--jade); background:var(--jade-soft); border-color:#c4dafa; }
.side-selector .no.active { color:var(--coral); background:var(--coral-soft); border-color:#e5b8c2; }
.quantity-card { padding:14px; background:#fff; border-color:var(--line); border-radius:10px; transition:border-color .15s ease,box-shadow .15s ease; }
/* Ring the whole field: an outline on the bare input stops short of its outcome label. */
.quantity-card:focus-within { border-color:var(--blue); box-shadow:0 0 0 3px #7352c71f; }
.quantity-row input:focus-visible,.slippage-row input:focus-visible { outline:none; }
.field-top { font-size:13px; color:#51485f; gap:12px; }
.field-top span { font-size:12px; color:var(--muted); text-align:right; overflow-wrap:anywhere; }
.quantity-row { margin:11px 0 7px; }
.quantity-row input { font-size:34px; font-weight:550; color:var(--ink); }
.quantity-row input::placeholder { color:#b4a9c3; }
.share-token { color:var(--jade); }
.share-token.no { color:var(--coral); }
.quantity-bottom { color:var(--muted); font-size:11px; }
.quantity-bottom button { color:var(--blue); font-size:12px; }
.quick-shares { display:flex; flex-wrap:wrap; gap:5px; margin-top:12px; }
.quick-shares button { font-size:12px; color:var(--muted); background:#f8f5fc; border:1px solid var(--line); border-radius:6px; padding:6px 9px; }
.swap-divider { height:18px; }
.swap-divider span { width:24px; height:24px; font-size:12px; color:#8a7a9b; box-shadow:0 0 0 1px var(--line); }
.pay-card { margin:12px 0 0; padding:17px 0 9px; border:0; border-radius:0; }
.pay-card>span { font-size:13px; color:#514c60; }
.pay-card>div { margin-top:5px; gap:6px; justify-content:flex-start; align-items:baseline; }
.pay-card>div[data-empty="true"] strong { color:#c4bccf; }
.pay-card>div[data-empty="true"] [data-token-symbol] { display:none; }
.pay-card strong { font-size:30px; font-weight:650; letter-spacing:-.5px; font-variant-numeric:tabular-nums; }
.asset-symbol { color:#514c60; font-size:13px; }
.asset-symbol i { color:var(--blue); background:var(--blue-soft); }
.pay-card>small { font-size:12px; color:var(--muted); margin-top:6px; }
.quote-summary { display:grid; gap:10px; margin:8px 0 15px; }
.average-price-row,.protected-min-row { display:flex; justify-content:space-between; align-items:baseline; gap:12px; font-size:13px; color:var(--muted); }
.average-price-row>span:first-child,.protected-min-row>span:first-child { flex:1; min-width:0; }
.average-price-row strong,.protected-min-row strong { max-width:58%; text-align:right; color:var(--ink); font-weight:500; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.average-price-row>span:first-child { flex:none; }
.average-price-row strong { max-width:none; min-width:0; font-size:15px; font-weight:600; }
.average-price-row small { font-size:12px; font-weight:400; color:var(--muted); white-space:nowrap; }
.average-price-row strong:not(:has(small)) { color:#c4bccf; }
.trade-return { padding-top:12px; border-top:1px solid var(--line); }
.trade-return-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.trade-return-label { flex:none; color:#514c60; font-size:13px; }
.trade-return-amount { display:flex; align-items:baseline; justify-content:flex-end; flex-wrap:wrap; gap:4px; min-width:0; color:var(--blue); text-align:right; }
.trade-return-amount strong { min-width:0; font-size:20px; font-weight:650; line-height:1.3; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.trade-return-amount>span { font-size:13px; }
.trade-return-amount .trade-return-multiple { margin-left:4px; padding-left:8px; border-left:1px solid #d8cee9; color:var(--muted); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; min-width:0; }
.trade-return-profit { display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-top:6px; font-size:13px; color:var(--muted); }
.trade-return-profit strong { min-width:0; text-align:right; color:#2c7b59; font-weight:500; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.trade-return-profit.is-negative strong { color:var(--coral); }
.trade-return.is-pending .trade-return-amount,.trade-return.is-pending .trade-return-multiple,.trade-return.is-pending .trade-return-profit strong { color:var(--muted); }
.trade-return.is-pending .trade-return-amount strong { color:#c4bccf; }
.trade-return.is-pending .trade-return-amount>span { display:none; }
.order-details { margin-top:12px; padding-top:12px; }
.order-details>summary { padding:4px 0; }
.quote-details { font-size:12px; color:var(--muted); margin-top:15px; gap:11px; }
.quote-details>div span:last-child { color:#514c60; font-variant-numeric:tabular-nums; }
.slippage-row { display:flex; font-size:13px; color:var(--muted); margin-top:17px; gap:15px; }
.slippage-row>div { background:#fbfafe; border-color:var(--line); color:#635471; flex:none; }
.slippage-row>div:focus-within { border-color:var(--blue); }
.slippage-row input { width:40px; font-size:13px; }
.protection-note,.fee-explanation { color:var(--muted); font-size:12px; line-height:1.8; margin-top:7px; }
.quote-status { font-size:12px; color:var(--muted); line-height:1.7; margin-top:13px; min-height:0; overflow-wrap:anywhere; }
.quote-status.stale,.field-error,.modal-error { color:var(--coral); }
.primary-button { background:var(--blue); border-color:var(--blue); color:#fff; border-radius:8px; font-size:14px; padding:12px 15px; }
.primary-button:hover:not(:disabled) { background:#6542b6; border-color:#6542b6; }
.primary-button:disabled,.trade-button:disabled { color:#8b7e9d; background:#eeebf3; border-color:#eeebf3; opacity:1; }
.trade-button { margin-top:20px; min-height:45px; font-size:15px; text-align:center; overflow-wrap:anywhere; }
.asset-note { color:#8d7ba2; margin-top:15px; }
.asset-note p,.asset-note span { font-size:12px; color:var(--muted); }
.market-result { margin-top:22px; padding:18px; border:1px solid #e4dced; border-radius:12px; background:#fcfaff; }
.market-check { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:4px 16px; container-type:inline-size; margin-block:18px; padding:16px; border:1px solid var(--line); border-radius:12px; background:#faf8fd; }
.market-check-heading { grid-column:1; display:flex; align-items:flex-start; gap:14px; }
.market-check-icon { display:grid; place-items:center; flex:none; inline-size:42px; block-size:42px; border-radius:13px; background:#eee8f8; color:var(--blue); }
.market-check-icon svg { inline-size:23px; block-size:23px; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.market-check-spinner { animation:market-check-spin 1.2s linear infinite; }
.market-check-spinner circle { opacity:.2; }
.market-check-message { flex:1; min-inline-size:0; }
.market-check h3 { margin:0 0 3px; color:var(--ink); font-size:17px; line-height:1.4; font-weight:650; }
.market-check-message p { margin:0; color:#6c637c; font-size:14px; line-height:1.8; }
.market-check-footer { display:contents; }
.market-check-footer>p { grid-column:1; margin:0; margin-inline-start:56px; color:var(--muted); font-size:13px; line-height:1.7; }
.market-check-actions { grid-column:2; grid-row:1/3; display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; }
.market-check-actions button { min-block-size:44px; }
.market-check-actions .outline-button { padding:9px 15px; background:#fff; font-size:13px; }
.market-check-actions .text-button { display:inline-flex; align-items:center; gap:5px; }
.market-check.is-unavailable { border-color:#eddfcb; background:#fffbf4; }
.market-check.is-unavailable .market-check-icon { color:#9b642f; background:#f8edda; }
.market-overview[data-market-check="loading"] #price-chart,.market-overview[data-market-check="unavailable"] #price-chart { display:none; }
#market-workspace[data-market-check="loading"]>.trade-shortcut,#market-workspace[data-market-check="unavailable"]>.trade-shortcut { display:none; }
.ticket[data-market-check="loading"]>:not(.ticket-title):not(.ticket-market-check):not(.trade-button),.ticket[data-market-check="unavailable"]>:not(.ticket-title):not(.ticket-market-check):not(.trade-button) { display:none!important; }
.ticket-market-check { padding-block:10px 24px; text-align:center; }
.ticket-market-check-icon { display:grid; place-items:center; inline-size:40px; block-size:40px; margin:0 auto 14px; border-radius:12px; background:#f3eff8; color:#9b8bad; }
.ticket-market-check-icon svg { inline-size:22px; block-size:22px; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.ticket-market-check h3 { margin:0 0 8px; font-size:14px; font-weight:600; }
.ticket-market-check p { max-inline-size:28ch; margin-inline:auto; color:var(--muted); font-size:14px; line-height:1.8; }
.ticket-market-check small { display:block; margin-block-start:16px; color:var(--muted); font-size:13px; line-height:1.7; }
@keyframes market-check-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .market-check-spinner { animation:none; } }
@container(max-width:600px) {
  .market-check-heading,.market-check-footer>p { grid-column:1/-1; }
  .market-check-footer>p { margin-inline-start:0; }
  .market-check-actions { grid-column:1/-1; grid-row:auto; }
}
@media(max-width:520px) {
  .market-check { padding:14px; }
  .market-check-heading { gap:11px; }
  .market-check-icon { inline-size:36px; block-size:36px; border-radius:11px; }
  .market-check h3 { font-size:16px; }
}
.result-heading { display:flex; align-items:center; gap:11px; min-width:0; }
.result-icon { display:flex; align-items:center; justify-content:center; width:38px; height:38px; flex:none; border-radius:50%; color:#79639c; background:#eee8f7; }
.result-icon svg { width:22px; height:22px; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.result-heading-copy { flex:1; min-width:0; }
.result-eyebrow { display:block; color:var(--muted); font-size:12px; line-height:1.5; }
.result-heading h3 { margin-top:2px; font-size:19px; line-height:1.3; font-weight:650; color:var(--ink); overflow-wrap:anywhere; }
.result-stage { flex:none; color:#896825; background:#f8f0dd; border-radius:5px; padding:4px 7px; font-size:11px; line-height:1.4; font-weight:550; }
.result-payout-label { margin-top:20px; margin-bottom:8px; font-size:12px; color:var(--muted); }
.result-outcomes { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.result-outcome { min-width:0; border:1px solid #e7e1ef; border-radius:9px; padding:12px; background:#fff; }
.result-outcome-top { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px 8px; font-size:13px; color:#5e536f; }
.result-outcome-top>span:first-child { overflow-wrap:anywhere; }
.result-outcome-badge { color:#40765d; font-size:10px; line-height:1.5; font-weight:600; }
.result-payout { display:flex; flex-wrap:wrap; align-items:baseline; gap:5px; margin-top:8px; color:var(--ink); font-size:29px; line-height:1.2; font-weight:550; letter-spacing:-.5px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.result-payout>span { font-size:12px; font-weight:500; letter-spacing:0; }
.result-outcome.is-winner { border-color:#c9e1d5; background:#f0f8f4; }
.result-outcome.is-winner .result-payout,.result-outcome.is-winner .result-outcome-top>span:first-child { color:#357454; }
.result-outcome.is-zero .result-payout { color:#93899f; }
.result-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:13px; margin-top:16px; padding-top:14px; border-top:1px solid #eae3f2; }
.result-footer>p { flex:1 1 210px; color:#7a6d8c; font-size:12px; line-height:1.75; }
.result-footer .lifecycle-actions { margin:0; display:flex; flex-wrap:wrap; gap:8px; }
.result-footer .outline-button { padding:9px 12px; font-size:12px; background:#fff; }
.market-result.is-settled { border-color:#dce8e1; background:#fbfdfb; }
.is-settled .result-icon { background:#e6f2eb; color:#408060; }
.is-settled .result-stage { color:#40765d; background:#e8f3ec; }
.is-settled .result-footer { border-color:#e1eae5; }
@media (max-width:480px) {
  .market-result { padding:14px; }
  .result-heading { gap:9px; flex-wrap:wrap; }
  .result-heading-copy { flex-basis:calc(100% - 50px); }
  .result-stage { margin-left:47px; }
  .result-payout { font-size:26px; }
  .result-outcome { padding:10px; }
}
.warning-line,.impact-notice { color:#94672f; font-size:13px; line-height:1.7; overflow-wrap:anywhere; }
.impact-notice { background:#fff8ed; padding:9px 11px; border-radius:7px; margin:7px 0 15px; }
#global-error:not(:empty),.trade-summary-error { padding:12px 15px; border:1px solid #f0d9e0; border-radius:9px; background:var(--coral-soft); color:#a14d60; font-size:13px; line-height:1.8; overflow-wrap:anywhere; }
.empty-state { color:var(--muted); font-size:13px; padding:27px 15px; }
.empty-state strong { color:#63556f; font-size:12px; }
.detail-empty { min-height:430px; padding:30px; }
.detail-empty h2 { font-size:20px; color:#5b4d6e; }
.detail-empty p { color:var(--muted); font-size:14px; }
.empty-mark { color:#baa5dc; }
.error-copy { color:#a25f6e; line-height:1.9; }
.skeleton i { background:#f0edf6; }
.positions-panel { padding:24px; }
.asset-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:22px; }
.asset-summary-card { display:flex; flex-direction:column; gap:8px; padding:22px; background:#fff; border:1px solid var(--line); border-radius:15px; color:var(--muted); font-size:13px; }
.asset-summary-card strong { color:var(--ink); font-size:27px; font-weight:650; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.asset-summary-card strong small { color:var(--muted); font-size:13px; font-weight:500; }
.asset-tabs { display:flex; gap:24px; border-bottom:1px solid var(--line); }
.asset-tabs button { padding:0 0 14px; color:var(--muted); font-size:14px; border-bottom:2px solid transparent; }
.asset-tabs button.active { color:var(--blue); border-color:var(--blue); font-weight:650; }
.asset-tabs button span { margin-left:5px; font-size:12px; }
.asset-row { display:flex; gap:20px; justify-content:space-between; border-bottom:1px solid var(--line); padding:22px 0; }
.asset-row:last-child { border-bottom:0; }
.asset-row-main { flex:1; min-width:0; }
.asset-row-action { display:flex; flex-direction:column; justify-content:center; align-items:flex-end; gap:8px; max-width:45%; text-align:right; }
.asset-holdings { margin-top:12px; }
.asset-holdings strong { color:var(--ink); font-weight:550; font-variant-numeric:tabular-nums; }
.asset-row .pool-identity { margin-top:5px; font-size:12px; }
.asset-row-action .lifecycle-actions { justify-content:flex-end; margin-top:0; }
.asset-row-action .text-button { margin-top:0; }
.asset-row-action .small-label { letter-spacing:0; font-family:inherit; }
.position-card { padding:22px; }
.position-card address { color:var(--muted); font-size:12px; overflow-wrap:anywhere; }
.asset-market-name { display:flex; align-items:center; gap:10px; min-width:0; }
.asset-market-name h3 { min-width:0; font-size:14px; line-height:1.5; margin:0; overflow-wrap:anywhere; }
.asset-market-name .market-image { width:40px; height:40px; border-radius:9px; }
.position-card .asset-market-name { margin-top:14px; }
.position-card .market-metrics { gap:12px; }
.position-card .metric-label { font-size:12px; }
.asset-market-name>span:last-child { min-width:0; overflow-wrap:anywhere; }
dialog { width:540px; max-width:calc(100vw - 32px); max-height:calc(100dvh - 40px); overflow:auto; color:var(--ink); background:#fff; border-color:var(--line); border-radius:18px; box-shadow:0 25px 110px #2d19412e; }
dialog::backdrop { background:#37284655; backdrop-filter:blur(4px); }
dialog.wide-modal { width:840px; }
.modal-body { padding:28px; }
.modal-body>.text-button.full-width,.credit-buy-review-actions>.text-button { display:flex; align-items:center; justify-content:center; min-height:44px; padding:10px 12px; }
.modal-body>:is(.primary-button,.outline-button)+.text-button.full-width,.modal-body>.credit-buy-recovery+.credit-buy-recovery-close,.credit-buy-review-actions>:is(.primary-button,.outline-button)+.text-button { margin-top:16px; }
.modal-heading { gap:16px; margin-bottom:21px; }
.modal-heading h2 { font-size:21px; font-weight:650; line-height:1.35; }
.close-button { display:grid; place-items:center; padding:0; width:32px; height:32px; min-width:32px; color:var(--muted); border-radius:7px; }
.close-button:hover { background:var(--blue-soft); }
.modal-body>p,.transaction-message { font-size:14px; color:var(--muted); line-height:1.8; overflow-wrap:anywhere; }
.modal-summary { background:#fbfafe; border-color:var(--line); border-radius:11px; padding:17px; }
.modal-summary h3 { font-size:14px; color:var(--ink); line-height:1.6; }
.modal-summary>div { font-size:14px; color:var(--muted); line-height:1.7; }
.modal-summary strong { color:#4e405e; font-variant-numeric:tabular-nums; }
.modal-summary .asset-market-name,.modal-market-heading { display:flex; align-items:center; justify-content:flex-start; gap:12px; margin-bottom:17px; }
.modal-summary .asset-market-name h3 { font-size:14px; margin:0; }
.modal-market-heading h3 { min-width:0; font-size:15px; line-height:1.5; font-weight:600; }
.modal-notice { color:#95682f; background:#fff8ed; border-color:#f2e6cf; font-size:13px; line-height:1.8; }
.outcome-mapping { font-size:13px; border-color:var(--line); background:#fcfbfe; }
.outcome-mapping p { color:var(--muted); line-height:1.7; }
.wallet-option { color:var(--ink); border-color:var(--line); font-size:14px; }
.wallet-option:hover { background:#fbfafe; }
.wallet-option span { color:var(--muted); }
.local-wallet-section { border-color:var(--line); }
.local-wallet-section h3 { font-size:13px; margin-bottom:5px; }
.local-wallet-section p { color:var(--muted); font-size:13px; line-height:1.8; }
.balance-actions span { color:var(--muted); }
.trade-steps { display:flex; gap:12px; margin:0 0 22px; color:var(--muted); }
.trade-steps span { flex:1; border-bottom:2px solid var(--line); padding-bottom:9px; font-size:13px; }
.trade-steps span.active { color:var(--blue); border-color:var(--blue); }
.stage-number { flex:none; display:grid; place-items:center; width:25px; height:25px; border-radius:50%; color:var(--blue); background:var(--blue-soft); font-size:13px; font-weight:650; }
.modal-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:20px; }
.modal-actions .primary-button { width:auto; margin-top:0; }
.modal-actions button { min-height:40px; }
.consent-row { display:flex; align-items:flex-start; gap:9px; color:var(--muted); font-size:13px; line-height:1.6; margin-top:20px; }
.consent-row input { accent-color:var(--blue); width:16px; height:16px; margin-top:2px; flex:none; }
.operations-alerts { border-color:var(--line); }
.operations-alerts p,.operations-alerts li { color:var(--muted); }
.operations-alerts li strong { color:#59486d; }
.operations-alerts li { border-color:var(--line); }
.toast { color:#fff; background:#554069; border-color:#69557d; font-size:14px; line-height:1.6; box-shadow:0 8px 30px #3b254526; }

@media (max-width:1240px) and (min-width:1051px) {
  .workbench { grid-template-columns:260px minmax(0,1fr) 300px; gap:15px; }
  .market-overview,.ticket { padding:18px; }
  .market-overview h2 { font-size:21px; }
  .market-heading { gap:12px; align-items:flex-start; }
  .app-header { gap:32px; }
}
@media (max-width:1050px) and (min-width:761px) {
  .workbench { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:16px; }
  .source-panel { grid-column:1/-1; grid-row:1; }
  .detail-column { display:flex; grid-column:1; grid-row:2; }
  .ticket-column { grid-column:2; grid-row:2; position:static; }
  .market-heading { align-items:flex-start; gap:12px; }
  .market-overview { padding:20px; }
  .market-overview h2 { font-size:21px; }
  .app-header { height:70px; gap:25px; }
  .network-pill { display:flex; }
  .position-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  #network-name { display:none; }
  .app-header { height:auto; min-height:70px; padding:10px 18px 0; flex-wrap:wrap; gap:7px 15px; }
  .brand { font-size:22px; }
  .header-right { margin-left:auto; gap:8px; }
  nav { order:3; flex:0 0 100%; height:35px; gap:23px; }
  .nav-link { font-size:14px; }
  .network-pill { display:flex; font-size:12px; gap:5px; }
  main { padding:22px 18px 32px; }
  h1 { font-size:24px; }
  .workbench { display:flex; flex-direction:column; align-items:stretch; gap:15px; }
  .source-panel,.detail-column,.ticket-column { width:100%; min-width:0; }
  .source-panel { order:0; }
  .detail-column { display:flex; order:1; gap:14px; }
  .ticket-column { order:2; position:static; }
  .market-image-detail { width:64px; height:64px; }
  .market-heading { gap:12px; align-items:flex-start; }
  .market-overview { padding:20px; }
  .market-overview h2 { font-size:22px; }
  .market-kicker { margin-bottom:12px; }
  .market-subline { margin:14px 0 16px; font-size:12px; }
  .quote-rails { margin-top:18px; gap:9px; }
  .quote-rail { padding:12px 13px; }
  .rail-price { font-size:30px; }
  .rail-price small { font-size:11px; }
  .rail-top,.quote-rail .rail-top { font-size:13px; }
  .source-details { padding:18px 20px; }
  .market-chart { padding:14px 0 9px; }
  .market-chart svg { height:148px; }
  .ticket { padding:23px; }
  .quantity-row input { font-size:34px; }
  .quantity-card { padding:15px; }
  .pay-card strong { font-size:30px; }
  .quote-details { font-size:13px; }
  .detail-empty { min-height:250px; }
  .position-grid { grid-template-columns:1fr; }
  .asset-summary-grid { grid-template-columns:1fr; gap:11px; margin-bottom:16px; }
  .asset-summary-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,auto); gap:6px 15px; padding:17px 18px; align-items:center; }
  .asset-summary-card strong { grid-column:2; grid-row:1 / span 2; font-size:26px; text-align:right; }
  .asset-summary-card>span { grid-column:1; }
  .asset-row { flex-direction:column; align-items:stretch; gap:17px; padding:20px 0; }
  .asset-row-action { max-width:none; width:100%; align-items:flex-start; text-align:left; }
  .asset-row-action .lifecycle-actions { justify-content:flex-start; }
  .positions-panel { padding:20px; }
}
@media (max-width:440px) {
  .simulation-banner { flex-wrap:wrap; gap:3px 6px; padding:6px 14px; font-size:11px; }
  .app-header { padding-left:14px; padding-right:14px; }
  .brand { font-size:20px; gap:7px; }
  .event-mark { width:23px; height:25px; gap:3px; }
  .event-mark i { width:5px; height:17px; }
  .event-mark i:nth-child(2) { height:24px; }
  .event-mark i:nth-child(3) { height:12px; }
  .network-pill { font-size:10px; }
  main { padding:19px 14px 30px; }
  h1 { font-size:23px; }
  .market-overview { padding:17px; }
  .market-overview h2 { font-size:20px; }
  .market-heading { gap:11px; }
  .market-metrics { gap:10px; }
  .metric-label { font-size:11px; }
  .metric-value { font-size:15px; }
  .quote-rail { padding:11px; }
  .rail-price { font-size:27px; }
  .ticket { padding:20px; }
  .modal-body { padding:22px; }
  .modal-heading h2 { font-size:19px; }
  .modal-summary>div { font-size:13px; }
  .modal-summary .asset-market-name { align-items:flex-start; }
}
@media (max-width:760px) {
  .rail-price { font-size:calc(clamp(16px,5.1vw,23px) + 2px); }
}
@media (max-width:360px) {
  .brand { font-size:18px; }
}
@media (max-width:340px) {
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition:none!important; scroll-behavior:auto!important; }
}

/* A single, equal-weight group of official wallet choices. */
.wallet-intro { overflow-wrap:anywhere; }
.wallet-provider-list { display:grid; gap:10px; margin-top:22px; }
.wallet-option.wallet-provider { display:flex; align-items:center; justify-content:space-between; width:100%; margin:0; gap:14px; padding:15px 16px; min-height:76px; border:1px solid var(--line); border-radius:14px; background:#fff; color:var(--ink); text-decoration:none; text-align:left; transition:background .16s,border-color .16s; }
.wallet-option.wallet-provider:hover { background:#faf8fe; border-color:#cdbde3; text-decoration:none; }
.wallet-option.wallet-provider:focus-visible { outline:3px solid #ae94df; outline-offset:3px; }
.wallet-option.wallet-provider.selected { background:var(--blue-soft); border-color:#cbb7e6; }
.wallet-provider-main { display:flex; align-items:center; gap:13px; min-width:0; }
.wallet-provider-main strong { color:var(--ink); font-size:16px; font-weight:600; overflow-wrap:anywhere; }
.wallet-brand-icon { display:grid; place-items:center; width:42px; height:42px; flex:none; }
.wallet-icon { display:block; width:36px; height:36px; object-fit:contain; }
.wallet-option .wallet-option-action { flex:none; font-size:13px; font-weight:500; color:var(--muted); }
.wallet-provider.selected .wallet-option-action { color:var(--blue); }
.wallet-refresh { display:block; margin:17px 0 0 auto; font-size:13px; }
.local-wallet-section { margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
.local-wallet-section summary { cursor:pointer; color:var(--muted); font-size:14px; }
.local-wallet-section p { margin-top:10px; }
.local-wallet-section .outline-button { margin-top:13px; }
@media(max-width:440px) { .wallet-option.wallet-provider { padding:13px; min-height:72px; }.wallet-provider-main { gap:10px; }.wallet-provider-main strong { font-size:15px; } }

.test-environment-note { padding:6px 16px; background:#f0eaf8; color:#66547c; text-align:center; font-size:13px; line-height:1.5; border-bottom:1px solid #e6dcf0; }
.test-environment-note[hidden] { display:none; }

.asset-nav-count { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; margin-left:5px; border-radius:6px; background:var(--blue-soft); color:var(--blue); font-size:12px; }
.collateral-notice { overflow-wrap:anywhere; }

/* Header controls share one vertical rhythm in every wallet state. */
.app-header { height:76px; min-height:76px; }
.header-right { align-items:center; gap:10px; }
@media(max-width:760px) {
  .app-header { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:44px 44px; height:auto; min-height:0; padding:12px 18px; gap:10px 12px; align-items:center; }
  .app-header .brand { grid-column:1; grid-row:1; justify-self:start; font-size:21px; }
  .app-header .header-right { display:contents; }
  .app-header .wallet-button { grid-column:2; grid-row:1; justify-self:end; height:44px; min-height:44px; padding:0 11px; gap:8px; font-size:13px; }
  .app-header .network-button { grid-column:1; grid-row:2; justify-self:start; padding:0 10px; gap:6px; font-size:13px; }
  .app-header nav { grid-column:2; grid-row:2; order:initial; height:44px; flex:none; gap:16px; justify-content:flex-end; }
  .app-header .nav-link { font-size:13px; }
  .wallet-button .wallet-button-address { font-size:13px; }
}
@media(max-width:440px) {
  .app-header { padding:12px 14px; }
  .app-header .brand { font-size:20px; }
  .app-header nav { gap:13px; }
  .network-button #environment-label { display:none; }
}
@media(max-width:360px) {
  .app-header .brand { font-size:18px; }
  .app-header .wallet-button { gap:6px; padding:0 9px; }
  .wallet-button .wallet-button-label { font-size:0; }
  .wallet-button .wallet-button-label:after { content:'Connect'; font-size:13px; }
  .app-header nav { gap:10px; }
  .app-header .nav-link { font-size:12px; }
  .app-header .network-button { padding:0 9px; gap:6px; font-size:12px; }
}

/* Cashout stays within the existing Porcelain type, surfaces and spacing. */
.cashout-net { padding: 24px 0 20px; }
.cashout-net > span { display: block; color: var(--muted, #77717f); font-size: 15px; margin-bottom: 8px; }
.cashout-net > strong { display: block; font-size: calc(clamp(28px, 6vw, 38px) + 2px); font-weight: 600; line-height: 1.2; letter-spacing: -1px; overflow-wrap: anywhere; }
.cashout-net small { font-size: 16px; font-weight: 500; letter-spacing: 0; color: var(--muted, #77717f); }
.cashout-breakdown { margin: 0 0 18px; }
.cashout-breakdown > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 0; border-bottom: 1px solid #ece9ef; }
.cashout-breakdown dt { color: #706a79; font-size: 15px; }
.cashout-breakdown dd { margin: 0; font-size: 16px; font-weight: 500; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.cashout-fees { margin: 15px 0; font-size: 14px; color: #706a79; }
.cashout-fees summary, .cashout-funding > summary { cursor: pointer; padding: 10px 0; font-weight: 500; }
.cashout-fees p, .cashout-explanation { line-height: 1.65; }
.cashout-test-note { font-size: 13px; color: #8a8392; line-height: 1.6; }
.cashout-ticket-split { margin: 4px 0 12px; color: #706a79; font-size: 14px; line-height: 1.6; }
.cashout-ticket .fee-explanation, .cashout-legacy-summary { display: none; }
.funds-stats.cashout-funds-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cashout-payment { padding: 24px 0; border-top: 1px solid #ece9ef; }
.cashout-payment:first-child { border-top: 0; }
.cashout-payment-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }
.cashout-payment-head > strong { font-size: 24px; font-weight: 500; overflow-wrap: anywhere; }
.cashout-payment-head small { font-size: 14px; color: #77717f; }
.cashout-payment > p { font-size: 15px; color: #706a79; }
.cashout-funding { margin-top: 24px; padding: 20px 24px; }
@media (max-width: 600px) { .funds-stats.cashout-funds-stats { grid-template-columns: 1fr; } .cashout-payment-head { align-items: flex-start; } .cashout-breakdown > div { gap: 10px; } .cashout-breakdown dd { max-width: 65%; } }

/* Credit purchases keep the total cost and single next action in focus. */
.credit-buy-total{display:flex;flex-direction:column;gap:10px;margin:24px 0;color:var(--text-primary,#292824)}
.credit-buy-total>span{font-size:15px;color:var(--text-muted,#77746d)}
.credit-buy-total strong{font-size:38px;line-height:1.15;font-weight:500;letter-spacing:-.035em}
.credit-buy-total small{font-size:18px;font-weight:400;letter-spacing:0}
.credit-buy-fees,.credit-buy-details{margin:16px 0;color:var(--text-muted,#77746d);font-size:15px}
.credit-buy-fees summary,.credit-buy-details summary{cursor:pointer;color:var(--text-primary,#292824)}
.credit-buy-fees p,.credit-buy-setup{line-height:1.6}
.credit-buy-details dl>div{display:flex;justify-content:space-between;gap:16px;margin:12px 0}
.credit-buy-details dd{margin:0;color:var(--text-primary,#292824)}
.credit-buy-spent{display:flex;justify-content:space-between;gap:16px}
/* Credit tickets keep a live DEX-style price: details appear with a quote. */
.credit-buy-ticket #quote-details:empty{display:none}
.quote-status-row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0 12px}
.quote-status-row .quote-refresh{margin-top:13px;margin-left:auto;font-size:12px;font-weight:600}
.credit-buy-ticket[data-quote-state="loading"] #quote-amount{animation:quote-amount-pulse 1.2s ease-in-out infinite}
.credit-buy-ticket[data-quote-state="refreshing"] #quote-amount{opacity:.55;transition:opacity .2s}
.credit-buy-approval-hint{margin:14px 0 0;color:var(--muted);font-size:12px;line-height:1.6}
@keyframes quote-amount-pulse{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.credit-buy-ticket[data-quote-state="loading"] #quote-amount{animation:none;opacity:.55}}
.credit-buy-flow{min-width:0;color:var(--ink);font-size:14px;line-height:1.65;overflow-wrap:anywhere}
.credit-buy-order>div,.credit-buy-market{display:flex;justify-content:space-between;align-items:baseline;gap:12px;min-width:0;padding:10px 12px}
.credit-buy-order span,.credit-buy-market>span{color:var(--muted);font-size:13px}
.credit-buy-order strong,.credit-buy-market strong{min-width:0;color:var(--ink);font-size:12px;font-weight:600;text-align:right;overflow-wrap:anywhere}
.credit-buy-order strong { font-size:14px; }
.credit-buy-flow .credit-buy-shared,.credit-buy-flow .credit-buy-confirm-note{margin:11px 0;color:var(--muted);font-size:13px;line-height:1.6}
.credit-buy-flow .credit-buy-approval-note{margin:12px 0;padding:10px 12px;border:1px solid #e8e2ef;border-radius:9px;background:#fbfafe}
.credit-buy-flow .credit-buy-approval-note>strong{display:block;color:var(--ink);font-size:13px;font-weight:650}
.credit-buy-flow .credit-buy-approval-note>p{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.55}
.credit-buy-flow .credit-buy-approval-limit{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:9px;padding-top:8px;border-top:1px solid var(--line)}
.credit-buy-flow .credit-buy-approval-limit span{color:var(--muted);font-size:12px}
.credit-buy-flow .credit-buy-approval-limit strong{color:var(--ink);font-size:13px;font-weight:600;text-align:right}
.credit-buy-flow .credit-buy-approval-note .credit-buy-shared{margin-top:7px;font-size:12px}
.credit-buy-progress ol{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.credit-buy-progress li{display:flex;align-items:center;gap:12px;min-width:0;min-height:52px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fbfafe}
.credit-buy-progress-number{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:#efedf2;color:var(--muted);font-size:12px;font-weight:650;font-variant-numeric:tabular-nums}
.credit-buy-progress-spinner{display:block;flex:none;width:18px;height:18px;margin:3px;border:2px solid #d6c9eb;border-top-color:var(--blue);border-radius:50%;animation:credit-buy-progress-spin .8s linear infinite}
@keyframes credit-buy-progress-spin{to{transform:rotate(360deg)}}
.credit-buy-progress-copy{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.credit-buy-progress-copy strong{min-width:0;color:var(--ink);font-size:14px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}
.credit-buy-progress-copy small{color:var(--muted);font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.credit-buy-progress li.is-wallet,.credit-buy-progress li.is-pending{border-color:#d6c9eb;background:#fcfaff}
.credit-buy-progress li.is-wallet .credit-buy-progress-number{background:var(--blue);color:#fff}
.credit-buy-progress li.is-done .credit-buy-progress-number{background:#e8f2eb;color:#416b50}
.credit-buy-progress li.is-done .credit-buy-progress-copy small{color:#416b50}
.credit-buy-progress li.is-attention,.credit-buy-progress li.is-blocked{border-color:#ead7d4;background:#fffafa}
.credit-buy-progress li.is-attention .credit-buy-progress-copy small,.credit-buy-progress li.is-blocked .credit-buy-progress-copy small{color:#9a5148}
.credit-buy-progress li.is-wallet .credit-buy-progress-copy small,.credit-buy-progress li.is-pending .credit-buy-progress-copy small{color:var(--blue);font-weight:600}
.credit-buy-progress-note{margin:12px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
.credit-buy-syncing{display:flex;align-items:center;gap:7px;margin:14px 0 0;padding:10px 12px;border-radius:8px;background:#f8f6fc;color:var(--muted);font-size:13px;line-height:1.5}
.credit-buy-syncing .credit-buy-progress-spinner{width:12px;height:12px;margin:2px}
.credit-buy-flow~.modal-error:empty,.credit-buy-flow~.transaction-message:empty{display:none}
.trade-pending-list{margin:8px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fbfafe;font-size:13px;color:var(--muted)}
.trade-pending-list summary{cursor:pointer;font-weight:600}
.trade-pending-list ul{display:grid;gap:8px;margin:10px 0 0;padding:0;list-style:none}
.trade-pending-list li{display:flex;align-items:center;justify-content:space-between;gap:12px}
.trade-pending-list strong,.trade-pending-list small{display:block;line-height:1.6}
.trade-pending-list strong{font-size:13px;color:var(--ink)}
.asset-progress-notice{position:relative}
.asset-progress-notice>.asset-progress{padding-right:50px}
.asset-progress-dismiss{position:absolute;top:8px;right:8px;width:32px;height:32px;display:grid;place-items:center;font-size:21px;line-height:1;color:var(--muted);border-radius:6px}
.asset-progress-dismiss:hover{color:var(--ink);background:var(--blue-soft)}
#asset-progress:empty{display:none}
@media(prefers-reduced-motion:reduce){.credit-buy-progress-spinner{animation:none;border-style:dashed;border-top-color:#9a80d2}}
.credit-buy-recovery{display:grid;gap:14px}
.credit-buy-recovery-status{display:flex;align-items:flex-start;gap:12px;min-width:0}
.credit-buy-recovery-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border:1px solid #f0dfb7;border-radius:50%;background:#fff9ec;color:#9a6b16}
.credit-buy-recovery-icon svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.credit-buy-recovery-status h3{margin:1px 0 4px;color:var(--ink);font-size:13px;font-weight:650;line-height:1.4}
.credit-buy-recovery-status p,.credit-buy-recovery-next{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.credit-buy-recovery-order{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fbfafe}
.credit-buy-recovery-order.is-approval{grid-template-columns:minmax(0,1fr)}
.credit-buy-recovery-order>div{display:grid;gap:2px;min-width:0}
.credit-buy-recovery-order dt{color:var(--muted);font-size:12px}
.credit-buy-recovery-order dd{margin:0;color:var(--ink);font-size:13px;font-weight:600;overflow-wrap:anywhere}
.credit-buy-recovery-field{display:grid;gap:6px;min-width:0}
.credit-buy-recovery-field label{color:var(--ink);font-size:13px;font-weight:600}
.credit-buy-recovery-field input{box-sizing:border-box;width:100%;min-width:0;height:44px;padding:0 11px;border:1px solid #ddd8e7;border-radius:8px;background:#fff;color:var(--ink);font-family:ui-monospace,'SFMono-Regular',Menlo,monospace;font-size:14px;overflow-wrap:anywhere}
.credit-buy-recovery-field input::placeholder{color:#a39caf}
.credit-buy-recovery-field input:focus-visible{border-color:#ae94df}
.credit-buy-recovery-submit{min-height:44px}
.credit-buy-issue-close{min-height:44px;margin-top:8px}
.credit-buy-issue-close~.modal-error:empty,.credit-buy-issue-close~.transaction-message:empty{display:none}
.credit-buy-recovery-close{min-height:44px;margin-top:8px}
.credit-buy-recovery-close~.modal-error:empty,.credit-buy-recovery-close~.transaction-message:empty{display:none}
.modal-body:has(>.credit-buy-recovery){display:flex;flex-direction:column}
.modal-body>.credit-buy-recovery{order:1}
.modal-body>.credit-buy-recovery-close{order:3}
.credit-buy-recovery-close~.modal-error{order:2;margin-top:8px}
.credit-buy-recovery-close~.transaction-message{order:4}
.credit-buy-recovery-submit:hover:not(:disabled){background:#6342b6;border-color:#6342b6}
.credit-buy-issue{display:grid;gap:10px}
.credit-buy-issue-status{display:flex;align-items:center;gap:11px;min-width:0}
.credit-buy-issue-icon,.credit-buy-success-icon{display:grid;place-items:center;flex:none;width:32px;height:32px;border:1px solid #f0dfb7;border-radius:50%;background:#fff9ec;color:#9a6b16}
.credit-buy-issue.is-red .credit-buy-issue-icon{border-color:#efd5d8;background:#fff5f5;color:#a34d59}
.credit-buy-issue-icon svg,.credit-buy-success-icon svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.credit-buy-issue-status>div{display:grid;gap:4px;min-width:0}
.credit-buy-issue-status p{margin:0;color:var(--ink);font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.credit-buy-issue-tag{justify-self:start;padding:2px 7px;border-radius:999px;background:#edf4fc;color:#376fae;font-size:12px;font-weight:600;line-height:1.5}
.credit-buy-issue-summary,.credit-buy-success-summary{display:grid;gap:8px;margin:0;padding-top:11px;border-top:1px solid var(--line)}
.credit-buy-issue-summary>div,.credit-buy-success-summary>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;min-width:0}
.credit-buy-issue-summary dt,.credit-buy-success-summary dt{color:var(--muted);font-size:13px}
.credit-buy-issue-summary dd,.credit-buy-success-summary dd{margin:0;color:var(--ink);font-size:14px;font-weight:600;text-align:right;overflow-wrap:anywhere}
.credit-buy-success{display:grid;gap:13px}
.credit-buy-success-status{display:flex;align-items:center;gap:10px}
.credit-buy-success-icon{border-color:#d5e8da;background:#f0f8f1;color:#3b8057}
.credit-buy-success-status p{margin:0;color:var(--ink);font-size:15px;font-weight:600;line-height:1.5}
.credit-buy-success-summary{gap:9px}
.cashout-sale-flow{min-width:0;color:var(--ink);font-size:12px;line-height:1.65;overflow-wrap:anywhere}
.cashout-sale-progress ol{grid-template-columns:minmax(0,1fr)}
.cashout-sale-success{display:grid;gap:11px}
.cashout-sale-waiting{margin:0;color:var(--muted);font-size:11px;line-height:1.6}
.cashout-sale-issue,.cashout-sale-recovery{min-width:0}
.cashout-sale-recovery-order{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:380px){.cashout-sale-recovery-order{gap:6px;padding:10px}.cashout-sale-recovery-order dt{font-size:9px}.cashout-sale-recovery-order dd{font-size:10px}}
.trade-transaction-details{margin:13px 0 0;border-top:1px solid var(--line);color:var(--ink)}
.trade-transaction-details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 2px;cursor:pointer;list-style:none;color:var(--ink);font-size:13px;font-weight:600}
.trade-transaction-details>summary::-webkit-details-marker{display:none}
.trade-transaction-details>summary:focus-visible{outline:3px solid #ae94df;outline-offset:2px;border-radius:5px}
.trade-tx-chevron{display:grid;place-items:center;flex:none;width:22px;height:22px;color:var(--muted);transition:transform .15s ease}
.trade-tx-chevron svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.trade-transaction-details[open] .trade-tx-chevron{transform:rotate(180deg)}
.trade-transaction-body{display:grid;gap:8px;padding:0 0 2px}
.trade-tx-link{display:grid;gap:6px;min-width:0;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:#fbfafe;color:var(--ink);text-decoration:none;transition:background-color .15s,border-color .15s}
a.trade-tx-link:hover{border-color:#d6c7ec;background:#f7f3fc;text-decoration:none}
.trade-tx-link:focus-visible{outline:3px solid #ae94df;outline-offset:2px}
.trade-tx-label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;min-width:0;font-size:13px;font-weight:600}
.trade-tx-label small{flex:none;color:var(--blue);font-size:12px;font-weight:500}
.trade-tx-link code{display:block;min-width:0;color:var(--muted);font-family:ui-monospace,'SFMono-Regular',Menlo,monospace;font-size:12px;line-height:1.55;overflow-wrap:anywhere;word-break:break-all}
.trade-tx-reference{margin:0;color:var(--muted);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:600px){.credit-buy-recovery-field input{font-size:18px}}
@media(max-width:380px){.credit-buy-recovery{gap:12px}.credit-buy-recovery-status{gap:9px}.credit-buy-recovery-order{gap:6px;padding:10px}.credit-buy-recovery-order dt{font-size:11px}.credit-buy-recovery-order dd{font-size:12px}}
.credit-buy-flow .credit-buy-details{margin:13px 0 0;font-size:13px}
.credit-buy-flow .credit-buy-details summary,.credit-buy-flow .credit-buy-fees summary{padding:3px 0;font-size:13px}
.credit-buy-flow .credit-buy-details dl{margin:7px 0 0}
.credit-buy-flow .credit-buy-details dl>div{align-items:flex-start;gap:9px;margin:8px 0}
.credit-buy-flow .credit-buy-details dt{color:var(--muted)}
.credit-buy-flow .credit-buy-details dd{text-align:right;overflow-wrap:anywhere;min-width:0}
.credit-buy-flow .credit-buy-details code{font-size:11px;overflow-wrap:anywhere;word-break:break-all}
.credit-buy-market{align-items:flex-start;margin:0 0 10px;padding:0}
.credit-buy-market strong{max-width:72%;font-weight:550}
.credit-buy-order{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.credit-buy-order>div{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fbfafe}
.credit-buy-order strong{text-align:left}
.credit-buy-flow .credit-buy-total{gap:4px;margin:13px 0 7px;padding:12px 13px;border-radius:9px;background:#fbfafe}
.credit-buy-flow .credit-buy-total>span{font-size:13px}
.credit-buy-flow .credit-buy-total strong{font-size:26px;line-height:1.25;letter-spacing:-.02em;overflow-wrap:anywhere}
.credit-buy-flow .credit-buy-total small{font-size:14px}
.credit-buy-flow .credit-buy-fees{margin:10px 0 0;font-size:13px}
.credit-buy-flow .credit-buy-fees p{margin:7px 0 0;font-size:13px}
.credit-buy-flow .credit-buy-test-note{margin:13px 0 0;color:var(--muted);font-size:12px;line-height:1.5}
.credit-buy-review-actions{position:sticky;bottom:0;z-index:3;margin:14px -28px -28px;padding:11px 28px 14px;border-top:1px solid var(--line);background:#fff;box-shadow:0 -8px 16px #fff}
.credit-buy-review-actions .warning-line{margin:0 0 5px}
.credit-buy-review-actions .primary-button{width:100%;min-height:44px;margin:0}
@media(max-width:760px){.credit-buy-review-actions{margin:12px -22px -22px;padding:10px 22px max(12px,env(safe-area-inset-bottom))}}

/* My Assets: summary tiles, grouped positions, payment queue and activity ledger. */
#positions-workspace { display:flex; flex-direction:column; gap:18px; max-width:1100px; margin:0 auto; }
.assets-tiles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.assets-tile { display:flex; flex-direction:column; gap:2px; padding:16px 20px; text-align:left; color:var(--muted); font-size:13px; background:#fff; border:1px solid var(--line); border-radius:15px; box-shadow:0 5px 20px rgb(43 31 71 / 3.5%); }
.assets-tile:hover { border-color:#ddd5ea; }
.assets-tile strong { color:var(--ink); font-size:25px; font-weight:650; letter-spacing:-.4px; line-height:1.3; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.assets-tile strong small { margin-left:5px; color:var(--muted); font-size:13px; font-weight:500; letter-spacing:0; }
.assets-tile p { font-size:12px; color:var(--muted); }
.assets-tile.is-claim { background:var(--blue-soft); border-color:#e3d8f5; }
.assets-tile.is-claim strong { color:var(--blue); }
.assets-tile.is-queue strong { color:#91612c; }
#positions-workspace .is-up { color:#3f8a69; }
#positions-workspace .is-down { color:var(--coral); }
.assets-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); }
.assets-tabs { display:flex; gap:26px; }
.assets-tabs button { min-height:46px; margin-bottom:-1px; padding:0 1px; color:var(--muted); font-size:14px; border-bottom:2px solid transparent; }
.assets-tabs button[aria-selected="true"] { color:var(--blue); border-color:var(--blue); font-weight:650; }
.assets-tabs button span { margin-left:5px; font-size:12px; font-variant-numeric:tabular-nums; }
.assets-tools { display:flex; align-items:center; gap:10px; }
.assets-search { display:flex; align-items:center; gap:7px; width:220px; padding:6px 10px; color:var(--muted); background:#fff; border:1px solid var(--line); border-radius:8px; }
.assets-search input { width:100%; font-size:13px; }
.assets-updated { font-size:12px; color:var(--muted); white-space:nowrap; }
.assets-refresh { width:34px; height:34px; display:grid; place-items:center; color:var(--muted); background:#fff; border:1px solid var(--line); border-radius:8px; }
.assets-refresh svg { width:16px; height:16px; stroke:currentColor; stroke-width:1.6; }
.assets-updated.is-stale,.assets-refresh.is-stale { color:#91612c; }
.assets-refresh.is-stale { background:#fdf6ec; border-color:#f0dfc6; }
.assets-panel { display:flex; flex-direction:column; gap:22px; }
.assets-group { display:flex; flex-direction:column; gap:9px; scroll-margin-top:16px; }
.assets-group-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.assets-group-head h2 { display:flex; align-items:center; gap:7px; font-size:14.5px; font-weight:650; }
.assets-group-head p { font-size:12.5px; color:var(--muted); }
.assets-count { padding:0 6px; color:var(--muted); font-size:12px; font-weight:600; background:#f2eff7; border-radius:5px; }
.assets-list { overflow:hidden; }
.assets-list.is-queue { border-color:#f0dfc6; }
.assets-columns,.assets-row { display:grid; grid-template-columns:minmax(0,1fr) 196px 116px 104px 112px; gap:16px; align-items:center; padding:14px 20px; }
.assets-row { grid-template-areas:"market holdings value pnl action"; }
.assets-row+.assets-row { border-top:1px solid var(--line); }
.assets-columns { padding-block:8px; color:var(--muted); font-size:12px; background:#fcfbfe; border-bottom:1px solid var(--line); }
.assets-list.is-queue .assets-columns { background:#fdf6ec; border-color:#f0dfc6; }
.assets-columns span:nth-child(n+3) { text-align:right; }
.assets-market { grid-area:market; display:flex; align-items:center; gap:12px; min-width:0; }
.assets-market>div { display:flex; flex-direction:column; gap:3px; min-width:0; }
.assets-market .market-image { width:40px; height:40px; border-radius:9px; }
.assets-title { display:-webkit-box; overflow:hidden; color:var(--ink); font-size:14px; font-weight:600; line-height:1.4; text-align:left; overflow-wrap:anywhere; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
button.assets-title:hover { color:var(--blue); text-decoration:underline; text-underline-offset:3px; }
.assets-meta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; color:var(--muted); font-size:12px; }
.assets-meta .market-end-time { font-size:12px; }
.assets-chip { display:inline-flex; align-items:center; padding:1px 7px; color:#7a6c8b; font-size:11.5px; font-weight:600; line-height:1.6; white-space:nowrap; background:#f2eef7; border-radius:5px; }
.assets-chip.is-result { color:var(--blue); background:var(--blue-soft); }
.assets-chip.is-new,.assets-chip.is-waiting { color:#91612c; background:#fdf6ec; }
.assets-chip.is-bad { color:var(--coral); background:var(--coral-soft); }
.assets-holdings { grid-area:holdings; display:flex; flex-direction:column; gap:2px; min-width:0; font-size:13px; }
.assets-side { display:flex; align-items:baseline; gap:6px; font-variant-numeric:tabular-nums; }
.assets-side i { width:7px; height:7px; flex:none; background:var(--jade); border-radius:50%; transform:translateY(-1px); }
.assets-side.is-second i { background:var(--coral); }
.assets-side>span { color:#4a4560; }
.assets-side strong { color:var(--ink); font-weight:600; }
.assets-side em { color:#9a95aa; font-size:12px; font-style:normal; }
.assets-side.is-lost { opacity:.55; }
.assets-value,.assets-pnl { display:flex; flex-direction:column; align-items:flex-end; text-align:right; font-variant-numeric:tabular-nums; }
.assets-value { grid-area:value; }
.assets-value strong { font-size:15px; font-weight:650; }
.assets-value small,.assets-pnl small { color:var(--muted); font-size:12px; }
.assets-row[data-asset-group="claim"] .assets-value strong { color:var(--blue); }
.assets-pnl { grid-area:pnl; }
.assets-pnl strong { font-size:14.5px; font-weight:650; }
.assets-pnl.is-up small { color:#3f8a69; }
.assets-pnl.is-down small { color:var(--coral); }
.assets-pnl.is-none { color:#9a95aa; }
.assets-cap,.assets-pnl-inline { display:none; }
.assets-action { grid-area:action; display:flex; justify-content:flex-end; }
.assets-action .primary-button,.assets-action .outline-button { min-width:104px; min-height:38px; margin:0; padding:8px 14px; font-size:13.5px; }
.assets-progress-button { display:inline-flex; align-items:center; justify-content:center; gap:7px; }
.assets-quiet { color:var(--muted); font-size:12px; text-align:right; }
.assets-spinner { width:14px; height:14px; flex:none; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:assets-spin .8s linear infinite; }
@keyframes assets-spin { to { transform:rotate(360deg); } }
.assets-progress small { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.assets-progress progress,.redeem-split progress { width:100%; height:6px; overflow:hidden; background:#f3ece2; border:0; border-radius:99px; appearance:none; }
.assets-progress progress::-webkit-progress-bar,.redeem-split progress::-webkit-progress-bar { background:#f3ece2; border-radius:99px; }
.assets-progress progress::-webkit-progress-value { background:#e2b77c; border-radius:99px; }
.assets-progress progress::-moz-progress-bar { background:#e2b77c; border-radius:99px; }
.assets-delay { color:var(--coral); font-size:12px; }
.assets-payment.is-delayed { background:#fffafa; }
.assets-payment.is-new { background:#fffbf3; }
.assets-empty { padding:28px 20px; color:var(--muted); font-size:13.5px; text-align:center; }
.assets-empty-inline { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; color:var(--muted); font-size:13.5px; }
.assets-empty-actions { display:flex; align-items:center; gap:14px; }
.assets-hero { min-height:420px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:40px 24px; text-align:center; }
.assets-hero h2 { font-size:19px; font-weight:600; }
.assets-hero p { max-width:44ch; color:var(--muted); font-size:13.5px; }
.assets-hero button { margin-top:10px; }
.assets-filters { display:flex; flex-wrap:wrap; gap:6px; }
.assets-filters button { min-height:32px; padding:3px 12px; color:var(--muted); font-size:12.5px; background:#fff; border:1px solid var(--line); border-radius:999px; }
.assets-filters button[aria-pressed="true"] { color:var(--blue); font-weight:650; background:var(--blue-soft); border-color:#e2d8f2; }
.assets-list.is-history .assets-columns,.assets-list.is-history .assets-row { grid-template-columns:minmax(0,1fr) 230px 196px 84px; }
.assets-list.is-history .assets-row { grid-template-areas:"market holdings value date"; padding-block:8px; }
.assets-list.is-history .assets-market { gap:10px; }
.assets-list.is-history .market-image { width:28px; height:28px; border-radius:7px; }
.assets-list.is-history .assets-title { font-size:13.5px; -webkit-line-clamp:1; }
.assets-list.is-history .assets-holdings { flex-direction:row; align-items:center; gap:10px; }
.assets-list.is-history .assets-value { flex-direction:row; align-items:center; justify-content:flex-end; gap:7px; }
.assets-list.is-history .assets-value strong { font-size:14px; }
.assets-cap-inline { color:var(--muted); font-size:11.5px; }
.assets-date { grid-area:date; color:var(--muted); font-size:12px; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.assets-tag { width:58px; height:22px; flex:none; display:inline-flex; align-items:center; justify-content:center; font-size:11.5px; font-weight:650; line-height:1; border-radius:5px; }
.assets-tag.is-buy { color:var(--jade); background:var(--jade-soft); }
.assets-tag.is-sell { color:#7a6c8b; background:#f2eef7; }
.assets-tag.is-claim { color:var(--blue); background:var(--blue-soft); }
.assets-tag.is-win { color:#3f8a69; background:#ecf6f1; }
.assets-tag.is-lose { color:var(--coral); background:var(--coral-soft); }
.assets-more { display:flex; justify-content:center; padding:9px; border-top:1px solid var(--line); }
.assets-loading { display:flex; flex-direction:column; gap:18px; }
.assets-skeleton { display:block; height:92px; background:linear-gradient(90deg,#f1eef6 0%,#f8f6fb 50%,#f1eef6 100%); background-size:200% 100%; border-radius:15px; animation:assets-shimmer 1.4s ease-in-out infinite; }
.assets-skeleton.is-row { height:44px; margin:14px 20px; border-radius:8px; }
.assets-skeleton.is-amount { width:160px; height:34px; margin-top:4px; border-radius:6px; }
.assets-skeleton.is-split { height:44px; margin-bottom:12px; border-radius:10px; }
@keyframes assets-shimmer { from { background-position:100% 0; } to { background-position:-100% 0; } }
.app-header .network-button[data-state="wrong-network"] { width:auto; min-width:0; padding:0 10px; color:#79520f; }
.app-header .network-button[data-state="wrong-network"] #network-name { display:inline; }
@media (max-width:760px) {
  .assets-tiles { grid-template-columns:1fr; gap:8px; }
  .assets-tile { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 12px; align-items:center; padding:12px 15px; border-radius:12px; }
  .assets-tile strong { grid-column:2; grid-row:1 / span 2; font-size:19px; text-align:right; }
  .assets-tile p { grid-column:1; }
  .assets-toolbar,.assets-tools { flex-wrap:wrap; }
  .assets-search { order:3; flex:1 1 100%; width:auto; margin-bottom:8px; }
  .assets-columns { display:none; }
  .assets-row { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"market market" "holdings value" "holdings action"; gap:8px 12px; padding:14px 15px; align-items:start; }
  .assets-pnl { display:none; }
  .assets-cap { display:block; color:var(--muted); font-size:12px; }
  .assets-pnl-inline { display:block; font-size:12px; font-weight:600; }
  .assets-payment { grid-template-areas:"market market" "holdings holdings" "value action"; align-items:center; }
  .assets-payment .assets-value { align-items:flex-start; text-align:left; }
  .assets-list.is-history .assets-row { grid-template-columns:minmax(0,1fr) auto auto; grid-template-areas:"market market date" "holdings value value"; gap:4px 10px; padding:9px 14px; align-items:center; }
  .assets-list.is-history .assets-holdings { overflow:hidden; }
  .assets-list.is-history .assets-cap-inline,.assets-list.is-history .assets-cap { display:none; }
  .assets-filters { flex-wrap:nowrap; overflow-x:auto; }
  .assets-filters button { flex:none; padding:3px 10px; }
  .assets-empty-inline { flex-direction:column; align-items:flex-start; }
  .assets-hero { min-height:360px; }
}

/* Redeem stays in one dialog: payout check, review, wallet, confirmation and result. */
.redeem-market { display:flex; align-items:center; gap:11px; margin-bottom:14px; padding:11px 12px; background:#fcfbfe; border:1px solid var(--line); border-radius:12px; }
.redeem-market .market-image { width:34px; height:34px; border-radius:8px; }
.redeem-market>div { min-width:0; }
.redeem-market strong { font-size:13.5px; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
.redeem-market p { display:flex; flex-wrap:wrap; align-items:center; gap:4px 9px; margin-top:3px; color:var(--muted); font-size:12px; }
.redeem-receive { display:flex; flex-direction:column; gap:2px; margin-bottom:14px; }
.redeem-receive>span { color:var(--muted); font-size:13px; }
.redeem-receive strong,.redeem-result strong { color:var(--ink); font-size:30px; font-weight:650; letter-spacing:-.6px; line-height:1.25; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.redeem-receive strong small,.redeem-result strong small { margin-left:6px; color:var(--muted); font-size:14px; font-weight:500; letter-spacing:0; }
.redeem-receive p,.redeem-fees { color:var(--muted); font-size:12.5px; }
.redeem-paid-now { display:flex; align-items:center; gap:8px; margin-bottom:12px; padding:9px 11px; color:#3f8a69; font-size:13px; background:#ecf6f1; border-radius:9px; }
.redeem-paid-now svg,.redeem-icon svg,.redeem-steps svg { fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.redeem-paid-now svg { width:15px; height:15px; flex:none; }
.redeem-split { display:flex; flex-direction:column; gap:9px; margin-bottom:12px; padding:12px 13px; border:1px solid var(--line); border-radius:12px; }
.redeem-split progress { height:8px; }
.redeem-split progress::-webkit-progress-bar { background:#e2b77c; }
.redeem-split progress::-webkit-progress-value { background:var(--blue); border-radius:99px 0 0 99px; }
.redeem-split progress::-moz-progress-bar { background:var(--blue); }
.redeem-split progress { background:#e2b77c; }
.redeem-split dl { display:flex; flex-direction:column; gap:6px; margin:0; font-size:13.5px; }
.redeem-split dl>div { display:flex; justify-content:space-between; gap:12px; }
.redeem-split dt { display:flex; align-items:center; gap:7px; color:#4a4560; }
.redeem-split dd { margin:0; font-weight:600; text-align:right; font-variant-numeric:tabular-nums; }
.redeem-split dt i { width:8px; height:8px; flex:none; border-radius:50%; }
.redeem-split .is-now { background:var(--blue); }
.redeem-split .is-later { background:#e2b77c; }
.redeem-split .is-done { background:#3f8a69; }
.redeem-split p { color:var(--muted); font-size:12.5px; }
.redeem-split s { margin-right:6px; color:#9a95aa; font-weight:500; }
.redeem-split mark { padding:0 4px; color:#91612c; background:#fdf6ec; border-radius:4px; }
.redeem-note { margin-bottom:12px; padding:9px 11px; color:#4a4560; font-size:13px; background:#f4f2f8; border-radius:9px; }
.redeem-note.is-changed { color:#91612c; background:#fdf6ec; border:1px solid #f0dfc6; }
.redeem-note[hidden] { display:none; }
.redeem-quote { min-height:18px; color:var(--muted); font-size:12px; }
.redeem-steps { margin:0 0 12px; padding:6px 13px; list-style:none; border:1px solid var(--line); border-radius:12px; }
.redeem-steps li { display:flex; align-items:flex-start; gap:10px; padding:8px 0; color:#9a95aa; font-size:13.5px; }
.redeem-steps li+li { border-top:1px solid var(--line); }
.redeem-steps li>svg,.redeem-steps li>i,.redeem-steps li>.assets-spinner { width:18px; height:18px; flex:none; margin-top:1px; }
.redeem-steps li>i { border:2px solid #ddd8e8; border-radius:50%; }
.redeem-steps li>svg { padding:3px; color:#fff; background:#3f8a69; border-radius:50%; }
.redeem-steps li.is-done { color:#4a4560; }
.redeem-steps li.is-now { color:var(--ink); font-weight:600; }
.redeem-steps li.is-now .assets-spinner { color:var(--blue); }
.redeem-steps small { display:block; color:var(--muted); font-size:12px; font-weight:400; }
.redeem-result { display:flex; flex-direction:column; align-items:center; gap:6px; padding:6px 0 12px; text-align:center; }
.redeem-result p { max-width:34ch; color:var(--muted); font-size:13.5px; }
.redeem-icon { width:48px; height:48px; display:grid; place-items:center; margin-bottom:4px; font-size:22px; font-weight:700; border-radius:50%; }
.redeem-icon svg { width:24px; height:24px; }
.redeem-icon.is-done { color:#3f8a69; background:#ecf6f1; }
.redeem-icon.is-failed { color:var(--coral); background:var(--coral-soft); }
.redeem-icon.is-unknown { color:#91612c; background:#fdf6ec; }
.redeem-fine,.redeem-syncing { margin-top:8px; color:#9a95aa; font-size:12px; text-align:center; }
#modal .redeem-result + .full-width,#modal .full-width + .full-width { margin-top:9px; }
@media (prefers-reduced-motion:reduce) { .assets-spinner,.assets-skeleton { animation:none; } }

/* Trade dialogs use one spacing rhythm for the heading, content and actions. */
dialog.trade-modal{width:460px}
.modal-body.trade-dialog{padding:24px}
.trade-dialog>.modal-heading{position:relative;align-items:flex-start;min-height:28px;margin:0 0 16px;padding-right:36px}
.trade-dialog>.modal-heading h2{font-size:20px;line-height:1.4;letter-spacing:-.015em}
.trade-dialog>.modal-heading .close-button{position:absolute;top:-8px;right:-10px;width:44px;height:44px;min-width:44px;line-height:1}
.trade-dialog-content{display:grid;gap:12px;min-width:0}
.trade-dialog-content>p,.trade-dialog-content>.credit-buy-flow{margin:0}
.trade-dialog-content>.warning-line:empty,.trade-dialog-content>.modal-error:empty,.trade-dialog-content>.transaction-message:empty{display:none}
.trade-dialog-content>p{color:var(--muted);font-size:14px;line-height:1.6}
.trade-dialog-content .credit-buy-issue{gap:16px}
.trade-dialog-content .credit-buy-issue-status{gap:10px}
.trade-dialog-content .credit-buy-issue-icon{width:28px;height:28px}
.trade-dialog-content .credit-buy-issue-icon svg{width:16px;height:16px}
.trade-dialog-content .credit-buy-issue-status p{color:var(--muted);line-height:1.6}
.trade-dialog-actions{display:grid;gap:8px;margin-top:24px}
.trade-dialog-actions:has(>.text-button:only-child){margin-top:12px}
.modal-body.trade-dialog .trade-dialog-actions>button{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin:0;padding:10px 16px;font-size:14px;line-height:22px}
.trade-dialog-actions>.text-button{border-radius:8px}
.trade-dialog-actions>.text-button:hover{background:var(--blue-soft)}
.trade-dialog-details{margin-top:16px}
.trade-dialog-details>.trade-transaction-details{margin:0}
.trade-dialog .credit-buy-syncing{margin:0}
.trade-dialog-content>.modal-error:not(:empty),.trade-dialog-content>.transaction-message:not(:empty){margin:0;padding:0;font-size:13px;line-height:1.6}
@media(max-width:650px){.modal-body.trade-dialog{padding:20px}}
