:root{color-scheme:dark;--bg:#0b1420;--panel:#111f2d;--border:#26394a;--text:#e1ebf2;--muted:#93a8bb;--teal:#69d5c2;--gold:#e9bc72}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.65 system-ui,-apple-system,"Noto Sans TC",sans-serif}header{height:76px;padding:0 4vw;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:22px;background:#0e1925}.brand{display:flex;align-items:center;gap:16px;color:var(--teal);font-size:30px;font-weight:700;text-decoration:none}.brand span{font-size:13px;letter-spacing:2px;color:var(--text)}.readonly{margin-left:auto;color:var(--teal);font-size:12px}button,select,input{font:inherit;color:var(--text);background:#152737;border:1px solid #30495e;border-radius:8px;padding:10px 16px}button{cursor:pointer}button:hover{border-color:var(--teal)}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--teal);outline-offset:3px}main{max-width:1680px;padding:36px 4vw;margin:auto}.heading{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:25px}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--teal)}h1{font-size:32px;letter-spacing:1px;margin:10px 0 3px}p{margin:0;color:var(--muted)}label{font-size:13px;color:var(--muted)}select{display:block;margin-top:7px;min-width:270px}.meta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;color:var(--muted);font-size:12px;margin:24px 0}#tag{color:var(--gold);background:#332c22;border:1px solid #695232;border-radius:5px;padding:3px 10px}#quality{margin-left:auto}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{border:1px solid var(--border);border-radius:12px;background:linear-gradient(140deg,#172a3a,var(--panel));padding:22px 24px}.card .label{color:var(--muted);font-size:13px}.card .value{font-size:31px;font-variant-numeric:tabular-nums;font-weight:600;margin:7px 0}.card small{color:var(--muted);font-size:12px}.good{color:var(--teal)}.warn{color:var(--gold)}.bad{color:#ff9a94}.tabs{display:flex;gap:25px;margin:28px 0 20px;border-bottom:1px solid var(--border)}.tabs button{background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:12px 2px;color:var(--muted)}.tabs button.active{border-color:var(--teal);color:var(--teal)}article{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:24px;min-width:0}.charts{display:grid;grid-template-columns:1.15fr 1fr;gap:18px}h2{font-size:16px;font-weight:600;margin:0 0 10px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-head span{font-size:11px;color:var(--muted)}i{display:inline-block;width:7px;height:7px;border-radius:50%;margin:0 5px}.teal{background:var(--teal)}.gray{background:#8c9eb5}.hint,.legend{font-size:12px;color:var(--muted);margin-bottom:10px}.legend{margin:0}.chart{min-height:230px}svg{width:100%;height:auto;display:block}svg text{fill:var(--muted);font:11px system-ui}svg .grid{stroke:#27394a;stroke-width:1}.notes{margin-top:18px}.notes ul{padding-left:20px;margin:5px 0;font-size:13px;color:var(--muted)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:right;padding:13px 16px;border-bottom:1px solid var(--border);font-variant-numeric:tabular-nums}th{color:var(--muted);font-weight:500}th:first-child,td:first-child{text-align:left}td small{color:var(--muted);padding-left:8px}tbody tr:hover{background:#1b2e3e}dl{display:grid;grid-template-columns:160px 1fr;font-size:13px;gap:8px 16px;margin-bottom:30px}dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}#error{background:#3e2426;border:1px solid #875052;color:#ffcbc5;padding:16px;border-radius:8px;margin-bottom:20px}#loading{padding:45px;text-align:center;color:var(--muted)}footer{border-top:1px solid var(--border);margin-top:30px;padding-top:18px;font-size:11px;color:var(--muted);display:flex;justify-content:space-between}[hidden]{display:none!important}@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}.charts{grid-template-columns:1fr}}@media(max-width:600px){header{padding:0 18px;gap:10px}.brand span{font-size:10px;letter-spacing:0}.readonly{display:none}header button{margin-left:auto;font-size:12px}main{padding:25px 16px}.heading{display:block}h1{font-size:26px}.heading label{display:block;margin-top:16px}select{width:100%}.cards{gap:10px}.card{padding:15px}.card .value{font-size:24px}.tabs{gap:16px}.tabs button{font-size:13px}article{padding:16px}.panel-head{align-items:flex-start;flex-wrap:wrap}dl{grid-template-columns:95px 1fr}footer{display:block}footer span{display:block}}

#login{max-width:620px;margin:36px auto}#login-form{display:grid;gap:12px;margin-top:22px}#login-form input{width:100%}#login-form button{justify-self:end}

.selectors{display:flex;gap:14px;flex-wrap:wrap;max-width:650px}.selectors label{min-width:0;flex:1}.selectors select{max-width:100%;width:100%;min-width:230px}#benchmark-note{margin-bottom:18px;color:var(--gold)}@media(max-width:1100px){.heading{align-items:flex-start;flex-wrap:wrap}.selectors{width:100%}}@media(max-width:600px){.selectors{display:block}.selectors select{min-width:0}}
