/*
 * Минимальный статический набор utility-классов для дерева навыков.
 * Он заменил runtime-CSS из внешнего CDN, поэтому VK WebView и мобильный
 * Яндекс.Браузер не ждали сторонний JavaScript перед первым экраном.
 */

*, *::before, *::after { box-sizing: border-box; }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; }
body { margin: 0; }
button, input { font: inherit; }
button { cursor: pointer; }
img, svg { vertical-align: middle; }

[class~="absolute"] { position: absolute; }
[class~="relative"] { position: relative; }
[class~="fixed"] { position: fixed; }
[class~="sticky"] { position: sticky; }
[class~="inset-0"] { inset: 0; }
[class~="inset-x-0"] { left: 0; right: 0; }
[class~="inset-x-2"] { left: .5rem; right: .5rem; }
[class~="top-0"] { top: 0; }
[class~="top-2"] { top: .5rem; }
[class~="top-4"] { top: 1rem; }
[class~="top-[60px]"] { top: 60px; }
[class~="bottom-0"] { bottom: 0; }
[class~="left-4"] { left: 1rem; }
[class~="right-3"] { right: .75rem; }
[class~="right-4"] { right: 1rem; }

[class~="block"] { display: block; }
[class~="flex"] { display: flex; }
[class~="grid"] { display: grid; }
[class~="hidden"] { display: none; }
#sync-modal.hidden { display: none !important; }
#mobile-nav-drawer.hidden { display: none !important; }
[class~="flex-col"] { flex-direction: column; }
[class~="items-center"] { align-items: center; }
[class~="items-start"] { align-items: flex-start; }
[class~="justify-between"] { justify-content: space-between; }
[class~="justify-center"] { justify-content: center; }
[class~="justify-end"] { justify-content: flex-end; }
[class~="flex-1"] { flex: 1 1 0%; }
[class~="flex-shrink"] { flex-shrink: 1; }
[class~="flex-shrink-0"] { flex-shrink: 0; }
[class~="min-w-0"] { min-width: 0; }
[class~="min-h-screen"] { min-height: 100vh; }
[class~="min-h-[48px]"] { min-height: 48px; }
[class~="min-h-[56px]"] { min-height: 56px; }
[class~="w-full"] { width: 100%; }
[class~="w-1.5"] { width: .375rem; }
[class~="w-2"] { width: .5rem; }
[class~="w-2.5"] { width: .625rem; }
[class~="w-4"] { width: 1rem; }
[class~="w-5"] { width: 1.25rem; }
[class~="w-7"] { width: 1.75rem; }
[class~="w-8"] { width: 2rem; }
[class~="w-9"] { width: 2.25rem; }
[class~="w-10"] { width: 2.5rem; }
[class~="w-12"] { width: 3rem; }
[class~="w-64"] { width: 16rem; }
[class~="max-w-full"] { max-width: 100%; }
[class~="max-w-lg"] { max-width: 32rem; }
[class~="max-w-[115px]"] { max-width: 115px; }
[class~="max-w-[520px]"] { max-width: 520px; }
[class~="h-full"] { height: 100%; }
[class~="h-1"] { height: .25rem; }
[class~="h-1.5"] { height: .375rem; }
[class~="h-2"] { height: .5rem; }
[class~="h-2.5"] { height: .625rem; }
[class~="h-4"] { height: 1rem; }
[class~="h-7"] { height: 1.75rem; }
[class~="h-8"] { height: 2rem; }
[class~="h-9"] { height: 2.25rem; }
[class~="h-10"] { height: 2.5rem; }
[class~="h-12"] { height: 3rem; }
[class~="h-[calc(100dvh-48px)]"] { height: calc(100dvh - 48px); }
[class~="h-[calc(48px+var(--safe-top))]"] { height: calc(48px + var(--safe-top)); }
[class~="max-h-[42vh]"] { max-height: 42vh; }
[class~="max-h-[85vh]"] { max-height: 85vh; }

