
:root{
  --navy:#0b1f3a;
  --blue:#2455e6;
  --ink:#172033;
  --muted:#748095;
  --line:#e8edf3;
  --bg:#f7f9fc;
  --card:#fff;
  --soft:#eef3ff;
  --green:#16a36f;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.6;
}
a{text-decoration:none;color:inherit}
button{font:inherit}
.wrap{width:min(1040px,calc(100% - 28px));margin:auto}
header{background:#fff;border-bottom:1px solid var(--line)}
.nav{height:64px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px;font-weight:800}
.logo{width:34px;height:34px;border-radius:11px;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:12px}
.back{font-size:13px;color:#657287}
.home{
  min-height:calc(100vh - 64px);
  display:flex;align-items:center;
  padding:42px 0 64px;
}
.home-title{text-align:center;margin-bottom:30px}
.home-title h1{font-size:34px;margin:0 0 7px;letter-spacing:-.035em}
.home-title p{margin:0;color:var(--muted);font-size:14px}
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hub-card{
  background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 22px;
  min-height:210px;display:flex;flex-direction:column;align-items:flex-start;
  transition:.18s ease;box-shadow:0 5px 18px rgba(19,32,51,.025)
}
.hub-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(19,32,51,.08);border-color:#d8e1f1}
.icon{
  width:50px;height:50px;border-radius:15px;background:var(--soft);color:var(--blue);
  display:grid;place-items:center;margin-bottom:34px
}
.icon svg{width:25px;height:25px;stroke:currentColor;fill:none;stroke-width:1.8}
.hub-card h2{font-size:18px;margin:0 0 6px}
.hub-card p{margin:0;color:var(--muted);font-size:12px}
.hub-card .go{margin-top:auto;padding-top:20px;color:var(--blue);font-size:12px;font-weight:800}
.page{padding:44px 0 72px}
.page-head{margin-bottom:24px}
.page-head .eyebrow{font-size:11px;color:var(--blue);font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.page-head h1{font-size:34px;letter-spacing:-.035em;margin:7px 0 7px}
.page-head p{margin:0;color:var(--muted);font-size:13px}
.panel,.item{
  background:#fff;border:1px solid var(--line);border-radius:17px;padding:20px;margin-bottom:14px
}
.panel h2,.item h2{font-size:18px;margin:0 0 10px}
.panel h3,.item h3{font-size:15px;margin:18px 0 8px}
.note{font-size:12px;color:var(--muted);margin-top:10px}
.tag{display:inline-block;font-size:10px;font-weight:800;padding:4px 8px;border-radius:999px;background:#f0f3f7;color:#536175;margin-right:6px}
.tag.live{background:#eaf8f3;color:#087a55}
.domain{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:12px 0;border-bottom:1px solid var(--line)
}
.domain:last-child{border-bottom:0}
.domain strong{font-size:13px;overflow-wrap:anywhere}
.actions{display:flex;gap:7px;white-space:nowrap}
.actions button,.actions a{
  border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 9px;font-size:11px;cursor:pointer
}
.actions a{background:var(--navy);border-color:var(--navy);color:#fff}
details{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
summary{cursor:pointer;font-size:12px;font-weight:800}
.backups{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.backups button{border:1px solid var(--line);background:#fafbfc;border-radius:8px;padding:8px;text-align:left;font-size:11px;cursor:pointer;overflow-wrap:anywhere}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.kpi{background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:13px}
.kpi small{display:block;color:var(--muted);font-size:10px}
.kpi strong{font-size:14px}
.table{border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-top:12px}
.tr{display:grid;grid-template-columns:1fr 1.6fr;border-top:1px solid var(--line)}
.tr:first-child{border-top:0}
.tr span{padding:9px 11px;font-size:12px}
.tr.head{background:#f4f6f9;color:#536176;font-weight:800}
.tr.four{grid-template-columns:.55fr 1.05fr .9fr 1.4fr}
.list{padding-left:20px;color:#4f5d70;font-size:12px}
.list li+li{margin-top:6px}
.steps{list-style:none;margin:0;padding:0}
.steps li{padding:11px 0;border-bottom:1px solid var(--line)}
.steps li:last-child{border-bottom:0}
.steps b{display:block;font-size:13px}
.steps span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.two{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.software-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:20px}
.software-card h2{font-size:17px;margin:10px 0}
.link{color:var(--blue);font-size:12px;font-weight:800}
.placeholder{background:#fbfcfe;border-style:dashed}
footer{padding:25px 0 35px;color:#8994a5;font-size:10px;text-align:center}
.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,10px);padding:8px 12px;border-radius:8px;background:#111827;color:#fff;font-size:11px;opacity:0;transition:.2s;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:800px){
  .hub-grid{grid-template-columns:repeat(2,1fr)}
  .two,.three{grid-template-columns:1fr}
  .backups{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .home{align-items:flex-start;padding-top:32px}
  .home-title h1{font-size:28px}
  .hub-grid{grid-template-columns:1fr 1fr;gap:10px}
  .hub-card{min-height:170px;padding:18px 15px;border-radius:16px}
  .icon{width:42px;height:42px;border-radius:13px;margin-bottom:22px}
  .hub-card h2{font-size:15px}
  .hub-card p{font-size:11px}
  .backups{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr}
  .tr.four{grid-template-columns:.45fr .9fr .8fr 1.3fr}
  .tr span{font-size:11px;padding:8px}
}

/* IB rebate tabs */
.rebate-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px}
.rebate-head h2{margin:8px 0 0}
.effective{font-size:11px;color:var(--muted);white-space:nowrap;padding-top:4px}
.rebate-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:8px 0 14px}
.rebate-tab{
  border:1px solid var(--line);background:#f8fafc;color:#526174;
  border-radius:9px;padding:9px 8px;cursor:pointer;font-size:12px;font-weight:700
}
.rebate-tab.active{background:var(--navy);border-color:var(--navy);color:#fff}
.rebate-table-wrap{display:none;overflow-x:auto}
.rebate-table-wrap.active{display:block}
.rebate-table{border:1px solid var(--line);border-radius:11px;overflow:hidden;min-width:650px}
.rt{display:grid;grid-template-columns:1.7fr .75fr .9fr .75fr .7fr;border-top:1px solid var(--line)}
.rt:first-child{border-top:0}
.rt span{padding:9px 10px;font-size:12px}
.rt span:not(:first-child){text-align:center}
.rt.head{background:#f4f6f9;color:#536176;font-weight:800}
@media(max-width:560px){
  .rebate-head{display:block}
  .effective{display:block;margin-top:5px}
  .rebate-tabs{grid-template-columns:repeat(2,1fr)}
}

/* V3.2 */
.overseas-site{border-color:#dce5ff}
.domain-label{display:flex;flex-direction:column;gap:1px}
.domain-label span{font-size:11px;color:var(--muted)}
.tag.warning{background:#fff4e5;color:#9a5b00}
.doc-link{
  display:inline-flex;margin-top:8px;color:var(--blue);font-size:12px;font-weight:800;
  padding:8px 11px;border:1px solid #dbe4ff;border-radius:9px;background:#f7f9ff
}
.impact-list{border-top:1px solid var(--line);margin-top:12px}
.impact-list div{display:grid;grid-template-columns:90px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.impact-list b{font-size:12px;color:var(--navy)}
.impact-list span{font-size:12px;color:var(--muted)}
.data-links .data-link{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:14px 0;border-top:1px solid var(--line)
}
.data-links .data-link:first-of-type{margin-top:8px}
.data-link div{display:flex;flex-direction:column;gap:2px}
.data-link strong{font-size:13px}
.data-link span{font-size:11px;color:var(--muted)}
.data-link>b{font-size:11px;color:var(--blue);white-space:nowrap}
@media(max-width:560px){
  .impact-list div{grid-template-columns:76px 1fr}
  .data-links .data-link{align-items:flex-start}
}

/* V3.3 knowledge glossary */
.knowledge-list{margin-top:12px;border-top:1px solid var(--line)}
.knowledge-row{
  display:grid;grid-template-columns:150px 1fr;gap:22px;
  padding:16px 0;border-bottom:1px solid var(--line)
}
.knowledge-term{display:flex;flex-direction:column}
.knowledge-term strong{font-size:14px}
.knowledge-term span{font-size:11px;color:var(--blue);margin-top:1px}
.knowledge-row p{margin:0;color:#536175;font-size:13px}
@media(max-width:560px){
  .knowledge-row{grid-template-columns:1fr;gap:5px;padding:14px 0}
  .knowledge-term{flex-direction:row;align-items:baseline;gap:8px}
}

/* V3.4 refinements */
.company-link{
  margin:18px auto 0;display:flex;align-items:center;justify-content:space-between;
  max-width:520px;padding:12px 15px;border:1px solid var(--line);border-radius:12px;
  background:#fff;color:var(--ink)
}
.company-link span{font-size:13px;font-weight:800}
.company-link b{font-size:11px;color:var(--blue)}
.access-note{margin:4px 0 10px;color:#5f6d81;font-size:12px}
.claim-steps{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.claim-steps h3{margin:0 0 10px;font-size:15px}
.claim-steps ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.claim-steps li{background:#f8fafc;border:1px solid var(--line);border-radius:11px;padding:12px}
.claim-steps b{display:block;font-size:12px;margin-bottom:4px}
.claim-steps span{font-size:11px;color:var(--muted)}
.guide-image{display:block;width:100%;max-width:820px;margin:14px auto 8px;border-radius:10px;border:1px solid var(--line)}
.important-note{
  display:flex;gap:12px;align-items:flex-start;background:#fff7e8;border:1px solid #f3dfb3;
  border-radius:12px;padding:12px 14px;margin-bottom:14px
}
.important-note strong{font-size:12px;white-space:nowrap;color:#8c5a00}
.important-note span{font-size:12px;color:#66563b}
.qr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.qr-card{
  background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px;text-align:center;
  transition:.18s ease
}
.qr-card:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(20,42,74,.08)}
.qr-card h2{font-size:15px;margin:8px 0 10px}
.qr-card img{width:100%;max-width:185px;aspect-ratio:1/1;object-fit:cover;border-radius:9px;background:#fff}
.qr-card>b{display:block;margin-top:9px;font-size:11px;color:var(--blue)}
.software-notes{margin-top:14px}
@media(max-width:800px){
  .qr-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .claim-steps ol{grid-template-columns:1fr}
  .qr-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .qr-card{padding:13px}
  .qr-card img{max-width:150px}
}

/* V3.6 */
.gold-card{
  grid-column:span 3;min-height:130px;display:grid;
  grid-template-columns:auto 1fr auto;align-items:center;column-gap:18px
}
.gold-card .icon{margin:0;background:#fff7df;color:#9a6b00}
.gold-card .go{margin:0;padding:0}
.gold-card-copy h2{margin:0 0 5px}
.gold-card-copy p{margin:0}
.important-note{
  background:#eef4ff!important;border-color:#d8e5ff!important;
}
.important-note strong{color:#315b9d!important}
.important-note span{color:#586b86!important}
.qr-card{display:flex;flex-direction:column;align-items:center}
.qr-card img{
  width:190px;height:190px;object-fit:contain;border-radius:4px;
  image-rendering:auto;border:1px solid #edf0f4;padding:5px
}
.qr-card p{font-size:11px;color:var(--muted);margin:8px 0 10px}
.download-links{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:auto}
.download-links a{
  border:1px solid var(--line);background:#f8fafc;border-radius:8px;
  padding:7px 9px;font-size:10px;font-weight:700;color:#40526b
}
.download-links a:first-child{color:var(--blue);border-color:#d8e3ff;background:#f6f8ff}
.soft-tip{
  display:flex;gap:10px;align-items:flex-start;background:#f3f6fb;border:1px solid #e0e6ef;
  border-radius:12px;padding:12px 14px;margin:4px 0 16px
}
.soft-tip strong{font-size:12px;white-space:nowrap;color:#42546e}
.soft-tip span{font-size:12px;color:#6a788b}

.gold-basics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.gold-fact{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px}
.gold-fact small,.gold-fact span{display:block;color:var(--muted);font-size:11px}
.gold-fact strong{display:block;font-size:20px;margin:3px 0 2px}
.knowledge-list.compact .knowledge-row{grid-template-columns:180px 1fr}
.calculator-card{
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;margin-top:14px
}
.calculator-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}
.calculator-head h2{font-size:20px;margin:8px 0 0}
.calculator-head>span{font-size:11px;color:var(--muted)}
.calc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.calc-grid label{font-size:11px;color:#5a687d;font-weight:700}
.calc-grid input,.calc-grid select{
  display:block;width:100%;margin-top:6px;border:1px solid var(--line);border-radius:10px;
  background:#fbfcfe;color:var(--ink);padding:10px 11px;outline:none
}
.calc-grid input:focus,.calc-grid select:focus{border-color:#b7c8f8;box-shadow:0 0 0 3px #eef3ff}
.calc-results{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px
}
.calc-results>div{background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:13px}
.calc-results small{display:block;color:var(--muted);font-size:10px;margin-bottom:3px}
.calc-results strong{font-size:16px}
.calc-results .result-main{background:#f4f7ff;border-color:#d9e3ff}
.calc-results .result-main strong{font-size:20px}
.positive{color:#087a55}.negative{color:#b42318}
.calc-note{font-size:11px;color:var(--muted);margin:13px 0 0}
.official-calc{
  display:inline-flex;margin-top:10px;color:var(--blue);font-size:12px;font-weight:800;
  border:1px solid #dbe4ff;background:#f7f9ff;border-radius:9px;padding:8px 10px
}

@media(max-width:800px){
  .gold-card{grid-column:span 2}
  .calc-grid{grid-template-columns:repeat(2,1fr)}
  .calc-results{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .gold-card{grid-column:span 2;min-height:115px;grid-template-columns:auto 1fr}
  .gold-card .go{grid-column:2;margin-top:8px}
  .gold-basics{grid-template-columns:1fr}
  .knowledge-list.compact .knowledge-row{grid-template-columns:1fr}
  .calc-grid{grid-template-columns:1fr 1fr}
  .calc-results{grid-template-columns:1fr 1fr}
  .qr-card img{width:150px;height:150px}
}

/* V3.7 trading calculators */
.instrument-section{margin-bottom:24px}
.instrument-section+.instrument-section{padding-top:8px}
.instrument-title{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  margin:0 0 12px;padding:0 2px
}
.instrument-title>div{display:flex;align-items:center;gap:9px}
.instrument-title h2{margin:0;font-size:20px}
.instrument-title>span{font-size:11px;color:var(--muted)}
.instrument-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.gold-dot{background:#d6a21f}
.btc-dot{background:#f7931a}
.btc-section{border-top:1px solid var(--line);padding-top:24px!important}
.official-tools{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:14px 16px
}
.official-tools>span{font-size:12px;color:var(--muted)}
.official-tools .official-calc{margin-top:0}
@media(max-width:560px){
  .instrument-title{align-items:flex-start}
  .official-tools{display:block}
  .official-tools .official-calc{margin-top:9px}
}

/* V3.8 DC rebate */
.rebate-tabs{grid-template-columns:repeat(5,1fr)}
.dc-tab{font-weight:800}
.dc-highlight{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin-bottom:12px;padding:14px 16px;border:1px solid #f0dfb3;
  background:#fffaf0;border-radius:12px
}
.dc-highlight h3{margin:7px 0 0;font-size:15px}
.dc-btc{text-align:right}
.dc-btc small,.dc-btc span{display:block;color:var(--muted);font-size:10px}
.dc-btc strong{display:block;font-size:22px;color:#9a6b00;line-height:1.2;margin:2px 0}
.rebate-table .rt.dc{grid-template-columns:1.7fr 1fr .8fr}
.rebate-table .rt.dc span:not(:first-child){text-align:center}
.rebate-table .btc-row{background:#fffaf0}
.rebate-table .btc-row span{font-weight:800}
@media(max-width:560px){
  .rebate-tabs{grid-template-columns:repeat(2,1fr)}
  .dc-highlight{align-items:flex-start}
  .dc-btc{text-align:left}
}

/* V4 funding guide */
.funding-section{margin:22px 0}
.funding-head{display:flex;align-items:center;gap:10px;margin:0 0 12px 2px}
.funding-head h2{margin:0;font-size:21px}
.funding-card h3{margin:0 0 10px;font-size:16px}
.number-steps{list-style:none;margin:0;padding:0;counter-reset:step}
.number-steps li{
  position:relative;padding:0 0 14px 34px;margin:0 0 13px;border-bottom:1px solid var(--line);
  counter-increment:step
}
.number-steps li:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.number-steps li:before{
  content:counter(step);position:absolute;left:0;top:0;width:23px;height:23px;border-radius:8px;
  display:grid;place-items:center;background:#eef3ff;color:#315bd5;font-size:10px;font-weight:800
}
.number-steps b{display:block;font-size:12px}
.number-steps span{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1.6}
.mini-info{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 8px}
.mini-info span{padding:7px 9px;background:#f7f9fc;border:1px solid var(--line);border-radius:8px;font-size:10px;color:#526174}
.compact-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.compact-steps li{border:1px solid var(--line);border-radius:10px;padding:12px 12px 12px 42px;margin:0}
.compact-steps li:before{left:11px;top:11px}
@media(max-width:700px){
  .compact-steps{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .compact-steps{grid-template-columns:1fr}
}
