:root {
  color-scheme: dark;
  --bg: #070b13;
  --surface: #0e1622;
  --surface-2: #131e2e;
  --surface-3: #0a1320;
  --text: #e8f0ff;
  --muted: #93a5c2;
  --line: rgba(255, 255, 255, .08);
  --primary: #5fb2ff;
  --primary-strong: #8a6bff;
  --danger: #ff6c8a;
  --success: #3ccf91;
  --warning: #ffc54a;
  --shadow: 0 24px 60px rgba(0, 0, 0, .42);
  --sidebar: #0a1322;
  --sidebar-text: #cfd8e3;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f6f7f9;
  --surface: #ffffff;
  --surface-2: #f0f3f6;
  --surface-3: #f8fafc;
  --text: #17202a;
  --muted: #6b7785;
  --line: #dfe5eb;
  --primary: #0f766e;
  --primary-strong: #0b5f59;
  --danger: #c2410c;
  --success: #15803d;
  --warning: #b7791f;
  --shadow: 0 18px 45px rgba(15, 23, 42, .08);
  --sidebar: #101820;
  --sidebar-text: #cfd8e3;
}

* { box-sizing: border-box; }
html { min-height: 100%; }
body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: Tahoma, Arial, sans-serif;
  font-size: 14px;
  letter-spacing: 0;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.auth-page {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 24px;
  background: linear-gradient(180deg, #0c1117, #111922 58%, #0c1117);
}

:root[data-theme="light"] .auth-page {
  background: linear-gradient(180deg, #eef3f2, #f8fafc 58%, #eef1f4);
}

.auth-shell { width: min(520px, 100%); }
.auth-card,
.panel,
.card,
.stats article,
.metric-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    linear-gradient(180deg, rgba(14,22,34,.85), rgba(11,16,26,.92));
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
}

.auth-card { padding: 28px; }
.auth-card h1 { margin: 16px 0 24px; font-size: 22px; }
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: var(--primary);
  color: #fff;
  font-weight: 700;
}

body {
  background:
    radial-gradient(1100px 600px at 12% -5%, rgba(95,178,255,.16), transparent 55%),
    radial-gradient(900px 500px at 95% -10%, rgba(138,107,255,.14), transparent 55%),
    linear-gradient(180deg, #060a12 0%, #070b14 100%);
}
.sidebar {
  position: fixed;
  inset: 0 0 0 auto;
  width: 270px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012)),
    linear-gradient(180deg, rgba(10,19,34,.92), rgba(7,11,19,.96));
  color: #e8f0ff;
  padding: 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  z-index: 10;
  border-left: 1px solid rgba(255,255,255,.08);
}

.brand { display: flex; align-items: center; gap: 12px; min-height: 52px; }
.brand b, .brand small { display: block; }
.brand small { color: #91a0ad; margin-top: 4px; }
.sidebar nav { display: grid; gap: 4px; }
.sidebar nav a,
.logout,
.sidebar-action {
  padding: 11px 12px;
  border-radius: 7px;
  color: var(--sidebar-text);
  border: 0;
  background: transparent;
  text-align: start;
  cursor: pointer;
  min-height: 42px;
}
.sidebar nav a:hover { background: rgba(255,255,255,.06); color: #fff; }
.sidebar nav a.active {
  background: linear-gradient(90deg, rgba(95,178,255,.20), rgba(138,107,255,.14));
  color: #fff;
  border: 1px solid rgba(95,178,255,.42);
  box-shadow: 0 8px 22px rgba(95,178,255,.18);
}
.sidebar-action:hover { background: rgba(255,255,255,.08); color: #fff; }
.logout { margin-top: auto; color: #fca5a5; }
.logout button { width: 100%; justify-content: flex-start; color: inherit; background: transparent; border: 0; padding: 0; min-height: 0; }

.main {
  width: calc(100% - 270px);
  margin-right: 270px;
  padding: 28px;
  min-height: 100vh;
}
.main .topbar h1 {
  background: linear-gradient(135deg, #ffffff 0%, #cfe2ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 800;
}

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 22px;
}
.topbar h1 { margin: 0 0 8px; font-size: 24px; }
.topbar p { margin: 0; color: var(--muted); }
.topbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }

.stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.stats article { padding: 18px; }
.stats span, .price-grid span { color: var(--muted); display: block; margin-bottom: 8px; }
.stats b { font-size: 24px; }

.grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-bottom: 16px; }
.grid.two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.panel, .card { padding: 18px; min-width: 0; }
.panel h2, .card h2 { margin: 0 0 16px; font-size: 17px; }

.stack { display: grid; gap: 14px; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}
.form-grid.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wide { grid-column: 1 / -1; }

label { display: grid; gap: 7px; color: var(--text); font-weight: 600; }
input, select, textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 9px 11px;
  background: var(--surface-3);
  color: var(--text);
}
input[type="checkbox"],
input[type="radio"] {
  width: 18px;
  min-height: 18px;
  accent-color: var(--primary);
}
textarea { min-height: 92px; resize: vertical; line-height: 1.8; }
input:focus, select:focus, textarea:focus {
  outline: 2px solid rgba(15, 118, 110, .22);
  border-color: var(--primary);
}

.check { display: flex; align-items: center; gap: 8px; min-height: 42px; }
.check input { width: 18px; min-height: 18px; }

.button,
button,
.tab,
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 14px;
  background: var(--surface-3);
  color: var(--text);
  cursor: pointer;
  white-space: nowrap;
  font-weight: 700;
}
.button.primary, button.primary, .btn.primary {
  background: linear-gradient(135deg, #5fb2ff 0%, #6e8bff 45%, #8a6bff 100%);
  border-color: rgba(95,178,255,.45);
  color: #fff;
  box-shadow: 0 12px 28px rgba(95,178,255,.24), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.button.primary:hover, button.primary:hover, .btn.primary:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 16px 36px rgba(95,178,255,.32);
}
.button.ghost, .btn-ghost { background: rgba(15, 118, 110, .12); color: var(--primary-strong); border-color: rgba(15, 118, 110, .28); }
:root:not([data-theme="light"]) .button.ghost,
:root:not([data-theme="light"]) .btn-ghost { color: #8ee1d8; }
.button.danger, button.danger { background: rgba(249, 115, 91, .12); border-color: rgba(249, 115, 91, .28); color: var(--danger); }
.button.small, .btn.small { min-height: 32px; padding: 0 10px; font-size: 12px; }
.button.full { width: 100%; }

.notice,
.flash .item {
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 16px;
  border: 1px solid var(--line);
}
.notice.success, .flash .success { background: rgba(54, 198, 122, .12); border-color: rgba(54, 198, 122, .28); color: var(--success); }
.notice.error, .flash .error { background: rgba(249, 115, 91, .12); border-color: rgba(249, 115, 91, .28); color: var(--danger); }
.notice.warning { background: rgba(214, 167, 53, .12); border-color: rgba(214, 167, 53, .28); color: var(--warning); }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 650px; }
th, td { text-align: right; border-bottom: 1px solid var(--line); padding: 11px 10px; vertical-align: middle; }
th { color: var(--muted); font-weight: 600; background: var(--surface-3); }
.actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.actions form { margin: 0; }
.badge, .pill {
  display: inline-block;
  border-radius: 999px;
  padding: 4px 9px;
  background: var(--surface-2);
  color: var(--muted);
  border: 1px solid var(--line);
  font-size: 12px;
}
.badge.active { background: rgba(54, 198, 122, .14); color: var(--success); }
.badge.blocked { background: rgba(249, 115, 91, .14); color: var(--danger); }
.badge.pending { background: rgba(214, 167, 53, .14); color: var(--warning); }
.muted { color: var(--muted); font-size: 13px; }
.section { color: var(--muted); font-weight: 700; margin: 4px 0 10px; }

.dashboard-grid {
  display: grid;
  grid-template-columns: 330px minmax(420px, 1fr) 350px;
  gap: 16px;
  min-height: calc(100vh - 132px);
}
.map-panel { padding: 0; overflow: hidden; min-height: 520px; }
#map { width: 100%; height: 100%; min-height: 520px; }
.list { display: grid; gap: 10px; max-height: calc(100vh - 330px); overflow: auto; padding-left: 4px; }
.row {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface-3);
  cursor: pointer;
}
.row:hover { border-color: rgba(15, 118, 110, .38); }

.analysis-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: calc(100vh - 132px);
  overflow: auto;
}
.analysis-hero {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(15, 118, 110, .16), rgba(214, 167, 53, .09));
}
.analysis-hero h2 {
  margin: 0 0 6px;
  font-size: 18px;
}
.risk-dial {
  min-width: 92px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  padding: 10px;
  text-align: center;
}
.risk-dial span,
.risk-dial small {
  color: var(--muted);
  font-size: 12px;
}
.risk-dial b {
  font-size: 30px;
  line-height: 1;
}
.analysis-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.analysis-actions .button {
  width: 100%;
}
.report-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.report-kpis > div {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-3);
  padding: 10px;
}
.report-kpis span,
.report-tile span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 5px;
}
.report-kpis b,
.report-tile b {
  display: block;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.analysis-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-3);
}
.analysis-tabs button {
  min-height: 34px;
  padding: 0 8px;
  border-radius: 6px;
  background: transparent;
  border-color: transparent;
  color: var(--muted);
}
.analysis-tabs button.active {
  background: var(--surface);
  border-color: var(--line);
  color: var(--text);
}
.analysis-tab-panel { display: none; }
.analysis-tab-panel.active {
  display: grid;
  gap: 10px;
}
.section-title-inline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.section-title-inline h3 {
  margin: 0;
  font-size: 14px;
}
.risk-meter {
  display: grid;
  gap: 6px;
}
.risk-meter-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  overflow: hidden;
  background: linear-gradient(90deg, rgba(54,198,122,.90), rgba(214,167,53,.90), rgba(249,115,91,.92));
}
.risk-meter-bar i {
  position: absolute;
  top: -5px;
  left: 0;
  width: 3px;
  height: 22px;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255,255,255,.18);
}
.risk-meter-labels {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 12px;
}
.report-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-3);
  overflow: hidden;
}
.report-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}
.report-card-head h3 {
  margin: 0 0 5px;
  font-size: 15px;
}
.report-card-head p {
  margin: 0;
  color: var(--muted);
}
.report-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
}
.report-tile {
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255,255,255,.03);
}
.callout-box {
  margin: 0 12px 12px;
  border: 1px solid rgba(15,118,110,.26);
  border-radius: 8px;
  background: rgba(15,118,110,.10);
  padding: 12px;
  line-height: 1.9;
}
.history-list {
  display: grid;
  gap: 8px;
}
.history-item {
  display: grid;
  gap: 4px;
  justify-items: start;
  min-height: auto;
  padding: 10px;
  border-radius: 8px;
  text-align: right;
  background: var(--surface-3);
}
.history-item.active {
  border-color: rgba(15,118,110,.42);
  background: rgba(15,118,110,.12);
}
.history-item span,
.history-item small {
  color: var(--muted);
  font-size: 12px;
}
.source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.source-card {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-3);
  padding: 10px;
  min-height: 118px;
}
.source-card span {
  width: fit-content;
  border: 1px solid rgba(15,118,110,.30);
  border-radius: 999px;
  padding: 3px 7px;
  color: var(--primary-strong);
  background: rgba(15,118,110,.10);
  font-size: 11px;
}
.source-card b { font-size: 13px; }
.source-card small {
  color: var(--muted);
  line-height: 1.6;
}
.analysis-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.risk-score-card {
  min-width: 78px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-3);
  padding: 10px;
  text-align: center;
}
.risk-score-card span,
.metric-card.compact span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 5px;
}
.risk-score-card b {
  display: block;
  font-size: 26px;
  line-height: 1;
}
.analysis-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.metric-card.compact {
  padding: 10px;
  box-shadow: none;
}
.metric-card.compact b {
  display: block;
  font-size: 13px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.analysis-summary {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(15, 118, 110, .10);
  padding: 12px;
  line-height: 1.9;
}
.compact-table {
  max-height: none;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.compact-table table,
.analysis-table {
  min-width: 0;
}
.analysis-table th,
.analysis-table td {
  padding: 9px 8px;
  font-size: 12px;
}
.analysis-table td {
  vertical-align: top;
}
.formula-box {
  max-height: 150px;
  white-space: pre-wrap;
}
.analysis-list {
  margin: 0;
  padding: 0 18px 0 0;
  display: grid;
  gap: 7px;
  line-height: 1.8;
}
.analysis-list.numbered {
  padding: 0 22px 12px 0;
}
pre, .code-box {
  margin: 0;
  direction: ltr;
  background: var(--surface-3);
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 12px;
  overflow: auto;
  max-height: 320px;
  word-break: break-word;
}
code, .mono { direction: ltr; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; }

@media (max-width: 1100px) {
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .map-panel, #map { min-height: 460px; }
  .analysis-panel { max-height: none; }
}

@media (max-width: 860px) {
  .sidebar {
    position: static;
    width: auto;
    min-height: auto;
  }
  .main {
    width: 100%;
    margin-right: 0;
    padding: 18px;
  }
  .form-grid, .grid.two, .grid.three { grid-template-columns: 1fr; }
  .analysis-actions,
  .report-kpis,
  .report-grid,
  .source-grid { grid-template-columns: 1fr; }
  .analysis-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar { align-items: flex-start; flex-direction: column; }
}

.user-app {
  --user-bg: #070b13;
  --user-panel: #0e1622;
  --user-panel-2: #131e2e;
  --user-border: rgba(255,255,255,.07);
  --user-border-strong: rgba(255,255,255,.16);
  --user-text: #e8f0ff;
  --user-muted: #93a5c2;
  --user-soft: #72869f;
  --user-accent: #5fb2ff;
  --user-accent-2: #8a6bff;
  --user-success: #3ccf91;
  --user-warning: #ffc54a;
  --user-danger: #ff6c8a;
  --user-shadow: 0 24px 70px rgba(0,0,0,.45), 0 1px 0 rgba(255,255,255,.04) inset;
  --user-radius: 20px;
  --user-radius-sm: 14px;
  width: 100%;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr) 330px;
  grid-template-rows: 68px minmax(320px, 1fr) minmax(230px, auto);
  grid-template-areas:
    "topbar topbar topbar"
    "left main right"
    "left bottom right";
  gap: 16px;
  padding: 16px;
  background:
    radial-gradient(1100px 600px at 12% -5%, rgba(95,178,255,.16), transparent 55%),
    radial-gradient(900px 500px at 95% -10%, rgba(138,107,255,.14), transparent 55%),
    radial-gradient(800px 600px at 90% 110%, rgba(60,207,145,.08), transparent 65%),
    linear-gradient(180deg, #060a12 0%, #070b14 100%);
  color: var(--user-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.user-panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)) ,
    linear-gradient(180deg, rgba(14,22,34,.85), rgba(11,16,26,.92));
  border: 1px solid var(--user-border);
  border-radius: var(--user-radius);
  box-shadow: var(--user-shadow);
  overflow: hidden;
  backdrop-filter: blur(14px) saturate(135%);
  -webkit-backdrop-filter: blur(14px) saturate(135%);
}

.user-topbar {
  grid-area: topbar;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 18px;
  position: relative;
}

.user-topbar-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  display: flex;
  align-items: center;
  pointer-events: none;
}
.user-topbar-center > * { pointer-events: auto; }