[class~="grid-cols-1"] { grid-template-columns: repeat(1, minmax(0, 1fr)); }
[class~="grid-cols-2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
[class~="gap-0.5"] { gap: .125rem; }
[class~="gap-1"] { gap: .25rem; }
[class~="gap-1.5"] { gap: .375rem; }
[class~="gap-2"] { gap: .5rem; }
[class~="gap-2.5"] { gap: .625rem; }
[class~="gap-3"] { gap: .75rem; }
[class~="space-y-1"] > :not([hidden]) ~ :not([hidden]) { margin-top: .25rem; }
[class~="space-y-1.5"] > :not([hidden]) ~ :not([hidden]) { margin-top: .375rem; }
[class~="space-y-2"] > :not([hidden]) ~ :not([hidden]) { margin-top: .5rem; }
[class~="space-y-2.5"] > :not([hidden]) ~ :not([hidden]) { margin-top: .625rem; }
[class~="space-y-3"] > :not([hidden]) ~ :not([hidden]) { margin-top: .75rem; }
[class~="space-y-3.5"] > :not([hidden]) ~ :not([hidden]) { margin-top: .875rem; }
[class~="space-y-4"] > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }

[class~="overflow-hidden"] { overflow: hidden; }
[class~="overflow-x-auto"] { overflow-x: auto; }
[class~="overflow-y-auto"] { overflow-y: auto; }
[class~="overscroll-contain"] { overscroll-behavior: contain; }
[class~="pointer-events-none"] { pointer-events: none; }
[class~="pointer-events-auto"] { pointer-events: auto; }
[class~="object-cover"] { object-fit: cover; }
[class~="select-none"] { user-select: none; }
[class~="truncate"] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[class~="whitespace-nowrap"] { white-space: nowrap; }

[class~="p-1"] { padding: .25rem; }
[class~="p-2"] { padding: .5rem; }
[class~="p-2.5"] { padding: .625rem; }
[class~="p-3"] { padding: .75rem; }
[class~="p-3.5"] { padding: .875rem; }
[class~="p-4"] { padding: 1rem; }
[class~="p-6"] { padding: 1.5rem; }
[class~="px-1"] { padding-left: .25rem; padding-right: .25rem; }
[class~="px-1.5"] { padding-left: .375rem; padding-right: .375rem; }
[class~="px-2"] { padding-left: .5rem; padding-right: .5rem; }
[class~="px-2.5"] { padding-left: .625rem; padding-right: .625rem; }
[class~="px-3"] { padding-left: .75rem; padding-right: .75rem; }
[class~="px-4"] { padding-left: 1rem; padding-right: 1rem; }
[class~="px-5"] { padding-left: 1.25rem; padding-right: 1.25rem; }
[class~="px-6"] { padding-left: 1.5rem; padding-right: 1.5rem; }
[class~="py-0.2"] { padding-top: .05rem; padding-bottom: .05rem; }
[class~="py-0.5"] { padding-top: .125rem; padding-bottom: .125rem; }
[class~="py-1"] { padding-top: .25rem; padding-bottom: .25rem; }
[class~="py-1.5"] { padding-top: .375rem; padding-bottom: .375rem; }
[class~="py-2"] { padding-top: .5rem; padding-bottom: .5rem; }
[class~="py-2.5"] { padding-top: .625rem; padding-bottom: .625rem; }
[class~="py-3"] { padding-top: .75rem; padding-bottom: .75rem; }
[class~="pt-0.5"] { padding-top: .125rem; }
[class~="pt-1"] { padding-top: .25rem; }
[class~="pt-2"] { padding-top: .5rem; }
[class~="pt-3"] { padding-top: .75rem; }
[class~="pb-1"] { padding-bottom: .25rem; }
[class~="pb-2"] { padding-bottom: .5rem; }
[class~="pb-2.5"] { padding-bottom: .625rem; }
[class~="pb-4"] { padding-bottom: 1rem; }
[class~="pb-[calc(env(safe-area-inset-bottom,0px)+1rem)]"] { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 1rem); }
[class~="pb-[env(safe-area-inset-bottom,0px)]"] { padding-bottom: env(safe-area-inset-bottom, 0px); }
[class~="pr-1"] { padding-right: .25rem; }
[class~="mt-0.5"] { margin-top: .125rem; }
[class~="mt-1"] { margin-top: .25rem; }
[class~="mt-2"] { margin-top: .5rem; }
[class~="mt-3"] { margin-top: .75rem; }
[class~="mt-6"] { margin-top: 1.5rem; }
[class~="mb-1"] { margin-bottom: .25rem; }
[class~="mb-1.5"] { margin-bottom: .375rem; }
[class~="mb-2"] { margin-bottom: .5rem; }
[class~="mb-4"] { margin-bottom: 1rem; }
[class~="ml-0.5"] { margin-left: .125rem; }
[class~="ml-1"] { margin-left: .25rem; }
[class~="mr-0.5"] { margin-right: .125rem; }

