:root {
	--bg-dark: #07151a;
	--bg-mid: #0e2229;
	--ink: #f4f8ee;
	--ink-muted: #afc5bd;
	--mint: #87f0c1;
	--sky: #8ecfff;
	--ice: #8ef0ff;
	--teal: #6dd9c6;
	--peach: #ffc79d;
	--rose: #ff9db6;
	--salmon: #ff8e74;
	--amber: #ffd166;
	--line: rgba(255, 255, 255, 0.14);
	--console-text: #f8faea;
	--glow-1: rgba(23, 64, 77, 0.95);
	--glow-2: rgba(68, 104, 138, 0.55);
	--glow-3: rgba(255, 199, 157, 0.2);
	--brand-wave-1: color-mix(in srgb, var(--sky) 94%, #ffffff 6%);
	--brand-wave-2: color-mix(in srgb, var(--mint) 92%, #ffffff 8%);
	--brand-wave-3: color-mix(in srgb, var(--ice) 90%, #ffffff 10%);
	--brand-wave-4: color-mix(in srgb, var(--amber) 80%, #ffffff 20%);
	--ui-border-soft: color-mix(in srgb, var(--ink) 22%, transparent);
	--ui-border-accent: color-mix(in srgb, var(--sky) 46%, transparent);
	--ui-border-accent-strong: color-mix(in srgb, var(--mint) 58%, transparent);
	--footer-social-color: var(--sky);
	--cursor-alert-color: var(--salmon);
	--logout-loading-color: var(--salmon);
	--login-loading-color: var(--amber);
	--theme-origin-x: 50vw;
	--theme-origin-y: 50vh;
}

:root[data-theme='light'] {
	--bg-dark: #e8f2f1;
	--bg-mid: #f7fbfc;
	--ink: #1a2b30;
	--ink-muted: #49636c;
	--mint: #2d8f79;
	--sky: #3f87b8;
	--ice: #2e92ad;
	--teal: #337f84;
	--line: rgba(15, 48, 61, 0.18);
	--console-text: #15313a;
	--glow-1: rgba(147, 214, 220, 0.42);
	--glow-2: rgba(143, 182, 221, 0.28);
	--glow-3: rgba(255, 206, 166, 0.2);
	--brand-wave-1: color-mix(in srgb, var(--sky) 84%, #0d2730 16%);
	--brand-wave-2: color-mix(in srgb, var(--mint) 84%, #0d2730 16%);
	--brand-wave-3: color-mix(in srgb, var(--ice) 82%, #0d2730 18%);
	--brand-wave-4: color-mix(in srgb, var(--amber) 82%, #0d2730 18%);
	--ui-border-soft: color-mix(in srgb, var(--ink) 28%, transparent);
	--ui-border-accent: color-mix(in srgb, var(--sky) 52%, transparent);
	--ui-border-accent-strong: color-mix(in srgb, var(--mint) 58%, transparent);
	--footer-social-color: color-mix(in srgb, var(--sky) 82%, #103440 18%);
}

:root[data-theme='dark'][data-palette='nord'] {
	--bg-dark: #2e3440;
	--bg-mid: #3b4252;
	--ink: #eceff4;
	--ink-muted: #c7d0dd;
	--mint: #8fbcbb;
	--sky: #81a1c1;
	--ice: #88c0d0;
	--teal: #5e81ac;
	--peach: #d08770;
	--rose: #bf616a;
	--salmon: #d08770;
	--amber: #ebcb8b;
	--line: rgba(236, 239, 244, 0.15);
	--console-text: #f2f5f9;
	--glow-1: rgba(94, 129, 172, 0.6);
	--glow-2: rgba(129, 161, 193, 0.45);
	--glow-3: rgba(208, 135, 112, 0.24);
}

:root[data-theme='light'][data-palette='nord'] {
	--bg-dark: #eceff4;
	--bg-mid: #f7f9fc;
	--ink: #2e3440;
	--ink-muted: #4c566a;
	--mint: #4c8a8a;
	--sky: #4c7098;
	--ice: #3b7f90;
	--teal: #4f6f96;
	--peach: #c27f66;
	--rose: #a65963;
	--salmon: #bc6f5f;
	--amber: #c4a86d;
	--line: rgba(46, 52, 64, 0.2);
	--console-text: #27333f;
	--glow-1: rgba(143, 188, 187, 0.34);
	--glow-2: rgba(129, 161, 193, 0.26);
	--glow-3: rgba(208, 135, 112, 0.18);
}

:root[data-theme='dark'][data-palette='gruvbox'] {
	--bg-dark: #282828;
	--bg-mid: #3c3836;
	--ink: #ebdbb2;
	--ink-muted: #c6b58b;
	--mint: #b8bb26;
	--sky: #83a598;
	--ice: #8ec07c;
	--teal: #689d6a;
	--peach: #fe8019;
	--rose: #fb4934;
	--salmon: #fb4934;
	--amber: #fabd2f;
	--line: rgba(235, 219, 178, 0.18);
	--console-text: #f3e6c7;
	--glow-1: rgba(184, 187, 38, 0.5);
	--glow-2: rgba(131, 165, 152, 0.4);
	--glow-3: rgba(254, 128, 25, 0.26);
}

:root[data-theme='light'][data-palette='gruvbox'] {
	--bg-dark: #fbf1c7;
	--bg-mid: #f8f0d0;
	--ink: #3c3836;
	--ink-muted: #665c54;
	--mint: #79740e;
	--sky: #076678;
	--ice: #427b58;
	--teal: #427b58;
	--peach: #af3a03;
	--rose: #9d0006;
	--salmon: #9d0006;
	--amber: #b57614;
	--line: rgba(60, 56, 54, 0.2);
	--console-text: #3f372f;
	--glow-1: rgba(121, 116, 14, 0.24);
	--glow-2: rgba(7, 102, 120, 0.2);
	--glow-3: rgba(175, 58, 3, 0.16);
}

:root[data-theme='dark'][data-palette='solarized'] {
	--bg-dark: #002b36;
	--bg-mid: #073642;
	--ink: #eee8d5;
	--ink-muted: #93a1a1;
	--mint: #859900;
	--sky: #268bd2;
	--ice: #2aa198;
	--teal: #2aa198;
	--peach: #cb4b16;
	--rose: #dc322f;
	--salmon: #dc322f;
	--amber: #b58900;
	--line: rgba(238, 232, 213, 0.17);
	--console-text: #f7f1df;
	--glow-1: rgba(38, 139, 210, 0.5);
	--glow-2: rgba(42, 161, 152, 0.42);
	--glow-3: rgba(203, 75, 22, 0.24);
}

:root[data-theme='light'][data-palette='solarized'] {
	--bg-dark: #fdf6e3;
	--bg-mid: #fffaf0;
	--ink: #586e75;
	--ink-muted: #657b83;
	--mint: #859900;
	--sky: #268bd2;
	--ice: #2aa198;
	--teal: #2aa198;
	--peach: #cb4b16;
	--rose: #dc322f;
	--salmon: #dc322f;
	--amber: #b58900;
	--line: rgba(88, 110, 117, 0.2);
	--console-text: #4a5e63;
	--glow-1: rgba(38, 139, 210, 0.24);
	--glow-2: rgba(42, 161, 152, 0.2);
	--glow-3: rgba(203, 75, 22, 0.16);
}

:root[data-theme='dark'][data-palette='tokyo-night'] {
	--bg-dark: #1a1b26;
	--bg-mid: #24283b;
	--ink: #c0caf5;
	--ink-muted: #9aa5ce;
	--mint: #9ece6a;
	--sky: #7aa2f7;
	--ice: #7dcfff;
	--teal: #73daca;
	--peach: #ff9e64;
	--rose: #f7768e;
	--salmon: #f7768e;
	--amber: #e0af68;
	--line: rgba(192, 202, 245, 0.16);
	--console-text: #d7defd;
	--glow-1: rgba(122, 162, 247, 0.56);
	--glow-2: rgba(125, 207, 255, 0.4);
	--glow-3: rgba(255, 158, 100, 0.26);
}

:root[data-theme='light'][data-palette='tokyo-night'] {
	--bg-dark: #e8edf9;
	--bg-mid: #f4f7ff;
	--ink: #22263a;
	--ink-muted: #4a5272;
	--mint: #4c8f45;
	--sky: #4f71cb;
	--ice: #3e8da8;
	--teal: #3d8b86;
	--peach: #c67a45;
	--rose: #be5c78;
	--salmon: #be5c78;
	--amber: #b58442;
	--line: rgba(34, 38, 58, 0.18);
	--console-text: #28314a;
	--glow-1: rgba(79, 113, 203, 0.25);
	--glow-2: rgba(125, 207, 255, 0.2);
	--glow-3: rgba(198, 122, 69, 0.16);
}

:root[data-theme='dark'][data-palette='catppuccin-latte'] {
	--bg-dark: #2f3448;
	--bg-mid: #3b3f58;
	--ink: #f1f2fb;
	--ink-muted: #c9cce3;
	--mint: #8fe388;
	--sky: #84b6ff;
	--ice: #7ad9ef;
	--teal: #66c2c5;
	--peach: #ffb27d;
	--rose: #f2a8de;
	--salmon: #f28b9a;
	--amber: #f4c67b;
	--line: rgba(241, 242, 251, 0.16);
	--console-text: #f7f8ff;
	--glow-1: rgba(132, 182, 255, 0.5);
	--glow-2: rgba(102, 194, 197, 0.36);
	--glow-3: rgba(255, 178, 125, 0.22);
}

:root[data-theme='light'][data-palette='catppuccin-latte'] {
	--bg-dark: #eff1f5;
	--bg-mid: #e6e9ef;
	--ink: #4c4f69;
	--ink-muted: #6c6f85;
	--mint: #40a02b;
	--sky: #1e66f5;
	--ice: #04a5e5;
	--teal: #179299;
	--peach: #fe640b;
	--rose: #ea76cb;
	--salmon: #d20f39;
	--amber: #df8e1d;
	--line: rgba(76, 79, 105, 0.2);
	--console-text: #3f415a;
	--glow-1: rgba(30, 102, 245, 0.24);
	--glow-2: rgba(23, 146, 153, 0.2);
	--glow-3: rgba(254, 100, 11, 0.16);
}

:root[data-theme='dark'][data-palette='catppuccin-frappe'] {
	--bg-dark: #303446;
	--bg-mid: #414559;
	--ink: #c6d0f5;
	--ink-muted: #a9b1d6;
	--mint: #a6d189;
	--sky: #8caaee;
	--ice: #99d1db;
	--teal: #81c8be;
	--peach: #ef9f76;
	--rose: #f4b8e4;
	--salmon: #e78284;
	--amber: #e5c890;
	--line: rgba(198, 208, 245, 0.16);
	--console-text: #dbe1ff;
	--glow-1: rgba(140, 170, 238, 0.5);
	--glow-2: rgba(129, 200, 190, 0.36);
	--glow-3: rgba(239, 159, 118, 0.22);
}

:root[data-theme='light'][data-palette='catppuccin-frappe'] {
	--bg-dark: #edf0fb;
	--bg-mid: #f6f7fd;
	--ink: #3f4660;
	--ink-muted: #616989;
	--mint: #5a9f48;
	--sky: #4f6fc9;
	--ice: #3b93a4;
	--teal: #3f9b8f;
	--peach: #c87e56;
	--rose: #b96aa4;
	--salmon: #b95865;
	--amber: #b89352;
	--line: rgba(63, 70, 96, 0.2);
	--console-text: #343b55;
	--glow-1: rgba(79, 111, 201, 0.24);
	--glow-2: rgba(63, 155, 143, 0.2);
	--glow-3: rgba(200, 126, 86, 0.16);
}

:root[data-theme='dark'][data-palette='catppuccin-macchiato'] {
	--bg-dark: #24273a;
	--bg-mid: #363a4f;
	--ink: #cad3f5;
	--ink-muted: #a8b1d9;
	--mint: #a6da95;
	--sky: #8aadf4;
	--ice: #91d7e3;
	--teal: #7dc4e4;
	--peach: #f5a97f;
	--rose: #f5bde6;
	--salmon: #ed8796;
	--amber: #eed49f;
	--line: rgba(202, 211, 245, 0.16);
	--console-text: #dee4ff;
	--glow-1: rgba(138, 173, 244, 0.52);
	--glow-2: rgba(125, 196, 228, 0.38);
	--glow-3: rgba(245, 169, 127, 0.24);
}

:root[data-theme='light'][data-palette='catppuccin-macchiato'] {
	--bg-dark: #e8ecfb;
	--bg-mid: #f1f4ff;
	--ink: #2f3550;
	--ink-muted: #56608a;
	--mint: #4d9653;
	--sky: #4d71cf;
	--ice: #358e9f;
	--teal: #4a8eb2;
	--peach: #c27f54;
	--rose: #b46da3;
	--salmon: #bf5d72;
	--amber: #af915c;
	--line: rgba(47, 53, 80, 0.2);
	--console-text: #2b3049;
	--glow-1: rgba(77, 113, 207, 0.24);
	--glow-2: rgba(74, 142, 178, 0.2);
	--glow-3: rgba(194, 127, 84, 0.16);
}

:root[data-theme='dark'][data-palette='catppuccin-mocha'] {
	--bg-dark: #1e1e2e;
	--bg-mid: #313244;
	--ink: #cdd6f4;
	--ink-muted: #a7b0cf;
	--mint: #a6e3a1;
	--sky: #89b4fa;
	--ice: #94e2d5;
	--teal: #74c7ec;
	--peach: #fab387;
	--rose: #f5c2e7;
	--salmon: #f38ba8;
	--amber: #f9e2af;
	--line: rgba(205, 214, 244, 0.16);
	--console-text: #e4e9ff;
	--glow-1: rgba(137, 180, 250, 0.54);
	--glow-2: rgba(116, 199, 236, 0.38);
	--glow-3: rgba(250, 179, 135, 0.24);
}

:root[data-theme='light'][data-palette='catppuccin-mocha'] {
	--bg-dark: #e9ebff;
	--bg-mid: #f3f4ff;
	--ink: #2d3150;
	--ink-muted: #525984;
	--mint: #4f9755;
	--sky: #4f73d3;
	--ice: #3e9f95;
	--teal: #3e91b0;
	--peach: #be7f58;
	--rose: #b267a2;
	--salmon: #c15e80;
	--amber: #af915f;
	--line: rgba(45, 49, 80, 0.2);
	--console-text: #2b2f4a;
	--glow-1: rgba(79, 115, 211, 0.24);
	--glow-2: rgba(62, 145, 176, 0.2);
	--glow-3: rgba(190, 127, 88, 0.16);
}

:root[data-theme='dark'][data-palette='cyberpunk-2077'] {
	--bg-dark: #0d0f17;
	--bg-mid: #161a24;
	--ink: #f2f6ff;
	--ink-muted: #99a3c1;
	--mint: #00f5a0;
	--sky: #00d5ff;
	--ice: #6ef3ff;
	--teal: #12a5d6;
	--peach: #ffb300;
	--rose: #ff4fd8;
	--salmon: #ff5c70;
	--amber: #ffd500;
	--line: rgba(242, 246, 255, 0.16);
	--console-text: #f7fbff;
	--glow-1: rgba(0, 213, 255, 0.56);
	--glow-2: rgba(255, 79, 216, 0.4);
	--glow-3: rgba(255, 213, 0, 0.28);
}

:root[data-theme='light'][data-palette='cyberpunk-2077'] {
	--bg-dark: #fdf6bf;
	--bg-mid: #fffbe0;
	--ink: #172033;
	--ink-muted: #3f4b68;
	--mint: #0f9d73;
	--sky: #007acc;
	--ice: #0096b5;
	--teal: #0a7fa0;
	--peach: #bc7f00;
	--rose: #b53ca0;
	--salmon: #c94959;
	--amber: #b89500;
	--line: rgba(23, 32, 51, 0.2);
	--console-text: #1c2740;
	--glow-1: rgba(0, 122, 204, 0.24);
	--glow-2: rgba(181, 60, 160, 0.2);
	--glow-3: rgba(184, 149, 0, 0.16);
}

:root[data-theme='dark'][data-palette='dracula'] {
	--bg-dark: #282a36;
	--bg-mid: #44475a;
	--ink: #f8f8f2;
	--ink-muted: #b5b8c8;
	--mint: #50fa7b;
	--sky: #8be9fd;
	--ice: #8be9fd;
	--teal: #6272a4;
	--peach: #ffb86c;
	--rose: #ff79c6;
	--salmon: #ff5555;
	--amber: #f1fa8c;
	--line: rgba(248, 248, 242, 0.16);
	--console-text: #fcfcf7;
	--glow-1: rgba(139, 233, 253, 0.48);
	--glow-2: rgba(255, 121, 198, 0.34);
	--glow-3: rgba(255, 184, 108, 0.24);
}

:root[data-theme='light'][data-palette='dracula'] {
	--bg-dark: #f1f1f6;
	--bg-mid: #f8f8fc;
	--ink: #2f3244;
	--ink-muted: #575d79;
	--mint: #3c9959;
	--sky: #3d86b6;
	--ice: #3d86b6;
	--teal: #58659a;
	--peach: #b6783e;
	--rose: #b85a97;
	--salmon: #c25555;
	--amber: #9e9f49;
	--line: rgba(47, 50, 68, 0.2);
	--console-text: #2b2d3d;
	--glow-1: rgba(61, 134, 182, 0.24);
	--glow-2: rgba(184, 90, 151, 0.2);
	--glow-3: rgba(182, 120, 62, 0.16);
}

html {
	font-size: 16px;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: 'Space Grotesk', 'Manrope', 'Segoe UI', sans-serif;
	color: var(--ink);
	background:
		radial-gradient(circle at 20% 0%, var(--glow-1), transparent 45%),
		radial-gradient(circle at 80% 10%, var(--glow-2), transparent 40%),
		radial-gradient(circle at 50% 120%, var(--glow-3), transparent 48%), linear-gradient(140deg, var(--bg-dark), var(--bg-mid));
	min-height: 100vh;
}

:root[data-theme='light'] body {
	background:
		radial-gradient(circle at 18% 0%, var(--glow-1), transparent 48%),
		radial-gradient(circle at 88% 16%, var(--glow-2), transparent 46%),
		radial-gradient(circle at 52% 118%, var(--glow-3), transparent 52%), linear-gradient(145deg, var(--bg-dark), var(--bg-mid));
}

.app-bg {
	position: fixed;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
	background-size: 36px 36px;
	mask-image: radial-gradient(circle at 50% 0%, black 40%, transparent 85%);
}

:root[data-theme='light'] .app-bg {
	background-image:
		linear-gradient(rgba(17, 49, 58, 0.07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(17, 49, 58, 0.07) 1px, transparent 1px);
}

.dashboard {
	position: relative;
	padding: 24px;
	max-width: 1400px;
	margin: 0 auto;
	display: grid;
	gap: 18px;
}

:root.theme-transitioning body,
:root.theme-transitioning .app-bg,
:root.theme-transitioning .hero,
:root.theme-transitioning .card,
:root.theme-transitioning .panel,
:root.theme-transitioning .commands-wrap,
:root.theme-transitioning .audit-wrap,
:root.theme-transitioning .category-group,
:root.theme-transitioning .command-card,
:root.theme-transitioning .users-kpi-card,
:root.theme-transitioning .users-bulk-toolbar,
:root.theme-transitioning .dashboard-footer,
:root.theme-transitioning .section-state,
:root.theme-transitioning .confirm-card,
:root.theme-transitioning .console,
:root.theme-transitioning .hero-badge,
:root.theme-transitioning .readonly-chip,
:root.theme-transitioning .user-select-row,
:root.theme-transitioning button,
:root.theme-transitioning input,
:root.theme-transitioning .footer-links a,
:root.theme-transitioning .custom-tooltip {
	transition:
		background-color 0.42s cubic-bezier(0.22, 1, 0.36, 1),
		background-image 0.5s cubic-bezier(0.22, 1, 0.36, 1),
		border-color 0.42s cubic-bezier(0.22, 1, 0.36, 1),
		color 0.38s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

::view-transition-old(root),
::view-transition-new(root) {
	animation-duration: 0.82s;
	animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

::view-transition-old(root) {
	animation-name: none;
}

::view-transition-new(root) {
	animation-name: theme-radial-reveal;
	clip-path: circle(0 at var(--theme-origin-x) var(--theme-origin-y));
}

@media (min-width: 1300px) {
	html {
		font-size: 17px;
	}

	.dashboard {
		max-width: min(1700px, 96vw);
		padding: 30px;
		gap: 22px;
	}

	.cards {
		gap: 16px;
	}

	.card,
	.panel {
		padding: 18px;
	}

	.value {
		font-size: 1.65rem;
	}

	.status-chart {
		height: 84px;
	}

	.commands-wrap {
		max-height: 700px;
	}

	.login-panel {
		width: min(740px, 94vw);
		padding: 30px;
	}
}

@media (min-width: 1700px) {
	html {
		font-size: 18px;
	}

	.dashboard {
		max-width: min(1820px, 96vw);
	}
}

.login-dashboard {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hero {
	display: flex;
	justify-content: space-between;
	align-items: end;
	gap: 14px;
	position: relative;
	background:
		linear-gradient(135deg, rgba(142, 240, 255, 0.07), rgba(255, 199, 157, 0.05) 42%, rgba(135, 240, 193, 0.06) 100%),
		rgba(255, 255, 255, 0.04);
	border: 1px solid var(--line);
	border-radius: 18px;
	padding: 20px;
	backdrop-filter: blur(8px);
}

.header-alerts {
	display: grid;
	gap: 4px;
	padding: 12px 14px;
	border-radius: 12px;
	border: 1px solid rgba(255, 209, 102, 0.48);
	background:
		linear-gradient(140deg, rgba(255, 209, 102, 0.17), rgba(255, 199, 157, 0.11) 50%, rgba(255, 255, 255, 0.03)),
		rgba(11, 23, 29, 0.88);
	box-shadow:
		0 10px 20px rgba(0, 0, 0, 0.18),
		0 0 0 1px rgba(255, 255, 255, 0.04) inset;
	animation: alert-slide-in 0.22s ease;
}

.header-alerts-warning {
	border-color: rgba(255, 209, 102, 0.58);
}

.header-alerts-critical {
	border-color: rgba(255, 142, 116, 0.72);
	background:
		linear-gradient(140deg, rgba(255, 142, 116, 0.2), rgba(255, 157, 182, 0.12) 50%, rgba(255, 255, 255, 0.03)),
		rgba(18, 24, 32, 0.9);
	box-shadow:
		0 12px 24px rgba(0, 0, 0, 0.22),
		0 0 0 1px rgba(255, 142, 116, 0.2) inset;
}

.header-alert-main {
	display: grid;
	gap: 2px;
}

.header-alert-title {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #ffeec4;
}

.header-alerts-critical .header-alert-title {
	color: #ffd7cf;
}

.header-alert-message {
	margin: 0;
	font-size: 0.84rem;
	line-height: 1.42;
	color: var(--ink);
}

.header-alert-meta {
	margin: 0;
	font-size: 0.75rem;
	letter-spacing: 0.01em;
	color: var(--ink-muted);
}

:root[data-theme='light'] .header-alerts {
	border-color: rgba(176, 125, 36, 0.45);
	background:
		linear-gradient(145deg, rgba(255, 233, 186, 0.86), rgba(255, 248, 233, 0.92) 54%, rgba(255, 255, 255, 0.9)),
		rgba(255, 255, 255, 0.9);
	box-shadow:
		0 10px 18px rgba(115, 82, 17, 0.14),
		0 0 0 1px rgba(255, 255, 255, 0.72) inset;
}

:root[data-theme='light'] .header-alerts-warning {
	border-color: rgba(176, 125, 36, 0.52);
}

:root[data-theme='light'] .header-alerts-critical {
	border-color: rgba(196, 97, 77, 0.56);
	background:
		linear-gradient(145deg, rgba(255, 214, 204, 0.9), rgba(255, 241, 236, 0.94) 56%, rgba(255, 255, 255, 0.9)),
		rgba(255, 255, 255, 0.9);
	box-shadow:
		0 12px 20px rgba(148, 74, 59, 0.14),
		0 0 0 1px rgba(255, 255, 255, 0.78) inset;
}

:root[data-theme='light'] .header-alert-title {
	color: #7b4e0f;
}

:root[data-theme='light'] .header-alerts-critical .header-alert-title {
	color: #90371f;
}

:root[data-theme='light'] .header-alert-message {
	color: #263940;
}

:root[data-theme='light'] .header-alert-meta {
	color: #4d626a;
}

@keyframes alert-slide-in {
	from {
		opacity: 0;
		transform: translateY(-4px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.eyebrow {
	margin: 0;
	font-size: 0.8rem;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--mint);
}

h1 {
	margin: 8px 0 0;
	font-size: clamp(1.25rem, 2vw, 2rem);
}

.hero-brand-animated {
	display: inline-block;
	background-image: linear-gradient(
		120deg,
		var(--brand-wave-1) 0%,
		var(--brand-wave-2) 12.5%,
		var(--brand-wave-3) 25%,
		var(--brand-wave-4) 37.5%,
		var(--brand-wave-1) 50%,
		var(--brand-wave-2) 62.5%,
		var(--brand-wave-3) 75%,
		var(--brand-wave-4) 87.5%,
		var(--brand-wave-1) 100%
	);
	background-size: 200% 100%;
	color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	animation: hero-brand-shimmer 5.6s linear infinite;
	text-shadow:
		0 0 10px color-mix(in srgb, var(--sky) 26%, transparent),
		0 0 18px color-mix(in srgb, var(--mint) 20%, transparent);
}

:root[data-theme='light'] .hero-brand-animated {
	text-shadow:
		0 0 8px color-mix(in srgb, var(--sky) 18%, transparent),
		0 0 12px color-mix(in srgb, var(--mint) 14%, transparent);
}

.hero-version {
	margin: 6px 0 0;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	font-size: 0.82rem;
	color: var(--ink-muted);
	letter-spacing: 0.02em;
}

.hero-version-label {
	color: inherit;
}

.hero-version-divider {
	width: 4px;
	height: 4px;
	border-radius: 99px;
	background: currentColor;
	opacity: 0.7;
}

.hero-changelog-link {
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sky);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	cursor: pointer;
}

.hero-changelog-link:hover {
	color: var(--mint);
}

#logout-button.hero-changelog-link {
	color: var(--salmon);
}

#logout-button.hero-changelog-link:hover {
	color: #ff7b63;
}

.hero-changelog-link:focus-visible {
	outline: 2px solid rgba(142, 207, 255, 0.64);
	outline-offset: 2px;
	border-radius: 4px;
}

:root[data-theme='light'] .hero-changelog-link {
	color: #1f6072;
}

:root[data-theme='light'] .hero-changelog-link:hover {
	color: #257f6b;
}

:root[data-theme='light'] #logout-button.hero-changelog-link {
	color: #b84732;
}

:root[data-theme='light'] #logout-button.hero-changelog-link:hover {
	color: #9f321f;
}

.hero-spotify {
	margin: 6px 0 0;
	font-size: 0.79rem;
	color: rgba(255, 255, 255, 0.76);
	max-width: min(72vw, 700px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	letter-spacing: 0.01em;
}

.hero-spotify.is-playing {
	color: var(--mint);
}

.hero-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--ink-muted);
	font-size: 0.9rem;
}

.theme-toggle {
	padding: 6px;
	font-size: 0.95rem;
	line-height: 1;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	isolation: isolate;
	border-color: rgba(142, 240, 255, 0.4);
	background: rgba(142, 240, 255, 0.12);
	color: #d9f7ff;
	border-radius: 999px;
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 4;
	box-shadow:
		0 6px 14px rgba(0, 0, 0, 0.2),
		0 0 0 1px rgba(255, 255, 255, 0.08) inset;
}

.hero > #theme-toggle {
	position: absolute !important;
	inset: 12px 12px auto auto !important;
	margin: 0 !important;
}

:root[data-theme='light'] .theme-toggle {
	border-color: rgba(39, 111, 132, 0.34);
	background: linear-gradient(160deg, rgba(221, 243, 252, 0.92), rgba(205, 234, 245, 0.88));
	color: #2a7289;
	box-shadow:
		0 6px 14px rgba(20, 74, 92, 0.12),
		0 0 0 1px rgba(255, 255, 255, 0.78) inset;
}

.theme-toggle:hover {
	border-color: rgba(142, 240, 255, 0.72);
	background: rgba(142, 240, 255, 0.2);
}

:root[data-theme='light'] .theme-toggle:hover {
	border-color: rgba(43, 129, 154, 0.52);
	background: linear-gradient(160deg, rgba(230, 248, 255, 0.98), rgba(214, 240, 249, 0.94));
}

.theme-icon {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transform-origin: center;
	font-family:
		'NerdFontsSymbols Nerd Font', 'Symbols Nerd Font Mono', 'Symbols Nerd Font', 'Hack Nerd Font', 'MesloLGS NF', monospace;
	font-weight: 400;
	font-size: 0.98rem;
	line-height: 1;
	transition:
		opacity 0.46s cubic-bezier(0.25, 1, 0.35, 1),
		transform 0.68s cubic-bezier(0.2, 0.95, 0.2, 1),
		filter 0.46s cubic-bezier(0.25, 1, 0.35, 1);
	will-change: transform, opacity;
	filter: drop-shadow(0 0 4px rgba(142, 240, 255, 0.35));
}

.theme-icon-sun {
	opacity: 0;
	transform: translate(-50%, -50%) scale(0.6) rotate(-42deg);
}

.theme-icon-moon {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1) rotate(0deg);
}

:root[data-theme='light'] .theme-icon-sun {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1) rotate(0deg);
}

:root[data-theme='light'] .theme-icon-moon {
	opacity: 0;
	transform: translate(-50%, -50%) scale(0.62) rotate(44deg);
}

.theme-toggle.is-switching .theme-icon-sun,
.theme-toggle.is-switching .theme-icon-moon {
	transition-duration: 0.42s, 0.52s, 0.42s;
	transition-timing-function: cubic-bezier(0.22, 0.9, 0.3, 1), cubic-bezier(0.2, 0.95, 0.2, 1), cubic-bezier(0.25, 1, 0.35, 1);
}

.hero-badge {
	padding: 4px 8px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	background: rgba(255, 255, 255, 0.05);
	font-size: 0.8rem;
	color: var(--ink);
	letter-spacing: 0.02em;
}

.logout-button {
	padding: 6px 10px;
	font-size: 0.8rem;
	border-color: rgba(255, 142, 116, 0.45);
}

.logout-dialog {
	z-index: 2460;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.22s ease;
}

.logout-dialog.is-visible {
	opacity: 1;
	pointer-events: auto;
}

.confirm-card.logout-card {
	width: min(560px, 100%);
	position: relative;
	overflow: hidden;
	padding-bottom: 34px;
	opacity: 0;
	transform: translateY(16px) scale(0.98);
	transition:
		opacity 0.22s ease,
		transform 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

#logout-confirm:hover {
	color: #ff7b63;
	border-color: rgba(255, 113, 113, 0.46);
	background: rgba(255, 113, 113, 0.12);
}

.logout-dialog.is-logging-out .confirm-card.logout-card {
	border-color: rgba(255, 113, 113, 0.46);
}

.logout-dialog.is-visible .logout-card {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.logout-actions {
	margin-top: 2px;
}

.logout-waiting {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: grid;
	gap: 6px;
	margin: 0;
	pointer-events: none;
}

.logout-waiting span {
	font-size: 0.75rem;
	letter-spacing: 0.02em;
	text-transform: none;
	color: color-mix(in srgb, var(--logout-loading-color) 74%, #ffffff 26%);
	padding-inline: 22px;
	padding-bottom: 6px;
}

.logout-waiting-line {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	border-radius: 0 0 14px 14px;
	overflow: hidden;
	background: color-mix(in srgb, var(--logout-loading-color) 32%, transparent);
	border: 1px solid color-mix(in srgb, var(--logout-loading-color) 58%, transparent);
	box-shadow:
		0 0 8px color-mix(in srgb, var(--logout-loading-color) 45%, transparent),
		0 0 14px color-mix(in srgb, var(--logout-loading-color) 30%, transparent);
	border-top: 0;
}

.logout-waiting-line::before {
	content: '';
	position: absolute;
	left: -40%;
	top: 0;
	width: 40%;
	height: 100%;
	background: linear-gradient(
		90deg,
		color-mix(in srgb, var(--logout-loading-color) 0%, transparent),
		color-mix(in srgb, var(--logout-loading-color) 56%, #ffffff 44%) 30%,
		#ffffff 50%,
		color-mix(in srgb, var(--logout-loading-color) 56%, #ffffff 44%) 70%,
		color-mix(in srgb, var(--logout-loading-color) 0%, transparent)
	);
	filter: drop-shadow(0 0 10px color-mix(in srgb, var(--logout-loading-color) 62%, #ffffff 38%))
		drop-shadow(0 0 18px color-mix(in srgb, var(--logout-loading-color) 66%, transparent));
	will-change: transform;
	animation: login-laser-sweep 0.95s linear infinite;
}

.logout-waiting-line::after {
	content: '';
	position: absolute;
	left: -50%;
	top: -1px;
	width: 50%;
	height: calc(100% + 2px);
	background: linear-gradient(
		90deg,
		color-mix(in srgb, var(--logout-loading-color) 0%, transparent),
		color-mix(in srgb, var(--logout-loading-color) 34%, #ffffff 66%) 50%,
		color-mix(in srgb, var(--logout-loading-color) 0%, transparent)
	);
	filter: blur(5px);
	opacity: 0.95;
	pointer-events: none;
	will-change: transform;
	animation: login-laser-sweep 0.95s linear infinite;
}

.logout-card #logout-confirm.is-waiting {
	color: #ffd8d8;
	border-color: rgba(255, 140, 140, 0.68);
	background: rgba(255, 90, 90, 0.2);
}

.popup-skeleton {
	display: grid;
	gap: 8px;
	padding: 2px 2px 6px;
}

.popup-skeleton-line {
	height: 10px;
	border-radius: 999px;
	background: linear-gradient(
		100deg,
		rgba(255, 255, 255, 0.05) 0%,
		rgba(142, 207, 255, 0.22) 50%,
		rgba(255, 255, 255, 0.05) 100%
	);
	background-size: 220% 100%;
	animation: section-skeleton-wave 1.3s ease-in-out infinite;
}

.changelog-popup-skeleton .popup-skeleton-line {
	height: 11px;
}

.popup-skeleton-line.w-92 {
	width: 92%;
}

.popup-skeleton-line.w-88 {
	width: 88%;
}

.popup-skeleton-line.w-85 {
	width: 85%;
}

.popup-skeleton-line.w-80 {
	width: 80%;
}

.popup-skeleton-line.w-76 {
	width: 76%;
}

.popup-skeleton-line.w-70 {
	width: 70%;
}

.popup-skeleton-line.w-68 {
	width: 68%;
}

.popup-skeleton-line.w-58 {
	width: 58%;
}

.popup-skeleton-line.w-52 {
	width: 52%;
}

.popup-skeleton-line.w-44 {
	width: 44%;
}

.popup-skeleton-line.w-40 {
	width: 40%;
}

.popup-skeleton-line.w-35 {
	width: 35%;
}

.contributors-popup-skeleton {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.contributor-skeleton-card {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	align-items: center;
	gap: 10px;
	padding: 10px;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.03);
}

.contributor-skeleton-avatar {
	width: 56px;
	height: 56px;
	border-radius: 999px;
	background: linear-gradient(
		100deg,
		rgba(255, 255, 255, 0.08) 0%,
		rgba(142, 240, 255, 0.24) 50%,
		rgba(255, 255, 255, 0.08) 100%
	);
	background-size: 220% 100%;
	animation: section-skeleton-wave 1.3s ease-in-out infinite;
}

.contributor-skeleton-meta {
	display: grid;
	gap: 7px;
}

:root[data-theme='light'] .logout-dialog.is-logging-out .confirm-card.logout-card {
	border-color: rgba(181, 58, 58, 0.42);
}

:root[data-theme='light'] .logout-waiting span {
	color: color-mix(in srgb, var(--logout-loading-color) 74%, #331111 26%);
}

:root[data-theme='light'] .logout-waiting-line {
	background: color-mix(in srgb, var(--logout-loading-color) 24%, transparent);
	border-color: color-mix(in srgb, var(--logout-loading-color) 52%, transparent);
}

:root[data-theme='light'] .contributor-skeleton-card {
	border-color: rgba(17, 49, 58, 0.18);
	background: rgba(17, 49, 58, 0.04);
}

.logout-button:hover {
	border-color: var(--salmon);
}

.dot {
	width: 8px;
	height: 8px;
	border-radius: 99px;
	background: var(--mint);
	box-shadow: 0 0 0 0 rgba(135, 240, 193, 0.5);
	animation: pulse 1.6s infinite;
}

:root.zen-cursor-enabled,
:root.zen-cursor-enabled *,
body.zen-cursor-enabled,
body.zen-cursor-enabled * {
	cursor: none !important;
}

:root.theme-transitioning body,
:root.theme-transitioning body * {
	cursor: none !important;
}

:root.zen-cursor-enabled::view-transition-group(root),
:root.zen-cursor-enabled::view-transition-old(root),
:root.zen-cursor-enabled::view-transition-new(root),
:root.theme-transitioning::view-transition-group(root),
:root.theme-transitioning::view-transition-old(root),
:root.theme-transitioning::view-transition-new(root) {
	cursor: none !important;
}

.zen-cursor {
	--zen-cursor-accent: var(--sky);
	rotate: 0deg;
	transform-origin: center center;
	position: fixed;
	top: -25px;
	left: -25px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.08);
	outline: 2px dashed var(--sky);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	transition:
		outline 0.35s ease,
		backdrop-filter 0.35s ease,
		background-color 0.35s ease,
		box-shadow 0.35s ease,
		opacity 0.22s ease,
		width 0.22s ease,
		height 0.22s ease;
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.12) inset,
		0 0 22px rgba(142, 240, 255, 0.2);
	pointer-events: none;
	z-index: 10000;
	opacity: 1;
	will-change: translate, rotate;
}

.zen-cursor.is-holding {
	outline-style: dashed;
	animation: zen-cursor-dash-spin 1.8s linear infinite;
}

.zen-cursor.is-chart-compact {
	width: 22px;
	height: 22px;
	top: -11px;
	left: -11px;
	opacity: 0.94;
}

.zen-cursor.cursor-grow {
	outline: 2px solid var(--sky);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.16) inset,
		0 0 30px rgba(142, 240, 255, 0.28);
}

.zen-cursor.blur-mini {
	-webkit-backdrop-filter: blur(0);
	backdrop-filter: blur(0);
}

.zen-cursor.is-logout-alert {
	--zen-cursor-accent: color-mix(in srgb, var(--cursor-alert-color) 88%, #ffffff 12%);
	outline: 2px solid color-mix(in srgb, var(--cursor-alert-color) 86%, #ffffff 14%);
	background-color: color-mix(in srgb, var(--cursor-alert-color) 14%, transparent);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--cursor-alert-color) 24%, #ffffff 76%) inset,
		0 0 30px color-mix(in srgb, var(--cursor-alert-color) 42%, transparent);
}

.zen-cursor.is-logout-alert.cursor-grow {
	outline-color: color-mix(in srgb, var(--cursor-alert-color) 88%, #ffffff 12%);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--cursor-alert-color) 34%, #ffffff 66%) inset,
		0 0 38px color-mix(in srgb, var(--cursor-alert-color) 56%, transparent);
}

.zen-cursor.is-holding.is-logout-alert,
.zen-cursor.is-holding.is-logout-alert.cursor-grow {
	outline-style: dashed;
	outline-color: color-mix(in srgb, var(--cursor-alert-color) 88%, #ffffff 12%);
}

.zen-cursor-text {
	position: fixed;
	text-align: left;
	white-space: nowrap;
	background-color: var(--sky);
	color: var(--bg-dark);
	padding: 0.7rem 0.9rem;
	border-radius: 12px;
	pointer-events: none;
	scale: 0;
	transition: all 0.35s ease;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
	font-size: 0.78rem;
	font-weight: 600;
	line-height: 1.25;
}

.zen-cursor-text.image-view {
	width: 560px;
	height: 300px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	object-fit: cover;
}

:root[data-theme='light'] .zen-cursor {
	--zen-cursor-accent: color-mix(in srgb, var(--sky) 80%, #0d2730 20%);
	background-color: rgba(17, 49, 58, 0.08);
	outline-color: color-mix(in srgb, var(--sky) 80%, #0d2730 20%);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.32) inset,
		0 0 18px color-mix(in srgb, var(--sky) 30%, transparent);
}

:root[data-theme='light'] .zen-cursor.cursor-grow {
	outline-color: color-mix(in srgb, var(--sky) 80%, #0d2730 20%);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.36) inset,
		0 0 24px color-mix(in srgb, var(--sky) 34%, transparent);
}

:root[data-theme='light'] .zen-cursor.is-logout-alert {
	--zen-cursor-accent: color-mix(in srgb, var(--cursor-alert-color) 86%, #401515 14%);
	outline-color: color-mix(in srgb, var(--cursor-alert-color) 86%, #401515 14%);
	background-color: color-mix(in srgb, var(--cursor-alert-color) 16%, transparent);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--cursor-alert-color) 24%, #ffffff 76%) inset,
		0 0 24px color-mix(in srgb, var(--cursor-alert-color) 36%, transparent);
}

:root[data-theme='light'] .zen-cursor.is-logout-alert.cursor-grow {
	outline-color: color-mix(in srgb, var(--cursor-alert-color) 86%, #401515 14%);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--cursor-alert-color) 30%, #ffffff 70%) inset,
		0 0 30px color-mix(in srgb, var(--cursor-alert-color) 44%, transparent);
}

:root[data-theme='light'] .zen-cursor.is-holding,
:root[data-theme='light'] .zen-cursor.is-holding.cursor-grow {
	outline-style: dashed;
	outline-color: color-mix(in srgb, var(--sky) 80%, #0d2730 20%);
}

:root[data-theme='light'] .zen-cursor.is-holding.is-logout-alert,
:root[data-theme='light'] .zen-cursor.is-holding.is-logout-alert.cursor-grow {
	outline-style: dashed;
	outline-color: color-mix(in srgb, var(--cursor-alert-color) 86%, #401515 14%);
}

:root[data-theme='light'] .zen-cursor-text {
	background-color: #1f6072;
	color: #f4f8ee;
}

@media (prefers-reduced-motion: reduce), (pointer: coarse) {
	:root.zen-cursor-enabled,
	:root.zen-cursor-enabled *,
	body.zen-cursor-enabled,
	body.zen-cursor-enabled * {
		cursor: auto;
	}

	.zen-cursor,
	.zen-cursor-text {
		display: none !important;
	}
}

@media screen and (max-width: 500px) {
	.zen-cursor {
		display: none !important;
	}
}

.cards {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.users-kpi-panel {
	padding-top: 14px;
	padding-bottom: 14px;
}

.users-kpi-head {
	margin-bottom: 10px;
}

.users-kpi-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 10px;
}

.users-kpi-card {
	display: grid;
	gap: 4px;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.03);
}

:root[data-theme='light'] .users-kpi-card {
	border-color: rgba(18, 56, 70, 0.28);
	background: rgba(17, 49, 58, 0.05);
}

.users-kpi-label {
	margin: 0;
	font-size: 0.74rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ink-muted);
}

.users-kpi-value {
	margin: 0;
	font-size: 1.28rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: var(--ink);
}

.card,
.panel {
	background:
		linear-gradient(160deg, rgba(142, 240, 255, 0.03), rgba(255, 157, 182, 0.02) 35%, rgba(135, 240, 193, 0.03) 100%),
		rgba(8, 18, 23, 0.86);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 16px;
}

.card h2,
.panel h2 {
	margin: 0;
	font-size: 0.95rem;
	color: var(--ink-muted);
}

.value {
	margin: 10px 0;
	font-size: 1.45rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.muted {
	margin: 6px 0 0;
	font-size: 0.9rem;
	color: var(--ink-muted);
}

.bar {
	height: 8px;
	background: rgba(255, 255, 255, 0.08);
	border-radius: 99px;
	overflow: hidden;
}

.bar i {
	display: block;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--mint), var(--amber));
	transition: width 0.35s ease;
}

.status-chart {
	width: 100%;
	height: 72px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 8px;
	background: linear-gradient(180deg, rgba(142, 240, 255, 0.07), rgba(3, 9, 12, 0.15) 40%), rgba(3, 9, 12, 0.55);
	display: block;
}

:root[data-theme='light'] .status-chart {
	border-color: rgba(24, 76, 92, 0.24);
	background:
		linear-gradient(180deg, rgba(142, 207, 255, 0.24), rgba(188, 227, 247, 0.16) 42%, rgba(255, 255, 255, 0.78) 100%),
		rgba(255, 255, 255, 0.78);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.66) inset;
}

.panel-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}

.actions {
	display: flex;
	gap: 8px;
	align-items: center;
}

button,
input,
select {
	border: 1px solid var(--line);
	background: rgba(255, 255, 255, 0.04);
	color: var(--ink);
	padding: 8px 12px;
	border-radius: 8px;
	font: inherit;
}

[data-tooltip] {
	position: relative;
}

.custom-tooltip {
	position: fixed;
	left: 0;
	top: 0;
	max-width: min(320px, calc(100vw - 16px));
	padding: 7px 9px;
	border-radius: 8px;
	background: linear-gradient(165deg, rgba(4, 12, 16, 0.94), rgba(8, 23, 31, 0.95));
	border: 1px solid rgba(142, 240, 255, 0.28);
	box-shadow:
		0 8px 20px rgba(0, 0, 0, 0.32),
		0 0 0 1px rgba(255, 255, 255, 0.04) inset;
	color: var(--ink);
	font-size: 0.72rem;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: 0.01em;
	text-align: center;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: normal;
	opacity: 0;
	pointer-events: none;
	transform: translateY(4px);
	transition:
		opacity 0.14s ease,
		transform 0.14s ease;
	z-index: 2200;
	visibility: hidden;
}

.custom-tooltip.visible {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
}

.custom-tooltip::after {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
}

.custom-tooltip[data-placement='top']::after {
	top: 100%;
	border-top: 6px solid rgba(8, 23, 31, 0.95);
}

.custom-tooltip[data-placement='bottom']::after {
	bottom: 100%;
	border-bottom: 6px solid rgba(8, 23, 31, 0.95);
}

.chart-hover-tooltip {
	position: fixed;
	left: 0;
	top: 0;
	padding: 7px 10px;
	border-radius: 9px;
	background: linear-gradient(165deg, rgba(4, 12, 16, 0.94), rgba(8, 23, 31, 0.95));
	border: 1px solid rgba(142, 240, 255, 0.26);
	box-shadow:
		0 8px 20px rgba(0, 0, 0, 0.32),
		0 0 0 1px rgba(255, 255, 255, 0.04) inset;
	color: var(--ink);
	font-size: 0.74rem;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.01em;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transform: translateY(4px);
	transition:
		opacity 0.12s ease,
		transform 0.12s ease;
	z-index: 2300;
	visibility: hidden;
}

.chart-hover-tooltip.visible {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
}

:root[data-theme='light'] .custom-tooltip {
	background: linear-gradient(165deg, rgba(244, 251, 255, 0.98), rgba(232, 245, 249, 0.98));
	border: 1px solid rgba(45, 120, 143, 0.36);
	box-shadow:
		0 8px 18px rgba(16, 57, 69, 0.14),
		0 0 0 1px rgba(255, 255, 255, 0.62) inset;
	color: #12333d;
}

:root[data-theme='light'] .custom-tooltip[data-placement='top']::after {
	border-top-color: rgba(236, 247, 252, 0.98);
}

:root[data-theme='light'] .custom-tooltip[data-placement='bottom']::after {
	border-bottom-color: rgba(236, 247, 252, 0.98);
}

:root[data-theme='light'] .chart-hover-tooltip {
	background: linear-gradient(165deg, rgba(244, 251, 255, 0.98), rgba(232, 245, 249, 0.98));
	border: 1px solid rgba(45, 120, 143, 0.34);
	box-shadow:
		0 8px 18px rgba(16, 57, 69, 0.14),
		0 0 0 1px rgba(255, 255, 255, 0.62) inset;
	color: #12333d;
}

button:hover {
	cursor: pointer;
	border-color: var(--mint);
}

button:disabled {
	cursor: not-allowed;
	pointer-events: none;
	opacity: 0.68;
}

input,
select {
	min-width: 240px;
}

.console {
	margin: 0;
	min-height: 260px;
	max-height: 360px;
	overflow: auto;
	white-space: pre-wrap;
	font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
	font-size: 0.82rem;
	line-height: 1.5;
	color: var(--console-text);
	background:
		linear-gradient(165deg, rgba(142, 240, 255, 0.08), rgba(135, 240, 193, 0.04) 36%, rgba(255, 199, 157, 0.05) 100%),
		rgba(11, 26, 33, 0.84);
	border: 1px solid rgba(255, 255, 255, 0.18);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04) inset;
	border-radius: 10px;
	padding: 12px;
}

:root[data-theme='light'] .hero,
:root[data-theme='light'] .card,
:root[data-theme='light'] .panel,
:root[data-theme='light'] .commands-wrap,
:root[data-theme='light'] .audit-wrap,
:root[data-theme='light'] .category-group,
:root[data-theme='light'] .command-card,
:root[data-theme='light'] .users-bulk-toolbar,
:root[data-theme='light'] .dashboard-footer,
:root[data-theme='light'] .section-state,
:root[data-theme='light'] .confirm-card {
	background: rgba(255, 255, 255, 0.78);
	border-color: rgba(18, 56, 70, 0.16);
	box-shadow: 0 8px 20px rgba(16, 57, 69, 0.08);
}

:root[data-theme='light'] .hero-badge,
:root[data-theme='light'] .user-select-row,
:root[data-theme='light'] .readonly-chip {
	background: rgba(17, 49, 58, 0.08);
	border-color: rgba(17, 49, 58, 0.18);
}

:root[data-theme='light'] .console {
	background:
		linear-gradient(160deg, rgba(142, 207, 255, 0.22), rgba(135, 240, 193, 0.12) 42%, rgba(255, 199, 157, 0.12) 100%),
		rgba(255, 255, 255, 0.92);
	border-color: rgba(18, 56, 70, 0.2);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.55) inset,
		0 6px 16px rgba(16, 57, 69, 0.08);
}

:root[data-theme='light'] button,
:root[data-theme='light'] select {
	border-color: rgba(17, 49, 58, 0.3);
	background: rgba(17, 49, 58, 0.05);
}

:root[data-theme='light'] button:hover,
:root[data-theme='light'] select:hover {
	border-color: rgba(45, 143, 121, 0.62);
}

:root[data-theme='light'] .custom-select-trigger {
	border-color: rgba(17, 49, 58, 0.32);
	background: linear-gradient(160deg, rgba(142, 207, 255, 0.1), rgba(135, 240, 193, 0.06)), rgba(17, 49, 58, 0.05);
	box-shadow: 0 0 0 1px rgba(17, 49, 58, 0.08) inset;
}

:root[data-theme='light'] #confirm-cancel {
	border-color: rgba(17, 49, 58, 0.3);
	background: rgba(17, 49, 58, 0.06);
}

.section-state {
	display: grid;
	gap: 8px;
	padding: 10px 12px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	background: rgba(3, 9, 12, 0.55);
	margin-bottom: 10px;
}

.section-state.hidden {
	display: none;
}

.section-state-title {
	font-size: 0.84rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--ink);
}

.section-state-message {
	font-size: 0.78rem;
	color: var(--ink-muted);
	line-height: 1.4;
}

.section-state-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.section-state-actions button {
	padding: 6px 10px;
	font-size: 0.75rem;
	border-radius: 999px;
}

.section-state-loading {
	border-color: rgba(142, 207, 255, 0.36);
	background: linear-gradient(145deg, rgba(142, 207, 255, 0.1), rgba(3, 9, 12, 0.58));
}

.section-state-empty {
	border-color: rgba(255, 255, 255, 0.2);
}

.section-state-error {
	border-color: rgba(255, 142, 116, 0.46);
	background: linear-gradient(145deg, rgba(255, 142, 116, 0.12), rgba(3, 9, 12, 0.6));
}

.section-state-error .section-state-title {
	color: #ffd8cf;
}

.section-skeleton {
	display: grid;
	gap: 8px;
	margin-top: 4px;
}

.section-skeleton-console,
.section-skeleton-audit {
	padding: 2px 0;
}

.section-skeleton-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
}

.section-skeleton-card,
.section-skeleton-item {
	display: grid;
	gap: 6px;
	padding: 8px;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.09);
	background: rgba(255, 255, 255, 0.02);
}

.section-skeleton-line {
	height: 10px;
	border-radius: 999px;
	background: linear-gradient(
		100deg,
		rgba(255, 255, 255, 0.05) 0%,
		rgba(142, 207, 255, 0.22) 50%,
		rgba(255, 255, 255, 0.05) 100%
	);
	background-size: 220% 100%;
	animation: section-skeleton-wave 1.3s ease-in-out infinite;
}

.section-skeleton-line.w-95 {
	width: 95%;
}

.section-skeleton-line.w-92 {
	width: 92%;
}

.section-skeleton-line.w-90 {
	width: 90%;
}

.section-skeleton-line.w-88 {
	width: 88%;
}

.section-skeleton-line.w-86 {
	width: 86%;
}

.section-skeleton-line.w-85 {
	width: 85%;
}

.section-skeleton-line.w-80 {
	width: 80%;
}

.section-skeleton-line.w-78 {
	width: 78%;
}

.section-skeleton-line.w-76 {
	width: 76%;
}

.section-skeleton-line.w-70 {
	width: 70%;
}

.section-skeleton-line.w-66 {
	width: 66%;
}

.section-skeleton-line.w-60 {
	width: 60%;
}

.section-skeleton-line.w-58 {
	width: 58%;
}

.section-skeleton-line.w-50 {
	width: 50%;
}

.section-skeleton-line.w-45 {
	width: 45%;
}

.section-skeleton-line.w-42 {
	width: 42%;
}

.section-skeleton-line.w-40 {
	width: 40%;
}

.section-skeleton-line.w-35 {
	width: 35%;
}

.section-skeleton-line.w-28 {
	width: 28%;
}

@keyframes section-skeleton-wave {
	0% {
		background-position: 160% 0;
	}

	100% {
		background-position: -60% 0;
	}
}

.audit-filters {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.audit-action-separator,
.audit-role-separator {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 14px;
	height: 24px;
	padding: 0 4px;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--line);
	line-height: 1;
	user-select: none;
	cursor: pointer;
}

.audit-action-separator:hover,
.audit-role-separator:hover {
	color: var(--line);
}

.audit-action-extra,
.audit-role-extra {
	max-width: 220px;
	min-width: 0;
	overflow: hidden;
	white-space: nowrap;
	opacity: 1;
	transform: translateX(0) scale(1);
	transform-origin: left center;
	transition:
		max-width 0.3s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.2s ease,
		transform 0.26s cubic-bezier(0.22, 1, 0.36, 1),
		padding 0.24s ease,
		margin 0.24s ease,
		border-color 0.2s ease,
		background-color 0.2s ease;
}

#audit-action-chips.is-collapsed .audit-action-extra {
	max-width: 0;
	opacity: 0;
	transform: translateX(-6px) scale(0.96);
	padding-left: 0;
	padding-right: 0;
	margin-left: 0;
	margin-right: 0;
	border-color: transparent;
	pointer-events: none;
}

#audit-role-chips.is-collapsed .audit-role-extra {
	max-width: 0;
	opacity: 0;
	transform: translateX(-6px) scale(0.96);
	padding-left: 0;
	padding-right: 0;
	margin-left: 0;
	margin-right: 0;
	border-color: transparent;
	pointer-events: none;
}

#audit-action-chips.is-collapsed,
#audit-role-chips.is-collapsed {
	gap: 0;
}

#audit-action-chips.is-collapsed .audit-action-separator,
#audit-role-chips.is-collapsed .audit-role-separator {
	margin-left: 6px;
}

.audit-filters input {
	min-width: min(360px, 100%);
	width: min(360px, 100%);
}

:root[data-theme='light'] .audit-action-separator,
:root[data-theme='light'] .audit-role-separator {
	color: rgba(26, 57, 68, 0.78);
}

:root[data-theme='light'] .audit-action-separator:hover,
:root[data-theme='light'] .audit-role-separator:hover {
	color: #14353e;
}

#audit-clear-filters,
#clear-console {
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 0.74rem;
	letter-spacing: 0.03em;
	border: 1px solid rgba(255, 255, 255, 0.25);
	background: rgba(255, 255, 255, 0.04);
	color: var(--ink-muted);
}

#audit-clear-filters:hover,
#clear-console:hover {
	border-color: rgba(255, 110, 110, 0.6);
	background: rgba(255, 110, 110, 0.08);
	color: var(--ink);
}

:root[data-theme='light'] #audit-clear-filters,
:root[data-theme='light'] #clear-console {
	border-color: rgba(17, 49, 58, 0.38);
	background: rgba(17, 49, 58, 0.05);
	color: #2a4750;
}

:root[data-theme='light'] #audit-clear-filters:hover,
:root[data-theme='light'] #clear-console:hover {
	border-color: rgba(183, 79, 79, 0.62);
	background: rgba(209, 92, 92, 0.14);
	color: #1f3136;
}

#audit-clear-filters:disabled {
	opacity: 0.55;
	pointer-events: none;
}