.user-admin-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 0 18px !important;
  height: 42px;
  text-decoration: none;
  background: linear-gradient(135deg, rgba(95,178,255,.18), rgba(138,107,255,.18)) !important;
  border-color: rgba(95,178,255,.4) !important;
  color: #e8f0ff !important;
  font-weight: 700;
  box-shadow: 0 6px 18px rgba(95,178,255,.18);
}
.user-admin-btn:hover {
  background: linear-gradient(135deg, rgba(95,178,255,.28), rgba(138,107,255,.28)) !important;
  border-color: rgba(95,178,255,.6) !important;
  transform: translateY(-1px);
}
.user-admin-btn-icon {
  font-size: 16px;
  line-height: 1;
}

.user-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 260px;
}

.user-brand-badge {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: conic-gradient(from 130deg at 50% 50%, #5fb2ff, #8a6bff 35%, #ff6c8a 70%, #5fb2ff);
  display: grid;
  place-items: center;
  font-weight: 800;
  color: #fff;
  box-shadow: 0 12px 28px rgba(95,178,255,.34), inset 0 0 0 1px rgba(255,255,255,.18);
  position: relative;
}
.user-brand-badge::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(11,16,26,.55), rgba(11,16,26,.85));
}
.user-brand-badge > * { position: relative; z-index: 1; }

.user-brand h1 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
}

.user-brand p {
  margin: 2px 0 0;
  color: var(--user-muted);
  font-size: 12px;
}

.user-topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
  flex: 1;
}

.user-search {
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(430px, 100%);
  min-height: 42px;
  padding: 0 14px;
  background: rgba(255,255,255,.035);
  border: 1px solid var(--user-border);
  border-radius: 14px;
  color: var(--user-muted);
  font-weight: 600;
}

.user-search input {
  width: 100%;
  min-height: 38px;
  padding: 0;
  background: transparent;
  border: 0;
  outline: 0;
  color: var(--user-text);
}

.user-icon-btn,
.user-btn,
.user-nav-item,
.user-property-row,
.user-address-card,
.user-history-item {
  font: inherit;
  letter-spacing: 0;
}

.user-icon-btn {
  min-width: 42px;
  height: 42px;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  border-radius: 14px;
  border: 1px solid var(--user-border);
  background: rgba(255,255,255,.03);
  color: var(--user-text);
  cursor: pointer;
  padding: 0 12px;
  font-weight: 700;
}

.user-icon-btn:hover,
.user-nav-item:hover,
.user-layer-item:hover,
.user-property-row:hover,
.user-address-card:hover,
.user-history-item:hover {
  transform: translateY(-1px);
  border-color: var(--user-border-strong);
  background: rgba(255,255,255,.05);
}

.user-icon-btn.danger { color: #ffd8de; }
.user-logout-form { margin: 0; }

.user-left-sidebar {
  grid-area: left;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.user-section-title {
  font-size: 11px;
  color: var(--user-soft);
  text-transform: uppercase;
  letter-spacing: .18em;
  margin-bottom: 12px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.user-section-title::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--user-accent), var(--user-accent-2));
}

.user-nav-group,
.user-layer-group,
.user-legend,
.user-control-row,
.user-detail-stack,
.user-history-list,
.user-list {
  display: grid;
  gap: 10px;
}

.user-map-camera-grid {
  display: grid;
  grid-template-columns: 1fr 1fr auto auto auto auto;
  gap: 10px;
  align-items: end;
  margin-top: 10px;
}

.user-map-camera-grid label {
  display: grid;
  gap: 6px;
  color: var(--user-muted);
  font-size: 12px;
  font-weight: 800;
}

.user-map-camera-grid input[type="range"] {
  min-height: 32px;
  padding: 0;
}

.user-nav-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-height: 48px;
  padding: 0 14px;
  border-radius: 14px;
  color: var(--user-text);
  background: rgba(255,255,255,.02);
  border: 1px solid transparent;
  transition: .2s ease;
  cursor: pointer;
  text-align: left;
}

.user-nav-item.active {
  background: linear-gradient(90deg, rgba(95,178,255,.20), rgba(138,107,255,.14));
  border-color: rgba(95,178,255,.42);
  box-shadow: 0 8px 22px rgba(95,178,255,.18), inset 0 0 0 1px rgba(255,255,255,.04);
}

.user-nav-item span:first-child {
  width: 20px;
  text-align: center;
  color: #d9e8ff;
}

.user-mini-card,
.user-profile-card,
.user-detail-card,
.user-work-card {
  background: rgba(255,255,255,.025);
  border: 1px solid var(--user-border);
  border-radius: 16px;
  padding: 16px;
}

.user-profile-card { margin-top: auto; }
.user-profile-top { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.user-avatar {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, #1e293b, #334155);
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
}

.user-small,
.user-muted,
.user-detail-label,
.user-detail-note,
.user-property-sub,
.user-source-card small,
.user-history-item span,
.user-history-item small {
  color: var(--user-muted);
  font-size: 12px;
}

.user-muted { line-height: 1.6; }
.user-value {
  font-size: 20px;
  font-weight: 800;
  margin-top: 2px;
}

.user-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.user-map-main {
  grid-area: main;
  position: relative;
  min-height: 320px;
}

.user-map-main #map {
  width: 100%;
  height: 100%;
  min-height: 320px;
  background: #0d1420;
}

.user-map-floating {
  position: absolute;
  top: 16px;
  left: 16px;
  right: 16px;
  z-index: 500;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  pointer-events: none;
}

.user-floating-card {
  pointer-events: auto;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    rgba(8,13,22,.72);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(16px) saturate(150%);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
  border-radius: 18px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 14px 40px rgba(0,0,0,.35), 0 1px 0 rgba(255,255,255,.05) inset;
}

.user-status-pill,
.user-badge {
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  color: #dff3ff;
  background: rgba(77,163,255,.14);
  border: 1px solid rgba(77,163,255,.22);
  padding: 7px 10px;
  white-space: nowrap;
}

.user-right-sidebar {
  grid-area: right;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow: auto;
}

.user-input,
.user-select,
.user-work-card input,
.user-work-card textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--user-border);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  color: var(--user-text);
  padding: 10px 14px;
  outline: 0;
}

.user-work-card textarea {
  min-height: 96px;
  resize: vertical;
}

.user-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border-radius: 14px;
  border: 1px solid var(--user-border);
  padding: 0 14px;
  cursor: pointer;
  color: var(--user-text);
  font-weight: 800;
  background: rgba(255,255,255,.04);
}

.user-btn-primary {
  background: linear-gradient(135deg, #5fb2ff 0%, #6e8bff 45%, #8a6bff 100%);
  color: #fff;
  border-color: rgba(95,178,255,.45);
  box-shadow: 0 14px 32px rgba(95,178,255,.28), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.user-btn-primary:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 18px 38px rgba(95,178,255,.34); }
.user-btn-primary:active { transform: translateY(0); filter: brightness(.96); }

.user-btn-secondary {
  background: rgba(255,255,255,.04);
  color: var(--user-text);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.user-btn-secondary:hover { transform: translateY(-1px); background: rgba(255,255,255,.07); border-color: var(--user-border-strong); }

.user-btn:disabled {
  opacity: .52;
  cursor: not-allowed;
  transform: none !important;
  filter: grayscale(.4);
}

.user-layer-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  background: rgba(255,255,255,.02);
  border: 1px solid var(--user-border);
  border-radius: 14px;
  transition: .2s ease;
}

.user-layer-left { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.user-toggle { position: relative; width: 46px; height: 26px; flex: 0 0 auto; }
.user-toggle input { display: none; }
.user-toggle span {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #243041;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,.06);
}
.user-toggle span::before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  left: 2px;
  top: 2px;
  border-radius: 50%;
  background: #c9d7ea;
  transition: .2s ease;
}
.user-toggle input:checked + span { background: linear-gradient(90deg, var(--user-accent), var(--user-accent-2)); }
.user-toggle input:checked + span::before { transform: translateX(20px); background: #fff; }

.user-legend-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--user-muted);
  font-size: 13px;
}
.user-legend-item span { display: flex; align-items: center; gap: 10px; }
.user-legend-item i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
}

.user-detail-stack > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--user-border);
  padding-bottom: 8px;
}
.user-detail-stack > div:last-child { border-bottom: 0; padding-bottom: 0; }
.user-detail-stack b { text-align: right; overflow-wrap: anywhere; }

.user-bottom-panel {
  grid-area: bottom;
  padding: 18px;
  min-height: 230px;
}

.user-tab-surface { display: none; min-width: 0; }
.user-tab-surface.active { display: grid; }
.user-tab-surface[data-user-panel="dashboard"] {
  grid-template-columns: minmax(380px, 1.05fr) minmax(360px, .95fr);
  gap: 18px;
}

.user-property-list {
  overflow: auto;
  padding-right: 6px;
  max-height: 360px;
}

.user-property-row {
  width: 100%;
  display: grid;
  grid-template-columns: 1.35fr .72fr .72fr .55fr;
  gap: 12px;
  align-items: center;
  padding: 14px;
  margin-bottom: 10px;
  background: rgba(255,255,255,.02);
  border: 1px solid var(--user-border);
  border-radius: 14px;
  color: var(--user-text);
  cursor: pointer;
  text-align: left;
  transition: .2s ease;
}

.user-property-row.active {
  border-color: rgba(95,178,255,.50);
  background: linear-gradient(90deg, rgba(95,178,255,.16), rgba(138,107,255,.10));
  box-shadow: 0 10px 30px rgba(95,178,255,.16);
  transform: translateY(-1px);
}

.user-property-name { font-weight: 700; }
.user-risk-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  padding: 8px 10px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  border: 1px solid transparent;
}
.risk-low { color:#cff8e6; background:rgba(60,207,145,.12); border-color:rgba(60,207,145,.2); }
.risk-medium { color:#ffeccc; background:rgba(245,165,36,.12); border-color:rgba(245,165,36,.2); }
.risk-high { color:#ffd8de; background:rgba(255,93,115,.12); border-color:rgba(255,93,115,.2); }

.user-details { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.user-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.user-detail-card { padding: 14px; }
.user-detail-value { font-size: 18px; font-weight: 800; overflow-wrap: anywhere; }
.user-detail-note { margin-top: 6px; }

.user-risk-box {
  background: linear-gradient(135deg, rgba(77,163,255,.08), rgba(124,92,255,.08));
  border: 1px solid rgba(77,163,255,.15);
  border-radius: 16px;
  padding: 16px;
}
.user-risk-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.user-risk-score {
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
}
.user-risk-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.user-risk-meta .user-mini-card { padding: 12px; }
.user-risk-meta b { display: block; margin-top: 6px; overflow-wrap: anywhere; }

.user-warning {
  border: 1px solid rgba(245,165,36,.28);
  border-radius: 12px;
  background: rgba(245,165,36,.10);
  color: #ffeccc;
  padding: 10px 12px;
  margin-bottom: 10px;
}

.user-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.user-form-grid label {
  display: grid;
  gap: 7px;
  color: var(--user-muted);
  font-size: 12px;
  font-weight: 800;
}
.user-form-grid .wide { grid-column: 1 / -1; }
.user-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.user-preview-grid {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) minmax(320px, .8fr);
  gap: 18px;
  margin-top: 18px;
}
#watermarkCanvas {
  width: 100%;
  max-height: 420px;
  background: #0d1420;
  border: 1px solid var(--user-border);
  border-radius: 16px;
}
.user-code {
  margin: 0;
  width: 100%;
  max-height: 360px;
  overflow: auto;
  background: rgba(255,255,255,.035);
  border: 1px solid var(--user-border);
  border-radius: 14px;
  color: #dbeafe;
  padding: 12px;
  direction: ltr;
  text-align: left;
  white-space: pre-wrap;
}

.user-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.user-card-head h2 { margin: 0; font-size: 16px; }

.user-address-results {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.user-address-card {
  display: grid;
  gap: 7px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid var(--user-border);
  background: rgba(255,255,255,.02);
  color: var(--user-text);
  text-align: left;
  cursor: pointer;
}
.user-address-card span,
.user-address-card small { color: var(--user-muted); }

.user-report-layout {
  display: grid;
  grid-template-columns: minmax(360px, 1.2fr) minmax(280px, .75fr) minmax(280px, .9fr);
  gap: 18px;
}
.user-report-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.user-report-grid > div {
  border: 1px dashed var(--user-border);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255,255,255,.025);
}
.user-report-grid span { display: block; color: var(--user-muted); font-size: 12px; margin-bottom: 6px; }
.user-report-grid b { overflow-wrap: anywhere; }
.user-callout {
  border: 1px solid rgba(77,163,255,.22);
  border-radius: 14px;
  background: rgba(77,163,255,.10);
  color: rgba(229,238,252,.94);
  padding: 12px;
  line-height: 1.7;
  margin-bottom: 12px;
}
.user-list { margin: 0; padding-left: 20px; line-height: 1.7; }

.user-history-item {
  display: grid;
  gap: 5px;
  justify-items: start;
  min-height: auto;
  padding: 10px;
  border-radius: 14px;
  text-align: left;
  color: var(--user-text);
  border: 1px solid var(--user-border);
  background: rgba(255,255,255,.02);
  cursor: pointer;
}
.user-history-item.active {
  border-color: rgba(77,163,255,.35);
  background: rgba(77,163,255,.11);
}

.user-history-list-wide {
  margin-top: 14px;
  max-height: 520px;
  overflow: auto;
}

.user-history-item-wide {
  justify-items: stretch;
  text-align: left;
}

.user-capture-preview,
.user-aerial-preview {
  display: grid;
  gap: 10px;
}

.user-capture-preview img,
.user-aerial-preview img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 1px solid var(--user-border);
  border-radius: 14px;
  background: #0d1420;
}

.user-capture-empty {
  padding: 28px 16px;
  text-align: center;
  background: rgba(255,255,255,.025);
  border: 1px dashed rgba(255,255,255,.10);
  border-radius: 14px;
  font-size: 12px;
  line-height: 1.5;
}

.user-capture-fallback {
  width: 100%;
  aspect-ratio: 16 / 9;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 16px;
  background: linear-gradient(180deg, rgba(255,108,138,.07), rgba(255,108,138,.02));
  border: 1px solid rgba(255,108,138,.20);
  border-radius: 14px;
  text-align: center;
}
.user-capture-fallback-title {
  font-size: 13px;
  font-weight: 700;
  color: #ffd0d8;
}

.user-kartverket-layout {
  display: grid;
  grid-template-columns: minmax(360px, 1.1fr) minmax(320px, .9fr) minmax(320px, .9fr);
  gap: 18px;
}
.user-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.user-source-card {
  display: grid;
  gap: 7px;
  border: 1px solid var(--user-border);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  padding: 10px;
  min-height: 116px;
  color: var(--user-text);
}
.user-source-card span {
  width: fit-content;
  border: 1px solid rgba(77,163,255,.30);
  border-radius: 999px;
  padding: 3px 7px;
  color: #b9dcff;
  background: rgba(77,163,255,.10);
  font-size: 11px;
}

.user-iframe-surface iframe {
  width: 100%;
  min-height: 560px;
  border: 1px solid var(--user-border);
  border-radius: 16px;
  background: #fff;
}
.user-map-error {
  display: grid;
  place-items: center;
  min-height: 320px;
  color: var(--user-danger);
  font-weight: 800;
}
.user-popup-title { font-weight: 800; margin-bottom: 5px; }
.user-popup-sub { color: #5b6b83; font-size: 12px; }

@media (max-width: 1280px) {
  .user-app {
    grid-template-columns: 220px minmax(0, 1fr) 280px;
  }
}

@media (max-width: 1100px) {
  .user-app {
    min-height: auto;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 55vh auto auto;
    grid-template-areas:
      "topbar"
      "left"
      "main"
      "bottom"
      "right";
  }
  .user-topbar { align-items: flex-start; flex-direction: column; padding: 14px; }
  .user-topbar-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .user-search { width: 100%; }
  /* On narrow screens drop the absolute-centered admin button into the flow */
  .user-topbar-center {
    position: static;
    transform: none;
    width: 100%;
    margin: 6px 0;
  }
  .user-tab-surface[data-user-panel="dashboard"],
  .user-preview-grid,
  .user-report-layout,
  .user-kartverket-layout {
    grid-template-columns: 1fr;
  }
  .user-map-camera-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .user-right-sidebar { max-height: none; }
}

@media (max-width: 700px) {
  .user-app { padding: 10px; gap: 10px; }
  .user-property-row,
  .user-details-grid,
  .user-risk-meta,
  .user-form-grid,
  .user-report-grid,
  .user-source-grid,
  .user-map-camera-grid {
    grid-template-columns: 1fr;
  }
  .user-map-floating {
    position: static;
    padding: 10px;
    flex-direction: column;
  }
}

@media print {
  .user-topbar,
  .user-left-sidebar,
  .user-right-sidebar,
  .user-map-main,
  .user-tab-surface:not([data-user-panel="reports"]) {
    display: none !important;
  }
  .user-app {
    display: block;
    background: #fff;
    color: #0f172a;
    padding: 0;
  }
  .user-bottom-panel,
  .user-work-card {
    box-shadow: none;
    border-color: #cbd5e1;
    background: #fff;
  }
}

/* Admin brand mark */
.admin-brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 18px;
  color: #fff;
  background: conic-gradient(from 130deg at 50% 50%, #5fb2ff, #8a6bff 35%, #ff6c8a 70%, #5fb2ff);
  position: relative;
  box-shadow: 0 12px 28px rgba(95,178,255,.32), inset 0 0 0 1px rgba(255,255,255,.18);
}
.admin-brand-mark::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(11,16,26,.65), rgba(11,16,26,.85));
}
.admin-brand-mark > * { position: relative; z-index: 1; }

