/* ===== Radio list wrapper ===== */

.radio-list-wrap{
	margin: 0;
	padding: 0;
}

.radio-list{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 14px;
}

.radio-list > li{
	margin: 0;
	padding: 0;
	flex: 0 0 calc((100% - (14px * 5)) / 6);
	max-width: calc((100% - (14px * 5)) / 6);
}

/* ===== Radio card ===== */

.radio-card{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 6px;
	border-radius: 5px;
	border: 1px solid rgba(15,42,68,0.14);
	background: var(--bg-color-third);
	color: var(--primary-text-color);
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.radio-card:hover{
	background: rgba(66,165,245,0.08);
	border-color: rgba(30,136,229,0.35);
}

.radio-cover{
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 0;
	overflow: hidden;
	background: rgba(15,42,68,0.06);
}

.radio-cover img{
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

.radio-bottom{
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 34px;
}

.radio-play{
	all: unset;
	box-sizing: border-box;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px !important;
	height: 30px !important;
    min-width: 30px !important;
	border-radius: 0;
	border: 1px solid rgba(15,42,68,0.14);
	background: #ffffff;
	transition: background .15s ease, border-color .15s ease, transform .1s ease;
}

.radio-play span{
	font-size: 13px;
	color: #ffffff;
    padding-left: 1px;
	transition: transform .15s ease;
}

.radio-card:hover .radio-play{
	border-color: rgba(15,42,68,0.22);
}

.radio-play:hover span{
	transform: scale(1.08);
}

.js-item.js-item-played .radio-play{
	border-color: rgba(0,0,0,0.22);
	box-shadow: 0 0 0 2px rgba(0,0,0,0.06) inset;
}

.radio-name{
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--primary-text-color);
}

.radio-live{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	color: rgba(17,24,39,0.75);
}

.radio-live i{
	opacity: 0.7;
}

@media (max-width: 1200px){
	.radio-list > li{
		flex: 0 0 calc((100% - (14px * 4)) / 5);
		max-width: calc((100% - (14px * 4)) / 5);
	}
}

@media (max-width: 1000px){
	.radio-list > li{
		flex: 0 0 calc((100% - (14px * 3)) / 4);
		max-width: calc((100% - (14px * 3)) / 4);
	}
}

@media (max-width: 780px){
	.radio-list > li{
		flex: 0 0 calc((100% - (14px * 2)) / 3);
		max-width: calc((100% - (14px * 2)) / 3);
	}
}

@media (max-width: 530px){
	.radio-list{
		gap: 10px;
	}
	.radio-list > li{
		flex: 0 0 calc((100% - 10px) / 2);
		max-width: calc((100% - 10px) / 2);
	}
	.radio-card{
		padding: 10px;
		gap: 8px;
	}
	.radio-bottom{
		gap: 8px;
	}
	.radio-play{
		width: 32px;
		height: 32px;
	}
	.radio-name{
		font-size: 13px;
	}
}

.radio-list ul{
	list-style: none;
	margin: 10px 0 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.radio-list ul > li{
	flex: 0 0 100%;
	/* max-width: 100%; */
}



/* sharing */

.share-blck{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
    margin: 0px auto 0px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e1e1e1; 
}

.share-blck-btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	max-width: 30px;
	max-height: 30px;
	border-radius: 5px;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}

.share-blck-btn i{
	font-size: 14px;
	color: #ffffff;
	line-height: 1;
}

.share-blck-btn:hover{
	transform: translateY(-1px);
	box-shadow: 0 3px 10px rgba(0,0,0,0.18);
	opacity: 0.95;
}

.share-blck-btn:active{
	transform: translateY(0);
	box-shadow: 0 2px 6px rgba(0,0,0,0.16) inset;
}

.share-blck-btn.fb{
	background: #1877f2;
}

.share-blck-btn.tg{
	background: #229ed9;
}

.share-blck-btn.viber{
	background: #7360f2;
}

.share-blck-btn.wa{
	background: #25d366;
}

.share-blck-btn.vk{
	background: #4c75a3;
}

/* profile page */


.uprofile {max-width:var(--maximum-width); margin:0 auto; }
.uprofile-card {background:var(--bg-color-third); border:1px solid rgba(205,217,229,0.8); border-radius: 5px; box-shadow:0 14px 34px rgba(15,23,42,0.10); overflow:hidden;}
.uprofile-top {display:flex; align-items:flex-start; gap:18px; padding:18px; background:linear-gradient(180deg, rgba(88,166,255,0.20), rgba(31,111,235,0.08)); border-bottom:1px solid rgba(205,217,229,0.8);}
.uprofile-avatar {width:88px; height:88px; border-radius: 5px; overflow:hidden; background:rgba(15,23,42,0.06); border:1px solid rgba(205,217,229,0.9); flex:0 0 auto;}
.uprofile-avatar img {width:100%; height:100%; object-fit:cover; display:block;}

.uprofile-head {flex:1 1 auto; min-width:0;}
.uprofile-title {display:flex; align-items:flex-start; justify-content:space-between; gap:12px;}
.uprofile-name {margin:0; font-size:22px; line-height:1.2; color:var(--primary-text-color); font-weight:800; letter-spacing:-0.2px;}
.uprofile-actions {display:flex; justify-content:flex-end; margin-top:10px;}
.uprofile-action {display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 14px; border-radius: 5px; text-decoration:none; color:#fff; background:var(--primary-color); box-shadow:0 10px 22px rgba(31,111,235,0.25); font-weight:700; font-size:14px;}
.uprofile-action:hover {background:var(--third-text-color);}

.uprofile-badges {display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end;}
.uprofile-badge {display:inline-flex; align-items:center; height:28px; padding:0 10px; border-radius: 5px; font-size:12px; font-weight:700; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.70); color:var(--secondary-text-color); backdrop-filter:blur(10px);}
.uprofile-badge-online {border-color:rgba(22,163,74,0.35); color:#0f3d1e; background:rgba(22,163,74,0.12);}
.uprofile-badge-offline {border-color:rgba(239,68,68,0.35); color:#4a0f0f; background:rgba(239,68,68,0.10);}
.uprofile-badge-group {border-color:rgba(31,111,235,0.35); color:rgba(15,23,42,0.90); background:rgba(31,111,235,0.10);}
.uprofile-badge-time {border-color:rgba(245,158,11,0.35); color:#4a2c0a; background:rgba(245,158,11,0.12);}

.uprofile-stats {display:flex; gap:10px; flex-wrap:wrap; margin-top:12px;}
.uprofile-stat {flex:1 1 170px; min-width:170px; background:rgba(255,255,255,0.72); border:1px solid rgba(205,217,229,0.9); border-radius: 5px; padding:10px 12px; backdrop-filter:blur(10px);}
.uprofile-stat-label {font-size:12px; color:var(--secondary-text-color); font-weight:700;}
.uprofile-stat-value {margin-top:4px; font-size:14px; color:var(--primary-text-color); font-weight:800; word-break:break-word;}

.uprofile-body {padding:18px;}
.uprofile-section {padding:14px; border:1px solid rgba(205,217,229,0.8); border-radius: 5px; background:#fff;}
.uprofile-section + .uprofile-section {margin-top:14px;}
.uprofile-section-title {font-size:13px; font-weight:700; letter-spacing:0.2px; color:var(--primary-text-color); margin-bottom:12px; text-transform:uppercase;}

.uprofile-list {list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px;}
.uprofile-item {flex:1 1 280px; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55);}
.uprofile-item-wide {flex:1 1 100%;}
.uprofile-key {font-size:12px; font-weight:700; color:var(--secondary-text-color); white-space:nowrap;}
.uprofile-val {font-size:13px; font-weight:700; color:var(--primary-text-color); text-align:right; word-break:break-word;}

.uprofile-links {display:flex; flex-direction:column; gap:10px;}
.uprofile-link {padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55); color:var(--primary-text-color);}
.uprofile-link a {color:var(--primary-color); text-decoration:none; font-weight:800;}
.uprofile-link a:hover {text-decoration:underline;}

.uprofile-edit {max-width:var(--maximum-width); margin:18px auto 0;}
.uprofile-edit-card {background:var(--bg-color-third); border:1px solid rgba(205,217,229,0.8); border-radius: 5px; box-shadow:0 14px 34px rgba(15,23,42,0.10); padding:18px;}
.uprofile-edit-title {margin:0 0 14px; font-size:18px; font-weight:700; color:var(--primary-text-color);}

.uprofile-form {display:flex; flex-wrap:wrap; gap:12px;}
.uprofile-row {flex:1 1 320px; min-width:320px;}
.uprofile-row-wide {flex:1 1 100%; min-width:0;}
.uprofile-label {display:block; font-size:12px; font-weight:700; color:var(--secondary-text-color); margin-bottom:8px;}

.uprofile-input {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.90); padding:0 12px; font-size:14px; color:var(--primary-text-color); outline:none;}
.uprofile-input:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.uprofile-textarea {width:100%; min-height:110px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.90); padding:10px 12px; font-size:14px; color:var(--primary-text-color); outline:none; resize:vertical;}
.uprofile-textarea:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.uprofile-field select {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.90); padding:0 10px; font-size:14px; color:var(--primary-text-color); outline:none;}
.uprofile-field select:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.uprofile-table {width:100%; border-collapse:separate; border-spacing:0 10px;}
.uprofile-table td {padding:10px 12px; border:1px solid rgba(205,217,229,0.8); border-radius: 5px; background:rgba(233,239,245,0.55);}

