/* ===== fintech-clean · 金融科技 ===== */
:root{
  --bg:#f7f9fb; --card:#ffffff; --card2:#f3f6f9;
  --line:rgba(20,40,60,.1); --line2:rgba(20,40,60,.18);
  --ink:#0f1c2b; --sub:#5a6a7b; --dim:#93a1b1; --green:#16a36a; --blue:#2f6df6;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono",Consolas,monospace;
  --maxw:1000px; --r:14px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0b1016; --card:#121a22; --card2:#172029;
    --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.16);
    --ink:#eaf1f8; --sub:#9fb0bf; --dim:#5e7080; --green:#2bd48b; --blue:#5b8cff;
    color-scheme:dark;
  }
}

*{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.6;min-height:100vh;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--blue);color:#fff;}
kbd{font-family:var(--mono);font-size:11px;background:var(--card2);border:1px solid var(--line2);border-radius:5px;padding:1px 6px;color:var(--ink);}

.shell{max-width:var(--maxw);margin:0 auto;padding:calc(16px + env(safe-area-inset-top)) clamp(16px,4vw,30px) calc(40px + env(safe-area-inset-bottom));}

/* status / announcement */
.status{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;}
.status-badge{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.06em;color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent);border-radius:999px;padding:4px 10px;flex:none;}
.sb-dot{width:7px;height:7px;border-radius:999px;background:var(--green);box-shadow:0 0 8px var(--green);}
.status p{flex:1;font-size:12.5px;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.status-clk{font-family:var(--mono);font-size:12.5px;color:var(--dim);flex:none;}

/* top / header */
.top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 2px;}
.logo{display:flex;align-items:center;gap:10px;font-size:clamp(18px,4vw,22px);font-weight:700;letter-spacing:-.01em;}
.logo-mk{width:30px;height:30px;border-radius:9px;background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green);display:grid;place-items:center;flex:none;}
.logo-mk svg{width:18px;height:18px;}
.logo-mk.small{width:18px;height:18px;border-radius:6px;}
.logo-mk.small svg{width:12px;height:12px;}
.top-r{display:flex;align-items:center;gap:12px;}
.secure{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--sub);}
.secure svg{width:15px;height:15px;color:var(--green);}
.theme{width:40px;height:40px;border-radius:11px;cursor:pointer;background:var(--card);border:1px solid var(--line2);color:var(--ink);display:grid;place-items:center;transition:.22s;}
.theme svg{width:18px;height:18px;}
.theme:hover{color:var(--blue);}

/* main */
section{margin-top:clamp(20px,3.5vw,32px);}

.hero{padding:clamp(20px,5vw,44px) 2px;}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--blue);margin-bottom:14px;}
.hero h1{font-size:clamp(36px,9vw,68px);font-weight:800;line-height:1.02;letter-spacing:-.03em;word-break:break-word;}
.hero-p{max-width:600px;margin-top:18px;color:var(--sub);font-size:clamp(14.5px,2.6vw,17px);}

/* metric / main domain */
.metric{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,4vw,32px);}
.metric-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;}
.metric-key{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--dim);}
.metric-live{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--green);}
.ml-dot{width:7px;height:7px;border-radius:999px;background:var(--green);box-shadow:0 0 8px var(--green);}
.metric-domain{font-size:clamp(24px,6vw,46px);font-weight:700;letter-spacing:-.02em;margin:14px 0 14px;word-break:break-all;}
.metric-bar{height:6px;background:var(--card2);border-radius:999px;overflow:hidden;margin-bottom:22px;}
.metric-bar span{display:block;height:100%;width:96%;background:linear-gradient(90deg,var(--green),var(--blue));border-radius:999px;}
.metric-act{display:flex;flex-wrap:wrap;align-items:center;gap:12px;}
.cta{font-family:var(--sans);font-size:14px;font-weight:600;padding:12px 24px;cursor:pointer;border-radius:11px;transition:.18s;}
.cta-go{background:var(--ink);color:var(--bg);border:1px solid var(--ink);}
.cta-go:hover{background:var(--blue);border-color:var(--blue);color:#fff;}
.cta-cp{background:transparent;color:var(--ink);border:1px solid var(--line2);}
.cta-cp:hover{border-color:var(--ink);}
.metric-save{font-family:var(--mono);font-size:12px;color:var(--sub);cursor:pointer;border-bottom:1px dashed var(--line2);}
.metric-save:hover{color:var(--blue);}

/* panel */
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,3.5vw,28px);}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line);}
.panel-h h2{font-size:clamp(17px,3.6vw,22px);font-weight:700;}
.panel-tag{font-family:var(--mono);font-size:11.5px;color:var(--sub);background:var(--card2);border-radius:999px;padding:4px 11px;}