[class~="text-left"] { text-align: left; }
[class~="text-center"] { text-align: center; }
[class~="text-right"] { text-align: right; }
[class~="font-bold"] { font-weight: 700; }
[class~="font-semibold"] { font-weight: 600; }
[class~="font-serif"] { font-family: Georgia, serif; }
[class~="font-mono"] { font-family: 'JetBrains Mono', monospace; }
[class~="font-sans"] { font-family: Arial, sans-serif; }
[class~="italic"] { font-style: italic; }
[class~="uppercase"] { text-transform: uppercase; }
[class~="tracking-wide"] { letter-spacing: .025em; }
[class~="tracking-wider"] { letter-spacing: .05em; }
[class~="tracking-widest"] { letter-spacing: .1em; }
[class~="leading-tight"] { line-height: 1.25; }
[class~="leading-snug"] { line-height: 1.375; }
[class~="leading-relaxed"] { line-height: 1.625; }
[class~="text-[9px]"] { font-size: 9px; }
[class~="text-[10px]"] { font-size: 10px; }
[class~="text-[11px]"] { font-size: 11px; }
[class~="text-xs"] { font-size: .75rem; line-height: 1rem; }
[class~="text-sm"] { font-size: .875rem; line-height: 1.25rem; }
[class~="text-base"] { font-size: 1rem; line-height: 1.5rem; }
[class~="text-lg"] { font-size: 1.125rem; line-height: 1.75rem; }
[class~="text-2xl"] { font-size: 1.5rem; line-height: 2rem; }