/* Admin hero */
.admin-hero {
  position: relative;
  padding: 26px 26px 24px !important;
  overflow: hidden;
  margin-bottom: 18px;
}
.admin-hero-glow {
  position: absolute;
  inset: -40% -10% auto auto;
  width: 60%;
  height: 220%;
  background: radial-gradient(closest-side, rgba(95,178,255,.25), transparent 70%);
  filter: blur(2px);
  pointer-events: none;
}

/* Admin card grid */
.admin-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}
.admin-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px;
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012)),
    linear-gradient(180deg, rgba(14,22,34,.85), rgba(11,16,26,.92));
  border: 1px solid var(--line);
  color: var(--text);
  text-decoration: none;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  box-shadow: 0 18px 40px rgba(0,0,0,.32);
}
.admin-card:hover {
  transform: translateY(-2px);
  border-color: rgba(95,178,255,.42);
  box-shadow: 0 24px 50px rgba(0,0,0,.42), 0 0 0 1px rgba(95,178,255,.16);
}
.admin-card-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--icon-grad, linear-gradient(135deg,#5fb2ff,#8a6bff));
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 18px;
  color: #fff;
  box-shadow: 0 10px 24px rgba(95,178,255,.20);
  flex: 0 0 auto;
}
.admin-card-body { display: grid; gap: 6px; min-width: 0; }
.admin-card-body b { font-size: 15px; }
.admin-card-body small { color: var(--muted); line-height: 1.6; font-size: 12.5px; }

/* Model picker (admin settings) */
.model-picker { display: grid; gap: 8px; }
.model-picker-select { font-weight: 700; }
.model-picker input[readonly] {
  opacity: .72;
  cursor: not-allowed;
  background: rgba(255,255,255,.02);
}
.model-picker input:not([readonly]) {
  border-color: rgba(95,178,255,.45);
  box-shadow: 0 0 0 3px rgba(95,178,255,.10);
}

/* Marker / Area mode toggles */
#markerModeBtn.active,
#areaModeBtn.active {
  background: linear-gradient(135deg, rgba(77,163,255,.35), rgba(124,92,255,.30));
  border-color: rgba(77,163,255,.55);
  color: #ffffff;
  box-shadow: 0 8px 22px rgba(77,163,255,.22);
}
#areaModeBtn.active {
  background: linear-gradient(135deg, rgba(255,212,121,.32), rgba(255,93,115,.22));
  border-color: rgba(255,212,121,.55);
  box-shadow: 0 8px 22px rgba(255,212,121,.22);
  color: #ffe8b8;
}

/* Glass bottom sheet popup */
.marker-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  pointer-events: none;
  display: flex;
  justify-content: center;
  padding: 0 16px 18px;
  transform: translateY(110%);
  transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.marker-sheet.open {
  transform: translateY(0);
  pointer-events: auto;
}
.marker-sheet-card {
  position: relative;
  width: min(680px, 100%);
  background:
    radial-gradient(900px 200px at 50% -40%, rgba(95,178,255,.22), transparent 60%),
    linear-gradient(180deg, rgba(22,32,48,.55), rgba(10,16,26,.72));
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 26px;
  padding: 20px 20px 18px;
  backdrop-filter: blur(26px) saturate(150%);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  box-shadow:
    0 30px 80px rgba(0,0,0,.55),
    0 1px 0 rgba(255,255,255,.06) inset,
    0 -20px 60px rgba(95,178,255,.06) inset;
  color: #e8f0ff;
  animation: marker-sheet-pop .35s cubic-bezier(.2,.7,.2,1);
}
@keyframes marker-sheet-pop {
  from { opacity: 0; transform: translateY(20px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.marker-sheet-card::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 44px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.25);
}
.marker-sheet-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.06);
  color: #e8f0ff;
  cursor: pointer;
  font-weight: 700;
}
.marker-sheet-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  margin-bottom: 14px;
}
.marker-sheet-dot {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, #ffd479, #ff5d73);
  box-shadow: 0 0 0 4px rgba(255,93,115,.22);
}
.marker-sheet-title {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
}
.marker-sheet-sub {
  font-size: 12px;
  color: rgba(232,240,255,.65);
  margin-top: 2px;
}
.marker-sheet-body {
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  margin-bottom: 14px;
}
.marker-sheet-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.marker-sheet-row span {
  color: rgba(232,240,255,.65);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.marker-sheet-row b {
  font-size: 13px;
  font-weight: 800;
}
.marker-sheet-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 540px) {
  .marker-sheet-actions { grid-template-columns: 1fr; }
}

