
:root{
  --bg:#0b0e14; --bg2:#0f131c; --panel:#141a25; --panel2:#1a2130;
  --line:#242e40; --line2:#313d54;
  --fg:#e8eef8; --muted:#8f9cb3; --dim:#6b7789;
  --brand:#7c9cff; --brand2:#a78bfa;
  --yes:#3ddc97; --kinda:#f5b83d; --no:#ff6f8b;
  --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden}
body{
  background:var(--bg); color:var(--fg);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang TC","Heiti TC",
    "Noto Sans TC","Microsoft JhengHei",sans-serif;
  font-size:16px; line-height:1.75; -webkit-text-size-adjust:100%;
}
a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1080px; margin:0 auto; padding:0 18px}
header.top{border-bottom:1px solid var(--line); background:rgba(11,14,20,.9);
  position:sticky; top:0; z-index:20; backdrop-filter:blur(8px)}
header.top .wrap{display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding-top:12px; padding-bottom:12px}
.brand{font-weight:800; font-size:18px; color:var(--fg); letter-spacing:.5px; white-space:nowrap}
.brand span{color:var(--brand)}
nav.main{display:flex; gap:14px; flex-wrap:wrap; font-size:14px}
nav.main a{color:var(--muted)}
nav.main a.on,nav.main a:hover{color:var(--fg)}
h1{font-size:34px; line-height:1.3; margin:28px 0 8px; letter-spacing:-.5px}
h2{font-size:21px; margin:34px 0 12px; letter-spacing:-.2px}
h3{font-size:17px; margin:22px 0 8px}
p.lead{color:var(--muted); font-size:16px; margin:0 0 18px}
.muted{color:var(--muted)}
.dim{color:var(--dim)}
small{font-size:13px}

/* 搜尋 */
.searchbox{position:relative; margin:18px 0 10px}
.searchbox input{width:100%; padding:14px 16px; font-size:16px; color:var(--fg);
  background:var(--panel); border:1px solid var(--line2); border-radius:var(--radius); outline:none}
.searchbox input:focus{border-color:var(--brand)}
#results{margin-top:10px}
.hit{display:block; padding:10px 12px; border:1px solid var(--line); border-radius:10px;
  background:var(--panel); margin-bottom:6px; color:var(--fg)}
.hit:hover{border-color:var(--brand); text-decoration:none}
.hit b{font-weight:700}
.hit .m{color:var(--muted); font-size:13px}

/* chips */
.chips{display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 6px}
.chip{display:inline-flex; align-items:center; gap:6px; padding:6px 11px; font-size:13px;
  background:var(--panel); border:1px solid var(--line); border-radius:999px; color:var(--fg)}
.chip:hover{border-color:var(--brand); text-decoration:none}
.chip i{font-style:normal; color:var(--dim); font-size:12px}
.chip.on{border-color:var(--brand); background:var(--panel2)}

/* 跑馬燈 */
.marquee{position:relative; overflow:hidden; border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); background:var(--bg2); padding:11px 0; margin:22px 0}
.marquee .track{display:inline-flex; gap:26px; white-space:nowrap; will-change:transform;
  animation:slide 90s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.marquee .it{font-size:14px; color:var(--muted)}
.marquee .it b{color:var(--fg); font-weight:600}
.marquee .it u{color:var(--no); text-decoration:none; font-variant-numeric:tabular-nums}
@keyframes slide{from{transform:translateX(0)} to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none}}

/* 卡片 */
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px}
.card{display:block; padding:16px; background:var(--panel); border:1px solid var(--line);
  border-radius:var(--radius); color:var(--fg)}
.card:hover{border-color:var(--brand); text-decoration:none; background:var(--panel2)}
.card .nm{font-weight:700; font-size:16px; display:flex; align-items:center; gap:8px;
  justify-content:space-between}
.card .sub{color:var(--muted); font-size:13.5px; margin-top:6px; line-height:1.6}
.card .meta{margin-top:10px; font-size:12.5px; color:var(--dim); display:flex; gap:10px; flex-wrap:wrap}

