:root{
  --bg:#050d18;
  --panel:#0b1728;
  --panel2:#081321;
  --panel3:#10233b;
  --line:#173154;
  --text:#e2e8f0;
  --muted:#94a3b8;
  --accent:#2563eb;
  --danger:#b91c1c;
  --ok:#16a34a;
  --slotW:132px;
  --slotH:152px;
  --slotGap:18px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
.hidden{display:none!important}
.screen{min-height:100vh}
.center-screen{display:flex;align-items:center;justify-content:center;padding:24px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:24px;box-shadow:0 16px 40px rgba(0,0,0,.25)}
.login-shell{width:min(420px,95vw)}
.login-card{padding:28px}
.brand-row{display:flex;gap:16px;align-items:center;margin-bottom:18px}
.brand-icon{width:72px;height:72px;border-radius:16px}
h1,h2,h3{margin:0}
p{margin:0}
label{display:block;color:#cbd5e1;margin:14px 0 6px}
input,select,textarea,button{font:inherit}
input,select,textarea{
  width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);
  background:#07111f;color:var(--text);outline:none;
}
select{background:#e5e7eb;color:#111827;border-color:#94a3b8}
textarea{resize:vertical;min-height:80px}
button{
  border-radius:14px;border:1px solid var(--line);padding:10px 16px;background:var(--panel3);color:#fff;
  cursor:pointer;transition:.15s transform,.15s opacity
}
button:hover{opacity:.92}
button:active{transform:translateY(1px)}
button.primary{background:var(--accent);border-color:var(--accent)}
button.danger{background:var(--danger);border-color:var(--danger)}
button.ghost{background:#10233b}
button.small{padding:8px 12px;border-radius:10px}
button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.help-text,.small-note{margin-top:12px;color:var(--muted);font-size:.92rem}
.error-text{color:#fca5a5;margin-top:12px;min-height:20px}
.info-text{color:#93c5fd;margin-top:12px;min-height:20px}
.mono{font-family:Consolas,monospace}
.topbar{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:16px;align-items:center;
  padding:16px 20px;border-bottom:1px solid #0e2239;background:#06111e;position:sticky;top:0;z-index:20
}
.title-main{font-size:1.35rem;font-weight:700}
.title-sub{color:var(--muted);font-size:.92rem;margin-top:2px}
.page-title{font-size:1.1rem;color:#cbd5e1}
.content{padding:16px 14px 22px}
.page-heading h2{font-size:1.9rem}
.page-heading p{margin-top:6px;color:var(--muted)}
.dashboard-heading{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-bottom:10px
}
.view-mode-toggle{display:flex;gap:10px;flex-wrap:wrap}
.split{display:grid;gap:22px}
.two-col{grid-template-columns:1.7fr 1fr}
.form-card,.table-card,.side-card{padding:20px}
.narrow-card{max-width:560px}
.readonly-box{
  width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--line);
  background:#0d1828;color:#cbd5e1
}
.dashboard-canvas{
  position:relative;margin-top:0;min-height:360px;border-radius:24px;border:1px dashed #173154;background:rgba(8,19,33,.6);
  padding:18px;width:100%;
}
.dashboard-slot{
  position:absolute;width:var(--slotW);height:var(--slotH);border-radius:18px;border:1px dashed rgba(23,49,84,.75);
  background:rgba(7,17,31,.35);
}
.tile{
  position:absolute;width:var(--slotW);height:var(--slotH);user-select:none;touch-action:none;cursor:grab;z-index:2;
  overflow:hidden
}
.tile:active{cursor:grabbing}
.tile-inner{
  width:100%;height:100%;padding:12px;border-radius:18px;background:var(--panel2);border:1px solid var(--line);text-align:center;
  display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:0;line-height:0
}
.tile img{width:100px;height:100px;border-radius:14px;display:block;margin:0 auto;flex:0 0 auto}
.tile-title,
.tile-label,
.tile-caption,
.tile-name,
.tile-text,
.tile-subtitle,
.dashboard-canvas .tile > :not(.tile-inner),
.dashboard-canvas .tile-inner > :not(img){
  display:none!important
}
.rows-stack{display:grid;gap:10px}
.contraband-row{
  border:1px solid var(--line);border-radius:16px;background:#091321;padding:12px
}
.contraband-row-top{
  display:grid;grid-template-columns:1.8fr 100px 110px 42px;gap:10px;align-items:end
}
.contraband-row-bottom{
  margin-top:10px;display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:.92rem
}
.max-badge,.default-badge,.row-total-badge{
  padding:6px 10px;border-radius:999px;background:#10233b;border:1px solid var(--line)
}
.row-delete{
  width:42px;height:42px;padding:0;font-size:1.1rem;border-radius:12px;background:#3b0b14;border-color:#7f1d1d
}
.totals-row{display:flex;justify-content:flex-end;margin:8px 0 4px}
.inline-stat{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#07111f;color:#cbd5e1}
.inline-actions,.evidence-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.checkbox-row{display:flex;align-items:center;gap:10px}
.checkbox-row input{width:auto}
.muted-box{padding:14px;border-radius:16px;background:#07111f;border:1px solid var(--line);color:var(--muted)}
.table-wrap{overflow:auto}
.table-wrap table{width:100%;border-collapse:collapse;font-size:.95rem}
.table-wrap th,.table-wrap td{padding:10px 12px;border-bottom:1px solid #173154;vertical-align:top}
.table-wrap th{
  background:#10233b;color:#f8fafc;position:sticky;top:0;cursor:pointer;text-align:left
}
.table-wrap tr:nth-child(even){background:#10233b}
.table-wrap tr:hover{background:#16304d}
.table-wrap button{padding:6px 10px;border-radius:10px}
.group-section{margin-bottom:24px}
.group-title{font-size:1.2rem;font-weight:700;margin-bottom:10px;color:#cbd5e1}
.checks-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.permission-check{display:flex;align-items:center;gap:8px;background:#07111f;border:1px solid var(--line);padding:10px 12px;border-radius:12px}
.permission-check input{width:auto}
.modal{
  position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:22px;z-index:100
}
.modal-card{
  width:min(1180px,96vw);max-height:92vh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:18px
}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;background:#10233b;color:#93c5fd;font-size:.8rem}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 14px}
.detail-item{background:#07111f;border:1px solid var(--line);border-radius:16px;padding:12px}
.detail-item.wide{grid-column:1/-1}
.detail-label{display:block;color:var(--muted);font-size:.86rem;margin-bottom:4px}
.detail-value{display:block;color:var(--text);font-weight:600}
.image-preview{margin-top:12px;border:1px solid var(--line);border-radius:16px;padding:10px;background:#07111f}
.image-preview img{max-width:100%;display:block;border-radius:12px}
@media (max-width:1100px){
  .two-col{grid-template-columns:1fr}
  .topbar{grid-template-columns:auto 1fr auto;grid-template-areas:"apps title logout" "page page page"}
  .page-title{grid-column:1/-1}
}
@media (max-width:700px){
  .contraband-row-top{grid-template-columns:1fr 1fr}
  .detail-grid{grid-template-columns:1fr}
}


@media (max-width: 900px){
  .content{padding:12px}
  .dashboard-canvas{padding:14px}
  .view-mode-toggle{width:100%}
  .view-mode-toggle button{flex:1}
}