:root{--bg:#f4f3ef;--card:#fff;--line:#e8e6e1;--ink:#141413;--mute:#6f6d68;--accent:#2a62b8;
--green:#2f8f5b;--green-bg:#e9f4ee;--green-bd:#cfe6d8;--green-ink:#17603a;
--amber:#d9862b;--amber-bg:#fdefdb;--amber-bd:#f3d7a7;--amber-ink:#7a4100;
--red:#b3261e;--red-bg:#fbe3e1;--red-bd:#f1bcb7;--red-ink:#8c1d16;--grey-bg:#f1efe9;--grey-bd:#e3e0d8}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",Inter,"Segoe UI",system-ui,sans-serif;font-size:15px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
a{color:var(--accent);text-decoration:none}
button{font:inherit;color:inherit}
#app{max-width:520px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}
.boot{padding:80px 20px;text-align:center;color:var(--mute)}
.head{padding:calc(env(safe-area-inset-top) + 18px) 18px 8px;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.head h1{font-size:24px;margin:0;font-weight:700}
.head .sub{font-size:12px;color:var(--mute);text-align:right}
.main{flex:1;padding:4px 14px 96px;display:flex;flex-direction:column;gap:10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.card h2{font-size:15px;margin:0 0 8px;font-weight:600;display:flex;justify-content:space-between;align-items:baseline}
.card h2 small{font-weight:400;font-size:12px;color:var(--mute)}
.k{font-size:11px;color:var(--mute);letter-spacing:.02em}
.v{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.v.s{font-size:16px}
.note{font-size:12px;color:var(--mute);line-height:1.45}
.pos{color:var(--green)}.neg{color:var(--red)}.warn{color:var(--amber-ink)}
.ringrow{display:flex;gap:16px;align-items:center}
.kv{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:10px 8px}
.alert{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid #ecebe7}
.alert:last-child{border-bottom:0;padding-bottom:2px}
.alert b{font-weight:600}
.dot{width:10px;height:10px;border-radius:5px;margin-top:5px;flex:none}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:12px;padding:5px 10px;border-radius:999px;background:var(--grey-bg);color:var(--ink);white-space:nowrap;border:0}
.pill{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap}
.pill.ok{color:var(--green);background:#e4f3ea}.pill.bad{color:var(--red-ink);background:var(--red-bg)}.pill.mid{color:var(--amber-ink);background:var(--amber-bg)}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.bar{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--grey-bg);margin:6px 0 8px}
.bar i{display:block;height:100%}
.legend{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11px;color:var(--mute)}
.legend span i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.filters{display:flex;gap:6px;padding:2px 14px 10px;overflow-x:auto;scrollbar-width:none}
.filters::-webkit-scrollbar{display:none}
.f{font-size:12px;padding:6px 11px;border-radius:999px;border:1px solid var(--grey-bd);background:#fff;color:var(--mute);white-space:nowrap}
.f.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.grp{grid-column:1/-1;font-size:12px;color:var(--mute);margin:6px 2px 0;display:flex;justify-content:space-between}
.t{border-radius:10px;padding:10px 10px 8px;display:flex;flex-direction:column;gap:2px;min-height:66px;border:1px solid transparent;text-align:left;cursor:pointer;width:100%}
.t .s{font-weight:700;font-size:14px;display:flex;justify-content:space-between;align-items:baseline;gap:4px}
.t .s em{font-style:normal;font-size:10px;font-weight:600}
.t .d{font-size:12px;font-variant-numeric:tabular-nums}
.t .m{font-size:10px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t.green{background:var(--green-bg);border-color:var(--green-bd);color:var(--green-ink)}
.t.amber{background:var(--amber-bg);border-color:var(--amber-bd);color:var(--amber-ink)}
.t.red{background:var(--red-bg);border-color:var(--red-bd);color:var(--red-ink)}
.t.none{background:var(--grey-bg);border-color:var(--grey-bd);color:var(--mute)}
.tabs{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;border-top:1px solid var(--line);background:#fff;padding-bottom:max(env(safe-area-inset-bottom),8px);z-index:5}
.tabs div{display:flex;width:100%;max-width:520px}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:var(--mute);padding:8px 0 2px}
.tab.on{color:var(--accent);font-weight:600}
.back{font-size:15px;padding:calc(env(safe-area-inset-top) + 14px) 16px 0;display:block}
.big{font-size:34px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 8px}
.facts.two{grid-template-columns:1fr 1fr}
.flag{font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;background:var(--grey-bg);color:var(--ink)}
.flag.WEAK,.flag.EXHAUSTED,.flag.LOTTERY{background:var(--amber-bg);color:var(--amber-ink)}
.flag.TREND-LEADER,.flag.STEADY{background:var(--green-bg);color:var(--green-ink)}
.tag{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--mute);border:1px solid var(--grey-bd);border-radius:5px;padding:1px 5px}
details summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"show";font-weight:400;font-size:12px;color:var(--accent)}
details[open] summary::after{content:"hide"}
details[open] summary{margin-bottom:10px}
.connect{padding:calc(env(safe-area-inset-top) + 60px) 22px 40px;display:flex;flex-direction:column;gap:14px}
.connect h1{margin:0;font-size:26px}
input[type=password],input[type=text]{font:inherit;padding:12px 14px;border:1px solid var(--grey-bd);border-radius:10px;background:#fff;width:100%}
.btn{padding:12px 14px;border-radius:10px;border:0;background:var(--ink);color:#fff;font-weight:600;width:100%}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--grey-bd)}
.err{color:var(--red-ink);font-size:13px;min-height:18px}
.banner{font-size:12px;padding:8px 12px;border-radius:10px;background:var(--amber-bg);color:var(--amber-ink)}
table.mini{width:100%;border-collapse:collapse;font-size:13px}
table.mini td{padding:5px 0;border-bottom:1px solid #f0efeb;vertical-align:top}
table.mini td:last-child{text-align:right;font-variant-numeric:tabular-nums}
table.mini tr:last-child td{border-bottom:0}
a.alert{color:inherit}
a.chip{color:var(--ink)}
.card h2 .pill{font-size:11px;padding:3px 9px}
.alert .note{overflow-wrap:anywhere}
