/* ============================================================
   美股币 meigubi.com — 设计系统
   皮:浅色券商/行情看板 + 单张深色「交易终端」展示卡(明暗对照)
   字体:Hanken Grotesk(拉丁标题) / Noto Sans SC(中文) / IBM Plex Mono(数字)
   ============================================================ */
:root{
  --paper:#F4F6F1; --paper-2:#FBFCF9; --card:#FFFFFF;
  --ink:#0E1311; --ink-2:#545B52; --ink-3:#878E83;
  --line:#E5E8DF; --line-2:#F0F2EB;
  --em:#0D7A52; --em-2:#15A268; --em-soft:#E7F3ED; --up:#13A266; --down:#D6453F;
  --gold-1:#F4C336; --gold-2:#EAAE00; --gold-ink:#3A2C00;
  --ink-card:#0B100A;
  --sh-sm:0 1px 2px rgba(14,19,17,.05);
  --sh-card:0 2px 5px rgba(14,19,17,.04), 0 26px 50px -26px rgba(14,19,17,.24);
  --sh-pop:0 14px 34px -14px rgba(14,19,17,.30);
  --sh-gold:0 10px 24px -10px rgba(234,174,0,.72);
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --sans:'Hanken Grotesk','Noto Sans SC',system-ui,sans-serif;
  --cn:'Noto Sans SC','Hanken Grotesk',system-ui,sans-serif;
  --wrap:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--cn);line-height:1.68;position:relative;overflow-x:hidden;font-size:16px}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(1100px 460px at 18% -8%, rgba(21,162,104,.10), transparent 60%),
             radial-gradient(900px 420px at 96% 4%, rgba(244,195,54,.10), transparent 58%);}