.audit-chips {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.audit-chip {
	padding: 5px 9px;
	font-size: 0.76rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.22);
	background: rgba(255, 255, 255, 0.03);
	color: var(--ink-muted);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	line-height: 1;
}

.audit-chip-count {
	min-width: 20px;
	height: 16px;
	padding: 0 5px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.67rem;
	font-weight: 600;
	background: rgba(255, 255, 255, 0.11);
	color: var(--ink);
}

.audit-chip:hover {
	border-color: rgba(142, 240, 255, 0.55);
	background: rgba(142, 240, 255, 0.08);
	color: var(--ink);
}

.audit-chip.is-active {
	border-color: rgba(135, 240, 193, 0.55);
	background: linear-gradient(120deg, rgba(135, 240, 193, 0.22), rgba(142, 207, 255, 0.18));
	color: var(--ink);
}

.audit-chip.is-active .audit-chip-count {
	background: rgba(255, 255, 255, 0.2);
}

#audit-action-chips .audit-chip.is-active .audit-chip-count {
	background: rgba(135, 240, 193, 0.24);
	border: 1px solid rgba(135, 240, 193, 0.44);
	color: var(--mint);
}

#audit-role-chips .audit-chip.is-active .audit-chip-count {
	background: rgba(142, 207, 255, 0.24);
	border: 1px solid rgba(142, 207, 255, 0.44);
	color: var(--sky);
}