[class~="bg-[#070709]"] { background-color: #070709; }
[class~="bg-[#0a090d]"] { background-color: #0a090d; }
[class~="bg-[#0f0c09]"] { background-color: #0f0c09; }
[class~="bg-[#0f1712]"] { background-color: #0f1712; }
[class~="bg-[#100e14]"] { background-color: #100e14; }
[class~="bg-[#121017]"] { background-color: #121017; }
[class~="bg-[#14121a]"] { background-color: #14121a; }
[class~="bg-[#15121c]"] { background-color: #15121c; }
[class~="bg-[#161014]"] { background-color: #161014; }
[class~="bg-[#17141f]"] { background-color: #17141f; }
[class~="bg-[#1a1510]"] { background-color: #1a1510; }
[class~="bg-[#1b1721]"] { background-color: #1b1721; }
[class~="bg-[#1e1b24]"] { background-color: #1e1b24; }
[class~="bg-[#21172e]"] { background-color: #21172e; }
[class~="bg-[#221c2c]"] { background-color: #221c2c; }
[class~="bg-[#241c12]"] { background-color: #241c12; }
[class~="bg-[#2a0e14]"] { background-color: #2a0e14; }
[class~="bg-amber-500"] { background-color: #f59e0b; }
[class~="bg-black/80"] { background-color: rgba(0, 0, 0, .8); }
[class~="text-[#4a3f57]"] { color: #4a3f57; }
[class~="text-[#6bb882]"] { color: #6bb882; }
[class~="text-[#787167]"] { color: #787167; }
[class~="text-[#7d7569]"] { color: #7d7569; }
[class~="text-[#8c8479]"] { color: #8c8479; }
[class~="text-[#a68244]"] { color: #a68244; }
[class~="text-[#b87c72]"] { color: #b87c72; }
[class~="text-[#b8a4cc]"] { color: #b8a4cc; }
[class~="text-[#c27c94]"] { color: #c27c94; }
[class~="text-[#cbb074]"] { color: #cbb074; }
[class~="text-[#cfc7bc]"] { color: #cfc7bc; }
[class~="text-[#d9d2c7]"] { color: #d9d2c7; }
[class~="text-[#d9969c]"] { color: #d9969c; }
[class~="text-[#e0989f]"] { color: #e0989f; }
[class~="text-[#e6ddce]"] { color: #e6ddce; }
[class~="text-[#e6757f]"] { color: #e6757f; }
[class~="text-amber-400"] { color: #fbbf24; }
[class~="text-rose-300"] { color: #fda4af; }

[class~="border"] { border-width: 1px; border-style: solid; }
[class~="border-b"] { border-bottom-width: 1px; border-bottom-style: solid; }
[class~="border-t"] { border-top-width: 1px; border-top-style: solid; }
[class~="border-[#1d3824]"] { border-color: #1d3824; }
[class~="border-[#211d29]"] { border-color: #211d29; }
[class~="border-[#24202c]"] { border-color: #24202c; }
[class~="border-[#292433]"] { border-color: #292433; }
[class~="border-[#2b2536]"] { border-color: #2b2536; }
[class~="border-[#2b2538]"] { border-color: #2b2538; }
[class~="border-[#383042]"] { border-color: #383042; }
[class~="border-[#3b2420]"] { border-color: #3b2420; }
[class~="border-[#3d1e2b]"] { border-color: #3d1e2b; }
[class~="border-[#3d2c52]"] { border-color: #3d2c52; }
[class~="border-[#3e2c19]"] { border-color: #3e2c19; }
[class~="border-[#42394f]"] { border-color: #42394f; }
[class~="border-[#524128]"] { border-color: #524128; }
[class~="border-[#544227]"] { border-color: #544227; }
[class~="border-[#665033]"] { border-color: #665033; }
[class~="border-[#6b1e25]"] { border-color: #6b1e25; }
[class~="rounded"] { border-radius: .25rem; }
[class~="rounded-lg"] { border-radius: .5rem; }
[class~="rounded-xl"] { border-radius: .75rem; }
[class~="rounded-2xl"] { border-radius: 1rem; }
[class~="rounded-t-2xl"] { border-top-left-radius: 1rem; border-top-right-radius: 1rem; }
[class~="rounded-full"] { border-radius: 9999px; }
[class~="shadow"] { box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.12); }
[class~="shadow-lg"] { box-shadow: 0 10px 15px -3px rgba(0,0,0,.35); }
[class~="shadow-2xl"] { box-shadow: 0 25px 50px -12px rgba(0,0,0,.55); }
[class~="shadow-inner"] { box-shadow: inset 0 2px 4px rgba(0,0,0,.35); }
[class~="backdrop-blur-sm"] { backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
[class~="backdrop-blur-md"] { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }

[class~="z-20"] { z-index: 20; }
[class~="z-30"] { z-index: 30; }
[class~="z-50"] { z-index: 50; }
[class~="opacity-0"] { opacity: 0; }
[class~="opacity-100"] { opacity: 1; }
[class~="transform"] { transform: translateZ(0); }
[class~="translate-x-0"] { transform: translateX(0); }
[class~="-translate-x-4"] { transform: translateX(-1rem); }
[class~="translate-y-0"] { transform: translateY(0); }
[class~="translate-y-full"] { transform: translateY(100%); }
[class~="transition"] { transition-property: color, background-color, border-color, opacity, box-shadow, transform; transition-duration: 150ms; }
[class~="transition-all"] { transition-property: all; transition-duration: 150ms; }
[class~="transition-colors"] { transition-property: color, background-color, border-color; transition-duration: 150ms; }
[class~="transition-opacity"] { transition-property: opacity; transition-duration: 150ms; }
[class~="duration-200"] { transition-duration: 200ms; }
[class~="duration-300"] { transition-duration: 300ms; }
[class~="ease-out"] { transition-timing-function: cubic-bezier(0, 0, .2, 1); }

[class~="hover:bg-[#1d1824]"]:hover { background-color: #1d1824; }
[class~="hover:bg-[#2c2636]"]:hover { background-color: #2c2636; }
[class~="hover:bg-[#3d141d]"]:hover { background-color: #3d141d; }
[class~="hover:bg-[#cbb074]"]:hover { background-color: #cbb074; }
[class~="hover:border-[#846733]"]:hover { border-color: #846733; }
[class~="hover:text-[#a4ebb8]"]:hover { color: #a4ebb8; }
[class~="hover:text-[#cbb074]"]:hover { color: #cbb074; }
[class~="hover:text-[#cfc7bc]"]:hover { color: #cfc7bc; }
[class~="hover:text-[#d9969c]"]:hover { color: #d9969c; }
[class~="hover:text-[#f0af9e]"]:hover { color: #f0af9e; }
[class~="hover:text-[#f0b0c0]"]:hover { color: #f0b0c0; }
[class~="hover:text-rose-300"]:hover { color: #fda4af; }
[class~="text-amber-300"] { color: #fcd34d; }
[class~="text-emerald-400"] { color: #34d399; }
[class~="focus:border-[#846733]"]:focus { border-color: #846733; }
[class~="focus:outline-none"]:focus { outline: 2px solid transparent; outline-offset: 2px; }
[class~="active:scale-90"]:active { transform: scale(.9); }
[class~="active:scale-95"]:active { transform: scale(.95); }

@media (min-width: 480px) {
  [class~="xs:flex"] { display: flex !important; }
  [class~="xs:inline"] { display: inline !important; }
}
@media (min-width: 768px) {
  [class~="md:block"] { display: block !important; }
  [class~="md:flex"] { display: flex !important; }
  [class~="md:hidden"] { display: none !important; }
  [class~="md:gap-2.5"] { gap: .625rem; }
  [class~="md:gap-3"] { gap: .75rem; }
  [class~="md:h-5"] { height: 1.25rem; }
  [class~="md:h-9"] { height: 2.25rem; }
  [class~="md:h-14"] { height: 3.5rem; }
  [class~="md:h-[calc(100vh-56px)]"] { height: calc(100vh - 56px); }
  [class~="md:min-h-[56px]"] { min-height: 56px; }
  [class~="md:p-5"] { padding: 1.25rem; }
  [class~="md:px-6"] { padding-left: 1.5rem; padding-right: 1.5rem; }
  [class~="md:text-base"] { font-size: 1rem; line-height: 1.5rem; }
  [class~="md:top-3"] { top: .75rem; }
  [class~="md:top-6"] { top: 1.5rem; }
  [class~="md:w-5"] { width: 1.25rem; }
  [class~="md:w-9"] { width: 2.25rem; }
}
@media (min-width: 1024px) {
  [class~="lg:block"] { display: block !important; }
  [class~="lg:flex"] { display: flex !important; }
  [class~="lg:hidden"] { display: none !important; }
}
@media (min-width: 1280px) {
  [class~="xl:inline"] { display: inline; }
}
#desktop-inspector-panel {
  display: none;
}
#desktop-header-actions {
  display: none;
}
@media (min-width: 768px) {
  #desktop-inspector-panel {
    display: block !important;
  }
  #desktop-header-actions {
    display: flex !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  [class~="transition"], [class~="transition-all"], [class~="transition-colors"], [class~="transition-opacity"] {
    transition: none !important;
  }
}