/* ============================================================
   systems.css — shared surface for the four rooms built on real modules
   with no prior UI: 07 Skills · 17 Memory · 18 Cron · 19 Observability.

   Gateway OS track only. Opaque warm-black, hairline borders, 120ms
   background/border transitions, no transform on hover, no backdrop blur.
   ============================================================ */

.sys-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--s-3);margin-bottom:var(--s-4)}
.sys-stat{display:flex;flex-direction:column;gap:var(--s-1);background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-3);padding:var(--s-4)}
.sys-stat__k{font-family:var(--font-mono);font-size:9.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim)}
.sys-stat__v{font-family:var(--font-display);font-size:28px;font-weight:600;line-height:1.05;color:var(--text-0)}
.sys-stat__v--off{color:var(--text-3)}
.sys-stat__d{font-family:var(--font-mono);font-size:10.5px;color:var(--text-3);line-height:1.4}

.sys-bar{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;margin-bottom:var(--s-3)}
.sys-bar__k{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim)}
.sys-bar__path{font-family:var(--font-mono);font-size:11.5px;color:var(--gold-3);background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-2);padding:3px 8px;overflow-wrap:anywhere}
.sys-bar__note{font-family:var(--font-mono);font-size:10.5px;color:var(--text-3)}

.sys-input{background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-2);color:var(--text-0);font-family:var(--font-body);font-size:12px;padding:6px 9px;transition:background-color .12s,border-color .12s}
.sys-input:focus{outline:none;background:var(--bg-3);border-color:var(--stroke-gold)}
.sys-input--sm{width:104px}
.sys-input--grow{flex:1;min-width:180px}
.sys-input.mono,.sys-input.mono::placeholder{font-family:var(--font-mono)}
.sys-input::placeholder{color:var(--text-faint)}
.sys-textarea-wrap{display:flex;flex-direction:column;gap:var(--s-1);margin-bottom:var(--s-3)}
.sys-textarea-wrap>span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim)}
.sys-textarea{min-height:120px;resize:vertical;font-family:var(--font-mono);font-size:11.5px;line-height:1.5}

.sys-chip{background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-pill);color:var(--text-2);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;padding:4px 11px;cursor:pointer;transition:background-color .12s,border-color .12s,color .12s}
.sys-chip:hover{background:var(--bg-3);border-color:var(--stroke-2)}
.sys-chip--on{background:var(--bg-4);border-color:var(--stroke-gold);color:var(--gold-4)}

.btn.gold{background:var(--gold-bg);border:1px solid var(--stroke-gold);color:var(--gold-4)}
.btn.gold:hover:not(:disabled){background:var(--gold-1);border-color:var(--gold-2)}
.btn.gold:disabled{opacity:.4;cursor:not-allowed}

.sys-table{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:var(--s-4)}
.sys-table th{font-family:var(--font-mono);font-size:9.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim);text-align:left;padding:0 var(--s-3) var(--s-2);border-bottom:1px solid var(--stroke-1)}
.sys-table td{padding:var(--s-3);border-bottom:1px solid var(--stroke-0);color:var(--text-1);vertical-align:top}
.sys-table tbody tr{transition:background-color .12s}
.sys-table tbody tr:hover{background:var(--bg-2)}
.sys-table tr.sys-tr--on{background:var(--bg-3)}
.sys-table .mono{font-family:var(--font-mono);font-size:11px}
.sys-actions{display:flex;gap:var(--s-2);white-space:nowrap}
.sys-jobname{color:var(--text-0);font-weight:500}
.sys-target{color:var(--text-3);max-width:200px;overflow-wrap:anywhere}
.sys-state{font-family:var(--font-mono);font-size:10.5px;color:var(--text-2);background:var(--bg-3);border:1px solid var(--stroke-1);border-radius:var(--r-pill);padding:2px 9px}

.sys-empty{background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-3);padding:var(--s-6);text-align:center;margin-bottom:var(--s-4)}
.sys-empty--tight{padding:var(--s-5);text-align:left}
.sys-empty h2{font-family:var(--font-display);font-size:20px;font-weight:600;color:var(--text-1);margin:0 0 var(--s-2)}
.sys-empty p{font-size:12px;line-height:1.55;color:var(--text-3);margin:0;max-width:62ch;text-wrap:pretty}
.sys-empty--tight p{margin:0}
.sys-empty code,.sys-note code,.sys-log__msg code{font-family:var(--font-mono);font-size:10.5px;color:var(--gold-3)}