.audit-chips.is-disabled .audit-chip {
	opacity: 0.55;
	pointer-events: none;
}

.audit-wrap {
	border: 1px solid var(--line);
	border-radius: 10px;
	max-height: 320px;
	overflow: auto;
	padding: 8px;
	background: rgba(3, 9, 12, 0.62);
}

.audit-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 8px;
}

.audit-item {
	border: 1px solid rgba(255, 255, 255, 0.09);
	border-radius: 10px;
	padding: 8px 10px;
	background: rgba(255, 255, 255, 0.02);
	display: grid;
	gap: 5px;
}

.audit-item.failed {
	border-color: rgba(255, 142, 116, 0.4);
}

.audit-item.ok {
	border-color: rgba(135, 240, 193, 0.25);
}

.audit-topline {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.76rem;
	color: var(--ink-muted);
	flex-wrap: wrap;
}

.audit-role {
	padding: 3px 7px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	font-size: 0.7rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.audit-role.owner {
	border-color: rgba(135, 240, 193, 0.45);
	color: var(--mint);
}

.audit-role.viewer {
	border-color: rgba(142, 207, 255, 0.45);
	color: var(--sky);
}

.audit-role.system {
	border-color: rgba(255, 209, 102, 0.45);
	color: var(--amber);
}

.audit-main {
	font-size: 0.84rem;
	line-height: 1.4;
	color: var(--ink);
	word-break: break-word;
}

.audit-main .target {
	color: var(--ice);
}

.audit-main .status.failed {
	color: var(--salmon);
}

.audit-main .status.ok {
	color: var(--mint);
}

.audit-message {
	font-size: 0.76rem;
	color: var(--ink-muted);
	word-break: break-word;
}

.toast-host {
	position: fixed;
	right: 16px;
	bottom: 16px;
	display: grid;
	gap: 8px;
	z-index: 1200;
	pointer-events: auto;
}

.toast {
	min-width: 220px;
	max-width: min(360px, calc(100vw - 32px));
	padding: 10px 12px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(8, 18, 23, 0.96);
	color: var(--ink);
	font-size: 0.84rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	opacity: 0;
	transform: translateY(8px);
	transition:
		opacity 0.2s ease,
		transform 0.2s ease;
	pointer-events: auto;
}

.toast-text {
	flex: 1;
	min-width: 0;
	word-break: break-word;
}

.toast-action {
	padding: 5px 10px;
	border-radius: 999px;
	border: 1px solid rgba(142, 207, 255, 0.45);
	background: rgba(142, 207, 255, 0.14);
	color: var(--ink);
	font-size: 0.74rem;
	line-height: 1;
	white-space: nowrap;
	pointer-events: auto;
}

.toast-action:hover {
	border-color: rgba(142, 240, 255, 0.7);
	background: rgba(142, 240, 255, 0.22);
}

.toast.visible {
	opacity: 1;
	transform: translateY(0);
}

.toast-success {
	border-color: rgba(135, 240, 193, 0.45);
}

.toast-error {
	border-color: rgba(255, 142, 116, 0.5);
}

.toast-warning {
	border-color: rgba(255, 209, 102, 0.58);
	background: linear-gradient(160deg, rgba(255, 209, 102, 0.14), rgba(8, 18, 23, 0.96) 35%);
}

.toast-warning .toast-action {
	border-color: rgba(255, 209, 102, 0.65);
	background: rgba(255, 209, 102, 0.18);
}

.toast-warning .toast-action:hover {
	border-color: rgba(255, 227, 162, 0.8);
	background: rgba(255, 209, 102, 0.28);
}

.toast-danger {
	border-color: rgba(255, 142, 116, 0.62);
	background: linear-gradient(160deg, rgba(255, 142, 116, 0.16), rgba(8, 18, 23, 0.96) 35%);
}

.toast-danger .toast-action {
	border-color: rgba(255, 142, 116, 0.7);
	background: rgba(255, 142, 116, 0.2);
}

.toast-danger .toast-action:hover {
	border-color: rgba(255, 182, 162, 0.86);
	background: rgba(255, 142, 116, 0.3);
}

.commands-wrap {
	overflow: auto;
	max-height: 620px;
	border: 1px solid var(--line);
	border-radius: 10px;
	padding: 10px;
	background: rgba(2, 8, 10, 0.45);
}

.folder-switcher {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 8px 10px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 14px;
	background:
		linear-gradient(90deg, rgba(142, 240, 255, 0.06), rgba(135, 240, 193, 0.04) 48%, rgba(255, 199, 157, 0.05) 100%),
		rgba(255, 255, 255, 0.02);
	margin-bottom: 10px;
	flex-wrap: wrap;
}

.folder-search {
	margin-left: 0;
	min-width: min(360px, 100%);
	width: min(360px, 100%);
}

.folder-filters {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-wrap: wrap;
	margin-left: auto;
}

.folder-filter {
	position: relative;
	min-width: 170px;
	height: 36px;
}

.custom-select-trigger {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 6px 12px;
	font-family: inherit;
	font-size: 0.76rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	color: var(--ink);
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	background: linear-gradient(160deg, rgba(142, 240, 255, 0.08), rgba(135, 240, 193, 0.05)), rgba(255, 255, 255, 0.05);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04) inset;
	transition:
		border-color 0.18s ease,
		background 0.18s ease,
		box-shadow 0.18s ease,
		transform 0.14s ease;
}

