:root{
    --bg:#07090d; --panel:#0d1117; --panel2:#11161f; --border:#1c2330;
    --text:#e6edf3; --muted:#8b98a9; --muted2:#5f6b7d;
    --accent:#22d3ee; --accent2:#0ea5e9;
    --green:#22c55e; --red:#ef4444; --amber:#f5b50a;
    --mono:"SFMono-Regular","JetBrains Mono",Consolas,"Courier New",monospace;
    --maxw:1180px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;font-family:"Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
    background:var(--bg);color:var(--text);line-height:1.6}
  a{color:inherit;text-decoration:none}
  button{font-family:inherit;cursor:pointer}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
  .mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
  .up{color:var(--green)} .down{color:var(--red)}

  .topbar{background:linear-gradient(90deg,#04222c,#072c2a,#04222c);color:#8ff0e0;
    font-size:12.5px;padding:7px 14px;text-align:center;border-bottom:1px solid var(--border)}
  .topbar b{color:#fff}

  header{position:sticky;top:0;z-index:50;background:rgba(7,9,13,.92);
    border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}
  .header-inner{max-width:var(--maxw);margin:0 auto;padding:12px 20px;
    display:flex;align-items:center;gap:18px;flex-wrap:wrap}
  .logo{display:flex;align-items:center;gap:10px}
  .logo-mark{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
    background:linear-gradient(135deg,var(--accent),var(--accent2));color:#04141c;
    font-weight:900;font-size:18px}
  .logo b{font-size:17px;letter-spacing:.3px}
  .logo small{display:block;font-size:10px;letter-spacing:2px;color:var(--muted)}
  nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
  nav a{padding:8px 13px;border-radius:8px;font-size:14px;font-weight:600;color:var(--muted)}
  nav a:hover{color:var(--text);background:var(--panel2)}

  .ticker{overflow:hidden;border-bottom:1px solid var(--border);background:var(--panel)}
  .ticker-track{display:flex;width:max-content;animation:tick 45s linear infinite;padding:9px 0}
  .ticker-track span{padding:0 26px;font-size:13px;white-space:nowrap}
  .ticker-track b{font-weight:600}
  @keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--border);
    background:radial-gradient(900px 460px at 78% 15%,rgba(34,211,238,.12),transparent 60%),
      radial-gradient(700px 420px at 8% 90%,rgba(245,181,10,.08),transparent 60%),#080b11}
  .hero .wrap{padding:52px 20px 46px}
  .hero-badge{display:inline-flex;align-items:center;gap:7px;background:rgba(34,211,238,.12);
    border:1px solid rgba(34,211,238,.3);color:var(--accent);padding:5px 12px;
    border-radius:999px;font-size:12.5px;font-weight:700}
  .pulse{width:8px;height:8px;border-radius:50%;background:var(--green);
    box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:pl 1.8s infinite}
  @keyframes pl{0%{box-shadow:0 0 0 0 rgba(34,197,94,.5)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
  .hero h1{margin:18px 0 12px;font-size:clamp(30px,5vw,50px);line-height:1.08;letter-spacing:-1px}
  .hero h1 em{font-style:normal;color:var(--accent)}
  .hero .lead{color:var(--muted);font-size:16px;max-width:620px;margin:0 0 22px}
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;
    padding:0 22px;border-radius:10px;font-weight:700;font-size:15px;border:1px solid transparent}
  .btn-primary{background:var(--accent);color:#04141c}
  .btn-ghost{border-color:var(--border);color:var(--text)}
  .hero-stats{display:flex;flex-wrap:wrap;gap:28px;margin-top:32px}
  .stat b{display:block;font-size:24px;font-family:var(--mono)}
  .stat span{color:var(--muted);font-size:13px}

  .section{padding:50px 0}
  .section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
  .eyebrow{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase}
  .section-head h2{margin:4px 0 0;font-size:26px}
  .countdown{font-family:var(--mono);color:var(--muted);font-size:13px;display:flex;align-items:center;gap:7px}
  .countdown b{color:var(--accent)}

  .panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden}
  .table-wrap{overflow-x:auto}
  table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:760px}
  th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--border);white-space:nowrap}
  th{color:var(--muted);font-weight:600;font-size:12px;letter-spacing:.3px;background:var(--panel2);position:sticky;top:0}
  tr:last-child td{border-bottom:0}
  tr:hover td{background:rgba(255,255,255,.02)}
  .coin{display:flex;align-items:center;gap:10px;font-weight:700}
  .coin .ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
    font-size:12px;font-weight:800;background:var(--panel2);border:1px solid var(--border)}
  .spread{font-family:var(--mono);font-weight:700}
  .profit{font-family:var(--mono);color:var(--green);font-weight:700}
  .profit.neg{color:var(--red)}
  .badge{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px}
  .b-arb{background:rgba(34,197,94,.14);color:var(--green)}
  .b-low{background:rgba(239,68,68,.14);color:var(--red)}
  .note{color:var(--muted2);font-size:12px;padding:12px 14px;border-top:1px solid var(--border)}

  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
  .calc{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:24px}
  .calc label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin:0 0 7px}
  .calc input,.calc select{width:100%;height:46px;background:var(--bg);border:1px solid var(--border);
    border-radius:10px;color:var(--text);font-size:15px;padding:0 13px;outline:none}
  .calc input:focus,.calc select:focus{border-color:var(--accent)}
  .calc .row{margin-bottom:16px}
  .result{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:16px;margin-top:6px}
  .result .line{display:flex;justify-content:space-between;font-size:14px;padding:6px 0;color:var(--muted)}
  .result .line b{color:var(--text);font-family:var(--mono)}
  .result .net{font-size:20px;font-weight:800;color:var(--green);font-family:var(--mono)}
  .result .net.neg{color:var(--red)}

  .tabs{display:flex;gap:6px;border-bottom:1px solid var(--border);margin-bottom:0;flex-wrap:wrap}
  .tab{padding:11px 16px;background:none;border:0;color:var(--muted);font-size:14px;font-weight:700;
    border-bottom:2px solid transparent}
  .tab.active{color:var(--text);border-color:var(--accent)}
  .tabpane{display:none;padding:20px 4px}
  .tabpane.active{display:block}
  .tabpane p,.tabpane li{color:var(--muted);font-size:14.5px}
  .tabpane h3{margin:0 0 10px;font-size:18px}

  .form-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:28px;max-width:640px;margin:0 auto}
  .form-card h2{margin:0 0 6px;font-size:22px}
  .form-card .sub{color:var(--muted);margin:0 0 18px;font-size:14px}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .field{display:flex;flex-direction:column;gap:6px}
  .field.full{grid-column:1/-1}
  .field label{font-size:13px;font-weight:600;color:var(--muted)}
  .field input{height:46px;background:var(--bg);border:1px solid var(--border);border-radius:10px;
    color:var(--text);font-size:14px;padding:0 13px;outline:none}
  .field input:focus{border-color:var(--accent)}

  .risk{background:rgba(245,181,10,.07);border:1px solid rgba(245,181,10,.25);border-radius:12px;
    padding:16px 18px;font-size:13px;color:#d8c48a}
  .risk b{color:var(--amber)}

  footer{border-top:1px solid var(--border);background:#080b11;margin-top:30px}
  .footer-inner{max-width:var(--maxw);margin:0 auto;padding:36px 20px 24px;display:flex;
    justify-content:space-between;gap:20px;flex-wrap:wrap}
  .footer-inner p{color:var(--muted);font-size:13px;max-width:560px;margin:0}
  .footer-inner nav{display:flex;gap:16px}
  .footer-inner nav a{color:var(--muted);font-size:13px;padding:0}
  .footer-bottom{border-top:1px solid #131a24;text-align:center;padding:16px 20px;
    color:var(--muted2);font-size:12px}

  /* 收益曲线 */
  .curve-stats{display:flex;gap:30px;flex-wrap:wrap;padding:4px 8px 14px}
  .curve-stats .stat b{font-size:28px}

  /* 我要套利 */
  .arb-fab{position:fixed;right:22px;bottom:22px;z-index:80;height:52px;padding:0 24px;
    border:none;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent2));
    color:#04141c;font-weight:800;font-size:15px;box-shadow:0 10px 32px rgba(34,211,238,.35)}
  .modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;
    background:rgba(3,5,8,.72);backdrop-filter:blur(4px)}
  .modal-card{position:relative;width:100%;max-width:460px;max-height:92vh;overflow:auto;
    background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:26px}
  .modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:9px;
    border:1px solid var(--border);background:var(--panel2);color:var(--text);font-size:16px;line-height:1}
  .modal h2{margin:0 0 6px;font-size:22px}
  .modal .sub{color:var(--muted);font-size:13.5px;margin:0 0 18px}
  .err{color:var(--red);font-size:13px;margin:10px 0 0}
  .success-box2{text-align:center;padding:24px 8px}
  .success-box2 .check{width:64px;height:64px;margin:0 auto 16px;border-radius:50%;
    background:var(--green);color:#04140c;display:grid;place-items:center;font-size:32px}
  .success-box2 h3{margin:0 0 8px}
  .success-box2 p{color:var(--muted);font-size:14px;margin:0}
  [hidden]{display:none!important}

  @media(max-width:900px){
    .grid2{grid-template-columns:1fr}
  }
  @media(max-width:700px){
    .header-inner{gap:10px}
    nav{margin-left:0;flex:1 0 100%;flex-wrap:nowrap;gap:2px;overflow-x:auto;scrollbar-width:thin}
    nav a{flex:0 0 auto;padding:7px 11px;font-size:13px}
  }
  @media(max-width:560px){
    .section{padding:36px 0}
    .form-grid{grid-template-columns:1fr}
    .hero .wrap{padding-top:40px}
    .hero .btn + .btn{margin-left:0!important;margin-top:10px}
    .hero-stats{gap:20px 26px}
  }
  @media(max-width:420px){
    .hero .btn{width:100%}
    .hero-stats{display:grid;grid-template-columns:1fr 1fr}
  }