:root {
	color-scheme: light;
	--f: "Google Sans", "Roboto", Arial, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;

	--color-app-module-data-container: #FFE5C8;
	--color-data-list-entity-child: #FFFFFF;
	--color-data-list-element: #FFEEDB;
	--color-text: #ffffff;

	--radius-section: 1rem;
	--radius-big: 0.5rem;
	--radius-standard: 0.35rem;
	--radius-small: 0.25rem;

	--color-theme-main: #E2781A;
	--color-theme-main-darker: #ca6b18;
	--color-theme-main-lighter: rgb(243, 117, 7);

	--or: #E2781A;
	--or-dk: #C06515;
	--or-lt: rgba(226, 120, 26, .15);
	--or-border: rgba(226, 120, 26, .3);
	--or-pale: rgba(226, 120, 26, .04);

	--or-row-hover: rgba(226, 120, 26, .16);
	--or-border-strong: rgba(226, 120, 26, .32);
	--or-pill-bg: rgba(226, 120, 26, .18);
	--or-chrome-bg: rgba(226, 120, 26, .10);
	--or-chrome-brd: rgba(226, 120, 26, .25);
	--or-chrome-fg: #E2781A;
	--btn-h-sm: 30px;
	--btn-fs-sm: 12px;
	--btn-px-sm: 10px;
	--btn-h-md: 34px;
	--btn-fs-md: 12.5px;
	--btn-px-md: 14px;
	--btn-h-lg: 38px;
	--btn-fs-lg: 13.5px;
	--btn-px-lg: 18px;
	--red-btn-bg: #FEF2F2;
	--red-btn-brd: rgba(220, 38, 38, .40);
	--red-btn-fg: #B01B1B;
	--or-pill-border: rgba(226, 120, 26, .36);
	--or-pill-fg: #A04E0F;
	--set-head-bg: #FDF0DB;
	--badge-product-bg: #E5C58A;
	--badge-product-fg: #4A3818;
	--badge-service-bg: #92D3A5;
	--badge-service-fg: #0B5223;
	--badge-package-bg: #F6C261;
	--badge-package-fg: #7A3F00;
	--badge-blue-bg: #9EC4ED;
	--badge-blue-fg: #184E8C;
	--badge-green-bg: #B6D589;
	--badge-green-fg: #355812;
	--badge-amber-bg: #F9BD6A;
	--badge-amber-fg: #6E4108;
	--badge-violet-bg: #BF9FF0;
	--badge-violet-fg: #5A1FB8;
	--bg: #F2F0ED;
	--sur: #FFFFFF;
	--sur2: #F8F7F5;
	--sur3: #EFEDE9;
	--t1: #18150F;
	--t2: #4A443A;
	--t3: #968E82;
	--t4: #C8C0B6;
	--ln: rgba(0, 0, 0, .07);
	--ln2: rgba(0, 0, 0, .11);
	--brd: #C8C0B6;
	--brd-lt: rgba(0, 0, 0, .07);
	--green: #16A34A;
	--green-bg: #C5EBD1;
	--green-lt: #C5EBD1;
	--green-brd: rgba(22, 163, 74, 0.3);
	--blue: #2563EB;
	--blue-bg: #BFDAF7;
	--red: #DC2626;
	--red-dk: #B01B1B;
	--red-bg: #F7C2C2;
	--red-lt: rgba(220, 38, 38, .10);
	--red-brd: rgba(220, 38, 38, 0.3);
	--amber: #D97706;
	--amber-bg: #FBDE9F;
	--violet: #7C3AED;
	--violet-bg: #D0C2F4;
	--teal: #0D9488;
	--teal-bg: #B0E6DA;
	--rose: #E11D48;
	--rose-bg: #F8C0CC;

	--code-kw: #6D28D9;
	--code-str: #15803D;
	--code-com: #8A8378;
	--code-num: #0F766E;
	--code-typ: #B45309;
	--code-tag: #B91C1C;
	--code-atr: #1D4ED8;
	--code-meta: #6B6257;
	--code-fn: #0369A1;
	--code-prop: #44505E;
	--code-key: #1E40AF;
	--code-var: #7C4A1E;
	--code-lit: #A21CAF;
	--code-anno: #A16207;
	--code-add: #15803D;
	--code-del: #B91C1C;
	--code-add-bg: rgba(22, 163, 74, .08);
	--code-del-bg: rgba(220, 38, 38, .07);
	--code-ctl-bg: rgba(220, 38, 38, .18);
	--bg-page: #F2F0ED;
	--bg-card: #FFFFFF;
	--bg-hover: #F8F7F5;
	--bg-section: #F5F3EF;
	--bg-field: #F7F7F7;
	--hover-list-element-background: #F5F5F5;
	--hover-sidebar-filter-bg: #F0F0F0;

	--blue-pill-bg:   #CCE5FF;
	--blue-pill-fg:   #004085;
	--green-pill-bg:  #D4EDDA;
	--green-pill-fg:  #155724;
	--red-pill-bg:    #F8D7DA;
	--red-pill-fg:    #721C24;
	--amber-pill-bg:  #FFECD6;
	--amber-pill-fg:  #DB7C3D;
	--violet-pill-bg: #EEE5FE;
	--violet-pill-fg: #5D3FD3;

	--neutral:    #9CA3AF;
	--neutral-bg: #F3F4F6;
	--neutral-pill-bg: #DCD6CC;
	--neutral-pill-fg: #4A443A;
	--success:    var(--green);
	--success-bg: var(--green-bg);
	--warning:    var(--amber);
	--warning-bg: var(--amber-bg);
	--danger:     var(--red);
	--danger-bg:  var(--red-bg);

	--brand-stripe:        #635BFF;
	--brand-sepa:          #10298E;
	--brand-google-blue:   #4285F4;
	--brand-google-red:    #EA4335;
	--brand-google-yellow: #FBBC05;
	--brand-google-green:  #34A853;
	--brand-google-text:   #5F6368;
	--brand-apple:         #000000;
	--brand-gpay-text:     #5F6368;
	--brand-visa:          #1A1F71;
	--brand-mc-red:        #EB001B;
	--brand-mc-yellow:     #F79E1B;
	--brand-mc-orange:     #FF5F00;
	--brand-amex:          #006FCF;
	--brand-cb-blue:       #1B3F8F;
	--brand-cb-green:      #00A36C;
	--brand-badge-bg:      #FFFFFF;
	--brand-badge-brd:     rgba(0, 0, 0, .14);
	--brand-woo:           #7F54B3;
	--brand-shopify:       #95BF47;
	--brand-shopify-shade: #5E8E3E;

	--named-thumb-color: #777;

	--scroll-track-color: #ffffff;
	--scroll-thumb-color: #b9b9b9;
	--scroll-size: 10px;
	--scroll-size-md: calc(var(--scroll-size) * .6);
	--scroll-size-sm: calc(var(--scroll-size) * .4);
	--scroll-size-thin: calc(var(--scroll-size) / 5);

	--hero-bg-1: #FFEDCC;
	--hero-bg-2: #FFDDA8;
	--hero-bg-3: #FFD090;
	--hero-brd: #E2781A;
	--hero-shadow: rgba(242, 140, 15, .1);
	--hero-deco: rgba(255, 255, 255, .2);
	--hero-fg: #5C3D0E;
	--hero-fg-2: #8B6A2F;
	--hero-tile: rgba(255, 255, 255, .35);
	--hero-tile-brd: transparent;
	--hero-ring: rgba(255, 255, 255, .5);
	--hero-av-shadow: rgba(0, 0, 0, .12);
}

@media (max-width: 600px) {
	:root {
		--radius-section: 0.75rem;
		--radius-big: 0.375rem;
		--radius-standard: 0.25rem;
		--radius-small: 0.1875rem;
	}
}