.custom-select-trigger:hover {
	border-color: rgba(142, 240, 255, 0.5);
	background: linear-gradient(160deg, rgba(142, 240, 255, 0.14), rgba(135, 240, 193, 0.1)), rgba(255, 255, 255, 0.07);
}

.custom-select-trigger:focus,
.custom-select-trigger:focus-visible {
	outline: none;
	border-color: rgba(135, 240, 193, 0.65);
	background: linear-gradient(160deg, rgba(142, 240, 255, 0.18), rgba(135, 240, 193, 0.12)), rgba(255, 255, 255, 0.08);
	box-shadow:
		0 0 0 1px rgba(135, 240, 193, 0.18) inset,
		0 0 0 3px rgba(135, 240, 193, 0.14);
}

.custom-select-label {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.custom-select-caret {
	width: 9px;
	height: 9px;
	border-right: 2px solid rgba(244, 248, 238, 0.84);
	border-bottom: 2px solid rgba(244, 248, 238, 0.84);
	transform: translateY(-1px) rotate(45deg);
	transition: transform 0.18s ease;
}

.custom-select-menu {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	right: 0;
	display: grid;
	gap: 4px;
	padding: 7px;
	border-radius: 12px;
	border: 1px solid rgba(142, 240, 255, 0.35);
	background: linear-gradient(160deg, rgba(12, 30, 38, 0.98), rgba(7, 20, 26, 0.99)), rgba(10, 24, 31, 0.98);
	box-shadow:
		0 16px 30px rgba(0, 0, 0, 0.38),
		0 0 0 1px rgba(255, 255, 255, 0.05) inset;
	opacity: 0;
	pointer-events: none;
	transform: translateY(-4px) scale(0.98);
	transform-origin: top center;
	transition:
		opacity 0.14s ease,
		transform 0.14s ease;
	z-index: 900;
}

.custom-select-option {
	width: 100%;
	display: flex;
	align-items: center;
	padding: 7px 10px;
	border-radius: 8px;
	border: 1px solid transparent;
	background: transparent;
	color: rgba(244, 248, 238, 0.9);
	font-family: inherit;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-align: left;
}

.custom-select-option:hover {
	border-color: rgba(142, 240, 255, 0.36);
	background: rgba(142, 240, 255, 0.14);
}

.custom-select-option.is-selected {
	border-color: rgba(135, 240, 193, 0.46);
	background: linear-gradient(120deg, rgba(135, 240, 193, 0.24), rgba(142, 207, 255, 0.18));
	color: #f5fff8;
}

.custom-select.is-open .custom-select-trigger {
	border-color: rgba(135, 240, 193, 0.72);
	background: linear-gradient(160deg, rgba(142, 240, 255, 0.2), rgba(135, 240, 193, 0.16)), rgba(255, 255, 255, 0.08);
	box-shadow:
		0 0 0 1px rgba(135, 240, 193, 0.2) inset,
		0 0 0 3px rgba(135, 240, 193, 0.16);
}

.custom-select.is-open .custom-select-caret {
	transform: translateY(1px) rotate(-135deg);
}

.custom-select.is-open .custom-select-menu {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

:root[data-theme='light'] .custom-select-trigger {
	color: #213b43;
	border-color: rgba(17, 49, 58, 0.36);
	background: linear-gradient(160deg, rgba(198, 232, 247, 0.26), rgba(192, 235, 220, 0.18)), rgba(255, 255, 255, 0.84);
	box-shadow:
		0 0 0 1px rgba(17, 49, 58, 0.08) inset,
		0 4px 10px rgba(16, 57, 69, 0.06);
}

:root[data-theme='light'] .custom-select-trigger:hover {
	border-color: rgba(45, 120, 143, 0.52);
	background: linear-gradient(160deg, rgba(206, 236, 250, 0.34), rgba(201, 241, 227, 0.24)), rgba(255, 255, 255, 0.9);
}

:root[data-theme='light'] .custom-select-trigger:focus,
:root[data-theme='light'] .custom-select-trigger:focus-visible {
	border-color: rgba(45, 120, 143, 0.62);
	box-shadow:
		0 0 0 1px rgba(45, 120, 143, 0.2) inset,
		0 0 0 3px rgba(45, 120, 143, 0.14);
}

:root[data-theme='light'] .custom-select-caret {
	border-right-color: rgba(26, 57, 68, 0.82);
	border-bottom-color: rgba(26, 57, 68, 0.82);
}

:root[data-theme='light'] .custom-select-menu {
	border-color: rgba(24, 76, 92, 0.26);
	background: linear-gradient(160deg, rgba(246, 252, 255, 0.98), rgba(234, 247, 252, 0.98)), rgba(245, 251, 255, 0.98);
	box-shadow:
		0 14px 26px rgba(16, 57, 69, 0.12),
		0 0 0 1px rgba(255, 255, 255, 0.74) inset;
}

:root[data-theme='light'] .custom-select-option {
	color: #24414a;
}

:root[data-theme='light'] .custom-select-option:hover {
	border-color: rgba(45, 120, 143, 0.34);
	background: rgba(142, 207, 255, 0.2);
}

:root[data-theme='light'] .custom-select-option.is-selected {
	border-color: rgba(45, 143, 121, 0.42);
	background: linear-gradient(120deg, rgba(98, 194, 165, 0.2), rgba(142, 207, 255, 0.2));
	color: #14353e;
}

.folder-filter.hidden {
	display: none;
}

.search-hit {
	padding: 0 2px;
	border-radius: 4px;
	background: rgba(255, 209, 102, 0.3);
	color: #fff4cf;
	box-shadow: 0 0 0 1px rgba(255, 209, 102, 0.35) inset;
}

.folder-path {
	display: inline-flex;
	align-items: center;
	padding: 6px 8px;
	border: 1px solid var(--ui-border-soft);
	border-radius: 999px;
	background: color-mix(in srgb, var(--bg-mid) 78%, transparent);
	color: var(--ink-muted);
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

.folder-divider {
	color: var(--line);
	font-weight: 700;
	font-size: 0.82rem;
	user-select: none;
	pointer-events: none;
}

.folder-path:hover {
	border-color: var(--ui-border-accent);
	color: var(--ink);
	background: linear-gradient(
		120deg,
		color-mix(in srgb, var(--sky) 16%, transparent),
		color-mix(in srgb, var(--mint) 10%, transparent)
	);
}

.folder-path.is-active {
	color: var(--ink);
	font-weight: 700;
	border-color: var(--ui-border-accent-strong);
	background: linear-gradient(
		120deg,
		color-mix(in srgb, var(--mint) 22%, transparent),
		color-mix(in srgb, var(--sky) 18%, transparent)
	);
}

:root[data-theme='light'] .folder-path {
	border-color: var(--ui-border-soft);
	background: color-mix(in srgb, var(--bg-mid) 86%, transparent);
	color: var(--ink-muted);
}

:root[data-theme='light'] .folder-path:hover {
	border-color: var(--ui-border-accent);
	background: linear-gradient(
		120deg,
		color-mix(in srgb, var(--sky) 24%, transparent),
		color-mix(in srgb, var(--mint) 16%, transparent)
	);
	color: var(--ink);
}

:root[data-theme='light'] .folder-path.is-active {
	border-color: var(--ui-border-accent-strong);
	background: linear-gradient(
		120deg,
		color-mix(in srgb, var(--mint) 24%, transparent),
		color-mix(in srgb, var(--sky) 24%, transparent)
	);
	color: var(--ink);
}

:root[data-theme='light'] .folder-divider {
	color: rgba(26, 57, 68, 0.8);
}

.controls-view {
	display: grid;
	gap: 10px;
}

.users-bulk-toolbar {
	display: grid;
	gap: 8px;
	padding: 10px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 10px;
	background:
		linear-gradient(120deg, rgba(142, 240, 255, 0.06), rgba(135, 240, 193, 0.04) 45%, rgba(255, 209, 102, 0.05)),
		rgba(255, 255, 255, 0.02);
}

.users-bulk-summary,
.users-bulk-actions,
.users-bulk-limit-row {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.users-bulk-count {
	padding: 5px 9px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	background: rgba(255, 255, 255, 0.06);
	font-size: 0.76rem;
	letter-spacing: 0.02em;
	color: var(--ink);
}

.users-bulk-limit-row input {
	min-width: 88px;
	width: 88px;
	text-align: center;
}

.users-bulk-toolbar button {
	padding: 6px 10px;
	font-size: 0.76rem;
	border-radius: 999px;
}

.users-bulk-toolbar button:disabled,
.users-bulk-toolbar input:disabled {
	opacity: 0.55;
	pointer-events: none;
}

.settings-panel {
	display: grid;
	gap: 10px;
}

.settings-summary {
	margin: 0;
	font-size: 0.78rem;
}

.settings-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.settings-field {
	display: grid;
	gap: 6px;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background: rgba(255, 255, 255, 0.02);
}

.settings-field span {
	font-size: 0.76rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--ink-muted);
}

.settings-field input {
	min-width: 0;
	width: 100%;
	height: 34px;
	font-size: 0.85rem;
	padding: 6px 10px;
}

.settings-custom-select {
	position: relative;
	width: 100%;
	height: 34px;
	min-width: 0;
}

.settings-custom-select .custom-select-trigger {
	height: 34px;
	font-size: 0.85rem;
}

.settings-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	flex-wrap: wrap;
}

.settings-actions button {
	padding: 7px 11px;
	font-size: 0.78rem;
	border-radius: 999px;
}

.controls-actions {
	justify-content: flex-end;
}

.commands-groups {
	display: grid;
	gap: 12px;
}

.category-group {
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.02);
	overflow: hidden;
}

.category-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
	background: linear-gradient(90deg, rgba(142, 240, 255, 0.06), rgba(255, 199, 157, 0.04));
	color: var(--ink-muted);
	font-size: 0.8rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.category-head strong {
	font-size: 0.83rem;
	color: var(--ink);
	letter-spacing: 0.05em;
}

.category-toggle {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border: 0;
	background: transparent;
	text-align: left;
	color: inherit;
	text-transform: inherit;
	letter-spacing: inherit;
	font-size: inherit;
}

.category-toggle:hover {
	border-color: transparent;
	background: rgba(255, 255, 255, 0.03);
}

.category-caret {
	margin-left: auto;
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--ink-muted);
	border-bottom: 2px solid var(--ink-muted);
	transform: rotate(45deg);
	transition: transform 0.2s ease;
}

