:root{--bg:#061b13;--panel:rgba(6,20,13,.85);--line:rgba(43,255,136,.18);--line2:rgba(43,255,136,.4);--text:#d2f5df;--muted:#5f8a72;--green:#2bff88;--amber:#c6ff4d;--red:#f87171;--mono:"JetBrains Mono",ui-monospace,Menlo,monospace;--hud:"Rajdhani",system-ui,sans-serif;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;height:100%}body{display:grid;grid-template-columns:240px 1fr;background:var(--bg);color:var(--text);font:14px/1.5 var(--mono)}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}a{color:var(--green)}
input,textarea,select{font:inherit;color:var(--text);background:rgba(2,8,5,.7);border:1px solid var(--line);border-radius:7px;padding:9px 11px;width:100%}
input::placeholder{color:var(--muted)}:focus-visible{outline:2px solid var(--green);outline-offset:1px}
/* sidebar */
.sidebar{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:18px 14px;gap:16px}
.brand{display:flex;align-items:center;gap:9px;font:700 16px var(--hud);letter-spacing:.14em;color:#e6fff0}
.brand-mark{width:16px;height:16px;border:2px solid var(--green);border-radius:50%;box-shadow:0 0 12px var(--green);position:relative}.brand-mark::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--green)}
.resources{display:flex;flex-direction:column;gap:4px}
.res-tab{text-align:left;padding:10px 12px;border-radius:7px;color:var(--muted);border:1px solid transparent;font:600 13px var(--hud);letter-spacing:.08em}
.res-tab:hover{color:var(--text);border-color:var(--line)}.res-tab.active{color:#031018;background:var(--green);box-shadow:0 0 16px rgba(43,255,136,.3)}
.side-foot{margin-top:auto;color:var(--muted);font-size:11px}.api-chip{border:1px solid var(--line);border-radius:6px;padding:7px 9px;margin-bottom:8px}.api-chip b{color:var(--green)}.hint code{color:var(--amber)}
/* main */
.main{display:flex;flex-direction:column;min-width:0;padding:18px 22px;gap:12px;overflow:auto}
.toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.toolbar h1{font:700 22px var(--hud);letter-spacing:.1em;margin:0;color:#e6fff0;min-width:120px}
.search-wrap{position:relative;flex:1;min-width:220px}.search-wrap input{padding-right:84px}
.shown{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--amber);font-size:11px}
.actions{display:flex;gap:8px}
.btn{border:1px solid var(--line2);border-radius:7px;padding:9px 14px;color:var(--text);font:600 12px var(--hud);letter-spacing:.1em;transition:.15s}
.btn:hover{border-color:var(--green);color:var(--green)}.btn.primary{background:var(--green);color:#031018;border-color:var(--green)}
.meta{display:flex;gap:16px;color:var(--muted);font-size:12px;flex-wrap:wrap}.api-results{color:var(--amber)}
/* table */
.table-wrap{border:1px solid var(--line);border-radius:10px;overflow:auto;background:rgba(2,8,5,.4)}
table{border-collapse:collapse;width:100%;font-size:13px}
th,td{padding:11px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
th{color:var(--green);font:600 11px var(--hud);letter-spacing:.14em;position:sticky;top:0;background:#071b14}
tbody tr:hover{background:rgba(43,255,136,.05)}
td.act,th.act{width:1%;white-space:nowrap}
.mini{border:1px solid var(--line);border-radius:5px;padding:5px 9px;font-size:11px;color:var(--muted);margin-left:6px}.mini:hover{color:var(--green);border-color:var(--green)}.mini.danger:hover{color:var(--red);border-color:var(--red)}
.empty{padding:28px;text-align:center;color:var(--muted)}
/* form dialog */
.form-dlg{background:#071b14;color:var(--text);border:1px solid var(--line2);border-radius:12px;padding:0;width:min(520px,92vw)}.form-dlg::backdrop{background:rgba(1,6,4,.7)}
.form-dlg form{padding:22px;display:flex;flex-direction:column;gap:12px}.form-dlg h2{margin:0 0 6px;font:700 18px var(--hud);letter-spacing:.08em;color:#e6fff0}
.field{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted)}.field input[type=checkbox]{width:auto}
.form-bar{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
/* toast */
.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);background:#071b14;border:1px solid var(--green);color:var(--text);padding:11px 16px;border-radius:8px;opacity:0;transition:.3s;z-index:50}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.err{border-color:var(--red)}
@media(max-width:720px){body{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line)}.resources{flex-direction:row;flex-wrap:wrap}.side-foot{display:none}}

.brand-link{text-decoration:none;color:var(--text)}
.brand-link:hover{color:var(--green)}

/* T-058: the table scrolls inside its column rather than widening the page. */
body { grid-template-columns: 240px minmax(0, 1fr); }
.sidebar, .toolbar > *, .actions, .meta > *, .table-wrap { min-width: 0; }
.brand { overflow-wrap: anywhere; }
.brand-mark { flex: none; }
.actions { flex-wrap: wrap; }
.table-wrap { max-width: 100%; flex-shrink: 0; overscroll-behavior-x: contain; }
.table-wrap table { min-width: 640px; }
.search-wrap { min-width: min(220px, 100%); }
.btn, .mini, .res-tab { min-height: 44px; }
.form-dlg { max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); overflow: auto; overscroll-behavior: contain; }
.form-dlg form { padding: 18px; }
.field, .field > *, .form-bar > * { min-width: 0; }
.form-dlg h2, .field, .meta, .side-foot { overflow-wrap: anywhere; }
.form-bar { flex-wrap: wrap; }
.toast { width: max-content; max-width: calc(100vw - 32px); overflow-wrap: anywhere; bottom: max(20px, env(safe-area-inset-bottom)); }
@media (max-width: 720px) {
  body { grid-template-columns: minmax(0, 1fr); height: auto; min-height: 100dvh; }
  .main { overflow: visible; padding: 16px max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
  .sidebar { padding: 16px max(16px, env(safe-area-inset-left)); }
  .side-foot { display: block; }
  .search-wrap { flex-basis: 100%; }
}