[data-theme="dark"] {
	color-scheme: dark;
	--color-app-module-data-container: rgba(226, 120, 26, .15);
	--color-data-list-entity-child: #1E1E22;
	--color-data-list-element: rgba(226, 120, 26, .06);
	--color-text: #EEEEF0;
	--color-theme-main: #E2781A;
	--color-theme-main-darker: #C06515;
	--color-theme-main-lighter: #E2781A;
	--named-thumb-color: #555;
	--scroll-track-color: #1E1E22;
	--scroll-thumb-color: #44444C;
	--scroll-size: 10px;

	--brand-apple:         #FFFFFF;
	--brand-gpay-text:     #E8EAED;
	--brand-sepa:          #8FA4F5;
	--brand-badge-brd:     rgba(255, 255, 255, .16);
	--brand-woo:           #9469CC;
	--brand-shopify:       #A2CB57;
	--brand-shopify-shade: #6E9F4B;

	--bg: #121214;
	--sur: #1E1E22;
	--sur2: #28282E;
	--sur3: #2E2E34;
	--t1: #EEEEF0;
	--t2: #9898A0;
	--t3: #68686E;
	--t4: #4A4A50;
	--ln: rgba(255, 255, 255, .06);
	--ln2: rgba(255, 255, 255, .1);
	--or-lt: rgba(226, 120, 26, .12);
	--or-border: rgba(226, 120, 26, .22);
	--or-row-hover: rgba(226, 120, 26, .2);
	--set-head-bg: #1A1A1E;
	--hover-list-element-background: rgba(255, 255, 255, .045);
	--hover-sidebar-filter-bg: #28282E;
	--green: #4ED27A;
	--green-bg: rgba(22, 163, 74, .22);
	--green-lt: rgba(22, 163, 74, .11);
	--green-brd: rgba(78, 210, 122, 0.3);
	--blue: #6BAEF5;
	--blue-bg: rgba(37, 99, 235, .22);
	--red: #F06060;
	--red-dk: #D14A4A;
	--red-bg: rgba(220, 38, 38, .22);
	--red-lt: rgba(220, 38, 38, .11);
	--red-brd: rgba(240, 96, 96, 0.3);
	--amber: #F1872E;
	--amber-bg: rgba(217, 119, 6, .22);
	--violet: #B89AF5;
	--violet-bg: rgba(124, 58, 237, .22);
	--teal: #4FCFC2;
	--teal-bg: rgba(13, 148, 136, .22);
	--rose: #F55782;
	--rose-bg: rgba(225, 29, 72, .22);

	--code-kw: #B89AF5;
	--code-str: #4ED27A;
	--code-com: #74747E;
	--code-num: #4FCFC2;
	--code-typ: #E0A56A;
	--code-tag: #F06060;
	--code-atr: #6BAEF5;
	--code-meta: #9898A0;
	--code-fn: #5CC8E8;
	--code-prop: #C4CAD4;
	--code-key: #93BDF8;
	--code-var: #E6C9A8;
	--code-lit: #E28AF0;
	--code-anno: #E5C25C;
	--code-add: #4ED27A;
	--code-del: #F06060;
	--code-add-bg: rgba(78, 210, 122, .10);
	--code-del-bg: rgba(240, 96, 96, .10);
	--code-ctl-bg: rgba(240, 96, 96, .22);
	--neutral-bg: rgba(156, 163, 175, .12);
	--neutral-pill-bg: rgba(255, 255, 255, .10);
	--neutral-pill-fg: #C8C0B6;
	--success-bg: var(--green-bg);
	--warning-bg: var(--amber-bg);
	--danger-bg:  var(--red-bg);
	--bg-page: #121214;
	--bg-card: #1E1E22;
	--bg-hover: #28282E;
	--bg-section: #1A1A1E;
	--bg-field: #28282B;
	--brd: #2E2E34;
	--brd-lt: rgba(255, 255, 255, .07);
	--or-border-strong: rgba(226, 120, 26, .42);
	--or-pill-bg: rgba(226, 120, 26, .24);
	--or-chrome-bg: rgba(226, 120, 26, .12);
	--or-chrome-brd: rgba(226, 120, 26, .22);
	--or-chrome-fg: #E2781A;
	--btn-h-sm: 30px;
	--btn-fs-sm: 12px;
	--btn-px-sm: 10px;
	--btn-h-md: 34px;
	--btn-fs-md: 12.5px;
	--btn-px-md: 14px;
	--btn-h-lg: 38px;
	--btn-fs-lg: 13.5px;
	--btn-px-lg: 18px;
	--red-btn-bg: rgba(240, 96, 96, .12);
	--red-btn-brd: rgba(240, 96, 96, .38);
	--red-btn-fg: #F06060;
	--or-pill-border: rgba(226, 120, 26, .42);
	--or-pill-fg: #F1872E;
	--blue-pill-bg:   rgba(37, 99, 235, .24);
	--blue-pill-fg:   #6BAEF5;
	--green-pill-bg:  rgba(22, 163, 74, .24);
	--green-pill-fg:  #4ED27A;
	--red-pill-bg:    rgba(220, 38, 38, .24);
	--red-pill-fg:    #F06060;
	--amber-pill-bg:  rgba(217, 119, 6, .24);
	--amber-pill-fg:  #F1872E;
	--violet-pill-bg: rgba(124, 58, 237, .24);
	--violet-pill-fg: #B89AF5;
	--badge-product-bg: rgba(168, 144, 98, .38);
	--badge-product-fg: #E5D7BA;
	--badge-service-bg: rgba(40, 150, 75, .42);
	--badge-service-fg: #82DC95;
	--badge-package-bg: rgba(210, 130, 30, .42);
	--badge-package-fg: #FF9E47;
	--badge-blue-bg: rgba(60, 130, 200, .42);
	--badge-blue-fg: #93CCF5;
	--badge-green-bg: rgba(110, 160, 50, .42);
	--badge-green-fg: #8ADC97;
	--badge-amber-bg: rgba(195, 130, 40, .42);
	--badge-amber-fg: #FF9E47;
	--badge-violet-bg: rgba(150, 95, 245, .42);
	--badge-violet-fg: #CCB5FC;

	--hero-bg-1: #1E1C18;
	--hero-bg-2: #22201A;
	--hero-bg-3: #1E1C18;
	--hero-brd: rgba(226, 120, 26, .15);
	--hero-shadow: rgba(0, 0, 0, .5);
	--hero-deco: rgba(226, 120, 26, .06);
	--hero-fg: #EEEEF0;
	--hero-fg-2: #68686E;
	--hero-tile: rgba(226, 120, 26, .06);
	--hero-tile-brd: rgba(226, 120, 26, .1);
	--hero-ring: rgba(30, 20, 10, .6);
	--hero-av-shadow: rgba(0, 0, 0, .3);
}

@media (prefers-color-scheme: light) {
	body {
		background: #ffffff;
		color: #000000;
	}
}

[data-theme="dark"] body {
	background: #121214;
	color: #EEEEF0;
}

.module-container {
	background: var(--bg-page);
}

[data-theme="dark"] nav {
	background-color: #18181B;
	border-right: 1px solid #2E2E34;
}

@media (hover: hover) and (pointer: fine){[data-theme="dark"] nav .actions span:not(.visible-when-extended):not(.selected-menu-tab):hover {
	background-color: rgba(226, 120, 26, .1);
}}

[data-theme="dark"] nav .selected-menu-tab {
	background-color: rgba(226, 120, 26, .15);
}

[data-theme="dark"] main {
	background: #18181B;
}

[data-theme="dark"] *::-webkit-scrollbar-thumb {
	background: #44444C;
	border-color: transparent;
}

[data-theme="dark"] *::-webkit-scrollbar-track {
	background: #1E1E22;
}

[data-theme="dark"] .mobile-burger {
	background-color: var(--or);
}

[data-theme="dark"] nav .menu span {
	color: #E2781A;
}

[data-theme="dark"] .profil-container .left-section {
	border-color: #2E2E34;
}

[data-theme="dark"] .profil-container .profil-section:not(:last-child) {
	border-color: #2E2E34;
}

[data-theme="dark"] .profil-container .section-title {
	color: #EEEEF0;
}

[data-theme="dark"] .profil-section-info-line-title,
[data-theme="dark"] .profil-section-info-line-value {
	color: #EEEEF0;
}

[data-theme="dark"] .toggle-button,
[data-theme="dark"] .radio-button {
	background-color: #28282E;
	color: #28282E;
}

[data-theme="dark"] .toggle-button[data-toggle-state="true"],
[data-theme="dark"] .radio-button[data-selected="true"] {
	background-color: var(--or);
}

[data-theme="dark"] .toggle-button[data-toggle-state="true"]::before,
[data-theme="dark"] .radio-button[data-selected="true"]::before {
	color: #1E1E22;
}

[data-theme="dark"] .right-section-profile-title {
	color: #EEEEF0;
}

[data-theme="dark"] .right-section .text-section {
	background-color: #1A1A1E;
}

[data-theme="dark"] .right-section .text-section textarea {
	background-color: #1A1A1E;
	color: #EEEEF0;
}

[data-theme="dark"] .signature-name {
	color: #EEEEF0;
}

[data-theme="dark"] #profile-info-forms>div {
	background: #1E1E22;
	color: #EEEEF0;
}

[data-theme="dark"] .profile-info-form-field {
	background-color: #1A1A1E;
	color: #EEEEF0;
	border-color: #2E2E34;
}

body {
	margin: 0;
	padding: 0;
	width: 100vw;
	height: 100vh;
	height: 100dvh;
	display: flex;
	overflow: hidden;
	background: var(--bg);
	font-family: "Google Sans", "Roboto", Arial, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
}

*::-webkit-scrollbar {
	width: var(--sb-size, var(--scroll-size-sm));
	height: var(--sb-size, var(--scroll-size-sm));
}

*::-webkit-scrollbar-track {
	background: var(--scroll-track-color);
	border-radius: var(--radius-big);
}

*::-webkit-scrollbar-thumb {
	background: var(--scroll-thumb-color);
	border-radius: var(--radius-big);
	border: var(--sb-tb, 0);
}

.sb-thin { --sb-size: var(--scroll-size-thin); --sb-tb: 0 }
.sb-sm { --sb-size: var(--scroll-size-sm); --sb-tb: 0 }
.sb-md { --sb-size: var(--scroll-size-md); --sb-tb: 0 }

@supports not selector(::-webkit-scrollbar) {
	body {
		scrollbar-color: var(--scroll-thumb-color) var(--scroll-track-color);
	}
}

