:root{
	--font:14px;
	--head:70px;
	--radius:14px;
	--padding:10px;
	--top:#fff;
	--background:#f6f6f6;
	--color:rgba(0,0,0,0.7);
	--ground:rgba(0,0,0,0.05);
	--hover:rgba(0,0,0,0.1);
	--active:rgba(0,0,0,0.15);
	--disabled:rgba(0,0,0,0.4);
	--shadow:0px 2px 4px rgba(0,0,0,0.2);
	--window:0px 0px 20px rgba(0,0,0,0.2);
	--error:rgba(255,0,0,0.1);
	--s:0.3s;
}
::-webkit-scrollbar{width:6px; height:6px;}
::-webkit-scrollbar-thumb{background:var(--active); border-radius:var(--radius);}
::-webkit-scrollbar-thumb:hover{background:var(--color);}
::placeholder{color:var(--disabled); transition:var(--s);}
::selection{background:var(--active);}
*{
	outline-style:none;
	box-sizing:border-box;
	user-select:none;
	-webkit-user-drag:none;
	line-height:normal;
	scroll-behavior:smooth;
}
html{scrollbar-gutter:stable;}
body{
	background-color:#fff;
	color:var(--color);
	padding:0px;
	margin:0px;
	-webkit-tap-highlight-color:transparent;
	overscroll-behavior:none;/*отключить свайп*/
	opacity:0;
	transition:opacity var(--s);
}
/*Inter Tight (cyrillic-ext + latin-ext)*/
body,button,input,text{
	font-family:"Inter";
	font-size:var(--font);
}
@font-face{
	font-family:"Inter";
	font-display:swap;
	font-weight:normal;/*400*/
	src:url("/inter.woff2") format("woff2");/*Inter Tight*/
}
@font-face{
	font-family:"Inter";
	font-display:swap;
	font-weight:bold;/*600*/
	src:url("/inter.bold.woff2") format("woff2");/*Inter Tight*/
}
#head{
	z-index:4;
	inset:0px;
	position:fixed;
	padding:var(--padding);
	height:var(--head);
	white-space:nowrap;
	transition:var(--s);
}
#head *{vertical-align:middle;}
#head::before{
	z-index:-1;
	content:"";
	inset:0px;
	position:fixed;
	height:var(--head);
	transition:var(--s);
}
#head[glass="1"]::before{
	box-shadow:var(--window);
	backdrop-filter:blur(6px);
	background:linear-gradient(to top,rgba(255,255,255,0.5),var(--top));
}
#head span{
	display:block;
	margin:0px auto;
	max-width:100%;
	transition:max-width 1s;
}
#head[index] span{max-width:1000px;}
#head menu{
	float:left;
	background-image:url("/images/menu.svg");
}
#head menu::before{
	content:"";
	display:block;
	position:absolute;
	width:10px;
	height:100vh;
	inset:0px;
}
#head menu p::-webkit-scrollbar{display:none;}
#head menu:hover p{
	width:230px;
	max-height:calc(100vh - 20px);
}
#head menu p a{
	font-weight:normal;
	text-transform:none;
	padding-left:60px;
}
#head menu p a[select]{
	background-color:var(--active) !important;
	border-radius:var(--radius);
}
#head menu[open="1"]{min-width:0px;}
#head menu[open="1"] p{
	opacity:1;
	width:250px;
	min-height:100vh;
	inset:10px;
	padding:10px;
	margin:-10px;
	pointer-events:all;
	border-radius:0px var(--radius) var(--radius) 0px;
	box-shadow:none;
	background:var(--background);
}
#head menu[open="1"] p b{
	display:block;
	margin:var(--padding) 0px;
	background:var(--hover);
	border-radius:var(--radius);
}
#head #lock{
	opacity:0;
	position:absolute;
	width:30px;
	height:50px;
	right:0px;
	padding:0px;
	background-image:url("/images/right.svg");
	background-repeat:no-repeat;
	background-position:center;
}
#head menu:hover #lock{opacity:1;}
#head menu[open="1"] #lock{
	right:10px;
	background-image:url("/images/left.svg");
}
#head menu #ocx{
	opacity:1;
	height:50px;
	margin-bottom:var(--padding);
	background-image:url("/images/ocx.svg");
	background-position:center;
	background-size:75px;
}
#head menu[open="0"] #ocx{
	opacity:0;
	height:0px;
	margin:0px;
	background-size:0px;
}
#head menu[open="1"] + b + #logo{
	width:50px;
	background-image:url("/images/o.svg");
	background-size:auto;
}
#logo{
	float:left;
	width:100px;
	height:50px;
	cursor:pointer;
	transition:var(--s);
	background-image:url("/images/ocx.svg");
	background-position:center center;
	background-repeat:no-repeat;
	background-size:75px;
	border-radius:var(--radius);
}
#logo:hover{background-color:var(--hover);}
#logo:active{background-color:var(--active);}
#search{
	float:left;
	width:300px;
	margin:0px var(--padding);
	color:rgba(0,0,0,0.7);
	background-image:url("/images/i.svg");
	background-position:right 13px center;
}
#console{
	opacity:0;
	transition:opacity var(--s);
}
#console button, top button, bottom button{
	border-radius:50px;
	background-color:transparent;
}
#console button:hover, top button:hover, bottom button:hover{background-color:var(--hover);}
#console button:active, top button:active, bottom button:active{background-color:var(--active);}
menu{
	display:inline-block;
	height:50px;
	min-width:50px;
	margin:0px;
	padding:0px;
	border-radius:50px;
	background-repeat:no-repeat;
	background-position:13px 13px;
	transition:var(--s);
	white-space:nowrap;
}
menu p{
	z-index:1;
	opacity:0;
	display:block;
	position:fixed;
	overflow:hidden;
	pointer-events:none;
	width:50px;
	min-height:50px;
	max-height:50px;
	margin:0px;
	padding-top:50px;
	border-radius:var(--radius);
	transition:var(--s);
	background-color:#fff;
	box-shadow:var(--window);
}
menu:hover{background-position:-24px 13px;}
menu + b{
	inset:0;
	opacity:0;
	position:fixed;
	visibility:hidden;
	background:rgba(0,0,0,0.5);
	transition:opacity var(--s), visibility 0s linear var(--s);
}
menu[open="0"]:hover + b{
	z-index:-1;
	opacity:1;
	visibility:visible;
	transition:opacity var(--s);
}
menu:hover p{
	opacity:1;
	width:250px;
	max-height:500px;
	padding:0px;
	overflow-y:auto;
	animation:events 0s 0s forwards;
}
@keyframes events{to{pointer-events:auto;}}
menu button{position:relative;}
menu:hover button{background-color:var(--hover) !important;}
menu:hover::before{
	content:"";
	display:block;
	position:absolute;
	width:250px;
	height:50px;
}
menu p label{display:block;}
menu p input[type="checkbox"]{
	margin:0px !important;
	position:absolute;
	width:50px;
	height:50px;
	right:0px;
}
menu p a{
	display:block;
	color:var(--color);
	font-weight:bold;
	padding:0px 20px;
	line-height:50px;
	border-radius:50px;
	text-decoration:none;
	text-transform:uppercase;
	overflow:hidden;
	background-repeat:no-repeat;
	background-position:13px 13px;
	transition:var(--s);
}
menu p a:hover{
	border-radius:var(--radius);
	background-color:var(--hover);
}
menu p a:active{
	background-color:var(--active);
}
menu p a[icon]{
	padding-left:50px;
	background-repeat:no-repeat;
	background-position:13px center;
}
#body{
	height:100%;
	min-height:100vh;
	position:relative;
	padding:var(--padding);
	padding-top:var(--head);
	transition:var(--s);
}
#body center{top:var(--head);}
#body div.head, #body div.tree{top:var(--head);}
a{
	cursor:pointer;
	color:#2579b4;
	text-decoration:underline;
}
[onclick]{cursor:pointer !important;}
img[data-src]{opacity:0;}
img{
	opacity:1;
	pointer-events:none;
	border-radius:var(--radius);
	background-color:var(--hover);
	transition:opacity 1s;
}
hr{
	margin:20px 0px;
	border:1px;
	height:1px;
	background-color:var(--ground);
}
center{
	position:absolute;
	inset:0px;
	display:grid;
	place-items:center;
	color:#c0c0c0;
	font-size:20px;
	padding:var(--padding);
}
#command{display:none;}
#command{
	position:fixed;
	bottom:20px;
	right:20px;
	width:350px;
	max-height:200px;
	background:#fff;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	overflow-y:auto;
}
#command:empty{
	display:none;
}
#command c{
	display:block;
	padding:5px 10px;
}
block{
	display:block;
	padding:var(--padding);
}
block tile{margin-bottom:var(--padding);}
l{
	display:table;
	position:relative;
	width:100%;
	vertical-align:middle;
}
c{
	display:table-cell;
	width:25%;
	padding:var(--padding);
	vertical-align:middle;
}
c h2{margin-bottom:20px;}
e{
	display:block;
	max-width:calc(100vw - 20px);
	line-height:40px;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	padding:0px 20px 0px 50px;
	background-repeat:no-repeat;
	background-position:13px center;
	border-radius:50px;
	transition:var(--s);
}
e:hover{
	border-radius:0px;
	background-color:var(--hover);
	border-radius:var(--radius);
}
e[icon="auto"]{font-weight:bold;}
e b{font-weight:bold;}
#document{padding:var(--padding);}
b.ocx{
	display:inline-block;
	height:15px;
	line-height:15px;
	padding:0px 0px 0px 55px;
	background-image:url("/images/ocx.svg");
	background-repeat:no-repeat;
	background-size:45px 15px;
	background-position:center left;
}
div.print{
	color:#000;
	padding:30px;
}
b.float{
	display:block;
	font-size:40px;
	line-height:50px;
	white-space:nowrap;
	font-weight:normal;
}
b.float h2{
	margin:0px;
}
b.total{
	display:block;
	font-size:40px;
	padding:10px 20px;
	white-space:nowrap;
	border-radius:var(--radius);
	background-color:var(--ground);
	transition:var(--s);
	font-weight:normal;
}
b.total[onclick]:hover{
	background-color:var(--hover);
}
b.change{
	color:var(--disabled);
	display:block;
	font-size:30px;
	font-weight:normal;
	line-height:30px;
}
input[type="text"].float,input[type="text"].float:hover,input[type="text"].float:focus{
	display:block;
	font-size:40px;
	margin:10px 0px;
	border:none;
	transition:none;
	border-radius:none;
	box-shadow:none;
	padding:0px;
	color:var(--color);
	background-color:transparent;
}
strong{
	display:block;
}
h1{
	display:block;
	margin:0px 0px 20px 0px;
	padding:0px;
	font-size:18px;
	height:30px;
	line-height:30px;
	font-weight:normal;
}
h2{
	display:block;
	margin:0px;
	padding:0px;
	font-size:16px;
	height:24px;
	line-height:24px;
	font-weight:normal;
}
h1[icon],h2[icon]{
	padding-left:34px;
	background-position:left center;
	background-repeat:no-repeat;
}
h1 b,h2 b{
	font-weight:normal;
	color:var(--disabled);
	padding:0px var(--padding);
	transition:var(--s);
}
h1 b:hover,h2 b:hover{color:var(--color);}
[bold]{font-weight:bold;}
[white]{color:rgba(255,255,255,0.8);}
alloy{
	display:inline-block;
	border-radius:50px;
	transition:background var(--s);
}
alloy:hover{background-color:var(--hover);}
group{
	display:inline-block;
	border-radius:50px;
	transition:var(--s);
}
group button{display:none;}
group button:first-child{display:inline-block;}
group button:hover{border-radius:50px !important;}
group button:disabled{opacity:0.5;}
group[open]{background-color:var(--hover);}
group[open] button{display:inline-block;}
group group{background-color:transparent;}
button{
	min-width:50px;
	height:50px;
	color:var(--color);
	padding:0px 20px 0px 50px;
	margin:0px;
	border:none;
	cursor:pointer;
	font-size:18px;
	border-radius:50px;
	font-weight:bold;
	background-repeat:no-repeat;
	background-position:13px 13px;
	background-color:transparent;
	transition:var(--s);
	vertical-align:middle;
}
button:hover, button:focus{background-color:var(--hover) !important;}
button:active{background-color:var(--active) !important;}
button:disabled,button:disabled:hover{
	opacity:0.5;
	cursor:default !important;
	background-color:transparent !important;
}

