/* DailyRecords API 官网样式 (暗色科技风, 无框架) */
:root{
  --bg:#0a0e17; --panel:#101828; --panel2:#0d1524; --line:#1e2a44;
  --tx:#e6ecf7; --mut:#8fa1bd; --acc:#22d3ee; --acc2:#818cf8; --ok:#34d399; --warn:#fbbf24;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:15px/1.7 -apple-system,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif}
a{color:var(--acc);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* 顶部导航 */
.nav{position:sticky;top:0;z-index:50;background:rgba(10,14,23,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:24px;height:60px}
.brand{font-weight:700;font-size:17px;letter-spacing:.2px;color:var(--tx)}
.brand em{font-style:normal;background:linear-gradient(90deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.nav a.pl{color:var(--mut);font-size:14px;margin-left:auto}
.nav a.pl:hover{color:var(--acc)}
.nav .links{display:flex;gap:18px;margin-left:auto}
.nav .links a{color:var(--mut);font-size:14px}
.nav .links a:hover,.nav .links a.on{color:var(--acc)}
@media(max-width:720px){.nav .wrap{flex-wrap:wrap;height:auto;padding:10px 16px;gap:8px}.nav .links{margin-left:0}.nav a.pl{margin-left:auto}}

/* Hero */
.hero{padding:72px 0 44px;text-align:center;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 30% 0%,rgba(34,211,238,.14),transparent 70%),radial-gradient(500px 260px at 75% 10%,rgba(129,140,248,.14),transparent 70%);pointer-events:none}
.hero h1{font-size:clamp(26px,4.4vw,42px);line-height:1.3;position:relative}
.hero h1 .g{background:linear-gradient(90deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.sub{color:var(--mut);max-width:720px;margin:16px auto 28px;position:relative}
.btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative}
.btn{display:inline-block;padding:11px 26px;border-radius:10px;font-weight:600;background:linear-gradient(90deg,var(--acc),var(--acc2));color:#06121a !important;transition:opacity .15s}
.btn:hover{opacity:.88;text-decoration:none}
.btn.ghost{background:transparent;color:var(--tx);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--acc);color:var(--acc)}
.hero .tags{margin-top:26px;color:var(--mut);font-size:13px;position:relative;letter-spacing:.3px}
code{background:#0c1526;border:1px solid var(--line);border-radius:6px;padding:2px 7px;font-family:var(--mono);font-size:.92em;color:#9be8ff}

/* 通用 section */
section{padding:46px 0}
h2.sec{font-size:22px;margin-bottom:6px}
p.sec-sub{color:var(--mut);margin-bottom:26px;font-size:14px}
.grid{display:grid;gap:16px}
.g3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px}
.card h3{font-size:16px;margin-bottom:8px;display:flex;gap:8px;align-items:center}
.card p{color:var(--mut);font-size:13.5px}
.card .ico{font-size:20px}

/* 步骤 */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;counter-reset:st}
.step{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 16px;position:relative}
.step b{display:block;margin:6px 0;font-size:15px}
.step span{color:var(--mut);font-size:13px}
.step:before{counter-increment:st;content:counter(st);width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--acc),var(--acc2));color:#06121a;font-weight:700;font-size:13px}

/* 价格表 */
.fam-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.fam-tabs button{background:var(--panel);color:var(--mut);border:1px solid var(--line);border-radius:999px;padding:6px 14px;cursor:pointer;font-size:13px;transition:.15s}
.fam-tabs button.on,.fam-tabs button:hover{border-color:var(--acc);color:var(--acc)}
.search{width:100%;max-width:340px;background:var(--panel);border:1px solid var(--line);color:var(--tx);border-radius:10px;padding:9px 14px;font-size:14px;margin-bottom:14px;outline:none}
.search:focus{border-color:var(--acc)}
.tbl-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}
table.px{width:100%;border-collapse:collapse;min-width:760px;background:var(--panel)}
.px th{position:sticky;top:0;background:#131c31;text-align:left;padding:11px 14px;font-size:12.5px;color:var(--mut);white-space:nowrap;border-bottom:1px solid var(--line)}
.px td{padding:9px 14px;border-bottom:1px solid #17233c;font-size:13px;white-space:nowrap}
.px td.m{font-family:var(--mono);font-size:12.5px;color:#c9d8f0}
.px td.y{color:var(--acc);font-family:var(--mono)}
.px tr:last-child td{border-bottom:none}
.px tr:hover td{background:#101b31}
.badge{display:inline-block;font-size:11px;padding:1px 8px;border-radius:999px;border:1px solid var(--line);color:var(--mut);margin-left:6px}
.badge.v{color:#67e8f9;border-color:#155e75}

/* FAQ */
details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-bottom:10px}
details summary{cursor:pointer;font-weight:600;font-size:14.5px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
details summary:after{content:"+";color:var(--mut);font-size:18px}
details[open] summary:after{content:"–"}
details p{margin-top:10px;color:var(--mut);font-size:13.5px}

/* 充值 */
.paybox{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px;max-width:560px;margin:0 auto}
.paybox .qrcode{width:200px;height:200px;margin:14px auto;display:flex;align-items:center;justify-content:center;border:1px dashed var(--line);border-radius:12px;color:var(--mut);font-size:13px;text-align:center;background:#0d1524}
.order-row{display:flex;gap:10px;margin:12px 0}
.order-row input{flex:1;font-family:var(--mono);font-size:14px;background:#0c1526;border:1px solid var(--line);color:var(--tx);border-radius:9px;padding:10px 12px}
.order-row button{background:#0e2038;border:1px solid #1e3a5f;color:#9be8ff;border-radius:9px;padding:0 16px;cursor:pointer;font-size:13px}

/* 提示/警示 */
.notice{background:#10202e;border:1px solid #1c3a55;color:#bae6fd;border-radius:12px;padding:14px 18px;font-size:13.5px;margin-top:18px}
.warn{background:#2b2110;border-color:#5f4a1c;color:#fde68a}
.ok{background:#0f2b20;border-color:#1c5f42;color:#a7f3d0}

/* footer */
.footer{border-top:1px solid var(--line);padding:28px 0;color:var(--mut);font-size:12.5px}
.footer .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.mono{font-family:var(--mono)}
h3.doc{font-size:17px;margin:26px 0 10px}
ul.doc{list-style:none}
ul.doc li{padding:6px 0 6px 22px;position:relative;color:#c6d4ec;font-size:14px}
ul.doc li:before{content:"›";position:absolute;left:6px;color:var(--acc)}
.doc-note{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px 18px;font-size:13.5px;color:var(--mut);margin:14px 0;font-family:var(--mono);overflow:auto}
@media(max-width:640px){.hero{padding:44px 0 30px}section{padding:34px 0}}