:root,
html,
html.light,
body {
  color-scheme: dark !important;
  --t-color-blue: #d7a84f !important;
  --t-color-blue1: #241b12 !important;
  --t-color-blue2: #352714 !important;
  --t-color-blue3: #4b3619 !important;
  --t-color-blue4: #6c4d22 !important;
  --t-color-blue5: #9a6d2d !important;
  --t-color-blue6: #c98f39 !important;
  --t-color-blue7: #e1b261 !important;
  --t-color-blue8: #f0cf86 !important;
  --t-color-blue9: #ffe6aa !important;
  --t-accent-primary: #d7a84f !important;
  --t-accent-secondary: rgba(215, 168, 79, 0.16) !important;
  --t-accent-tertiary: rgba(215, 168, 79, 0.10) !important;
  --t-accent-quaternary: rgba(215, 168, 79, 0.06) !important;
  --t-background-primary: #111214 !important;
  --t-background-secondary: #18191c !important;
  --t-background-tertiary: #202125 !important;
  --t-background-quaternary: #282a2f !important;
  --t-background-transparent-light: rgba(215, 168, 79, 0.07) !important;
  --t-background-transparent-lighter: rgba(215, 168, 79, 0.11) !important;
  --t-background-transparent-secondary: rgba(24, 25, 28, 0.84) !important;
  --t-border-color-light: rgba(255, 255, 255, 0.08) !important;
  --t-border-color-medium: rgba(215, 168, 79, 0.22) !important;
  --t-border-color-strong: rgba(215, 168, 79, 0.38) !important;
  --t-font-color-primary: #f7f2e8 !important;
  --t-font-color-secondary: #cfc8bb !important;
  --t-font-color-tertiary: #9e9688 !important;
  --t-font-color-light: #746f66 !important;
  --t-border-radius-xs: 5px !important;
  --t-border-radius-sm: 6px !important;
  --t-border-radius-md: 8px !important;
  --t-border-radius-lg: 10px !important;
  --t-border-radius-xl: 12px !important;
  --t-box-shadow-light: 0 10px 28px rgba(0, 0, 0, 0.28) !important;
  --t-box-shadow-strong: 0 20px 46px rgba(0, 0, 0, 0.44) !important;
  --record-board-column-width: 286px;
}

html,
body,
#root {
  background:
    linear-gradient(180deg, rgba(215, 168, 79, 0.08) 0%, rgba(215, 168, 79, 0.02) 26%, transparent 48%),
    linear-gradient(135deg, #0c0d0f 0%, #131417 44%, #1a1712 100%) !important;
  color: #f7f2e8 !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(215, 168, 79, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(215, 168, 79, 0.040) 1px, transparent 1px);
  background-size: 30px 30px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.58), transparent 72%);
  z-index: 0;
}

#root {
  position: relative;
  z-index: 1;
}

* {
  scrollbar-color: rgba(215, 168, 79, 0.46) rgba(255, 255, 255, 0.06) !important;
}

button,
a,
input,
textarea,
[role="button"],
[role="menuitem"],
[role="tab"],
[role="option"] {
  letter-spacing: 0 !important;
}

button,
[role="button"] {
  border-radius: 8px !important;
}

button[type="submit"],
button[aria-label*="Create"],
button[aria-label*="Создать"],
a[href*="/objects/"] button,
[data-testid*="button"]:not([aria-label*="close" i]) {
  box-shadow: 0 8px 18px rgba(215, 168, 79, 0.16) !important;
}

button[type="submit"],
button[aria-label*="Create"],
button[aria-label*="Создать"] {
  background: linear-gradient(180deg, #e4ba68 0%, #b9822f 100%) !important;
  border-color: rgba(255, 230, 170, 0.46) !important;
  color: #101114 !important;
  font-weight: 600 !important;
}

button[type="submit"]:hover,
button[aria-label*="Create"]:hover,
button[aria-label*="Создать"]:hover {
  background: linear-gradient(180deg, #f0cf86 0%, #c98f39 100%) !important;
}

a,
[class*="Record"] a,
[class*="Card"] a,
[class*="Row"] a {
  color: #f0cf86 !important;
}

aside,
nav,
[class*="Sidebar"],
[class*="Navigation"],
[class*="Menu"] {
  background: rgba(12, 13, 15, 0.88) !important;
  border-color: rgba(215, 168, 79, 0.16) !important;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.04) !important;
}

header,
[class*="Header"],
[class*="TopBar"],
[class*="CommandMenu"] {
  background: rgba(17, 18, 20, 0.84) !important;
  border-color: rgba(215, 168, 79, 0.16) !important;
  backdrop-filter: blur(16px);
}

[class*="RecordBoard"],
[class*="Board"],
[class*="Kanban"] {
  background: transparent !important;
}

[style*="--record-board-column-width"],
[class*="Column"] {
  background: rgba(255, 255, 255, 0.035) !important;
  border-color: rgba(215, 168, 79, 0.14) !important;
}

[class*="Record"],
[class*="Card"] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.026)),
    #17181b !important;
  border-color: rgba(215, 168, 79, 0.18) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24) !important;
}

[class*="Record"]:hover,
[class*="Card"]:hover {
  border-color: rgba(215, 168, 79, 0.36) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.34) !important;
}

[class*="Row"],
[class*="Modal"],
[class*="Dropdown"],
[class*="Popover"],
[class*="Panel"] {
  background-color: #17181b !important;
  border-color: rgba(215, 168, 79, 0.16) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.34) !important;
}

input,
textarea,
[contenteditable="true"] {
  background-color: rgba(12, 13, 15, 0.78) !important;
  border-color: rgba(215, 168, 79, 0.24) !important;
  color: #f7f2e8 !important;
}

input::placeholder,
textarea::placeholder {
  color: #746f66 !important;
}

input:focus,
textarea:focus,
[contenteditable="true"]:focus {
  border-color: #d7a84f !important;
  box-shadow: 0 0 0 3px rgba(215, 168, 79, 0.16) !important;
  outline: none !important;
}

[role="tab"][aria-selected="true"],
[aria-current="page"],
[data-active="true"] {
  background: rgba(215, 168, 79, 0.14) !important;
  color: #ffe6aa !important;
}

[class*="Badge"],
[class*="Tag"],
[class*="Chip"],
[class*="Status"] {
  border-color: rgba(215, 168, 79, 0.22) !important;
}

svg {
  stroke-width: 1.8;
}

@media (max-width: 768px) {
  :root,
  html.light {
    --record-board-column-width: 248px;
  }
}