/* A substantial exchange console with two asset blocks and a shared action bar. */
.hero{min-height:760px;height:100svh;overflow:clip}
.hero-inner{width:min(calc(100% - 88px),1120px);padding:130px 0 88px}


.hero h1{font-size:clamp(21px,2.7vw,37px);font-weight:500;letter-spacing:-.055em;line-height:1.22;color:#233f4f}


.exchange{max-width:none;width:100%;margin:30px auto 0;padding:27px;border:1px solid rgba(156,182,197,.75);border-radius:20px;background:rgba(249,252,254,.88);box-shadow:0 24px 65px -24px rgba(42,77,98,.23),0 2px 7px rgba(58,93,113,.04),inset 0 1px 0 #fff;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.exchange-top{padding:0 2px;margin:0 0 23px;border:0}
.exchange-title{font-size:15px;font-weight:550;color:#304c5c;letter-spacing:-.025em}

.amounts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;position:relative;align-items:stretch}
.amount-panel,.amount-panel.receive{position:relative;margin:0;padding:12px 20px;border:1px solid #d6e1e7;border-radius:12px;background:rgba(255,255,255,.86);box-shadow:inset 0 1px 0 #fff;min-width:0;transition:border-color .2s,background .2s,box-shadow .2s}
.amount-panel.receive{background:linear-gradient(125deg,rgba(231,241,247,.9),rgba(241,247,251,.9));border-color:#cbdce6}
.amount-panel:focus-within{border-color:#88aabe;background:rgba(255,255,255,.98);box-shadow:0 0 0 3px rgba(125,166,191,.09)}
.amount-panel.receive:focus-within{background:#edf5fa}
.amount-panel.invalid{border-color:#b88575}
.field-top{margin:0 0 9px;min-height:17px;gap:12px;flex-direction:row}
.field-label{font-size:11px;font-weight:450;color:#7f96a3;letter-spacing:-.01em;flex-shrink:0}
.coin-trigger{font-size:23px;font-weight:550;gap:12px;padding:9px 13px 9px 10px;min-width:178px;min-height:58px;background:linear-gradient(145deg,#fff,#edf5fa);color:#2b4b5e;border:1px solid #b4cbd9;border-radius:10px;letter-spacing:-.035em;box-shadow:0 3px 8px rgba(40,72,91,.065),inset 0 1px 0 #fff}
.coin-trigger:hover,.coin-trigger[aria-expanded="true"]{background:linear-gradient(145deg,#fff,#e4f0f7);border-color:#7fa6be;box-shadow:0 4px 12px rgba(40,72,91,.1),0 0 0 3px rgba(121,164,190,.07)}
.coin-trigger .coin-icon{width:36px;height:36px;filter:saturate(.9)}
.coin-identity{display:flex;flex-direction:column;align-items:flex-start;gap:3px;line-height:1.05;flex:1}
.coin-name{font-size:10px;font-weight:400;letter-spacing:0;color:#7b95a4}
.coin-trigger .chevron{width:17px;height:17px;margin-left:14px;color:#6d91a7}
.amount-line{display:flex;align-items:center;gap:16px}.amount-line .amount-input{flex:1;min-width:0}
.hero .amount-input{font-size:clamp(32px,4.7vw,min(var(--display-size,110px),54px));font-weight:450;line-height:1.12;letter-spacing:-.07em;color:#203b4a;border-radius:0;caret-color:#4f7d95}
.hero .receive .amount-input{color:#4d7287}
.asset-meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:8px;padding-top:8px;border-top:1px solid rgba(178,199,211,.35)}
.fiat-value{font-size:12px;color:#738d9c;margin:0;min-height:19px;letter-spacing:-.015em}
.network{font-size:10px;color:#8ca2ae;line-height:1.6}
.swap{position:absolute;top:51%;left:50%;transform:translate(-50%,-50%);align-self:auto;justify-self:auto;margin:0;width:42px;height:42px;border-radius:11px;background:#f9fcfd;border:1px solid #bacfdc;box-shadow:0 3px 8px rgba(41,77,99,.09),0 0 0 5px #f7fafc;color:#65889c;z-index:2}
.swap svg{width:18px;height:18px}
.swap:hover{transform:translate(-50%,-50%) scale(1.07);background:#fff}
.exchange-bottom{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 26px;margin-top:23px;padding:21px 2px 0;border-top:1px solid #dbe5eb}
.quote-details{display:flex;flex-direction:column;gap:7px;margin:0;font-size:12px;line-height:1.65}
.rate{color:#4c6f83}
.minimum{text-align:left;font-size:10px;color:#8a9fa9;line-height:1.7}
.minimum strong{font-weight:450;color:#5e7b8b;margin-left:5px}
.hero-buttons{margin:0;justify-content:flex-end}
.hero-buttons .hero-explore{width:auto;min-width:300px;height:59px;padding-left:22px;padding-right:12px;gap:42px;border-radius:11px;font-size:13px;justify-content:space-between}
.exchange-note{grid-column:1/-1;margin:16px 0 0;text-align:left;font-size:11px}
.coin-menu{left:auto;right:0;width:280px;top:calc(100% + 10px)}
.page-footer{bottom:27px}
@media(min-width:1500px){.hero-inner{width:min(calc(100% - 112px),1120px)}.hero h1{font-size:37px}}
@media(max-height:830px) and (min-width:761px){
  .hero{min-height:690px}.hero-inner{padding:113px 0 78px}.hero h1{font-size:clamp(21px,2.7vw,37px)}
  .exchange{margin-top:26px;padding:24px}.exchange-top{margin-bottom:20px}
  .field-top{margin-bottom:7px}.amount-panel,.amount-panel.receive{padding:12px 20px}
  .exchange-bottom{margin-top:20px;padding-top:18px}
}
@media(min-width:761px) and (max-width:1000px){
  .hero-inner{width:calc(100% - 56px)}.exchange{padding:21px}.amounts{gap:14px}
  .amount-panel,.amount-panel.receive{padding:15px 17px}.hero .amount-input{font-size:clamp(30px,4.6vw,min(var(--display-size,110px),58px))}
  .asset-meta{gap:5px;flex-direction:column;margin-top:10px;padding-top:10px}
  .hero-buttons .hero-explore{min-width:255px;font-size:12px}.exchange-bottom{gap:0 16px}.minimum{font-size:9px}
}
@media(max-width:760px){
  .hero{height:auto;min-height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:clip}
  .hero-inner{width:min(calc(100% - 28px),540px);padding:104px 0 28px}
  .hero h1{white-space:normal;font-size:clamp(25px,5.5vw,33px);line-height:1.18;letter-spacing:-.05em;text-wrap:balance;padding:0 7px}
  .exchange{margin-top:24px;padding:17px;border-radius:16px}.exchange-top{margin:0 0 16px;padding:0 2px}.exchange-title{font-size:13px}
  .amounts{grid-template-columns:1fr;gap:12px}.amount-panel,.amount-panel.receive{padding:13px 14px;border-radius:10px;margin:0}
  .field-top{margin:0 0 8px;min-height:16px}.field-label{font-size:10px}
  .amount-line{gap:10px}.coin-trigger{font-size:17px;min-width:122px;min-height:47px;padding:7px 8px;gap:7px}.coin-trigger .coin-icon{width:25px;height:25px}.coin-name{font-size:9px}.coin-trigger .chevron{width:14px;height:14px;margin-left:8px}
  .hero .amount-input{font-size:clamp(29px,9.5vw,min(var(--display-size,110px),46px));line-height:1.1}
  .asset-meta{margin-top:9px;padding-top:9px;gap:8px}.fiat-value{font-size:10px}.network{font-size:8px}
  .swap{top:50%;transform:translate(-50%,-50%) rotate(90deg);width:30px;height:30px;border-radius:8px;box-shadow:0 0 0 4px #f7fafc}
  .swap:hover{transform:translate(-50%,-50%) rotate(90deg) scale(1.07)}.swap svg{width:14px;height:14px}
  .exchange-bottom{grid-template-columns:1fr;gap:17px;margin-top:17px;padding:15px 1px 0}
  .quote-details{gap:5px;font-size:10px}.minimum{text-align:left;font-size:9px}.minimum strong{margin-left:3px}
  .hero-buttons{margin:0}.hero-buttons .hero-explore{width:100%;min-width:0;height:53px;font-size:12px;padding-left:17px}
  .exchange-note{margin:0;font-size:10px}.coin-menu{width:min(260px,calc(100vw - 100px))}
  .page-footer{position:relative;bottom:auto;left:auto;transform:none;width:calc(100% - 40px);padding:10px 0 20px;margin-top:auto;font-size:9px}
}

/* One heading, one typeface, one line across screen sizes. */
.hero h1{font-family:inherit;font-size:clamp(17px,2.55vw,34px);font-style:normal;font-weight:500;line-height:1.3;letter-spacing:-.045em;white-space:nowrap;text-wrap:nowrap;padding:0;color:#233f4f}
@media(max-width:760px){.hero h1{font-size:clamp(10px,2.75vw,20px);letter-spacing:-.04em;white-space:nowrap;text-wrap:nowrap}}

.asset-column{min-width:0}
.field-top{margin:0 0 13px;padding:0 2px;min-height:23px}
.field-label{font-size:17px;font-weight:550;letter-spacing:-.025em;color:#304f61}
.swap{top:calc(50% + 18px)}
.exchange-bottom{margin-top:20px;padding:0;border:0;gap:0 16px}
.recipient-field{display:flex;align-items:center;gap:12px;min-width:0;height:59px;padding:0 17px;border:1px solid #cbdce6;border-radius:11px;background:rgba(255,255,255,.8);box-shadow:inset 0 1px 0 #fff;transition:border-color .2s,box-shadow .2s}
.recipient-field:focus-within{border-color:#88aabe;box-shadow:0 0 0 3px rgba(125,166,191,.09)}
.recipient-field svg{width:21px;height:21px;flex:none;color:#7b98aa}
.recipient-field input{width:100%;min-width:0;border:0;outline:0;background:transparent;font-size:13px;color:#304f61;letter-spacing:-.015em}
.recipient-field input::placeholder{color:#90a4af}
.recipient-field input:focus-visible{outline:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.quote-details{grid-column:1/-1;flex-direction:row;justify-content:space-between;gap:16px;margin-top:17px;padding-top:14px;border-top:1px solid #dbe5eb;font-size:11px}
@media(max-height:830px) and (min-width:761px){.field-top{margin-bottom:12px}.exchange-bottom{padding:0;margin-top:18px}}
@media(max-width:760px){
  .field-top{margin:0 0 9px;min-height:20px}.field-label{font-size:15px}
  .swap{top:calc(50% + 14px)}
  .exchange-bottom{grid-template-columns:1fr;gap:12px;margin-top:17px;padding:0}
  .recipient-field{height:53px;padding:0 12px;gap:9px}.recipient-field input{font-size:11px}.recipient-field svg{width:17px;height:17px}
  .quote-details{flex-direction:column;gap:5px;margin-top:1px;padding-top:12px;font-size:10px}
}

.amount-panel,.amount-panel.receive{min-height:160px;padding-block:24px;display:flex;flex-direction:column;justify-content:center}
@media(max-width:760px){.amount-panel,.amount-panel.receive{min-height:140px;padding-block:20px}}

/* Polished blue metal: a diffuse reflection with a fine specular core. */
.hero-buttons .hero-explore{
  background:radial-gradient(ellipse at 18% -35%,rgba(175,221,242,.22),transparent 58%),linear-gradient(168deg,#395d73 0%,#28495f 32%,#1b354a 65%,#294a60 100%);
  border-color:rgba(132,182,210,.7);
  box-shadow:0 2px 3px rgba(13,36,52,.12),0 9px 22px -5px rgba(24,54,76,.33),0 1px 0 rgba(255,255,255,.65),inset 0 1px 0 rgba(225,246,255,.38),inset 0 -1px 0 rgba(9,28,42,.45);
}
.hero-explore::before{
  inset:-10px -2px;
  background:linear-gradient(112deg,transparent 17%,rgba(187,225,244,.015) 27%,rgba(207,236,250,.07) 37%,rgba(224,245,255,.16) 45%,rgba(246,252,255,.33) 49.5%,rgba(228,245,255,.21) 52%,rgba(205,232,248,.09) 59%,rgba(191,224,243,.025) 69%,transparent 82%),linear-gradient(112deg,transparent 41%,rgba(221,242,255,.09) 48%,rgba(246,253,255,.2) 50%,transparent 53%);
  filter:blur(1.4px);
  animation:metalReflection 9.6s cubic-bezier(.42,0,.2,1) infinite;
  will-change:transform,opacity;
}
.hero-explore::after{
  background:linear-gradient(180deg,rgba(226,245,255,.075),transparent 40%,rgba(6,20,32,.09)),radial-gradient(ellipse at 8% 0%,rgba(150,212,243,.16),transparent 65%);
  opacity:.8;
}
.button-rim{
  position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;padding:1px;
  background:linear-gradient(110deg,transparent 24%,rgba(193,226,244,.1) 38%,rgba(245,253,255,.8) 49%,rgba(214,239,253,.32) 54%,transparent 72%);
  background-size:260% 100%;background-position:170% 0;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:metalEdge 9.6s cubic-bezier(.42,0,.2,1) infinite;
}
.hero-explore .explore-arrow{
  background:linear-gradient(145deg,rgba(216,241,255,.12),rgba(165,210,238,.035));
  border-color:rgba(201,232,251,.21);
  box-shadow:inset 0 1px 0 rgba(244,251,255,.12),0 1px 3px rgba(8,27,42,.12);
}
.hero-explore:hover .explore-arrow{transform:none;background:rgba(219,241,255,.17)}
@keyframes metalReflection{
  0%,17%{transform:translate3d(-135%,0,0);opacity:0}
  25%{opacity:.7}
  44%{opacity:1}
  67%{opacity:.75}
  77%,100%{transform:translate3d(135%,0,0);opacity:0}
}
@keyframes metalEdge{
  0%,20%{background-position:170% 0;opacity:0}
  31%{opacity:.4}
  47%{opacity:.9}
  64%{opacity:.35}
  77%,100%{background-position:-70% 0;opacity:0}
}

.hero-inner{top:-58px}
@media(max-width:760px){.hero-inner{top:-12px}}

/* Rate mode belongs to the exchange, above the two amount columns. */
.rate-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}
.mode-switch{display:inline-flex;align-items:center;gap:4px;padding:4px;background:rgba(225,236,243,.65);border:1px solid #d1e0e9;border-radius:10px}
.mode-switch button{border:1px solid transparent;border-radius:7px;background:transparent;padding:9px 16px;color:#7d95a3;font-size:12px;font-weight:500;line-height:1.2;letter-spacing:-.015em;transition:color .2s,background .2s,box-shadow .2s}
.mode-switch button[aria-pressed="true"]{color:#315367;border-color:#d5e3eb;background:rgba(255,255,255,.98);box-shadow:0 2px 6px rgba(34,71,94,.07),inset 0 1px 0 #fff}
.mode-switch button:hover{color:#315367}
.quote-controls{display:flex;align-items:center;gap:10px;flex:none}
.quote-status{font-size:10px;color:#849ba9;font-variant-numeric:tabular-nums;white-space:nowrap}
.quote-status.expiring{color:#9b7a5b}
.refresh-quote{width:29px;height:29px;display:grid;place-items:center;border:1px solid #d4e2ea;border-radius:7px;background:rgba(255,255,255,.6);color:#7593a5;transition:background .2s}
.refresh-quote:hover{background:#fff}.refresh-quote svg{width:15px;height:15px}
.refresh-quote.refreshing svg{animation:quoteRefresh 1.4s linear infinite}
.mode-description{margin:0 0 22px;padding:0 2px;color:#8399a6;font-size:10px;line-height:1.6;min-height:16px}
.coin-menu{width:330px;padding:0;overflow:hidden;border-radius:12px;box-shadow:0 14px 40px rgba(36,65,82,.18),inset 0 1px 0 #fff}
.coin-search-wrap{padding:12px 12px 9px;border-bottom:1px solid #e1eaf0;background:#f9fcfe}
.coin-search{display:block;width:100%;padding:10px 12px;border:1px solid #cedfe9;border-radius:7px;background:#fff;color:#36596d;font-size:12px;outline:none}
.coin-search::placeholder{color:#8ca2ae}.coin-search:focus{border-color:#91b2c6}
.coin-count{display:block;margin:8px 2px 0;font-size:9px;color:#93a6b1}
.coin-options{max-height:270px;padding:5px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c2d5e1 transparent}
.coin-option{padding:10px;gap:9px;min-height:53px}.coin-option:focus-visible{box-shadow:inset 0 0 0 1px #97b7ca}
.coin-protocol{max-width:100px;padding:4px 6px;font-size:8px;line-height:1.3;border:1px solid #dae6ed;border-radius:5px;color:#8ba0ad;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coin-option .coin-info small{font-size:10px}.coin-option .coin-check{width:13px;height:13px;flex:none}
.coin-empty{padding:16px 12px;font-size:11px;color:#8aa0ad;line-height:1.7;margin:0}
.coin-trigger:disabled{cursor:wait}.swap:disabled{opacity:.4;cursor:default}
.amount-panel.calculating .amount-input{opacity:.45}
.exchange-note{line-height:1.65}
@keyframes quoteRefresh{to{transform:rotate(360deg)}}
@media(max-width:760px){
  .rate-toolbar{gap:8px;flex-wrap:wrap;margin-bottom:9px}.mode-switch{padding:3px;gap:2px}
  .mode-switch button{font-size:10px;padding:8px 10px}.quote-status{font-size:9px}
  .quote-controls{gap:6px}.refresh-quote{width:26px;height:26px}
  .mode-description{font-size:9px;margin-bottom:18px;min-height:29px}
  .coin-menu{width:min(330px,calc(100vw - 84px))}.coin-options{max-height:235px}
  .coin-protocol{max-width:65px;font-size:7px;padding:3px 4px}.coin-option{padding:9px 7px;gap:7px}
  .coin-option .coin-icon{width:25px;height:25px}.coin-info{font-size:11px}
}

/* Keep the heading clear of navigation as the rate controls add a row. */
@media(min-width:761px){
  .hero{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;height:auto;min-height:max(730px,100svh)}
  .hero-inner{top:0;padding:clamp(118px,15svh,160px) 0 76px;flex-shrink:0}
}

/* Compact controls; the explanation stays beside the rate selector. */
.rate-toolbar{gap:18px;margin-bottom:24px;justify-content:flex-start}
.rate-toolbar .quote-controls{margin-left:auto}
.mode-switch{flex:none}
.mode-description{flex:1;max-width:330px;margin:0;padding:0;font-size:10px;line-height:1.65;min-height:0;text-align:left}
.header-note{max-width:650px;font-size:10px;line-height:1.7;text-align:center;text-wrap:balance;padding:0 30px}
.recipient-control{min-width:0;position:relative;align-self:start}
.address-status{display:block;max-width:100%;padding:0;margin:8px 2px 0;border:0;background:transparent;text-align:left;font-size:10px;line-height:1.5;color:#7e96a4;cursor:default}
.address-status[data-state="valid"]{color:#618c80}.address-status[data-state="invalid"]{color:#aa7165}
.address-status[data-state="unavailable"]{cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.recipient-field[data-state="invalid"]{border-color:#c39688}.recipient-field[data-state="valid"]{border-color:#9ebeb6}
.exchange-bottom{align-items:start}

/* One focused asset library in the top layer, clear of the exchange layout. */
.coin-menu.coin-modal{position:fixed;inset:0;margin:auto;width:min(460px,calc(100vw - 32px));height:min(570px,calc(100dvh - 64px));max-width:none;max-height:none;box-sizing:border-box;padding:0;border:1px solid rgba(179,202,216,.85);border-radius:22px;background:linear-gradient(145deg,#f9fcfe,#edf4f8);box-shadow:0 32px 100px -20px rgba(20,47,66,.32),inset 0 1px 0 #fff;overflow:hidden;color:#304f61;backdrop-filter:none}
.coin-modal[open]{display:flex;flex-direction:column}
.coin-modal::backdrop{background:rgba(34,58,74,.2);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);animation:pickerBackdropIn .24s ease-out both}
.coin-modal.closing::backdrop{animation:pickerBackdropOut .17s ease-in both}
.coin-modal-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 24px 10px;flex:none}
.coin-modal h2{font-family:inherit;line-height:1.3;font-size:20px;font-weight:500;letter-spacing:-.04em;margin:0}
.modal-close{display:grid;place-items:center;flex:none;width:31px;height:31px;border:1px solid #d7e4eb;border-radius:50%;background:rgba(255,255,255,.7);font:300 22px/1 sans-serif;color:#7893a3;transition:background .2s,transform .2s}
.modal-close:hover{background:#fff;transform:scale(1.05)}
.coin-modal .coin-search-wrap{padding:8px 24px 13px;background:transparent;flex:none}
.coin-modal .coin-search{font-size:13px;padding:13px 15px;border-radius:11px;background:rgba(255,255,255,.85);box-shadow:0 3px 12px rgba(40,72,91,.03)}
.coin-modal .coin-count{font-size:10px;margin-top:10px;color:#8ba1af}
.coin-modal .coin-options{max-height:none;min-height:0;flex:1;padding:8px 12px 14px;scroll-padding:8px;overflow-y:auto}
.coin-modal .coin-option{width:100%;border:1px solid transparent;border-radius:11px;padding:11px 12px;min-height:62px;gap:12px;background:transparent;transition:background .14s,border-color .14s}
.coin-modal .coin-option:hover,.coin-modal .coin-option:focus-visible{background:rgba(255,255,255,.85);border-color:#d8e5ec;outline:0;box-shadow:none}
.coin-modal .coin-option[aria-selected="true"]{background:#e4eef5;border-color:#cadde8}
.coin-modal .coin-icon{width:32px;height:32px;flex:none}
.coin-modal .coin-info{font-size:14px;gap:4px;min-width:0}.coin-modal .coin-info small{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coin-modal .coin-protocol{max-width:125px;font-size:9px;background:#f5f9fc;color:#7893a4}
.coin-modal .coin-check{margin-left:0;width:15px;height:15px}
.coin-modal .coin-empty{padding:26px 14px;font-size:12px}
@keyframes pickerBackdropIn{from{background:rgba(34,58,74,0);backdrop-filter:blur(0)}to{background:rgba(34,58,74,.2);backdrop-filter:blur(7px)}}
@keyframes pickerBackdropOut{from{background:rgba(34,58,74,.2);backdrop-filter:blur(7px)}to{background:rgba(34,58,74,0);backdrop-filter:blur(0)}}

/* Native popover: automatic outside dismissal, styled for more languages. */
.language-switch{padding:0;border:0;background:none;flex:none}
.language-switch .language-trigger{display:flex;align-items:center;gap:9px;min-height:36px;padding:9px 11px;border:1px solid rgba(171,196,212,.75);border-radius:10px;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(227,239,247,.75));color:#52778e;font-size:10px;letter-spacing:.04em;box-shadow:inset 0 1px 0 #fff,0 3px 10px rgba(41,77,99,.04);anchor-name:--language-anchor}
.language-trigger svg{width:16px;height:16px}.language-trigger .chevron{width:12px;height:12px;transition:transform .2s}.language-trigger[aria-expanded="true"] .chevron{transform:rotate(180deg)}
.language-menu{position:fixed;inset:auto 32px auto auto;top:75px;margin:0;width:210px;max-height:min(360px,70dvh);padding:6px;overflow-y:auto;border:1px solid #cbdde7;border-radius:14px;background:rgba(248,252,254,.98);color:#395b70;box-shadow:0 14px 45px rgba(29,64,86,.15),inset 0 1px 0 #fff;opacity:0;transform:translateY(-5px) scale(.98);transform-origin:top right;transition:opacity .18s ease,transform .22s cubic-bezier(.22,1,.36,1),display .22s allow-discrete,overlay .22s allow-discrete}
@supports(position-anchor:--language-anchor){.language-menu{position-anchor:--language-anchor;inset:auto;top:anchor(bottom);right:anchor(right);margin-top:9px}}
.language-menu:popover-open{opacity:1;transform:translateY(0) scale(1)}
@starting-style{.language-menu:popover-open{opacity:0;transform:translateY(-5px) scale(.98)}}
.language-menu button{display:flex;align-items:center;gap:13px;width:100%;padding:12px;border:1px solid transparent;border-radius:9px;background:transparent;color:#547387;font-size:12px;text-align:left;transition:background .15s}
.language-menu button:hover,.language-menu button:focus-visible{background:#edf4f9}.language-menu button[aria-checked="true"]{background:#e5f0f7;border-color:#d7e6ef;color:#30566e}
.language-menu small{margin-left:auto;font-size:9px;color:#90a5b1}.language-check{opacity:0;width:12px;color:#5f8ba4}.language-menu [aria-checked="true"] .language-check{opacity:1}
@media(max-width:1050px){.header-note{max-width:540px;padding:0 20px;font-size:9px}.rate-toolbar{gap:12px}.mode-switch button{padding-inline:10px}.mode-description{font-size:9px}.quote-controls{gap:6px}.quote-status{font-size:9px}}
@media(max-width:760px){
  .header-note{display:none}.rate-toolbar{display:grid;grid-template-columns:auto 1fr;gap:10px 12px;margin-bottom:20px;align-items:center}
  .mode-switch{justify-self:start}.mode-description{grid-column:2;grid-row:1;font-size:8px;line-height:1.6;max-width:none}.mode-switch button{font-size:9px;padding:8px}
  .quote-controls{grid-column:1/-1;justify-content:flex-end}.recipient-control{width:100%}.address-status{font-size:9px}
  .coin-menu.coin-modal{width:calc(100vw - 24px);height:min(570px,calc(100dvh - 32px));border-radius:18px}
  .coin-modal-heading{padding:20px 20px 8px}.coin-modal h2{font-size:18px}.coin-modal .coin-search-wrap{padding:8px 20px 12px}
  .coin-modal .coin-protocol{max-width:95px;font-size:8px}.coin-modal .coin-options{padding-inline:8px}
}

/* Asset explorer: stable frame, independent coin and network columns. */
html{scrollbar-gutter:stable}
html.asset-picker-open{overflow:hidden;overscroll-behavior:none}
.asset-picker-open .hero-fallback,.asset-picker-open .hero-fallback::before,.asset-picker-open .hero-fallback::after,.asset-picker-open .hero-explore::before,.asset-picker-open .button-rim{animation-play-state:paused}
.coin-menu.coin-modal{width:min(800px,calc(100vw - 48px));height:min(610px,calc(100svh - 64px));border-radius:24px;background:#f6fafc;contain:layout;isolation:isolate}
.coin-modal-heading{padding:25px 28px 14px}
.coin-modal h2{font-size:23px;letter-spacing:-.04em;color:#294b60}
.coin-modal .coin-search-wrap{padding:0 28px 22px;border-bottom:0}
.coin-modal .coin-search{padding:14px 16px;font-size:13px;background:#fff;border-color:#d2e1ea;box-shadow:0 2px 5px rgba(37,74,98,.025)}
.coin-modal .coin-search:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(116,158,187,.11);border-color:#92b2c8}
.asset-browser{display:grid;grid-template-columns:1fr 1fr;flex:1;min-height:0;border-top:1px solid #dce7ed;overflow:hidden}
.asset-library,.network-library{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.network-library{border-left:1px solid #d8e5ed;background:linear-gradient(135deg,#edf4f9,#f3f8fb)}
.picker-section-label{height:48px;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 25px;color:#7a96a8;font-size:11px;font-weight:500;letter-spacing:.01em;white-space:nowrap}
.picker-count{font-size:10px;font-variant-numeric:tabular-nums;font-weight:400;color:#93a9b7}
.asset-options,.network-options{flex:1;min-height:0;padding:0 12px 14px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;overflow-anchor:none;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#c6d8e3 transparent;scroll-behavior:auto;contain:layout paint}
.asset-option,.network-option{display:flex;align-items:center;gap:13px;width:100%;min-width:0;min-height:66px;padding:11px 13px;flex-shrink:0;border:1px solid transparent;border-radius:12px;background:transparent;text-align:left;color:#3e6178;cursor:pointer;transition:background .15s,border-color .15s;touch-action:pan-y}
.asset-option+.asset-option,.network-option+.network-option{margin-top:3px}
.asset-option:hover{background:#edf4f8}.asset-option[aria-selected="true"]{border-color:#cbdfeC;background:#e8f1f7;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.asset-option .coin-info{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px;font-size:15px;line-height:1.25;font-weight:550}
.asset-option .coin-info small{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#88a0b0;font-size:11px;font-weight:400}
.asset-option .coin-icon{display:block;width:34px;height:34px;min-width:34px;object-fit:contain}
.picker-indicator{width:17px;height:17px;flex:none;margin-left:auto;color:#7598af}
.asset-option .picker-indicator{opacity:0;transition:opacity .15s}.asset-option[aria-selected="true"] .picker-indicator{opacity:1}
.network-option{min-height:72px;gap:12px;border-color:#d6e5ee;background:rgba(255,255,255,.65)}
.network-option:hover{border-color:#a9c6d9;background:#fff}
.network-option[aria-selected="true"]{border-color:#95b6cd;background:#fff;box-shadow:0 3px 10px rgba(46,83,108,.045)}
.network-mark{width:39px;height:39px;display:grid;place-items:center;flex:none;border:1px solid #cfdfeb;border-radius:11px;background:linear-gradient(145deg,#fff,#e6f0f7);color:#678da6;font-size:8px;font-weight:600;letter-spacing:-.02em}
.network-info{display:flex;flex:1;flex-direction:column;gap:5px;min-width:0;font-size:13px;line-height:1.3;font-weight:500}
.network-info>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.network-info small{font-size:10px;font-weight:400;color:#89a2b3}
.asset-option:focus-visible,.network-option:focus-visible{outline:2px solid #84abc4;outline-offset:-2px}
.picker-empty{padding:18px 13px;font-size:12px;line-height:1.7;color:#859dac;margin:0}
@media(max-width:760px){
  .coin-menu.coin-modal{width:calc(100vw - 24px);height:min(610px,calc(100svh - 32px));border-radius:19px}
  .coin-modal-heading{padding:20px 20px 14px}.coin-modal h2{font-size:19px}
  .coin-modal .coin-search-wrap{padding:0 20px 18px}.coin-modal .coin-search{font-size:12px;padding:13px}
  .asset-browser{grid-template-columns:46% 54%}.picker-section-label{padding:0 14px;height:42px;min-height:42px;font-size:10px;gap:5px}
  .asset-options,.network-options{padding:0 5px 10px;scrollbar-width:none;scrollbar-gutter:auto}
  .asset-option,.network-option{padding:10px 8px;gap:8px;min-height:64px;border-radius:10px}
  .asset-option .coin-icon{width:26px;height:26px;min-width:26px}.asset-option .coin-info{font-size:12px;gap:4px}.asset-option .coin-info small{font-size:9px}
  .asset-option .picker-indicator{display:none}.network-option .picker-indicator{width:12px;height:12px}
  .network-mark{display:none}.network-info{font-size:11px;gap:4px}.network-info small{font-size:9px}
  .picker-empty{font-size:10px;padding:14px 8px}
}

/* Use the static light field while the GPU animation rests behind the dialog. */
.asset-picker-open .hero.has-webgl .hero-canvas{opacity:0;transition:none}

/* The second column shows the selected asset on each available network. */
.coin-modal .coin-search-wrap{padding-bottom:12px}
.picker-tabs{display:flex;align-items:stretch;gap:25px;padding:0 28px;min-height:43px;flex:none}
.picker-tabs button{position:relative;display:flex;align-items:center;justify-content:center;padding:0 1px 13px;background:transparent;border:0;line-height:1.2;font-family:inherit;font-size:12px;font-weight:500;color:#8ba1b0;transition:color .18s}
.picker-tabs button::after{position:absolute;content:"";left:0;right:0;bottom:0;height:2px;border-radius:2px;background:#638ba5;transform:scaleX(0);opacity:0;transition:transform .2s,opacity .2s}
.picker-tabs button:hover{color:#4d738d}.picker-tabs button[aria-selected="true"]{color:#365b74}
.picker-tabs button[aria-selected="true"]::after{transform:scaleX(1);opacity:1}
.network-selection-heading{justify-content:flex-start;gap:11px;min-height:76px;height:76px;white-space:normal}
.network-selection-heading>.coin-icon{width:32px;height:32px;flex:none}
.network-heading-info{display:flex;flex-direction:column;gap:5px;min-width:0}
.network-heading-info strong{font-size:15px;font-weight:550;line-height:1;color:#3e647c;letter-spacing:-.025em}
.network-heading-info>span{font-size:10px;color:#8aa1b0;font-weight:400}
.network-option{height:77px;min-height:77px;gap:14px}
.network-asset-icon{position:relative;display:block;width:36px;height:36px;flex:none;margin-right:2px}
.network-asset-icon>.coin-icon{display:block;width:34px;height:34px;object-fit:contain}
.network-asset-icon>.network-logo{position:absolute;bottom:-3px;right:-5px;display:block;box-sizing:content-box;width:17px;height:17px;border:2px solid #f8fbfd;border-radius:50%;background:#fff;object-fit:contain;box-shadow:0 1px 3px rgba(42,78,101,.13)}
.network-info{gap:5px;font-size:13px}.network-info>span{white-space:normal;overflow-wrap:anywhere;line-height:1.3}
.network-info small{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:760px){
  .coin-modal .coin-search-wrap{padding-bottom:10px}.picker-tabs{padding:0 20px;gap:19px;min-height:41px}.picker-tabs button{font-size:11px;padding-bottom:12px}
  .network-selection-heading{min-height:68px;height:68px;gap:8px;padding:0 12px}.network-selection-heading>.coin-icon{width:26px;height:26px}
  .network-heading-info strong{font-size:12px}.network-heading-info>span{font-size:9px}.network-heading-info{gap:4px}
  .network-option{height:79px;min-height:79px;gap:8px;padding:10px 8px}.network-asset-icon{width:28px;height:28px;margin-right:2px}
  .network-asset-icon>.coin-icon{width:27px;height:27px}.network-asset-icon>.network-logo{width:13px;height:13px;border-width:2px;bottom:-3px;right:-4px}
  .network-info{font-size:10px;gap:4px}.network-info small{font-size:8px}.network-option .picker-indicator{width:11px;height:11px}
}

.quote-status.error{color:#aa7766}
.exchange-note{grid-column:1/-1}

/* PATHOS wordmark: compact geometric lettering, independent of body type. */
.wordmark{font-family:'Space Grotesk','DM Sans',sans-serif;font-size:25px;font-weight:600;letter-spacing:-.065em;line-height:1}
.wordmark .cash{font-family:inherit;font-weight:500;letter-spacing:-.06em;color:#6c8a9c}
.rate-toolbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px}
.mode-description{max-width:none;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px}
.quote-controls{gap:8px}.quote-controls .quote-status{font-size:9px}.quote-countdown{width:27px;text-align:right;font-size:10px;font-variant-numeric:tabular-nums;color:#6b8c9f;white-space:nowrap}
.refresh-quote{position:relative;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.65);color:#7196ac;box-shadow:inset 0 0 0 1px #d9e6ee}
.refresh-quote .refresh-ring{position:absolute;inset:-2px;width:40px;height:40px;transform:rotate(-90deg);fill:none;stroke-width:1.3;pointer-events:none}
.refresh-ring .refresh-track{stroke:#e0eaf0}.refresh-ring #quoteProgress{stroke:#82a6bf;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .12s linear}
.refresh-quote .refresh-core{width:15px;height:15px}.refresh-quote.refreshing .refresh-ring{animation:none}
.refresh-quote:disabled{cursor:default;opacity:.8}
.send-network-details{display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:0}
.send-network-details .minimum{display:inline-flex;align-items:center;gap:5px;max-width:100%;font-size:9px;line-height:1.4;padding:4px 7px;border:1px solid #dce7ee;border-radius:6px;background:#f5f9fc;color:#8a9eaa;text-align:right;transition:background .18s,border-color .18s}
.send-network-details .minimum strong{margin:0;color:#65879d;font-size:9px;font-weight:500;overflow-wrap:anywhere}
.send-network-details .minimum svg{width:11px;height:11px;flex:none;color:#7d9db1}
.send-network-details .minimum:hover{background:#eaf3f9;border-color:#bcd2e1}.send-network-details .minimum:hover strong{text-decoration:none}
.quote-details{justify-content:flex-start;margin-top:14px;padding-top:12px}

.asset-browser[data-view="popular"]{display:flex;background:linear-gradient(135deg,#f7fbfd,#eef5f9)}
.popular-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:10px;flex:1;min-height:0;padding:20px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;overflow-anchor:none;scrollbar-gutter:stable;contain:layout paint}
.popular-option{display:flex;align-items:center;gap:13px;min-width:0;height:76px;padding:13px 14px;border:1px solid #d8e5ee;border-radius:12px;background:rgba(255,255,255,.75);color:#3e647c;text-align:left;transition:background .16s,border-color .16s,box-shadow .16s}
.popular-option:hover{background:#fff;border-color:#a8c5d8;box-shadow:0 3px 12px rgba(50,91,118,.04)}
.popular-option[aria-selected="true"]{background:#e5f0f8;border-color:#a8c4d8}.popular-option:focus-visible{outline:2px solid #84abc4;outline-offset:-2px}
.popular-info{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1;line-height:1.2}.popular-info strong{font-size:14px;letter-spacing:-.02em;font-weight:550}.popular-info small{color:#8aa2b3;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.popular-option .picker-indicator{width:14px;height:14px;color:#7fa0b6;opacity:0}.popular-option[aria-selected="true"] .picker-indicator{opacity:1}
/* Quiet, rounded scroll thumbs with a stable gutter. */
.asset-options,.network-options,.popular-options,.language-menu{scrollbar-width:thin;scrollbar-color:#b3c7d5 transparent}
::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{border:1px solid transparent;border-radius:20px;background:#b3c7d5;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background-color:#8fadc1}
@media(max-width:1050px){
  .rate-toolbar{grid-template-columns:auto 1fr;gap:10px 18px}.rate-toolbar .quote-controls{grid-column:2;grid-row:1;justify-self:end}
  .mode-description{grid-row:2;grid-column:1/-1;font-size:10px}
}
@media(max-width:760px){
  .wordmark{font-size:22px;letter-spacing:-.065em}
  .rate-toolbar{gap:10px 8px}.rate-toolbar .quote-controls{gap:7px}
  .quote-controls .quote-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .refresh-quote{width:29px;height:29px}.refresh-quote .refresh-ring{width:33px;height:33px}.refresh-quote .refresh-core{width:13px;height:13px}.quote-countdown{font-size:9px;width:24px}
  .mode-description{font-size:9px;line-height:1.5;min-height:0}
  .asset-meta{flex-direction:row;gap:8px;align-items:flex-start}.send-network-details{gap:5px;max-width:75%}
  .send-network-details .minimum{font-size:8px;gap:4px;padding:4px 5px}.send-network-details .minimum strong{font-size:8px}.send-network-details .minimum svg{width:9px;height:9px}
  .popular-options{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px 9px;gap:8px}
  .popular-option{height:72px;padding:10px 8px;gap:8px;border-radius:10px}.popular-info{gap:5px}.popular-info strong{font-size:12px}.popular-info small{font-size:9px}
  .popular-option .network-asset-icon{width:27px;height:27px}.popular-option .coin-icon{width:27px;height:27px}.popular-option .picker-indicator{display:none}
  .asset-options,.network-options,.popular-options{scrollbar-width:thin;scrollbar-gutter:stable;scrollbar-color:#b3c7d5 transparent}
}
.fiat-value{white-space:nowrap;flex:none}
.send-network-details .minimum{white-space:nowrap}
@media(max-width:760px){
  .mode-switch button{white-space:nowrap;padding-inline:6px}
  .quote-controls{position:relative}
  .quote-controls .quote-countdown{position:absolute;right:0;top:50%;transform:translateY(-50%);width:29px;height:29px;display:grid;place-items:center;z-index:2;pointer-events:none;font-size:8px}
  .quote-controls .refresh-core{opacity:0}
  .quote-controls:has(.refreshing) .quote-countdown{opacity:0}
  .quote-controls .refreshing .refresh-core{opacity:1}
  .send-network-details{max-width:none;flex:1}.send-network-details .minimum{font-size:8px}
}

/* Responsive finishing: quiet rate tools, networks tied to their asset. */
.hero{max-height:none;min-height:100vh;min-height:100svh}
.coin-picker{display:flex;flex-direction:column;align-items:stretch;gap:7px;max-width:48%;min-width:0}
.coin-picker .network{display:block;max-width:100%;text-align:center;font-size:10px;line-height:1.4;color:#718c9d;overflow-wrap:anywhere}
.coin-trigger{width:100%;min-width:156px}
.coin-identity{gap:0}
.amount-line{align-items:center}
.asset-meta{flex-direction:row;align-items:center;gap:10px;margin-top:10px;padding-top:7px;min-height:30px}
.asset-meta .minimum{display:inline-flex;align-items:center;justify-content:flex-end;gap:5px;min-width:0;min-height:30px;max-width:100%;margin:-5px 0;padding:5px 0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#728d9e;font-size:10px;line-height:1.5;text-align:right;white-space:normal}
.asset-meta .minimum strong{margin:0;font-size:inherit;font-weight:500;color:#4e738a;overflow-wrap:anywhere}
.asset-meta .minimum svg{display:none}
.asset-meta .minimum:hover{background:transparent;color:#355d75}
.asset-meta .minimum:hover strong{text-decoration:underline;text-underline-offset:4px;text-decoration-color:#a4bccb}
.minimum:disabled{cursor:default;opacity:.5}
.quote-controls{position:relative;gap:3px;min-height:36px}
.quote-controls .quote-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.quote-controls .quote-countdown{position:static;transform:none;display:block;width:29px;height:auto;font-size:10px;line-height:1;color:#7691a2;font-variant-numeric:tabular-nums;opacity:1}
.quote-controls .refresh-quote{width:36px;height:36px;border:0;background:transparent;box-shadow:none;color:#6a8da3;opacity:1}
.quote-controls .refresh-quote:hover{background:rgba(211,228,239,.35)}
.quote-controls .refresh-ring{width:26px;height:26px;inset:5px;stroke-width:1.1}
.quote-controls .refresh-track{stroke:transparent}
.quote-controls .refresh-ring #quoteProgress{stroke:#a1bccd}
.quote-controls .refresh-core{width:12px;height:12px;opacity:1}
.quote-controls:has(.refreshing) .quote-countdown{opacity:1}
.language-menu a{display:flex;align-items:center;gap:13px;width:100%;padding:12px;border:1px solid transparent;border-radius:9px;background:transparent;color:#547387;font-size:12px;text-align:left;transition:background .15s}
.language-menu a:hover,.language-menu a:focus-visible{background:#edf4f9}
.language-menu a[aria-checked="true"]{background:#e5f0f7;border-color:#d7e6ef;color:#30566e}
.language-switch{position:relative}
.language-menu.popover-fallback{z-index:200;position:absolute;inset:calc(100% + 9px) 0 auto auto;position-anchor:auto}
.language-menu.is-open{opacity:1;transform:none}
.language-switch .language-trigger{min-height:44px}
button,a,input{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
.page-footer{gap:16px}
@media(min-width:761px) and (max-width:1050px){
  .coin-trigger{min-width:132px;font-size:19px;padding-inline:8px;gap:8px}
  .coin-trigger .coin-icon{width:29px;height:29px}
  .coin-trigger .chevron{margin-left:4px}
  .coin-picker{max-width:52%}
}
@media(max-width:760px){
  .hero{justify-content:flex-start}
  .site-header{top:max(12px,env(safe-area-inset-top));width:calc(100% - 28px);height:64px;padding-inline:17px 9px}
  .hero-inner{top:0;padding-top:100px;padding-bottom:28px}
  .hero h1{font-size:clamp(10px,2.75vw,20px)}
  .exchange{padding:16px;margin-top:20px}
  .rate-toolbar{margin-bottom:20px;gap:9px 4px}
  .mode-switch{padding:3px;gap:2px}
  .mode-switch button{min-height:36px;font-size:10px;padding:8px}
  .quote-controls .refresh-quote{width:36px;height:36px}
  .quote-controls .quote-countdown{width:24px;font-size:9px}
  .coin-picker{max-width:48%;gap:6px}
  .coin-trigger{min-width:116px;min-height:48px;font-size:17px;gap:7px}
  .coin-trigger .chevron{margin-left:4px}
  .coin-picker .network{font-size:10px;line-height:1.4}
  .asset-meta{min-height:28px;margin-top:9px}
  .asset-meta .minimum{font-size:10px;min-height:34px;margin-block:-5px}
  .amount-panel,.amount-panel.receive{min-height:150px;padding:18px 14px}
  .recipient-field input,.coin-modal .coin-search{font-size:16px}
  .recipient-field input::placeholder{font-size:12px}
  .recipient-field{min-height:54px}
  .swap{width:36px;height:36px}
  .swap::before{content:"";position:absolute;inset:-4px}
  .coin-modal-close{min-width:44px;min-height:44px}
  .page-footer{padding-bottom:max(20px,env(safe-area-inset-bottom));line-height:1.5}
}
@media(max-width:359px){
  .exchange{padding:12px}.hero-inner{width:calc(100% - 20px)}
  .coin-trigger{min-width:106px;font-size:16px;padding-inline:6px;gap:6px}
  .coin-trigger .coin-icon{width:23px;height:23px}
  .mode-switch button{font-size:9px;padding-inline:6px}
  .amount-panel,.amount-panel.receive{padding-inline:12px}
  .asset-meta .minimum{font-size:9px}
  .popular-options{gap:6px;padding:10px 6px}
  .popular-info small{font-size:8px}
  .network-option{gap:6px;padding-inline:5px}
}
@media(max-height:500px) and (min-width:761px){
  .hero-inner{padding-top:112px;padding-bottom:65px}
}
@media(max-height:500px){
  .coin-menu.coin-modal{height:calc(100vh - 20px);height:calc(100svh - 20px)}
  .coin-modal-heading{padding-block:12px 8px}
  .coin-modal .coin-search-wrap{padding-bottom:8px}
  .coin-modal .coin-search{padding-block:8px}
  .picker-tabs{min-height:34px}.picker-tabs button{padding-bottom:8px}
}
@supports not (height:100svh){.coin-menu.coin-modal{height:min(610px,calc(100vh - 32px))}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.refresh-ring #quoteProgress{transition:none}}
@media(forced-colors:active){.coin-trigger,.exchange,.amount-panel,.refresh-quote,.mode-switch,.recipient-field{border:1px solid ButtonText}.refresh-ring #quoteProgress{stroke:ButtonText}}

@media(any-pointer:coarse){
  .recipient-field input,.coin-modal .coin-search{font-size:16px}
  .mode-switch button{min-height:40px}
  .asset-meta .minimum{min-height:44px;margin-block:-10px}
  .quote-controls .refresh-quote::after{content:"";position:absolute;inset:-4px;border-radius:50%}
  .picker-tabs button{min-height:44px}
}

/* Creation controls and a link for returning to the separate order page. */


.hero-explore:disabled{cursor:default;opacity:.55}
#exchangeFields[hidden]{display:none!important}


.exchange-bottom .hero-buttons{grid-column:2;grid-row:1}

@media(max-width:760px){.exchange-bottom .hero-buttons{grid-column:1;grid-row:auto}}

.footer-links{display:flex;align-items:baseline;justify-content:flex-end;gap:20px}
.pgp-nav{color:#6d8b9e;text-underline-offset:3px}
.pgp-nav:hover{text-decoration:underline}
@media(max-width:359px){.footer-links{gap:10px}.page-footer{gap:10px}}

/* Uploaded PATHOS logo, shared by the main and native page headers. */
.wordmark{align-items:center;flex:0 0 auto;line-height:0}
.brand-logo{display:block;width:210px;height:auto;max-width:100%;object-fit:contain;filter:none}
@media(max-width:760px){.brand-logo{width:160px}}

/* Evenly tinted glass across the full header. */
.site-header,.site-header.scrolled{
  background:linear-gradient(180deg,rgba(144,174,195,.68),rgba(130,161,185,.68));
  -webkit-backdrop-filter:blur(20px) saturate(155%);backdrop-filter:blur(20px) saturate(155%);
  border:1px solid rgba(243,251,255,.28);border-bottom-color:rgba(119,156,180,.23);border-radius:23px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 1px 0 0 rgba(255,255,255,.3),inset 0 -1px 1px rgba(86,126,154,.12);
  color:#35546b;isolation:isolate;
}
.site-header::before,.site-header::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1}
.site-header::before{background:linear-gradient(180deg,rgba(255,255,255,.28),transparent 24%,transparent 75%,rgba(191,222,244,.13));box-shadow:inset 0 0 7px rgba(239,250,255,.22)}
.site-header::after{inset:-1px;padding:1px;background:linear-gradient(115deg,rgba(255,255,255,.6),rgba(255,255,255,.06) 24%,rgba(255,255,255,.4) 48%,rgba(181,215,238,.03) 70%,rgba(255,255,255,.55));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}
.site-header .brand-logo{width:220px;filter:none}
.site-header .header-note{color:#3e5c70}
.site-header .order-search-nav{color:#34556e;transition:color .16s ease}
.site-header .order-search-nav:hover{color:#153f5b}
.site-header .language-trigger{color:#34556e;background:linear-gradient(150deg,rgba(255,255,255,.38),rgba(223,242,255,.12));border:1px solid rgba(249,253,255,.66);border-bottom-color:rgba(138,174,200,.26);border-radius:15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.55);transition:background .16s ease,border-color .16s ease}
.site-header .language-trigger:hover,.site-header .language-trigger[aria-expanded="true"]{background:linear-gradient(150deg,rgba(255,255,255,.58),rgba(226,244,255,.27));border-color:rgba(255,255,255,.85)}
.site-header a:focus-visible,.site-header button:focus-visible{outline:2px solid #416c89;outline-offset:4px}
@media(max-width:760px){
  .site-header,.site-header.scrolled{border-radius:20px;-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%)}
  .site-header .brand-logo{width:160px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.site-header,.site-header.scrolled{background:linear-gradient(180deg,#8faabd,#7f9eb5)}}
@media(prefers-reduced-transparency:reduce){.site-header,.site-header.scrolled{background:linear-gradient(180deg,#8faabd,#7f9eb5);-webkit-backdrop-filter:none;backdrop-filter:none}}

@media(max-width:359px){.site-header .brand-logo{width:128px}}

/* Compact header actions, shared by all native pages. */
.site-header .header-actions{gap:10px}
@media(max-width:500px){.site-header .header-actions{gap:6px}}