/* ledger / backups */
.ledger{display:grid;gap:2px;}
.lrow{display:flex;align-items:center;gap:14px;padding:14px 10px;border-radius:9px;transition:.16s;}
.lrow:hover{background:var(--card2);}
.lrow-n{font-family:var(--mono);font-size:12.5px;color:var(--dim);}
.lrow-h{flex:1;font-size:clamp(13.5px,3.2vw,16px);word-break:break-all;}
.lrow-ok{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--green);}
.lrow-cp{background:transparent;border:1px solid var(--line2);color:var(--ink);font-size:12px;padding:6px 13px;border-radius:8px;cursor:pointer;transition:.16s;}
.lrow-cp:hover{background:var(--ink);color:var(--bg);border-color:var(--ink);}

/* guides / notice */
.guides{display:grid;gap:2px;}
.guide{display:flex;gap:14px;padding:16px 10px;border-radius:9px;transition:.16s;}
.guide:hover{background:var(--card2);}
.guide-n{font-family:var(--mono);font-size:13px;color:var(--blue);flex:none;}
.guide b{display:block;margin-bottom:4px;}
.guide p{color:var(--sub);font-size:13.5px;}
.callout{display:flex;align-items:center;gap:12px;margin-top:14px;background:var(--card2);border-radius:11px;padding:14px 18px;color:var(--sub);font-size:13.5px;}
.callout svg{width:20px;height:20px;color:var(--blue);flex:none;}
.callout strong{color:var(--ink);}

/* contacts */
.contacts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.contact{display:flex;flex-direction:column;gap:6px;background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:20px;cursor:pointer;transition:.18s;}
.contact:hover{border-color:var(--blue);transform:translateY(-2px);}
.contact-ic{width:40px;height:40px;border-radius:11px;background:var(--card);border:1px solid var(--line);display:grid;place-items:center;color:var(--blue);margin-bottom:8px;}
.contact-ic svg{width:19px;height:19px;}
.contact-k{font-size:12px;color:var(--dim);}
.contact-v{font-size:15px;font-weight:600;word-break:break-all;}

/* footer */
.foot{margin-top:clamp(30px,5vw,46px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:20px;border-top:1px solid var(--line);}
.foot-id{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:14px;}
.foot nav{display:flex;flex-wrap:wrap;gap:16px;}
.foot nav a{color:var(--sub);font-size:13px;transition:.16s;}
.foot nav a:hover{color:var(--blue);}
.foot small{color:var(--dim);font-size:12.5px;width:100%;}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(26px + env(safe-area-inset-bottom));transform:translate(-50%,16px);z-index:60;opacity:0;pointer-events:none;display:inline-flex;align-items:center;gap:9px;
  background:var(--card);border:1px solid var(--green);border-radius:11px;padding:12px 22px;font-size:14px;color:var(--ink);box-shadow:0 18px 40px -20px rgba(0,0,0,.4);transition:.3s cubic-bezier(.2,.8,.2,1);}
.t-dot{width:8px;height:8px;border-radius:999px;background:var(--green);}
.toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto;}

/* reveal */
.fade{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.2,1);}
.fade.on{opacity:1;transform:none;}

@media (max-width:760px){.contacts{grid-template-columns:1fr;}}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
  .fade{opacity:1;transform:none;}
}