/* PODSOBKA visual layer. No application state, status palette or plan geometry. */
:root {
  --brand-navy: #222864;
  --brand-cyan: #47b7e3;
  --brand-ink: #222864;
  --brand-muted: #69788f;
  --brand-line: #e0e7f0;
  --brand-tint: #edf5fc;
  --brand-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-family: var(--brand-font);
  -webkit-font-smoothing: antialiased;
}
body { font-family: var(--brand-font); }
.workspace-app {
  --ink: var(--brand-ink);
  --muted: var(--brand-muted);
  --green: #303b85;
  --lime: #e0f3fc;
  --line: var(--brand-line);
  --bg: #f1f5fa;
  background: var(--bg);
  color: var(--ink);
}
.workspace-app .app { grid-template-columns: 240px minmax(0, 1fr); }
.workspace-app .sidebar {
  width: 240px;
  padding: 28px 14px 18px;
  background: linear-gradient(165deg, #222864 0%, #23375e 100%);
  border-right: 1px solid #ffffff0d;
  color: #d6e4f5;
}
.workspace-app .brand {
  margin: 2px 14px 32px;
  padding: 0;
  min-height: 34px;
}
.workspace-app .brand img {
  width: 168px;
  height: auto;
  max-width: 100%;
  background: transparent;
  border-radius: 0;
  padding: 0;
  display: block;
}
.workspace-app .nav-caption,
.workspace-app .nav-group > span {
  color: #a6bbd7;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 1.3px;
  padding-left: 14px;
}
.workspace-app .sidebar nav { scrollbar-width: thin; scrollbar-color: #7389b0 transparent; }
.workspace-app .nav-group { margin-bottom: 19px; }
.workspace-app .nav-group > span { padding-block: 7px; }
.workspace-app .sidebar nav button {
  width: 100%;
  min-height: 40px;
  margin: 3px 0;
  padding: 9px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #d5e1f3;
  background: transparent;
  font-size: 13px;
  font-weight: 400;
  gap: 11px;
  transition: background .15s, color .15s, border-color .15s;
}
.workspace-app .sidebar .nav-icon {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  display: inline-grid;
  place-items: center;
  border-radius: 7px;
  background: #ffffff0a;
  color: #9dc9e7;
  font-size: 17px;
  line-height: 1;
}
.workspace-app .sidebar nav button.active {
  color: #fff;
  background: #47b7e324;
  border-color: #7acbeb3d;
  box-shadow: inset 3px 0 #47b7e3;
  font-weight: 600;
}
.workspace-app .sidebar nav button.active .nav-icon {
  color: #fff;
  background: #2999c2;
}
.workspace-app .sidebar nav button:hover:not(.active) {
  background: #ffffff0c;
  color: #fff;
  border-color: #ffffff10;
}
.workspace-app .sidebar-footer {
  border-top-color: #ffffff1c;
  padding: 18px 12px 0;
  color: #b0c3dd;
}
.workspace-app .sidebar-footer strong { color: #fff; font-weight: 500; }
.workspace-app .sidebar-footer button,
.workspace-app .sidebar-footer button:hover,
.workspace-app .sidebar-footer button[data-action="logout"]:hover {
  background: transparent;
  color: #c8ddf3;
  border-color: transparent;
  box-shadow: none;
}
.workspace-app .topbar {
  height: 76px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  padding-inline: 34px;
}
.workspace-app .breadcrumb { color: #7b88a0; font-size: 12px; }
.workspace-app .breadcrumb strong { color: var(--ink); font-weight: 500; }
.workspace-app .breadcrumb select {
  border: 1px solid #e4eaf4;
  background: #f6f9fd;
  border-radius: 9px;
  color: var(--ink);
  padding-block: 9px;
}
.workspace-app .top-actions { gap: 14px; }
.workspace-app .top-actions > a { color: #394b8c; font-size: 12px; }
.workspace-app .avatar {
  width: 36px;
  height: 36px;
  border: 1px solid #d6e8f9;
  background: #edf6fe;
  color: #356b9f;
  font-weight: 600;
}
.workspace-app .content { padding: 32px 34px 50px; }
.workspace-app h1 { font-size: 29px; letter-spacing: -.85px; font-weight: 600; }
.workspace-app h2 { letter-spacing: -.45px; font-weight: 600; }
.workspace-app h3 { font-weight: 600; }
.workspace-app .eyebrow { color: #6b81a2; font-size: 10px; letter-spacing: 1.6px; }
.workspace-app .subtitle { color: var(--muted); font-size: 13px; line-height: 1.6; }
.workspace-app .title-row { margin-bottom: 25px; }
.workspace-app .panel,
.workspace-app .workspace,
.workspace-app .building-card,
.workspace-app .stat,
.workspace-app .plan-tile {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 3px 14px #253d6504;
}
.workspace-app .panel { padding: 25px; }
.workspace-app .stat { padding: 23px 24px; }
.workspace-app .stat .number {
  font-size: 32px;
  font-weight: 500;
  color: #263655;
  letter-spacing: -1px;
  margin-top: 13px;
}
.workspace-app .stat .label { color: #687c93; font-size: 12px; }
.workspace-app .stat .dot { top: 28px; }
.workspace-app button { border-radius: 9px; font-weight: 500; }
.workspace-app button:where(:not(.apt):not(.crm-cell):not(.property-cell)):hover { background: #f2f7fd; border-color: #b8d3ec; }
.workspace-app .primary,
.workspace-app .cabinet-link,
.workspace-app .demo-link-button.primary {
  color: #fff;
  background: #303b85;
  border-color: #303b85;
  box-shadow: 0 3px 8px #22286412;
}
.workspace-app .primary:hover,
.workspace-app .cabinet-link:hover,
.workspace-app .demo-link-button.primary:hover {
  color: #fff;
  background: #26316f;
  border-color: #26316f;
}
.workspace-app button:focus-visible,
.workspace-app a:focus-visible { outline-color: #47b7e3; outline-offset: 3px; }
.workspace-app input,
.workspace-app select,
.workspace-app textarea { border-color: #dce4ef; border-radius: 9px; color: #283654; }
.workspace-app input:focus,
.workspace-app select:focus,
.workspace-app textarea:focus { border-color: #47a9d0; box-shadow: 0 0 0 3px #47b7e31c; }
.workspace-app input[type="checkbox"] { accent-color: #303b85; }
.workspace-app label.field { color: #66758e; }
.workspace-app .notice { color: #415d82; background: #edf5fc; border-color: #d9e8f6; border-radius: 10px; }
.workspace-app .credentials { color: #2c466f; background: #edf5fc; }
.workspace-app .help,
.workspace-app .panel p { color: var(--muted); }
.workspace-app th { background: #f6f8fc; color: #71809b; font-size: 11px; font-weight: 500; }
.workspace-app td { color: #364561; border-color: #eef2f7; }
.workspace-app tbody tr:hover { background: #f6faff; }
.workspace-app .table-floor th { background: #eef3fa; color: #394e78; }
.workspace-app .editable-cell { color: #345d9e; text-underline-offset: 4px; }
.workspace-app .editable-cell:hover { color: #222864; background: #e7f3fc; }
.workspace-app .segmented { padding: 4px; border-radius: 10px; background: #eef3f9; }
.workspace-app .segmented button { border-radius: 7px; }
.workspace-app .segmented button.active { color: #253777; background: #fff; box-shadow: 0 2px 6px #26355a14; }
.workspace-app .filters { background: #fdfefe; }
.workspace-app .workspace-toolbar { padding-block: 18px; }
.workspace-app .legend { color: #6a7a90; }
.workspace-app .apt { border-radius: 7px; }
.workspace-app .apt:hover { box-shadow: 0 3px 8px #22286416; border-color: #75b8d2; }
.workspace-app .apt.selected { outline-color: #36a3cc; }
.workspace-app .grid-bottom { background: #fbfcfe; color: #7d8ba0; }
.workspace-app .building-num { color: #90b5d5; }
.workspace-app .building-card h2 { color: #263760; }
.workspace-app .plan-tile img { background: #f8fafd; }
.workspace-app .plan-stage,
.workspace-app .layout-preview { background: #f8fafd; }
.workspace-app .floor-picker button.active { color: #fff; background: #303b85; }
.workspace-app .reference-menu button.active { background: #eaf3fc; color: #2a477f; border-color: #d6e7f7; }
.workspace-app .permission-list { color: #5b708f; }
.workspace-app .link-row code,
.workspace-app pre { background: #f2f6fb; color: #3b5277; }
.workspace-app .pill { border-color: #dfe7f2; }
.workspace-app .source-note { color: #7e8ba1; }
.workspace-app .demo-badge,
.workspace-app .demo-task-number {
  color: #347497;
  background: #e6f6fc;
  border-color: #bfe4f4;
}
.workspace-app .demo-welcome h1 { color: #222864; }
.workspace-app .demo-welcome p,
.workspace-app .demo-task p,
.workspace-app .demo-more p,
.workspace-app .demo-extra p,
.workspace-app .demo-stats { color: #687a92; }
.workspace-app .demo-stats strong { color: #2e5b93; }
.workspace-app .demo-task { padding: 28px !important; }
.workspace-app .demo-section-help { background: #edf5fc; border-color: #d2e4f5; }
.workspace-app .demo-section-help summary:hover,
.workspace-app .demo-guide summary:hover { color: #277fa8; }
.workspace-app .demo-section-help p,
.workspace-app .demo-guide-intro,
.workspace-app .demo-guide details > div { color: #536b88; }
.workspace-app .demo-guide details { border-color: #dde6f1; }
.workspace-app .demo-guide details[open] { background: #f6faff; border-color: #bcd9ef; }
.workspace-app .demo-guide strong { color: #263b70; }
.workspace-app .demo-guide-note { background: #edf5fc; border-left-color: #47b7e3; }
.workspace-app .demo-guide a { color: #345d9e; }
.workspace-app .demo-crm-path li { background: #f3f8fd; border-color: #dce8f5; }
.workspace-app .demo-crm-path span,
.workspace-app .demo-crm-fields dt { color: #687a92; }
.workspace-app.demo-cabinet .demo-help-nav { border-top-color: #ffffff20; }
.workspace-app dialog {
  color: #28385d;
  background: #fff;
  border: 1px solid #e1e9f3;
  border-radius: 18px;
  box-shadow: 0 24px 90px #22286430;
}
.workspace-app dialog::backdrop { background: #15234e65; backdrop-filter: blur(4px); }
.workspace-app .dialog-head { border-color: #e6ecf4; }
.workspace-app .dialog-head .close { border-radius: 50%; background: #f0f5fb; color: #4b648b; }
.workspace-app #toast { background: #27356e; border: 1px solid #ffffff20; box-shadow: 0 8px 30px #22286426; }
/* Sign-in uses the same palette and wordmark, with the original form intact. */
.login-page { color: #222864; background: #f9fbff; font-family: var(--brand-font); }
.login-art {
  position: relative;
  overflow: hidden;
  background: radial-gradient(ellipse at 15% 100%, #7398c6 0, #465d98 36%, #222864 85%);
  color: #fff;
  padding: clamp(35px, 4vw, 76px);
}
.login-art .brand { background: #fff; border-radius: 12px; padding: 15px 20px; width: max-content; }
.login-art .brand img { width: 174px; height: auto; display: block; }
.login-art h1 { font-weight: 500; letter-spacing: -1.6px; color: #fff; }
.login-art p { color: #e0e9fb; }
.login-art > small { color: #d2def1; font-size: 12px; }
.login-art .abstract-building { gap: 8px; opacity: .9; }
.login-art .abstract-building i { background: #a7c4e433; border: 1px solid #bad8f429; border-radius: 5px; }
.login-art .abstract-building i:nth-child(7n) { background: #47b7e3b3; border-color: #84dbf5; }
.login-art .abstract-building i:nth-child(9n) { background: #e3f1fb99; }
.login-form { background: #f9fbff; }
.login-box { width: min(390px, 100%); }
.login-box h1 { font-weight: 500; color: #222864; }
.login-box .eyebrow { color: #4b8caf; }
.login-box label.field { color: #5f708f; }
.login-box .muted,
.login-box .help { color: #74829b; }
.login-box input { height: 48px; border-radius: 10px; border-color: #dce4f0; color: #26385d; background: #fff; }
.login-box input:focus { border-color: #47b7e3; box-shadow: 0 0 0 3px #47b7e31c; }
.login-box .primary { min-height: 48px; border-radius: 10px; background: #303b85; border-color: #303b85; }
.login-box .primary:hover { background: #26316f; color: #fff; }
.login-box .primary:focus-visible { outline-color: #47b7e3; }
/* Public catalog / amoCRM keep their existing geometry and status colors. */
body.public-catalog,
body.crm-catalog { font-family: var(--brand-font); }
@media (min-width: 1500px) {
  .workspace-app .content { padding: 38px 42px 55px; }
  .workspace-app .topbar { padding-inline: 42px; }
}
@media (min-width: 721px) and (max-height: 900px) {
  .workspace-app .sidebar { padding-top: 20px; }
  .workspace-app .brand { margin-bottom: 20px; }
  .workspace-app .nav-group { margin-bottom: 10px; }
  .workspace-app .nav-group > span { padding-block: 4px; }
  .workspace-app .sidebar nav button { min-height: 35px; padding-block: 5px; margin-block: 2px; }
  .workspace-app .sidebar-footer { padding-top: 12px; }
}
@media (min-width: 721px) and (max-width: 1100px) {
  .workspace-app .app { grid-template-columns: 208px minmax(0, 1fr); }
  .workspace-app .sidebar { width: 208px; padding-inline: 10px; }
  .workspace-app .brand { margin-inline: 12px; }
  .workspace-app .brand img { width: 155px; }
  .workspace-app .content { padding: 26px 22px 40px; }
  .workspace-app .topbar { padding-inline: 22px; }
  .workspace-app .sidebar nav button { padding-inline: 9px; font-size: 12px; gap: 8px; }
}
@media (max-width: 720px) {
  .workspace-app .app { display: block; }
  .workspace-app .sidebar { position: relative; width: 100%; padding: 15px 14px 8px; border: 0; }
  .workspace-app .sidebar .brand { display: flex; margin: 0 5px 10px; min-height: 30px; }
  .workspace-app .brand img { width: 139px; }
  .workspace-app .sidebar nav,
  .workspace-app.demo-cabinet .sidebar nav { display: flex; overflow-x: auto; gap: 6px; padding: 0 0 6px; }
  .workspace-app .nav-group { display: contents; }
  .workspace-app .sidebar nav button { width: auto; min-height: 38px; flex: 0 0 auto; padding: 6px 10px; margin: 0; font-size: 12px; }
  .workspace-app .sidebar .nav-icon { width: 22px; height: 22px; flex-basis: 22px; font-size: 15px; }
  .workspace-app .sidebar-footer { display: none; }
  .workspace-app .topbar { padding-inline: 15px; height: auto; min-height: 60px; gap: 10px; flex-wrap: wrap; padding-block: 11px; }
  .workspace-app .breadcrumb { gap: 7px; font-size: 11px; min-width: 0; }
  .workspace-app .breadcrumb select { max-width: 148px; }
  .workspace-app .top-actions { gap: 10px; margin-left: auto; }
  .workspace-app .top-actions > a { font-size: 10px; }
  .workspace-app .content { padding: 24px 14px 38px; }
  .workspace-app h1 { font-size: 26px; }
  .workspace-app .stat { padding: 17px 16px; }
  .workspace-app .stat .number { font-size: 27px; }
  .workspace-app .panel { padding: 19px; border-radius: 13px; }
  .workspace-app .demo-task { padding: 23px !important; }
  .workspace-app.demo-cabinet .demo-help-nav { border-top: 1px solid transparent; padding-top: 6px; margin-top: 0; border-radius: 10px; }
  .workspace-app .demo-badge { margin-left: 7px; padding: 5px 7px; font-size: 9px; }
  .login-form { min-height: 100dvh; padding: 100px 25px 35px; position: relative; }
  .login-form::before {
    content: "";
    position: absolute;
    left: 25px;
    top: 30px;
    width: 150px;
    height: 33px;
    background: url('/static/brand/logo.svg') center / contain no-repeat;
  }
}
@media (prefers-reduced-motion: reduce) {
  .workspace-app button { transition: none; }
}