/* Marker sheet enrichments */
.marker-sheet-score-pill {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
}
.marker-sheet-score-pill small { font-size: 11px; opacity: .7; margin-left: 2px; }
.marker-sheet-score-pill.risk-high { background: rgba(255,108,138,.18); border-color: rgba(255,108,138,.45); color: #ffd1da; }
.marker-sheet-score-pill.risk-medium { background: rgba(255,197,74,.18); border-color: rgba(255,197,74,.45); color: #fde7b3; }
.marker-sheet-score-pill.risk-low { background: rgba(60,207,145,.18); border-color: rgba(60,207,145,.45); color: #b9f0d1; }

.marker-sheet-preview {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.15);
  margin-bottom: 14px;
  background: #0d1420;
  aspect-ratio: 16 / 9;
}
.marker-sheet-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.marker-sheet-summary {
  margin-top: 14px;
  padding: 14px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(95,178,255,.10), rgba(95,178,255,.04));
  border: 1px solid rgba(95,178,255,.18);
}
.marker-sheet-section-title {
  font-size: 11px;
  color: #93a5c2;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 800;
  margin-bottom: 8px;
}
.marker-sheet-summary-text {
  font-size: 13px;
  line-height: 1.65;
  color: #e8f0ff;
}
.marker-sheet-kv {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.marker-sheet-kv-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 12px;
}
.marker-sheet-kv-row span { color: rgba(232,240,255,.65); }
.marker-sheet-kv-row b { color: #e8f0ff; font-weight: 800; }
.marker-sheet-recs { margin-top: 6px; }
.marker-sheet-rec-list {
  margin: 0;
  padding-left: 22px;
  display: grid;
  gap: 6px;
}
.marker-sheet-rec-list li {
  font-size: 13px;
  line-height: 1.5;
  color: #e8f0ff;
}
@media (max-width: 600px) {
  .marker-sheet-kv { grid-template-columns: 1fr; }
}
.marker-sheet-actions {
  grid-template-columns: auto auto 1fr !important;
}
.marker-sheet-actions .user-btn-primary { grid-column: 3; }

/* Drag-to-select overlay rectangle */
.drag-select-layer {
  position: absolute;
  inset: 0;
  z-index: 700;
  cursor: crosshair;
  background: rgba(7,11,19,.04);
  user-select: none;
}
.drag-select-rect {
  position: absolute;
  border: 2px dashed #5fb2ff;
  background: rgba(95,178,255,.18);
  border-radius: 6px;
  pointer-events: none;
  box-shadow: 0 0 0 1px rgba(95,178,255,.30), 0 14px 30px rgba(95,178,255,.18);
}
.drag-select-hint {
  position: absolute;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  padding: 9px 14px;
  background: rgba(7,11,19,.72);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(12px);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: #e8f0ff;
  pointer-events: none;
}
.drag-select-hint kbd {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 6px;
  padding: 2px 6px;
  font-family: inherit;
  font-size: 11px;
}
.drag-select-armed { cursor: crosshair !important; }

/* Full-screen loading overlay (HomaiV 2 style) */
.loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  background: rgba(7,10,18,.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.loading-overlay.open { display: flex; }
.loading-card {
  width: min(460px, 96%);
  background:
    radial-gradient(800px 200px at 50% -40%, rgba(95,178,255,.22), transparent 70%),
    linear-gradient(180deg, rgba(22,32,48,.85), rgba(10,16,26,.92));
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 22px;
  padding: 26px 22px 20px;
  text-align: center;
  box-shadow: 0 30px 80px rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.06) inset;
  color: #e8f0ff;
  animation: marker-sheet-pop .3s cubic-bezier(.2,.7,.2,1);
}
.loading-spinner {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 3px solid rgba(255,255,255,.16);
  border-top-color: #5fb2ff;
  border-right-color: #8a6bff;
  margin: 0 auto 14px;
  animation: spin 1.05s linear infinite;
}
.loading-title { font-weight: 800; letter-spacing: .2px; font-size: 17px; margin-bottom: 6px; }
.loading-sub { color: #93a5c2; font-size: 13px; line-height: 1.7; }
.loading-bar {
  margin-top: 16px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;
}
.loading-bar-fill {
  width: 0%;
  height: 100%;
  background: linear-gradient(90deg, #5fb2ff, #8a6bff);
  transition: width 1.2s cubic-bezier(.2,.7,.2,1);
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Collapsible bottom panel */
.user-bottom-panel { transition: max-height .35s ease, opacity .25s ease; }
.user-bottom-panel.collapsed { max-height: 56px !important; overflow: hidden; opacity: .85; }
.user-bottom-collapse-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--user-border);
  background: rgba(255,255,255,.02);
}

/* Hide map sidebars when reports/upload/etc are open as primary content */
.user-app.focused-content .user-map-main { min-height: 240px; }
.user-app.focused-content .user-bottom-panel { max-height: 70vh; }

/* ===== 6-Angle Thumbnail Grid + Image Lightbox ===== */
.multi-angle-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.multi-angle-thumb {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  padding: 0;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 6px;
  overflow: hidden;
  cursor: zoom-in;
  background: rgba(255,255,255,.04);
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.multi-angle-thumb:hover {
  transform: translateY(-1px);
  border-color: rgba(95,178,255,.55);
  box-shadow: 0 6px 18px rgba(95,178,255,.18);
}
.multi-angle-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.multi-angle-thumb-idx {
  position: absolute;
  bottom: 4px; left: 4px;
  font-size: 10px; font-weight: 700;
  background: rgba(0,0,0,.7);
  color: #fff;
  padding: 1px 5px;
  border-radius: 3px;
}
.multi-angle-thumb-zoom {
  position: absolute;
  top: 4px; right: 4px;
  font-size: 12px;
  width: 18px; height: 18px;
  display: grid; place-items: center;
  background: rgba(0,0,0,.55);
  color: #fff;
  border-radius: 4px;
  opacity: 0;
  transition: opacity .14s ease;
}
.multi-angle-thumb:hover .multi-angle-thumb-zoom { opacity: 1; }

.img-lightbox {
  position: fixed;
  inset: 0;
  z-index: 4000;
  background: rgba(5,8,14,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: none;
  align-items: center;
  justify-content: center;
}
.img-lightbox.open { display: flex; }
.img-lightbox-stage {
  position: relative;
  width: min(96vw, 1400px);
  height: min(92vh, 1000px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.img-lightbox-stage img {
  max-width: 100%;
  max-height: calc(100% - 60px);
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 30px 80px rgba(0,0,0,.6);
}
.img-lightbox-caption {
  position: absolute;
  bottom: 6px; left: 50%;
  transform: translateX(-50%);
  max-width: 90%;
  text-align: center;
  font-size: 13px;
  color: #e8f0ff;
  background: rgba(0,0,0,.55);
  padding: 6px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.1);
}
.img-lightbox-counter {
  position: absolute;
  top: 8px; left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  color: rgba(255,255,255,.7);
  background: rgba(0,0,0,.5);
  padding: 4px 10px;
  border-radius: 12px;
}
.img-lightbox-close,
.img-lightbox-nav {
  position: absolute;
  z-index: 1;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.5);
  color: #fff;
  cursor: pointer;
  font-size: 22px;
  font-weight: 700;
  font-family: inherit;
  border-radius: 999px;
  display: grid; place-items: center;
  transition: background .15s, transform .15s;
}
.img-lightbox-close {
  top: 18px; right: 22px;
  width: 42px; height: 42px;
  font-size: 26px;
  line-height: 1;
}
.img-lightbox-nav {
  top: 50%; transform: translateY(-50%);
  width: 50px; height: 50px;
  font-size: 32px;
  line-height: 1;
}
.img-lightbox-prev { left: 18px; }
.img-lightbox-next { right: 18px; }
.img-lightbox-close:hover,
.img-lightbox-nav:hover { background: rgba(95,178,255,.4); }

/* ===== TAB-DRIVEN LAYOUT: hide map for non-map tabs ===== */
.user-app[data-active-tab="history"],
.user-app[data-active-tab="batch"],
.user-app[data-active-tab="lookup1881"],
.user-app[data-active-tab="upload"],
.user-app[data-active-tab="address"],
.user-app[data-active-tab="kartverket"] {
  grid-template-columns: 270px 1fr;
  grid-template-areas:
    "topbar topbar"
    "left   bottom"
    "left   bottom";
}
.user-app[data-active-tab="history"] .user-map-main,
.user-app[data-active-tab="history"] .user-right-sidebar,
.user-app[data-active-tab="batch"] .user-map-main,
.user-app[data-active-tab="batch"] .user-right-sidebar,
.user-app[data-active-tab="lookup1881"] .user-map-main,
.user-app[data-active-tab="lookup1881"] .user-right-sidebar,
.user-app[data-active-tab="upload"] .user-map-main,
.user-app[data-active-tab="upload"] .user-right-sidebar,
.user-app[data-active-tab="address"] .user-map-main,
.user-app[data-active-tab="address"] .user-right-sidebar,
.user-app[data-active-tab="kartverket"] .user-map-main,
.user-app[data-active-tab="kartverket"] .user-right-sidebar {
  display: none;
}
.user-app[data-active-tab="history"] .user-bottom-panel,
.user-app[data-active-tab="batch"] .user-bottom-panel,
.user-app[data-active-tab="lookup1881"] .user-bottom-panel,
.user-app[data-active-tab="upload"] .user-bottom-panel,
.user-app[data-active-tab="address"] .user-bottom-panel,
.user-app[data-active-tab="kartverket"] .user-bottom-panel {
  max-height: none !important;
  overflow: auto;
}

/* Kartverket map tab: give the bottom panel a tall fixed height */
.user-app[data-active-tab="lookup1881"] .user-bottom-panel {
  height: 65vh;
  min-height: 400px;
  overflow: hidden;
  padding: 0;
}
.user-app[data-active-tab="lookup1881"] .user-kartverket-map-surface.active {
  height: 100%;
}

/* ===== COLLAPSIBLE SIDEBARS — always-visible handles ===== */
.sidebar-toggle-btn {
  position: absolute;
  top: 88px;
  width: 26px;
  height: 56px;
  border-radius: 8px;
  border: 1px solid rgba(95,178,255,.35);
  background: linear-gradient(135deg, rgba(20,28,44,.92), rgba(11,18,30,.92));
  color: #e8f0ff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  font-family: inherit;
  z-index: 50;
  transition: background .18s ease, transform .18s ease, border-color .18s ease, box-shadow .18s ease;
  padding: 0;
  box-shadow: 0 4px 14px rgba(0,0,0,.5);
  opacity: 1 !important;
}
.sidebar-toggle-btn:hover {
  border-color: rgba(95,178,255,.7);
  background: linear-gradient(135deg, rgba(95,178,255,.25), rgba(138,107,255,.2));
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(95,178,255,.25);
}

.user-left-sidebar {
  position: relative;
  transition: width .28s ease, opacity .22s ease, padding .28s ease;
}
.user-left-sidebar .sidebar-toggle-btn {
  left: calc(100% - 13px);
}

.user-left-sidebar.sidebar-collapsed {
  width: 0 !important;
  overflow: visible;
  padding: 0 !important;
  border: 0 !important;
}
.user-left-sidebar.sidebar-collapsed > *:not(.sidebar-toggle-btn) { display: none; }
.user-left-sidebar.sidebar-collapsed .sidebar-toggle-btn {
  left: 6px;
}
.user-app.left-collapsed {
  grid-template-columns: 0 minmax(0, 1fr) 330px;
}
.user-app.left-collapsed.has-right-collapsed,
.user-app[data-active-tab="history"].left-collapsed,
.user-app[data-active-tab="batch"].left-collapsed,
.user-app[data-active-tab="upload"].left-collapsed,
.user-app[data-active-tab="address"].left-collapsed,
.user-app[data-active-tab="kartverket"].left-collapsed {
  grid-template-columns: 0 1fr;
}

.user-right-sidebar {
  position: relative;
  transition: width .28s ease, opacity .22s ease, padding .28s ease;
}
.user-right-sidebar .sidebar-toggle-btn {
  right: calc(100% - 13px) !important;
  left: auto !important;
}
.user-right-sidebar.sidebar-collapsed {
  width: 0 !important;
  overflow: visible;
  padding: 0 !important;
  border: 0 !important;
}
.user-right-sidebar.sidebar-collapsed > *:not(.sidebar-toggle-btn) { display: none; }
.user-right-sidebar.sidebar-collapsed .sidebar-toggle-btn {
  right: 6px !important;
  left: auto !important;
}
.user-app.right-collapsed {
  grid-template-columns: 270px minmax(0, 1fr) 0;
}
.user-app.left-collapsed.right-collapsed {
  grid-template-columns: 0 minmax(0, 1fr) 0;
}

/* ===== ENHANCED LANDING PAGE ===== */
/* ═══════════════════════════════════════════════════
   CUATRO × HOMAI  —  Landing / Login page (redesign)
   telescope.eco–inspired: dark glass, animated blobs
   ═══════════════════════════════════════════════════ */

/* ── Keyframes ── */
@keyframes lp-blob-drift {
  0%,100% { transform: translate(0,0) scale(1); }
  33%      { transform: translate(40px,-30px) scale(1.06); }
  66%      { transform: translate(-25px,20px) scale(.96); }
}
@keyframes lp-ring-spin {
  from { transform: translate(-50%,-50%) rotate(0deg); }
  to   { transform: translate(-50%,-50%) rotate(360deg); }
}
@keyframes lp-ring-spin-rev {
  from { transform: translate(-50%,-50%) rotate(0deg); }
  to   { transform: translate(-50%,-50%) rotate(-360deg); }
}
@keyframes lp-float {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
@keyframes lp-fadeup {
  from { opacity:0; transform:translateY(30px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes lp-fadein {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes lp-pulse {
  0%,100% { box-shadow:0 0 0 0 rgba(95,178,255,.4); }
  50%      { box-shadow:0 0 0 10px rgba(95,178,255,0); }
}
@keyframes lp-dot-blink {
  0%,100% { opacity:1; }
  50%      { opacity:.35; }
}
@keyframes lp-shimmer {
  from { background-position: 200% center; }
  to   { background-position: -200% center; }
}

/* ── Root wrapper ── */
.lp-root {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: #050810;
  color: #e2eeff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  position: relative;
  overflow-x: hidden;
}

/* ── Animated background ── */
.lp-bg {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}
.lp-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  opacity: .55;
}
.lp-blob-a {
  width: 720px; height: 720px;
  background: radial-gradient(circle, rgba(95,178,255,.28) 0%, transparent 70%);
  top: -180px; left: -180px;
  animation: lp-blob-drift 18s ease-in-out infinite;
}
.lp-blob-b {
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(138,107,255,.22) 0%, transparent 70%);
  top: 30%; right: -120px;
  animation: lp-blob-drift 24s ease-in-out infinite reverse;
}
.lp-blob-c {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(60,207,145,.14) 0%, transparent 70%);
  bottom: -100px; left: 30%;
  animation: lp-blob-drift 30s ease-in-out infinite 8s;
}
.lp-grid-overlay {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, black 40%, transparent 100%);
}

/* ── Top nav ── */
.lp-nav {
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 32px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: rgba(5,8,16,.65);
  backdrop-filter: blur(16px);
  animation: lp-fadein .5s ease both;
}
.lp-nav-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}
.lp-nav-mark {
  width: 36px; height: 36px;
  border-radius: 10px;
  background: conic-gradient(from 130deg at 50% 50%, #5fb2ff, #8a6bff 35%, #ff6c8a 70%, #5fb2ff);
  display: grid;
  place-items: center;
  box-shadow: 0 0 18px rgba(95,178,255,.35);
  position: relative;
  overflow: hidden;
}
.lp-nav-mark::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 6px;
  background: rgba(5,8,16,.75);
}
.lp-nav-mark span {
  position: relative;
  z-index: 1;
  font-weight: 900;
  font-size: 17px;
  color: #fff;
  letter-spacing: -.02em;
}
.lp-nav-name {
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .01em;
  color: #d6e8ff;
}
.lp-nav-x { color: #5fb2ff; margin: 0 2px; }
.lp-nav-pill {
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(95,178,255,.22);
  border-radius: 999px;
  background: rgba(95,178,255,.07);
  padding: 5px 14px;
  font-size: 12px;
  font-weight: 700;
  color: #7cc8ff;
}
.lp-status-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #3ccf91;
  animation: lp-dot-blink 2.2s ease infinite;
  flex-shrink: 0;
}

/* ── Main scroll area ── */
.lp-main {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 60px 24px 40px;
  gap: 0;
}

/* ── Hero section ── */
.lp-hero {
  text-align: center;
  max-width: 680px;
  margin-bottom: 52px;
  animation: lp-fadeup .7s ease both;
}

/* Big "4" logo with rings */
.lp-logo-wrap {
  position: relative;
  width: 120px; height: 120px;
  margin: 0 auto 32px;
  animation: lp-float 5s ease-in-out infinite;
}
.lp-logo-ring {
  position: absolute;
  top: 50%; left: 50%;
  border-radius: 50%;
  border: 1.5px solid transparent;
}
.lp-logo-ring.r1 {
  width: 120px; height: 120px;
  border-color: rgba(95,178,255,.30);
  margin: -60px 0 0 -60px;
  animation: lp-ring-spin 12s linear infinite;
  background: transparent;
}
.lp-logo-ring.r1::before {
  content: "";
  position: absolute;
  top: -2px; left: 30%;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #5fb2ff;
  box-shadow: 0 0 8px #5fb2ff;
}
.lp-logo-ring.r2 {
  width: 94px; height: 94px;
  border-color: rgba(138,107,255,.25);
  margin: -47px 0 0 -47px;
  animation: lp-ring-spin-rev 18s linear infinite;
}
.lp-logo-ring.r2::before {
  content: "";
  position: absolute;
  bottom: -2px; right: 20%;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #8a6bff;
  box-shadow: 0 0 6px #8a6bff;
}
.lp-logo-ring.r3 {
  width: 70px; height: 70px;
  border-color: rgba(60,207,145,.20);
  margin: -35px 0 0 -35px;
  animation: lp-ring-spin 8s linear infinite;
}
.lp-logo-core {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 56px; height: 56px;
  border-radius: 16px;
  background: conic-gradient(from 130deg at 50% 50%, #5fb2ff, #8a6bff 35%, #ff6c8a 70%, #5fb2ff);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 40px rgba(95,178,255,.40), 0 0 0 6px rgba(95,178,255,.08);
}
.lp-logo-four {
  font-size: 22px;
  font-weight: 900;
  color: #fff;
  line-height: 1;
  letter-spacing: -.03em;
}
.lp-logo-sub {
  font-size: 7px;
  font-weight: 800;
  color: rgba(255,255,255,.75);
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-top: 1px;
}

/* Badge */
.lp-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(95,178,255,.30);
  border-radius: 999px;
  background: rgba(95,178,255,.07);
  padding: 6px 16px;
  font-size: 12px;
  font-weight: 700;
  color: #8ed4ff;
  margin-bottom: 22px;
  animation: lp-pulse 3.5s ease infinite;
}
.lp-badge-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #3ccf91;
  flex-shrink: 0;
  animation: lp-dot-blink 2s ease infinite;
}

/* Title */
.lp-title {
  font-size: clamp(34px, 5.5vw, 64px);
  font-weight: 800;
  line-height: 1.1;
  margin: 0 0 18px;
  letter-spacing: -.03em;
  color: #fff;
}
.lp-title-accent {
  background: linear-gradient(90deg, #5fb2ff 0%, #8a6bff 40%, #ff6c8a 80%, #5fb2ff 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: lp-shimmer 5s linear infinite;
}

/* Sub */
.lp-sub {
  color: #7a92b3;
  font-size: 16px;
  line-height: 1.75;
  margin: 0 0 30px;
}

/* Feature pills */
.lp-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}
.lp-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  padding: 6px 14px;
  font-size: 13px;
  color: #b8d0ee;
  font-weight: 600;
  transition: background .18s, border-color .18s, transform .18s;
  cursor: default;
}
.lp-pill:hover {
  background: rgba(95,178,255,.08);
  border-color: rgba(95,178,255,.25);
  color: #d4eaff;
  transform: translateY(-2px);
}

/* ── Sign-in form section ── */
.lp-form-section {
  width: 100%;
  max-width: 420px;
  margin-bottom: 52px;
  animation: lp-fadeup .7s .12s ease both;
}

.lp-card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.055) 0%, rgba(255,255,255,.018) 100%);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px;
  padding: 34px 30px;
  box-shadow:
    0 50px 120px rgba(0,0,0,.60),
    0 0 0 1px rgba(95,178,255,.07),
    inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(28px) saturate(150%);
  position: relative;
  overflow: hidden;
}

.lp-card-glow {
  position: absolute;
  top: -50%; right: -30%;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(95,178,255,.12) 0%, transparent 65%);
  pointer-events: none;
}

.lp-card-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
}
.lp-card-mark {
  width: 48px; height: 48px;
  border-radius: 14px;
  background: conic-gradient(from 130deg at 50% 50%, #5fb2ff, #8a6bff 35%, #ff6c8a 70%, #5fb2ff);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 28px rgba(95,178,255,.38);
  position: relative;
  flex-shrink: 0;
  animation: lp-float 4.5s ease-in-out infinite;
}
.lp-card-mark::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 9px;
  background: rgba(5,8,16,.72);
}
.lp-card-mark span {
  position: relative;
  z-index: 1;
  font-weight: 900;
  font-size: 22px;
  color: #fff;
  letter-spacing: -.03em;
}
.lp-card-brand-text strong {
  display: block;
  font-size: 16px;
  font-weight: 800;
  color: #e2eeff;
  letter-spacing: .01em;
}
.lp-card-brand-text span {
  font-size: 12px;
  color: #5c7a9e;
}