.category-group.collapsed .category-caret {
	transform: rotate(-45deg);
}

.commands-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	padding: 10px;
}

.category-group.collapsed .commands-grid {
	display: none;
}

.command-card {
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	padding: 10px;
	background: rgba(6, 15, 18, 0.85);
	display: grid;
	gap: 8px;
	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease;
}

.command-card.enabled {
	border-color: rgba(135, 240, 193, 0.2);
}

.command-card.disabled {
	border-color: rgba(255, 142, 116, 0.24);
}

.command-card.enabled:hover {
	border-color: rgba(135, 240, 193, 0.52);
	box-shadow:
		0 0 0 1px rgba(135, 240, 193, 0.2),
		0 0 18px rgba(135, 240, 193, 0.18);
	transform: translateY(-1px);
}

.command-card.disabled:hover {
	border-color: rgba(255, 142, 116, 0.56);
	box-shadow:
		0 0 0 1px rgba(255, 142, 116, 0.2),
		0 0 18px rgba(255, 142, 116, 0.18);
	transform: translateY(-1px);
}

.command-card.selected {
	border-color: rgba(142, 207, 255, 0.58);
	box-shadow:
		0 0 0 1px rgba(142, 207, 255, 0.22),
		0 0 16px rgba(142, 207, 255, 0.16);
}