.uprofile-checks {display:flex; flex-wrap:wrap; gap:10px;}
.uprofile-check {display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55); font-size:13px; font-weight:700; color:var(--primary-text-color);}
.uprofile-check input {width:16px; height:16px;}
.uprofile-check label {gap: 10px; display: flex; align-items: center;}

.uprofile-row-actions {flex:1 1 100%; display:flex; justify-content:flex-end; margin-top:4px;}
.uprofile-submit {display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 18px; border-radius: 5px; border:0; cursor:pointer; background:var(--primary-color); color:#fff; font-weight:700; font-size:14px; box-shadow:0 10px 22px rgba(31,111,235,0.25);}
.uprofile-submit:hover {background:var(--primary-color-darker);}

@media (max-width:720px){
	.uprofile-top {flex-direction:column; align-items:stretch;}
	.uprofile-avatar {width:96px; height:96px;}
	.uprofile-title {flex-direction:column; align-items:flex-start;}
	.uprofile-badges {justify-content:flex-start;}
	.uprofile-actions {justify-content:flex-start;}
	.uprofile-row {min-width:0; flex:1 1 100%;}
}

/* login page */

.ulogin {width:320px;}
.ulogin-card {background:rgba(255,255,255,0.94); border:1px solid rgba(205,217,229,0.85); border-radius: 5px; box-shadow:0 18px 38px rgba(15,23,42,0.16); overflow:hidden;}
.ulogin-head {display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 12px; background:linear-gradient(180deg, rgba(88,166,255,0.20), rgba(31,111,235,0.06)); border-bottom:1px solid rgba(205,217,229,0.8);}

.ulogin-user {display:flex; align-items:center; gap:10px; min-width:0;}
.ulogin-avatar {width:38px; height:38px; border-radius: 5px; overflow:hidden; border:1px solid rgba(205,217,229,0.95); background:rgba(15,23,42,0.06); flex:0 0 auto;}
.ulogin-avatar img {width:100%; height:100%; object-fit:cover; display:block;}
.ulogin-name {font-size:14px; font-weight:700; color:var(--primary-text-color); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:210px;}

.ulogin-title {display:flex; align-items:baseline; gap:10px; font-size:14px; font-weight:700; color:var(--primary-text-color); white-space:nowrap;}
.ulogin-reg {font-size:12px; font-weight:700; color:var(--primary-color); text-decoration:none;}
.ulogin-reg:hover {text-decoration:underline;}

.ulogin-close {width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius: 5px; cursor:pointer; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.70); color:var(--secondary-text-color); backdrop-filter:blur(10px);}
.ulogin-close:hover {border-color:rgba(31,111,235,0.35); color:var(--primary-text-color);}

