:root{color-scheme:dark;--bg:#101113;--panel:#1b1c1e;--text:#eee9df;--muted:#a5a098;--gold:#d5b77b;--line:#c9ad7425;font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
html{min-width:280px;background:var(--bg);scroll-behavior:smooth}
body{margin:0;color:var(--text);background:radial-gradient(ellipse at 50% 0,#a1833d0c,transparent 48%),var(--bg);font-size:14px;line-height:1.6}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
main:focus{outline:none}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.site-shell{width:min(100% - 48px,740px);margin:0 auto}
.site-header{display:flex;align-items:center;justify-content:space-between;min-height:105px;border-bottom:1px solid #ffffff0b}
.brand{display:flex;align-items:center;gap:11px}
.brand img{display:block;border-radius:10px;width:40px;height:40px}
.brand>span{display:flex;flex-direction:column}
.brand strong{font-weight:600;font-size:20px;letter-spacing:3px;line-height:1.3}
.brand small{font-size:8px;letter-spacing:2px;color:var(--gold);margin-top:4px}
.header-label{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:1px;color:#b6aa94}
.gold-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold);flex-shrink:0}
.intro{padding-top:44px}
.eyebrow{color:#ac966d;font-size:10px;letter-spacing:2.4px}
.title-row{display:flex;align-items:center;justify-content:space-between;margin:7px 0 10px}
h1,h2,h3,p{margin:0}
h1{font-size:34px;letter-spacing:-.7px;line-height:1.4;font-weight:600}
.platform-count{display:grid;place-items:center;width:40px;height:40px;border:1px solid #c9ad7433;border-radius:50%;font-size:12px;letter-spacing:2px;color:#b39b6b}
.intro-copy{font-size:13px;color:var(--muted);line-height:1.8}
.section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}
.intro .section-heading{margin-top:34px;margin-bottom:13px}
.section-heading h2{font-size:12px;font-weight:500;color:#bfb5a5}
.section-heading>span{font-size:10px;color:#8e887e;letter-spacing:.5px}
.exchange-list{display:grid;gap:10px}
.exchange-card{display:flex;align-items:center;gap:18px;min-height:92px;padding:14px 22px;border:1px solid var(--line);border-radius:16px;background:radial-gradient(ellipse at top left,#c8a86d0b,transparent 65%),linear-gradient(120deg,#222222,#191a1d);box-shadow:inset 0 1px #ffffff05,0 4px 12px #0002;transition:border-color .18s,background .18s}
.card-number{font-size:10px;color:#847557;font-variant-numeric:tabular-nums;letter-spacing:1px}
.exchange-mark{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:13px;background:#111214;border:1px solid #ffffff0c;box-shadow:0 3px 9px #0003}
.exchange-app-icon{display:inline-block;width:1em;height:1em;font-size:37px;background-image:url('./assets/exchange-icons.jpg');background-size:5.5em 2.770833em;background-repeat:no-repeat;border-radius:24%}
.exchange-info{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}
.exchange-name{display:flex;align-items:baseline;flex-wrap:wrap;gap:9px;font-weight:600;font-size:21px;line-height:1.3}
.exchange-name small{font-size:11px;font-weight:400;color:#aba08c}
.exchange-summary{font-size:11px;color:#aaa397}
.card-action{display:flex;align-items:center;gap:12px;font-size:11px;color:#cbb78e;white-space:nowrap}
.card-action svg{width:18px;height:18px}
.getting-started{margin-top:32px;padding-top:24px;border-top:1px solid #ffffff0b}
.getting-started .section-heading>span{letter-spacing:1.5px;font-size:9px}
.overview-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0 0;padding:0;list-style:none}
.overview-steps li{display:flex;align-items:flex-start;gap:10px}
.overview-steps li>span,.guide-steps li>span{font-size:11px;letter-spacing:1px;color:#b39967;font-variant-numeric:tabular-nums;padding-top:1px}
.overview-steps h3,.guide-steps h3{font-size:12px;font-weight:500;color:#d3c9b7}
.overview-steps p{font-size:10px;color:#979084;margin-top:5px}
.availability-note{display:flex;align-items:center;justify-content:center;gap:8px;margin:32px 0 24px;padding:12px 16px;border:1px solid #c9ad7417;border-radius:10px;background:#c9ad7405;color:#b2a58b;font-size:11px;text-align:center}
.site-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-top:30px;padding:22px 0 26px;border-top:1px solid #ffffff0b;font-size:10px;color:#8c867b}
.site-footer>span{color:#a99670;white-space:nowrap;letter-spacing:1px}
.site-footer p{max-width:360px;text-align:right;line-height:1.8}
.detail-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:26px 0 20px}
.back-link{display:flex;align-items:center;gap:8px;min-height:36px;color:#d2c4a9;font-size:12px}
.back-link svg{transform:rotate(180deg);width:17px}
.detail-top>span{font-size:10px;color:#a08c65;letter-spacing:1.5px}
.exchange-detail{border:1px solid #c9ad7429;border-radius:22px;background:radial-gradient(ellipse at 5% 0,#b99a5918,transparent 55%),#191a1c;overflow:hidden}
.detail-brand{display:flex;align-items:center;gap:20px;padding:30px;border-bottom:1px solid #c9ad741a}
.detail-brand .exchange-mark{flex-basis:70px;width:70px;height:70px;border-radius:20px}
.detail-brand .exchange-app-icon{font-size:54px}
.detail-brand .eyebrow{font-size:9px;letter-spacing:1.6px}
.detail-brand h1{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;font-size:29px;margin:4px 0 9px;line-height:1.3}
.detail-brand h1>span{font-size:15px;font-weight:400;color:#c0b298;letter-spacing:0}
.tags{display:flex;flex-wrap:wrap;gap:5px}
.tags>span{font-size:10px;border:1px solid #c9ad7429;padding:2px 7px;border-radius:5px;color:#cbb78f}
.platform-introduction{margin:23px 24px 0;padding:22px;border:1px solid #c9ad741f;background:#ffffff02;border-radius:14px}
.platform-introduction h2{font-size:11px;color:#b29b70;letter-spacing:1px;font-weight:500;margin-bottom:12px}
.detail-lead{font-size:18px;font-weight:500;line-height:1.85;color:#e4d8c0}
.detail-description{font-size:12px;line-height:1.95;color:#a9a193;margin-top:13px}
.platform-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:24px 28px}
.platform-features>div{display:flex;flex-direction:column;gap:7px}
.platform-features>div>span{font-size:10px;color:#9b845b;letter-spacing:1.5px}
.platform-features strong{font-size:11px;font-weight:400;color:#c3b79f}
.registration-area{padding:0 24px 24px}
.primary-button{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;min-height:48px;padding:12px 18px;border:1px solid #e3c58d;border-radius:10px;background:linear-gradient(110deg,#d7b574,#ebd6ad);color:#312819;font-size:13px;font-weight:600}
.pending-button{background:linear-gradient(110deg,#6d5c3e,#8b7650);border-color:#9a82544d;color:#e3d7c0;cursor:not-allowed}
.primary-button svg{width:17px;height:17px}
.registration-note{margin-top:10px;color:#a99b82;font-size:11px;line-height:1.8;text-align:center}
.registration-guide{margin-top:16px;border:1px solid #ffffff0e;border-radius:13px;background:#ffffff02}
.registration-guide summary{display:flex;justify-content:space-between;align-items:center;min-height:56px;padding:15px 20px;cursor:pointer;list-style:none;color:#d1c4ad;font-size:12px}
.registration-guide summary::-webkit-details-marker{display:none}
.expand-icon{font-size:20px;line-height:1;color:#b29c73;transition:transform .15s}
.registration-guide[open] .expand-icon{transform:rotate(45deg)}
.guide-steps{list-style:none;display:grid;gap:18px;padding:3px 22px 23px;margin:0}
.guide-steps li{display:flex;gap:13px}
.guide-steps p{font-size:11px;line-height:1.8;color:#a09889;margin-top:4px}
.skip-link{position:fixed;top:-70px;left:16px;z-index:10;background:var(--gold);color:#1a1710;padding:10px 16px;border-radius:7px}
.skip-link:focus{top:10px}
.noscript-note{padding:40px 0;color:var(--gold)}
@media(hover:hover){.exchange-card:hover{border-color:#c9ad7460;background:linear-gradient(120deg,#2b2822,#1d1e21)}.back-link:hover{color:var(--gold)}}
@media(max-width:560px){
  .site-shell{width:calc(100% - 32px)}
  .site-header{min-height:85px}
  .header-label{font-size:10px}
  .intro{padding-top:28px}
  h1{font-size:29px}
  .intro-copy{font-size:12px}
  .intro .section-heading{margin-top:26px}
  .platform-count{width:34px;height:34px;font-size:11px}
  .exchange-list{gap:8px}
  .exchange-card{gap:12px;min-height:82px;padding:12px 15px;border-radius:14px}
  .card-number{display:none}
  .exchange-name{font-size:20px;gap:7px}
  .exchange-name small{font-size:10px}
  .exchange-mark{flex-basis:44px;width:44px;height:44px;border-radius:12px}
  .exchange-app-icon{font-size:34px}
  .card-action{gap:7px;font-size:10px}
  .card-action svg{width:16px}
  .getting-started{margin-top:26px;padding-top:20px}
  .overview-steps{gap:12px;margin-top:19px}
  .overview-steps li{flex-direction:column;gap:6px}
  .overview-steps h3{font-size:11px}
  .overview-steps p{font-size:10px;line-height:1.7}
  .availability-note{margin-top:26px;padding:11px;font-size:10px}
  .site-footer{flex-direction:column;gap:8px;margin-top:24px;padding:19px 0 23px}
  .site-footer p{text-align:left;font-size:9px}
  .detail-top{padding:17px 0 13px}
  .detail-brand{padding:22px 18px;gap:15px}
  .detail-brand .exchange-mark{width:58px;height:58px;flex-basis:58px;border-radius:16px}
  .detail-brand .exchange-app-icon{font-size:44px}
  .detail-brand h1{font-size:25px;gap:9px}
  .detail-brand h1>span{font-size:13px}
  .platform-introduction{margin:16px 14px 0;padding:16px}
  .detail-lead{font-size:16px}
  .detail-description{font-size:11px}
  .platform-features{gap:8px;padding:20px 18px}
  .platform-features strong{font-size:10px}
  .registration-area{padding:0 15px 18px}
  .registration-note{font-size:10px}
  .registration-guide summary{padding:14px 17px}
  .guide-steps{padding:3px 17px 20px}
}
@media(max-width:350px){.card-action>span{display:none}.exchange-card{gap:10px}.intro-copy{font-size:11px}.section-heading>span{font-size:9px}.detail-brand{gap:11px}.tags>span{padding:2px 4px;font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
