:root{--bg:#eef1f4;--surface:#fff;--surface2:#f5f7fa;--fg:#13212d;--muted:#5b6b78;--line:#d5dce3;--accent:#2a4fd6;--accent-fg:#fff;--up:#0b7a4b;--down:#b3261e;--warn:#9a5b00;--warn-bg:#fff3d6;--crit-bg:#fde4e1;--ok-bg:#dff3e8;--info-bg:#e3eaff;--sans:'Noto Sans JP',system-ui,-apple-system,'Hiragino Sans','Yu Gothic',sans-serif;--mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0d141b;--surface:#151f29;--surface2:#1b2733;--fg:#e6edf3;--muted:#93a3b1;--line:#2a3948;--accent:#6d93ff;--accent-fg:#0d141b;--up:#3ecf8e;--down:#ff7b72;--warn:#f0b24a;--warn-bg:#3a2e12;--crit-bg:#432120;--ok-bg:#133a29;--info-bg:#1d2a52;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0d141b;--surface:#151f29;--surface2:#1b2733;--fg:#e6edf3;--muted:#93a3b1;--line:#2a3948;--accent:#6d93ff;--accent-fg:#0d141b;--up:#3ecf8e;--down:#ff7b72;--warn:#f0b24a;--warn-bg:#3a2e12;--crit-bg:#432120;--ok-bg:#133a29;--info-bg:#1d2a52;color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font:14px/1.6 var(--sans);padding-inline:16px;padding-block:12px 40px}
.wrap{max-width:1080px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
h1{font-size:18px;margin:0;font-weight:700}
h2{font-size:14px;margin:0 0 8px;font-weight:700}
.banner{background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn);border-radius:6px;padding:6px 10px;font-weight:700;font-size:13px}
.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bar .sp{flex:1}
.mono,td.n,.n{font-family:var(--mono);font-variant-numeric:tabular-nums}
button,select,input{font:inherit;color:var(--fg)}
button{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:5px 12px;cursor:pointer;min-height:34px}
button:hover{border-color:var(--accent)}
button.pri{background:var(--accent);color:var(--accent-fg);border-color:var(--accent);font-weight:700}
button.dng{background:var(--down);color:#fff;border-color:var(--down);font-weight:700}
button.on{background:var(--crit-bg);border-color:var(--down);color:var(--down);font-weight:700}
button.sm{padding:2px 8px;min-height:26px;font-size:12px}
select,input[type=number],input[type=text]{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:5px 8px;min-height:34px;max-width:100%}
input[type=number]{width:110px;font-family:var(--mono)}
nav{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--line)}
nav button{border:0;border-bottom:3px solid transparent;border-radius:0;background:none;white-space:nowrap;padding:8px 12px}
nav button.cur{border-bottom-color:var(--accent);font-weight:700;color:var(--accent)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px;min-width:0}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
th,td{text-align:left;padding:5px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-size:12px;color:var(--muted);font-weight:500}
td.n,th.n{text-align:right}
.chip{display:inline-block;padding:0 8px;border-radius:10px;font-size:12px;line-height:20px;margin-right:4px;background:var(--surface2);border:1px solid var(--line)}
.chip.ok{background:var(--ok-bg);color:var(--up);border-color:var(--up)}
.chip.warn{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.chip.crit{background:var(--crit-bg);color:var(--down);border-color:var(--down)}
.chip.info{background:var(--info-bg);color:var(--accent);border-color:var(--accent)}
.up{color:var(--up)}.down{color:var(--down)}.muted{color:var(--muted)}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.form{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.form label{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--muted)}
.form label.chk{flex-direction:row;align-items:center;gap:6px;color:var(--fg);font-size:14px}
.note{font-size:12px;color:var(--muted)}
.notice{padding:5px 8px;border-radius:6px;margin-bottom:4px;font-size:13px}
.notice.info{background:var(--info-bg)}.notice.warn{background:var(--warn-bg)}.notice.crit{background:var(--crit-bg)}
.lines{font-family:var(--mono);font-size:12.5px;display:flex;flex-direction:column;gap:2px;white-space:pre-wrap;overflow-wrap:anywhere}
svg text{fill:var(--muted);font-family:var(--mono);font-size:10px}
svg .gl{stroke:var(--line);stroke-width:1}
.tab{display:none;flex-direction:column;gap:12px}.tab.cur{display:flex}
.err{color:var(--down);font-size:13px}
.hash{font-family:var(--mono);font-size:11px;color:var(--muted)}
.hide{display:none!important}
.login{max-width:360px;margin:12vh auto;display:flex;flex-direction:column;gap:10px}
.mb8{margin-bottom:8px}.mb10{margin-bottom:10px}.mt8{margin-top:8px}.mt10{margin-top:10px}.w100{width:100%}td.wc{white-space:normal;min-width:200px}
.navlink{display:inline-block;padding:6px 12px;border:1px solid var(--accent);border-radius:6px;color:var(--accent);font-weight:700;text-decoration:none;margin-left:6px}

h3{font-size:13px;margin:12px 0 6px}
.banner.crit{background:var(--crit-bg);color:var(--down);border-color:var(--down)}
nav button.alert{color:var(--down);font-weight:700}
.pack{white-space:pre-wrap;background:var(--surface2);border:1px solid var(--line);border-radius:6px;padding:10px;font-size:12px;max-height:320px;overflow:auto}
textarea{width:100%;box-sizing:border-box;font:inherit;padding:6px;border:1px solid var(--line);border-radius:6px;background:var(--surface2);color:var(--fg)}

/* ---- ターミナル・スキン(管理画面を端末画面と同じ見た目に) ---- */
:root{--bg:#f4f5f7;--surface:#fff;--surface2:#f7f8fa;--line:#d9dde3;--accent:#2f5fd6;--up:#1f9d55;--down:#d23b3b;--ok-bg:#e3f5ea;--crit-bg:#fbe4e4;--info-bg:#e8eefc}
.card,button,select,input[type=number],input[type=text],.banner,.chip,.notice,.pack,textarea,.navlink{border-radius:3px}
h1{font-family:var(--mono);color:var(--accent);font-weight:600;letter-spacing:.02em}
h2{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--fg);border-bottom:1px solid var(--line);padding-bottom:4px;margin-bottom:10px}
h2::before{content:'◆ ';color:var(--accent);font-size:8px}
h3{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
th{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
.chip{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase}
nav button{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
nav button.cur{border-bottom-width:2px}
.banner{font-family:var(--mono);font-size:12px;letter-spacing:.04em}
button.pri{font-family:var(--mono);letter-spacing:.06em}
#clock{font-family:var(--mono);font-size:16px;font-weight:600;color:var(--fg)}
.note{font-family:var(--mono);font-size:11.5px}