button[icon="load"]{pointer-events:none;}
button img{margin:13px 0px;}
button:not([icon]){
	font-size:var(--font);
	padding:0px 20px;
	background-color:var(--ground);
	background-position:center center;
}
button:not([icon]):hover,button:not([icon]):focus{background-color:var(--hover);}
button:not([icon]):active{background-color:var(--active);}
button:not([icon]):disabled,button:not([icon]):disabled:hover{
	cursor:default !important;
	color:rgba(0,0,0,0.3);
	background-color:rgba(0,0,0,0.04);
}
button:has(hr){
	width:50px;
	padding:0px !important;
	border-radius:50px;
	font-size:12px;
	line-height:12px;
	font-weight:bold;
	color:rgba(0,0,0,0.7);
}
button hr{
	height:3px;
	margin:3px 10px !important;
	border-radius:3px;
	background-color:rgba(0,0,0,0.7);
}
button:empty{padding:0px;}
button[on]{background-color:var(--hover) !important;}
b.thunder,b.percent{
	display:block;
	position:absolute;
	width:24px;
	height:24px;
	border-radius:100%;
	background-image:url("/images/thunder.svg");
	background-repeat:no-repeat;
	background-size:18px;
	background-position:center;
	transition:var(--s);
}
b.percent{
	right:10px;
	background-image:url("/images/percent.svg");
}
b.thunder:hover,b.percent:hover{
	background-color:var(--hover);
}
div.notice div{
	display:block;
	background-color:#fff;
	border-radius:var(--radius);
	padding:20px;
	margin:0px 0px 20px 0px;
	box-shadow:var(--shadow);
}
button.images{
	width:100px;
	height:100px;
	border-radius:var(--radius);
	background-image:url("/images/image.svg");
}
.gray,.gray a{color:var(--disabled);}
tile button.ok{background-color:var(--ground);}

form.barcode{
	overflow:hidden;
	width:0px;
	height:0px;
}
console{display:none;}

