@font-face {
  font-family:"Inter";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("fonts/inter-cyrillic-wght-normal.de93fdc85e3d.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
  font-family:"Inter";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("fonts/inter-latin-wght-normal.260c81a4759b.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  --ink:#172b38;
  --muted:#60727f;
  --line:#e4eaf0;
  --paper:#fff;
  --bg:#f5f7fa;
  --teal:#087f77;
  --teal-dark:#06675f;
  --soft:#edf7f5;
  --radius:16px;
}

* {
  box-sizing:border-box;
}

body {
  margin:0;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-size:15px;
  line-height:1.55;
}

a {
  color:var(--teal);
  text-decoration:none;
}

button,input,select,textarea {
  font:inherit;
}

button,a,input,select,textarea {
  outline-offset:4px;
}

button {
  cursor:pointer;
}

a:focus-visible,button:focus-visible,input:focus-visible {
  outline:3px solid #0ba99b;
}

.app-shell {
  display:flex;
  min-height:100vh;
}

.sidebar {
  position:fixed;
  inset:0 auto 0 0;
  width:250px;
  background:var(--paper);
  border-right:1px solid var(--line);
  padding:32px 22px;
  display:flex;
  flex-direction:column;
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--ink);
  font-size:25px;
  font-weight:750;
  letter-spacing:-1px;
}

.brand-mark {
  background:var(--teal);
  color:#fff;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  font-size:23px;
  box-shadow:0 4px 10px #087f7718;
}

.workspace-label {
  font-size:11px;
  color:var(--muted);
  margin-top:14px;
}

nav {
  margin-top:44px;
}

.nav-label {
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  color:#8b9aa4;
  display:block;
  margin:0 12px 16px;
}

nav a {
  display:flex;
  gap:12px;
  align-items:center;
  min-height:44px;
  padding:11px 10px;
  border-radius:9px;
  margin-bottom:5px;
  color:#536875;
  font-size:13px;
  font-weight:550;
  line-height:1.45;
  transition:color .15s,background .15s;
}

nav a:hover,nav a.active {
  color:var(--teal);
  background:var(--soft);
}

nav a.active {
  font-weight:600;
  box-shadow:inset 3px 0 0 var(--teal);
}

.sidebar-bottom {
  margin-top:auto;
  border-top:1px solid var(--line);
  padding-top:22px;
  font-size:12px;
  font-weight:600;
}

.sidebar-bottom p {
  font-size:11px;
  font-weight:400;
  color:var(--muted);
  margin:5px 0 0 14px;
}

.status-dot {
  display:inline-block;
  background:#21a18d;
  width:6px;
  height:6px;
  border-radius:50%;
  margin-right:5px;
}

.main-shell {
  margin-left:250px;
  flex:1;
  min-width:0;
}

.topbar {
  height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
  background:#ffffffd9;
  padding:0 44px;
  font-size:12px;
  color:var(--muted);
}

.divider {
  margin:0 12px;
  color:#b5c0c7;
}

.profile {
  display:flex;
  gap:12px;
  align-items:center;
  color:var(--ink);
  font-weight:600;
}

.profile small {
  display:block;
  font-size:10px;
  color:var(--muted);
  font-weight:400;
}

.avatar {
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  background:#e4f0ef;
  color:var(--teal);
  border-radius:50%;
}

.profile form {
  margin:0;
}

main {
  padding:38px 44px 52px;
  max-width:1480px;
  margin:auto;
  min-height:calc(100vh - 146px);
}

h1,h2,h3 {
  line-height:1.25;
  letter-spacing:-.02em;
}

h1 {
  font-size:32px;
  font-weight:600;
  margin:8px 0 12px;
}

h2 {
  font-size:22px;
  font-weight:600;
}

h3 {
  font-size:19px;
  font-weight:600;
}

.eyebrow {
  color:var(--teal);
  font-weight:700;
  font-size:10px;
  letter-spacing:1.6px;
}

.page-heading,.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.page-heading {
  margin-bottom:28px;
}

.lead {
  color:var(--muted);
  font-size:15px;
  margin:0;
}

.badge {
  display:inline-block;
  font-size:10px;
  font-weight:600;
  background:#eef2f5;
  color:#617583;
  padding:5px 10px;
  border-radius:6px;
  white-space:nowrap;
}

.badge.success {
  background:#e5f3ec;
  color:#3a8060;
}

.welcome-panel {
  padding:34px 38px;
  background:linear-gradient(110deg,#eaf4f2,#edf3f8);
  border:1px solid #dceae8;
  border-radius:var(--radius);
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:290px;
  overflow:hidden;
}

.welcome-panel h2 {
  font-size:31px;
  margin:14px 0;
}

.welcome-panel p {
  color:#607a7b;
  font-size:13px;
  margin-bottom:25px;
}

.button,button[type=submit] {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:8px;
  padding:11px 18px;
  border:1px solid var(--line);
  background:white;
  color:var(--ink);
  font-size:13px;
  font-weight:600;
  line-height:1.5;
  transition:background .15s,border-color .15s;
}

.button:hover {
  background:#f8fafb;
  border-color:#c9d8de;
}

.button.primary,button[type=submit] {
  background:var(--teal);
  color:white;
  border-color:var(--teal);
}

.button.primary:hover,button[type=submit]:hover {
  background:var(--teal-dark);
}

.button.subtle {
  background:transparent;
  color:var(--muted);
  border:none;
  padding:6px 8px;
}

.button.subtle:hover {
  background:#f0f5f5;
  color:var(--teal);
}

.illustration {
  width:260px;
  display:grid;
  place-items:center;
  transform:rotate(8deg);
  padding:15px;
}

.illustration-sheet {
  width:188px;
  height:216px;
  background:#fff;
  border:1px solid #d9e7e5;
  box-shadow:0 20px 50px #254d4b12;
  border-radius:12px;
  padding:26px;
  position:relative;
}

.sheet-label {
  font-size:8px;
  font-weight:700;
  letter-spacing:1px;
  color:#8a9d9b;
}

.fake-line {
  height:7px;
  width:60%;
  background:#edf2f1;
  border-radius:3px;
  margin-top:10px;
}

.fake-line.wide {
  width:90%;
  background:#d2e8e2;
}

.sheet-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
  margin-top:24px;
}

.sheet-grid i {
  height:16px;
  background:#f2f6f5;
  border-radius:3px;
}

.sheet-grid i:nth-child(3n) {
  background:#d5e9e4;
}

.check-circle {
  position:absolute;
  bottom:0;
  right:-19px;
  border:5px solid #edf3f4;
  background:var(--teal);
  width:54px;
  height:54px;
  border-radius:50%;
  color:#fff;
  display:grid;
  place-items:center;
}

.section-heading {
  margin:28px 0 10px;
}

.section-heading h2 {
  font-size:19px;
}

.muted {
  color:var(--muted);
  font-size:12px;
}

.module-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.module-card,.info-card,.card,.panel {
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:28px;
}

.module-card {
  color:var(--ink);
  display:block;
  transition:box-shadow .15s,border-color .15s;
}

.module-card:hover {
  border-color:#9cc6be;
  box-shadow:0 6px 24px #153f3b08;
}

.module-icon {
  display:inline-grid;
  place-items:center;
  background:var(--soft);
  width:43px;
  height:43px;
  border-radius:11px;
  color:var(--teal);
  margin-right:12px;
  vertical-align:middle;
}

.module-card p {
  color:var(--muted);
  font-size:13px;
  max-width:390px;
}

.card-action {
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:23px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--teal);
  font-size:12px;
  font-weight:600;
}