.command-card-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
}

.user-head-actions {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.command-name {
	font-size: 0.94rem;
	letter-spacing: 0.02em;
}

.command-aliases {
	margin: 0;
	font-size: 0.8rem;
	color: var(--ink-muted);
	word-break: break-word;
}

.command-aliases span {
	color: var(--ink);
}

.command-meta {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	font-size: 0.77rem;
	color: var(--ink-muted);
}

.command-actions {
	display: flex;
	justify-content: flex-end;
}

.user-actions {
	justify-content: stretch;
}

.user-limit-row {
	display: grid;
	grid-template-columns: 48px 44px minmax(92px, 1fr) 44px 48px;
	gap: 8px;
	width: 100%;
	align-items: center;
}

.user-limit-input {
	min-width: 92px;
	width: 100%;
	text-align: center;
	appearance: textfield;
}

.user-limit-input::-webkit-outer-spin-button,
.user-limit-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.user-limit-step {
	padding: 6px 8px;
	font-size: 0.78rem;
}

.users-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.user-toggle-row {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: 100%;
}

.user-select-row {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.72rem;
	color: var(--ink-muted);
	padding: 3px 7px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	background: rgba(255, 255, 255, 0.04);
}

.user-select-row input {
	min-width: 0;
	width: 14px;
	height: 14px;
	padding: 0;
	margin: 0;
	accent-color: var(--sky);
}

.empty-commands {
	margin: 0;
	padding: 14px;
	border-radius: 8px;
	border: 1px dashed rgba(255, 255, 255, 0.2);
	color: var(--ink-muted);
	text-align: center;
}

.readonly-chip {
	font-size: 0.74rem;
	padding: 5px 8px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: var(--ink-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.dashboard-footer {
	background: none;
	border: none;
	border-radius: 0;
	padding: 18px 0 10px 0;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 4px;
	box-shadow: none;
}

.footer-actions {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 18px;
	margin-bottom: 4px;
}

.footer-action-link {
	background: none;
	border: none;
	color: var(--ink-muted);
	font-size: 0.92rem;
	font-weight: 500;
	padding: 0 2px;
	margin: 0;
	cursor: pointer;
	text-decoration: none;
	border-radius: 4px;
	transition:
		color 0.18s,
		background 0.18s;
}
.footer-action-link:hover,
.footer-action-link:focus-visible {
	color: var(--sky);
	background: rgba(142, 207, 255, 0.08);
	outline: none;
}

.confirm-overlay {
	position: fixed;
	inset: 0;
	z-index: 2400;
	background: rgba(3, 10, 14, 0.7);
	backdrop-filter: blur(3px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 14px;
}

.confirm-overlay.hidden {
	display: none;
}

.confirm-card {
	width: min(460px, 100%);
	border-radius: 14px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: linear-gradient(155deg, rgba(255, 142, 116, 0.12), rgba(8, 18, 23, 0.95) 28%), rgba(8, 18, 23, 0.95);
	padding: 14px;
	display: grid;
	gap: 10px;
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
}

.confirm-card h3 {
	margin: 0;
	font-size: 1rem;
	letter-spacing: 0.02em;
}

.confirm-card p {
	margin: 0;
	font-size: 0.84rem;
	line-height: 1.45;
	color: var(--ink-muted);
}

.changelog-dialog {
	z-index: 2450;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.22s ease;
}

.changelog-dialog.is-visible {
	opacity: 1;
	pointer-events: auto;
}

.changelog-card {
	width: min(760px, 100%);
	max-height: min(82vh, 860px);
	display: grid;
	grid-template-rows: auto auto minmax(0, 1fr);
	gap: 8px;
	background: linear-gradient(160deg, rgba(142, 207, 255, 0.12), rgba(8, 18, 23, 0.95) 24%), rgba(8, 18, 23, 0.95);
	opacity: 0;
	transform: translateY(16px) scale(0.98);
	transition:
		opacity 0.22s ease,
		transform 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

.changelog-dialog.is-visible .changelog-card {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.changelog-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}

.changelog-head h3 {
	margin: 0;
}

.changelog-head button {
	border-color: rgba(255, 255, 255, 0.28);
	background: rgba(255, 255, 255, 0.07);
}

.changelog-meta {
	margin: 0;
	font-size: 0.78rem;
	color: var(--ink-muted);
}

.changelog-content {
	overflow: auto;
	display: grid;
	gap: 10px;
	padding-right: 2px;
}

.contributors-card {
	background: linear-gradient(160deg, rgba(135, 240, 193, 0.1), rgba(8, 18, 23, 0.95) 24%), rgba(8, 18, 23, 0.95);
}

.contributors-content {
	gap: 12px;
}

.contributors-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.contributor-item {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	align-items: center;
	gap: 10px;
	padding: 10px;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.03);
}

.contributor-avatar {
	width: 56px;
	height: 56px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.26);
	object-fit: cover;
	background: rgba(255, 255, 255, 0.05);
}

.contributor-avatar-fallback {
	background: linear-gradient(130deg, rgba(142, 240, 255, 0.2), rgba(135, 240, 193, 0.2));
}

.contributor-info {
	display: grid;
	gap: 2px;
	min-width: 0;
}

.contributor-name {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 700;
	color: var(--ink);
	overflow-wrap: anywhere;
}

.contributor-link {
	font-size: 0.79rem;
	font-weight: 600;
	width: fit-content;
}

.contributor-link-muted {
	margin: 0;
	font-size: 0.79rem;
	color: var(--ink-muted);
}

.contributor-commits {
	margin: 0;
	font-size: 0.74rem;
	color: var(--ink-muted);
	letter-spacing: 0.01em;
}

.changelog-release {
	margin: 4px 0 0;
	font-size: 0.95rem;
	color: var(--ink);
}

.changelog-section {
	margin: 0;
	font-size: 0.82rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--ink-muted);
}

.changelog-list {
	margin: 0;
	padding-left: 18px;
	display: grid;
	gap: 6px;
	font-size: 0.83rem;
	line-height: 1.45;
	color: var(--ink);
}

.changelog-separator {
	margin: 3px 0;
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.changelog-note {
	margin: 0;
	font-size: 0.82rem;
	line-height: 1.45;
	color: var(--ink-muted);
}

.changelog-release code,
.changelog-section code,
.changelog-list code,
.changelog-note code {
	padding: 1px 5px;
	border-radius: 6px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.16);
	font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
	font-size: 0.76rem;
	color: var(--ice);
}

.changelog-code {
	margin: 0;
	padding: 12px 14px;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.24);
	background: rgba(0, 0, 0, 0.28);
	overflow: visible;
	max-width: 100%;
	box-sizing: border-box;
}

.changelog-code code {
	display: block;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--ice);
	font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
	font-size: 0.86rem;
	line-height: 1.65;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.changelog-link {
	color: var(--sky);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	font-weight: 600;
}

.changelog-link:hover {
	color: var(--mint);
}

.changelog-link:focus-visible {
	outline: 2px solid rgba(142, 207, 255, 0.64);
	outline-offset: 2px;
	border-radius: 4px;
}

:root[data-theme='light'] .changelog-card {
	background: linear-gradient(160deg, rgba(142, 207, 255, 0.16), rgba(255, 255, 255, 0.96) 28%), rgba(255, 255, 255, 0.96);
	border-color: rgba(17, 49, 58, 0.22);
}

:root[data-theme='light'] .contributors-card {
	background: linear-gradient(160deg, rgba(135, 240, 193, 0.2), rgba(255, 255, 255, 0.96) 28%), rgba(255, 255, 255, 0.96);
	border-color: rgba(17, 49, 58, 0.22);
}

:root[data-theme='light'] .changelog-head button {
	border-color: rgba(17, 49, 58, 0.26);
	background: rgba(17, 49, 58, 0.05);
}

:root[data-theme='light'] .changelog-separator {
	border-top-color: rgba(17, 49, 58, 0.18);
}

:root[data-theme='light'] .changelog-release code,
:root[data-theme='light'] .changelog-section code,
:root[data-theme='light'] .changelog-list code,
:root[data-theme='light'] .changelog-note code {
	background: rgba(17, 49, 58, 0.08);
	border-color: rgba(17, 49, 58, 0.2);
	color: #1d5468;
}

:root[data-theme='light'] .changelog-code {
	border-color: rgba(17, 49, 58, 0.24);
	background: rgba(17, 49, 58, 0.08);
}

:root[data-theme='light'] .changelog-code code {
	color: #123846;
}

:root[data-theme='light'] .contributor-item {
	border-color: rgba(17, 49, 58, 0.18);
	background: rgba(17, 49, 58, 0.04);
}

:root[data-theme='light'] .contributor-avatar {
	border-color: rgba(17, 49, 58, 0.28);
	background: rgba(255, 255, 255, 0.75);
}

:root[data-theme='light'] .contributor-avatar-fallback {
	background: linear-gradient(130deg, rgba(63, 135, 184, 0.25), rgba(45, 143, 121, 0.25));
}

:root[data-theme='light'] .changelog-link {
	color: #1f6072;
}

:root[data-theme='light'] .changelog-link:hover {
	color: #257f6b;
}

:root[data-theme='light'] .changelog-code {
	border-color: rgba(17, 49, 58, 0.2);
	background: rgba(17, 49, 58, 0.06);
}

.confirm-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	flex-wrap: wrap;
}