body::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E");}
.wrap{position:relative;z-index:1;max-width:var(--wrap);margin:0 auto;padding:0 26px}
a{color:var(--em);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
h1,h2,h3,h4{line-height:1.2;letter-spacing:-.015em}
.mono{font-family:var(--mono)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* ===== ticker tape ===== */
.tape{position:relative;z-index:1;background:#0C100D;color:#E9ECE3;overflow:hidden;white-space:nowrap;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.02em}
.tape__live{position:absolute;left:0;top:0;bottom:0;z-index:2;display:flex;align-items:center;gap:7px;
  padding:0 16px 0 18px;background:linear-gradient(90deg,#0C100D 72%,transparent);font-weight:700;font-size:11px;letter-spacing:.12em;color:#fff}
.tape__live i{width:7px;height:7px;border-radius:50%;background:#28E08C;box-shadow:0 0 10px #28E08C;animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.35}}
.tape__track{display:inline-block;padding:9px 0;padding-left:90px;animation:slide 40s linear infinite}
.tape__track span{padding:0 18px;opacity:.95}
.tape b{color:#fff;font-weight:600}
.tape .u{color:#5FD49B}.tape .d{color:#FF8585}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.tape__track{animation:none}.tape__live i{animation:none}}

/* ===== header / nav ===== */
.head{position:relative;z-index:5;max-width:var(--wrap);margin:0 auto;padding:18px 26px;display:flex;align-items:center;gap:30px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand .mk{width:34px;height:34px;border-radius:10px;background:linear-gradient(150deg,#0F8A5C,#0B6342);
  display:grid;place-items:center;box-shadow:0 4px 10px -3px rgba(13,122,82,.6);flex:none}
.brand .mk svg{width:18px;height:18px}
.brand .zh{display:block;font-family:var(--sans);font-weight:800;font-size:20px;letter-spacing:.04em;line-height:1.02}
.brand .en{display:block;font-family:var(--mono);font-weight:600;font-size:9px;color:var(--ink-3);letter-spacing:.09em;margin-top:2px;text-transform:uppercase}
.nav-toggle{display:none;margin-left:auto;width:42px;height:38px;border:1px solid var(--line);background:var(--paper-2);border-radius:9px;flex-direction:column;gap:4px;align-items:center;justify-content:center;cursor:pointer}
.nav-toggle span{width:18px;height:2px;background:var(--ink);border-radius:2px}
.menu{margin-left:auto;display:flex;align-items:center;gap:24px;font-size:14.5px;font-weight:500}
.menu a{color:var(--ink-2);text-decoration:none}
.menu a:hover{color:var(--ink);text-decoration:none}
.menu-cta{font-weight:700;background:var(--ink);color:#fff!important;padding:9px 16px;border-radius:10px;box-shadow:var(--sh-sm)}
.menu-cta:hover{color:#fff!important}
/* lang switcher */
.langsw{position:relative}
.lsw-cur{font-family:var(--mono);font-size:12.5px;color:var(--ink-2);border:1px solid var(--line);background:var(--paper-2);padding:7px 11px;border-radius:9px;cursor:pointer}
.lsw-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:170px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-pop);padding:6px;display:none;flex-direction:column;z-index:30}
.langsw:hover .lsw-menu,.langsw:focus-within .lsw-menu{display:flex}
.lsw-menu a{padding:9px 12px;border-radius:8px;font-size:14px;color:var(--ink-2);text-decoration:none}
.lsw-menu a:hover{background:var(--em-soft);color:var(--ink)}
.lsw-menu a.on{color:var(--em);font-weight:700}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;text-decoration:none;font-family:var(--cn);
  font-weight:800;font-size:15.5px;padding:14px 20px;border-radius:13px;transition:transform .09s,box-shadow .18s;cursor:pointer;border:none}
.btn:hover{text-decoration:none}
.btn svg{width:17px;height:17px;flex:none}
.btn-primary{background:linear-gradient(180deg,var(--gold-1),var(--gold-2));color:var(--gold-ink);box-shadow:var(--sh-gold);border:1px solid rgba(180,135,0,.35)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 32px -10px rgba(234,174,0,.8)}
.btn-wallet{background:#fff;color:var(--ink);border:1.5px solid var(--ink)}
.btn-wallet:hover{background:var(--paper-2)}
.btn-ghost{background:var(--card);color:var(--ink);border:1px solid var(--line);box-shadow:var(--sh-sm)}
.btn-ghost:hover{background:var(--paper-2)}

/* ===== hero (index) ===== */
.hero{position:relative;z-index:1;max-width:var(--wrap);margin:0 auto;padding:34px 26px 60px;
  display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;font-weight:600;
  letter-spacing:.03em;color:var(--em);background:var(--em-soft);padding:7px 13px;border-radius:999px;border:1px solid rgba(13,122,82,.14)}
.eyebrow .pulse{width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:0 0 0 0 rgba(19,162,102,.5);animation:p 2.2s infinite}
@keyframes p{70%{box-shadow:0 0 0 8px rgba(19,162,102,0)}100%{box-shadow:0 0 0 0 rgba(19,162,102,0)}}
.hero h1{font-family:var(--cn);font-weight:900;font-size:clamp(33px,4.6vw,54px);line-height:1.1;letter-spacing:-.025em;margin:20px 0 0}
.hero h1 .hl{color:var(--em);position:relative;white-space:nowrap}
.hero h1 .hl svg{position:absolute;left:-2%;right:-2%;bottom:-.16em;width:104%;height:.4em}
.hero .sub{font-size:17px;color:var(--ink-2);margin-top:20px;max-width:31em;line-height:1.62}
.hero .sub b{color:var(--ink);font-weight:700}

/* conversion card (§9) */
.convert{margin-top:28px;position:relative;background:linear-gradient(180deg,#fff,#FCFDFB);
  border:1px solid var(--line);border-radius:20px;box-shadow:var(--sh-card);padding:8px;max-width:520px}
.convert__inner{border-radius:14px;padding:18px 18px 16px}
.convert__head{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.tag{font-size:11.5px;font-weight:700;letter-spacing:.02em;color:var(--gold-ink);
  background:linear-gradient(180deg,var(--gold-1),var(--gold-2));padding:5px 11px;border-radius:7px;box-shadow:0 3px 8px -3px rgba(234,174,0,.6)}
.convert__head .hint{font-size:12.5px;color:var(--ink-3);font-weight:500}
.ticket{position:relative;display:flex;align-items:center;gap:14px;background:var(--em-soft);
  border:1.5px dashed rgba(13,122,82,.45);border-radius:13px;padding:13px 16px}
.ticket::before,.ticket::after{content:"";position:absolute;top:50%;width:16px;height:16px;border-radius:50%;background:var(--paper);transform:translateY(-50%)}
.ticket::before{left:-9px}.ticket::after{right:-9px}
.ticket .lab{font-size:11px;color:var(--em);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.ticket .val{font-family:var(--mono);font-weight:700;font-size:25px;letter-spacing:.06em;color:var(--ink);line-height:1.15}
.copy{margin-left:auto;display:flex;align-items:center;gap:7px;border:none;background:var(--ink);color:#fff;
  font-family:var(--cn);font-weight:600;font-size:13px;padding:10px 14px;border-radius:9px;cursor:pointer;box-shadow:var(--sh-sm)}
.copy:active{transform:translateY(1px)}.copy svg{width:14px;height:14px}
.benefit{display:flex;align-items:baseline;gap:10px;margin:15px 2px 0}
.benefit .big{font-family:var(--sans);font-weight:800;font-size:34px;letter-spacing:-.02em;color:var(--em);line-height:1}
.benefit .txt{font-size:14.5px;color:var(--ink-2);font-weight:500}
.benefit .txt b{color:var(--ink);font-weight:700}
.ctas{display:flex;gap:11px;margin-top:16px}
.ctas .btn{flex:1}
.btn-wallet.btn{flex:0 0 auto;padding-left:18px;padding-right:18px}
.note{font-size:12px;color:var(--ink-3);margin-top:12px;line-height:1.55;padding:0 2px}
.note b{color:var(--ink-2);font-weight:700}
.trust{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:12.5px;color:var(--ink-2);flex-wrap:wrap}
.trust .b{display:inline-flex;align-items:center;gap:6px;background:var(--paper-2);border:1px solid var(--line);padding:6px 11px;border-radius:8px;font-weight:600}
.trust .b svg{width:13px;height:13px;color:var(--em)}

/* ===== markets board (dark premium showcase) ===== */
.board{position:relative;background:linear-gradient(168deg,#16241D 0%,#0B100A 100%);
  border:1px solid rgba(255,255,255,.08);border-radius:22px;overflow:hidden;color:#EEF2EA;
  box-shadow:0 2px 6px rgba(8,16,11,.4), 0 44px 74px -30px rgba(8,20,13,.62), 0 0 0 1px rgba(40,224,140,.04)}
.board::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(440px 200px at 84% -10%, rgba(40,224,140,.16), transparent 70%)}
.board__tabs{position:relative;display:flex;gap:4px;padding:8px;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.06)}
.board__tabs button{flex:1;border:none;background:none;font-family:var(--cn);font-weight:600;font-size:13px;color:#9DB0A4;padding:10px 8px;cursor:pointer;border-radius:9px}
.board__tabs button.on{color:#fff;background:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.board__live{position:absolute;top:17px;right:18px;z-index:2;display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;color:#34E08C;font-weight:600;letter-spacing:.08em}
.board__live i{width:6px;height:6px;border-radius:50%;background:#34E08C;box-shadow:0 0 8px #34E08C;animation:blink 1.6s infinite}
.board__body{position:relative;padding:22px}
.tk{display:flex;align-items:center;gap:13px}
.tk__logo{width:46px;height:46px;border-radius:13px;background:linear-gradient(155deg,#1E3329,#0C140E);color:#fff;display:grid;place-items:center;font-family:var(--mono);font-weight:700;font-size:15px;border:1px solid rgba(255,255,255,.10);flex:none}
.tk__name{font-weight:700;font-size:16.5px;color:#fff}
.tk__sub{font-family:var(--mono);font-size:12px;color:#8DA296}
.tk__price{margin-left:auto;text-align:right}
.tk__price .p{font-family:var(--mono);font-weight:700;font-size:23px;letter-spacing:-.01em;color:#fff}
.tk__price .chg{font-family:var(--mono);font-size:12.5px;font-weight:600;color:#34E08C}
.spark{margin:16px 0 2px;width:100%;height:74px;display:block}
.parity{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;background:rgba(40,224,140,.08);border:1px solid rgba(40,224,140,.18);border-radius:12px;padding:11px 14px}
.parity .side{font-family:var(--mono);font-size:13px;font-weight:600;color:#EEF2EA}
.parity .side small{display:block;font-family:var(--cn);font-size:10.5px;color:#8DA296;font-weight:500;letter-spacing:0}
.parity .eq{font-family:var(--mono);font-size:12px;font-weight:700;color:#34E08C;background:rgba(255,255,255,.06);border:1px solid rgba(40,224,140,.25);padding:4px 9px;border-radius:7px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.cell{border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:11px 13px;background:rgba(255,255,255,.035)}
.cell .k{font-size:11.5px;color:#8DA296}
.cell .v{font-family:var(--mono);font-weight:700;font-size:15.5px;margin-top:3px;color:#fff}
.cell .v.g{color:#34E08C}
.board__foot{position:relative;padding:11px 22px;background:rgba(0,0,0,.28);border-top:1px solid rgba(255,255,255,.06);font-size:11px;color:#8DA296;font-family:var(--mono);display:flex;justify-content:space-between;align-items:center}

/* ===== homepage sections ===== */
.section{position:relative;z-index:1;padding:46px 0}
.section--alt{background:linear-gradient(180deg,rgba(231,243,237,.5),rgba(231,243,237,0))}
.sec-head{max-width:640px;margin-bottom:28px}
.sec-eyebrow{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.1em;color:var(--em);text-transform:uppercase}
.sec-head h1,.sec-head h2{font-size:clamp(24px,3vw,34px);font-weight:800;margin-top:8px}
.sec-head p{color:var(--ink-2);margin-top:10px;font-size:16px}
/* three-ways comparison cards */
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.way{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:var(--sh-sm);transition:transform .12s,box-shadow .18s}
.way:hover{transform:translateY(-3px);box-shadow:var(--sh-card)}
.way .badge{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11.5px;font-weight:700;color:var(--em);background:var(--em-soft);padding:5px 10px;border-radius:7px}
.way h3{font-size:18px;margin:14px 0 8px}
.way p{font-size:14.5px;color:var(--ink-2);line-height:1.6}
.way ul{list-style:none;margin:14px 0 0;font-size:13.5px;color:var(--ink-2)}
.way li{display:flex;gap:8px;padding:4px 0}
.way li::before{content:"›";color:var(--em);font-weight:800}
.way .more{display:inline-block;margin-top:14px;font-weight:700;font-size:14px}
/* generic card grid (articles/tools) */
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:20px;box-shadow:var(--sh-sm);transition:transform .12s,box-shadow .18s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh-card)}
.card .cat{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--ink-3);text-transform:uppercase}
.card h3{font-size:17px;margin:9px 0 8px;color:var(--ink)}
.card p{font-size:14px;color:var(--ink-2);line-height:1.6;flex:1}
.card .meta{margin-top:14px;font-size:12.5px;color:var(--ink-3);font-family:var(--mono)}
.card.tool .ico{width:40px;height:40px;border-radius:11px;background:var(--em-soft);display:grid;place-items:center;color:var(--em);margin-bottom:6px}
.card.tool .ico svg{width:20px;height:20px}
/* index wide links hub */
.linkhub{columns:3;column-gap:30px}
.linkhub a{display:block;break-inside:avoid;padding:7px 0;font-size:14.5px;color:var(--ink-2);border-bottom:1px solid var(--line-2)}
.linkhub a:hover{color:var(--em);text-decoration:none}
/* faq */
.faq{max-width:820px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:13px;margin-bottom:10px;padding:4px 18px;box-shadow:var(--sh-sm)}
.faq summary{font-weight:700;padding:14px 0;cursor:pointer;font-size:16px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--em);font-weight:800}
.faq details[open] summary::after{content:"−"}
.faq details > p{padding:0 0 16px;color:var(--ink-2);font-size:15px}
/* cta band */
.ctaband{position:relative;z-index:1;margin:46px auto;max-width:var(--wrap);background:linear-gradient(165deg,#16241D,#0B100A);border-radius:22px;padding:40px 36px;color:#EEF2EA;box-shadow:var(--sh-pop);overflow:hidden}
.ctaband::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 200px at 88% 0%,rgba(40,224,140,.18),transparent 70%)}
.ctaband__in{position:relative;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.ctaband h2{font-size:26px;color:#fff}
.ctaband p{color:#9DB0A4;margin-top:8px;max-width:32em;font-size:15px}
.ctaband .code{font-family:var(--mono);font-weight:700;color:#34E08C;font-size:18px;letter-spacing:.08em}

/* ===== article ===== */
.crumbs{font-size:13px;color:var(--ink-3);padding:18px 0 0}
.crumbs a{color:var(--ink-2)}
.article{position:relative;z-index:1}
.article-head{max-width:760px;margin:18px 0 8px}
.article-head .cat{display:inline-block;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--em);background:var(--em-soft);padding:5px 11px;border-radius:7px;text-transform:uppercase}
.article-head h1{font-size:clamp(27px,3.8vw,42px);font-weight:900;margin:16px 0 0}
.standfirst{font-size:18px;color:var(--ink-2);margin-top:16px;line-height:1.6}
.byline{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;font-size:13px;color:var(--ink-3);font-family:var(--mono);padding-bottom:8px;border-bottom:1px solid var(--line)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:44px;margin-top:28px;padding-bottom:40px}
.layout.has-aside .main{min-width:0}
.cover-fig{margin:0 0 26px}
.cover-fig img{width:100%;border-radius:16px;border:1px solid var(--line);box-shadow:var(--sh-sm)}
.cover-fig figcaption{font-size:13px;color:var(--ink-3);margin-top:10px;text-align:center}
.toc{background:var(--paper-2);border:1px solid var(--line);border-radius:13px;padding:16px 20px;margin-bottom:26px}
.toc strong{font-size:13px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;font-family:var(--mono)}
.toc ol{margin:10px 0 0;padding-left:20px;font-size:14.5px}
.toc li{padding:3px 0}
.toc a{color:var(--ink-2)}.toc a:hover{color:var(--em)}
.prose{font-size:16.5px;color:#1d231f;line-height:1.8;max-width:720px}
.prose p{margin:0 0 18px}
.prose h2{font-size:25px;font-weight:800;margin:38px 0 14px;scroll-margin-top:20px}
.prose h3{font-size:19px;font-weight:700;margin:26px 0 10px}
.prose ul,.prose ol{margin:0 0 18px;padding-left:24px}
.prose li{margin:7px 0}
.prose strong{color:var(--ink);font-weight:700}
.prose a{color:var(--em);font-weight:600;text-decoration:underline;text-decoration-color:rgba(13,122,82,.35);text-underline-offset:3px}
.prose blockquote{margin:0 0 20px;padding:14px 20px;background:var(--em-soft);border-left:4px solid var(--em);border-radius:0 10px 10px 0;color:#16382a}
.prose table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:14.5px}
.prose th,.prose td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.prose th{background:var(--paper-2);font-weight:700}
.prose td .mono,.prose .num{font-family:var(--mono)}
.callout{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--gold-2);border-radius:0 12px 12px 0;padding:16px 20px;margin:0 0 22px;box-shadow:var(--sh-sm)}
.callout strong{display:block;margin-bottom:6px}
.callout--risk{border-left-color:var(--down)}
.callout--tip{border-left-color:var(--em)}
.handson{background:var(--paper-2);border:1px dashed var(--line);border-radius:13px;padding:18px 20px;margin:0 0 22px}
.handson .lab{font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.06em;color:var(--em);text-transform:uppercase}
.refs{margin-top:30px;padding-top:18px;border-top:1px solid var(--line)}
.refs h2{font-size:18px;margin-bottom:10px}
.refs ul{padding-left:20px;font-size:14.5px;color:var(--ink-2)}
/* article inline CTA */
.inline-cta{background:linear-gradient(165deg,#16241D,#0B100A);border-radius:16px;padding:22px 24px;margin:26px 0;color:#EEF2EA;position:relative;overflow:hidden}
.inline-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(360px 160px at 90% 0%,rgba(40,224,140,.16),transparent 70%)}
.inline-cta__in{position:relative}
.inline-cta h3{color:#fff;font-size:18px}
.inline-cta p{color:#9DB0A4;font-size:14px;margin:8px 0 14px}
.inline-cta .code{font-family:var(--mono);color:#34E08C;font-weight:700;letter-spacing:.06em}
.inline-cta .btn{margin-top:4px}
/* aside */
.aside{position:sticky;top:20px;align-self:start}
.aside .box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:16px;box-shadow:var(--sh-sm)}
.aside h4{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);font-family:var(--mono);margin-bottom:12px}
.aside .rel a{display:block;padding:8px 0;font-size:14px;color:var(--ink-2);border-bottom:1px solid var(--line-2)}
.aside .rel a:hover{color:var(--em);text-decoration:none}
.aside .convert{margin-top:0;max-width:none}

/* ===== tools ===== */
.tool-wrap{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:8px 26px 50px}
.tool-head{text-align:center;margin:24px 0 26px}
.tool-head h1{font-size:clamp(26px,3.4vw,38px);font-weight:900}
.tool-head p{color:var(--ink-2);margin-top:12px;font-size:16px}
.tool-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--sh-card)}
.field{margin-bottom:18px}
.field label{display:block;font-size:14px;font-weight:600;color:var(--ink-2);margin-bottom:7px}
.field .hint{font-weight:400;color:var(--ink-3);font-size:12.5px}
.field input,.field select{width:100%;font-family:var(--mono);font-size:17px;padding:13px 15px;border:1.5px solid var(--line);border-radius:11px;background:var(--paper-2);color:var(--ink);transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus{outline:none;border-color:var(--em);box-shadow:0 0 0 4px var(--em-soft)}
/* 键盘焦点环(品牌化 · 仅键盘可见,鼠标点击不触发)*/
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,summary:focus-visible{outline:2.5px solid var(--em);outline-offset:3px;border-radius:6px}
.btn:focus-visible,.copy:focus-visible,.menu-cta:focus-visible,.nav-cta:focus-visible{outline-offset:4px}
.board__tabs button:focus-visible,.board__live~*:focus-visible{outline-color:#34E08C}
.field input:focus-visible,.field select:focus-visible{outline:none}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.seg{display:flex;gap:6px;background:var(--paper-2);border:1px solid var(--line);border-radius:11px;padding:4px}
.seg button{flex:1;border:none;background:none;padding:9px;border-radius:8px;font-family:var(--cn);font-weight:600;font-size:14px;color:var(--ink-2);cursor:pointer}
.seg button.on{background:var(--card);color:var(--ink);box-shadow:var(--sh-sm)}
/* premium result panel (dark, big numbers, viz) */
.result{margin-top:22px;background:linear-gradient(168deg,#16241D,#0B100A);border-radius:16px;padding:24px;color:#EEF2EA;position:relative;overflow:hidden}
.result::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 180px at 85% -10%,rgba(40,224,140,.16),transparent 70%)}
.result__in{position:relative}
.result .rlab{font-size:12px;color:#8DA296;font-family:var(--mono);letter-spacing:.04em}
.result .rbig{font-family:var(--mono);font-weight:700;font-size:42px;color:#fff;line-height:1.1;margin:6px 0}
.result .rbig.g{color:#34E08C}.result .rbig.r{color:#FF8585}
.result .rrow{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid rgba(255,255,255,.08);font-size:14px;color:#C7D2CB}
.result .rrow .v{font-family:var(--mono);color:#fff;font-weight:600}
.result .bar{height:12px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin:6px 0}
.result .bar > span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#15A268,#34E08C)}
.result .gauge{font-family:var(--mono);font-size:13px;color:#8DA296}
.tool-note{font-size:12.5px;color:var(--ink-3);margin-top:16px;line-height:1.6}

/* ===== generic content page (compliance/hub) ===== */
.page{position:relative;z-index:1;max-width:820px;margin:0 auto;padding:8px 26px 56px}
.page h1{font-size:clamp(26px,3.4vw,38px);font-weight:900;margin:24px 0 8px}
.page .lead{font-size:17px;color:var(--ink-2);margin-bottom:20px}
.page h2{font-size:22px;font-weight:800;margin:30px 0 12px}
.page p{margin:0 0 16px;font-size:16px;color:#1d231f;line-height:1.8}
.page ul{margin:0 0 16px;padding-left:24px}
.page li{margin:7px 0}
.page a{font-weight:600;text-decoration:underline}

/* ===== footer ===== */
.foot{position:relative;z-index:1;background:#0C100D;color:#9DB0A4;margin-top:30px;padding:44px 0 30px}
.foot .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
.foot .fbrand .zh{font-family:var(--sans);font-weight:800;font-size:19px;color:#fff}
.foot .fbrand p{font-size:13px;margin-top:10px;max-width:24em;line-height:1.7}
.foot h5{color:#fff;font-size:13px;font-weight:700;margin-bottom:12px}
.foot a{display:block;color:#9DB0A4;font-size:13.5px;padding:5px 0;text-decoration:none}
.foot a:hover{color:#fff}
.foot .legal{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.08);margin-top:14px;padding-top:18px;font-size:12px;color:#6E7A72;line-height:1.7}

/* ===== responsive ===== */
@media(max-width:980px){
  .hero{grid-template-columns:1fr;gap:30px;padding-top:24px}
  .board{order:2}
  .layout{grid-template-columns:1fr;gap:0}
  .aside{position:static;margin-top:20px}
  .ways{grid-template-columns:1fr}
  .linkhub{columns:2}
  .foot .wrap{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .nav-toggle{display:flex}
  .menu{display:none;position:absolute;top:72px;left:14px;right:14px;flex-direction:column;align-items:stretch;gap:4px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;box-shadow:var(--sh-pop);z-index:40}
  .menu.open{display:flex}
  .menu a{padding:11px 12px;border-radius:9px}
  .menu a:hover{background:var(--paper-2)}
  .langsw{margin-top:4px}
  .lsw-menu{position:static;display:flex;box-shadow:none;border:none;padding:0;margin-top:4px}
  .field-row{grid-template-columns:1fr}
}
@media(max-width:400px){
  .wrap,.head,.hero{padding-left:16px;padding-right:16px}
  .hero{padding-top:14px}
  .hero h1{font-size:29px;margin-top:11px;line-height:1.08}
  .hero .sub{font-size:14.5px;margin-top:11px;line-height:1.5}
  .convert{margin-top:15px}
  .convert__inner{padding:15px 15px 14px}
  .convert__head{margin-bottom:11px}
  .ticket .val{font-size:21px}
  .benefit{margin-top:12px}
  .benefit .big{font-size:30px}
  .ctas{flex-wrap:wrap;margin-top:13px}.ctas .btn{flex:1 0 100%}
  .result .rbig{font-size:34px}
  .trust{margin-top:14px}
}

/* 印地语 Devanagari 字体作用域(仅 hi 页;数字/价格仍用等宽 mono) */
html[lang="hi"],html[lang="hi"] body,html[lang="hi"] h1,html[lang="hi"] h2,html[lang="hi"] h3,html[lang="hi"] .hero h1,html[lang="hi"] .prose,html[lang="hi"] .menu,html[lang="hi"] .btn,html[lang="hi"] .standfirst{font-family:'Noto Sans Devanagari','Hanken Grotesk','Noto Sans SC',system-ui,sans-serif}

/* 窄手机隐藏顶部装饰跑马灯(audit item16:ticker 移动隐藏)*/
@media(max-width:560px){.tape{display:none}}