.ulogin-menu {list-style:none; margin:0; padding:10px; display:flex; flex-direction:column; gap:8px;}
/* .ulogin-item {} */
.ulogin-link {display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55); color:var(--primary-text-color); text-decoration:none; font-weight:700; font-size:13px;}
.ulogin-link span.far, .ulogin-link span.fal {opacity:0.85;}
.ulogin-link:hover {border-color:rgba(31,111,235,0.35); background:rgba(233,239,245,0.75);}
.ulogin-count {font-weight:700; color:var(--secondary-text-color);}

.ulogin-form {padding:12px;}
.ulogin-row {margin-bottom:10px;}
.ulogin-caption {display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; font-size:12px; font-weight:700; color:var(--secondary-text-color);}
.ulogin-lost {font-size:12px; font-weight:700; color:var(--primary-color); text-decoration:none; white-space:nowrap;}
.ulogin-lost:hover {text-decoration:underline;}

.ulogin-field {position:relative;}
.ulogin-input {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.92); padding:0 40px 0 12px; font-size:14px; color:var(--primary-text-color); outline:none;}
.ulogin-input:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}
.ulogin-ico {position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--secondary-text-color); opacity:0.85;}

.ulogin-check {display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55); font-size:13px; font-weight:800; color:var(--primary-text-color); margin-bottom:10px; cursor:pointer;}
.ulogin-check input {width:16px; height:16px;}