/* Flash errors */
.lp-flash {
  margin-bottom: 18px;
}
.lp-flash-msg {
  margin: 0;
  border-radius: 10px;
  padding: 11px 14px;
  background: rgba(249,115,91,.10);
  border: 1px solid rgba(249,115,91,.28);
  color: #ff8a73;
  font-size: 13px;
}

/* Form fields */
.lp-form { display: grid; gap: 16px; }
.lp-field { display: grid; gap: 8px; }
.lp-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #5c7a9e;
}
.lp-input {
  display: block;
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  padding: 10px 16px;
  background: rgba(255,255,255,.04);
  color: #e2eeff;
  font-size: 14px;
  font-family: inherit;
  transition: border-color .18s, box-shadow .18s;
  box-sizing: border-box;
}
.lp-input::placeholder { color: #3d5270; }
.lp-input:focus {
  border-color: rgba(95,178,255,.50);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(95,178,255,.12);
  background: rgba(95,178,255,.04);
}

/* Submit button */
.lp-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(135deg, #5fb2ff 0%, #6e8bff 46%, #8a6bff 100%);
  color: #fff;
  font-weight: 800;
  font-size: 15px;
  font-family: inherit;
  cursor: pointer;
  margin-top: 4px;
  box-shadow: 0 14px 36px rgba(95,178,255,.32), inset 0 1px 0 rgba(255,255,255,.2);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  letter-spacing: .01em;
}
.lp-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 20px 46px rgba(95,178,255,.42);
}
.lp-btn:active { transform: translateY(0); filter: brightness(.96); }
.lp-btn svg { flex-shrink: 0; transition: transform .18s; }
.lp-btn:hover svg { transform: translateX(3px); }

.lp-card-note {
  margin: 18px 0 0;
  text-align: center;
  font-size: 11px;
  color: #2d3f55;
}

/* ── Stats strip ── */
.lp-stats {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  background: rgba(255,255,255,.025);
  backdrop-filter: blur(12px);
  padding: 16px 28px;
  max-width: 680px;
  width: 100%;
  animation: lp-fadeup .7s .24s ease both;
}
.lp-stat { text-align: center; }
.lp-stat strong {
  display: block;
  font-size: 18px;
  font-weight: 800;
  color: #d6eaff;
  line-height: 1.1;
}
.lp-stat span {
  display: block;
  font-size: 11px;
  color: #3a5570;
  margin-top: 2px;
}
.lp-stat-sep {
  width: 1px; height: 32px;
  background: rgba(255,255,255,.08);
  flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .lp-nav { padding: 14px 18px; }
  .lp-nav-pill { display: none; }
  .lp-main { padding: 40px 16px 32px; }
  .lp-hero { margin-bottom: 36px; }
  .lp-title { font-size: 30px; }
  .lp-sub { font-size: 14px; }
  .lp-card { padding: 26px 20px; border-radius: 18px; }
  .lp-stats { gap: 16px; padding: 14px 20px; }
  .lp-stat-sep { height: 20px; }
}

/* Reports tab: better content fit */
[data-user-panel="reports"] .user-report-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 16px;
}
[data-user-panel="reports"] .user-report-layout > * { min-width: 0; }
[data-user-panel="reports"] .user-work-card { max-height: none; overflow: visible; }
[data-user-panel="reports"] .user-callout {
  background: rgba(95,178,255,.08);
  border: 1px solid rgba(95,178,255,.18);
  border-radius: 14px;
  padding: 14px;
  line-height: 1.7;
  color: #e8f0ff;
}
[data-user-panel="reports"] .user-source-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
[data-user-panel="reports"] .user-source-card {
  background: rgba(255,255,255,.04);
  border: 1px solid var(--user-border);
  border-radius: 12px;
  padding: 12px;
  display: grid;
  gap: 6px;
}
[data-user-panel="reports"] .user-source-card span {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--user-soft);
}
[data-user-panel="reports"] .user-source-card b { font-size: 13px; }
[data-user-panel="reports"] .user-source-card small { color: var(--user-muted); line-height: 1.5; }
[data-user-panel="reports"] .user-code {
  max-height: 280px;
  overflow: auto;
  font-size: 11px;
  line-height: 1.6;
}
[data-user-panel="reports"] .user-report-side {
  display: grid;
  gap: 16px;
  align-content: start;
}
[data-user-panel="reports"] .user-report-primary {
  display: grid;
  gap: 16px;
  padding: 0;
  overflow: hidden;
}
[data-user-panel="reports"] .user-report-primary > * {
  margin-left: 18px;
  margin-right: 18px;
}
[data-user-panel="reports"] .user-report-primary > .user-card-head {
  margin: 0;
  padding: 18px 18px 0;
}
.user-report-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(132px, 170px);
  gap: 18px;
  align-items: stretch;
  padding: 18px;
  border: 1px solid rgba(95,178,255,.18);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(95,178,255,.13), rgba(138,107,255,.10) 46%, rgba(60,207,145,.08)),
    rgba(255,255,255,.025);
}
.user-report-eyebrow {
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #9fd2ff;
  font-weight: 800;
  margin-bottom: 8px;
}
.user-report-hero h3 {
  margin: 0;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.user-report-address {
  color: var(--user-muted);
  margin-top: 8px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.user-report-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.user-report-pills span {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(7,11,19,.34);
  color: #cfe2ff;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 700;
}
.user-report-score {
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 132px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(7,11,19,.42);
}
.user-report-score strong {
  font-size: 46px;
  line-height: 1;
}
.user-report-score span {
  margin-top: 8px;
  color: var(--user-muted);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 11px;
}
.user-report-score.risk-high { box-shadow: inset 0 0 0 1px rgba(255,108,138,.32), 0 18px 46px rgba(255,108,138,.12); }
.user-report-score.risk-medium { box-shadow: inset 0 0 0 1px rgba(255,197,74,.32), 0 18px 46px rgba(255,197,74,.10); }
.user-report-score.risk-low { box-shadow: inset 0 0 0 1px rgba(60,207,145,.32), 0 18px 46px rgba(60,207,145,.10); }
.user-report-image {
  display: grid;
  gap: 8px;
}
.user-report-image img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid var(--user-border);
  background: #0d1420;
}
.user-report-image div {
  color: var(--user-muted);
  font-size: 12px;
}
.user-report-grid-rich {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.user-report-grid-rich > div {
  border-style: solid;
  background: rgba(255,255,255,.035);
  min-height: 74px;
}
.user-report-callout {
  font-size: 15px;
}
.user-report-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .8fr);
  gap: 16px;
}
.user-report-note {
  min-height: 100%;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  padding: 12px;
  color: #d9e6f8;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.user-report-actions li {
  margin-bottom: 8px;
  padding-left: 4px;
}
.user-report-kv {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.user-report-kv > div {
  border: 1px solid var(--user-border);
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  padding: 10px;
  min-height: 70px;
}
.user-report-kv span,
.user-formula-list span {
  display: block;
  color: var(--user-muted);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 6px;
}
.user-report-kv b,
.user-formula-list b {
  overflow-wrap: anywhere;
}
.user-report-kv small {
  display: block;
  color: var(--user-muted);
  font-size: 11px;
  line-height: 1.35;
  margin-top: 6px;
  overflow-wrap: anywhere;
}
.user-report-timeline {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.user-report-timeline > div {
  flex: 0 0 180px;
  border: 1px solid var(--user-border);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
  padding: 10px;
}
.user-report-timeline > div.changed {
  border-color: rgba(255,197,74,.35);
  background: rgba(255,197,74,.08);
}
.user-report-timeline b,
.user-report-timeline span {
  display: block;
}
.user-report-timeline span {
  color: var(--user-muted);
  line-height: 1.5;
  margin-top: 4px;
  font-size: 12px;
}
.user-formula-list {
  display: grid;
  gap: 8px;
}
.user-formula-list > div {
  border: 1px solid var(--user-border);
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  padding: 10px;
}
.user-formula-list small {
  display: block;
  color: var(--user-muted);
  margin-top: 4px;
  line-height: 1.4;
}
.report-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 28px;
}
.report-modal.open { display: flex; }
.report-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 14, .76);
  backdrop-filter: blur(10px);
}
.report-modal-card {
  position: relative;
  z-index: 1;
  width: min(1120px, 100%);
  max-height: min(88vh, 920px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  background: #0b111d;
  box-shadow: 0 28px 90px rgba(0,0,0,.55);
}
.report-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.035);
}
.report-modal-head h2 {
  margin: 0;
  font-size: 22px;
}
.report-modal-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.report-modal-scroll {
  overflow: auto;
  padding: 20px;
}
.report-modal-report {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.report-modal-report > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.report-edit-card { width: min(920px, 100%); }
.report-edit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.report-edit-grid label {
  display: grid;
  gap: 6px;
  color: var(--user-muted);
  font-size: 12px;
  font-weight: 800;
}
.report-edit-grid label.wide { grid-column: 1 / -1; }
.report-edit-grid input,
.report-edit-grid select,
.report-edit-grid textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  background: rgba(255,255,255,.055);
  color: #e8f0ff;
  padding: 10px 11px;
  font: inherit;
}
.report-edit-grid textarea {
  resize: vertical;
  min-height: 90px;
}
body.modal-open { overflow: hidden; }

/* =========================================
   ADMIN LIGHT THEME — complete overrides
   ========================================= */

/* Fix body background in light mode */
:root[data-theme="light"] body {
  background: #f6f7f9;
}

/* Fix hardcoded dark gradient cards */
:root[data-theme="light"] .auth-card,
:root[data-theme="light"] .panel,
:root[data-theme="light"] .card,
:root[data-theme="light"] .stats article,
:root[data-theme="light"] .metric-card {
  background: #ffffff;
  border: 1px solid #dce4eb;
  box-shadow: 0 14px 44px rgba(29,45,68,.06);
}