:root {
	--nav-gutter: 0.75rem;
	--nav-list-pad: 0.5rem;
	--nav-pill-pad: 1.5rem;
	--nav-icon: 1.5rem;
	--nav-burger: 0.8;
	--nav-w: calc(2 * var(--nav-gutter) + 2 * var(--nav-list-pad) + 2 * var(--nav-pill-pad) + var(--nav-icon));
	--nav-top-inset: calc((var(--nav-w) - 40px) / 2);

	--tbar-pad-y: 14px;
	--tbar-pad-x: 20px;
	--tbar-gap: 12px;
	--tbar-title: 20px;
	--tbar-btn: 36px;
	--tbar-ico: 18px;
	--tbar-sep: 24px;
	--tbar-input: 14px;
	--tbar-input-pad: 8px;

	--z-nav:               1001;
	--z-mobile-nav-bd:     1000;
	--z-modal-backdrop:    1500;
	--z-modal:             1501;
	--z-modal-stacked:     1600;
	--z-popup-layer:       1700;
	--z-img-editor:        6000;
	--z-toast:             5000;
	--z-docviewer:         9000;
	--z-docviewer-stacked: 9100;

	--modal-backdrop-bg:   rgba(10, 10, 10, .5);
	--modal-backdrop-blur: 6px;

	--call-surface:         #1E1F22;
	--call-surface-2:       #2B2D31;
	--call-surface-hover:   #383A40;
	--call-arrow-hover:     #444444;
	--call-danger:          #E04B4B;
	--call-danger-hover:    #C93636;
	--call-ok:              #34A853;
	--call-dropdown-bg:     #1E1F22;
	--call-dropdown-border: #383A40;
	--call-text:            #FFFFFF;
	--on-accent:            #FFFFFF;
	--call-text-dim:        rgba(255, 255, 255, .55);
	--call-btn-bg:          rgba(255, 255, 255, .08);
	--call-disc-bg:         rgba(0, 0, 0, .25);
	--call-chip-bg:         rgba(0, 0, 0, .55);
	--site-foot-bg:         #0F1117;
	--site-foot-bg-2:       #0A0C10;
	--site-foot-fg:         #FFFFFF;
	--site-foot-dim:        rgba(255, 255, 255, .5);
	--site-foot-faint:      rgba(255, 255, 255, .4);
	--site-foot-chip:       rgba(255, 255, 255, .06);
	--site-foot-line:       rgba(255, 255, 255, .1);
}

nav {
	z-index: var(--z-nav);
	width: var(--nav-w);
	padding: 0;
	background-color: var(--color-theme-main);
	color: var(--color-text);
	display: flex;
	flex-direction: column;
	transition: width 0.3s ease-in-out;
	position: fixed;
	height: 100%;
	height: 100dvh;
}

nav.full-navbar {
	width: 20rem;
}

.mobile-burger,
.sb-mobile-close {
	display: none;
}

.mobile-nav-backdrop {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0);
	z-index: var(--z-mobile-nav-bd);
	transition: background 0.3s ease;
}

.mobile-nav-backdrop.active {
	display: block;
	background: rgba(0, 0, 0, 0.35);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}

@media (max-width: 900px) {
	nav {
		width: calc(100dvw - 3rem);
		max-width: 20rem;
		transform: translateX(-100%);
		transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		box-shadow: none;
	}

	nav.mobile-open {
		transform: translateX(0);
		box-shadow: 4px 0 20px rgba(0, 0, 0, 0.2);
	}

	nav.full-navbar {
		width: 17rem;
	}

	nav .top {
		display: none;
	}

	.sb-mobile-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 14px;
		right: 14px;
		width: 36px;
		height: 36px;
		padding: 0;
		background: rgba(255, 255, 255, 0.14);
		border: none;
		border-radius: 10px;
		color: #fff;
		cursor: pointer;
		z-index: 2;
		transition: background 0.15s;
	}
	.sb-mobile-close:focus-visible{
		background: rgba(255, 255, 255, 0.24);
		outline: none;
	} @media (hover: hover) and (pointer: fine){.sb-mobile-close:hover{
		background: rgba(255, 255, 255, 0.24);
		outline: none;
	}}
	.sb-mobile-close svg { width: 18px; height: 18px; }

	nav .visible-when-extended {
		color: var(--color-text);
		max-width: 12rem;
		margin-left: 1rem;
	}

	nav .actions span:not(.visible-when-extended) {
		justify-content: flex-start;
		padding: 1rem 1.25rem;
	}

	.mobile-burger {
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		bottom: 1.25rem;
		right: 1.25rem;
		z-index: 1002;
		width: 3.25rem;
		height: 3.25rem;
		border-radius: 50%;
		background-color: var(--color-theme-main);
		color: #fff;
		font-size: 1.4rem;
		cursor: pointer;
		box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
		transition: transform 0.2s ease, box-shadow 0.25s ease, background-color 0.2s;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
	}

	.mobile-burger:active {
		transform: scale(0.92);
	}

	.mobile-burger .burger-icon,
	.mobile-burger .burger-close {
		position: absolute;
		transition: opacity 0.2s ease, transform 0.2s ease;
	}

	.mobile-burger .burger-close {
		opacity: 0;
		transform: rotate(-90deg);
	}

	.mobile-burger.open .burger-icon {
		opacity: 0;
		transform: rotate(90deg);
	}

	.mobile-burger.open .burger-close {
		opacity: 1;
		transform: rotate(0deg);
	}

	.mobile-burger.open {
		background-color: var(--color-theme-main-darker);
	}
}

nav .top {
	margin-top: 1.5rem;
	text-align: right;
	margin-right: 2rem;
	width: calc(100% - var(--nav-top-inset));
}

nav .close-button {
	cursor: pointer;
	font-size: 1.5rem;
	font-weight: bold;
}

nav .center {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-left: var(--nav-gutter);
	width: calc(100% - 2 * var(--nav-gutter));
}

nav .menu {
	list-style: none;
	padding: 0;
	margin: 0;
	gap: 0.75rem;
}

nav .menu li {
	text-align: center;
}

nav .menu span {
	display: inline-block;
	padding: 0.5rem 1rem;
	background-color: var(--color-text);
	color: #E2781A;
	border-radius: var(--radius-small);
	cursor: pointer;
}

nav .bottom {
	margin-left: var(--nav-gutter);
	width: calc(100% - 2 * var(--nav-gutter));
	margin-bottom: 2rem;
}

nav .actions {
	list-style: none;
	padding: var(--nav-list-pad);
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--nav-list-pad);
}

nav .actions li {
	margin: 0;
}

nav .actions span:not(.visible-when-extended) {
	display: flex;
	align-items: center;
	padding: var(--nav-pill-pad);
	color: var(--color-text);
	border-radius: var(--radius-section);
	cursor: pointer;
	transition: background-color 0.3s;
	width: 100%;
	box-sizing: border-box;
	white-space: nowrap;
}

@media (hover: hover) and (pointer: fine){nav .actions span:not(.visible-when-extended):not(.selected-menu-tab):hover {
	background-color: #ffffff29;
}}

nav .selected-menu-tab {
	background-color: #fff2;
}

nav .actions i {
	font-size: var(--nav-icon);
	width: var(--nav-icon);
	height: var(--nav-icon);
	flex-shrink: 0;
}

nav .actions .sb-svg-icon {
	width: var(--nav-icon);
	height: var(--nav-icon);
	flex-shrink: 0;
}

@media (min-width: 901px) and (max-width: 1560px) {
	:root {
		--nav-gutter: 0.625rem;
		--nav-pill-pad: 1.25rem;
		--nav-burger: 0.7;
	}
}

@media (min-width: 901px) and (max-width: 1330px) {
	:root {
		--nav-gutter: 0.5rem;
		--nav-pill-pad: 1.125rem;
		--nav-icon: 1.375rem;
		--nav-burger: 0.65;

		--tbar-pad-y: 11px;
		--tbar-pad-x: 18px;
		--tbar-gap: 11px;
		--tbar-title: 19px;
		--tbar-btn: 34px;
		--tbar-ico: 17px;
		--tbar-sep: 22px;
		--tbar-input-pad: 7px;
	}
}

@media (min-width: 901px) and (max-width: 1150px) {
	:root {
		--nav-list-pad: 0.375rem;
		--nav-pill-pad: 1rem;
		--nav-icon: 1.25rem;
		--nav-burger: 0.6;

		--tbar-pad-y: 8px;
		--tbar-pad-x: 16px;
		--tbar-gap: 10px;
		--tbar-title: 18px;
		--tbar-btn: 32px;
		--tbar-ico: 16px;
		--tbar-sep: 20px;
		--tbar-input: 13px;
		--tbar-input-pad: 6px;
	}
}