input[type="checkbox"],input[type="radio"]{
	z-index:1;
	height:18px;
	width:18px;
	cursor:pointer;
	margin:0px;
	opacity:0.2;
	appearance:none;
	vertical-align:middle;
	background:url("/images/checkbox.0.svg") no-repeat center center;
	transition:var(--s);
}
input[type="checkbox"]:hover,input[type="radio"]:hover{opacity:0.7;}
input[type="checkbox"]:checked,input[type="radio"]:checked{opacity:0.7; background-image:url("/images/checkbox.1.svg");}
input[type="checkbox"]:checked + b,input[type="radio"]:checked + b{background:var(--active);}
input[type="checkbox"]:checked:hover,input[type="radio"]:checked:hover{opacity:0.8;}
input[type="checkbox"]:disabled,input[type="radio"]:disabled{opacity:0.1; cursor:default;}
#load,div.load{
	z-index:9999;
	display:block;
	position:fixed;
	width:48px;
	height:48px;
	top:calc(50% - 24px);
	left:calc(50% - 24px);
	background-image:url("/images/load.svg");
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
}
#load{display:none;}
select{
	position:relative;
	cursor:pointer;
	width:100%;
	text-align:left;
	list-style:none;
	display:inline-block;
	vertical-align:middle;
	color:rgba(0,0,0,0.8);
	padding:0px;
	margin:0px;
	height:50px;
	border-radius:var(--radius);
	border:1px solid rgba(0,0,0,0.2);
	background-color:rgba(0,0,0,0.02);
	box-shadow:var(--shadow);
}
top set{width:200px !important;}
set{
	display:inline-flex;
	position:relative;
	cursor:pointer;
	width:100%;
	min-width:50px;
	line-height:50px;
	padding:0px 15px;
	color:var(--color);
	font-weight:bold;
	text-transform:uppercase;
	border-radius:var(--radius);
	transition:var(--s);
	background-color:var(--ground);
	background-position:13px 13px;
	background-repeat:no-repeat;
}
set[icon],set[icon] o{padding-left:50px;}
set:not([disabled]):hover{background-color:var(--hover) !important;}
set::after{
	width:100%;
	content:attr(name);
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}
set:not([name])::after{content:" ";}
set[disabled],set[disabled]:hover{
	opacity:0.5;
	cursor:default !important;
	background-color:var(--ground);
}
set b{
	z-index:2;
	display:none;
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	max-height:500px;
	background-color:#fff;
	overflow-x:hidden;
	overflow-y:auto;
	border-radius:var(--radius);
	box-shadow:var(--window);
}
set o{
	display:block;
	width:100%;
	line-height:50px;
	border-radius:50px;
	padding-left:20px;
	background-position:13px 13px;
	background-repeat:no-repeat;
	transition:var(--s);
}
set o:hover{
	border-radius:var(--radius);
	background-color:var(--hover);
}
set.currency{
	max-width:50px;
	padding:0px;
	font-size:24px;
	text-align:center;
}
set.currency o{padding:0px;}
#button{display:none;}
input[type="text"],input[type="password"]{
	cursor:text !important;
	width:100%;
	color:var(--color);
	height:50px;
	padding:0px 15px;
	margin:0px;
	border:none;
	border-radius:var(--radius);
	background-color:var(--ground);
	background-position:13px 13px;
	background-repeat:no-repeat;
	transition:var(--s);
}
text{
	display:block;
	cursor:text;
	width:100%;
	max-width:100vw;
	min-height:50px;
	border-radius:var(--radius);
	background-position:13px 13px;
	background-repeat:no-repeat;
	background-color:var(--ground);
	padding:15px;
	transition:var(--s);
	overflow-y:auto;
	word-break:break-all;
}
text[icon]{
	padding-left:50px;
}
text:empty::after{
	color:rgba(0,0,0,0.5);
	content:attr(placeholder);
}
input[type="text"]:hover,input[type="password"]:hover,text:hover{
	background-color:var(--hover);
}
input[type="text"]:focus,input[type="password"]:focus,text:focus{
	background-color:#fff;
	box-shadow:var(--shadow);
}
input[type="text"]:disabled,input[type="password"]:disabled,text:disabled{
	color:var(--disabled);
	cursor:default !important;
}
div.head input[type="text"],top input[type="text"],hat input[type="text"]{
	background-color:var(--ground);
	box-shadow:none !important;
}
text.full{
	opacity:1;
	border:none;
	padding:20px;
	position:absolute;
	inset:120px 0px 0px 0px;
	height:auto;
	box-shadow:none;
	background-color:#fff;
}
text.full:hover,text.full:focus{
	box-shadow:none;
}
i{
	display:block;
	position:relative;
	font-style:normal;
	font-weight:normal;
	text-align:left;
}
i:has(input:disabled){opacity:0.5;}
i input{padding-top:13px !important;}
i set{padding-top:13px; line-height:37px;}
i text{padding-top:23px; padding-bottom:10px;}
i input:not(:focus)::placeholder{color:transparent;}
i > :is(button,set) + :is(input,text){padding-right:65px !important;}
i > i{
	position:absolute;
	content:attr(name);
	inset:0px;
	padding:0px 15px;
	color:var(--disabled);
	line-height:50px;
	font-size:var(--font);
	pointer-events:none;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	transition:var(--s);
}
i [icon] + i{padding-left:50px;}
i :is(:focus,input:not(:placeholder-shown),set,text:not(:empty)) + i{font-size:12px; line-height:30px;}
i > button, i > input + set{
	position:absolute;
	right:0px;
	line-height:50px;
	border-radius:50px;
	background-color:transparent;
}
i *:hover{border-radius:var(--radius);}
div.total{
	z-index:4;
	position:absolute;
	display:block;
	min-height:50px;
	max-height:50px;
	top:0px;
	right:calc(50px + var(--padding));
	overflow:hidden;
	border-radius:var(--radius);
	transition:var(--s);
}
div.total *{
	font-size:24px;
	font-weight:bold;
	text-align:right;
	background-color:transparent;
}
div.total b{
	opacity:0;
	display:block;
	line-height:50px;
	border-radius:50px;
	pointer-events:none;
	transition:var(--s);
}
div.total b:first-child{
	opacity:1;
	display:inline-block;
	border-radius:var(--radius);
	background-color:var(--ground);
}
div.total:hover{
	max-width:300px;
	max-height:300px;
	background-color:#fff;
	box-shadow:var(--window);
}
div.total:hover b{
	opacity:1;
	display:block;
	background-color:transparent;
	animation:events 1s 0s forwards;
}
div.total:hover b:hover{
	border-radius:var(--radius);
	background-color:var(--hover);
}
div.total b.currency{
	line-height:0px;
	border-radius:var(--radius);
	background-color:var(--background);
}
div.total button{
	width:25%;
	padding:0px;
	text-align:center;
}
div.total input{
	display:block;
	width:200px;
}
#total b{padding:0px 15px;}
div.total button:hover{border-radius:var(--radius);}




input.table{
	display:block;
	color:var(--color);
	height:40px;
	padding:0px 20px;
	margin:0px;
	border:none;
	box-shadow:none;
	border-radius:0px;
	border-bottom:1px solid var(--ground);
	background-repeat:no-repeat;
	transition:none;
	background-color:transparent;
}
input.table:hover, input.table:focus{
	border:none;
	box-shadow:none;
	border-bottom:1px solid var(--ground);
	background-color:var(--background);
}
input[icon]{padding-left:50px !important;}
input.price{text-align:center;}
window name,background{display:none;}
window name[brick]{
	display:block;
	visibility:hidden;
	height:50px;
}
div.window{
	z-index:2;
	position:fixed;
	background:#fff;
	overflow:hidden;
	border-radius:var(--radius);
	box-shadow:var(--window);
	transition:width var(--s), height var(--s);
	animation:open var(--s) forwards;
}
@keyframes open{
	from{opacity:0; transform:perspective(100vw) rotateX(10deg);}
	to{opacity:1; transform:perspective(100vw) rotateX(0deg);}
}
@keyframes close{to{opacity:0; transform:perspective(100vw) rotateX(10deg);}}
span.name{
	inset:0px;
	position:fixed;
	z-index:4;
	display:block;
	height:50px;
	padding:0px 50px 0px 20px;
	line-height:50px;
	color:rgba(0,0,0,0.7);
	font-size:16px;
	transition:var(--s);
	background-size:24px 24px;
	background-repeat:no-repeat;
	background-position:13px center;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}
