/* WSHub 产品级共享样式；权威规范：../docs/WSHUB_VISUAL_STANDARD.md */

html.wshub{
  --bg:#0d1219; --bg-2:#111823; --paper:#151d29; --paper-2:#1a2432;
  --ink:#eef2f8; --ink-2:#a9b3c2; --ink-3:#a0abbd;
  --line:#26303f; --line-2:#1e2733;
  --brand:#6f9bff; --brand-strong:#1f4fd8; --brand-ink:#bcd0ff; --brand-soft:rgba(111,155,255,.12);
  --water:#5ec8d8; --water-soft:rgba(94,200,216,.12);
  --ok:#3fb97a; --ok-soft:rgba(63,185,122,.12);
  --warn:#d8a83c; --warn-soft:rgba(216,168,60,.12);
  --muted:#a0abbd; --muted-soft:rgba(255,255,255,.06);
  --error:#e8857a; --error-soft:rgba(232,133,122,.12); --focus:#9dbcff;
  --control-border:#65758d; --layout-width:1120px; --reading-width:760px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:22px; --space-section:56px;
  --text-body:15px; --text-small:13px; --text-caption:12px; --control-height:42px;
  --radius:16px; --radius-s:10px;
  --shadow:0 2px 6px rgba(0,0,0,.3),0 12px 34px rgba(0,0,0,.28);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
.wshub *{box-sizing:border-box}
.wshub [hidden]{display:none !important}
html.wshub{-webkit-text-size-adjust:100%}
.wshub body{margin:0;font:15px/1.75 var(--font);color:var(--ink);background:var(--bg);
  background-image:
    radial-gradient(1100px 520px at 85% -10%,rgba(31,79,216,.16),transparent 60%),
    radial-gradient(900px 480px at -10% 30%,rgba(94,200,216,.07),transparent 60%);
  background-attachment:fixed}
.wshub img{max-width:100%}
.wshub a{color:var(--brand);text-decoration:none}
.wshub a:hover{text-decoration:underline}
.wshub h1,.wshub h2,.wshub h3,.wshub h4{line-height:1.3;margin:0 0 .5em;letter-spacing:-.01em}
.wshub p{margin:0 0 .8em}
.wshub code{font-family:var(--mono);font-size:.88em;background:var(--muted-soft);padding:.1em .4em;border-radius:5px}
.wshub :focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}
.wshub ::selection{background:rgba(111,155,255,.35)}
.wshub .card,.wshub .panel,.wshub p,.wshub li,.wshub h1,.wshub h2,.wshub h3,.wshub .badge{overflow-wrap:anywhere}
.wshub .skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:#0d1219;padding:8px 14px;z-index:99;border-radius:0 0 8px 0}
.wshub .skip-link:focus{left:8px;top:8px}
.wshub .topbar{position:sticky;top:0;z-index:50;background:rgba(13,18,25,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-2)}
.wshub .topbar-inner{max-width:var(--layout-width);margin:0 auto;padding:0 22px;display:flex;align-items:center;gap:18px;min-height:60px;flex-wrap:wrap}
.wshub .brand{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--ink);font-size:17px;letter-spacing:.01em;white-space:nowrap}
.wshub .brand:hover{text-decoration:none}
.wshub .brand-logo{width:28px;height:28px;border-radius:7px;flex:none;box-shadow:0 0 0 1px rgba(255,255,255,.14);display:block}
.wshub .brand .sub{font-size:11px;font-weight:600;letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase;border-left:1px solid var(--line);padding-left:10px}
.wshub .topnav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto;align-items:center}
.wshub .topnav a{color:var(--ink-2);padding:7px 12px;border-radius:8px;font-size:14px;white-space:nowrap}
.wshub .topnav a:hover{background:var(--muted-soft);text-decoration:none;color:var(--ink)}
.wshub .topnav a[aria-current="page"]{color:var(--brand-ink);background:var(--brand-soft);font-weight:600}
.wshub .topnav .btn{margin-left:6px}
.wshub .demo-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--warn);background:var(--warn-soft);border:1px solid rgba(216,168,60,.35);padding:3px 10px;border-radius:999px;white-space:nowrap}
.wshub .demo-pill::before{content:"◆";font-size:9px}
.wshub .container{max-width:var(--layout-width);margin:0 auto;padding:30px 22px 80px}
.wshub .container-narrow{max-width:var(--reading-width)}
.wshub .eyebrow{font-size:12px;font-weight:700;letter-spacing:.22em;color:var(--ink-3);text-transform:uppercase;margin-bottom:10px}
.wshub .wave{display:block;width:120px;height:10px;margin-top:6px;color:var(--water)}
.wshub .hero{padding:64px 0 40px;position:relative}
.wshub .hero h1{font-size:clamp(40px,7vw,76px);font-weight:800;letter-spacing:-.02em;margin:0 0 4px}
.wshub .hero h1 .accent{background:linear-gradient(100deg,#9dbcff,#6f9bff 45%,#5ec8d8);-webkit-background-clip:text;background-clip:text;color:transparent}
.wshub .hero .lede{color:var(--ink-2);font-size:clamp(15px,2vw,18px);max-width:56ch;margin-top:14px}
.wshub .hero .kw{letter-spacing:.3em;font-size:13px;color:var(--ink-3);font-weight:600;margin-top:18px}
.wshub .hero-grid-lines{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(111,155,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(111,155,255,.06) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(70% 90% at 50% 20%,#000 30%,transparent 75%);
  mask-image:radial-gradient(70% 90% at 50% 20%,#000 30%,transparent 75%)}
.wshub .section{margin-top:56px}
.wshub .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.wshub .section-head h2{font-size:clamp(22px,3.2vw,30px);margin:0}
.wshub .section-head p{color:var(--ink-2);margin:0;max-width:56ch}
.wshub .card{background:linear-gradient(180deg,var(--paper),var(--bg-2));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;margin-bottom:16px}
.wshub .panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-s);padding:16px 18px}
.wshub .grid{display:grid;gap:18px}
.wshub .grid-2{grid-template-columns:repeat(2,1fr)}
.wshub .grid-3{grid-template-columns:repeat(3,1fr)}
.wshub .product{display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden;transition:border-color .2s,transform .2s,box-shadow .2s}
.wshub .product:hover{border-color:#33415a;transform:translateY(-2px)}
.wshub .product .glow{position:absolute;inset:auto -30% -60% -30%;height:70%;pointer-events:none;opacity:0;transition:opacity .25s;
  background:radial-gradient(60% 100% at 50% 100%,rgba(111,155,255,.18),transparent 70%)}
.wshub .product:hover .glow{opacity:1}
.wshub .product.soon{opacity:1}
.wshub .product-icon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:20px;flex:none;
  background:var(--brand-soft);border:1px solid rgba(111,155,255,.3);color:var(--brand-ink)}
.wshub .product.soon .product-icon{background:var(--muted-soft);border-color:var(--line);color:var(--ink-3)}
.wshub .product-head{display:flex;align-items:center;gap:13px}
.wshub .product-head h3{margin:0;font-size:18px}
.wshub .product-head .en{font-size:12px;color:var(--ink-3);letter-spacing:.08em}
.wshub .product p.desc{color:var(--ink-2);font-size:14px;margin:0;flex:1}
.wshub .product .meta{display:flex;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3)}
.wshub .product-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.wshub .badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;line-height:1.5;padding:3px 11px;border-radius:999px;border:1px solid transparent;white-space:nowrap}
.wshub .badge.ok{background:var(--ok-soft);color:var(--ok);border-color:rgba(63,185,122,.4)}
.wshub .badge.live{background:var(--brand-soft);color:var(--brand-ink);border-color:rgba(111,155,255,.4)}
.wshub .badge.live::before{content:"●";font-size:10px;animation:none}
.wshub .badge.soon{background:var(--muted-soft);color:var(--muted);border-color:var(--line)}
.wshub .badge.soon::before{content:"○";font-size:10px}
.wshub .badge.warn{background:var(--warn-soft);color:var(--warn);border-color:rgba(216,168,60,.35)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
@media (prefers-reduced-motion:reduce){
.wshub .badge.live::before{animation:none}}
.wshub .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14.5px/1.4 var(--font);padding:10px 18px;border-radius:10px;border:1px solid transparent;cursor:pointer;background:var(--brand-strong);color:#fff;text-decoration:none;transition:background .15s,box-shadow .15s,border-color .15s;min-height:var(--control-height)}
.wshub .btn:hover{background:#2b5ce6;text-decoration:none;box-shadow:0 0 0 1px rgba(111,155,255,.35),0 6px 20px rgba(31,79,216,.35)}
.wshub .btn.secondary{background:var(--paper-2);color:var(--ink);border-color:var(--line)}
.wshub .btn.secondary:hover{background:#212d3f;box-shadow:none;border-color:#33415a}
.wshub .btn.ghost{background:transparent;color:var(--brand);border-color:transparent}
.wshub .btn.ghost:hover{background:var(--brand-soft);box-shadow:none}
.wshub .btn[disabled],.wshub .btn[aria-disabled="true"]{background:var(--muted-soft);color:var(--ink-3);border-color:var(--line);cursor:not-allowed;pointer-events:none;box-shadow:none}
.wshub .btn-sm{padding:6px 12px;min-height:34px;font-size:13px}
.wshub label{font-weight:600;font-size:14px;display:block;margin-bottom:6px}
.wshub .hint{font-size:13px;color:var(--ink-3);font-weight:400;margin-top:5px}
.wshub input[type=text],.wshub input[type=email],.wshub input[type=password]{width:100%;font:15px/1.6 var(--font);color:var(--ink);background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:11px 14px}
.wshub input::placeholder{color:var(--ink-3)}
.wshub input:focus{border-color:var(--brand);outline:3px solid var(--focus)}
.wshub .field{margin-bottom:18px}
.wshub .field-err{color:var(--error);font-size:13px;margin-top:5px;font-weight:600}
.wshub .check{display:flex;gap:10px;align-items:center;font-weight:400;font-size:14px;color:var(--ink-2)}
.wshub .check input{width:17px;height:17px;flex:none;accent-color:var(--brand-strong)}
.wshub .login-wrap{min-height:calc(100vh - 60px);display:grid;place-items:center;padding:40px 20px}
.wshub .login-card{width:min(92vw,420px)}
.wshub .login-card h1{font-size:26px;margin-bottom:4px}
.wshub .login-card .sub{color:var(--ink-2);font-size:14px;margin-bottom:22px}
.wshub .login-logo{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.wshub .divider-or{display:flex;align-items:center;gap:12px;color:var(--ink-3);font-size:12.5px;margin:18px 0}
.wshub .divider-or::before,.wshub .divider-or::after{content:"";flex:1;height:1px;background:var(--line)}
.wshub .notice{border-radius:var(--radius-s);padding:13px 16px;font-size:14px;margin-bottom:16px;border:1px solid;display:flex;gap:10px;align-items:flex-start}
.wshub .notice .ic{flex:none;font-weight:700}
.wshub .notice.info{background:var(--brand-soft);border-color:rgba(111,155,255,.35);color:var(--brand-ink)}
.wshub .notice.warn{background:var(--warn-soft);border-color:rgba(216,168,60,.35);color:#e8c987}
.wshub .notice.muted{background:var(--muted-soft);border-color:var(--line);color:var(--ink-2)}
.wshub .sub-info{display:flex;gap:26px;flex-wrap:wrap;font-size:13px;color:var(--ink-3)}
.wshub .sub-info b{color:var(--ink-2);font-weight:600;display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px}
.wshub .sub-info span{font-size:14px;color:var(--ink)}
.wshub .avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#6f9bff,#5ec8d8);display:grid;place-items:center;font-weight:800;color:#0d1219;font-size:15px;flex:none}
.wshub .user-chip{display:flex;align-items:center;gap:10px}
.wshub table.clean{width:100%;border-collapse:collapse;font-size:14px}
.wshub table.clean th,.wshub table.clean td{text-align:left;padding:11px 13px;border-bottom:1px solid var(--line-2);vertical-align:top}
.wshub table.clean th{font-size:12.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.wshub .toast-wrap{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:10px;width:min(92vw,460px)}
.wshub .toast{background:#e8edf5;color:#141a24;border-radius:12px;padding:13px 17px;box-shadow:0 8px 30px rgba(0,0,0,.5);font-size:14px;display:flex;gap:10px;align-items:flex-start;animation:rise .25s ease}
.wshub .toast.ok{background:#3fb97a;color:#062316}
.wshub .toast.err{background:#e8857a;color:#3d0f0a}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
.wshub .toast{animation:none}}
.wshub .footer{border-top:1px solid var(--line-2);margin-top:60px;padding:26px 22px 44px;color:var(--ink-3);font-size:13px}
.wshub .footer-inner{max-width:var(--layout-width);margin:0 auto;display:flex;gap:14px;flex-wrap:wrap;justify-content:space-between;align-items:center}
.wshub .footer a{color:var(--ink-3)}
.wshub .footer a:hover{color:var(--ink-2)}
.wshub .muted{color:var(--ink-3)}
.wshub .small{font-size:13px}
.wshub .row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.wshub .spread{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap}
.wshub .mt{margin-top:16px}
.wshub .mb{margin-bottom:16px}


@media (max-width:860px){
.wshub .grid-3{grid-template-columns:1fr 1fr}
.wshub .grid-2{grid-template-columns:1fr}
}
@media (max-width:560px){
.wshub .grid-3{grid-template-columns:1fr}
.wshub .topbar-inner{gap:8px;padding:8px 14px}
.wshub .container{padding:20px 14px 60px}
.wshub .hero{padding:40px 0 26px}
.wshub .btn{width:100%}
.wshub .product-actions .btn,.wshub .topnav .btn{width:auto}
.wshub .spread{flex-direction:column}
}
/* 共用状态；状态必须同时提供文字与原生语义。 */
html.wshub{scroll-padding-top:130px}
.wshub :target,.wshub input,.wshub button,.wshub a,.wshub select,.wshub textarea{scroll-margin-top:130px}
.wshub .brand-logo{object-fit:contain}
.wshub .grid>*{min-width:0}
.wshub .btn:disabled,.wshub .btn[aria-disabled="true"]{pointer-events:auto}
.wshub .btn[aria-busy="true"]{cursor:wait}
.wshub a[aria-disabled="true"]{color:var(--ink-3);text-decoration:none;cursor:not-allowed}
.wshub input[type=text],.wshub input[type=email],.wshub input[type=password],.wshub select,.wshub textarea{border-color:var(--control-border)}
.wshub select,.wshub textarea{width:100%;font:inherit;color:var(--ink);background:var(--bg-2);border:1px solid var(--control-border);border-radius:var(--radius-s);padding:11px 14px}
.wshub input[aria-invalid="true"],.wshub textarea[aria-invalid="true"],.wshub select[aria-invalid="true"]{border-color:var(--error)}
.wshub input:disabled,.wshub select:disabled,.wshub textarea:disabled{color:var(--ink-3);background:var(--paper-2);cursor:not-allowed;opacity:1}
.wshub .notice.error{color:var(--error);background:var(--error-soft);border-color:var(--error)}
.wshub .notice.success{color:var(--ok);background:var(--ok-soft);border-color:var(--ok)}
.wshub .btn.danger{background:var(--error);color:var(--bg)}
.wshub .btn.danger:hover{background:var(--error);box-shadow:0 0 0 2px var(--error)}
.wshub .table-wrap{overflow-x:auto;max-width:100%}
.wshub table.clean caption{text-align:left;color:var(--ink-2);padding:12px 0}
.wshub table.clean th,.wshub table.clean td{overflow-wrap:anywhere}
.wshub .site-footer{max-width:var(--layout-width);margin:60px auto 0;padding:26px 22px 44px;border-top:1px solid var(--line-2);font-size:13px;color:var(--ink-3);text-align:center}
.wshub .site-copyright{margin:0}
.wshub .filing-records{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 20px}
.wshub .filing-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;color:var(--ink-3)}
.wshub .filing-icon{width:18px;height:20px;object-fit:contain;flex:none}
.wshub .swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.wshub .swatch{border:1px solid var(--line);border-radius:var(--radius-s);padding:16px}
.wshub .reference-section{margin-top:40px}
@media(max-width:560px){
.wshub .topnav{margin-left:0;width:100%}
.wshub .brand .sub{white-space:normal}
.wshub .brand{max-width:100%}
.wshub .user-chip{max-width:100%;overflow-wrap:anywhere}
.wshub .login-card{width:100%}
.wshub .btn-sm{min-height:40px}
.wshub .product-head{flex-wrap:wrap}
.wshub .badge{white-space:normal}
html.wshub{scroll-padding-top:170px}
.wshub :target,.wshub input,.wshub button,.wshub a,.wshub select,.wshub textarea{scroll-margin-top:170px}
}
@media(prefers-reduced-motion:reduce){
.wshub *,.wshub *::before,.wshub *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.wshub .product:hover{transform:none}
}

.wshub .topnav a.btn{color:var(--ink);background:var(--brand-strong)}
.wshub .topnav a.btn:hover{color:var(--ink);background:#2b5ce6}

/* Real account pages share the established WSHub components. */
.wshub .auth-card{max-width:480px;margin:30px auto}
.wshub .empty-state{padding:40px;text-align:center}
.wshub .account-summary{display:grid;grid-template-columns:100px minmax(0,1fr);gap:10px 16px}
.wshub .account-summary dt{color:var(--ink-3)}
.wshub .account-summary dd{margin:0;overflow-wrap:anywhere}
.wshub .search-grid{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:12px;align-items:end}
.wshub .search-grid .field{margin-bottom:0}
.wshub .topnav form{margin:0}
.wshub .errorlist{margin:0;padding-left:20px}
.wshub textarea[readonly]{font-family:var(--mono);font-size:13px;overflow-wrap:anywhere}
@media(max-width:860px){.wshub .search-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.wshub .search-grid{grid-template-columns:1fr}.wshub .account-summary{grid-template-columns:1fr;gap:4px}.wshub .account-summary dd{margin-bottom:12px}}

.wshub .table-wrap table.clean{min-width:560px}
.wshub .table-wrap td:last-child a{white-space:nowrap}