/* Light-theme sidebar */
:root[data-theme="light"] .sidebar {
  background: #ffffff;
  border-left: 1px solid #dce4eb;
  border-right: 0;
  color: #1d2d44;
  box-shadow: -2px 0 18px rgba(29,45,68,.05);
}
:root[data-theme="light"] .brand b { color: #1d2d44; }
:root[data-theme="light"] .brand small { color: #64748b; }
:root[data-theme="light"] .sidebar nav a,
:root[data-theme="light"] .sidebar-action { color: #475569; }
:root[data-theme="light"] .sidebar nav a:hover { background: #f1f5f9; color: #1d2d44; }
:root[data-theme="light"] .sidebar nav a.active {
  background: #1d2d44;
  color: #fff;
  border-color: #1d2d44;
  box-shadow: 0 4px 14px rgba(29,45,68,.22);
}
:root[data-theme="light"] .logout { color: #dc2626; }

/* Light-theme topbar */
:root[data-theme="light"] .main .topbar h1 {
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  color: #1d2d44;
}

/* Light-theme primary button */
:root[data-theme="light"] .button.primary,
:root[data-theme="light"] button.primary,
:root[data-theme="light"] .btn.primary {
  background: #1d2d44;
  border-color: #1d2d44;
  color: #fff;
  box-shadow: 0 6px 18px rgba(29,45,68,.22);
}
:root[data-theme="light"] .button.primary:hover,
:root[data-theme="light"] button.primary:hover {
  background: #142239;
  filter: none;
  box-shadow: 0 8px 22px rgba(29,45,68,.30);
}
:root[data-theme="light"] button:not(.primary):not(.danger) {
  background: #fff;
  border-color: #dce4eb;
  color: #1d2d44;
}
:root[data-theme="light"] button:not(.primary):not(.danger):hover {
  border-color: #b8c0ca;
  background: #f8fafc;
  transform: translateY(-1px);
}

/* Light admin cards */
:root[data-theme="light"] .admin-card {
  background: #ffffff;
  border: 1px solid #dce4eb;
  box-shadow: 0 6px 20px rgba(29,45,68,.06);
}
:root[data-theme="light"] .admin-card:hover {
  border-color: #1d2d44;
  box-shadow: 0 10px 28px rgba(29,45,68,.12);
}

/* Light admin hero */
:root[data-theme="light"] .admin-hero {
  background: #fff;
  border: 1px solid #dce4eb;
}
:root[data-theme="light"] .admin-hero-glow {
  background: radial-gradient(closest-side, rgba(29,45,68,.08), transparent 70%);
}

/* Code / info box */
:root[data-theme="light"] .code-box {
  background: #f8fafc;
  border: 1px solid #dce4eb;
  border-radius: 10px;
  padding: 14px 16px;
}
:root[data-theme="light"] .code-box h3 { color: #1d2d44; margin: 0 0 8px; font-size: 14px; }

/* Model picker readonly */
:root[data-theme="light"] .model-picker input[readonly] {
  background: #f8fafc;
  opacity: 1;
  color: #64748b;
}
:root[data-theme="light"] .model-picker input:not([readonly]) {
  border-color: #1d2d44;
  box-shadow: 0 0 0 3px rgba(29,45,68,.08);
}

/* Flash messages */
:root[data-theme="light"] .flash .item {
  background: #f8fafc;
  border-color: #dce4eb;
}
:root[data-theme="light"] .flash .success { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
:root[data-theme="light"] .flash .error { background: #fff4ef; border-color: #fed7c7; color: #b42318; }

/* Pills / badges in light mode */
:root[data-theme="light"] .badge,
:root[data-theme="light"] .pill {
  background: #f1f5f9;
  color: #475569;
  border-color: #dce4eb;
}
:root[data-theme="light"] .badge.active { background: #f0fdf4; color: #166534; border-color: #bbf7d0; }
:root[data-theme="light"] .badge.blocked { background: #fff4ef; color: #b42318; border-color: #fed7c7; }

/* Auth page in light mode */
:root[data-theme="light"] .auth-shell { width: min(980px, 100%); }
:root[data-theme="light"] .auth-shell-inner {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(340px, 440px);
  gap: 22px;
  align-items: stretch;
}
:root[data-theme="light"] .auth-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  padding: 32px 24px;
}
:root[data-theme="light"] .auth-copy h2 {
  margin: 0;
  font-size: clamp(24px, 3vw, 36px);
  color: #1d2d44;
  line-height: 1.2;
}
:root[data-theme="light"] .auth-copy p {
  margin: 0;
  color: #64748b;
  line-height: 1.8;
}
:root[data-theme="light"] .auth-features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
:root[data-theme="light"] .auth-features li {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #475569;
  font-size: 13px;
}
:root[data-theme="light"] .auth-features li::before {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #1d2d44;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  flex-shrink: 0;
}
:root[data-theme="light"] .auth-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #dce4eb;
  border-radius: 999px;
  background: #fff;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 700;
  color: #475569;
  width: fit-content;
}

/* Nav groups (collapsible sidebar sections) */
.nav-group { border: 0; margin: 0; padding: 0; }
.nav-group summary {
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--sidebar-text);
  opacity: .55;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.nav-group summary::-webkit-details-marker { display: none; }
:root[data-theme="light"] .nav-group summary { color: #94a3b8; opacity: 1; }

/* Topbar subtitle in light mode */
:root[data-theme="light"] .topbar p { color: #64748b; }

/* Sidebar logout btn in light mode */
:root[data-theme="light"] .logout button { color: #dc2626; }
:root[data-theme="light"] .logout:hover, :root[data-theme="light"] .logout button:hover {
  background: #fff1f2;
  color: #b91c1c;
}

/* Admin table th override in light mode */
:root[data-theme="light"] th {
  background: #f8fafc;
  color: #64748b;
}
:root[data-theme="light"] td { border-color: #e2e8f0; }
:root[data-theme="light"] tr:hover td { background: #fafbfc; }

/* Admin utility form-input (alias for input/select default styling) */
.form-input {
  display: block;
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid #dce4eb;
  border-radius: 7px;
  background: #fff;
  color: #1d2d44;
  font-size: 13px;
}
.form-input:focus { outline: 2px solid rgba(29,45,68,.12); border-color: #1d2d44; }

/* Admin action button */
.adm-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  background: #1d2d44;
  color: #fff;
  border: 1px solid #1d2d44;
  border-radius: 7px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, border-color .15s;
  text-decoration: none;
}
.adm-btn:hover { background: #142239; border-color: #142239; }
.adm-btn-outline {
  background: #fff;
  color: #1d2d44;
  border-color: #dce4eb;
}
.adm-btn-outline:hover { background: #f1f5f9; border-color: #b8c0ca; }

/* Section headings in settings */
.settings-section {
  display: grid;
  gap: 14px;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  margin-bottom: 14px;
}
.settings-section h3 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 700;
}
:root[data-theme="light"] .settings-section {
  background: #ffffff;
  border-color: #dce4eb;
}
:root[data-theme="light"] .settings-section h3 { color: #1d2d44; }

/* Pagination bar */
.pager {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 0 0;
  flex-wrap: wrap;
}
.pager a, .pager span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  border-radius: 6px;
  padding: 0 8px;
  font-size: 13px;
  font-weight: 700;
  border: 1px solid var(--line);
  color: var(--text);
  background: var(--surface);
  text-decoration: none;
}
.pager a:hover { border-color: var(--primary); color: var(--primary); }
.pager span.current {
  background: #1d2d44;
  color: #fff;
  border-color: #1d2d44;
}
:root[data-theme="light"] .pager a { background: #fff; border-color: #dce4eb; color: #1d2d44; }
:root[data-theme="light"] .pager a:hover { border-color: #1d2d44; }

/* Import upload zone */
.upload-zone {
  border: 2px dashed var(--line);
  border-radius: 10px;
  padding: 28px 20px;
  text-align: center;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.upload-zone:hover { border-color: var(--primary); background: rgba(15,118,110,.04); }
:root[data-theme="light"] .upload-zone { border-color: #dce4eb; }
:root[data-theme="light"] .upload-zone:hover { border-color: #1d2d44; background: #f8fafc; }

/* ---- topbar filter bar ---- */
.filter-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.filter-bar input, .filter-bar select {
  min-height: 36px;
  max-width: 220px;
  font-size: 13px;
}

@media (max-width: 900px) {
  [data-user-panel="reports"] .user-report-layout,
  [data-user-panel="reports"] .user-source-grid { grid-template-columns: 1fr; }
  [data-user-panel="reports"] .user-report-primary > * {
    margin-left: 14px;
    margin-right: 14px;
  }
  .user-report-hero,
  .user-report-split,
  .user-report-grid-rich,
  .user-report-kv {
    grid-template-columns: 1fr;
  }
  .user-report-score {
    min-height: 112px;
  }
  .report-modal { padding: 10px; }
  .report-modal-card {
    max-height: 94vh;
    border-radius: 14px;
  }
  .report-modal-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .report-edit-grid { grid-template-columns: 1fr; }
}

/* ===== ANALYSIS PINS & MULTI-ANGLE ===== */
.analysis-pin-popup {
  font-family: Inter, system-ui, sans-serif;
  min-width: 200px;
}
/* Leaflet popup override for dark map */
.leaflet-popup-content-wrapper {
  background: #141c2b;
  color: #e8f0ff;
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  border-radius: 10px;
}
.leaflet-popup-tip {
  background: #141c2b;
}
.leaflet-popup-close-button {
  color: #8ca0bd !important;
}

/* Multi-angle strip */
#multiAngleBox img, #historicalPreviewBox img {
  transition: transform .15s ease, box-shadow .15s ease;
}
#multiAngleBox img:hover, #historicalPreviewBox img:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 16px rgba(0,0,0,.5);
  z-index: 1;
  position: relative;
}

/* ===== KARTVERKET LOCATION INFO CARD ===== */
.loc-card { display: flex; flex-direction: column; gap: 6px; }
.loc-address { font-weight: 700; font-size: 13px; color: #e8f0ff; line-height: 1.3; }
.loc-sub { font-size: 11px; color: #8ca0bd; }
.loc-stats { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
.loc-stat {
  background: rgba(77,163,255,.15);
  border: 1px solid rgba(77,163,255,.25);
  border-radius: 10px;
  padding: 2px 8px;
  font-size: 11px;
  color: #5fb2ff;
}
.loc-section { border-top: 1px solid rgba(255,255,255,.07); padding-top: 6px; margin-top: 2px; display: flex; flex-direction: column; gap: 3px; }
.loc-row { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; }
.loc-row span { color: #8ca0bd; }
.loc-row b { color: #e8f0ff; font-weight: 600; text-align: right; }
.loc-places { flex-direction: row; flex-wrap: wrap; gap: 4px; }
.loc-place-tag {
  background: rgba(15,118,110,.15);
  border: 1px solid rgba(15,118,110,.3);
  border-radius: 8px;
  padding: 2px 7px;
  font-size: 10px;
  color: #5eead4;
}
.loc-place-tag em { font-style: normal; opacity: .7; }

/* ===== MAP ACTION PANEL (floating popup on house click) ===== */
.map-action-panel {
  position: absolute;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 900;
  background: rgba(15,23,42,.96);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: 14px 16px 12px;
  min-width: 280px;
  max-width: 360px;
  width: calc(100% - 48px);
  box-shadow: 0 8px 32px rgba(0,0,0,.55);
  animation: mapPanelIn .18s ease;
}
@keyframes mapPanelIn {
  from { opacity:0; transform: translateX(-50%) translateY(10px); }
  to   { opacity:1; transform: translateX(-50%) translateY(0); }
}
.map-action-close {
  position: absolute;
  top: 8px; right: 10px;
  background: none;
  border: none;
  color: #94a3b8;
  font-size: 18px;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
  line-height: 1;
  transition: color .15s, background .15s;
}
.map-action-close:hover { color: #e8f0ff; background: rgba(255,255,255,.08); }
.map-action-header { margin-bottom: 10px; padding-right: 24px; }
.map-action-addr {
  font-size: 13px;
  font-weight: 700;
  color: #e8f0ff;
  line-height: 1.4;
  min-height: 18px;
}
.map-action-meta {
  font-size: 11px;
  color: #8ca0bd;
  margin-top: 3px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.mam-tag {
  background: rgba(77,163,255,.14);
  border: 1px solid rgba(77,163,255,.22);
  border-radius: 8px;
  padding: 1px 7px;
  font-size: 11px;
  color: #5fb2ff;
}
.map-action-weather {
  margin-top: 6px;
  font-size: 12px;
  color: #8ca0bd;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.map-action-btns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.map-action-btn {
  flex: 1;
  min-width: 80px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  color: #e8f0ff;
  font-size: 12px;
  font-weight: 600;
  padding: 8px 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  transition: background .15s, border-color .15s;
  white-space: nowrap;
}
.map-action-btn:hover { background: rgba(255,255,255,.13); border-color: rgba(255,255,255,.22); }
.map-action-btn-primary {
  background: linear-gradient(135deg, #0f387a, #1a56c9);
  border-color: #3b72e0;
  color: #fff;
}
.map-action-btn-primary:hover { background: linear-gradient(135deg, #1a56c9, #2563eb); }
.map-action-btn-analyze:disabled {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.08);
  color: rgba(255,255,255,.3);
  cursor: not-allowed;
}
.map-action-btn-analyze:disabled:hover { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.08); }
.map-action-hint {
  font-size: 11px;
  color: rgba(255,255,255,.4);
  text-align: center;
  margin-top: 4px;
  padding: 3px 0;
}
.map-action-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid rgba(255,255,255,.2);
  border-top-color: #5fb2ff;
  border-radius: 50%;
  animation: spin .7s linear infinite;
  vertical-align: middle;
}
.map-action-spinner-sm {
  display: inline-block;
  width: 10px; height: 10px;
  border: 2px solid rgba(255,255,255,.15);
  border-top-color: #5fb2ff;
  border-radius: 50%;
  animation: spin .7s linear infinite;
  vertical-align: middle;
}
@keyframes spin { to { transform: rotate(360deg); } }
.mab-ok {
  background: rgba(16,185,129,.15);
  border: 1px solid rgba(16,185,129,.3);
  border-radius: 6px;
  padding: 1px 5px;
  color: #34d399;
  font-size: 10px;
  font-weight: 700;
}
.map-panel-visible { display: block !important; }

/* ===== RISK / CONFIDENCE GAUGE ===== */
.report-gauge-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 12px 0 4px;
}
.report-gauge-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.report-gauge-svg {
  width: 220px;
  height: 120px;
  overflow: visible;
}
.report-gauge-labels {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin-top: -4px;
}
.gauge-conf {
  font-size: 12px;
  color: #8ca0bd;
}
.gauge-level {
  font-size: 14px;
  font-weight: 700;
}
.gauge-low  { color: #34d399; }
.gauge-med  { color: #fbbf24; }
.gauge-high { color: #f87171; }

/* ===== WEATHER CARD IN REPORT ===== */
.report-gauge-weather {
  width: 100%;
  max-width: 340px;
  margin: 0 auto;
}
.weather-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 12px;
  color: #8ca0bd;
}
.weather-card-icon { font-size: 24px; line-height: 1; }
.weather-card-main { display: flex; flex-direction: column; gap: 2px; }
.weather-card-temp {
  font-size: 20px;
  font-weight: 700;
  color: #e8f0ff;
  line-height: 1;
}
.weather-card-desc { font-size: 12px; color: #94a3b8; }
.weather-card-stats {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-left: auto;
}
.weather-card-stat { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.weather-card-stat span:first-child { font-size: 13px; font-weight: 600; color: #e8f0ff; }
.weather-card-stat span:last-child  { font-size: 10px; color: #64748b; }

/* ======================================================
   ADMIN PANEL — LTR LAYOUT & VISUAL OVERHAUL
   Applied when <html dir="ltr" data-theme="light">
   ====================================================== */

/* --- Sidebar: flip from right (RTL default) to left (admin) --- */
[dir="ltr"] .sidebar {
  inset: 0 auto 0 0;       /* top auto bottom left  →  left side */
  border-left: 0;
  width: 292px;
}
[dir="ltr"]:root[data-theme="light"] .sidebar {
  border-right: 1px solid #dce4eb;
  border-left: 0;
  box-shadow: 2px 0 18px rgba(29,45,68,.05);
  background: #ffffff;
}
[dir="ltr"] .main {
  margin-right: 0;
  margin-left: 292px;
}

/* Body background for admin */
[dir="ltr"]:root[data-theme="light"] body {
  background: #f0f3f8;
}

/* --- Topbar sticky with blur --- */
[dir="ltr"] .topbar {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(248,250,252,.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid #dce4eb;
  margin: -28px -28px 24px;
  padding: 16px 28px;
}

/* --- Nav-group (collapsible) improvements for admin --- */
[dir="ltr"] .nav-group { margin-bottom: 2px; }
[dir="ltr"] .nav-group summary {
  padding: 6px 14px;
  font-size: 10.5px;
  letter-spacing: .08em;
  cursor: pointer;
}
[dir="ltr"] .nav-group summary::after {
  content: " ▸";
  float: right;
  opacity: .45;
  transition: transform .2s;
}
[dir="ltr"] .nav-group[open] summary::after {
  content: " ▾";
}
[dir="ltr"] .sidebar nav a {
  padding: 10px 14px 10px 20px;
  border-radius: 7px;
  font-size: 13.5px;
  font-weight: 500;
  display: block;
}
[dir="ltr"]:root[data-theme="light"] .sidebar nav a:hover {
  background: #f1f5f9;
  color: #1d2d44;
}
[dir="ltr"]:root[data-theme="light"] .sidebar nav a.active {
  background: #1d2d44;
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(29,45,68,.22);
}

/* --- Brand section in admin --- */
[dir="ltr"] .brand {
  padding: 4px 6px 14px;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
[dir="ltr"]:root[data-theme="light"] .brand b { font-size: 14px; color: #1d2d44; }
[dir="ltr"]:root[data-theme="light"] .brand small {
  font-size: 11px;
  color: #64748b;
  word-break: break-all;
}

/* --- Logout button in admin sidebar --- */
[dir="ltr"]:root[data-theme="light"] .logout {
  border-top: 1px solid #dce4eb;
  padding-top: 12px;
}
[dir="ltr"]:root[data-theme="light"] .logout button {
  color: #dc2626;
  padding: 8px 14px;
  border-radius: 7px;
  width: 100%;
  text-align: left;
  font-size: 13px;
  font-weight: 600;
  transition: background .15s;
}
[dir="ltr"]:root[data-theme="light"] .logout button:hover {
  background: #fff1f2;
}

/* --- Cards in admin (override dark gradient) --- */
[dir="ltr"]:root[data-theme="light"] .card,
[dir="ltr"]:root[data-theme="light"] .panel {
  background: #ffffff;
  border: 1px solid #dce4eb;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(29,45,68,.06);
}

/* --- Tables in admin --- */
[dir="ltr"]:root[data-theme="light"] table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13px;
}
[dir="ltr"]:root[data-theme="light"] th {
  background: #f8fafc;
  color: #64748b;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-bottom: 2px solid #dce4eb;
  padding: 10px 14px;
  text-align: left;
}
[dir="ltr"]:root[data-theme="light"] td {
  padding: 10px 14px;
  border-bottom: 1px solid #e8edf2;
  color: #1d2d44;
  vertical-align: middle;
}
[dir="ltr"]:root[data-theme="light"] tr:last-child td { border-bottom: 0; }
[dir="ltr"]:root[data-theme="light"] tr:hover td { background: #f8fafd; }

/* --- Form inputs in admin --- */
[dir="ltr"]:root[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[dir="ltr"]:root[data-theme="light"] select,
[dir="ltr"]:root[data-theme="light"] textarea {
  background: #fff;
  border: 1.5px solid #dce4eb;
  color: #1d2d44;
  border-radius: 8px;
  transition: border-color .15s, box-shadow .15s;
}
[dir="ltr"]:root[data-theme="light"] input:focus,
[dir="ltr"]:root[data-theme="light"] select:focus,
[dir="ltr"]:root[data-theme="light"] textarea:focus {
  border-color: #1d2d44;
  box-shadow: 0 0 0 3px rgba(29,45,68,.10);
  outline: none;
}
[dir="ltr"]:root[data-theme="light"] label {
  color: #374151;
  font-size: 13px;
  font-weight: 600;
}

/* --- Buttons in admin --- */
[dir="ltr"]:root[data-theme="light"] button.primary,
[dir="ltr"]:root[data-theme="light"] .button.primary {
  background: #1d2d44;
  color: #fff;
  border-color: #1d2d44;
  border-radius: 8px;
  padding: 9px 20px;
  font-weight: 700;
  font-size: 13px;
  box-shadow: 0 4px 14px rgba(29,45,68,.22);
}
[dir="ltr"]:root[data-theme="light"] button.primary:hover,
[dir="ltr"]:root[data-theme="light"] .button.primary:hover {
  background: #0f1e31;
  box-shadow: 0 6px 18px rgba(29,45,68,.30);
}
[dir="ltr"]:root[data-theme="light"] button:not(.primary):not(.danger),
[dir="ltr"]:root[data-theme="light"] .button:not(.primary):not(.danger) {
  background: #fff;
  border: 1.5px solid #dce4eb;
  color: #1d2d44;
  border-radius: 8px;
  padding: 8px 18px;
  font-weight: 600;
  font-size: 13px;
}
[dir="ltr"]:root[data-theme="light"] button:not(.primary):not(.danger):hover,
[dir="ltr"]:root[data-theme="light"] .button:not(.primary):not(.danger):hover {
  border-color: #1d2d44;
  background: #f8fafc;
}

/* --- Admin badge / pill variants --- */
[dir="ltr"]:root[data-theme="light"] .badge,
[dir="ltr"]:root[data-theme="light"] .pill {
  background: #f1f5f9;
  color: #475569;
  border-color: #dce4eb;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 700;
}
[dir="ltr"]:root[data-theme="light"] .badge.active,
[dir="ltr"]:root[data-theme="light"] .status-active {
  background: #f0fdf4; color: #166534; border-color: #bbf7d0;
}
[dir="ltr"]:root[data-theme="light"] .badge.blocked,
[dir="ltr"]:root[data-theme="light"] .status-blocked {
  background: #fff4ef; color: #b42318; border-color: #fed7c7;
}
[dir="ltr"]:root[data-theme="light"] .badge.admin,
[dir="ltr"]:root[data-theme="light"] .status-admin {
  background: #eff6ff; color: #1e40af; border-color: #bfdbfe;
}

/* --- Section headings in settings --- */
[dir="ltr"]:root[data-theme="light"] .settings-section {
  background: #ffffff;
  border: 1px solid #dce4eb;
  border-radius: 10px;
}
[dir="ltr"]:root[data-theme="light"] .settings-section h3 {
  color: #1d2d44;
  font-size: 14px;
  border-bottom: 1px solid #f1f5f9;
  padding-bottom: 10px;
  margin-bottom: 0;
}

/* --- Flash messages in admin --- */
[dir="ltr"]:root[data-theme="light"] .flash .item {
  padding: 12px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid;
}
[dir="ltr"]:root[data-theme="light"] .flash .success {
  background: #f0fdf4; border-color: #bbf7d0; color: #166534;
}
[dir="ltr"]:root[data-theme="light"] .flash .error {
  background: #fff1f2; border-color: #fecdd3; color: #991b1b;
}

/* --- Pager in admin --- */
[dir="ltr"]:root[data-theme="light"] .pager a,
[dir="ltr"]:root[data-theme="light"] .pager span {
  background: #fff; border-color: #dce4eb; color: #1d2d44;
}
[dir="ltr"]:root[data-theme="light"] .pager a:hover { border-color: #1d2d44; }
[dir="ltr"]:root[data-theme="light"] .pager span.current {
  background: #1d2d44; color: #fff; border-color: #1d2d44;
}

/* --- Admin topbar h1 in light mode --- */
[dir="ltr"]:root[data-theme="light"] .main .topbar h1 {
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  color: #1d2d44;
  font-size: 20px;
  font-weight: 800;
}
[dir="ltr"]:root[data-theme="light"] .topbar {
  background: rgba(248,250,252,.96);
}
[dir="ltr"]:root[data-theme="light"] .topbar p { color: #64748b; font-size: 13px; }

/* --- Filter bar in admin --- */
[dir="ltr"]:root[data-theme="light"] .filter-bar input,
[dir="ltr"]:root[data-theme="light"] .filter-bar select {
  background: #fff;
  border: 1.5px solid #dce4eb;
  color: #1d2d44;
  border-radius: 7px;
  font-size: 13px;
  min-height: 36px;
}

/* --- Upload zone in admin --- */
[dir="ltr"]:root[data-theme="light"] .upload-zone {
  border-color: #dce4eb;
  color: #64748b;
  background: #fafbfd;
}
[dir="ltr"]:root[data-theme="light"] .upload-zone:hover {
  border-color: #1d2d44;
  background: #f8fafc;
}

/* --- Check label in admin --- */
[dir="ltr"]:root[data-theme="light"] label.check {
  font-weight: 500;
  color: #374151;
}
[dir="ltr"]:root[data-theme="light"] .check input[type=checkbox] {
  accent-color: #1d2d44;
}

/* --- Inline section divider label --- */
[dir="ltr"]:root[data-theme="light"] .section {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #94a3b8;
}

/* --- Admin responsive: collapse to top nav below 860px --- */
@media (max-width: 860px) {
  [dir="ltr"] .sidebar { position: static; width: auto; }
  [dir="ltr"] .main { margin-left: 0; }
}

/* Popup weather mini-row */
.maw-icon { font-size: 14px; }
.maw-sep  { color: rgba(255,255,255,.25); margin: 0 2px; }

/* ═══════════════════════════════════════════════════════════════
   KARTVERKET MAP TAB — full-height map with left controls
   ═══════════════════════════════════════════════════════════════ */

.user-kartverket-map-surface {
  padding: 0 !important;
  overflow: hidden;
  height: 100%;
  display: none;
  flex-direction: column;
}
.user-kartverket-map-surface.active {
  display: flex !important;
}

.kv-map-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  height: 100%;
  min-height: 0;
  gap: 0;
}

.kv-map-controls {
  background: var(--surface);
  border-right: 1px solid var(--line);
  padding: 14px 12px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.kv-map-wrap {
  flex: 1;
  min-width: 0;
  min-height: 400px;
  position: relative;
}

.kv-map-wrap #kvMap {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* ── Improved right sidebar visual hierarchy ── */
.user-right-sidebar .user-section-title {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
  padding-top: 4px;
}

.user-right-sidebar .user-mini-card {
  padding: 10px 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 8px;
}

.user-right-sidebar > div {
  margin-bottom: 2px;
}

/* ── Tighten up map controls grid ── */
.user-map-camera-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}

.user-map-camera-grid label {
  grid-column: 1 / -1;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  gap: 4px;
}

/* ── Cleaner layer toggles ── */
.user-layer-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.user-layer-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 6px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  transition: background .12s;
}

.user-layer-item:hover {
  background: rgba(255,255,255,.06);
}

/* ── Category badge in history items ── */
.cat-badge-inline {
  display: inline-block;
  font-size: 10px;
  background: rgba(95,178,255,.15);
  border: 1px solid rgba(95,178,255,.22);
  color: var(--primary);
  border-radius: 10px;
  padding: 1px 7px;
  margin-left: 5px;
  vertical-align: middle;
}

/* ── Quick category assign dropdown ── */
.quick-cat-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}

.quick-cat-wrap select {
  flex: 1;
  font-size: 12px;
  min-height: 32px;
  padding: 4px 8px;
}

.quick-cat-wrap button {
  white-space: nowrap;
  font-size: 12px;
  padding: 5px 10px;
  min-height: 32px;
}

/* ── Building polygon capture preview ── */
.polygon-preview-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
  padding: 4px 0;
}

.polygon-preview-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(60,207,145,.18);
  border: 2px solid #3ccf91;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(60,207,145,.10);
}

/* ── Map action panel improvements ── */
.map-action-panel {
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
}

/* ── User nav items cleaner ── */
.user-nav-item {
  font-size: 13px;
  padding: 9px 11px;
  border-radius: 7px;
  min-height: 38px;
}

/* ── Portfolio snapshot tighter ── */
.user-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 6px;
}

.user-stat-grid > div {
  background: rgba(255,255,255,.04);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 7px 9px;
}

.user-value {
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  margin-top: 2px;
}

.user-small {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* ── Report tab cleaner ── */
.user-report-primary {
  padding: 16px;
}

.user-work-card {
  padding: 14px 16px;
}

/* ── Responsive: stack kv map on mobile ── */
@media (max-width: 600px) {
  .kv-map-layout {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
  .kv-map-controls {
    border-right: none;
    border-bottom: 1px solid var(--line);
    max-height: 220px;
    overflow-y: auto;
  }
}

/* ═══════════════════════════════════════════════════
   DETAILED REPORT MODAL  —  buildDetailedReportHTML()
   ═══════════════════════════════════════════════════ */

/* ── Report header ── */
.rpt-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 22px;
  background: linear-gradient(135deg, rgba(11,18,30,1) 0%, rgba(18,28,48,1) 100%);
  border-bottom: 1px solid rgba(95,178,255,.18);
  flex-wrap: wrap;
}
.rpt-header-brand { display: flex; align-items: center; gap: 14px; }
.rpt-header-mark {
  width: 48px; height: 48px;
  border-radius: 14px;
  background: conic-gradient(from 130deg at 50% 50%, #5fb2ff, #8a6bff 35%, #ff6c8a 70%, #5fb2ff);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 24px rgba(95,178,255,.35);
  position: relative; flex-shrink: 0;
}
.rpt-header-mark::before {
  content: "";
  position: absolute; inset: 5px;
  border-radius: 9px;
  background: rgba(5,8,16,.72);
}
.rpt-header-mark span {
  position: relative; z-index: 1;
  font-weight: 900; font-size: 22px; color: #fff; letter-spacing: -.03em;
}
.rpt-header-title {
  font-size: 15px; font-weight: 800; color: #e2eeff;
}
.rpt-header-subtitle {
  font-size: 12px; color: #5a7a9e; margin-top: 2px;
}
.rpt-header-score {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-width: 80px; min-height: 80px;
  border-radius: 14px; border: 2px solid;
  background: rgba(11,18,30,.6);
}
.rpt-header-score strong { font-size: 36px; font-weight: 900; line-height: 1; }
.rpt-header-score span {
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; color: #8a9db8; margin-top: 4px;
}

/* ── Meta strip ── */
.rpt-meta-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.rpt-meta-item {
  padding: 12px 18px;
  border-right: 1px solid rgba(255,255,255,.06);
}
.rpt-meta-item:last-child { border-right: none; }
.rpt-meta-item span { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #4a6480; margin-bottom: 3px; }
.rpt-meta-item b { font-size: 13px; color: #d0e4f8; }

/* ── Primary view ── */
.rpt-primary-view { padding: 16px 22px; }
.rpt-primary-img-wrap {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  max-height: 360px;
}
.rpt-primary-img-wrap img {
  width: 100%; max-height: 360px; object-fit: cover; display: block;
}
.rpt-primary-watermark {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 10px 16px;
  background: rgba(5,8,16,.72);
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,.7);
  letter-spacing: .08em;
}
.rpt-primary-label {
  position: absolute; top: 12px; left: 12px;
  background: rgba(5,8,16,.72); border-radius: 6px;
  padding: 4px 10px; font-size: 12px; color: #9fd2ff;
}

/* ── Gauge + hero metrics ── */
.rpt-gauge-section {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: start;
  padding: 16px 22px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.rpt-gauge-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 180px; }
.rpt-gauge-svg { width: 180px; }
.rpt-gauge-labels { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.rpt-hero-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
}
.rpt-hero-metric {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 10px 12px;
}
.rpt-hero-metric span { display: block; font-size: 10px; color: #4a6480; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; }
.rpt-hero-metric b { font-size: 14px; color: #d0e4f8; }

/* ── Section title ── */
.rpt-section-title {
  font-size: 11px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .12em; color: #4a6480;
  padding: 20px 22px 8px;
  border-top: 1px solid rgba(255,255,255,.05);
  margin-top: 4px;
}

/* ── Callout box ── */
.rpt-callout {
  margin: 8px 22px 0;
  padding: 16px 18px;
  border-radius: 12px;
  background: rgba(95,178,255,.07);
  border: 1px solid rgba(95,178,255,.18);
  color: #d0e4f8;
  font-size: 15px;
  line-height: 1.7;
}

/* ── Paragraph text ── */
.rpt-para {
  margin: 6px 22px 0;
  color: #8a9db8;
  font-size: 13.5px;
  line-height: 1.75;
  padding-bottom: 8px;
  white-space: pre-line;
}

/* ── Formula grid ── */
.rpt-formula-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 6px;
  margin: 6px 22px 0;
}
.rpt-formula-row {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  padding: 10px 12px;
}
.rpt-formula-row span { display: block; font-size: 10px; color: #4a6480; margin-bottom: 4px; }
.rpt-formula-row b   { font-size: 16px; color: #d0e4f8; }
.rpt-formula-row small { display: block; font-size: 10px; color: #3d5270; margin-top: 4px; }
.rpt-formula-final {
  margin: 8px 22px 0;
  padding: 10px 14px;
  border-radius: 8px;
  background: rgba(34,197,94,.07);
  border: 1px solid rgba(34,197,94,.18);
  font-size: 12px; color: #9ddfb8; font-family: "Courier New", monospace;
}

/* ── Recommendations ── */
.rpt-recs {
  margin: 6px 22px 0;
  list-style: none;
  padding: 0;
  display: grid;
  gap: 8px;
}
.rpt-recs li {
  display: flex;
  gap: 12px;
  align-items: baseline;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  font-size: 13.5px;
  line-height: 1.6;
  color: #c0d4f0;
}
.rpt-rec-num {
  flex-shrink: 0;
  width: 22px; height: 22px;
  background: rgba(95,178,255,.15);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; color: #5fb2ff;
}

/* ── Detailed findings ── */
.rpt-findings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
  margin: 6px 22px 0;
}
.rpt-finding-block {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  padding: 12px 14px;
}
.rpt-finding-title { font-size: 11px; font-weight: 800; color: #5fb2ff; margin-bottom: 7px; text-transform: uppercase; letter-spacing: .06em; }
.rpt-finding-body  { font-size: 13px; color: #8a9db8; line-height: 1.65; white-space: pre-line; }

/* ── Timeline ── */
.rpt-timeline {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 22px 12px;
  scrollbar-width: thin;
}
.rpt-timeline-item {
  flex: 0 0 180px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  padding: 12px;
}
.rpt-timeline-item.changed { border-color: rgba(245,158,11,.30); }
.rpt-timeline-item b { display: block; font-size: 12px; color: #e2eeff; margin-bottom: 4px; }
.rpt-timeline-item span { font-size: 11px; color: #5a7a9e; }

/* ── Image gallery ── */
.rpt-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
  margin: 6px 22px 0;
}
.rpt-gallery-item { border-radius: 10px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); }
.rpt-gallery-img-wrap { position: relative; }
.rpt-gallery-img-wrap img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block;
}
.rpt-gallery-wm {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 6px 10px;
  background: rgba(5,8,16,.68);
  font-size: 10px; font-weight: 700; color: rgba(255,255,255,.6);
  letter-spacing: .08em;
}
.rpt-gallery-caption {
  padding: 8px 10px;
  background: rgba(255,255,255,.03);
  display: grid; gap: 2px;
}
.rpt-gallery-type {
  font-size: 10px;
  text-transform: uppercase; letter-spacing: .08em; color: #5fb2ff;
}
.rpt-gallery-caption span:last-child { font-size: 11px; color: #7a92b3; }

/* ── KV grid ── */
.rpt-kv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px;
  margin: 6px 22px 0;
}
.rpt-kv-item {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  padding: 10px 12px;
  min-height: 60px;
}
.rpt-kv-item span { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #4a6480; margin-bottom: 4px; }
.rpt-kv-item b    { font-size: 13px; color: #d0e4f8; }
.rpt-kv-item small { display: block; font-size: 10px; color: #3d5270; margin-top: 4px; line-height: 1.35; }

/* ── Sources ── */
.rpt-sources {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
  margin: 6px 22px 0;
}
.rpt-source-item {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  padding: 12px;
  display: grid; gap: 4px;
}
.rpt-source-status { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #3ccf91; }
.rpt-source-item b   { font-size: 13px; color: #d0e4f8; }
.rpt-source-item small { font-size: 11px; color: #5a7a9e; line-height: 1.5; }

/* ── Footer ── */
.rpt-footer {
  margin: 24px 22px 8px;
  padding: 14px 0 8px;
  border-top: 1px solid rgba(255,255,255,.07);
  font-size: 11px;
  color: #3d5270;
  text-align: center;
  line-height: 1.7;
}
.rpt-empty { padding: 40px; text-align: center; color: #4a6480; }

/* ── Vulnerability bars (report tab) ── */
.report-vuln-grid { display: grid; gap: 8px; margin: 6px 0 0; }
.vuln-row { display: grid; grid-template-columns: 180px 1fr; gap: 10px; align-items: center; }
.vuln-label { font-size: 12px; color: #8a9db8; }
.vuln-value { font-size: 12px; color: #d0e4f8; font-weight: 600; }
.vuln-bar-wrap { grid-column: 1 / -1; height: 6px; background: rgba(255,255,255,.08); border-radius: 99px; overflow: hidden; }
.vuln-bar-fill { height: 100%; border-radius: 99px; transition: width .5s ease; min-width: 3px; }

/* ── Detailed findings (report tab) ── */
.report-findings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}
.finding-block {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.03);
  padding: 12px 14px;
}
.finding-title { font-size: 11px; font-weight: 800; color: #5fb2ff; margin-bottom: 6px; }
.finding-body  { font-size: 12px; color: #8a9db8; line-height: 1.6; }

/* ── Image gallery (report tab) ── */
.report-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
}
.gallery-item { border-radius: 10px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); }
.gallery-item img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.gallery-caption { padding: 7px 10px; background: rgba(255,255,255,.03); display: grid; gap: 2px; }
.gallery-type { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: #5fb2ff; }
.gallery-caption span:last-child { font-size: 11px; color: #7a92b3; }
.gallery-watermark {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 6px 10px;
  background: rgba(5,8,16,.68);
  font-size: 10px; font-weight: 700; color: rgba(255,255,255,.5);
}
.gallery-item { position: relative; }

/* ── Report advance narrative ── */
.report-advance-narrative {
  font-size: 13.5px;
  line-height: 1.75;
  color: #8a9db8;
  white-space: pre-line;
}

/* ── Batch export controls ── */
.batch-export-controls {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}
.batch-filter-row { display: grid; gap: 8px; }
.batch-filter-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.batch-export-status { font-size: 12px; padding-top: 4px; min-height: 18px; }

/* ── Dashboard topbar brand badge (4 mark) ── */
.user-brand-badge {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -.03em;
}

/* ── Responsive report modal ── */
@media (max-width: 700px) {
  .rpt-gauge-section { grid-template-columns: 1fr; }
  .rpt-meta-strip   { grid-template-columns: 1fr 1fr; }
  .rpt-gallery      { grid-template-columns: repeat(2, 1fr); }
  .rpt-kv-grid      { grid-template-columns: 1fr 1fr; }
  .rpt-findings-grid { grid-template-columns: 1fr; }
}

/* ── Risk Calculation Methodology ── */
.rpt-formula-expr {
  margin: 4px 22px 12px;
  padding: 10px 14px;
  background: rgba(14, 24, 42, .6);
  border: 1px solid rgba(100,140,200,.15);
  border-radius: 8px;
  font-family: "Courier New", monospace;
  font-size: 12px;
  color: #9bb8d8;
  word-break: break-all;
}
.rpt-methodology-grid {
  margin: 0 22px 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.rpt-method-row {
  display: grid;
  grid-template-columns: 1fr 72px 56px 64px 1fr;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 6px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.05);
  font-size: 12px;
}
.rpt-method-row:nth-child(even) { background: rgba(255,255,255,.055); }
.rpt-method-label { color: #c8d8ec; font-weight: 600; }
.rpt-method-score { font-weight: 700; text-align: right; }
.rpt-method-weight { color: #7a92b0; text-align: center; }
.rpt-method-contrib { color: #a8bcd8; text-align: right; font-family: "Courier New", monospace; font-size: 11px; }
.rpt-method-bar-track {
  height: 6px;
  background: rgba(255,255,255,.08);
  border-radius: 3px;
  overflow: hidden;
}
.rpt-method-bar {
  height: 100%;
  border-radius: 3px;
  transition: width .3s ease;
}
/* ── Data Source Badges ── */
.data-source-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.ds-official      { background: rgba(34, 197, 94, .15);  color: #4ade80;  border: 1px solid rgba(34,197,94,.3); }
.ds-calculated    { background: rgba(59, 130, 246, .15); color: #60a5fa;  border: 1px solid rgba(59,130,246,.3); }
.ds-user_provided { background: rgba(168, 85, 247, .15); color: #c084fc;  border: 1px solid rgba(168,85,247,.3); }
.ds-estimated     { background: rgba(245, 158, 11, .15); color: #fbbf24;  border: 1px solid rgba(245,158,11,.3); }
.ds-ai_inferred   { background: rgba(249, 115, 22, .15); color: #fb923c;  border: 1px solid rgba(249,115,22,.3); }

/* ── Data Reliability Table ── */
.rpt-reliability-table {
  margin: 4px 22px 0;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.07);
  font-size: 12px;
}
.rpt-reliability-header,
.rpt-reliability-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1.5fr 80px;
  gap: 0;
}
.rpt-reliability-header {
  background: rgba(11, 18, 30, .9);
  padding: 8px 12px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #556680;
}
.rpt-reliability-header span,
.rpt-reliability-row span { padding: 0 6px; }
.rpt-reliability-row {
  padding: 7px 12px;
  align-items: center;
  border-top: 1px solid rgba(255,255,255,.04);
  color: #c0d0e4;
}
.rpt-reliability-row:nth-child(even) { background: rgba(255,255,255,.025); }

/* ── Historical Imagery Analysis ── */
.rpt-historical {
  margin: 4px 22px 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.rpt-hist-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 6px 10px;
  border-radius: 6px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.05);
  font-size: 12px;
}
.rpt-hist-label { color: #7a92b0; }
.rpt-hist-row b { color: #d0e4f8; font-weight: 700; }
.rpt-hist-changes {
  margin-top: 6px;
  background: rgba(14, 24, 42, .5);
  border: 1px solid rgba(100,140,200,.12);
  border-radius: 8px;
  padding: 8px 12px;
}
.rpt-hist-changes-title { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #4a6480; margin-bottom: 6px; }
.rpt-hist-change-item { display: flex; gap: 10px; font-size: 12px; color: #c0d0e4; padding: 3px 0; border-top: 1px solid rgba(255,255,255,.04); }
.rpt-hist-year { min-width: 36px; font-weight: 700; color: #60a5fa; }
.rpt-hist-basis { font-size: 11px; color: #556680; margin: 4px 0 0; padding: 0 2px; font-style: italic; }
.rpt-hist-note {
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 6px;
  background: rgba(59, 130, 246, .07);
  border: 1px solid rgba(59,130,246,.18);
  font-size: 11px;
  color: #7ab8f0;
}

/* ── Bottom panel drag handle ── */
.bottom-panel-drag-handle {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  cursor: ns-resize;
  background: transparent;
  z-index: 10;
  transition: background .15s;
}
.bottom-panel-drag-handle:hover,
.bottom-panel-drag-handle:active {
  background: rgba(99, 155, 255, .18);
}
.user-bottom-panel { position: relative; }

@media (max-width: 700px) {
  .rpt-method-row { grid-template-columns: 1fr 64px 48px; }
  .rpt-method-bar-track, .rpt-method-contrib { display: none; }
  .rpt-reliability-header, .rpt-reliability-row { grid-template-columns: 1.5fr 1fr 80px; }
  .rpt-reliability-header span:nth-child(3),
  .rpt-reliability-row span:nth-child(3) { display: none; }
}

/* ============================================================
   Polish Pass 2026-05-24 — additive refinements
   Goal: cleaner rhythm, consistent focus rings, better hover
   feedback. NO structural / layout changes; safe to override.
   ============================================================ */

/* — Typography: switch dashboard fonts to Inter for cleaner reading.
   Tahoma is kept as ultimate fallback. — */
.user-app, .user-panel, .user-app input, .user-app select, .user-app textarea, .user-app button {
  font-family: Inter, "SF Pro Text", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Tahoma, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* — Consistent focus ring for keyboard navigation. — */
.user-app :is(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid rgba(95,178,255,.6);
  outline-offset: 2px;
  border-radius: 8px;
}

/* — Section titles: slightly more breathing room, neutral colour. — */
.user-section-title {
  font-size: 10px;
  letter-spacing: .085em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(147,165,194,.78);
}

/* — Mini cards: a touch more contrast between cards & panel bg. — */
.user-right-sidebar .user-mini-card,
.user-left-sidebar .user-mini-card {
  background: rgba(255,255,255,.038);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  transition: border-color .18s ease, background .18s ease;
}
.user-right-sidebar .user-mini-card:hover,
.user-left-sidebar .user-mini-card:hover {
  border-color: rgba(255,255,255,.12);
}

/* — Button rhythm: every interactive control reaches ≥36px height. — */
.user-btn { min-height: 36px; }
.user-btn-primary {
  box-shadow: 0 10px 24px rgba(95,178,255,.22), inset 0 1px 0 rgba(255,255,255,.18);
}
.user-btn-secondary {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
}

/* — Input rhythm. — */
.user-input, .user-select, .user-work-card input, .user-work-card textarea {
  min-height: 38px;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.user-input:focus, .user-select:focus, .user-work-card input:focus, .user-work-card textarea:focus {
  border-color: rgba(95,178,255,.55);
  background: rgba(95,178,255,.05);
  box-shadow: 0 0 0 3px rgba(95,178,255,.16);
  outline: none;
}

/* — Nav items: clearer active state. — */
.user-nav-item {
  border-radius: 10px;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.user-nav-item.active {
  background: linear-gradient(180deg, rgba(95,178,255,.20), rgba(138,107,255,.12));
  border-color: rgba(95,178,255,.36);
  color: #ffffff;
  box-shadow: 0 6px 18px rgba(95,178,255,.18);
}

/* — Toggle pill: smooth state transition. — */
.user-toggle span,
.user-toggle span::before {
  transition: background .18s ease, transform .18s ease;
}

/* — Map action popup: refined drop shadow & header tagline. — */
.map-action-panel {
  box-shadow: 0 18px 48px rgba(0,0,0,.55), 0 2px 0 rgba(255,255,255,.04) inset;
  border-color: rgba(255,255,255,.12);
}
.map-action-addr { letter-spacing: -0.005em; }
.map-action-btn {
  min-height: 38px;
  transition: background .18s ease, border-color .18s ease, transform .12s ease, box-shadow .18s ease;
}
.map-action-btn:hover { transform: translateY(-1px); }
.map-action-btn:active { transform: translateY(0); }
.map-action-btn-primary {
  box-shadow: 0 10px 22px rgba(15,56,122,.34), inset 0 1px 0 rgba(255,255,255,.18);
}

/* — Eiendom slide-in panel: slightly less aggressive scrim. — */
.eiendom-panel { box-shadow: -24px 0 60px rgba(0,0,0,.55); }

/* — Layer toggle items: clearer hover affordance. — */
.user-layer-item {
  border-radius: 10px;
  transition: background .15s ease;
}
.user-layer-item:hover { background: rgba(255,255,255,.035); }

/* — Property rows / history rows: smoother hover. — */
.user-property-row, .user-history-item {
  transition: background .15s ease, border-color .15s ease, transform .12s ease;
}
.user-property-row:hover, .user-history-item:hover { transform: translateY(-1px); }

/* — Scrollbars: slim, theme-aware. — */
.user-app *::-webkit-scrollbar { width: 8px; height: 8px; }
.user-app *::-webkit-scrollbar-track { background: transparent; }
.user-app *::-webkit-scrollbar-thumb {
  background: rgba(147,165,194,.20);
  border-radius: 8px;
}
.user-app *::-webkit-scrollbar-thumb:hover { background: rgba(147,165,194,.36); }

/* — Reduce-motion respect. — */
@media (prefers-reduced-motion: reduce) {
  .user-app *,
  .user-app *::before,
  .user-app *::after { transition: none !important; animation-duration: 0.001ms !important; }
}

/* ── CUATRO logo images inside the brand badges ────────────────────────────
   Each mark below has a gradient outer ring and a dark inner pad (rendered
   via ::before or ::after with inset:4–5px). The logo image sits above the
   inner pad via z-index and is recoloured to bright white with a CSS filter
   so the same monochrome PNG works on every dark background. */
.user-brand-badge img,
.admin-brand-mark img,
.rpt-header-mark img,
.lp-nav-mark img,
.lp-card-mark img,
.lp-logo-image {
  position: relative;
  z-index: 2;
  display: block;
  width: 72%;
  height: 72%;
  object-fit: contain;
  /* Recolour the gray PNG → near-white so it pops on dark backgrounds. */
  filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.35));
}
.lp-logo-image {
  width: 60%;
  height: auto;
  margin-bottom: 2px;
}