.ulogin-actions {display:flex; justify-content:flex-end;}
.ulogin-btn {display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 16px; border-radius: 5px; border:0; cursor:pointer; background:var(--primary-color); color:#fff; font-weight:700; font-size:14px; box-shadow:0 10px 22px rgba(31,111,235,0.25);}
.ulogin-btn:hover {background:var(--primary-color-darker);}


/* reg page */


.ureg {max-width:var(--maximum-width); margin:0 auto; 
	/* padding:24px 16px; */
}
.ureg-card {background:rgba(255,255,255,0.94); border:1px solid rgba(205,217,229,0.85); border-radius: 5px; box-shadow:0 18px 38px rgba(15,23,42,0.12); overflow:hidden;}

.ureg-head {display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:18px; background:linear-gradient(180deg, rgba(88,166,255,0.20), rgba(31,111,235,0.06)); border-bottom:1px solid rgba(205,217,229,0.8);}
.ureg-head-left {min-width:0;}
.ureg-title {margin:0; font-size:22px; line-height:1.2; font-weight:700; color:var(--primary-text-color); letter-spacing:-0.2px;}
.ureg-sub {margin-top:8px; font-size:13px; font-weight:700; color:var(--secondary-text-color); max-width:760px;}

.ureg-home {display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 12px; border-radius: 5px; text-decoration:none; color:var(--primary-text-color); font-weight:700; font-size:13px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.72); backdrop-filter:blur(10px); white-space:nowrap;}
.ureg-home:hover {border-color:rgba(31,111,235,0.35);}

.ureg-info {padding:14px 18px; border-bottom:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.45);}
.ureg-info-title {font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.2px; color:var(--primary-text-color); margin-bottom:8px;}
.ureg-info-text {font-size:13px; font-weight:700; color:var(--secondary-text-color); line-height:1.5;}
.ureg-info-text a {color:var(--primary-color); font-weight:700; text-decoration:none;}
.ureg-info-text a:hover {text-decoration:underline;}

.ureg-form {padding:16px 18px; display:flex; flex-wrap:wrap; gap:12px;}
.ureg-row {flex:1 1 360px; min-width:320px;}
.ureg-row-wide {flex:1 1 100%; min-width:0;}
.ureg-row-protect {flex:1 1 100%; min-width:0;}

.ureg-cap {margin-bottom:8px;}
.ureg-cap-above {margin-bottom:8px;}
.ureg-label {display:block; font-size:12px; font-weight:700; color:var(--secondary-text-color);}
.ureg-label-imp:after {content:" *"; color:rgba(239,68,68,0.95);}

