:root{--fg:#1a1a1a;--muted:#777;--line:#e4e4e4;--accent:#0b6bcb;--accent2:#e8f2fb;--danger:#c0392b;--ok:#1e8449}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--fg);background:#fafafa;line-height:1.6}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
a.onlink{font-weight:700;text-decoration:underline}
.muted{color:var(--muted);font-size:.9em}
.topnav{display:flex;gap:18px;align-items:center;padding:12px 20px;background:#fff;border-bottom:1px solid var(--line);flex-wrap:wrap;position:sticky;top:0;z-index:5}
.topnav .brand{font-weight:800;font-size:1.15em;color:var(--fg)}
.topnav a.on{font-weight:700;text-decoration:underline}
.topnav.admin{background:#1f2a37}
.topnav.admin a{color:#cfd8e3}
.topnav.admin .brand{color:#fff}
.wrap{max-width:1080px;margin:0 auto;padding:20px 16px 40px}
footer{max-width:1080px;margin:0 auto;padding:18px 16px;color:var(--muted);font-size:.85em;border-top:1px solid var(--line)}
h1{font-size:1.6em;margin:.4em 0}
h2{font-size:1.2em;margin:1.2em 0 .5em}
.hero{background:linear-gradient(135deg,#0b6bcb,#084e96);color:#fff;border-radius:12px;padding:28px 24px;margin-bottom:22px}
.hero h1{margin:0 0 8px;color:#fff}
.hero p{margin:0;opacity:.92;max-width:720px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px}
.card h2{margin:0 0 2px;font-size:1.25em}
.tagline{color:var(--muted);font-size:.88em}
.rebate{font-size:1.35em;font-weight:800;color:var(--accent);margin:8px 0}
.rebate.big{font-size:1.7em}
.specs{list-style:none;margin:8px 0;padding:0;font-size:.92em}
.specs li{padding:2px 0;border-bottom:1px dashed #eee}
.actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--accent);color:#fff;border:none;border-radius:8px;padding:8px 18px;font-size:.95em;cursor:pointer}
.btn:hover{background:#095aa9;text-decoration:none}
.btn.ghost{background:#fff;color:var(--accent);border:1px solid var(--accent)}
.btn.small{padding:3px 10px;font-size:.85em}
.btn.danger{background:var(--danger)}
.btn.disabled{background:#ccc;cursor:not-allowed}
.promo-teaser,.howto{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 22px;margin-top:22px}
.detail{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px 26px}
.rich{white-space:normal}
.form{display:flex;flex-direction:column;gap:12px;max-width:420px}
.form.wide{max-width:640px}
.form label{display:flex;flex-direction:column;gap:4px;font-size:.93em}
.form label.chk{flex-direction:row;align-items:center;gap:8px}
.form input,.form select,.form textarea{padding:8px 10px;border:1px solid #ccc;border-radius:8px;font-size:1em;font-family:inherit}
.inlineform{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.inlineform input[type=text]{padding:4px 6px;border:1px solid #ccc;border-radius:6px}
.tbl{border-collapse:collapse;width:100%;background:#fff;font-size:.92em}
.tbl th,.tbl td{border:1px solid var(--line);padding:7px 9px;text-align:left;vertical-align:top}
.tbl th{background:var(--accent2)}
.err{background:#fdecea;color:var(--danger);border:1px solid #f5c6c0;border-radius:8px;padding:10px 14px;margin:10px 0;max-width:640px}
.flash{background:#eafaf1;color:var(--ok);border:1px solid #a9dfbf;border-radius:8px;padding:10px 14px;margin:10px 0}
.statgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin:14px 0}
.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}
.stat span{display:block;color:var(--muted);font-size:.85em}
.stat strong{font-size:1.35em}
.ucenter{display:flex;gap:20px;align-items:flex-start}
.uside{width:190px;flex:none;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px}
.uside a{padding:7px 10px;border-radius:7px;color:var(--fg)}
.uside a.on{background:var(--accent2);font-weight:700}
.uinfo{padding:4px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:8px;font-weight:700}
.umain{flex:1;min-width:0}
code{background:#f0f0f0;padding:1px 6px;border-radius:5px;word-break:break-all}
code.bigcode{display:inline-block;padding:8px 12px;font-size:1em}
pre{white-space:pre-wrap;font-size:.85em;color:var(--danger)}
@media(max-width:720px){.ucenter{flex-direction:column}.uside{width:100%}}
.qrimg{max-width:180px;max-height:180px;border:1px solid var(--line);border-radius:8px;background:#fff}
.qrimg.small{max-width:110px;max-height:110px}
.broker-logo{height:46px;max-width:170px;object-fit:contain;object-position:left center;background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 8px;display:block;margin-bottom:10px}
.broker-logo-lg{height:60px;max-width:240px;object-fit:contain;object-position:left center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px 10px;display:block;margin-bottom:10px}
.logo-thumb{height:26px;max-width:90px;object-fit:contain;vertical-align:middle;margin-right:8px;background:#fff;border:1px solid var(--line);border-radius:5px;padding:2px 4px}
.logo-preview{max-height:80px;max-width:260px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 10px}