.visible-when-extended {
	margin-left: 0;
	color: #fff0;
	overflow: hidden;
	transition: color 0.3s ease-in-out, max-width 0.3s ease-in-out, margin-left 0.3s ease-in-out;
	max-width: 0;
	pointer-events: none;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.visible-when-extended[data-state="true"] {
	color: var(--color-text);
	max-width: 12rem;
	margin-left: 1rem;
}

main {
	max-width: calc(100% - var(--nav-w));
	width: calc(100% - var(--nav-w));
	overflow-x: hidden;
	margin-left: var(--nav-w);
	overflow-y: auto;
	display: block;
	height: 100vh;
	height: 100dvh;
}

@media (max-width: 900px) {
	main {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
	}
}

.profil-container {
	display: flex;
	width: 100%;
}

.profil-container .left-section {
	border-right: 1px solid #bbb;
	flex: 0 0 27.5rem;
}

.profil-container .profil-section {
	display: flex;
	align-items: center;
	margin-right: 1rem;
	flex-direction: column;
	padding-bottom: 1.25rem;
	margin-bottom: 1.25rem;
	gap: 0.25rem;
}

.profil-container .profil-section:not(:last-child) {
	border-bottom: #bbb 1px solid;
}

.profil-container .section-title {
	display: inline-block;
	font-weight: 455;
	font-size: 2rem;
	margin: 0;
	padding: 0 0 1.75rem 0;
	width: 100%;
	text-align: left;
}

.profil-container .business-picture,
.profil-container .profile-picture {
	display: inline-block;
	width: 12rem;
	height: 12rem;
	border-radius: var(--radius-section);
	background-image: url("/account/pp.png");
	background-size: cover;
	background-position: center;
	margin-bottom: 1rem;
	position: relative;
	overflow: hidden;
	cursor: pointer;
}

.profil-container .business-picture {
	background-image: url("/app/proxypass?url=https%3A%2F%2Fimg.freepik.com%2Fvecteurs-premium%2Fmodele-logo-entreprise-creatif-type-minimaliste_1286368-35236.jpg");
}

.profil-container .business-picture::before,
.profil-container .profile-picture::before {
	content: "";
	position: absolute;
	inset: 0;
	background: transparent;
	border-radius: inherit;
	transition: background 0.3s ease, backdrop-filter 0.3s ease;
}

@media (hover: hover) and (pointer: fine){.profil-container .business-picture:hover::before,
.profil-container .profile-picture:hover::before {
	background: #E2781A99;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}}

.profil-container .business-picture .image-hover-pen,
.profil-container .profile-picture .image-hover-pen {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: #fff;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s ease;
}

@media (hover: hover) and (pointer: fine){.profil-container .business-picture:hover .image-hover-pen,
.profil-container .profile-picture:hover .image-hover-pen {
	opacity: 1;
}}

.profil-container .business-picture .image-hover-pen i,
.profil-container .profile-picture .image-hover-pen i {
	font-size: 2rem;
	margin-bottom: 0.4rem;
}

.profil-container .business-picture .image-hover-pen span,
.profil-container .profile-picture .image-hover-pen span {
	font-size: 0.9rem;
	line-height: 1.2;
}

.profil-section-info-line {
	display: flex;
	width: 100%;
	align-items: center;
	min-height: 2.5rem;
}

.profil-section-info-line-title,
.profil-section-info-line-value {
	flex: 1;
	font-size: 1rem;
	color: #000000DD;
	text-align: left;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.profil-section-info-line-edit {
	flex: 0 0 2.5rem;
	padding-block: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.profil-section-info-line-edit:not(:empty) {
	cursor: pointer;
}

.profil-section-info-line-edit i {
	transform: rotate(90deg);
}

#link-google-button {
	background: #DE4938;
}

#link-meolya-button {
	background: #E2781A;
}

.profil-section-info-link {
	position: relative;
	width: 18rem;
	height: 2.5rem;
	display: inline-block;
	color: #fff;
	overflow: hidden;
	border-radius: var(--radius-big);

	cursor: pointer;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	background: #E2781A;
}

.profil-section-info-link .icon-meolya-logo {
	position: absolute;
	left: 0.9rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.2rem;
	z-index: 1;
}

.profil-section-info-link .profil-section-info-link-value {
	display: inline-block;
	width: 100%;
	height: 100%;
	line-height: 2.5rem;
	text-align: center;
	padding: 0;
	margin: 0 0 0 0.5rem;
}

.wrappable-text {
	white-space: normal;
	overflow-wrap: break-word;
	word-wrap: break-word;
	hyphens: auto;
}

.link-section {
	gap: 0.8rem !important;
}

.signatures {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.signature-name {
	font-weight: 500;
	font-size: 1.25rem;
}

.toggle-button,
.radio-button {
	width: 1.5rem;
	height: 1.5rem;
	position: relative;
	display: inline-block;
	border-radius: var(--radius-standard);
	background-color: #f0f0f0;
	margin-inline: 0.75rem 1.5rem;
	color: #f0f0f0;
}

.toggle-button[data-toggle-state="true"],
.radio-button[data-selected="true"] {
	background-color: var(--or);
}

.toggle-button[data-toggle-state="true"]::before,
.radio-button[data-selected="true"]::before {
	content: '✓';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -52%);
	font-weight: 600;
	color: #f0f0f0;
}

.ml-seg {
	display: inline-flex;
	align-items: center;
	gap: 1px;
	background: var(--sur2);
	border: 1.5px solid var(--ln2);
	border-radius: var(--radius-standard);
	padding: 3px;
	flex-shrink: 0;
	max-width: 100%;	overflow-x: auto;
	scrollbar-width: none;
}

.ml-seg::-webkit-scrollbar { display: none; }

.ml-seg-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 26px;
	padding: 0 12px;
	border: none;
	background: transparent;
	color: var(--t3);
	font-family: inherit;
	font-size: 12px;
	font-weight: 500;
	border-radius: var(--radius-small);
	cursor: pointer;
	transition: background .12s, color .12s, box-shadow .12s;
	white-space: nowrap;
}

.ml-seg-btn.on,
.ml-seg-btn[checked] {
	background: var(--or-lt);
	color: var(--or);
	box-shadow: inset 0 0 0 1px var(--or-border);
}

.meo-wcbadge { display: inline-flex; align-items: center; flex-shrink: 0; line-height: 0; }
.meo-wcbadge svg { display: block; }
.meo-wcbadge.off { filter: grayscale(1); opacity: .55; }
.woo-badge-off, .woo-banner-off .meo-ico { --brand-shopify: var(--t4); --brand-shopify-shade: var(--t4); }

.ml-toggle {
	position: relative;
	display: inline-block;
	width: 36px;
	height: 20px;
	flex-shrink: 0;
	border-radius: 99rem;
	background: var(--brd);
	cursor: pointer;
	vertical-align: middle;
	transition: background .15s ease;
}
.ml-toggle input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	margin: 0;
	cursor: pointer;
	z-index: 1;
}
.ml-toggle::after {
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	border-radius: 99rem;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,.2);
	transition: transform .15s ease;
	pointer-events: none;
}

.ml-toggle:has(input:checked),
.ml-toggle.on,
.ml-toggle[aria-checked="true"],
.ml-toggle[data-toggle-state="true"],
.ml-toggle[lever-state="true"] { background: var(--or); }
.ml-toggle:has(input:checked)::after,
.ml-toggle.on::after,
.ml-toggle[aria-checked="true"]::after,
.ml-toggle[data-toggle-state="true"]::after,
.ml-toggle[lever-state="true"]::after { transform: translateX(16px); }

.ml-toggle:has(input:focus-visible),
.ml-toggle:focus-visible { outline: 2px solid var(--or); outline-offset: 2px; }

.ml-toggle.disabled,
.ml-toggle[disabled],
.ml-toggle:has(input:disabled) { opacity: .55; cursor: not-allowed; }

.ml-toggle-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	color: var(--t1);
}
.ml-toggle-row-lbl { flex: 1; min-width: 0; }

.page-politique {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.right-section-section {
	display: flex;
	justify-content: flex-start;
	align-items: baseline;
	flex-direction: column;
	margin-bottom: 1.5rem;
}

.right-section-profile-title {
	font-size: 2rem;
	padding-block: 1rem;
}

.right-section .text-section {
	padding: 0.5rem 1rem;
	background-color: #f0f0f0;
	border-radius: var(--radius-big);
	width: calc(100% - 2rem);
}

.right-section .text-section textarea {
	outline: none !important;
	border: none;
	padding: 0;
	background-color: #f0f0f0;
}

.right-section .text-section textarea[dynamic-lines] {
	resize: none;
	overflow-x: hidden;
	overflow-y: auto;
	width: 100%;
	min-height: 1.5rem;
	line-height: 1.5rem;
	max-height: calc(1.5rem * 10);
}

.right-section .text-section-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	flex-flow: row-reverse;
}