.ureg-field {min-width:0;}
.ureg-fieldline {display:flex; align-items:center; gap:10px;}
.ureg-input {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.92); padding:0 12px; font-size:14px; color:var(--primary-text-color); outline:none;}
.ureg-input:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.ureg-check {flex:0 0 auto; height:44px; padding:0 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.72); cursor:pointer; font-weight:700; font-size:13px; color:var(--primary-text-color);}
.ureg-check:hover {border-color:rgba(31,111,235,0.35);}

.ureg-result {margin-top:8px; font-size:13px; font-weight:800; color:var(--secondary-text-color);}

.ureg-field-sec {display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
.ureg-code {display:inline-flex; align-items:center; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55);}

.ureg-file {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.92); padding:10px 12px; font-size:14px; color:var(--primary-text-color);}

.ureg-textarea {width:100%; min-height:140px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.92); padding:10px 12px; font-size:14px; color:var(--primary-text-color); outline:none; resize:vertical;}
.ureg-textarea:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.ureg-table {width:100%; border-collapse:separate; border-spacing:0 10px;}
.ureg-table td {padding:10px 12px; border:1px solid rgba(205,217,229,0.8); border-radius: 5px; background:rgba(233,239,245,0.55);}

.ureg-actions {padding:0 18px 18px; display:flex; justify-content:flex-end;}
.ureg-submit {display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 18px; border-radius: 5px; border:0; cursor:pointer; background:var(--primary-color); color:#fff; font-weight:700; font-size:14px; box-shadow:0 10px 22px rgba(31,111,235,0.25);}
.ureg-submit:hover {background:var(--primary-color-darker);}

@media (max-width:720px){
	.ureg-head {flex-direction:column; align-items:stretch;}
	.ureg-home {align-self:flex-start;}
	.ureg-row {min-width:0; flex:1 1 100%;}
	.ureg-fieldline {flex-direction:column; align-items:stretch;}
	.ureg-check {width:100%;}
}


/* lost pass */

.ulost {max-width:var(--maximum-width); margin:0 auto; 
	/* padding:24px 16px; */
}
.ulost-card {background:rgba(255,255,255,0.94); border:1px solid rgba(205,217,229,0.85); border-radius: 5px; box-shadow:0 18px 38px rgba(15,23,42,0.12); overflow:hidden;}

.ulost-head {display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:18px;
	background:linear-gradient(180deg, rgba(88,166,255,0.20), rgba(31,111,235,0.06)); border-bottom:1px solid rgba(205,217,229,0.8);}
.ulost-title {margin:0; font-size:22px; line-height:1.2; font-weight:700; color:var(--primary-text-color); letter-spacing:-0.2px;}

.ulost-home {display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 12px; border-radius: 5px; text-decoration:none;
	color:var(--primary-text-color); font-weight:700; font-size:13px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.72); backdrop-filter:blur(10px); white-space:nowrap;}
.ulost-home:hover {border-color:rgba(31,111,235,0.35);}

.ulost-note {padding:14px 18px; border-bottom:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.45);
	font-size:13px; font-weight:700; color:var(--secondary-text-color); line-height:1.5;}

.ulost-row {padding:16px 18px; border-bottom:1px solid rgba(205,217,229,0.8);}
.ulost-row-protect {background:rgba(233,239,245,0.35);}

.ulost-label {display:block; font-size:12px; font-weight:700; color:var(--secondary-text-color); margin-bottom:8px;}
.ulost-label-imp:after {content:" *"; color:rgba(239,68,68,0.95);}

.ulost-input {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.92);
	padding:0 12px; font-size:14px; font-weight:700; color:var(--primary-text-color); outline:none;}
.ulost-input:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.ulost-sec {display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
.ulost-code {display:inline-flex; align-items:center; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8); background:rgba(233,239,245,0.55);}