.info-card h3 {
  font-size:16px;
  margin:0 0 20px;
}

.steps {
  list-style:none;
  padding:0;
  counter-reset:steps;
  margin:0;
}

.steps li {
  counter-increment:steps;
  position:relative;
  padding-left:40px;
  margin-top:18px;
  font-size:12px;
}

.steps li:before {
  content:counter(steps);
  position:absolute;
  left:0;
  top:0;
  display:grid;
  place-items:center;
  background:#f1f5f6;
  border-radius:50%;
  width:26px;
  height:26px;
  color:#7a9399;
  font-weight:600;
}

.steps strong,.steps span {
  display:block;
}

.steps span {
  color:var(--muted);
  font-size:11px;
  margin-top:3px;
}

footer {
  border-top:1px solid var(--line);
  font-size:10px;
  color:#8b99a4;
  padding:18px 44px;
  display:flex;
  justify-content:space-between;
}

input:not([type=checkbox]),select,textarea {
  width:100%;
  max-width:600px;
  border:1px solid #ccd8df;
  background:#fff;
  border-radius:8px;
  padding:10px 12px;
  display:block;
  margin:6px 0;
}

input[type=file] {
  font-size:12px;
  padding:18px;
  border-style:dashed;
  background:#fafcfc;
}

label {
  font-size:13px;
  font-weight:600;
}