#confirm-cancel {
	border-color: rgba(255, 255, 255, 0.24);
	background: rgba(255, 255, 255, 0.05);
}

#confirm-accept.confirm-danger {
	border-color: rgba(255, 142, 116, 0.62);
	background: rgba(255, 142, 116, 0.2);
}

#confirm-accept.confirm-danger:hover {
	border-color: rgba(255, 182, 162, 0.84);
	background: rgba(255, 142, 116, 0.3);
}

.login-panel {
	width: min(700px, 92vw);
	padding: 30px;
	display: grid;
	gap: 10px;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.login-panel > #theme-toggle {
	position: absolute !important;
	inset: 12px 12px auto auto !important;
	left: auto !important;
	right: 12px !important;
	margin: 0 !important;
}

.login-panel::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: rgba(255, 255, 255, 0.16);
}

.login-panel::before {
	content: '';
	position: absolute;
	left: -44%;
	bottom: 0;
	width: 44%;
	height: 2px;
	opacity: 0;
	z-index: 2;
	background: linear-gradient(90deg, rgba(255, 184, 76, 0), #ffd166 40%, #fff4c2 52%, #ffd166 64%, rgba(255, 184, 76, 0));
	filter: drop-shadow(0 0 8px rgba(255, 209, 102, 0.8));
}

.login-panel.login-transitioning {
	border-color: rgba(255, 209, 102, 0.42);
	box-shadow:
		0 0 0 1px rgba(255, 209, 102, 0.12),
		0 20px 40px rgba(0, 0, 0, 0.38);
}

.login-panel.login-transitioning::before {
	opacity: 1;
	animation: login-laser-sweep 0.85s linear infinite;
}

.login-panel.login-transitioning .login-form,
.login-panel.login-transitioning .login-actions,
.login-panel.login-transitioning .footer-subtitle {
	opacity: 0.64;
}

.login-panel.login-transitioning .login-message {
	color: var(--amber);
}

.login-form {
	display: grid;
	gap: 10px;
	margin-top: 4px;
}

.login-form label {
	font-size: 0.82rem;
	color: var(--ink-muted);
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.login-form input {
	width: 100%;
	padding: 10px 12px;
	font-size: 0.95rem;
}

.login-inline {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas:
		'input button'
		'. waiting';
	gap: 8px;
	align-items: start;
}

.login-inline input {
	grid-area: input;
}

.login-actions {
	display: flex;
	justify-content: flex-end;
}

.login-secondary {
	justify-content: center;
	padding-top: 4px;
}

.owner-waiting {
	display: grid;
	gap: 6px;
	grid-area: waiting;
	margin-top: -6px;
	justify-self: stretch;
	min-width: 100%;
}

.owner-waiting span {
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--login-loading-color);
}

.owner-waiting-line {
	position: relative;
	height: 3px;
	border-radius: 0 0 8px 8px;
	overflow: hidden;
	background: color-mix(in srgb, var(--login-loading-color) 24%, transparent);
	border: 1px solid color-mix(in srgb, var(--login-loading-color) 42%, transparent);
	border-top: 0;
}

.owner-waiting-line::before {
	content: '';
	position: absolute;
	left: -40%;
	top: 0;
	width: 40%;
	height: 100%;
	background: linear-gradient(
		90deg,
		color-mix(in srgb, var(--login-loading-color) 0%, transparent),
		color-mix(in srgb, var(--login-loading-color) 72%, #ffffff 28%) 35%,
		#fff4c2 50%,
		color-mix(in srgb, var(--login-loading-color) 72%, #ffffff 28%) 65%,
		color-mix(in srgb, var(--login-loading-color) 0%, transparent)
	);
	filter: drop-shadow(0 0 6px color-mix(in srgb, var(--login-loading-color) 80%, transparent));
	animation: login-laser-sweep 0.95s linear infinite;
}

#request-code {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	grid-area: button;
}

#request-code.is-waiting {
	color: var(--login-loading-color);
	border-color: color-mix(in srgb, var(--login-loading-color) 58%, transparent);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

#request-code.is-redirecting {
	color: var(--login-loading-color);
	border-color: color-mix(in srgb, var(--login-loading-color) 58%, transparent);
}

.login-form input:disabled {
	opacity: 0.65;
	cursor: not-allowed;
}

.login-message {
	margin: 0;
	min-height: 1.2rem;
	font-size: 0.86rem;
	color: var(--ink-muted);
}

.login-message.success {
	color: var(--mint);
}

.login-message.error {
	color: var(--salmon);
}

.hidden {
	display: none !important;
}

.footer-title {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink);
}

