:root{color-scheme:light;
 --bg:#f3f4f6;--bg2:#e9ebef;--card:#fff;--text:#101217;--muted:#5f6674;--faint:#8b929e;--line:#e3e6eb;--chip:#f0f2f5;
 --ok:#0e9f5a;--okbg:#e2f5eb;--okline:#9fdcbc;--no:#c94848;--nobg:#fbe9e9;--warn:#a76b00;--warnbg:#fdf3dc;
 --accent:#111318;--onaccent:#fff;--stage:#f4f4f6;--series:#2a78d6;--series-hi:#1c5cab;--grid:#eceef2;--shade:rgba(10,12,16,.42);
 --glow:0 1px 2px rgba(16,18,24,.05),0 8px 24px rgba(16,18,24,.06)}
@media (prefers-color-scheme:dark){:root:where(:not([data-theme="light"])){color-scheme:dark;
 --bg:#090b0f;--bg2:#10131a;--card:#13161d;--text:#eef1f6;--muted:#9aa2b0;--faint:#6b7382;--line:#232833;--chip:#1a1f28;
 --ok:#5fe3a1;--okbg:#0f2a1d;--okline:#1f5a3c;--no:#ff8484;--nobg:#2c1416;--warn:#f0c060;--warnbg:#2b2210;
 --accent:#f2f4f7;--onaccent:#0b0d11;--stage:#e6e7eb;--series:#3987e5;--series-hi:#6da7ec;--grid:#1d222b;--shade:rgba(0,0,0,.62);
 --glow:0 10px 30px rgba(0,0,0,.35)}}
:root[data-theme="dark"]{color-scheme:dark;
 --bg:#090b0f;--bg2:#10131a;--card:#13161d;--text:#eef1f6;--muted:#9aa2b0;--faint:#6b7382;--line:#232833;--chip:#1a1f28;
 --ok:#5fe3a1;--okbg:#0f2a1d;--okline:#1f5a3c;--no:#ff8484;--nobg:#2c1416;--warn:#f0c060;--warnbg:#2b2210;
 --accent:#f2f4f7;--onaccent:#0b0d11;--stage:#e6e7eb;--series:#3987e5;--series-hi:#6da7ec;--grid:#1d222b;--shade:rgba(0,0,0,.62);
 --glow:0 10px 30px rgba(0,0,0,.35)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI","PingFang TC","Noto Sans TC",Roboto,sans-serif;-webkit-font-smoothing:antialiased;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:10}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,rect:focus-visible{outline:2px solid var(--series);outline-offset:2px}
a{color:inherit}
svg{display:block}
.wrap{max-width:620px;margin:0 auto;padding:0 16px 40px}

header.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;margin:0 -16px;padding:12px 16px;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;align-items:center;gap:10px}
.logo{width:36px;height:36px;border-radius:11px;background:var(--accent);color:var(--onaccent);display:grid;place-items:center;flex:none;text-decoration:none}
.brand{flex:1;min-width:0;font-weight:750;letter-spacing:-.01em;text-decoration:none}
.brand small{display:block;font-weight:500;color:var(--muted);font-size:12.5px}
.pillgrp{display:flex;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:3px}
.pillgrp button{border:0;background:none;border-radius:8px;padding:5px 9px;font-size:12.5px;font-weight:650;color:var(--muted)}
.pillgrp button.on{background:var(--accent);color:var(--onaccent)}
.iconbtn{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:var(--card);display:grid;place-items:center;flex:none}

.card{background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:var(--glow);margin-top:14px;padding:16px;position:relative}
.card h2{font-size:16px;margin:0;letter-spacing:-.01em}
.card .sub{font-size:13px;color:var(--muted);margin:3px 0 0}
.lbl{font-size:11.5px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;color:var(--faint);margin:14px 0 8px}
.lbl:first-child{margin-top:0}
.row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.row::-webkit-scrollbar{display:none}
.chipb{border:1.5px solid var(--line);background:var(--chip);border-radius:11px;padding:8px 12px;font-size:13.5px;font-weight:650;color:var(--muted);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.chipb.on{border-color:var(--accent);background:var(--card);color:var(--text)}
.chipb small{font-weight:500;color:var(--faint)}
.tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:650;color:var(--ok);background:var(--okbg);padding:4px 10px;border-radius:99px}
.tag.soon{color:var(--warn);background:var(--warnbg)}
.tag i{width:6px;height:6px;border-radius:50%;background:currentColor}
.status{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:650;padding:4px 10px;border-radius:99px}
.status.ok{background:var(--okbg);color:var(--ok)}.status.no{background:var(--nobg);color:var(--no)}.status.idle{background:var(--chip);color:var(--muted)}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}

.stage{isolation:isolate;background:radial-gradient(110% 90% at 50% 80%,color-mix(in srgb,var(--tint,#fff) 22%,transparent),transparent 70%),var(--stage)}
img.dev{display:block;mix-blend-mode:multiply;user-select:none;-webkit-user-drag:none}

.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:0;border-radius:15px;padding:15px 18px;font-weight:700;font-size:15.5px;text-decoration:none;background:var(--accent);color:var(--onaccent)}
.btn.go{background:var(--ok);color:#06130c}
.btn.ghost{background:var(--card);border:1px solid var(--line);color:var(--text)}
.btn.small{padding:9px 14px;font-size:13.5px;border-radius:11px}
.btn.wide{width:100%}
.btn:disabled{opacity:.35;cursor:default}

.opts{display:grid;gap:10px}
.opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:15px}
.opt.on{border-color:var(--accent)}
.opt .em{font-size:24px;line-height:1}.opt small{display:block;color:var(--muted);font-size:12.5px}
.opt:disabled{opacity:.5}
.tick{margin-left:auto;width:22px;height:22px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;flex:none}
.opt.on .tick{background:var(--accent);border-color:var(--accent)}
.opt.on .tick::after{content:"";width:9px;height:5px;border:2px solid var(--onaccent);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}

.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,10px);background:var(--accent);color:var(--onaccent);padding:11px 16px;border-radius:13px;font-size:13.5px;font-weight:600;opacity:0;transition:.22s;pointer-events:none;z-index:30;max-width:90%;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.notice{margin-top:14px;padding:12px 14px;border-radius:14px;font-size:13.5px;background:var(--warnbg);color:var(--warn)}
.notice.ok{background:var(--okbg);color:var(--ok)}
.foot{color:var(--faint);font-size:12px;text-align:center;margin:24px 0 0}
.foot a{color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
