/* v0.2: Binance-referenced geometry, P2PDEX content and custody model. */
:root{--line:#303640;--muted:#929aa8;--panel:#1b1e25;--raised:#2b3139;--radius:12px}
body{font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
button,a,input,select{touch-action:manipulation}
button,a{transition:background-color .16s,color .16s,border-color .16s}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}
input:hover,select:hover,textarea:hover{border-color:#626c7a}
input:focus,select:focus,textarea:focus{border-color:var(--yellow)}
.global-header{height:64px;min-height:64px;background:#181a20}
.brand{font-size:23px;letter-spacing:-.5px}.brand-mark{border-radius:6px}
.top-nav a.active{color:var(--text);text-decoration:none}
.demo-banner{padding-top:8px;padding-bottom:8px;font-size:10px;background:#222019;color:#c2b686}
.sub-nav{height:64px}.sub-nav>a{font-size:14px}.sub-nav>a.active:after{height:3px;width:24px;right:auto}
.container{max-width:1280px;padding-top:30px}
.panel{background:var(--panel);border-radius:var(--radius)}
.btn{border-radius:6px;font-weight:600}.btn.buy{color:#072f20}.btn.sell{color:#fff;background:#d9364d}
.page-heading{margin-bottom:28px}.page-heading h1{font-size:28px;letter-spacing:-.7px}
.stat-value{font-weight:600;letter-spacing:-.8px}.stat-label{font-size:13px}
.list-table th{background:#1c1f26}.list-table td{font-variant-numeric:tabular-nums}
.list-table tbody tr:hover{background:#1c2027}.list-table th:first-child{padding-left:12px}
.list-table td:first-child{padding-left:12px}.list-table td:last-child,.list-table th:last-child{padding-right:12px}
.market-context h1{font-size:20px;font-weight:600}.market-tabs{margin-bottom:24px;gap:30px}
.offers th{background:#1c1f26;padding-top:14px;padding-bottom:14px}.offers th:first-child{padding-left:12px}
.offers td{padding-top:24px;padding-bottom:24px}.offers td:first-child{padding-left:12px}.offers th:last-child,.offers td:last-child{padding-right:12px}
.offers .btn{min-width:108px;padding:10px 15px;min-height:36px}.price{font-weight:600;font-size:23px}
.merchant-stats{font-size:11px}.merchant-sub{font-size:11px}.network-tag{background:#252b34;color:#a8b7cd}
.market-footer{font-size:11px}.trust-row{margin-top:26px}.segmented{border:0;background:#22262e}
.express-container{max-width:1280px;padding-top:46px;padding-bottom:48px}
.express-grid{grid-template-columns:minmax(0,1fr) 460px;gap:70px;max-width:none;margin:0;align-items:center}
.express-copy .eyebrow{font-size:10px;letter-spacing:1.5px;color:#ac9459;margin-bottom:24px}
.express-copy h1{font-size:48px;font-weight:600;letter-spacing:-1.6px;line-height:1.35;margin:0 0 24px}
.express-copy h1 span{display:inline-block;white-space:normal;font-size:42px}
.express-copy p{font-size:16px;line-height:1.8;margin:0;color:#9aa2ae}
.express-benefits{display:flex;gap:24px;flex-wrap:wrap;margin-top:28px;font-size:12px;color:#aeb5bf}
.express-benefits b{color:var(--yellow);margin-right:5px;font-size:15px}
.express-market-link{display:inline-flex;gap:18px;color:var(--yellow);font-size:13px;margin-top:36px;padding:8px 0}
.express-market-link:hover{color:#ffda55}
.express-card{border:1px solid #343b46;border-radius:20px;background:#181a20;box-shadow:0 8px 32px #00000014;overflow:hidden}
/* Fill both halves of the entire card. Keep marketplace direction controls compact. */
.express-direction{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;padding:0;gap:0;border:0;border-radius:0;background:#272e38;margin:0}
.express-direction button{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:60px;padding:16px 0;font-size:18px;border-radius:0;color:#9ca5b2}
.express-direction button.active{background:#181a20;color:var(--text)}
.express-direction button.active.buy-color,.express-direction button.active.sell-color{color:var(--text)}
.express-direction button:first-child.active{border-radius:0 18px 0 0}
.express-direction button:last-child.active{border-radius:18px 0 0 0}
.express-direction button:focus-visible{outline-offset:-5px;border-radius:8px}
.express-card-body{padding:28px}
.express-amount-box{border:1px solid #3a414d;border-radius:12px;padding:16px;transition:border-color .15s;background:#181a20}
.express-amount-box:focus-within{border-color:var(--yellow)}
.express-amount-box>label{display:flex;justify-content:space-between;gap:8px;color:#c7cbd2;font-size:12px;margin-bottom:8px}
.express-amount-box>label>span{color:#7d8795;font-size:11px}
.express-amount-row{display:flex;align-items:center;gap:12px}
.express-amount-row input{font-size:25px;line-height:1.3;font-weight:500;border:0;background:none;padding:0;min-height:36px;min-width:0;flex:1;width:0;font-variant-numeric:tabular-nums;box-shadow:none}
.express-amount-row input:focus-visible{outline:none}
.express-amount-row select{width:96px;flex:0 0 96px;min-height:38px;font-weight:600;font-size:16px;border:0;background:#20252d;padding:8px;border-radius:20px}
.express-amount-row input::-webkit-inner-spin-button,.express-amount-row input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.express-conversion{text-align:center;height:16px;line-height:16px;color:#7b8695;font-size:15px;position:relative;z-index:1}
.express-rate{margin:14px 0 22px;text-align:right;color:#a5aeba;font-size:12px;min-height:14px;font-variant-numeric:tabular-nums}
.express-card .field select{background:#181a20;height:46px;border-radius:8px}
.express-match{display:flex;gap:7px;align-items:center;color:#a9b5c2;font-size:11px;margin:16px 0 24px;min-height:14px}
.express-card .btn{min-height:48px;font-size:14px;border-radius:8px}
.express-disclosure{font-size:10px;color:#8f98a7;line-height:1.65;margin:14px 0 0;text-align:center}
.express-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px;margin-top:68px;padding-top:30px;border-top:1px solid var(--line)}
.express-how>div{position:relative;padding-left:34px}.express-how span{position:absolute;left:0;top:0;font-size:12px;color:var(--yellow);line-height:20px}
.express-how h2{font-size:14px;font-weight:500;margin:0 0 10px;line-height:20px}
.express-how p{font-size:12px;line-height:1.7;color:var(--muted);margin:0;max-width:270px}
.chat-panel{background:#1b1e25}.chat-message{background:#262c35}.chat-message.self{background:#3b331e}
.form-steps>span{font-size:12px}.quote-amount{border-radius:12px}.modal-head h2{font-weight:600}
@media(max-width:1100px){.express-grid{grid-template-columns:minmax(0,1fr) 420px;gap:36px}.express-copy h1{font-size:39px}.express-copy h1 span{font-size:33px}.express-copy p{font-size:14px}.express-copy .eyebrow{font-size:9px;letter-spacing:1px}.express-benefits{gap:12px}}
@media(max-width:760px){
  .global-header{height:auto;min-height:110px}.container{padding:24px 18px 38px}.sub-nav{height:54px}.sub-nav>a{font-size:13px}
  .express-container{padding-top:28px}.express-grid{grid-template-columns:minmax(0,1fr);gap:26px;margin:0}.express-copy{padding:0 2px}
  .express-copy .eyebrow{font-size:9px;letter-spacing:.7px;margin-bottom:14px}.express-copy h1{font-size:31px;line-height:1.3;letter-spacing:-.8px;margin-bottom:12px}.express-copy h1 span{font-size:29px}
  .express-copy p{font-size:13px}.express-copy br.hide-small{display:none}.express-benefits{margin-top:16px;font-size:11px;gap:18px}.express-market-link{display:none}
  .express-card{border-radius:16px}.express-card-body{padding:22px 20px}.express-direction button{min-height:56px;font-size:17px}
  .express-amount-row input{font-size:24px}.express-amount-row select{flex-basis:86px;width:86px;font-size:14px}.express-amount-box{padding:14px}
  .express-how{grid-template-columns:1fr;gap:24px;margin-top:34px;padding-top:26px}.express-how p{max-width:none}
  .offers td:first-child{padding-left:0}.offers td:last-child{padding-right:0}.offers .btn{min-height:44px}.offers td{padding-top:10px;padding-bottom:10px}
  .page-heading h1{font-size:25px}.express-disclosure{font-size:11px}.list-table th:first-child,.list-table td:first-child{padding-left:8px}
  .text-button{min-height:44px;display:inline-flex;align-items:center}.tab-row button{min-height:44px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-width:380px){
  .sub-nav{gap:14px}.sub-nav .utility{white-space:nowrap;font-size:10px}
  .filter-grid .input-pair input{flex:1;width:0;min-width:0}
  .input-pair select{flex:0 0 82px;min-width:82px;width:82px;padding-right:20px}
  .filter-grid select{font-size:12px}
}