form p {
  margin:18px 0;
}

.helptext,form small {
  display:block;
  font-size:12px;
  color:var(--muted);
  max-width:650px;
}

.errorlist {
  color:#ad3434;
  font-size:12px;
  padding-left:18px;
}

.notice,.alert {
  padding:14px 18px;
  border-radius:9px;
  background:#edf5f4;
  border:1px solid #d7e7e3;
  margin-bottom:20px;
  font-size:13px;
}

.notice.error,.alert.error {
  background:#fff0ee;
  color:#9b3e32;
  border-color:#f4d7d2;
}

.notice.warning {
  background:#fff8e8;
  color:#8b6c23;
}

.auth-card {
  max-width:530px;
  margin:45px auto;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:32px;
}

.auth-card h1 {
  font-size:26px;
}

.auth-card svg:not(.icon) {
  max-width:220px;
  height:auto;
}

.actions {
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin:20px 0;
}

.table-wrap {
  overflow-x:auto;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}

table {
  border-collapse:collapse;
  width:100%;
  background:#fff;
  font-size:13px;
}

th,td {
  text-align:left;
  padding:14px 18px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}

th {
  font-size:10px;
  letter-spacing:.5px;
  color:var(--muted);
  background:#fafbfd;
}

td form {
  margin:0;
}

td button[type=submit] {
  font-size:11px;
  padding:5px 10px;
}

.empty-state {
  text-align:center;
  padding:44px 22px;
  border:1px dashed #cfdbdf;
  background:#ffffff88;
  border-radius:14px;
  color:var(--muted);
}

.empty-state h2 {
  color:var(--ink);
}

.error,.error-message {
  color:#a33b30;
}

.warn {
  color:#94732b;
}

code,pre {
  font-family:ui-monospace,monospace;
  font-size:12px;
  overflow-wrap:anywhere;
}

pre {
  white-space:pre-wrap;
  padding:16px;
  background:#eef4f3;
  border-radius:8px;
}

details {
  margin:18px 0;
}

summary {
  cursor:pointer;
  font-weight:600;
}

.stats {
  display:flex;
  gap:18px;
  margin:24px 0;
}

.stat {
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:20px;
  flex:1;
}

@media(min-width:1600px) {
  main {
    padding-top:55px;
  }
  .welcome-panel {
    min-height:330px;
  }
}

@media(max-width:1000px) {
  .sidebar {
    width:210px;
    padding:24px 16px;
  }
  .main-shell {
    margin-left:210px;
  }
  main {
    padding:28px;
  }
  .topbar {
    padding:0 28px;
  }
  .illustration {
    width:180px;
  }
  .welcome-panel {
    padding:26px;
  }
  .welcome-panel h2 {
    font-size:27px;
  }
  .module-grid {
    gap:14px;
  }
  .module-card,.info-card {
    padding:22px;
  }
}

