:root{
  --bg:#121212; --card:#1e1e1e; --muted:#2a2a33;
  --text:#e5e7eb; --sub:#9ca3af; --red:#b91c1c; --red2:#ef4444; --green:#10b981;
}
*{box-sizing:border-box} body{font-family:'Roboto Mono',ui-monospace,Menlo,monospace; background:var(--bg); color:var(--text)}
table{width:100%; border-collapse:collapse; font-size:.95rem}
table thead tr{border-bottom:1px solid #2a2a2a}
table th{font-weight:600; letter-spacing:.02em; padding-bottom:14px}
table td{font-size:.92rem}
a{color:#93c5fd;text-decoration:none}
.h1{font-size:1.5rem; font-weight:700}
.h2{font-size:1.125rem; font-weight:600; margin-top:1rem}
.card{background:var(--card); border:1px solid #2a2a2a; border-radius:12px; padding:16px}
.card.shadow{box-shadow:0 0 10px rgba(100,30,22,.35); border-color:#2a2a2a}
.card-title{font-weight:600; color:#641E16}

.btn{display:inline-block; padding:8px 12px; border-radius:10px; border:1px solid #373a44; background:#1a1b22; color:var(--text)}
.btn:hover{background:#232530}
.btn-primary{border-color:var(--red); background:#1a0f12}
.btn-primary:hover{background:#281115}
.btn-danger{border-color:#7f1d1d; background:#1a0f10}
.btn-success{border-color:#065f46; background:#0d1917}
.btn-secondary{border-color:#374151; background:#171920}
.btn-secondary:hover{background:#641E16; color:#fce8e6; border-color:#87231d}
.btn-secondary.action-edit:hover,
.btn-secondary.action-reset:hover,
.btn-ghost.action-detail:hover{background:#641E16; color:#fce8e6}
.btn-ghost{border:1px solid transparent; background:transparent; color:var(--sub)}

.input, .codebox{
  width:100%; padding:10px 12px; border:1px solid #2e2f36; background:#0e0f14; color:var(--text);
  border-radius:10px; outline:none;
}
.input:focus, .codebox:focus{border-color:#4b5563}
.textarea{min-height:120px}
.label{display:block; font-size:.9rem; color:var(--sub); margin-bottom:6px}
.table{display:grid; gap:6px}
.row{display:grid; grid-template-columns: 1fr 120px 1fr; gap:8px; padding:8px; background:#0f1015; border:1px solid #20222a; border-radius:10px}
.row.head{background:#15161c; font-weight:600}
.pill{display:inline-block; padding:3px 8px; border-radius:999px; font-size:.8rem; border:1px solid #30323a}
.pill.ok{color:#bbf7d0; border-color:#14532d; background:#052e1b}
.pill.warn{color:#fed7aa; border-color:#7c2d12; background:#2a130a}
.flash{padding:10px 12px; border-radius:10px; border:1px solid #2f313a; background:#12131a}
.flash.ok{border-color:#166534; background:#0d1b14}
.flash.err{border-color:#7f1d1d; background:#1a1010}
.max-w-6xl{max-width:72rem} .max-w-5xl{max-width:64rem} .mx-auto{margin:0 auto} .px-4{padding-left:1rem;padding-right:1rem} .py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem} .py-8{padding-top:2rem;padding-bottom:2rem}
.mt-2{margin-top:.5rem} .mt-3{margin-top:.75rem} .mt-4{margin-top:1rem} .mt-6{margin-top:1.5rem} .mt-8{margin-top:2rem}
.mb-4{margin-bottom:1rem}
.grid{display:grid} .gap-3{gap:.75rem} .gap-4{gap:1rem} .gap-6{gap:1.5rem} .md\:grid-cols-2{grid-template-columns:repeat(1, minmax(0,1fr))}
.flex{display:flex} .items-center{align-items:center} .justify-between{justify-content:space-between} .justify-end{justify-content:flex-end} .gap-2{gap:.5rem}
@media (min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2, minmax(0,1fr))}}
.w-full{width:100%}
.list-reset{list-style:none; padding:0; margin:0}
.tree ul{margin-left:1rem; padding-left:1rem; border-left:1px solid rgba(148,163,184,.3)}
.tree li{margin:.25rem 0}
.tag{display:inline-block; background:#1f2937; border-radius:6px; padding:4px 8px; font-size:.8rem; color:#cbd5f5}
.row-actions{display:flex; gap:.5rem; justify-content:flex-end; align-items:center}
.badge{display:inline-block; padding:2px 6px; border-radius:999px; font-size:.75rem; background:#1f2937; color:#93c5fd}
.badge-ok{background:#052e1b; border:1px solid #14532d; color:#bbf7d0}
.badge-warn{background:#2a130a; border:1px solid #7c2d12; color:#fecaca}
.table-scroll{overflow-x:auto}

.status-dot{display:inline-flex; width:10px; height:10px; border-radius:999px; background:#2563eb}
.status-dot.ok{background:#22c55e}
.status-dot.warn{background:#f43f5e}

.checkbox-row{display:flex; align-items:center; gap:.5rem}

.page-heading{display:flex; flex-direction:column; gap:.75rem; margin-bottom:1.25rem}
.text-muted{color:var(--sub); font-size:.9rem}
.section-title{font-size:1.1rem; font-weight:600; margin-bottom:.5rem}
.input-textarea{min-height:96px; resize:vertical}
.checkbox{display:flex; align-items:center; gap:.5rem}
@media (min-width:768px){.page-heading{flex-direction:row; align-items:center; justify-content:space-between}}

.table-sort{display:inline-flex; align-items:center; gap:.25rem; color:inherit}
.table-sort:hover{color:#641E16}
.sort-indicator{font-size:.75rem; opacity:.7}

form.inline{display:inline}

.user-table{border-collapse:collapse; width:100%; font-family:'Roboto Mono',ui-monospace,Menlo,monospace}
.user-row>td{border-bottom:1px solid #2a2a2a; padding:10px}
.user-table tbody tr:first-child td{padding-top:16px}
.user-field:hover{color:#641E16}
.user-row:last-child{border-bottom:none}
.user-field.is-disabled{color:var(--red2)}
.user-field.is-disabled:hover{color:var(--red)}
.user-disabled{background:rgba(185,28,28,0.06)}

.group-membership{display:flex; flex-direction:column; gap:1rem}
.group-controls{display:flex; align-items:center; gap:.75rem; max-width:26rem}
.group-controls .btn{padding:.55rem .9rem}
.group-chip-list{display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.5rem}
.group-chip{display:inline-flex; align-items:center; gap:.5rem; background:#2a2a2a; border:1px solid #333; border-radius:999px; padding:.35rem .7rem; font-size:.85rem}
.group-chip-remove{background:transparent; border:none; color:#cbd5f5; cursor:pointer; font-size:1rem; line-height:1; padding:0}
.group-chip-remove:hover{color:#641E16}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.group-row-focus{background:rgba(147,197,253,0.12); box-shadow:inset 0 0 0 2px rgba(147,197,253,0.5)}
.chart-area{position:relative; min-height:320px}
.chart-area canvas{max-width:100%; max-height:320px}

.activity-log{max-height:260px; overflow-y:auto; padding-right:8px}
.activity-log::-webkit-scrollbar{width:8px}
.activity-log::-webkit-scrollbar-thumb{background:#2a2a2a; border-radius:6px}
.activity-log::-webkit-scrollbar-track{background:transparent}

.multi-select{position:relative}
.multi-select-toggle{width:100%; display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-radius:10px; border:1px solid #2e2f36; background:#0e0f14; color:var(--text); cursor:pointer; font-size:.95rem}
.multi-select-toggle:focus-visible{outline:2px solid #641E16; outline-offset:3px}
.multi-select.is-open .multi-select-toggle{border-color:#641E16}
.multi-select-panel{position:absolute; top:calc(100% + 8px); left:0; width:100%; background:var(--card); border:1px solid #2a2a2a; border-radius:12px; padding:12px; box-shadow:0 16px 30px rgba(0,0,0,.38); z-index:30}
.multi-select-panel[hidden]{display:none}
.multi-select-controls{margin-bottom:12px}
.multi-select-options{max-height:240px; overflow:auto; border:1px solid #2a2a2a; border-radius:10px; padding:4px}
.multi-select-option{display:flex; align-items:center; gap:.65rem; padding:6px 8px; border-radius:8px; cursor:pointer; font-size:.9rem}
.multi-select-option:hover{background:rgba(100,30,22,.16)}
.multi-select-option.is-hidden{display:none}
.multi-select-option input[type="checkbox"]{width:16px; height:16px; accent-color:#641E16}
.multi-select-actions{display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:12px}

.site-brand{display:flex; flex-direction:column; align-items:flex-start; gap:.4rem}
.site-brand-logo{height:48px; width:auto; display:block}
.site-brand-name{display:inline-block; line-height:1.1}