:root{
  --bg:#ffffff;
  --panel:#fafafa;
  --text:#1f2937;
  --muted:#6b7280;
  --line:#e5e7eb;
  --hover:#f3f4f6;
  --selected:#e8f1ff;
  --accent:#2563eb;
  --danger:#b91c1c;
  --font: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}
*{box-sizing:border-box;}
html,body{height:100%;margin:0;background:var(--bg);font-family:var(--font);color:var(--text);}

/* Guest dark mode (login) */
body.guest.dark{
  --bg:#070A12;
  --panel:#0B1220;
  --text:#E5E7EB;
  --muted:#9CA3AF;
  --line:rgba(255,255,255,.10);
  --hover:rgba(255,255,255,.06);
  --selected:rgba(37,99,235,.22);
  --accent:#60A5FA;
  --danger:#FCA5A5;
}
.dark{
  --bg:#070A12;
  --panel:#0B1220;
  --text:#E5E7EB;
  --muted:#9CA3AF;
  --line:rgba(255,255,255,.10);
  --hover:rgba(255,255,255,.06);
  --selected:rgba(37,99,235,.22);
  --accent:#60A5FA;
  --danger:#FCA5A5;
}
.dark .card{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.10);}
.dark .sidebar{background:var(--bg);}
.dark .topBar{background:var(--bg);}
.dark .details{background:var(--panel);}
.dark .search{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.10);}
.dark .groupLaunchAllBtn{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.12);}
.dark .groupLaunchAllBtn:hover{background:rgba(255,255,255,.06);}
.dark .sessionBtn,.dark .backBtn{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.12);color:var(--text);}
.dark .sessionBtn:hover,.dark .backBtn:hover{background:rgba(255,255,255,.06);}
.dark input,.dark textarea,.dark select{background:rgba(0,0,0,.25);border-color:rgba(255,255,255,.12);color:var(--text);}
.dark code{color:#e5e7eb;}
.guestWrap{min-height:100vh;display:flex;align-items:center;}
body.guest .guestWrap{justify-content:center;padding:28px;width:100%;max-width:none;margin:0;}
body.guest .guestWrap .card{width:100%;max-width:460px;}
body.guest .card{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.10);}
body.guest label{display:block;margin-top:10px;margin-bottom:6px;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.02em;}
body.guest input{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.25);
  color:var(--text);
  outline:none;
}
body.guest input:focus{border-color:rgba(96,165,250,.55);box-shadow:0 0 0 3px rgba(96,165,250,.18);}
body.guest .btn{border-radius:12px;}
body.guest .btn.btn-primary{background:linear-gradient(135deg,#2563eb,#60a5fa);border:0;color:#fff;}
body.guest .btn.btn-primary:hover{filter:brightness(1.03);}

.legalWarn{
  margin-top:14px;
  padding:12px 12px;
  border:1px solid rgba(252,165,165,.35);
  background:rgba(185,28,28,.10);
  border-radius:12px;
  color:var(--text);
  font-size:12px;
  line-height:1.35;
}
.legalWarn b{color:#FCA5A5;}

/* ===== Density variables (defaults = Comfortable) ===== */
body{
  --rowPadY:10px;
  --rowPadX:10px;
  --rowGap:10px;
  --rowRadius:10px;
  --rowFont:14px;

  --groupPadY:8px;
  --groupPadX:8px;
  --groupMarginTop:0px;

  --treePad:8px;

  --launchPad:6px;
  --iconSize:20px;
  --pcSize:18px;

  --itemsIndent:18px;
}

/* Compact */
body.density-compact{
  --rowPadY:7px;
  --rowPadX:8px;
  --rowGap:8px;
  --rowRadius:9px;
  --rowFont:13px;
  --groupPadY:6px;
  --groupPadX:6px;
  --groupMarginTop:4px;
  --treePad:6px;
  --launchPad:4px;
  --iconSize:19px;
  --pcSize:18px;
  --itemsIndent:16px;
}

/* Dense */
body.density-dense{
  --rowPadY:5px;
  --rowPadX:6px;
  --rowGap:7px;
  --rowRadius:8px;
  --rowFont:13px;
  --groupPadY:4px;
  --groupPadX:6px;
  --groupMarginTop:6px;
  --treePad:4px;
  --launchPad:3px;
  --iconSize:18px;
  --pcSize:17px;
  --itemsIndent:14px;
}

/* Layout */
.layout{display:flex;height:100vh;width:100%;}
.layout.swap{flex-direction:row-reverse;}
.sidebar{width:390px;border-right:1px solid var(--line);display:flex;flex-direction:column;background:var(--bg);}
.layout.swap .sidebar{border-right:none;border-left:1px solid var(--line);}
.details{flex:1;background:var(--panel);padding:16px;overflow:auto;}

/* Top bar (left pane) */
.topBar{
  padding:10px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--bg);
}
.topLeft{display:flex;align-items:center;gap:10px;min-width:0;}
.brand{display:flex;flex-direction:column;gap:2px;min-width:0;}
.title{font-weight:800;font-size:14px;color:var(--text);white-space:nowrap;}
.gearLink{display:inline-flex;align-items:center;justify-content:center;margin-left:8px;color:var(--muted);text-decoration:none;}
.gearLink:hover{color:var(--text);}
.gearIcon{width:16px;height:16px;vertical-align:middle;}
.appVersion{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.02em;white-space:nowrap;}

/* Right-side controls */
.controls{display:flex;align-items:center;gap:10px;}
.controlsStack{flex-direction:column;align-items:flex-end;gap:8px;}
.controlsStack .densitySelect{min-width:140px;}
.densitySelect{
  font-size:12px;
  border:1px solid var(--line);
  border-radius:10px;
  padding:6px 8px;
  background:#fff;
  color:var(--text);
  outline:none;
}

/* Swap toggle */
.toggle{display:flex;align-items:center;gap:8px;user-select:none;cursor:pointer;color:var(--muted);font-size:12px;white-space:nowrap;}
.switch{width:44px;height:24px;border-radius:999px;background:#e5e7eb;position:relative;transition:.15s;flex:0 0 auto;}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.15);transition:.15s;}
.toggle input{display:none;}
.toggle input:checked + .switch{background:rgba(37,99,235,.25);}
.toggle input:checked + .switch::after{left:23px;background:#fff;}

/* Quick bar (above search) */
.quickWrap{padding:10px;border-bottom:1px solid var(--line);background:var(--bg);}
.quickRow{display:flex;gap:8px;align-items:center;margin:0;}
.quickInput{flex:1;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14px;outline:none;}
.quickBtn{
  border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.quickBtn:hover{background:var(--hover);}
.quickBtn .launchIcon{width:22px;height:22px;stroke:var(--accent);}

/* Search */
.searchWrap{padding:10px;border-bottom:1px solid var(--line);background:var(--bg);}
.search{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--muted);}
.search svg{width:16px;height:16px;opacity:.7;}
.search input{border:0;outline:none;width:100%;font-size:13px;color:var(--text);background:transparent;}
.clearBtn{
  border:0;background:transparent;cursor:pointer;
  width:28px;height:28px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  color:var(--muted);font-size:18px;line-height:1;
}
.clearBtn:hover{background:var(--hover);color:var(--text);}

/* Tree */
.tree{overflow:auto;padding:var(--treePad);flex:1;}
.group{margin:2px 0;}
.groupHeader{
  display:flex;align-items:center;gap:6px;
  padding:var(--groupPadY) var(--groupPadX);
  margin-top:var(--groupMarginTop);
  font-size:12px;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:.02em;cursor:default;user-select:none;
}
.groupLaunchAllBtn{
  margin-left:auto;
  border:1px solid var(--line);
  background:#fff;
  color:var(--muted);
  border-radius:999px;
  padding:4px 10px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:none;
  cursor:pointer;
}
.groupLaunchAllBtn:hover{background:var(--hover);color:var(--text);}
.caret{
  width:0;height:0;border-left:5px solid var(--muted);
  border-top:4px solid transparent;border-bottom:4px solid transparent;
  transform:rotate(0deg);transition:transform .12s ease;opacity:.9;margin-right:2px;
}
.caret{display:none;}
.items{margin-left:var(--itemsIndent);display:block;}

.customerHeader{padding:6px var(--groupPadX);margin-top:2px;display:flex;align-items:center;gap:8px;}
.customerLink{
  color:var(--muted);text-decoration:none;font-weight:800;font-size:12px;
  display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.customerLink:hover{color:var(--text);text-decoration:underline;}

/* Ensure customer links are always clickable */
.customerHeader{position:relative;z-index:2;}
.row{position:relative;z-index:1;}

.favBtn{
  border:0;background:transparent;cursor:pointer;
  color:#f59e0b;font-size:14px;line-height:1;
  padding:2px 4px;border-radius:8px;
}
.favBtn:hover{background:rgba(245,158,11,.12);}

/* Rows */
.row{
  display:flex;align-items:center;gap:var(--rowGap);
  padding:var(--rowPadY) var(--rowPadX);
  border-radius:var(--rowRadius);
  cursor:default;user-select:none;
  font-size:var(--rowFont);color:var(--text);
  line-height:1.2;
}
.row:hover{background:var(--hover);}
.row.selected{background:var(--selected);outline:1px solid rgba(37,99,235,.15);}
.rowLink{display:flex;align-items:center;gap:var(--rowGap);text-decoration:none;color:inherit;flex:1;min-width:0;}
.name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;}
.pcIcon{width:var(--pcSize);height:var(--pcSize);flex:0 0 auto;color:var(--accent);opacity:.98;}

/* Power icon launch button */
.launchBtn{
  border:0;background:transparent;cursor:pointer;
  padding:var(--launchPad);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  -webkit-tap-highlight-color: transparent;
}
.launchIcon{width:var(--iconSize);height:var(--iconSize);stroke:#9ca3af;transition:.15s;}
.launchBtn:hover .launchIcon{stroke:#f97316;}
.launchBtn:hover{background:rgba(37,99,235,.08);}

/* Details header (right pane) */
.detailsHeader{
  position:sticky;top:0;z-index:5;
  background:var(--panel);
  padding:10px 8px;margin:-16px -16px 12px -16px;
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;
}
.detailsHeaderLeft{display:flex;align-items:center;gap:10px;min-width:0;width:100%;}
.detailsTitle{margin-left:auto;font-weight:800;font-size:14px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.backBtn{
  border:1px solid var(--line);background:#fff;border-radius:12px;
  padding:8px 10px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;
  font-size:13px;color:var(--text);white-space:nowrap;
}
.sessionBtn{
  border:1px solid var(--line);background:#fff;border-radius:12px;
  padding:8px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;
  font-size:13px;color:var(--text);white-space:nowrap;
}
.sessionBtn:hover{background:var(--hover);}
.sessionBtn:disabled{opacity:.5;cursor:not-allowed;}

/* Session Log note input */
textarea[name="note"]{
  width:100%;
  box-sizing:border-box;
  resize:vertical;
}

/* Cards */
.card{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:14px;box-shadow:0 1px 2px rgba(0,0,0,.03);margin-bottom:12px;
}
.cardTitle{font-weight:900;margin-bottom:10px;font-size:16px;}
.empty{color:var(--muted);font-size:14px;}
.kv{display:grid;grid-template-columns:140px 1fr;gap:8px 10px;font-size:13px;align-items:start;}
.k{color:var(--muted);}
.muted{color:var(--muted);}
pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;}

/* Flash */
.flash{padding:10px 12px;border-radius:12px;margin:0 0 10px 0;font-size:13px;border:1px solid var(--line);background:#fff;}
.flash.ok{border-color:#a7f3d0;background:#ecfdf5;color:#065f46;}
.flash.err{border-color:#fecaca;background:#fef2f2;color:var(--danger);}
.flashWrap{margin-bottom:8px;}

/* ===== Admin shell (modern, not the launcher UI) ===== */
body.admin{background:var(--bg);}
.adminShell{min-height:100vh;display:flex;flex-direction:column;}
.adminTopbar{
  position:sticky;top:0;z-index:10;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;
  border-bottom:1px solid var(--line);
  background:color-mix(in oklab, var(--bg) 92%, var(--panel));
  backdrop-filter:saturate(140%) blur(8px);
}
.adminBrand{display:flex;align-items:baseline;gap:10px;min-width:0;}
.adminTitle{font-weight:900;letter-spacing:.01em;}
.adminTopbarRight{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}

.adminBody{
  display:grid;
  grid-template-columns:260px 1fr;
  min-height:0;
  flex:1;
  background:var(--panel);
}
.adminNav{
  border-right:1px solid var(--line);
  background:color-mix(in oklab, var(--bg) 85%, var(--panel));
  padding:16px 12px;
  align-self:start;
}
.adminNavUser{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:12px;}
.dark .adminNavUser{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.10);}
.adminNavUserName{font-weight:800;}
.adminNavLinks{display:flex;flex-direction:column;gap:6px;}
.adminNavLink{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;
  border-radius:12px;
  color:var(--text);
  text-decoration:none;
  border:1px solid transparent;
}
.adminNavLink:hover{background:var(--hover);border-color:var(--line);}
.adminMain{
  padding:18px 18px 30px;
  min-width:0;
  background:var(--panel);
}

/* Keep scroll/OS chrome themed in dark mode */
.dark{color-scheme:dark;}
.adminHeader{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:2px 0 14px;}
.adminPageTitle{font-size:18px;font-weight:900;letter-spacing:.01em;}
.adminBuild{font-size:12px;white-space:nowrap;}

/* Make admin tables/forms feel modern without changing functionality */
table.data{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:12px;border:1px solid var(--line);background:#fff;}
.dark table.data{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.10);}
table.data thead th{
  text-align:left;font-size:12px;letter-spacing:.02em;color:var(--muted);
  background:color-mix(in oklab, var(--panel) 55%, #fff);
  padding:10px 12px;border-bottom:1px solid var(--line);
}
.dark table.data thead th{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.10);}
table.data td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
table.data tbody tr:hover td{background:var(--hover);}
table.data tbody tr:last-child td{border-bottom:none;}

/* Responsive: keep nav + content side-by-side (no giant vertical gaps) */
@media (max-width: 980px){
  .adminBody{grid-template-columns:220px 1fr;}
  .adminNav{padding:12px 10px;}
  .adminNavUser{padding:10px 10px;}
  .adminNavLink{padding:9px 10px;}
}

/* Mobile: list/details toggle */
@media (max-width: 900px){
  .layout{display:block;height:100vh;}
  .sidebar{width:100%;border-right:none;border-bottom:1px solid var(--line);}
  .layout.swap .sidebar{border-left:none;border-bottom:1px solid var(--line);}
  .details{width:100%;height:100vh;display:none;padding:16px;}
  body.mobile-details .details{display:block;}
  body.mobile-details .sidebar{display:none;}
  .toggle{display:none;}
}