.sys-banner{display:flex;gap:var(--s-3);background:var(--bg-2);border:1px solid var(--stroke-1);border-left:2px solid var(--gold-2);border-radius:var(--r-3);padding:var(--s-4);margin-bottom:var(--s-4)}
.sys-banner--warn{border-left-color:var(--red-2)}
.sys-banner__mark{color:var(--gold-3);flex-shrink:0;padding-top:1px}
.sys-banner--warn .sys-banner__mark{color:var(--red-4)}
.sys-banner b{display:block;font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--text-0);margin-bottom:var(--s-1)}
.sys-banner p{font-size:12px;line-height:1.55;color:var(--text-2);margin:0;max-width:78ch;text-wrap:pretty}

.sys-sub{margin-bottom:var(--s-5)}
.sys-sub>h3{display:flex;align-items:center;gap:var(--s-2);font-family:var(--font-display);font-size:19px;font-weight:600;color:var(--text-0);margin:0 0 var(--s-3);padding-bottom:var(--s-2);border-bottom:1px solid var(--stroke-0)}
.sys-count{font-family:var(--font-mono);font-size:10.5px;color:var(--text-3)}
.sys-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--s-4)}
.sys-row{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-3)}
.sys-note{font-size:11.5px;line-height:1.6;color:var(--text-3);margin:0 0 var(--s-2);max-width:82ch;text-wrap:pretty}
.sys-note b{color:var(--text-1);font-weight:600}
.sys-dim{color:var(--text-dim);font-size:11.5px}
.sys-desc{font-size:12.5px;line-height:1.6;color:var(--text-1);margin:0 0 var(--s-3);max-width:78ch;text-wrap:pretty}

.sys-gaps{list-style:none;margin:0 0 var(--s-4);padding:0;display:flex;flex-direction:column;gap:var(--s-1)}
.sys-gaps li{font-family:var(--font-mono);font-size:10.5px;line-height:1.5;color:var(--rd-half);padding-left:var(--s-3);border-left:1px solid var(--stroke-2);text-wrap:pretty}

.sys-err{background:var(--red-bg);border:1px solid var(--stroke-red);border-radius:var(--r-2);padding:var(--s-3);margin-bottom:var(--s-3)}
.sys-err b{font-family:var(--font-mono);font-size:11px;color:var(--red-4)}
.sys-err p{margin:var(--s-2) 0 0}
.sys-warn{background:var(--bg-3);border:1px solid var(--stroke-2);border-radius:var(--r-2);padding:var(--s-3);margin-bottom:var(--s-3)}
.sys-warn b{font-size:12px;color:var(--rd-scaffold)}
.sys-warn p{font-size:11.5px;color:var(--text-2);margin:var(--s-1) 0 0}
.sys-alert{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;background:var(--bg-2);border:1px solid var(--stroke-1);border-left:2px solid var(--gold-2);border-radius:var(--r-2);padding:var(--s-3);margin-bottom:var(--s-3);font-size:11.5px;color:var(--text-2)}
.sys-alert--ok{border-left-color:var(--rd-live)}
.sys-alert b{color:var(--text-0)}
.sys-alert .mono{font-family:var(--font-mono);font-size:10.5px;color:var(--text-3)}

.sys-ready{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;padding:2px 8px;border-radius:var(--r-pill);border:1px solid}
.sys-ready--yes{color:var(--rd-live);border-color:rgba(74,222,128,.3);background:rgba(74,222,128,.07)}
.sys-ready--no{color:var(--rd-scaffold);border-color:rgba(251,146,60,.3);background:rgba(251,146,60,.07)}

.sys-detail{background:var(--bg-2);border:1px solid var(--stroke-gold);border-radius:var(--r-3);padding:var(--s-4);margin-bottom:var(--s-4)}
.sys-detail__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding-bottom:var(--s-3);margin-bottom:var(--s-3);border-bottom:1px solid var(--stroke-1)}
.sys-detail__head b{font-family:var(--font-mono);font-size:12px;color:var(--gold-4)}
.sys-detail .sys-sub>h3{font-size:16px}

