:root{--bg: #0f1115;--surface: #181b22;--surface-2: #20242e;--border: #2a2f3a;--text: #e6e9ef;--muted: #9aa3b2;--accent: #6c8cff;--danger: #ff6b6b;--warn: #f5b14c;--ok: #4caf7d;color-scheme:dark}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{background:var(--surface);border-right:1px solid var(--border);padding:16px 12px}.sidebar-brand{font-weight:700;font-size:18px;padding:8px 12px 16px;color:var(--accent)}.sidebar-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.sidebar-nav a{display:block;padding:10px 12px;border-radius:8px;color:var(--muted)}.sidebar-nav a:hover{background:var(--surface-2);color:var(--text)}.sidebar-nav a.active{background:var(--surface-2);color:var(--text);font-weight:600}.app-main{display:flex;flex-direction:column;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;border-bottom:1px solid var(--border);background:var(--surface)}.command-search{width:min(420px,100%);padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}.topbar-right{display:flex;align-items:center;gap:12px}.env-badge{font-size:12px;font-weight:700;padding:4px 8px;border-radius:6px;letter-spacing:.04em}.env-local{background:#243042;color:var(--accent)}.env-staging{background:#3a2f12;color:var(--warn)}.env-prod{background:#3a1620;color:var(--danger)}.user-menu{position:relative}.user-menu-trigger{display:flex;flex-direction:column;align-items:flex-end;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:6px 10px;color:var(--text);cursor:pointer}.user-name{font-weight:600}.user-role{font-size:12px;color:var(--muted)}.user-menu-popover{position:absolute;right:0;top:calc(100% + 6px);background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:8px;min-width:200px;z-index:20}.user-menu-meta{padding:4px 8px 8px;border-bottom:1px solid var(--border);margin-bottom:6px}.user-menu-popover button{width:100%;text-align:left;background:transparent;border:none;color:var(--text);padding:8px;border-radius:6px;cursor:pointer}.user-menu-popover button:hover{background:var(--surface)}.app-content{padding:24px;overflow:auto}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.page-header h1{font-size:22px;margin:0}.muted{color:var(--muted)}.state-block{display:flex;flex-direction:column;gap:8px;padding:32px;align-items:center;color:var(--muted)}.state-title{font-weight:600;color:var(--text);margin:0}.spinner{width:28px;height:28px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.metric-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.metric-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px}.metric-value{font-size:28px;font-weight:700}.metric-label{color:var(--muted);margin-top:4px}.login-screen{min-height:100vh;display:grid;place-items:center;background:var(--bg)}.login-card{width:min(360px,92vw);background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:28px;display:flex;flex-direction:column;gap:14px}.login-card label{display:flex;flex-direction:column;gap:6px;font-size:14px}.login-card input{padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}.login-card button{padding:10px 12px;border-radius:8px;border:none;background:var(--accent);color:#fff;font-weight:600;cursor:pointer}.login-card button:disabled{opacity:.6;cursor:default}.error-boundary{padding:40px;text-align:center}.toolbar{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}.search-input{flex:1 1 280px;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}.toolbar select{padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:12px}.data-table{width:100%;border-collapse:collapse;font-size:14px}.data-table th,.data-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--border);white-space:nowrap}.data-table th{background:var(--surface-2);color:var(--muted);font-weight:600}.data-table tbody tr:last-child td{border-bottom:none}.data-table tr.clickable{cursor:pointer}.data-table tbody tr.clickable:hover{background:var(--surface-2)}.cell-strong{font-weight:600}.cell-sub{color:var(--muted);font-size:12px}.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:var(--surface-2);color:var(--text)}.badge-ok{background:#16321f;color:var(--ok)}.badge-warn{background:#332a14;color:var(--warn)}.badge-danger{background:#33141c;color:var(--danger)}.pager{display:flex;align-items:center;gap:16px;margin-top:16px}.pager button{padding:8px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer}.pager button:disabled{opacity:.5;cursor:default}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px 20px;margin-bottom:16px}.card h2{font-size:16px;margin:0 0 14px}.card-row{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid var(--border)}.card-row:last-child{border-bottom:none}.field{display:flex;flex-direction:column;gap:6px;font-size:14px;margin-bottom:12px}.field input{padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}.action-row{display:flex;gap:12px}.action-row button{padding:9px 16px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer}.action-row button.danger{background:#33141c;border-color:var(--danger);color:var(--danger)}.action-row button:disabled{opacity:.5;cursor:default}.link-button{background:none;border:none;color:var(--accent);cursor:pointer;font-size:14px}.error-text{color:var(--danger);margin-top:8px}.small{font-size:12px}