@media(max-width:750px) {
  .app-shell {
    display:block;
  }
  .sidebar {
    position:static;
    width:100%;
    padding:15px 20px;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .brand {
    font-size:23px;
  }
  .brand-mark {
    width:32px;
    height:32px;
  }
  .workspace-label,.nav-label,.sidebar-bottom {
    display:none;
  }
  nav {
    display:flex;
    margin-top:12px;
    gap:4px;
    overflow:auto;
  }
  nav a {
    flex-shrink:0;
    font-size:12px;
    white-space:nowrap;
    min-height:40px;
    padding:9px 12px;
    gap:8px;
  }
  .main-shell {
    margin:0;
  }
  .topbar {
    height:64px;
    padding:0 20px;
  }
  .topbar>span {
    display:none;
  }
  .profile {
    margin-left:auto;
  }
  main {
    padding:26px 20px;
    min-height:60vh;
  }
  .module-grid {
    grid-template-columns:1fr;
  }
  .page-heading {
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .page-heading>.badge {
    display:none;
  }
  h1 {
    font-size:28px;
  }
  .welcome-panel {
    padding:25px;
  }
  .illustration {
    display:none;
  }
  .welcome-panel h2 {
    font-size:27px;
  }
  .desktop-only {
    display:none;
  }
  footer {
    padding:18px 20px;
  }
  footer span {
    display:none;
  }
  .auth-card {
    margin:15px 0;
    padding:24px;
  }
  .stats {
    flex-wrap:wrap;
  }
  th,td {
    padding:12px;
  }
  .table-wrap {
    margin:0 -5px;
  }
}

.card+.card {
  margin-top:22px;
}

.card form>ul {
  font-size:12px;
  color:var(--muted);
}

.card form label {
  display:block;
}

input[type=checkbox] {
  margin-right:9px;
  accent-color:var(--teal);
}

button:disabled {
  opacity:.6;
  cursor:wait;
}

.notifications:empty {
  display:none;
}

.module-grid .empty-state {
  background:#fff;
}

small.helptext {
  display:block;
}

nav {
  overflow-y:auto;
}

fieldset {
  border:1px solid var(--line);
  border-radius:10px;
  padding:18px;
  margin:20px 0;
}

legend {
  font-weight:600;
  font-size:13px;
}

.icon {
  display:inline-block;
  width:20px;
  height:20px;
  flex:0 0 auto;
  fill:none;
  stroke:currentColor;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
  vertical-align:middle;
}

.button .icon,button[type=submit] .icon {
  width:16px;
  height:16px;
}

.module-icon .icon,.check-circle .icon {
  width:24px;
  height:24px;
}

.stat > span, .stat > strong, .stat > small { display:block; }
.stat > span { color:var(--muted); font-size:12px; }
.stat > strong { margin:8px 0 4px; font-size:28px; line-height:1.2; letter-spacing:-.8px; }
.stat > small { color:var(--muted); font-size:11px; }
button.secondary { background:#fff; color:var(--teal); border-color:#bfd8d4; }
button.secondary:hover { background:var(--soft); }
@media(max-width:750px) { .stats { display:grid; grid-template-columns:1fr; } }

/* Native controls share the same spacing and visual weight as action buttons. */
input[type=file]::file-selector-button {
  margin-right:12px;
  padding:8px 12px;
  border:1px solid #c4d9d6;
  border-radius:6px;
  background:var(--soft);
  color:var(--teal-dark);
  font:inherit;
  cursor:pointer;
}
form p:has(> input[type=checkbox]) {
  display:flex;
  align-items:flex-start;
  gap:10px;
}
form p:has(> input[type=checkbox]) > input {
  order:-1;
  flex-shrink:0;
  margin:4px 0 0;
}
form p:has(> input[type=checkbox]) > label {
  display:inline;
}
@media(max-width:750px) {
  nav {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 8px;
    overflow:visible;
  }
  nav a {
    min-height:44px;
    margin:0;
    white-space:normal;
  }
  nav a span { overflow-wrap:normal; }
}

@media(max-width:750px) { input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea { font-size:16px; } }