.ulost-actions {padding:18px; display:flex; justify-content:flex-end;}
.ulost-btn {display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 18px; border-radius: 5px; border:0; cursor:pointer;
	background:var(--primary-color); color:#fff; font-weight:700; font-size:14px; box-shadow:0 10px 22px rgba(31,111,235,0.25);}
.ulost-btn:hover {background:var(--primary-color-darker);}

@media (max-width:720px){
	.ulost-head {flex-direction:column; align-items:stretch;}
	.ulost-home {align-self:flex-start;}
}


/* --- FEEDBACK (ufeedback) --- */

.ufeedback{max-width:var(--maximum-width); margin:0 auto;}

.ufeedback-card{
	background:rgba(255,255,255,0.94);
	border:1px solid rgba(205,217,229,0.85);
	border-radius:5px;
	box-shadow:0 18px 38px rgba(15,23,42,0.12);
	overflow:hidden;
}

.ufeedback-head{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:14px;
	padding:18px;
	background:linear-gradient(180deg, rgba(88,166,255,0.20), rgba(31,111,235,0.06));
	border-bottom:1px solid rgba(205,217,229,0.8);
}

.ufeedback-title{
	margin:0;
	font-size:22px;
	line-height:1.2;
	font-weight:700;
	color:var(--primary-text-color);
	letter-spacing:-0.2px;
}

.ufeedback-home{
	display:inline-flex;
	align-items:center;
	gap:8px;
	height:40px;
	padding:0 12px;
	border-radius:5px;
	text-decoration:none;
	color:var(--primary-text-color);
	font-weight:700;
	font-size:13px;
	border:1px solid rgba(205,217,229,0.9);
	background:rgba(255,255,255,0.72);
	backdrop-filter:blur(10px);
	white-space:nowrap;
}
.ufeedback-home:hover{border-color:rgba(31,111,235,0.35);}

.ufeedback-row{
	padding:16px 18px;
	border-bottom:1px solid rgba(205,217,229,0.8);
}

.ufeedback-row-protect{background:rgba(233,239,245,0.35);}

.ufeedback-label{
	display:block;
	font-size:12px;
	font-weight:700;
	color:var(--secondary-text-color);
	margin-bottom:8px;
}
.ufeedback-label-imp:after{content:" *"; color:rgba(239,68,68,0.95);}

.ufeedback-input{
	width:100%;
	height:44px;
	border-radius:5px;
	border:1px solid rgba(205,217,229,0.9);
	background:rgba(255,255,255,0.92);
	padding:0 12px;
	font-size:14px;
	font-weight:700;
	color:var(--primary-text-color);
	outline:none;
}
.ufeedback-input:focus{
	border-color:rgba(31,111,235,0.55);
	box-shadow:0 0 0 3px rgba(31,111,235,0.14);
}

.ufeedback-textarea{
	width:100%;
	border-radius:5px;
	border:1px solid rgba(205,217,229,0.9);
	background:rgba(255,255,255,0.92);
	padding:10px 12px;
	font-size:14px;
	font-weight:700;
	color:var(--primary-text-color);
	outline:none;
	line-height:1.55;
	resize:vertical;
}
.ufeedback-textarea:focus{
	border-color:rgba(31,111,235,0.55);
	box-shadow:0 0 0 3px rgba(31,111,235,0.14);
}

.ufeedback-select select{
	width:100%;
	height:44px;
	border-radius:5px;
	border:1px solid rgba(205,217,229,0.9);
	background:rgba(255,255,255,0.92);
	padding:0 12px;
	font-size:14px;
	font-weight:700;
	color:var(--primary-text-color);
	outline:none;
}

.ufeedback-sec{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	align-items:center;
}

.ufeedback-code{
	display:inline-flex;
	align-items:center;
	padding:10px 12px;
	border-radius:5px;
	border:1px solid rgba(205,217,229,0.8);
	background:rgba(233,239,245,0.55);
}

.ufeedback-actions{
	padding:18px;
	display:flex;
	justify-content:flex-end;
}

.ufeedback-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:44px;
	padding:0 18px;
	border-radius:5px;
	border:0;
	cursor:pointer;
	background:var(--primary-color);
	color:#fff;
	font-weight:700;
	font-size:14px;
	box-shadow:0 10px 22px rgba(31,111,235,0.25);
}
.ufeedback-btn:hover{background:var(--primary-color-darker);}

@media (max-width:720px){
	.ufeedback-head{flex-direction:column; align-items:stretch;}
	.ufeedback-home{align-self:flex-start;}
}