.right-section-section .df-code-section {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.disable-select {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.enable-select-child {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.footer-pdf-visual {
	width: 100%;
	text-align: center;
	overflow-x: auto;
	white-space: nowrap;
	display: block;
}

.footer-pdf-visual.has-hscroll {
	padding-bottom: 8px;
}

.footer-pdf-visual::-webkit-scrollbar {
	height: 11px !important;
}

[centerv] {
	align-items: center;
	display: flex;
	justify-content: center;
}

.image-selector-wb {
	color: #E2781A;
	background-color: #fff;
	box-shadow: inset 0 0 0 2px #E2781A;
}

@media (hover: hover) and (pointer: fine){.image-selector-wb:not(:active):hover {
	background-color: #fff3e4;
}}

.image-selector-ob {
	color: #fff;
	background-color: var(--or);
	box-shadow: none;
}

@media (hover: hover) and (pointer: fine){.image-selector-ob:not(:active):hover {
	background-color: #ce6b15;
}}

.image-operations {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 8px;
}

.image-operations .small-icon,
.image-operations .normal-icon {
	width: 1rem;
	height: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.image-operations .small-icon i {
	font-size: 0.8rem;
}

.image-operations .normal-icon i {
	font-size: 1.1rem;
}

#zoom-slider {
	appearance: none;
	flex: 1;
	height: 11px;
	border-radius: var(--radius-big);
	background: linear-gradient(90deg, #e2781a 0%, #e8e8e8 0%);
	cursor: pointer;
}

#zoom-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 15px;
	height: 19px;
	border-radius: var(--radius-big);
	background: #000000;
	box-shadow: none;
}

#zoom-slider::-moz-range-thumb {
	border: none;
	width: 15px;
	height: 19px;
	border-radius: var(--radius-big);
	background: #000000;
	box-shadow: none;
}

#operation-rotate {
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	padding-left: 0.5rem;
}

#form-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--modal-backdrop-bg);
	backdrop-filter: blur(var(--modal-backdrop-blur));
	-webkit-backdrop-filter: blur(var(--modal-backdrop-blur));
	z-index: var(--z-modal-backdrop);
}

#profile-info-forms>div {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: fit-content;
	height: fit-content;
	background: white;
	padding: 1rem;
	border-radius: var(--radius-standard);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	z-index: 1000;
}

#profile-info-forms>div[data-form-state="true"] {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.profile-info-form-title {
	display: inline-block;
	width: 100%;
	font-size: 1.35rem;
	padding-block: 0.25rem 0.2rem;
}

.profile-info-form-field {
	background-color: #f0f0f0;
	border: 0;
	border-radius: var(--radius-standard);
	padding: 0.25rem 0.6rem;
}

.profile-info-form-field:active,
.profile-info-form-field:focus {
	outline: none;
}

.profile-info-form-hline {
	display: flex;
	flex-direction: row;
	gap: 1rem;
}

