:root{
  --bg:#0b1220;--card:#111827;--mut:#9fb0c8;--text:#e6eaf2;--line:#1f2937;
  --grad1:#0ea5e9;--grad2:#6366f1;--ok:#22c55e;--chip:#0f172a;
}
:root.light{
  --bg:#f6f8fc;--card:#ffffff;--mut:#4b5563;--text:#0b1220;--line:#e5e7eb;
  --grad1:#2563eb;--grad2:#22c55e;--ok:#16a34a;--chip:#f3f4f6;
}
*{box-sizing:border-box}
html,body{height:100%}
html{overscroll-behavior-y:none}
body{
  margin:0;font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto;
  background:var(--bg);color:var(--text);overflow-x:hidden;
  -webkit-text-size-adjust:100%;
}
.bg-img{position:fixed;inset:0;z-index:-2;background:#0b1220}
.bg-img::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.75)),
             url('https://files.catbox.moe/f95q5g.png') center/cover no-repeat;
  filter:saturate(1.05) contrast(.98);
}
.bg-img.error::before{
  background:radial-gradient(1200px 800px at 20% -10%, var(--grad1), transparent 60%),
             radial-gradient(900px 700px at 120% 20%, var(--grad2), transparent 55%),
             linear-gradient(180deg, var(--bg), var(--bg));
}
.container{max-width:980px;margin:0 auto;padding:14px}
.header{display:flex;align-items:center;gap:10px;background:rgba(0,0,0,.25);border:1px solid var(--line);padding:10px 12px;border-radius:16px;backdrop-filter:blur(10px)}
.brand{display:flex;align-items:center;gap:8px;font-weight:900}
.brand img{width:28px;height:28px;border-radius:8px;object-fit:cover}
.h-actions{margin-left:auto;display:flex;gap:8px}
.icon-btn{width:42px;height:42px;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--chip);color:var(--text)}
.theme{width:auto;padding:0 12px;gap:8px}
.title{font-size:32px;font-weight:900;margin:18px 6px 6px}
.sub{color:var(--mut);margin:0 6px 14px}
.cta{display:flex;gap:10px;margin:8px 6px 18px}
.btn{border:none;color:#fff;cursor:pointer;display:inline-flex;align-items:center;gap:10px;padding:10px 14px;font-weight:700}
.btn-bubble{border-radius:9999px}
.btn-grad{background:linear-gradient(135deg,var(--grad1),var(--grad2))}
.btn-wa{background:#128c7e}
.grid{display:grid;gap:12px}
@media(min-width:720px){.grid{grid-template-columns:1fr 1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px}
.card-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.card-h .tag{margin-left:auto;color:var(--mut);font-size:.9rem}
.metric{display:flex;align-items:flex-end;gap:16px}
.metric .big{font-size:28px;font-weight:900}
.metric .mut{color:var(--mut)}
.badge{display:inline-flex;gap:8px;align-items:center;padding:6px 10px;border-radius:999px;background:var(--chip);border:1px solid var(--line)}

.chart-wrap{height:160px}
@media(min-width:720px){.chart-wrap{height:140px}}

.kv{display:grid;grid-template-columns:120px 1fr;gap:8px;align-items:center;margin:6px 0}
.kv .value{
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  border:1px dashed var(--line);background:var(--chip);padding:8px;border-radius:10px
}
.kv .copy-mini{margin-left:8px}
footer{margin:20px 0 36px}
.power{display:inline-block;background:rgba(0,0,0,.25);border:1px solid var(--line);padding:8px 12px;border-radius:12px}

@media screen and (orientation:landscape){
  .rotate-overlay{position:fixed;inset:0;background:#0008;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;color:#fff;z-index:9999}
}
.rotate-overlay{display:none}

input,button{font-size:16px}

hr.sep{border:0;border-top:1px solid var(--line);margin:10px 0}

.mask{position:fixed;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s;z-index:80}
.mask.show{opacity:1;pointer-events:auto}
.sidebar{
  position:fixed;top:0;left:0;height:100%;width:86%;max-width:360px;z-index:90;
  background:var(--card);border-right:1px solid var(--line);transform:translateX(-100%);
  transition:transform .32s cubic-bezier(.22,1,.36,1);padding:0;display:flex;flex-direction:column
}
.sidebar.show{transform:translateX(0)}
.s-top{
  padding:16px;border-bottom:1px solid var(--line);
  background:linear-gradient(135deg,var(--grad1),var(--grad2));
  color:#fff;display:flex;align-items:center;gap:10px
}
.s-top img{width:42px;height:42px;border-radius:12px;object-fit:cover;border:2px solid rgba(255,255,255,.35)}
.s-top .title-mini{font-weight:900}
.s-close{margin-left:auto;background:rgba(0,0,0,.2)}
.s-body{padding:12px}
.s-section{margin:10px 0 6px;color:var(--mut);font-size:.85rem}
.s-nav a{
  display:flex;align-items:center;gap:10px;padding:10px 12px;margin:6px 0;
  background:var(--chip);border:1px solid var(--line);border-radius:12px;color:var(--text);
  transition:transform .15s, background .15s
}
.s-nav a:hover{transform:translateX(2px);background:rgba(255,255,255,.04)}
.s-footer{margin-top:auto;padding:12px;color:var(--mut);border-top:1px solid var(--line);font-size:.9rem}
.noscroll{overflow:hidden}

.wx-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--chip);border:1px solid var(--line);padding:6px 10px;border-radius:999px}