:root{ --bg:#faf6f0; --card:#fff; --ink:#3a2e26; --sub:#8a7a6c; --line:#ece2d6;
       --orange:#c8743c; --green:#4f8a5b; --red:#c0532f; }
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
     font-family:-apple-system,"PingFang TC","Noto Sans TC",sans-serif;line-height:1.55;
     padding-bottom:64px}
header{position:sticky;top:0;background:var(--bg);padding:14px 16px 8px;border-bottom:1px solid var(--line)}
.brand{font-size:20px;font-weight:700}
.modes{display:flex;gap:8px;margin-top:8px}
.mode{flex:1;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--card);
      font-size:14px;color:var(--sub)}
.mode.active{background:var(--orange);color:#fff;border-color:var(--orange)}
.updated{font-size:12px;color:var(--sub);margin-top:6px}
main{max-width:760px;margin:0 auto;padding:14px 16px}
.loading{color:var(--sub);text-align:center;padding:40px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;margin:12px 0}
.card h2{font-size:15px;margin:0 0 12px;color:var(--orange)}
.hero-num{font-size:27px;font-weight:700;letter-spacing:-.5px}
.row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--line);font-size:14px}
.row:last-child{border-bottom:none}
.row .v{font-variant-numeric:tabular-nums;white-space:nowrap}
.pos{color:var(--green)} .neg{color:var(--red)}
.muted{color:var(--sub);font-size:12px}
.soon{color:var(--sub);text-align:center;padding:24px;font-size:13px}
#tabbar{position:fixed;bottom:0;left:0;right:0;display:flex;background:var(--card);
        border-top:1px solid var(--line)}
#tabbar button{flex:1;padding:10px 4px;border:none;background:none;font-size:12px;color:var(--sub)}
#tabbar button.active{color:var(--orange);font-weight:700}
.chart{width:100%;height:auto;margin-top:4px}
.axis{font-size:9px;fill:var(--sub)}
.legend{display:flex;gap:14px;font-size:12px;color:var(--sub);margin-top:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px;vertical-align:-1px}
.alert{background:#fdf0e7;border:1px solid var(--orange);border-radius:12px;padding:10px 12px;
       font-size:13px;margin:8px 0}
.chip{font-size:11px;color:var(--sub);margin-left:6px}
.chip.up{color:var(--red)} .chip.down{color:var(--green)}
.donut-center{font-size:17px;font-weight:700;fill:var(--ink);font-variant-numeric:tabular-nums}
.donut-sub{font-size:11px;fill:var(--sub)}
.chip-dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.donut-row{cursor:pointer;padding:8px 4px;border-radius:8px}
.donut-row.sel{background:var(--bg)}
.minibar{height:6px;border-radius:3px;background:var(--line);margin-top:3px;overflow:hidden}
.minibar i{display:block;height:100%;border-radius:3px}

/* ---- 登入頁（2026-07-13，前端登入＋記住我） ---- */
.logout{float:right;font-size:13px;color:var(--sub);cursor:pointer;font-weight:400}
.login-card{max-width:400px;margin:10vh auto 0}
.login-label{display:block;margin-bottom:12px;font-size:14px}
.login-input{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line);
  font-size:15px;background:var(--card);color:var(--ink);margin-top:4px}
.login-remember{display:flex;align-items:center;gap:8px;margin:14px 0;font-size:14px}
.login-remember input{width:18px;height:18px;accent-color:var(--orange)}
.login-btn{width:100%;padding:12px;border:0;border-radius:10px;background:var(--orange);
  color:#fff;font-size:16px;cursor:pointer;font-weight:700}
[hidden]{display:none!important}