:root{--bg:#f5f6f8;--card:#fff;--tx:#1d2330;--mut:#6b7280;--bd:#e3e6eb;--pr:#2f6b3a;--prh:#25552e;--dn:#b42318;--ok:#067647;--sel:#eef5ef;--r:10px}
@media (prefers-color-scheme:dark){:root{--bg:#12151a;--card:#1b1f26;--tx:#e6e8eb;--mut:#9aa1ab;--bd:#2c323c;--sel:#203026}}
*{box-sizing:border-box}
body{margin:0;font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--tx)}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{background:var(--card);border:1px solid var(--bd);border-radius:8px;padding:7px 9px;min-width:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--pr);outline-offset:-1px}
button{border:1px solid var(--bd);background:var(--card);border-radius:8px;padding:7px 12px;cursor:pointer}
button:hover{border-color:var(--mut)}
button:disabled{opacity:.5;cursor:default}
.pri{background:var(--pr);border-color:var(--pr);color:#fff}.pri:hover{background:var(--prh)}
.dan{color:var(--dn)}.mut{color:var(--mut)}.sm{font-size:12px;padding:4px 8px}
.wrap{max-width:1200px;margin:0 auto;padding:16px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:16px;margin-bottom:16px}
.login{max-width:360px;margin:12vh auto}
.login h1{font-size:20px;margin:0 0 16px}
.col{display:flex;flex-direction:column;gap:10px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:end}
.row label,.col label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--mut)}
header{background:var(--card);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:5}
header .wrap{display:flex;align-items:center;gap:12px;padding:10px 16px;flex-wrap:wrap}
header .sp{flex:1}
nav{display:flex;gap:4px;overflow-x:auto}
nav button{border:0;background:none;border-bottom:2px solid transparent;border-radius:0;padding:8px 10px;white-space:nowrap}
nav button.on{border-color:var(--pr);color:var(--pr);font-weight:600}
h2{font-size:16px;margin:0 0 12px}
.tw{overflow:auto;max-width:100%}
table{border-collapse:collapse;width:100%;font-size:13px}
th,td{border-bottom:1px solid var(--bd);padding:6px 8px;text-align:left;white-space:nowrap}
th{font-weight:600;color:var(--mut);position:sticky;top:0;background:var(--card)}
th.s{cursor:pointer}
td.n,th.n{text-align:right}
tr.del td{opacity:.55;text-decoration:line-through}
tr.sub td{font-weight:600;background:var(--sel)}
.bd td{text-align:center;min-width:90px;font-size:12px}
.bd td:first-child{text-align:left}
.bd .busy{background:var(--sel);font-weight:500}
.notice{border-left:3px solid var(--pr);padding:6px 10px;margin:0 0 8px;background:var(--sel);border-radius:0 8px 8px 0}
.notice p{margin:.2em 0}
.pg{display:flex;gap:6px;align-items:center;justify-content:flex-end;margin-top:10px}
.modal{position:fixed;inset:0;background:#0008;display:flex;align-items:center;justify-content:center;padding:16px;z-index:20}
.modal .card{width:100%;max-width:440px;margin:0;max-height:90vh;overflow:auto}
#toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:30;display:flex;flex-direction:column;gap:6px}
#toast div{background:var(--tx);color:var(--bg);padding:9px 14px;border-radius:8px;box-shadow:0 4px 14px #0003}
#toast div.e{background:var(--dn);color:#fff}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:640px){.grid2{grid-template-columns:1fr}.row>*{flex:1 1 140px}}