.footer-subtitle {
	margin: 0;
	font-size: 0.85rem;
	color: var(--ink-muted);
}

.footer-links {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.footer-source-link {
	margin-top: 2px;
}

.footer-theme-controls {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 4px;
}

.footer-palette-select {
	position: relative;
	width: 280px;
	height: 34px;
}

.footer-palette-select .custom-select-trigger {
	height: 34px;
	font-size: 0.78rem;
}

.footer-palette-select .custom-select-menu {
	top: auto;
	bottom: calc(100% + 8px);
	transform: translateY(4px) scale(0.98);
	transform-origin: bottom center;
}

.footer-links a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
	font-size: 0.78rem;
	padding: 6px 10px;
	border-radius: 999px;
	border: 1px solid var(--ui-border-soft);
	background: color-mix(in srgb, var(--bg-mid) 82%, transparent);
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--ink) 8%, transparent) inset;
	color: var(--footer-social-color);
	transition:
		border-color 0.2s ease,
		background-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease;
}

:root[data-theme='light'] .footer-links a {
	border-color: var(--ui-border-soft);
	background: color-mix(in srgb, var(--bg-mid) 92%, transparent);
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--ink) 10%, transparent) inset;
}

.footer-links a:hover {
	border-color: var(--ui-border-accent-strong);
	background: linear-gradient(
		120deg,
		color-mix(in srgb, var(--sky) 12%, transparent),
		color-mix(in srgb, var(--mint) 14%, transparent)
	);
	color: var(--mint);
	transform: translateY(-1px);
}

:root[data-theme='light'] .footer-links a:hover {
	border-color: var(--ui-border-accent-strong);
	background: linear-gradient(
		120deg,
		color-mix(in srgb, var(--sky) 18%, transparent),
		color-mix(in srgb, var(--mint) 22%, transparent)
	);
}

.social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 14px;
	height: 14px;
}

.social-icon svg {
	width: 100%;
	height: 100%;
	fill: currentColor;
}

.footer-meta {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	font-size: 0.76rem;
	color: var(--ink-muted);
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.footer-actions {
	display: flex;
	justify-content: center;
	margin-top: 4px;
}

.footer-actions .logout-button {
	padding: 8px 14px;
	font-size: 0.82rem;
}

.status-pill {
	display: inline-flex;
	align-items: center;
	padding: 4px 8px;
	border-radius: 999px;
	font-weight: 700;
	font-size: 0.77rem;
	letter-spacing: 0.04em;
}

.status-pill.enabled {
	background: rgba(135, 240, 193, 0.18);
	color: var(--mint);
}

.status-pill.disabled {
	background: rgba(255, 142, 116, 0.18);
	color: var(--salmon);
}

.toggle-btn {
	padding: 6px 10px;
	font-size: 0.8rem;
}

.toggle-btn.enable:hover {
	border-color: rgba(135, 240, 193, 0.7);
	background: rgba(135, 240, 193, 0.1);
}

.toggle-btn.disable:hover {
	border-color: rgba(255, 142, 116, 0.7);
	background: rgba(255, 142, 116, 0.1);
}

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(135, 240, 193, 0.45);
	}
	100% {
		box-shadow: 0 0 0 10px rgba(135, 240, 193, 0);
	}
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes zen-cursor-dash-spin {
	0% {
		rotate: 0deg;
	}
	100% {
		rotate: 360deg;
	}
}

@keyframes login-laser-sweep {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(330%);
	}
}

@keyframes hero-brand-shimmer {
	0% {
		background-position: 0% 50%;
	}
	100% {
		background-position: 100% 50%;
	}
}

@keyframes theme-radial-reveal {
	from {
		clip-path: circle(0 at var(--theme-origin-x) var(--theme-origin-y));
	}
	to {
		clip-path: circle(150vmax at var(--theme-origin-x) var(--theme-origin-y));
	}
}

@keyframes theme-icon-sun-morph {
	0% {
		transform: translate(-50%, -50%) scale(0.6) rotate(-48deg);
		filter: drop-shadow(0 0 2px rgba(142, 240, 255, 0.2));
	}
	58% {
		transform: translate(-50%, -50%) scale(1.08) rotate(7deg);
		filter: drop-shadow(0 0 6px rgba(255, 209, 102, 0.5));
	}
	100% {
		transform: translate(-50%, -50%) scale(1) rotate(0deg);
		filter: drop-shadow(0 0 5px rgba(255, 209, 102, 0.34));
	}
}

@keyframes theme-icon-moon-morph {
	0% {
		transform: translate(-50%, -50%) scale(1) rotate(0deg);
		filter: drop-shadow(0 0 5px rgba(142, 240, 255, 0.42));
	}
	58% {
		transform: translate(-50%, -50%) scale(0.74) rotate(28deg);
		filter: drop-shadow(0 0 5px rgba(110, 192, 255, 0.4));
	}
	100% {
		transform: translate(-50%, -50%) scale(0.62) rotate(44deg);
		filter: drop-shadow(0 0 2px rgba(110, 192, 255, 0.15));
	}
}

@media (prefers-reduced-motion: reduce) {
	.hero-brand-animated {
		animation: none;
	}

	.theme-icon {
		transition: none;
	}

	.theme-toggle.is-switching .theme-icon-sun,
	.theme-toggle.is-switching .theme-icon-moon {
		animation: none;
	}

	::view-transition-old(root),
	::view-transition-new(root) {
		animation: none;
	}

	:root.theme-transitioning body,
	:root.theme-transitioning .app-bg,
	:root.theme-transitioning .hero,
	:root.theme-transitioning .card,
	:root.theme-transitioning .panel,
	:root.theme-transitioning .commands-wrap,
	:root.theme-transitioning .audit-wrap,
	:root.theme-transitioning .category-group,
	:root.theme-transitioning .command-card,
	:root.theme-transitioning .users-kpi-card,
	:root.theme-transitioning .users-bulk-toolbar,
	:root.theme-transitioning .dashboard-footer,
	:root.theme-transitioning .section-state,
	:root.theme-transitioning .confirm-card,
	:root.theme-transitioning .console,
	:root.theme-transitioning .hero-badge,
	:root.theme-transitioning .readonly-chip,
	:root.theme-transitioning .user-select-row,
	:root.theme-transitioning button,
	:root.theme-transitioning input,
	:root.theme-transitioning .footer-links a,
	:root.theme-transitioning .custom-tooltip {
		transition: none;
	}
}

@media (max-width: 980px) {
	.cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.users-kpi-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.settings-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.commands-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.hero {
		flex-direction: column;
		align-items: flex-start;
	}

	input {
		min-width: 180px;
	}
}

@media (max-width: 640px) {
	.dashboard {
		padding: 14px;
	}

	.theme-toggle {
		width: 32px;
		height: 32px;
		top: 8px;
		right: 8px;
	}

	.footer-palette-select {
		width: min(280px, 100%);
	}

	.hero > #theme-toggle {
		inset: 8px 8px auto auto !important;
	}

	.login-inline {
		grid-template-columns: 1fr;
		grid-template-areas:
			'input'
			'button'
			'waiting';
	}

	.folder-search {
		margin-left: 0;
		width: 100%;
		min-width: 0;
	}

	.folder-filter {
		min-width: 0;
		width: 100%;
	}

	.folder-filters {
		width: 100%;
		margin-left: 0;
	}

	.cards {
		grid-template-columns: 1fr;
	}

	.users-kpi-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.settings-grid {
		grid-template-columns: 1fr;
	}

	.panel-head {
		flex-direction: column;
		align-items: flex-start;
	}

	.commands-grid {
		grid-template-columns: 1fr;
	}

	.footer-meta {
		flex-wrap: wrap;
	}

	.contributors-grid {
		grid-template-columns: 1fr;
	}
}