/* LOGIN - overlay fix + new shell
----------------------------------------------- */
.overlay {position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:0.60; cursor:pointer; z-index:9998;}
.login {position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:360px; max-width:calc(100% - 24px); overflow:hidden;
	background:rgba(255,255,255,0.94); border:1px solid rgba(205,217,229,0.85); border-radius: 5px; box-shadow:0 18px 38px rgba(15,23,42,0.16); z-index:9999;}
.login.hidden {display:none;}

.login__header {display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 12px;
	background:linear-gradient(180deg, rgba(88,166,255,0.20), rgba(31,111,235,0.06)); border-bottom:1px solid rgba(205,217,229,0.8);}
.login__avatar {width:38px; height:38px; border-radius: 5px; overflow:hidden; border:1px solid rgba(205,217,229,0.95); background:rgba(15,23,42,0.06); flex:0 0 auto; margin:0;}
.login__avatar img {width:100%; height:100%; object-fit:cover; display:block;}

.login__title {font-size:14px; font-weight:700; color:var(--primary-text-color); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0; margin:0; flex:1 1 auto;}
.login__title a {margin-left:10px; font-size:12px; font-weight:700; color:var(--primary-color); text-decoration:none; border:0;}
.login__title a:hover {text-decoration:underline;}

.login__close {width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius: 5px; cursor:pointer;
	border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.70); color:var(--secondary-text-color); opacity:1; margin:0; font-size:16px;}
.login__close:hover {border-color:rgba(31,111,235,0.35); color:var(--primary-text-color);}

.login__content {padding:12px;}
.login__row {margin:0 0 10px; position:relative; display:block; font-size:13px; color:var(--secondary-text-color);}
.login__caption {display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12px; font-weight:700; color:var(--secondary-text-color); margin:0 0 8px;}
.login__caption a {text-decoration:none; color:var(--primary-color); font-weight:700; margin:0; white-space:nowrap;}
.login__caption a:hover {text-decoration:underline;}

.login__input {position:relative;}
.login__input input {width:100%; height:44px; border-radius: 5px; border:1px solid rgba(205,217,229,0.9); background:rgba(255,255,255,0.92);
	padding:0 40px 0 12px; font-size:14px; color:var(--primary-text-color); outline:none;}
.login__input input:focus {border-color:rgba(31,111,235,0.55); box-shadow:0 0 0 3px rgba(31,111,235,0.14);}

.login__row .fal {opacity:0.85; position:absolute; right:12px; left:auto; bottom:auto; top:50%; transform:translateY(-50%);
	line-height:1; width:auto; text-align:right; color:var(--secondary-text-color);}

.login__row.checkbox {display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius: 5px; border:1px solid rgba(205,217,229,0.8);
	background:rgba(233,239,245,0.55); font-size:13px; font-weight:800; color:var(--primary-text-color); cursor:pointer;}
.login__row.checkbox span {    padding-left: 40px;}
.login__row button {width:100%; height:44px; border-radius: 5px; border:0; cursor:pointer; background:var(--primary-color); color:#fff; font-weight:700; font-size:14px; box-shadow:0 10px 22px rgba(31,111,235,0.25);}
.login__row button:hover {background:var(--primary-color-darker);}

.login__menu {list-style:none; margin:0; padding:10px; display:flex; flex-direction:column; gap:8px;}
.login__menu li {margin:0; min-width:0; max-width:none; flex:none;}
.login__menu a {display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-radius: 5px;
	background:rgba(233,239,245,0.55); border:1px solid rgba(205,217,229,0.8); color:var(--primary-text-color); text-decoration:none; font-weight:700; font-size:13px; box-shadow:none; text-align:left;}
.login__menu a:hover {border-color:rgba(31,111,235,0.35); background:rgba(233,239,245,0.75);}
.login__menu .far {display:inline-flex; align-items:center; justify-content:center; height:auto; font-size:16px; opacity:0.85;}

.login__social {display:none;}
.login__social-caption {display:none;}
.login__social-btns {display:none;}

@media (max-width:420px){
	.login {width:calc(100% - 24px);}
	.login__title {max-width:220px;}
}