.profile-info-form-hline-cat {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.profile-info-form-hline-cat .profile-info-form-field-name {
	padding-bottom: 0.25rem;
}

.profile-info-form-hline-cat input {
	flex: 1;
}

.profil-section-info-line-value[data-field-name="business-cap"]::after {
	content: '€';
}

.apps-menu-popup {
	position: fixed;
	z-index: 1200;
	background: var(--bg-card, #fff);
	border: 1.5px solid var(--brd-lt, rgba(0, 0, 0, .07));
	border-radius: var(--radius-section);
	box-shadow: 0 8px 32px rgba(0, 0, 0, .14), 0 2px 8px rgba(0, 0, 0, .06);
	padding: 6px;
	width: 200px;
	overflow-y: auto;
	overscroll-behavior: contain;
	opacity: 0;
	transform: scale(.9) translateY(-8px);
	transform-origin: top center;
	transition: opacity .18s, transform .18s;
	pointer-events: none
}

.apps-menu-popup.open {
	opacity: 1;
	transform: scale(1) translateY(0);
	pointer-events: auto
}

.apps-menu-popup.closing {
	opacity: 0;
	transform: scale(.9) translateY(-8px);
	pointer-events: none
}

.apps-menu-grid {
	display: flex;
	flex-direction: column;
	gap: 1px
}

.apps-menu-group {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	break-inside: avoid;
	-webkit-column-break-inside: avoid
}

.apps-menu-grp-list {
	display: flex;
	flex-direction: column;
	gap: 1px
}

.apps-menu-grp-title {
	font-size: 9.5px;
	font-weight: 700;
	color: var(--t3);
	text-transform: uppercase;
	letter-spacing: .06em;
	padding: 8px 10px 4px
}

@media (min-width: 1101px) {
	.apps-menu-popup {
		width: 420px
	}

	.apps-menu-grid {
		display: block;
		column-count: 2;
		column-gap: 12px
	}
}

.apps-menu-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border-radius: var(--radius-big);
	cursor: pointer;
	text-decoration: none;
	color: inherit;
	transition: background .1s;
	user-select: none;
	border: none;
	background: none;
	font-family: inherit;
	width: 100%;
	box-sizing: border-box
}

@media (hover: hover) and (pointer: fine){.apps-menu-item:hover {
	background: var(--bg-hover, #F8F7F5)
}}

.apps-menu-item:active {
	transform: scale(.97)
}

.apps-menu-ico {
	width: 28px;
	height: 28px;
	border-radius: var(--radius-big);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0
}

.apps-menu-ico svg {
	width: 14px;
	height: 14px
}

.apps-menu-item-label {
	font-size: 13px;
	font-weight: 500;
	color: var(--t1, #18150F);
	white-space: nowrap;
	text-align: left
}

.apps-menu-sep {
	height: 1px;
	background: var(--brd-lt, rgba(0, 0, 0, .07));
	margin: 3px 4px
}

.apps-menu-ico i {
	font-size: 14px;
	line-height: 1
}

.suite-drawer-ico i {
	font-size: 28px;
	line-height: 1
}

.apps-menu-ico,
.suite-drawer-ico {
	background: var(--sur3, rgba(0, 0, 0, .05));
	color: var(--t2, #4A453C)
}

.apps-menu-empty {
	padding: 14px 12px;
	font-size: 12.5px;
	color: var(--t3);
	text-align: center
}

.ic-mail,
.ic-comptabilite,
.ic-accueil {
	background: var(--or-lt, rgba(226, 120, 26, .1));
	color: var(--or, #E2781A)
}

.ic-facturation,
.ic-facturation-electronique {
	background: var(--blue-bg, #EFF6FF);
	color: var(--blue, #2563EB)
}

.ic-chantier {
	background: var(--amber-bg, #FFFBEB);
	color: var(--amber, #D97706)
}

.ic-persona {
	background: var(--green-bg, #F0FDF4);
	color: var(--green, #16A34A)
}

.ic-produit {
	background: var(--violet-bg, #F5F3FF);
	color: var(--violet, #7C3AED)
}

.ic-board {
	background: var(--violet-bg, #F5F3FF);
	color: var(--violet, #7C3AED)
}

.ic-chat {
	background: var(--blue-bg, #EFF6FF);
	color: var(--blue, #2563EB)
}

.ic-cloud {
	background: var(--teal-bg, #F0FDFA);
	color: var(--teal, #0D9488)
}

.ic-agenda {
	background: var(--green-bg, #F0FDF4);
	color: var(--green, #16A34A)
}

.ic-support {
	background: var(--amber-bg, #FFFBEB);
	color: var(--amber, #D97706)
}

.ic-meet {
	background: var(--rose-bg, #FFF1F2);
	color: var(--rose, #E11D48)
}

@media(max-width:768px) {
	.apps-menu-popup {
		width: 220px;
		padding: 8px
	}

	.apps-menu-item {
		padding: 11px 12px;
		gap: 12px
	}

	.apps-menu-ico {
		width: 32px;
		height: 32px;
		border-radius: var(--radius-big);
	}

	.apps-menu-ico svg {
		width: 16px;
		height: 16px
	}

	.apps-menu-item-label {
		font-size: 14px
	}

	.apps-menu-sep {
		margin: 4px 6px
	}
}

.suite-drawer {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 9998;
	background: rgba(0, 0, 0, var(--sd-back, .5));
	backdrop-filter: blur(2px);
	align-items: flex-end;
	justify-content: center
}

.suite-drawer.show {
	display: flex
}

.suite-drawer-inner {
	width: 100%;
	max-width: 480px;
	max-height: 92dvh;
	display: flex;
	flex-direction: column;
	background: var(--bg-card, #fff);
	border-radius: var(--radius-section) var(--radius-section) 0 0;
	overflow: hidden;
	animation: suiteDrawerUp .25s cubic-bezier(.34, 1.2, .64, 1) both
}

@keyframes suiteDrawerUp {
	from {
		transform: translateY(100%)
	}

	to {
		transform: translateY(0)
	}
}

.suite-drawer-inner.dragging {
	animation: none;
	transition: none
}

.suite-drawer-header {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	padding: 16px 20px;
	border-bottom: 1px solid var(--brd-lt, rgba(0, 0, 0, .07))
}

.suite-drawer-logo {
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--or);
	font-size: 28px;
	line-height: 1
}

.suite-drawer-logo .icon-meolya-logo {
	font-size: inherit;
	line-height: 1
}

.suite-drawer-title {
	flex: 1;
	font-size: 15px;
	font-weight: 800;
	color: var(--t1, #18150F)
}

.suite-drawer-close {
	width: 28px;
	height: 28px;
	border-radius: var(--radius-big);
	border: none;
	background: var(--bg-hover, #F8F7F5);
	color: var(--t3, #968E82);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all .12s
}

@media (hover: hover) and (pointer: fine){.suite-drawer-close:hover {
	background: rgba(0, 0, 0, .06);
	color: var(--t1)
}}

.suite-drawer-close svg {
	width: 11px;
	height: 11px
}

.suite-drawer-grid {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 20px 20px 44px
}

.suite-drawer-cols {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-auto-rows: 1fr;
	gap: 12px
}

.suite-drawer-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 9px;
	padding: 18px 8px 14px;
	border-radius: var(--radius-big);
	cursor: pointer;
	background: none;
	border: none;
	font-family: inherit;
	transition: background .1s, transform .1s;
	-webkit-tap-highlight-color: transparent
}

.suite-drawer-item:active {
	transform: scale(.93);
	background: var(--bg-hover, #F8F7F5)
}

.suite-drawer-ico {
	width: 60px;
	height: 60px;
	border-radius: var(--radius-section);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0
}

.suite-drawer-ico svg {
	width: 28px;
	height: 28px
}

.suite-drawer-lbl {
	font-size: 13px;
	font-weight: 500;
	color: var(--t2, #4A443A);
	text-align: center;
	overflow-wrap: break-word;
	min-width: 0
}

.mc-call-overlay {
	position: fixed;
	inset: 0;
	background: var(--modal-backdrop-bg);
	backdrop-filter: blur(var(--modal-backdrop-blur));
	-webkit-backdrop-filter: blur(var(--modal-backdrop-blur));
	z-index: var(--z-modal-backdrop);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: mcCallIn .25s ease;
}

@keyframes mcCallIn {
	from {
		opacity: 0;
		transform: scale(.95)
	}

	to {
		opacity: 1;
		transform: scale(1)
	}
}

.mc-call-card {
	background: #1E1F22;
	border-radius: var(--radius-section);
	padding: 20px 18px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	min-width: 340px;
	width: min(92vw, 720px);
	max-width: min(94vw, 960px);
	max-height: min(92vh, 860px);
	box-shadow: 0 20px 60px rgba(0, 0, 0, .4);
	position: relative;
	overflow: hidden;
}

.mc-call-top-bar {
	display: flex;
	align-items: center;
	gap: 8px;
	color: rgba(255, 255, 255, .5);
	font-size: 12px;
	font-weight: 600;
	align-self: flex-start;
	z-index: 5;
	margin-bottom: 12px;
}

.mc-call-top-bar .mc-call-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #34A853;
	animation: mcDotPulse 1.5s infinite;
}

.mc-call-timer-inline {
	font-size: 12px;
	font-weight: 700;
	color: rgba(255, 255, 255, .6);
	font-variant-numeric: tabular-nums;
	margin-left: 4px;
}

@keyframes mcDotPulse {

	0%,
	100% {
		opacity: 1
	}

	50% {
		opacity: .4
	}
}

.mc-call-grid-area {
	width: 100%;
	flex: 1;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.mc-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	align-items: center;
	align-content: center;
	width: 100%;
}

.mc-grid-tile {
	position: relative;
	aspect-ratio: 16/9;
	width: calc(50% - 3px);
	min-width: 120px;
	max-width: 100%;
	border-radius: var(--radius-big);
	background: #111214;
	border: 1px solid #2B2D31;
	overflow: hidden;
	cursor: pointer;
	transition: all .2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	-webkit-user-select: none;
	user-select: none;
}

@media (hover: hover) and (pointer: fine){.mc-grid-tile:hover {
	border-color: rgba(255, 255, 255, .22);
}}

.mc-grid-tile.mc-speaking {
	border-color: var(--color-theme-main);
	transition: border-color .15s ease;
}

.mc-grid-tile:only-child {
	width: 100%;
	max-width: 640px;
}

.mc-grid-tile:first-child:nth-last-child(n+3),
.mc-grid-tile:first-child:nth-last-child(n+3)~.mc-grid-tile {
	width: calc(50% - 3px);
}

.mc-grid-has-focus .mc-tile-focused {
	width: 100%;
	max-width: 100%;
}

.mc-grid-has-focus .mc-tile-small {
	width: clamp(110px, 22%, 180px);
	position: relative;
}

.mc-grid-has-focus .mc-grid-more {
	width: clamp(110px, 22%, 180px);
}

.mc-tile-video {

	position: absolute;
	inset: 1px;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	object-fit: contain;
	background: #111214;
	display: block;
	pointer-events: none;
	border-radius: calc(var(--radius-big) - 1px);
}

.mc-tile-watch-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	max-width: calc(100% - 12px);
	white-space: nowrap;
	border: none;
	border-radius: var(--radius-big);
	background: rgba(0, 0, 0, .58);
	color: #fff;
	font-size: .82rem;
	font-weight: 600;
	cursor: pointer;
}

.mc-tile-watch-btn svg {
	flex-shrink: 0;
}

.mc-tile-watch-btn:hover {
	background: rgba(0, 0, 0, .78);
}

.mc-tile-stopwatch {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 4;
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(224, 75, 75, .92);
	color: #fff;
	cursor: pointer;
	opacity: 0;
	transition: opacity .12s;
}

.mc-grid-tile:hover .mc-tile-stopwatch,
.mc-grid-tile.mc-touch-reveal .mc-tile-stopwatch {
	opacity: 1;
}

.mc-tile-stopwatch:hover {
	background: #E04B4B;
}

.mc-call-btn.watch-close {
	background: rgba(224, 75, 75, .16);
	color: #E04B4B;
}

.mc-call-btn.watch-close:hover {
	background: rgba(224, 75, 75, .3);
}

.mc-tile-placeholder {
	position: relative;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	font-weight: 800;
	color: #fff;
	z-index: 1;
	flex-shrink: 0;
	pointer-events: none;
	overflow: hidden;
}
.mc-tile-placeholder-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: inherit;
	z-index: 1;
	background: inherit;
}
.mc-tile-placeholder-init {
	position: relative;
	z-index: 0;
	line-height: 1;
}

.mc-tile-label {
	position: absolute;
	bottom: 6px;
	left: 8px;
	font-size: 10px;
	font-weight: 600;
	color: #fff;
	background: rgba(0, 0, 0, .55);
	padding: 2px 8px;
	border-radius: var(--radius-standard);
	z-index: 2;
	white-space: nowrap;
	max-width: calc(100% - 16px);
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none;
}

.mc-grid-more {
	position: relative;
	aspect-ratio: 16/9;
	width: calc(50% - 3px);
	min-width: 80px;
	border-radius: var(--radius-big);
	background: rgba(255, 255, 255, .06);
	overflow: hidden;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .15s;
	border: 2px dashed rgba(255, 255, 255, .12);
}

@media (hover: hover) and (pointer: fine){.mc-grid-more:hover {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .2);
}}

.mc-more-count {
	font-size: 18px;
	font-weight: 800;
	color: rgba(255, 255, 255, .5);
}

.mc-grid-has-focus .mc-grid-more {
	width: clamp(80px, 20%, 140px);
	aspect-ratio: 16/9;
}

.mc-call-overlay.fullscreen .mc-grid-more {
	width: auto;
	min-width: 0;
	aspect-ratio: 16/9;
	border-radius: var(--radius-small);
}

.mc-overflow-picker {
	position: fixed;
	inset: 0;
	z-index: 3000;
	background: rgba(0, 0, 0, .5);
	display: flex;
	align-items: center;
	justify-content: center;
	animation: mcCallIn .15s ease;
}

.mc-overflow-popup {
	background: #1E1F22;
	border-radius: var(--radius-section);
	padding: 12px;
	min-width: 220px;
	max-width: 340px;
	max-height: 60vh;
	overflow-y: auto;
	box-shadow: 0 12px 40px rgba(0, 0, 0, .5);
}

.mc-overflow-title {
	font-size: 12px;
	font-weight: 700;
	color: rgba(255, 255, 255, .4);
	text-transform: uppercase;
	letter-spacing: .5px;
	padding: 4px 8px 8px;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	margin-bottom: 4px;
}

.mc-overflow-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border-radius: var(--radius-big);
	cursor: pointer;
	transition: all .1s;
}

@media (hover: hover) and (pointer: fine){.mc-overflow-item:hover {
	background: rgba(255, 255, 255, .08);
}}

.mc-overflow-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 800;
	color: #fff;
	flex-shrink: 0;
}

.mc-overflow-name {
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mc-call-info-center {
	display: none;
}

.mc-call-top-actions {
	position: absolute;
	top: 16px;
	right: 16px;
	display: flex;
	gap: 6px;
	z-index: 5;
}

.mc-call-top-act {
	width: 36px;
	height: 36px;
	border-radius: var(--radius-big);
	border: none;
	background: rgba(255, 255, 255, .1);
	color: rgba(255, 255, 255, .6);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .12s;
	padding: 0;
}

@media (hover: hover) and (pointer: fine){.mc-call-top-act:hover {
	background: rgba(255, 255, 255, .2);
	color: #fff;
}}

.mc-call-top-act.active {
	background: var(--color-theme-main);
	color: #fff;
}

.mc-call-top-act svg {
	width: 16px;
	height: 16px;
	display: block;
}

.mc-call-actions {
	display: flex;
	gap: 10px;
	row-gap: 10px;
	margin-top: 4px;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	flex-shrink: 0;
}
@media (max-width: 600px) {
	.mc-call-actions { gap: 8px; row-gap: 8px; }
	.mc-call-btn { padding: 0 10px; }
	.mc-call-btn-arrow { width: 24px; }
	.mc-call-btn-area { gap: 6px; padding: 3px; }

	.mc-call-overlay.fullscreen .mc-call-grid-area {
		top: 64px;
		left: 8px;
		right: 8px;
		bottom: 92px;
		overflow: hidden;
	}
}

.mc-call-btn-area {
	display: flex;
	gap: 4px;
	padding: 4px;
	background: rgba(255, 255, 255, .06);
	border-radius: var(--radius-big);
	align-items: stretch;
}

.mc-call-btn-area .mc-call-btn-group,
.mc-call-btn-area .mc-call-btn {
	margin: 0;
}

.mc-call-btn {
	height: 42px;
	padding: 0 14px;
	border-radius: var(--radius-big);
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	transition: all .15s;
	color: #fff;
	position: relative;
}

.mc-call-btn svg {
	width: 18px;
	height: 18px;
	display: block;
	flex-shrink: 0;
}

.mc-call-btn-label {
	display: none;
}

.mc-call-btn.mute {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.mute:hover {
	background: #383A40;
}}

.mc-call-btn.mute.active {
	background: var(--color-theme-main);
}

.mc-call-btn.hangup {
	background: #E04B4B;
	height: 50px;
}

.mc-call-btn.hangup svg {
	width: 20px;
	height: 20px;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.hangup:hover {
	background: #C93636;
}}

.mc-call-btn.video-toggle {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.video-toggle:hover {
	background: #383A40;
}}

.mc-call-btn.video-toggle.active {
	background: #34A853;
}

.mc-call-btn.deafen {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.deafen:hover {
	background: #383A40;
}}

.mc-call-btn.deafen.active {
	background: var(--color-theme-main);
}

.mc-call-btn.screenshare {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.screenshare:hover {
	background: #383A40;
}}

.mc-call-btn.screenshare.active {
	background: #34A853;
}

.mc-call-btn.camera-flip {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.camera-flip:hover {
	background: #383A40;
}}

.mc-call-btn.camera-flip.active {
	background: #34A853;
}

.mc-call-btn.invite {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn.invite:hover {
	background: #383A40;
}}

.mc-call-btn-group {
	display: flex;
	align-items: stretch;
	position: relative;
}

.mc-call-btn-group .mc-call-btn {
	border-radius: var(--radius-big) 0 0 var(--radius-big);
}

.mc-call-btn-arrow {
	width: 28px;
	height: 42px;
	border: none;
	border-radius: 0 var(--radius-big) var(--radius-big) 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transition: all .12s;
	border-left: 1px solid rgba(255, 255, 255, .1);
	padding: 0;
}

.mc-call-btn-arrow svg {
	width: 12px;
	height: 12px;
	display: block;
}

.mc-call-btn-group .mute+.mc-call-btn-arrow {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn-group .mute+.mc-call-btn-arrow:hover {
	background: #444;
}}

.mc-call-btn-group .mute.active+.mc-call-btn-arrow {
	background: var(--color-theme-main);
	border-left-color: rgba(255, 255, 255, .2);
}

.mc-call-btn-group .deafen+.mc-call-btn-arrow {
	background: #2B2D31;
}

@media (hover: hover) and (pointer: fine){.mc-call-btn-group .deafen+.mc-call-btn-arrow:hover {
	background: #444;
}}

.mc-call-btn-group .deafen.active+.mc-call-btn-arrow {
	background: var(--color-theme-main);
	border-left-color: rgba(255, 255, 255, .2);
}

.mc-call-dropdown {
	position: absolute;
	bottom: calc(100% + 8px);
	left: 0;
	max-width: calc(100vw - 32px);
	background: #1E1F22;
	border: 1px solid #383A40;
	border-radius: var(--radius-big);
	padding: 4px;
	min-width: 180px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .4);
	z-index: 10;
	display: none;
}

.mc-call-dropdown.open {
	display: block;
}

.mc-call-dropdown-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	border-radius: var(--radius-standard);
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
	color: rgba(255, 255, 255, .8);
	transition: all .1s;
	border: none;
	background: none;
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	text-align: left;
	font-family: inherit;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

@media (hover: hover) and (pointer: fine){.mc-call-dropdown-item:hover {
	background: #383A40;
	color: #fff;
}}

.mc-call-dropdown-item.selected {
	color: var(--color-theme-main);
}

.mc-call-overlay.fullscreen {
	background: #111214;
}

.mc-call-overlay.fullscreen .mc-call-card {
	background: #111214;
	padding: 0;
	max-width: 100%;
	min-width: 100%;
	max-height: 100%;
	width: 100%;
	height: 100%;
	border-radius: 0;
	box-shadow: none;
	position: relative;
	overflow: hidden;
}

.mc-call-overlay.fullscreen .mc-call-grid-area {
	position: absolute;
	width: auto;
	top: 76px;
	left: 16px;
	right: 16px;
	bottom: 80px;
	z-index: 1;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mc-call-overlay.fullscreen .mc-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
	align-items: center;
	align-content: center;
	width: 100%;
	height: 100%;
}

.mc-call-overlay.fullscreen .mc-grid-tile {
	border-radius: var(--radius-big);
	aspect-ratio: 16/9;
	min-width: 0;
	max-width: none;
	transition: width .2s ease;
}

.mc-call-overlay.fullscreen .mc-grid-tile:only-child {
	max-width: none;
}

.mc-call-overlay.fullscreen .mc-grid-tile:only-child .mc-tile-placeholder {
	width: clamp(64px, 22%, 200px);
	height: auto;
	aspect-ratio: 1/1;
	font-size: clamp(24px, 3.5vw, 56px);
}

.mc-call-overlay.fullscreen .mc-tile-small {
	aspect-ratio: 16/9;
}

.mc-call-overlay.fullscreen .mc-grid-more {
	aspect-ratio: 16/9;
	border-radius: var(--radius-big);
}

.mc-call-overlay.fullscreen .mc-call-top-bar {
	position: absolute;
	top: 14px;
	left: 20px;
	z-index: 10;
}

.mc-call-overlay.fullscreen .mc-call-top-actions {
	position: absolute;
	top: 14px;
	right: 20px;
	z-index: 10;
}

.mc-call-overlay.fullscreen .mc-call-info-center {
	display: none;
}

.mc-call-overlay.fullscreen .mc-call-actions {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10;
	padding: 16px 24px 20px;
	background: linear-gradient(transparent, rgba(0, 0, 0, .7) 50%);
	margin: 0;
	justify-content: center;
}

.mc-tile-ctx {
	position: fixed;
	z-index: 3200;
	background: #1E1F22;
	border-radius: var(--radius-big);
	padding: 6px;
	min-width: 200px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
	border: 1px solid #383A40;
	animation: mcCallIn .1s ease;
}

.mc-ctx-header {
	padding: 6px 10px;
	font-size: 11px;
	font-weight: 700;
	color: rgba(255, 255, 255, .4);
	text-transform: uppercase;
	letter-spacing: .5px;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	margin-bottom: 2px;
}

.mc-ctx-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 7px 10px;
	border-radius: var(--radius-standard);
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	color: rgba(255, 255, 255, .8);
	transition: background .1s;
}

@media (hover: hover) and (pointer: fine){.mc-ctx-item:hover {
	background: rgba(255, 255, 255, .08);
	color: #fff;
}}

.mc-ctx-item svg {
	flex-shrink: 0;
}

.mc-ctx-vol {
	padding: 6px 10px;
}

.mc-ctx-vol label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 12px;
	font-weight: 600;
	color: rgba(255, 255, 255, .6);
	margin-bottom: 6px;
}

.mc-ctx-vol-val {
	font-variant-numeric: tabular-nums;
}

.mc-ctx-slider {
	width: 100%;
	height: 4px;
	-webkit-appearance: none;
	appearance: none;
	background: rgba(255, 255, 255, .15);
	border-radius: var(--radius-small);
	outline: none;
}

.mc-ctx-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--color-theme-main);
	cursor: pointer;
}

.mc-rejoin-banner {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2100;
	background: #111214;
	border: 1px solid #2B2D31;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 12px 10px 18px;
	font-size: 13px;
	font-weight: 600;
	border-radius: var(--radius-big);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
	max-width: calc(100vw - 32px);
	white-space: nowrap;
	animation: mcRiseIn .25s ease;
}

.mc-rejoin-banner .mc-rejoin-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #34A853;
	flex-shrink: 0;
	animation: mcDotPulse 1.5s infinite;
}

@keyframes mcRiseIn {
	from {
		transform: translate(-50%, 12px);
		opacity: 0;
	}

	to {
		transform: translate(-50%, 0);
		opacity: 1;
	}
}

.mc-rejoin-btn {
	background: var(--color-theme-main);
	color: #fff;
	border: none;
	border-radius: var(--radius-standard);
	padding: 6px 16px;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: background .12s;
}

@media (hover: hover) and (pointer: fine){.mc-rejoin-btn:hover {
	background: var(--color-theme-main-darker, #C4650F);
}}

.mc-call-widget {
	position: fixed;
	bottom: 24px;
	right: 24px;
	z-index: 1999;
	background: #1E1F22;
	border-radius: var(--radius-section);
	padding: 10px 14px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 8px;
	cursor: grab;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .3);
	animation: mcWidgetIn .25s ease;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	touch-action: none;
}

.mc-widget-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.mc-widget-pip {
	width: 220px;
	max-width: 46vw;
	aspect-ratio: 16 / 9;
	object-fit: contain;
	background: #111214;
	border-radius: var(--radius-big);
	display: block;
}

@media (hover: hover) and (pointer: fine){.mc-call-widget:hover {
	box-shadow: 0 12px 36px rgba(0, 0, 0, .35);
}}

.mc-call-widget.dragging {
	cursor: grabbing;
	opacity: .9;
	box-shadow: 0 16px 48px rgba(0, 0, 0, .4);
}

@keyframes mcWidgetIn {
	from {
		opacity: 0;
		transform: translateY(20px) scale(.9)
	}

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

.mc-widget-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #34A853;
	animation: mcDotPulse 1.5s infinite;
	flex-shrink: 0;
}

.mc-widget-info {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.mc-widget-name {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 140px;
}

.mc-widget-meta {
	display: flex;
	align-items: center;
	gap: 8px;
}

.mc-widget-timer {
	font-size: 12px;
	color: rgba(255, 255, 255, .5);
	font-variant-numeric: tabular-nums;
	font-weight: 600;
}

.mc-widget-peers {
	display: flex;
	align-items: center;
	gap: 3px;
	font-size: 11px;
	color: rgba(255, 255, 255, .4);
	font-weight: 600;
}

.mc-widget-peers svg {
	opacity: .5;
}

.mc-widget-actions {
	display: flex;
	gap: 4px;
	align-items: center;
	flex-shrink: 0;
}

.mc-widget-btn {
	width: 30px;
	height: 30px;
	border-radius: var(--radius-big);
	border: none;
	background: rgba(255, 255, 255, .08);
	color: rgba(255, 255, 255, .6);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .12s;
	padding: 0;
}

@media (hover: hover) and (pointer: fine){.mc-widget-btn:hover {
	background: rgba(255, 255, 255, .15);
	color: #fff;
}}

.mc-widget-btn.active {
	background: var(--color-theme-main);
	color: #fff;
}

.mc-widget-hangup {
	width: 30px;
	height: 30px;
	border-radius: var(--radius-big);
	background: #E04B4B;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	transition: all .12s;
	flex-shrink: 0;
	padding: 0;
}

@media (hover: hover) and (pointer: fine){.mc-widget-hangup:hover {
	background: #C93636;
}}

.mc-widget-hangup svg {
	width: 14px;
	height: 14px;
}

.mc-incoming-call {
	position: fixed;
	top: 24px;
	right: 24px;
	z-index: 3100;
	animation: mc-slide-in .3s ease-out;
}

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

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

.mc-incoming-body {
	background: #fff;
	border-radius: var(--radius-section);
	box-shadow: 0 8px 40px rgba(0, 0, 0, .15);
	padding: 16px 20px;
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 300px;
	border: 1.5px solid #EFEBE5;
}

.mc-incoming-pulse {
	position: absolute;
	inset: -4px;
	border-radius: var(--radius-section);
	border: 2px solid var(--color-theme-main);
	animation: mc-ring-pulse 1.5s infinite;
	pointer-events: none;
}

@keyframes mc-ring-pulse {
	0% {
		opacity: .6;
		transform: scale(1);
	}

	100% {
		opacity: 0;
		transform: scale(1.08);
	}
}

.mc-incoming-avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	flex-shrink: 0;
}

.mc-incoming-info {
	flex: 1;
	min-width: 0;
}

.mc-incoming-name {
	font-size: 14px;
	font-weight: 700;
	color: #1A1917;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mc-incoming-type {
	font-size: 12px;
	color: #6B6963;
}

.mc-incoming-actions {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

.mc-incoming-btn {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .15s;
	padding: 0;
}

.mc-incoming-btn.accept {
	background: #22C55E;
	color: #fff;
}

@media (hover: hover) and (pointer: fine){.mc-incoming-btn.accept:hover {
	background: #16A34A;
	transform: scale(1.08);
}}

.mc-incoming-btn.decline {
	background: #EF4444;
	color: #fff;
}

@media (hover: hover) and (pointer: fine){.mc-incoming-btn.decline:hover {
	background: #DC2626;
	transform: scale(1.08);
}}

[data-theme="dark"] .mc-incoming-body {
	background: #1E1E22;
	border-color: #2E2E34;
	box-shadow: 0 8px 40px rgba(0, 0, 0, .4);
}

[data-theme="dark"] .mc-incoming-name {
	color: #EEEEF0;
}

[data-theme="dark"] .mc-incoming-type {
	color: #68686E;
}

.ml-page-loader{display:flex;align-items:center;justify-content:center;height:100%;width:100%;opacity:0;animation:ml-fade-in .15s ease forwards;}
.ml-spinner{width:32px;height:32px;border:3px solid var(--ln2,rgba(0,0,0,.11));border-top-color:var(--or,#E2781A);border-radius:50%;animation:ml-spin .6s linear infinite;}
@keyframes ml-spin{to{transform:rotate(360deg)}}
@keyframes ml-fade-in{to{opacity:1}}
[data-theme="dark"] .ml-spinner{border-color:#2E2E34;border-top-color:#E2781A;}

button, select, summary, [role="button"],
input[type="button"], input[type="submit"], input[type="reset"],
.clickable-hash, [class*="btn"], [class*="button"] {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
input[type="text"], input[type="search"], input[type="email"], input[type="url"],
input[type="tel"], input[type="number"], input[type="password"], input:not([type]),
textarea, [contenteditable="true"] {
	-webkit-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
}

@media (pointer: coarse) {
	input[type="text"], input[type="search"], input[type="email"], input[type="url"],
	input[type="tel"], input[type="number"], input[type="password"], input[type="date"],
	input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"],
	input:not([type]), select, textarea, [contenteditable="true"] {
		font-size: 16px;
	}
}

.search-clear {
	width: 20px; height: 20px;
	border-radius: 50%;
	border: none;
	background: none;
	color: var(--t3);
	display: none;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	flex-shrink: 0;
	padding: 0;
	transition: color .12s;
}
.search-clear svg { width: 15px; height: 15px; }
@media (hover: hover) and (pointer: fine){ .search-clear:hover { color: var(--t1); } }
.has-search-clear { container-type: inline-size; }
@container (min-width: 12rem) {
	.has-search-clear input:not(:placeholder-shown) ~ .search-clear { display: flex; }
}
nav .actions span, .suite-drawer-item, .ml-toggle, .mc-call-top-act, .mc-ctx-item, .mc-call-dropdown-item, .mc-overflow-item, .mc-widget-hangup { user-select: none; }

[data-apps-group="support"] { display: none; }
@media (max-width: 389.98px) {
	[data-apps-group="support"] { display: flex; }
	.apps-menu-sep:last-of-type { display: block; }
}
body.meolya-admin [data-apps-group="support"] { display: flex; }

.demo-pill {
	position: fixed;
	right: 1rem;
	bottom: 1rem;
	z-index: 4500;
	display: flex;
	align-items: stretch;
	background: var(--sur);
	border: 1px solid var(--amber);
	border-radius: var(--radius-big);
	box-shadow: 0 8px 20px rgba(0, 0, 0, .22);
	overflow: hidden;
	font-size: .8rem;
	font-weight: 700;
	user-select: none;
}
.demo-pill-main {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .5rem .8rem;
	color: var(--amber);
	cursor: pointer;
}
.demo-pill-quit {
	display: inline-flex;
	align-items: center;
	padding: .5rem .8rem;
	background: var(--amber);
	color: #fff;
	cursor: pointer;
}
@media (max-width: 600px) {
	.demo-pill { bottom: 4.6rem; }
}

.demo-return {
	position: fixed;
	inset: 0;
	background: var(--modal-backdrop-bg);
	backdrop-filter: blur(var(--modal-backdrop-blur));
	z-index: var(--z-modal-stacked);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.demo-return-dlg {
	background: var(--sur);
	border: 1px solid var(--ln);
	border-radius: var(--radius-big);
	width: min(420px, 94vw);
	padding: 1.3rem 1.4rem;
	color: var(--t1);
}
.demo-return-dlg h2 {
	margin: 0 0 .5rem;
	font-size: 1.05rem;
}
.demo-return-dlg p {
	margin: .4rem 0;
	font-size: .86rem;
	color: var(--t2);
	line-height: 1.5;
}
.demo-return-btns {
	display: flex;
	justify-content: flex-end;
	gap: .6rem;
	margin-top: 1.1rem;
}
.demo-return-btn {
	padding: .5rem .95rem;
	border-radius: var(--radius-standard);
	font-size: .83rem;
	font-weight: 600;
	cursor: pointer;
	user-select: none;
}
.demo-return-btn.primary {
	background: var(--amber);
	color: #fff;
}
.demo-return-btn.ghost {
	background: var(--sur2);
	color: var(--t2);
}

.meo-req::after{content:'*';color:var(--or);font-weight:700;margin-left:.15em;letter-spacing:0;line-height:1;vertical-align:baseline}
.meo-req-i{color:var(--or);font-weight:700;margin-left:.15em;letter-spacing:0;line-height:1}