.sys-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--s-3);margin-bottom:var(--s-3)}
.sys-kv>div{display:flex;flex-direction:column;gap:2px}
.sys-kv span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim)}
.sys-kv b{font-size:12px;font-weight:500;color:var(--text-0);overflow-wrap:anywhere}
.sys-kv b.mono{font-family:var(--font-mono);font-size:11px;color:var(--text-1)}

.sys-pre{background:var(--bg-1);border:1px solid var(--stroke-0);border-radius:var(--r-2);padding:var(--s-3);font-family:var(--font-mono);font-size:11px;line-height:1.55;color:var(--text-1);overflow:auto;max-height:280px;white-space:pre-wrap;word-break:break-word;margin:0}
.sys-pre--tall{max-height:440px}
.sys-file{margin-top:var(--s-3)}
.sys-file__head{margin-bottom:var(--s-2)}
.sys-file__head b{font-family:var(--font-mono);font-size:11px;color:var(--gold-3)}
.sys-testout{background:var(--bg-3);border:1px solid var(--stroke-1);border-radius:var(--r-2);padding:var(--s-3)}
.sys-testout .sys-kv{margin-bottom:var(--s-2)}

.sys-form{background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-3);padding:var(--s-4);margin-bottom:var(--s-4)}
.sys-form__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--s-3);margin-bottom:var(--s-3)}
.sys-form__grid label,.sys-textarea-wrap{display:flex;flex-direction:column;gap:var(--s-1)}
.sys-form__grid label>span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim)}

.sys-hits{display:flex;flex-direction:column;gap:var(--s-2);margin-bottom:var(--s-3)}
.sys-hit{background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-2);padding:var(--s-3)}
.sys-hit__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-2)}
.sys-hit__head .mono{font-family:var(--font-mono);font-size:10.5px;color:var(--gold-3)}
.sys-hit__score{color:var(--text-dim)!important}
.sys-hit__chunk{font-size:11.5px;line-height:1.6;color:var(--text-2);margin:0;text-wrap:pretty}

.sys-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s-3);margin-bottom:var(--s-3)}
.sys-metric{display:flex;flex-direction:column;gap:var(--s-1);background:var(--bg-2);border:1px solid var(--stroke-1);border-radius:var(--r-3);padding:var(--s-4)}
.sys-metric__k{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;color:var(--steel-4)}
.sys-metric__v{font-family:var(--font-display);font-size:34px;font-weight:600;line-height:1;color:var(--text-0)}
.sys-metric__u{font-family:var(--font-mono);font-size:12px;font-weight:400;color:var(--text-3);margin-left:5px}
.sys-metric__t{font-size:10px;color:var(--text-dim)}
.sys-metric__n{font-size:11px;color:var(--text-3);line-height:1.4}

.sys-logs{display:flex;flex-direction:column;border:1px solid var(--stroke-1);border-radius:var(--r-2);overflow:hidden;margin-bottom:var(--s-3)}
.sys-log{display:grid;grid-template-columns:132px 44px 150px 1fr auto;gap:var(--s-3);align-items:baseline;padding:6px var(--s-3);border-bottom:1px solid var(--stroke-0);background:var(--bg-2);font-size:11.5px}
.sys-log:last-child{border-bottom:none}
.sys-log--warn{background:rgba(250,204,21,.04)}
.sys-log--crit{background:rgba(204,31,31,.07)}
.sys-log__ts{font-size:10px;color:var(--text-dim)}
.sys-log__lv{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase}
.sys-log__lv--info{color:var(--text-3)}
.sys-log__lv--warn{color:var(--rd-half)}
.sys-log__lv--crit{color:var(--red-4)}
.sys-log__src{font-size:10px;color:var(--steel-4);overflow-wrap:anywhere}
.sys-log__msg{color:var(--text-1);line-height:1.45;overflow-wrap:anywhere}
.sys-log__ev{font-size:9.5px;color:var(--text-dim)}
@media (max-width:900px){.sys-log{grid-template-columns:1fr;gap:2px}}
