:root {
  color-scheme: light;
  font-family: Inter, Onest, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #17242a;
  background: #edf2f1;
  --muted: #526665;
  --line: #dce5e2;
  --surface: #fff;
  --accent: #166353;
  --accent-dark: #10483f;
  --rail: #132c2b;
  --radius: 15px;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover { color: var(--accent-dark); }
button, input, select { font: inherit; }
button, a, input, select { touch-action: manipulation; }
:focus-visible { outline: 3px solid #369b83; outline-offset: 3px; }
[hidden] { display: none !important; }
h1, h2, p { margin: 0; }
h1 { font-size: clamp(1.85rem, 3vw, 2.8rem); font-weight: 690; letter-spacing: -.045em; line-height: 1.1; overflow-wrap: anywhere; }
h2 { font-size: 1.15rem; letter-spacing: -.02em; line-height: 1.3; }
.standby { margin: 3rem; }
.shell { min-height: 100vh; display: grid; grid-template-columns: 238px minmax(0, 1fr); }
.sidebar { background: var(--rail); color: #f3fffb; padding: 29px 18px; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 1.06rem; font-weight: 750; line-height: 1.2; white-space: nowrap; }
.brand small { display: block; font-size: .71rem; color: #8bc0b0; margin-top: 5px; font-weight: 550; letter-spacing: .03em; }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; background: #a0e4ca; color: #124436; border-radius: 11px; font-size: 1.12rem; }
.sidebar .brand { padding: 0 6px; margin-bottom: 38px; }
nav { display: grid; gap: 5px; }
.nav-label { color: #9cbbb4; font-size: .71rem; font-weight: 650; text-transform: uppercase; letter-spacing: .08em; margin: 20px 10px 6px; }
.nav-link { display: flex; align-items: center; padding: 11px 12px; gap: 10px; border-radius: 9px; text-decoration: none; color: #e1f1ed; font-size: .9rem; }
.nav-link > span { color: #a0e4ca; text-align: center; width: 16px; }
.nav-link:hover, .nav-link.current { color: #fff; background: #28504a; }
.nav-link.current { box-shadow: inset 3px 0 #98e8ca; font-weight: 650; }
.workspace { min-width: 0; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 13px clamp(16px, 4vw, 48px); background: #f9fbfa; border-bottom: 1px solid var(--line); }
.context, .identity { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: .85rem; overflow-wrap: anywhere; }
.identity { justify-content: end; }
#content { width: min(1440px, 100%); margin-inline: auto; padding: 34px clamp(16px, 4vw, 48px) 52px; display: grid; gap: 20px; }
.heading { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin: 8px 0 3px; }
.heading .hint { margin-top: 8px; font-size: .95rem; }
.kicker { color: var(--accent); font-size: .72rem; font-weight: 750; letter-spacing: .095em; text-transform: uppercase; margin-bottom: 8px; }
.panel { display: grid; gap: 16px; align-content: start; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(15px, 2.5vw, 25px); min-width: 0; }
.grid { display: grid; gap: 16px; }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.metric-label { color: var(--muted); font-size: .87rem; font-weight: 620; }
.metric-value { display: block; font-size: clamp(1.28rem, 2.7vw, 2.17rem); letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.hint { color: var(--muted); font-size: .85rem; line-height: 1.5; overflow-wrap: anywhere; }
.chip { width: fit-content; display: inline-block; padding: 4px 8px; color: #3e5655; background: #eaf1ef; border-radius: 7px; font-size: .75rem; font-weight: 650; line-height: 1.25; overflow-wrap: anywhere; }
.chip.positive { color: #145c42; background: #e0f4e9; }
.chip.amber { color: #825012; background: #fff1d5; }
.pills { display: flex; flex-wrap: wrap; gap: 7px; }
.button { display: inline-flex; min-height: 37px; align-items: center; justify-content: center; padding: 7px 11px; background: #f9fbfa; border: 1px solid #cddbd7; border-radius: 9px; color: #25403e; text-decoration: none; cursor: pointer; font-size: .84rem; font-weight: 650; white-space: nowrap; }
.button:hover { background: #eaf4ef; }
.button.primary { background: var(--accent); color: #fff; border-color: transparent; }
.button.primary:hover { background: var(--accent-dark); }
.button.danger { background: #a13129; color: #fff; border-color: transparent; }
.button.danger:hover { background: #7e1e19; }
.button:disabled { cursor: not-allowed; opacity: .49; }
.quick { color: var(--accent); text-decoration: none; border: 1px solid var(--line); padding: 14px; border-radius: 10px; font-size: .9rem; font-weight: 680; }
.quick:hover { background: #eef8f4; }
.text-link, .project-link, .person { width: fit-content; font-weight: 650; }
.project-link { display: inline-block; }
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: .86rem; text-align: left; }
th { font-size: .72rem; color: #526665; background: #f2f7f5; white-space: nowrap; }
th, td { padding: 11px 10px; vertical-align: middle; }
td { border-bottom: 1px solid #e7efed; line-height: 1.45; }
tr:last-child td { border-bottom: 0; }
td .hint { margin-top: 3px; font-size: .77rem; }
td > .chip + .chip { margin-left: 4px; }
.field { display: grid; gap: 6px; font-size: .85rem; font-weight: 630; min-width: 0; }
.field small { color: var(--muted); font-weight: 400; }
input:not([type=checkbox]), select { min-width: 0; width: 100%; min-height: 40px; background: #fff; color: #17242a; border: 1px solid #c9d8d4; border-radius: 9px; padding: 8px 10px; }
input[type=checkbox] { accent-color: var(--accent); width: 16px; height: 16px; margin: 0; }
.check { display: flex; align-items: center; gap: 8px; font-size: .9rem; }
.filters { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; }
.filters .field:first-child { flex: 1 1 170px; }
.pager, .actions, .inline-actions { display: flex; align-items: center; justify-content: end; gap: 8px; flex-wrap: wrap; }
.inline-actions { justify-content: start; }
.pager { margin-top: 12px; }
.pager .hint { margin-right: auto; }
.edit-form, .edit-form > fieldset { display: grid; gap: 16px; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
fieldset.agents { display: flex; flex-wrap: wrap; gap: 12px; border: 1px solid var(--line); padding: 14px; border-radius: 9px; }
legend { padding-inline: 6px; color: var(--muted); font-size: .85rem; }
.warning, .form-error { border-radius: 9px; padding: 10px 12px; font-size: .88rem; line-height: 1.4; }
.warning { color: #764a17; background: #fff4dd; }
.form-error { color: #812c26; background: #fcebe8; }
.facts { display: grid; gap: 0; margin: 0; font-size: .9rem; }
.facts > div { display: grid; gap: 9px; grid-template-columns: minmax(110px, 26%) minmax(0, 1fr); padding: 10px 0; border-bottom: 1px solid var(--line); }
.facts > div:last-child { border-bottom: 0; }
.facts dt { color: var(--muted); }
.facts dd { margin: 0; font-weight: 560; overflow-wrap: anywhere; }
dialog { width: min(510px, calc(100vw - 28px)); max-height: calc(100dvh - 28px); overflow: auto; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); color: #17242a; }
dialog[open] { display: grid; gap: 14px; }
dialog::backdrop { background: #102b2bb3; }
.login { min-height: 100vh; display: grid; place-items: center; padding: 20px; background: radial-gradient(ellipse at 75% 20%, #d3ebe0, #edf2f1 60%); }
.login .panel { width: min(100%, 440px); padding: clamp(22px, 5vw, 37px); box-shadow: 0 12px 50px #183a2912; }
.login .brand small { color: var(--muted); }
.login h1 { font-size: 1.86rem; margin-top: 7px; }
.login form { display: grid; gap: 14px; }
#notice { display: none; position: fixed; z-index: 4; right: 18px; bottom: 18px; max-width: calc(100vw - 36px); padding: 12px 15px; border-radius: 10px; background: var(--rail); color: white; font-size: .88rem; }
#notice.shown { display: block; }
@media (max-width: 900px) {
  .shell { grid-template-columns: 195px minmax(0, 1fr); }
  .sidebar { padding-inline: 12px; }
}
@media (max-width: 720px) {
  .shell { display: block; }
  .sidebar { padding: 13px 13px 9px; }
  .sidebar .brand { margin-bottom: 10px; }
  .brand-mark { width: 31px; height: 31px; }
  nav { display: flex; flex-wrap: wrap; gap: 4px; }
  .nav-label { display: none; }
  .nav-link { padding: 8px 6px; gap: 5px; font-size: .78rem; }
  .nav-link.current { box-shadow: inset 0 -2px #98e8ca; }
  #content { padding-top: 19px; gap: 13px; }
  .heading { flex-wrap: wrap; }
  .grid.three { grid-template-columns: 1fr; gap: 9px; }
  .grid.two { grid-template-columns: 1fr; gap: 9px; }
  .grid > .panel { gap: 5px; }
  .table-wrap, table, tbody, tr, td { display: block; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  tbody { display: grid; gap: 12px; }
  tr { border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; }
  td { display: grid; grid-template-columns: minmax(80px, 34%) minmax(0, 1fr); gap: 8px; padding: 6px 0; border: 0; overflow-wrap: anywhere; }
  td::before { content: attr(data-label); font-size: .72rem; color: var(--muted); }
}