span.name[icon]{padding-left:50px;}
span.close{
	z-index:11;
	cursor:pointer;
	width:50px;
	height:50px;
	position:absolute;
	inset:0px 0px auto auto;
	transition:var(--s);
	border-radius:100%;
	background-position:center center;
	background-repeat:no-repeat;
	background-image:url("/images/close.svg");
}
span.close:hover{background-color:var(--hover);}
span.close:active{border-radius:var(--radius); background-color:var(--hover);}
span.body{
	z-index:2;
	width:100%;
	height:100%;
	display:block;
	overflow:auto;
	padding:0px;
}
bar{
	display:block;
	white-space:nowrap;
	border-radius:var(--radius);
}
bar *{vertical-align:middle;}
bar hr{
	display:inline-block;
	height:50px;
	width:var(--padding);
	padding:0px;
	margin:0px;
	background:transparent;
}
div.window span{transition:var(--s);}
top{
	z-index:3;
	inset:0px 0px auto 0px;
	position:absolute;
	color:rgba(0,0,0,0.7);
	line-height:0px;
	padding:var(--padding);
	padding-top:calc(50px + var(--padding));
	background:var(--background);
}
top a{
	text-decoration:none;
}
top i{
	display:inline-block;
}
bottom{
	z-index:3;
	position:absolute;
	left:0px;
	right:0px;
	bottom:0px;
	background:var(--background);
	padding:10px;
}
div.window hat{
	display:block;
	color:rgba(0,0,0,0.7);
	line-height:0px;
	padding:var(--padding);
	padding-top:calc(50px + var(--padding));
	background:var(--background);
}
div.window div.head{
	color:rgba(0,0,0,0.7);
	background:var(--background);
	line-height:0px;
	padding:var(--padding);
	padding-top:calc(50px + var(--padding));
}
div.window div.body{
	padding:50px 20px 20px 20px;
	margin:0px;
	max-width:none;
}
div.left{
	position:absolute;
	inset:120px 50% 0px 0px;
	overflow-y:auto;
	border-right:10px solid var(--background);
}
div.left text{
	border:none;
	padding:20px;
	width:100%;
	height:100%;
	box-shadow:none;
	border-radius:0px;
}
div.right{
	z-index:0;
	position:absolute;
	inset:120px 0px 0px 50%;
	overflow-y:auto;
}
bottom e.right button{margin:0px;}
label{
	display:table;
	cursor:pointer;
}
label input[type="checkbox"], label input[type="radio"]{margin:4px 10px 4px 0px !important;}
label[icon]{
	display:block;
	line-height:50px;
	background-repeat:no-repeat;
	background-position:50px center;
	border-radius:var(--radius);
	white-space:nowrap;
	font-weight:bold;
	text-transform:uppercase;
	text-overflow:ellipsis;
	overflow:hidden;
}
label[icon] input[type="checkbox"]{
	float:left;
	width:18px;
	height:18px;
	margin:16px 50px 16px 16px !important;
	outline:0px solid rgba(0,0,0,0);
	transition:0.5s;
}
label[icon] input[type="checkbox"]:checked{outline:1000px solid var(--ground);}
[sort]{
	background-color:var(--hover);
	border-radius:var(--radius) !important;
}
div.table{
	width:100%;
	display:table;
}
div.table div.head{
	z-index:2;
	height:50px;
	cursor:default;
	font-weight:bold;
	position:sticky;
	background:linear-gradient(to top,transparent,#fff);
}
div.table div.head:hover{
	background:linear-gradient(to top,transparent,#fff);
}
div.window div.head{top:0px;}
div.table div.head span, div.table div.head n{
	border-radius:0px;
}
div.table div.head span[onclick]{
	transition:var(--s);
}
div.table div.head span[onclick]:hover{
	background-color:var(--hover);
	border-radius:var(--radius) !important;
}
div.table div.error n:first-child{
	color:#d64937;
	padding-left:60px;
	background:url("/images/error.svg") no-repeat 18px center;
}
div.table b{font-weight:bold;}
div.table red{font-weight:bold; color:#ef3d21;}
div.table button:hover{border-radius:var(--radius);}
div.table set{
	background-color:transparent;
	text-transform:none;
	padding:0px 20px;
}
div.table button{background-color:transparent;}
span.document,span.do,span.delete{
	width:50px;
	min-width:50px;
	background-repeat:no-repeat;
	background-position:center center !important;
}
b.do{
	z-index:4;
	display:block;
	position:absolute;
	width:24px;
	height:24px;
	inset:26px 0px 0px 26px;
	border-radius:100%;

	background:var(--background) url("/images/d.svg") no-repeat center;
	background-size:16px;
}
span.document{background-image:url("/images/document.svg");}
span.do{background-image:url("/images/do.svg");}
span.delete{background-image:url("/images/delete.svg");}
div.table .s{background:var(--background);}
div.table div, div.table label{
	display:table-row;
	transition:var(--s);
}
div.table span.button{
	padding:0px;
	width:50px;
}
div.table span.button b{display:none;}
div.table span, div.table n, div.table label{
	display:table-cell;
	height:40px;
	line-height:40px;
	max-width:300px;
	padding:0px 20px;
	vertical-align:middle;
	background-repeat:no-repeat;
	background-position:13px center;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	transition:var(--s);
}
div.table span:first-child, div.table n{border-radius:50px 0px 0px 50px;}
div.table span:last-child{border-radius:0px 50px 50px 0px;}
div.table div:hover{background-color:var(--hover);}
div.table div:hover span:first-child, div.table div:hover n{border-radius:var(--radius) 0px 0px var(--radius);}
div.table div:hover span:last-child{border-radius:0px var(--radius) var(--radius) 0px;}
div.table n{
	cursor:default;
	width:60px;
	min-width:60px;
	text-align:center;
	color:var(--disabled);
}
div.table v{
	display:block;
	line-height:15px;
	max-width:150px;
	overflow:hidden;
	color:var(--disabled);
	text-overflow:ellipsis;
}
data{
	display:block;
	padding:20px;
}
data[icon]{
	min-height:50px;
	line-height:16px;
	color:var(--color);
	padding:17px 20px 17px 60px;
	border-radius:50px;
	background-repeat:no-repeat;
	background-position:18px center;
	transition:var(--s);
}
data[onclick]:hover, images[onclick]:hover{
	border-radius:var(--radius);
	background-color:var(--hover);
}
data[onclick]:active, images[onclick]:active{
	background-color:var(--active);
}
data[go]{
	font-weight:bold;
	text-transform:uppercase;
	border-radius:0px !important;
	background-color:var(--ground);
}
name{
	display:block;
	height:50px;
	line-height:50px;
	color:var(--color);
	font-size:16px;
	font-weight:bold;
	border-radius:50px;
	padding:0px 20px 0px 60px;
	background-repeat:no-repeat;
	background-position:18px center;
	transition:var(--s);
}
name[onclick]:hover{
border-radius:var(--radius);
background-color:var(--hover);
}
name[onclick]:active{background-color:var(--active);}
images{
	display:block;
	white-space:nowrap;
	overflow:hidden;
	height:70px;
	padding:10px;
	transition:var(--s);
	border-radius:50px;
}
images img{
	height:40px;
	width:40px;
	margin:5px;
}
gray{
	display:block;
	color:var(--disabled);
}
time{
	display:block;
	color:var(--disabled);
	line-height:50px;
	padding:0px 20px 0px 60px;
	background:url("/images/time.svg") no-repeat 18px center;
}
info{
	display:block;
	color:var(--disabled);
	min-height:50px;
	line-height:16px;
	padding:17px 20px 17px 60px;
	background:url("/images/inf.svg") no-repeat 18px center;
}
comment{
	float:right;
	line-height:40px;
	color:var(--disabled);
}
notice{
	float:right;
	line-height:40px;
	font-weight:bold;
}
count{
	width:150px;
	min-width:150px;
	display:block;
	float:right;
	font-size:18px;
	line-height:40px;
	text-align:right;
	font-weight:bold;
}
data count{line-height:50px; margin:-17px 0px;}
div.table div span.g{font-weight:bold;}
div.table div:first-of-type{font-weight:bold;}
div.table span[icon]{padding:0px 20px 0px 50px;}
div.table span.auto{
	padding:0px 20px 0px 50px;
	font-weight:bold;
	background-image:url("/images/auto.svg");
	background-color:var(--ground);
}
div.table span.null{
	padding:0px 20px 0px 50px;
}
div.table span.checkbox{
	width:50px;
	min-width:50px;
	padding:0px;
	text-align:center;
	line-height:0px;
}
div.table span.checkbox input[type="checkbox"]{
	width:50px;
	height:40px;
}
div.table span.n{
	width:100px;
	min-width:100px;
	padding:0px;
	text-align:center;
}
div.table span.b{
	width:100px;
	min-width:100px;
	text-align:center;
	font-weight:bold;
}
div.table hr{margin:10px 0px;}
tile product{
	border-radius:var(--radius) !important;
}
div.table span.product{
	padding:0px;
	min-width:500px;
}
product{
	display:flex;
	align-items:center;
	height:50px;
	padding:0px 5px 0px 0px;
	border-image-source:none;
	line-height:13px;
	min-width:500px;
	overflow:hidden;
	border-radius:50px;
	transition:var(--s);
	mask-image:linear-gradient(to left,rgba(0,0,0,0),rgba(0,0,0,1) 50px);
}
product:hover{
	white-space:normal;
	border-radius:0px;
	background-color:var(--hover);
	border-radius:var(--radius);
	mask-image:none;
}
product input[type="checkbox"]{
	flex-shrink:0;
	height:50px;
	width:50px;
	background-position:center center;
}
product img{
	flex-shrink:0;
	height:40px;
	width:40px;
	margin:5px;
	border-radius:var(--radius);
	pointer-events:auto;
	background:var(--ground);
}
product img[onclick]:hover{filter:brightness(70%);}
product p{
	flex-shrink:0;
	display:block;
	width:100px;
	margin:0px 10px 0px 5px;
	transition:var(--s);
	white-space:nowrap;
	text-overflow:ellipsis;
}
product p v{
	display:block;
	line-height:20px !important;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	transition:var(--s);
	color:var(--disabled);
}
product p v[onclick]:hover{
	padding:0px 10px;
	border-radius:50px;
	color:var(--color);
	background-color:var(--hover);
}
product count{
	width:60px;
	min-width:60px;
	margin:5px var(--padding) 5px 0px;
	text-align:center;
	border-radius:var(--radius);
	background-color:var(--ground);
}
div.tree{
	z-index:2;
	position:sticky;
	top:0px;
	height:50px;
	font-weight:bold;
	text-transform:uppercase;
	white-space:nowrap;
	min-width:500px;
	overflow-x:auto;
	border-radius:var(--radius);
	background:linear-gradient(to top,transparent,#fff);
}
div.tree::-webkit-scrollbar{display:none;}
div.tree b{
	display:inline-block;
	line-height:50px;
	padding:0px 20px;
	border-radius:50px;
	transition:var(--s);
	padding:0px 20px 0px 50px;
	background-repeat:no-repeat;
	background-position:13px center;
}
div.tree b:hover{
	border-radius:var(--radius);
	background-color:var(--hover);
}
div.tree b:active{
	background-color:var(--active);
}
div.tree b[icon="home"]{
	width:50px;
	min-width:50px;
	padding:0px;
	background-image:url("/images/home.svg");
	background-position:center center;
}
div.table span.r{
	width:50px;
	min-width:50px;
	padding:0px;
	text-align:center;
	font-weight:bold;
}
div.table span.pcs{
	width:50px;
	min-width:50px;
	padding:0px;
	text-align:center;
	font-weight:bold;
	font-size:18px;
}
div.table span.price{
	width:80px;
	min-width:80px;
	line-height:18px;
	padding:0px;
	text-align:center;
	font-weight:bold;
	font-size:18px;
	color:var(--disabled);
}
div.table span.price b{
	display:block;
	font-size:var(--font);
	opacity:0.5;
}
div.table span.d{
	width:200px;
	max-width:200px;
}
div.table span.do{
	width:50px;
	min-width:50px;
	background:url("/images/do.svg") no-repeat center center;
}
div.table span.no{
	width:50px;
	min-width:50px;
	background:url("/images/do.no.svg") no-repeat center center;
}
div.table span.check{
	width:50px;
	min-width:50px;
	background:url("/images/check.svg") no-repeat center center;
}
div.table span.ch{
	width:50px;
	min-width:50px;
	background:url("/images/channel.svg") no-repeat center center;
}
div.table span.m-web{
	width:50px;
	min-width:50px;
	background:url("/images/web.svg") no-repeat center center;
}
div.table span.m-chart{
	width:50px;
	min-width:50px;
	background:url("/images/chart.svg") no-repeat center center;
}
div.table span.m-enough{
	width:50px;
	min-width:50px;
	background:url("/images/enough.svg") no-repeat center center;
}
div.table span.m-cash{
	width:120px;
	min-width:120px;
	background:url("/images/cash.svg") no-repeat center center;
}
div.table span.m-percent{
	width:60px;
	min-width:60px;
	background:url("/images/percent.svg") no-repeat center center;
}
div.table span.m-calendar{
	width:60px;
	min-width:60px;
	background:url("/images/calendar.svg") no-repeat center center;
}
div.table span.m-channel{
	width:50px;
	min-width:50px;
	background:url("/images/channel.svg") no-repeat center center;
}
div.table span.m-price{
	width:120px;
	min-width:120px;
	background:url("/images/price.svg") no-repeat center center;
}
div.table span.m-belais{
	width:50px;
	min-width:50px;
	background:url("/images/belais.svg") no-repeat center center;
}
div.table span.m-wb{
	width:50px;
	min-width:50px;
	color:transparent;
	background:url("/images/wb.svg") no-repeat center center;
}
div.table span.m-ozon{
	width:50px;
	min-width:50px;
	color:transparent;
	background:url("/images/ozon.svg") no-repeat center center;
}
div.table span.m-yandex{
	width:50px;
	min-width:50px;
	color:transparent;
	background:url("/images/yandex.svg") no-repeat center center;
}
div.table span.m-aliexpress{
	width:50px;
	min-width:50px;
	color:transparent;
	background:url("/images/aliexpress.svg") no-repeat center center;
}
div.table span.m-stock{
	width:50px;
	min-width:50px;
	background:url("/images/stock.svg") no-repeat center center;
}
div.table span.m-pcs{
	width:50px;
	min-width:50px;
	background:url("/images/product.svg") no-repeat center center;
}
div.table span.m-aliexpress:empty{background:none;}
div.table span.m-ozon:empty{background:none;}
div.table span.m-wb:empty{background:none;}
div.table span.m-yandex:empty{background:none;}
div.table code{
	width:150px;
	min-width:150px;
	margin-right:20px;
	float:left;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}
div.table code b{
	color:var(--disabled);
	margin-left:20px;
}
div.table div:hover code{width:auto;}
div.table input[type="text"], input.none{
	text-align:center;
	color:var(--color);
	width:120px;
	height:40px;
	padding:0px;
	margin:0px -20px;
	border:none;
	box-shadow:none;
	border-radius:0px;
	background-color:transparent;
	font-weight:bold;
}
div.table input[type="text"]:hover, input.none:hover{
	border:none;
	box-shadow:none;
}
div.table input[type="text"]:focus, input.none:focus{
	border:none;
	box-shadow:none;
}
div.table input[type="text"]:disabled{
	opacity:0.5;
	font-family:inherit;
}
#back{
	display:none;
	position:absolute;
	inset:0px;
}
div.select{margin:-20px;}
div.select b{
	display:block;
	cursor:pointer;
	padding:10px 20px;
	border-bottom:1px solid var(--ground);
}
div.select b:hover{background:var(--background);}
div.price{
	position:relative;
	color:var(--disabled);
	text-align:center;
	background-color:var(--ground);
	border-radius:var(--radius);
	overflow:hidden;
}
div.price b{
	display:block;
	padding:10px;
	border-radius:40px;
	transition:var(--s);
	background-repeat:no-repeat;
	background-position:center center;
	font-weight:normal;
}
div.price b:first-child{
	padding:0px;
	line-height:40px;
}
div.price b[onclick]:hover{
	border-radius:var(--radius);
	background-color:var(--hover);
}
div.price b[onclick]:active{background-color:var(--active);}
/*
div.price input[type="checkbox"]{
	position:absolute;
	width:18px;
	height:18px;
	top:11px;
	left:11px;
	border-radius:2px;
	outline:0px solid rgba(0,0,0,0);
}
div.price input[type="checkbox"]:checked{outline:200px solid rgba(0,0,0,0.2);}
*/
div.price input[type="text"]{
	background-color:transparent;
	text-align:center;
	height:40px;
	font-size:20px;
}
div.price input[type="text"]::placeholder{color:rgba(0,0,0,0.2);}
div.price input[type="text"]:hover, div.price input[type="text"]:focus{
	background-color:transparent;
	box-shadow:none;
}
div.price div{
	background:var(--ground);
	border-radius:var(--radius);
}
div.price hr{
	height:20px;
	margin:0px;
	background:transparent;
}
g{
	display:block;
	color:var(--disabled);
}
r{
	display:block;
	color:red;
}
#info:empty{display:none;}
#info{
	z-index:100;
	position:fixed;
	width:500px;
	height:150px;
	padding-top:150px;
	overflow:hidden;
	left:calc(50% - 250px);
	bottom:0px;
	mask-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1) 50px);
}
#info div{
	cursor:pointer;
	color:rgba(255,255,255,0.8);
	border-radius:var(--radius);
	margin-bottom:20px;
	padding:20px 20px 20px 60px;
	background:rgba(0,0,0,0.8) url("/images/about.svg") no-repeat 18px center;
	box-shadow:var(--shadow);
	transition:var(--s);
}
#progress{
	cursor:default;
	border-radius:20px !important;
	padding:10px !important;
	background:rgba(0,0,0,0.8) !important;
}
#info div p{
	display:block;
	height:6px;
	margin:0px;
	border-radius:6px;
	background-color:var(--hover);
	transition:var(--s);
}
#info div p b{
	display:block;
	width:0%;
	height:6px;
	border-radius:6px;
	transition:var(--s);
	animation:progress linear 2s infinite;
}
@keyframes progress{
	0%{background-color:red; box-shadow:0px 0px 20px red;}
	25%{background-color:orange; box-shadow:0px 0px 20px orange;}
	50%{background-color:green; box-shadow:0px 0px 20px green;}
	75%{background-color:aqua; box-shadow:0px 0px 20px aqua;}
	100%{background-color:red; box-shadow:0px 0px 20px red;}
}
span.info,span.error{
	display:block;
	color:var(--color);
	font-size:var(--font);
	min-height:24px;
	padding:0px 0px 0px 35px;
	background:url("/images/info.svg") no-repeat left center;
}
span.error{
	color:#d64937;
	padding-left:60px !important;
	background:url("/images/error.svg") no-repeat left top;
}
barcode{
	display:block;
	width:100%;
	height:20px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
}
div.attention{
	color:rgba(0,0,0,0.7);
	font-size:20px;
}
#upload{display:none;}
#image{
	padding:0px;
}
#image button{
	float:left;
	margin:10px;
}
#image img{
	float:left;
	cursor:pointer;
	width:100px;
	height:100px;
	margin:10px;
	pointer-events:auto;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	transition:var(--s);
}
#image img:hover{opacity:0.8;}
#browser{
	width:100%;
	height:100%;
	border:none;
}
#A4{
	display:block;
	border:none;
	margin:30px auto;
	border-radius:var(--radius);
	box-shadow:var(--window);
	transition:var(--s);
	background:#fff;
}
.portrait{width:800px; height:1130px;}
.landscape{width:1130px; height:800px;}
div.help{
	color:#fff;
	background:#4285f4;
	padding:20px;
}
div.info{
	font-size:50px;
	text-align:center;
	border-radius:var(--radius);
	background:#f1f1f1;
	padding:30px;
}
table{
	width:100%;
	display:table;
	border-spacing:0px;
	border:none;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	overflow:hidden;
}
table thead :is(td,th){
	font-weight:bold;
	border-bottom:1px solid var(--ground);
}
table td,th{
	padding:10px;
	border:none;
	font-weight:normal;
	border-left:1px solid var(--ground);
	border-top:1px solid var(--ground);
}
table tr[onclick]:hover{
	background-color:var(--hover);
	border-radius:var(--radius);
	overflow:hidden;
}
table tr:first-child td, table tr:first-child th{border-top:none;}
table td:first-child, table th:first-child{border-left:none;}
table.none, table.none td, table.none th{border:none;}
div.ground,#disconnect{
	z-index:1;
	opacity:0;
	display:block;
	position:fixed;
	inset:0px;
	background:rgba(0,0,0,0.8);
	transition:var(--s);
}
#disconnect{
	opacity:1;
	display:none;
}
#disconnect div{
	z-index:2;
	position:absolute;
	width:400px;
	height:200px;
	inset:calc(50% - 100px) auto auto calc(50% - 200px);
	font-size:16px;
	background:#1a73e8;
	border-radius:var(--radius);
	color:rgba(255,255,255,0.7);
	text-align:center;
	box-shadow:var(--window);
}
#disconnect span{
	display:table;
	width:100%;
	height:100%;
}
#disconnect span p{
	padding:30px;
	display:table-cell;
	vertical-align:middle;
}
#disconnect button{
	display:block;
	margin:30px auto 0px auto;
}
img.barcode{
	height:100px;
	float:right;
}
@keyframes flash{
	50%{background-color:var(--hover);}
}
#label{
	overflow:hidden;
	margin:50px auto;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	transform-origin:center center;
}
div.label{margin:0px auto;}
div.label label{
	cursor:pointer;
	display:block;
	padding:3px;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	margin-bottom:30px;
	overflow:hidden;
	word-break:break-all;
}
div.popup{
	position:relative;
	line-height:0px;
	cursor:default;
	margin:0px;
	display:inline-block;
	height:50px;
	background:#fff;
	border-radius:var(--radius);
	overflow:hidden;
	box-shadow:var(--shadow);
	vertical-align:middle;
}
div.popup input{
	float:left;
	height:50px;
	width:200px;
	padding:0px 15px;
	border:none;
	box-shadow:none;
	background:transparent !important;
}
div.popup button{border-radius:0px !important; float:right !important;}
div.popup input:hover{border:none; box-shadow:none;}
div.popup input:focus{border:none; box-shadow:none;}
div.progress{
	display:block;
	height:8px;
	margin:30px 0px;
	border-radius:10px;
	background:rgba(0,0,0,0.1);
	overflow:hidden;
}
div.progress div{
	height:8px;
	border-radius:10px;
	background:rgba(0,0,0,0.3);
}
/* https://codepen.io/tutsplus/pen/WROvdG */
[info]{
	position:relative;
	overflow:visible !important;
}
[info]::before,[info]::after{
	display:none;
	position:absolute;
	text-transform:none;
	left:50%;
}
[info]::before{
	content:"";
	border:10px solid transparent;
}
[info]::after{
	width:auto;
	z-index:3;
	color:#fff;
	content:attr(info);
	text-align:left;
	overflow:hidden;
	padding:10px;
	background:#333;
	white-space:pre;
	line-height:normal;
	border-radius:var(--radius);
	font-size:var(--font);
	box-shadow:var(--shadow);
	transition:var(--s);
}
[info][up]::before{bottom:100%; border-bottom-width:0; border-top-color:#333; transform:translate(-50%,-10px);}
[info][up]::after{bottom:calc(100% + 5px); transform:translate(-50%,-10px);}
[info]:not([up])::before{top:100%; border-top-width:0; border-bottom-color:#333; transform:translate(-50%,10px);}
[info]:not([up])::after{top:calc(100% + 5px); transform:translate(-50%,10px);}
[info][disabled]::before,[info][disabled]::after{display:none !important;}
[info]:hover::before,[info]:hover::after,[info][select]::before,[info][select]::after{display:block; animation:info var(--s) ease-out forwards;}
@keyframes info{to{transform:translate(-50%,0);}}

#view{
	height:120px;
	padding:5px;
	white-space:nowrap;
	mask-image:linear-gradient(to left,rgba(0,0,0,0),rgba(0,0,0,1) 50px);
}
#category{
	width:100px;
	height:100px;
	margin:5px;
	cursor:pointer;
	float:left;
	transition:var(--s);
	overflow:hidden;
	background-color:var(--ground);
	background-image:url("/images/folder.svg");
	background-repeat:no-repeat;
	background-position:right 13px center;
	border-radius:var(--radius);
}
#category:hover{width:150px;}
#img{
	width:100px;
	height:100px;
	float:left;
	background-size:cover;
	background-color:#e9e9e9;
	box-shadow:var(--shadow);
	border-radius:var(--radius);
}
#view b{
	width:100px;
	display:inline-block;
	padding:0px;
	margin:5px;
	line-height:45px;
	text-align:center;
	font-weight:bold;
	border-radius:var(--radius);
	background-color:var(--ground);
	font-size:16px;
}
tiles{
	gap:20px;
	display:block;
	width:1000px;
	padding:var(--padding) 0px;
	margin:0px auto;
}
tiles.list{
	width:100%;
	margin:0px;
	padding:var(--padding);
}
tiles.grid{
	display:grid;
	grid-template-columns:480px 480px;
}
tiles.grid tile{
	margin:0px;
}
tiles.chess{
	column-count:2;
}
tiles.chess tile{
	break-inside:avoid;
	page-break-inside:avoid;
	/*-webkit-column-break-inside:avoid;*/
}
tile{
	display:block;
	margin-bottom:20px;
	background:#fff;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	transition:var(--s);
	border-top:1px solid var(--background);
}
tile name{display:block;}
tile[onclick]:hover{background-color:var(--background);}
tile.main{background:var(--background);}
tile.red{background:var(--error);}
tile:empty{
	height:200px;
	box-shadow:none;
	background:var(--background);
	animation:shine linear 1s infinite;
}
@keyframes shine{50%{opacity:0.3;}}
tile div.table span{
	border-radius:var(--radius);
}
tile div.table input[type="checkbox"]{
	float:left;
	width:40px;
	height:40px;
	margin-right:10px;
}
tile:last-child{margin-bottom:0px !important;}
#calendar{
	z-index:4;
	display:block;
	position:absolute;
	width:350px;
	height:400px;
	max-height:600px;
	font-size:var(--font);
	text-align:center;
	text-transform:uppercase;
	scroll-behavior:smooth;
	overflow:auto;
	background-color:#fff;
	border-radius:var(--radius);
	box-shadow:var(--window);
	animation:open var(--s);
}
#calendar button{
	border-radius:50px;
	background-color:transparent;
	text-transform:uppercase;
}
#calendar button:hover{border-radius:var(--radius) !important;}
#calendar [icon="left"]{float:left !important;}
#calendar [icon="right"]{float:right !important;}
#calendar p{
	display:block;
	cursor:pointer;
	margin:0px;
	padding:0px;
	height:50px;
	line-height:50px;
	font-weight:bold;
	border-radius:50px;
	transition:var(--s);
}
#calendar p:hover{
	border-radius:0px;
	background-color:var(--hover);
}
#calendar p.head{
	top:0px;
	position:sticky;
	border-radius:0px;
	line-height:0px;
	background-color:var(--ground);
	backdrop-filter:blur(6px);
}
#calendar [today]{
	font-weight:bold;
	font-size:20px;
}
#calendar [select]{
	font-weight:bold;
	border-radius:100%;
	background-color:var(--hover);
}
#calendar table{
	border:none;
	box-shadow:none;
}
#calendar table td{
	border:none;
	text-align:center;
	width:50px;
	height:50px;
	padding:0px;
	border-radius:100px;
	transition:var(--s);
	color:var(--disabled);
}
#calendar table td[onclick]{
	color:var(--color);
}
#calendar table td[onclick]:hover{
	background-color:var(--hover);
	border-radius:var(--radius);
}
#calendar table td[onclick]:active{
	background-color:var(--active);
}
#index{
	position:relative;
	margin:0px auto 0px auto;
	max-width:1000px;
	min-height:500px;
}
#index block e:first-child{padding-left:0px;}
#index block e:last-child{padding-right:0px;}
div.app{
	cursor:pointer;
	display:inline-block;
	width:100px;
	height:100px;
	padding:20px;
	margin:10px;
	border-radius:100%;
	color:rgba(0,0,0,0.7);
	background-position:center center;
	background-size:70px 70px;
	background-repeat:no-repeat;
	box-shadow:var(--shadow);
}
div.cash{
	display:inline-block;
	opacity:0.5;
	transition:var(--s);
}
div.cash:hover{
	opacity:1;
}
div.card{
	display:block;
	padding:30px;
	margin:30px 0px;
	background:var(--background);
	border-radius:var(--radius);
	box-shadow:var(--shadow);
}
div.limit{
	margin:0px -10px;
	white-space:nowrap;
}
div.limit div{
	vertical-align:top;
	display:inline-block;
	width:235px;
	padding:30px;
	margin:0px 10px;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	transition:var(--s);
}
div.limit div:hover{
	background-color:var(--background);
	box-shadow:var(--shadow);
}
div.window div.card{margin:0px;}
#url{display:none;}
.push{
	display:block;
	overflow:hidden;
	height:0px;
	opacity:0;
	border-radius:var(--radius);
	transition:var(--s);
}
.push text{height:400px;}
var{
	width:100%;
	display:table;
	cursor:pointer;
	font-style:normal;
	border-radius:var(--radius);
}
var b{
	width:50%;
	display:table-cell;
	padding:var(--padding);
	vertical-align:top;
	font-weight:normal;
}
var b:first-child{
	font-weight:bold;
	word-break:break-all;
}
var:hover{background-color:var(--background);}
#paste text{
	position:absolute;
	inset:120px 0px 0px 0px;
	cursor:default;
	opacity:0;
}
#barcode{
	width:100%;
	height:100%;
	background:#000;
	position:relative;
}
#scan{
	position:absolute;
	bottom:var(--padding);
	left:var(--padding);
	right:var(--padding);
	height:5px;
	transition:var(--s);
	border-radius:8px;
	background-color:rgba(0,0,0,0.7);
	animation:scan linear 0.5s infinite;
}
@keyframes scan{50%{background-color:rgba(0,0,0,0.3);}}
#video{
	width:100%;
	height:100%;
	position:absolute;
}
#canvas{position:absolute;}
#file{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	padding:calc(var(--padding) / 2);
}
#file a{
	flex:auto;
	color:var(--color);
	margin:calc(var(--padding) / 2);
	padding:0px;
	overflow:hidden;
	border-radius:10px;
	background-color:#fff;
	cursor:pointer;
	box-shadow:var(--shadow);
	text-decoration:none;
	width:100px;
	max-width:150px;
	line-height:0px;
}
#file a img{
	width:100%;
	aspect-ratio:1/1;/*пропорции 1:1*/
}
#file a p{
	display:block;
	padding:10px;
	margin:0px;
}
#file a:hover{
	opacity:1 !important;
	background-color:var(--background);
	box-shadow:var(--shadow);
}
div.logo{
	width:200px;
	height:50px;
	cursor:pointer;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:auto 70%;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
}
div.watermark{
	width:200px;
	height:200px;
	cursor:pointer;
	background-color:rgba(0,0,0,0.2);
	background-repeat:no-repeat;
	background-size:contain;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
}
data.list:empty::after{color:var(--disabled); content:attr(none);}
data.list:not(:empty){margin:-5px;}
data.list{line-height:0px;}
data.list b{
	display:inline-block;
	cursor:pointer;
	color:var(--color);
	padding:0px 30px 0px 10px;
	margin:5px;
	border-radius:50px;
	transition:var(--s);
	line-height:30px;
	max-width:150px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	font-weight:normal;
	background:var(--ground) url("/images/close.svg") no-repeat center right 5px;
	background-size:20px;
}
data.list b:hover{
	background-color:var(--hover);
}
data.list b:active{
	background-color:var(--active);
}
[focus]{
	border-radius:var(--radius);
	background-color:var(--hover);
	font-weight:bold;
}
[read],[read="1"]{opacity:0.3;}
[read="0"]{opacity:1;}
input.load,input.enter{
	padding-right:50px;
	background-repeat:no-repeat;
	background-position:right 13px center;
}
input.load{transition:none; background-image:url("/images/load.svg") !important;}
input.enter{background-image:url("/images/enter.svg") !important;}
#select{
	position:absolute;
	overflow:auto;
	inset:120px 0px 120px 0px;
	transition:opacity var(--s);
}
chart{
	display:flex;
	align-items:flex-end;
	position:relative;
	aspect-ratio:2/1;
	padding:2px;
	line-height:0px;
	border-radius:var(--radius);
}
chart p{
	display:inline-block;
	margin:0px;
	height:0px;
	min-height:10px;
	background-color:var(--ground);
	background-clip:padding-box;
	border-radius:var(--radius);
	border:2px solid transparent;
	transition:var(--s);
	animation:chart 1s;
}
@keyframes chart{
from{opacity:0; max-height:0px;}
to{opacity:1; max-height:100%;}
}
chart p:not(:empty){
	font-weight:bold;
	line-height:30px;
	min-height:34px;
	text-align:center;
}
chart p:hover, chart p[s]{
	color:#fff;
	background-color:var(--color);
}
pages{
	inset:0;
	display:block;
	position:absolute;
	overflow:hidden;
	white-space:nowrap;
	line-height:0px;
	scroll-snap-type:x mandatory;
}
pages > page{
	display:inline-block;
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
	white-space:normal;
	line-height:normal;
	scroll-snap-align:start;
}
page > p{margin-top:20px !important;}
@media only screen and (max-width:1260px){
	:root{--head:50px;}
	::-webkit-scrollbar{display:none;}
	#search::-webkit-input-placeholder{color:transparent;}
	#search:focus::-webkit-input-placeholder{color:rgba(0,0,0,0.5);}
	[desktop]{display:none;}

	#lock,#head #logo{display:none;}
	#head{
		padding:0px !important;
		overflow-x:auto;
		overflow-y:hidden;
		scroll-snap-type:x mandatory;
	}
	#head button:hover{border-radius:var(--radius);}
	#head #ocx{
		min-width:230px;
		opacity:1 !important;
		height:50px !important;
		margin-bottom:10px !important;
		background-size:75px !important;
	}
	#head menu p{
		transition:var(--s);
		padding:50px 10px 10px 10px;
		border-radius:0px;
	}
	#head menu:hover p{
		padding:10px;
		width:250px;
		min-height:100vh !important;
		animation:events 0s var(--s) forwards;
	}
	#head menu p b{
		display:block;
		margin:var(--padding) 0px;
		background:var(--hover);
		border-radius:var(--radius);
	}
	menu p{transition:none;}
	menu:hover p{
		left:0px;
		right:0px;
		width:100vw;
		animation:open var(--s), events 0s var(--s) forwards;
	}
	#body{
		padding-top:calc(var(--head) + var(--padding));
	}
	c{
		width:100% !important;
		display:block;
	}
	#search{
		cursor:pointer !important;
		width:50px;
		margin:0px;
		padding:0px;
		color:transparent;
		box-shadow:none;
		border-radius:50px;
		cursor:pointer;
		background-color:transparent;
		background-repeat:no-repeat;
		background-position:13px center;
		background-image:url("/images/search.svg") !important;
		transition:var(--s);
	}
	#search:hover,#search:focus{
		background-color:rgba(0,0,0,0.1);
		border-radius:var(--radius);
	}
	#search:focus{
		padding-left:50px;
		width:calc(100% - 50px) !important;
		cursor:text !important;
		color:var(--color);
		cursor:text;
	}
	#info{
		left:0px;
		right:0px;
		width:100%;
	}
	#info div{
		margin:5px;
	}
	.P30,.P50,.P70{width:100%;}
	top set{width:100%;}
	tiles{
		width:100%;
		padding:0px;
	}
	tiles.chess{
		column-count:1;
	}
	tiles.grid{
		gap:10px;
		grid-template-columns:auto;
	}
	tile{
		overflow-x:auto;
		margin-bottom:10px;
		box-shadow:var(--shadow);
	}
	div.popup{
		box-shadow:none;
	}
	#disconnect div{
		inset:0px;
		margin:0px;
		width:100%;
		height:100%;
		border-radius:0px;
	}
	div.card{
		padding:20px;
		margin:20px 0px;
	}
	div.window{
		inset:0px !important;
		width:100% !important;
		height:100% !important;
		margin:0px !important;
		border-radius:0px;
	}
	div.window span.name{
		cursor:default !important;
	}
	div.limit{
		margin:0px -20px;
		padding:0px 10px;
		overflow-y:hidden;
		overflow-x:auto;
	}
	set b{
		z-index:9999 !important;
		position:fixed !important;
		height:100vh;
		max-height:100vh;
		inset:50px 0px 0px 0px;
		padding:var(--padding);
		box-shadow:var(--window);
		animation:open var(--s);
	}
	#calendar{
		position:fixed;
		margin:0px;
		inset:50px 0px 0px 0px !important;
		width:100vw !important;
		height:100vh !important;
		max-height:none;
	}
	#calendar [select]{border-radius:var(--radius);}
	div.left{right:0px;}
	div.right{display:none;}
	div.table code{
		width:80px;
		min-width:80px;
	}
	bar{
		overflow-x:auto;
		overflow-y:hidden;
		scroll-snap-type:x mandatory;
	}
	bar *{float:none !important;}
	bar set{width:200px !important;}
	bar set, bar button, bar input{scroll-snap-align:start;}
	div.price input[type="checkbox"]:checked{outline:100vw solid rgba(0,0,0,0.2);}
	div.left{border:none;}
	hat,top{background:linear-gradient(to top,var(--background),var(--top)) !important;}
	div.table div.head{height:48px;}
}