.v{font-size:12px; font-weight:700; padding:3px 9px; border-radius:999px; white-space:nowrap}
.v-yes{color:#04301f; background:var(--yes)}
.v-kinda{color:#37270a; background:var(--kinda)}
.v-no{color:#3d0d18; background:var(--no)}

/* 判決比例長條 */
.bars{margin:10px 0 4px}
.bar{display:flex; height:16px; border-radius:8px; overflow:hidden; border:1px solid var(--line)}
.bar i{display:block; height:100%}
.barlegend{display:flex; gap:16px; flex-wrap:wrap; font-size:13px; color:var(--muted); margin-top:8px}
.barlegend b{color:var(--fg)}
.dot{display:inline-block; width:9px; height:9px; border-radius:3px; margin-right:6px}

/* 判決頁 */
.verdictbox{margin:22px 0 8px; padding:22px; border-radius:18px; border:1px solid var(--line2);
  background:linear-gradient(150deg,var(--panel2),var(--panel))}
.verdictbox .big{font-size:40px; font-weight:800; line-height:1.2; letter-spacing:-1px}
.verdictbox .big.yes{color:var(--yes)} .verdictbox .big.kinda{color:var(--kinda)}
.verdictbox .big.no{color:var(--no)}
.verdictbox .st{font-size:18px; color:var(--fg); margin-top:6px}
.facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:18px 0}
.facts div{background:var(--panel); padding:12px 14px}
.facts .k{font-size:12px; color:var(--dim)}
.facts .val{font-size:17px; font-weight:700; margin-top:2px; font-variant-numeric:tabular-nums}
.tags{display:flex; flex-wrap:wrap; gap:7px; margin:10px 0}
.tag{font-size:12.5px; padding:4px 10px; border-radius:999px; background:var(--panel2);
  border:1px solid var(--line); color:var(--muted)}
.panel{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 18px; margin:14px 0}
.prompt{white-space:pre-wrap; word-break:break-word; font-size:14px; line-height:1.8;
  background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:16px;
  max-height:460px; overflow:auto; font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.btnrow{display:flex; gap:9px; flex-wrap:wrap; margin:12px 0}
button.btn,a.btn{font:inherit; font-size:14px; cursor:pointer; padding:9px 15px; border-radius:10px;
  border:1px solid var(--line2); background:var(--panel2); color:var(--fg)}
button.btn:hover,a.btn:hover{border-color:var(--brand); text-decoration:none}
button.btn.pri{background:var(--brand); border-color:var(--brand); color:#08101f; font-weight:700}

table{width:100%; border-collapse:collapse; font-size:14px}
th,td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line)}
th{color:var(--dim); font-size:12.5px; font-weight:600; white-space:nowrap}
td.num,th.num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.tablewrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel)}
.notice{font-size:13px; color:var(--muted); background:var(--panel); border:1px solid var(--line);
  border-left:3px solid var(--kinda); border-radius:8px; padding:10px 13px; margin:14px 0}
footer{margin:56px 0 40px; padding-top:20px; border-top:1px solid var(--line);
  color:var(--dim); font-size:13px; line-height:1.9}
ul.plain{padding-left:20px}
ul.plain li{margin:6px 0}
.moatdef{padding:14px 16px; border:1px solid var(--line); border-radius:12px;
  background:var(--panel); margin-bottom:10px}
.moatdef .h{font-weight:700; display:flex; justify-content:space-between; gap:10px; align-items:baseline}
.moatdef .h span{font-size:12.5px; color:var(--dim); font-weight:400; white-space:nowrap}
.moatdef p{margin:6px 0 0; color:var(--muted); font-size:14px}
@media(max-width:640px){
  h1{font-size:26px} .wrap{padding:0 14px}
  .verdictbox{padding:17px} .verdictbox .big{font-size:31px}
  .grid{grid-template-columns:1fr}
  header.top .wrap{gap:8px}
  nav.main{gap:10px; font-size:13px}
}
