/* Badge row for multiple badges */
.badge-row {
	display: flex;
	align-items: flex-start;
	gap: 1.1rem;
}
/* Top link row */
.top-link-row {
	position: absolute;
	top: 18px;
	left: 24px;
	z-index: 100;
}
.top-link {
	color: #3b82f6;
	font-size: 1.05rem;
	font-weight: 600;
	text-decoration: underline;
}
/* App header with badge */
.app-header {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	margin-bottom: 1.2rem;
}
.app-header h1 {
	margin: 0;
	font-size: 1.9rem;
	letter-spacing: .5px;
}
.app-badge {
	background: #23263a;
	border-radius: 8px;
	padding: 0.5rem 1.1rem 0.7rem 1.1rem;
	box-shadow: 0 2px 8px rgba(0,0,0,.18);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 0;
}
.badge-cyrillic {
	font-family: 'Segoe UI', 'Arial', 'Times New Roman', 'Noto Sans', 'Noto Sans Cyrillic', 'Roboto', 'sans-serif';
	font-size: 1.13rem;
	font-weight: 700;
	letter-spacing: 0.5px;
	margin-bottom: 0.18rem;
}
.badge-arial {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.02rem;
	font-weight: 600;
	margin-top: 0.1rem;
}
body {font-family: system-ui, Arial, sans-serif; margin:0; background:#12141a; color:#f2f5f7;}
.container {max-width: 900px; margin: 2rem auto; padding: 1.5rem; background:#1e222b; border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,.4);}
h1 {margin-top:0; font-size:1.9rem; letter-spacing:.5px;}
label {display:block; font-weight:600; margin:.4rem 0 .25rem;}
textarea {width:100%; min-height:160px; resize:vertical; padding:.75rem; font-size:1rem; border:1px solid #333; border-radius:8px; background:#181c24; color:#fff; line-height:1.4;}
textarea:focus {outline:2px solid #3b82f6;}
.char-count {text-align:right; font-size:.8rem; margin-top:.25rem; opacity:.7;}
.row {display:flex; gap:1rem; flex-wrap:wrap;}
.col {flex:1 1 250px;}
select, input[type=range], button {width:100%;}
select {padding:.6rem .7rem; border-radius:8px; border:1px solid #333; background:#181c24; color:#fff;}
.sliders {margin-top:1rem;}
.slider-group {flex:1 1 160px;}
.slider-group input {margin-top:.3rem;}
.buttons {display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.2rem;}
button {flex:1 1 140px; padding:.7rem .9rem; border:none; border-radius:8px; background:#2563eb; color:#fff; font-size:.95rem; font-weight:600; cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.4); transition:background .25s, transform .15s;}
button[disabled] {background:#374151; cursor:not-allowed; opacity:.6;}
button:hover:not([disabled]) {background:#1d4ed8;}
button:active:not([disabled]) {transform:translateY(2px);}
.permission-btn {background:#059669 !important; flex:1 1 200px;}
.permission-btn:hover:not([disabled]) {background:#047857 !important;}
.permission-btn.granted {background:#10b981 !important;}
.permission-stop-btn {background:#ef4444 !important; flex:1 1 200px;}
.permission-stop-btn:hover:not([disabled]) {background:#dc2626 !important;}
#status {margin-top:1rem; min-height:1.2rem; font-size:.9rem;}
details {margin-top:1.4rem; background:#181c24; padding:.9rem 1rem; border-radius:10px;}
details summary {cursor:pointer; font-weight:600;}
::-webkit-scrollbar {width:12px;}::-webkit-scrollbar-track {background:#12141a;}::-webkit-scrollbar-thumb {background:#2c3542; border-radius:6px;}::-webkit-scrollbar-thumb:hover {background:#3b4757;}