/* ============================================================
   處置籌碼日報 — Tide 風格樣式
   主題 [data-theme] light|dark;紅漲綠跌(台股慣例)
   ============================================================ */
:root{
  --c-gold:#E4B125; --c-bull:#E03B3B; --c-bear:#16A06A;
  --radius:14px; --radius-sm:9px; --shadow:0 6px 24px rgba(0,0,0,.08);
  --font:"PingFang TC","Microsoft JhengHei",system-ui,-apple-system,"Segoe UI",sans-serif;
}
body{ --c-up:var(--c-bull); --c-down:var(--c-bear); }     /* 紅漲綠跌 */
body[data-theme="light"]{
  --bg:#F6F6F4; --surface:#FFFFFF; --surface-2:#F1F1EE;
  --line:#E4E4DF; --text:#141519; --text-2:#5C5F66; --text-3:#8E929B;
  --brand:#0F6B4F; --brand-soft:#E6F2EC;
}
body[data-theme="dark"]{
  --bg:#0B0E0C; --surface:#141815; --surface-2:#1B201C;
  --line:#262C27; --text:#ECEFEA; --text-2:#A7AEA6; --text-3:#6E756C;
  --brand:#3FC79A; --brand-soft:#11231C; --shadow:0 6px 28px rgba(0,0,0,.5);
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);
  font-size:15px;-webkit-font-smoothing:antialiased;padding-bottom:28px;}
b{font-weight:700;} .muted{color:var(--text-2);} .small{font-size:.8em;}
.up{color:var(--c-up);} .down{color:var(--c-down);} .flat{color:var(--text-3);}
.tnum{font-variant-numeric:tabular-nums;}

/* topbar */
.topbar{display:flex;align-items:center;gap:14px;padding:10px 18px;
  border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0;z-index:20;}
.brand{font-weight:800;font-size:1.05em;white-space:nowrap;}
.brand .dot{color:var(--brand);}
.topbar .date{font-size:.82em;color:var(--text-2);white-space:nowrap;}
.topbar .grow{flex:1;}
.icon-btn{border:1px solid var(--line);background:var(--surface);border-radius:50%;
  width:36px;height:36px;cursor:pointer;font-size:1em;color:var(--text);}
.icon-btn:hover{border-color:var(--brand);}

/* layout */
.wrap{max-width:1200px;margin:0 auto;padding:16px 18px;}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px;}
.stat{border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--radius-sm);
  padding:12px 14px;background:var(--surface);}
.stat .n{font-size:1.9em;font-weight:800;line-height:1.1;}
.stat .l{font-size:.8em;color:var(--text-2);} .stat .s{font-size:.7em;color:var(--text-3);}
.stat.star{border-left-color:var(--c-gold);} .stat.star .n{color:var(--c-gold);}
.stat.jail{border-left-color:var(--c-up);} .stat.jail .n{color:var(--c-up);}
.stat.ting{border-left-color:var(--brand);} .stat.ting .n{color:var(--brand);}

/* segmented control */
.seg{display:inline-flex;background:var(--surface-2);border-radius:999px;padding:3px;gap:2px;margin-bottom:14px;}
.seg-btn{border:0;background:transparent;color:var(--text-2);cursor:pointer;border-radius:999px;
  padding:7px 16px;font-size:.9em;font-family:inherit;transition:.15s;}
.seg-btn.active{background:var(--surface);color:var(--text);box-shadow:0 1px 4px rgba(0,0,0,.08);font-weight:600;}
.view{display:none;} .view.active{display:block;}

/* ★ 卡片 grid */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;}
.card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);
  padding:14px 16px;box-shadow:var(--shadow);}
.card.is-star{border-color:var(--c-gold);}
.card .hd{display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.card .nm{font-weight:700;font-size:1.05em;} .card .nm .co{color:var(--text-3);font-size:.8em;margin-right:5px;}
.card .px{font-weight:700;font-variant-numeric:tabular-nums;}
.badges{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;}
.bdg{font-size:.72em;border:1px solid var(--line);border-radius:999px;padding:2px 9px;color:var(--text-2);}
.bdg.gold{border-color:var(--c-gold);color:var(--c-gold);}
.bdg.warn{border-color:var(--c-up);color:var(--c-up);}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin-top:6px;}
.kv{font-size:.86em;} .kv .k{color:var(--text-3);font-size:.85em;} .kv .v{font-weight:600;font-variant-numeric:tabular-nums;}
.trend{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line);}
.trend .blk{flex:1;} .trend .lab{font-size:.74em;color:var(--text-3);}
.trend .val{font-weight:700;font-variant-numeric:tabular-nums;font-size:.95em;}
.spark{display:block;width:100%;height:26px;}

/* 全部處置 表 */
.tbl{width:100%;border-collapse:collapse;font-size:.88em;}
.tbl th{position:sticky;top:56px;background:var(--surface);color:var(--text-3);font-size:.82em;
  font-weight:600;text-align:right;padding:8px 8px;border-bottom:1px solid var(--line);}
.tbl th:first-child,.tbl td:first-child{text-align:left;}
.tbl td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums;}
.tbl tr:hover td{background:var(--surface-2);}
.tbl .nm{font-weight:600;} .tbl .co{color:var(--text-3);font-size:.85em;margin-right:5px;}
.arrow-up{color:var(--c-up);} .arrow-dn{color:var(--c-down);}

/* 聽牌 list */
.ting-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;}
.ting-item{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);padding:10px 12px;}
.ting-item .nm{font-weight:600;} .ting-item .meta{font-size:.8em;color:var(--text-2);margin-top:3px;}

.foot{text-align:center;color:var(--text-3);font-size:.74em;padding:18px;line-height:1.6;}

/* 可點統計卡 + 排序表頭 + 規則區 */
.stat.clk{cursor:pointer;transition:.15s;}
.stat.clk:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--brand);}
.tbl th[data-key]{cursor:pointer;user-select:none;white-space:nowrap;}
.tbl th[data-key]:hover{color:var(--text);}
.tbl th.sorted{color:var(--brand);}
.tbl .si{font-size:.7em;margin-left:2px;}
.rules{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:4px 18px;margin-top:18px;box-shadow:var(--shadow);}
.rules>summary{cursor:pointer;font-weight:700;padding:12px 0;color:var(--text);list-style:none;}
.rules>summary::-webkit-details-marker{display:none;}
.rules>summary::before{content:"▸ ";color:var(--brand);}
.rules[open]>summary::before{content:"▾ ";}
.rules-body{padding-bottom:10px;}
.rules-body h4{margin:12px 0 2px;font-size:.92em;color:var(--brand);font-weight:700;}
.rules-body p{margin:0 0 6px;font-size:.86em;color:var(--text-2);line-height:1.75;}

@media(max-width:680px){
  .stats{grid-template-columns:repeat(2,1fr);}
  .cards{grid-template-columns:1fr;}
  .topbar .date{display:none;}
  .tbl{font-size:.8em;}
}
