:root {
  color-scheme: light;
  color: #263438;
  background: #edf2f3;
  --green: #0c786e;
  --border: rgba(69, 100, 108, .14);
  --muted: #687b82;
  --glass: rgba(255, 255, 255, .64);
  --edge: rgba(255, 255, 255, .92);
  --shadow: 0 8px 28px rgba(53, 81, 89, .055);
}

body {
  min-height: 100vh;
  isolation: isolate;
  background: transparent;
  -webkit-font-smoothing: antialiased;
}

/* Broad refracted light planes stay behind the work surfaces, not the text. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(122deg, transparent 60%, #ffffff80 60.1%, #ffffff08 78%, transparent 78.1%),
    linear-gradient(28deg, #d5eeeb96 0%, transparent 42%),
    linear-gradient(145deg, #e2eef3 0%, #f5f7f7 40%, #f3e6e980 74%, #dcecec 100%);
}

::selection { background: #a7ded7; color: #164b47; }
button, input, select, textarea, .button { border-radius: 8px; }
button, .button {
  min-height: 36px;
  border: 1px solid rgba(255, 255, 255, .95);
  background: linear-gradient(155deg, #ffffffd9, #ffffff70);
  color: #3c555b;
  box-shadow: 0 0 0 1px #546d771c, 0 3px 7px #344b5709, inset 0 1px 0 #fff;
  transition: background .16s ease, box-shadow .16s ease, border-color .16s ease;
}
button:hover, .button:hover {
  background: #ffffffeb;
  box-shadow: 0 0 0 1px #599b9940, 0 4px 12px #345e6512, inset 0 1px 0 #fff;
}
button:active { box-shadow: inset 0 2px 5px #355b6012; }
button:disabled { opacity: .55; }
button.primary {
  color: #fff;
  background: linear-gradient(145deg, #209389, #0e766e);
  border-color: #ffffff54;
  box-shadow: 0 0 0 1px #0b706d, 0 4px 10px #14796b20, inset 0 1px 0 #ffffff45;
}
button.primary:hover { background: linear-gradient(145deg, #18877e, #08665f); }
button:focus-visible, a:focus-visible { outline: 3px solid #439c9c; outline-offset: 3px; }
.icon { width: 36px; height: 36px; padding: 8px; border-radius: 8px; }
.text-btn { min-height: 30px; background: transparent; border-color: transparent; box-shadow: none; }
.text-btn:hover { background: #ffffffad; box-shadow: none; }
svg.lucide { stroke-width: 1.8; }

input, select, textarea {
  background: #ffffffa8;
  border-color: #c4d2d7;
  color: #2f444b;
  box-shadow: inset 0 1px 3px #4b657009, 0 1px 0 #ffffffb3;
}
input:focus, select:focus, textarea:focus { outline: 2px solid #64b4ac; outline-offset: 2px; background: #fff; }
input::placeholder, textarea::placeholder { color: #7b8b91; opacity: 1; }
select option { background: #f9fbfc; color: #263438; }
label { color: #566c74; }
h1 { font-size: 27px; color: #22383e; font-weight: 650; margin-bottom: 6px; }
h2 { color: #304a50; font-size: 16px; }
.eyebrow { color: #71868a; font-size: 10px; }
.muted { color: #6b7f87; }

.sidebar {
  width: 228px;
  padding: 30px 18px 24px;
  background: linear-gradient(165deg, #ffffffa8, #ffffff47);
  border-right: 1px solid #ffffffd9;
  box-shadow: 1px 0 0 #516a7512, 8px 0 28px #5f808808;
  -webkit-backdrop-filter: blur(32px) saturate(145%);
  backdrop-filter: blur(32px) saturate(145%);
  z-index: 10;
}
.brand { color: #29454b; font-size: 18px; gap: 12px; }
.brand span:not(.brand-mark) { color: #73858a; font-size: 11px; }
.brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid #ffffffb3;
  background: linear-gradient(140deg, #89d4c9, #2c948a 51%, #1d777b);
  box-shadow: inset 0 1px 1px #ffffffb0, inset 0 -2px 5px #1d6f7133, 0 4px 12px #3e929229;
  color: #fff;
  font-size: 23px;
}
.nav-label { color: #72878d; margin: 38px 12px 12px; font-size: 11px; }
.sidebar nav { padding: 1px 2px 8px; }
nav button {
  color: #61767d;
  margin: 4px 0;
  min-height: 44px;
  padding: 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  gap: 11px;
}
nav button:hover { background: #ffffff75; border-color: #ffffffa8; box-shadow: none; }
nav button.active {
  color: #13685f;
  border-color: #ffffffed;
  background: linear-gradient(115deg, #ffffffed, #d8efead9);
  box-shadow: 0 3px 12px #3e807512, inset 0 0 0 1px #ffffff7d;
  font-weight: 650;
}
nav button span { background: #d5e9e4; color: #236a63; }
.sidebar-bottom { color: #6d8384; }
.status-dot { background: #289886; box-shadow: 0 0 0 3px #31978012; }
.profile { border-top-color: #708f9626; padding-top: 22px; color: #405b61; }
.profile small { color: #72868b; font-size: 11px; }
.profile .icon { box-shadow: none; background: #ffffff52; border-color: #ffffff8c; }
.avatar { background: #e0eeea; color: #3b7468; border: 1px solid #ffffffc7; box-shadow: 0 2px 4px #34596206; }
.avatar.a2 { background: #e3edf8; color: #527c9e; }
.avatar.a3 { background: #f5e9dd; color: #986c39; }
.avatar.a4 { background: #f1e4ea; color: #a26380; }
.avatar.a5 { background: #dfecee; color: #577d88; }

.main { margin-left: 228px; min-width: 0; }
header {
  height: 76px;
  background: #ffffff42;
  border-bottom: 1px solid #ffffffd9;
  box-shadow: 0 1px 0 #6f89940c;
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}
.breadcrumb { color: #72858d; }
.breadcrumb span { color: #9cafb6; }
.breadcrumb b { color: #35565b; }
.header-tools { gap: 10px; }
.header-tools input { background: #ffffff8c; border-color: #ffffffeb; box-shadow: 0 0 0 1px #69858e21; }
.timezone { color: #758992; }
main { padding-top: 32px; }
.page-heading { margin-bottom: 26px; }
#page-actions { align-items: center; }
#content { min-width: 0; }
.stats {
  background: linear-gradient(120deg, #ffffffb8, #ffffff6b);
  border-color: var(--edge);
  border-radius: 8px;
  box-shadow: var(--shadow), inset 0 1px 0 #fff;
  -webkit-backdrop-filter: blur(20px) saturate(135%);
  backdrop-filter: blur(20px) saturate(135%);
}
.stat { padding: 23px 24px; border-right-color: #b4c9ce40; }
.stat-top { color: #5f7881; }
.stat-top svg { color: #348f80; width: 18px; height: 18px; }
.stat:nth-child(2) .stat-top svg { color: #468aac; }
.stat:nth-child(3) .stat-top svg { color: #b17891; }
.stat:nth-child(4) .stat-top svg { color: #ad874b; }
.stat-number { color: #25444a; font-size: 34px; margin-top: 12px; font-weight: 620; }
.stat-number small { color: #7b939a; }
.stat-sub { color: #728992; font-size: 11px; }
.section-head { margin-top: 28px; }
.section-head span { color: #748992; }
.table-wrap {
  background: #ffffffa6;
  border-color: #ffffffeb;
  border-radius: 8px;
  box-shadow: 0 0 0 1px #6f8d970f, var(--shadow);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}
th { background: #e9f0f299; color: #657d86; padding-top: 14px; padding-bottom: 14px; border-color: #c3d1d845; }
td { color: #425d66; border-color: #9bb4bf24; padding-top: 18px; padding-bottom: 18px; font-variant-numeric: tabular-nums; }
tr:hover td { background: #ffffff91; }
.person b { color: #334e56; font-weight: 600; }
.person small { color: #788c95; }
.tag { background: #e7edef; color: #596f7a; border: 1px solid #ffffff80; padding: 4px 8px; border-radius: 5px; font-size: 11px; }
.tag.green { background: #dceee6; color: #33745d; }
.tag.amber { background: #f5ead4; color: #8b682c; }
.tag.red { background: #f4e0e3; color: #a34f63; }
.tag.blue { background: #e1edf7; color: #4d7498; }
progress, .bar-track, .progress { background: #dce6e6; height: 7px; border-radius: 4px; }
progress::-webkit-progress-bar { background: #dce6e6; }
progress::-webkit-progress-value { background: linear-gradient(90deg, #75bdb1, #319282); border-radius: 4px; }
progress::-moz-progress-bar { background: #319282; border-radius: 4px; }
.bar-row:nth-child(2) progress::-webkit-progress-value { background: linear-gradient(90deg, #9abed3, #6d96b6); }
.bar-row:nth-child(3) progress::-webkit-progress-value { background: linear-gradient(90deg, #d8c194, #bd9b63); }
.bar-row:nth-child(4) progress::-webkit-progress-value { background: linear-gradient(90deg, #d3afc0, #b2809c); }
.bar-row:nth-child(2) progress::-moz-progress-bar { background: #6d96b6; }
.bar-row:nth-child(3) progress::-moz-progress-bar { background: #bd9b63; }
.bar-row:nth-child(4) progress::-moz-progress-bar { background: #b2809c; }
.bar-row { color: #57747d; }
.bar-row b { color: #3e5e69; font-variant-numeric: tabular-nums; font-weight: 550; }
.notice { padding: 17px 0; }
.notice svg { color: #a4844b; }
.notice b { color: #46636b; }
.notice p { color: #72878f; font-size: 12px; }
.toolbar .count { color: #6a828b; }
.empty { color: #708790; }
.empty svg { color: #8aa8b2; }
.task { background: linear-gradient(140deg, #ffffffe0, #ffffff85); border-color: #ffffffe6; border-radius: 8px; box-shadow: var(--shadow); }
.task p, .task-foot { color: #69808b; }
.task-foot { flex-wrap: wrap; gap: 10px; }
.settings-band { border-color: #91acb52e; padding: 30px 0; }
.settings-band > div, .settings-fields { min-width: 0; }
.form-row input[type=checkbox] { cursor: pointer; }
.audit time { color: #6c828a; }
.error { color: #ab4754; line-height: 1.6; }
footer { color: #7b9098; border-color: #809ba32b; }

dialog {
  color: #304e56;
  background: linear-gradient(135deg, #ffffffef, #f2f8f7ed);
  border-color: #fffffff2;
  border-radius: 8px;
  padding: 28px;
  box-shadow: 0 30px 100px #28495333, inset 0 1px 0 #fff;
  -webkit-backdrop-filter: blur(28px) saturate(140%);
  backdrop-filter: blur(28px) saturate(140%);
}
dialog::backdrop { background: #2e515c38; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.modal-head { border-bottom: 1px solid var(--border); padding-bottom: 18px; }
.source-text { background: #eaf1f2b0; border-color: #c3d4d966; color: #547079; border-radius: 6px; }
.source-label, .message-source, .message-meta span { color: #6a838d; }
.finding { border-color: #8cc2b7; }
.message-meta, .bundle-row { color: #47656e; }
.analysis-summary { color: #3f5c65; }
#toast { background: #284e4be8; border: 1px solid #ffffff4f; backdrop-filter: blur(16px); border-radius: 8px; box-shadow: 0 8px 32px #244a4b26; }

#login {
  background: transparent;
  padding: 40px 20px;
  min-height: 100svh;
}
.login-box {
  width: 420px;
  max-width: 100%;
  padding: 40px;
  background: linear-gradient(145deg, #ffffffe0, #ffffff70);
  border: 1px solid #fffffff2;
  border-radius: 8px;
  box-shadow: 0 24px 80px #597d891c, inset 0 1px 0 #fff, 0 0 0 1px #7b9ba211;
  -webkit-backdrop-filter: blur(28px) saturate(145%);
  backdrop-filter: blur(28px) saturate(145%);
}
.login-box .brand-mark { width: 44px; height: 44px; margin-bottom: 26px; font-size: 28px; }
.login-box h1 { font-size: 27px; }
.login-box .eyebrow { color: #637f85; margin-bottom: 8px; }
.login-box form { margin-top: 24px; }
.login-box input { min-height: 44px; }
.login-box form > button { min-height: 44px; margin-top: 22px; }
.login-box .error:empty { margin: 0; }
.login-box .error:not(:empty) { margin: 18px 0 0; }
.segmented { background: #dce8e85e; border-color: #bbced459; padding: 4px; border-radius: 8px; gap: 4px; }
.login-box .segmented button { min-height: 36px; box-shadow: none; color: #667f88; border-radius: 5px; }
.segmented button.active { color: #21695f; background: #ffffffeb; box-shadow: 0 2px 6px #4d7f7a14, inset 0 1px 0 #fff; }

@media (min-width: 1500px) {
  main { padding-top: 40px; }
  .stat { padding: 28px 30px; }
}
@media (max-width: 1100px) and (min-width: 701px) {
  .sidebar { width: 194px; padding: 26px 12px; }
  .main { margin-left: 194px; }
  .stat { padding: 20px 16px; }
  .stat-number { font-size: 28px; }
  .brand { font-size: 16px; gap: 9px; }
}
@media (max-width: 700px) {
  .sidebar { width: auto; position: relative; padding: 17px 16px 0; z-index: 1; border-right: 0; border-bottom-color: #ffffffe6; }
  .brand { font-size: 17px; }
  .brand-mark { width: 32px; height: 32px; font-size: 21px; }
  .sidebar nav { padding: 1px 0 8px; margin-top: 14px; scrollbar-width: none; }
  .sidebar nav::-webkit-scrollbar { display: none; }
  nav button { font-size: 12px; min-height: 38px; padding: 9px 12px; margin: 3px 0; gap: 7px; }
  .main { margin-left: 0; }
  header { height: 60px; background: #ffffff4f; }
  .breadcrumb { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .header-tools { gap: 6px; flex-shrink: 0; }
  .header-tools input { width: 130px; }
  #mobile-logout { top: 15px; right: 16px; z-index: 2; }
  main { padding: 24px 16px 20px; }
  h1 { font-size: 24px; }
  .page-heading { margin-bottom: 22px; }
  #page-actions { width: 100%; }
  .stats { margin-bottom: 24px; }
  .stat { padding: 19px 16px; }
  .stat:nth-child(-n+2) { border-bottom-color: #b4c9ce40; }
  .stat-top { font-size: 11px; }
  .stat-number { font-size: 28px; }
  .stat-sub { font-size: 11px; }
  .table-wrap { max-width: 100%; }
  td { padding: 16px; }
  .split { gap: 10px; }
  .settings-band { padding: 24px 0; }
  dialog { padding: 20px; max-height: 90svh; }
  .login-box { padding: 30px 26px; }
  .login-box h1 { font-size: 25px; }
  .form-actions { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  button, .button { transition: none; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .sidebar, header, .stats, .table-wrap, .login-box, dialog { background: #f7faf9; }
}
