:root {
	--bg: #0f172a;
	--panel: #111827;
	--text: #e5e7eb;
	--muted: #9ca3af;
	--primary: #2563eb;
	--danger: #ef4444;
	--warning: #f59e0b;
	--border: #1f2937;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
	background: var(--bg);
	color: var(--text);
	font: 14px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
}

.app-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid var(--border);
	background: #0b1220;
	position: sticky;
	top: 0;
	z-index: 10;
}
.app-header h1 { margin: 0; font-size: 18px; }
.app-header .header-right a {
	color: var(--muted);
	text-decoration: none;
	border: 1px solid var(--border);
	padding: 6px 10px;
	border-radius: 6px;
}
.app-header .header-right a:hover { color: var(--text); border-color: #2a384f; }

.container {
	max-width: 1100px;
	margin: 0 auto;
	padding: 20px;
}

.panel {
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 16px;
	margin-bottom: 16px;
}

.row { display: flex; gap: 16px; flex-wrap: wrap; }
.row-inline { display: flex; gap: 8px; align-items: center; }
.col { flex: 1 1 300px; }
.col.right { display: flex; justify-content: flex-end; align-items: flex-end; }

label { display: block; margin-bottom: 6px; color: var(--muted); }
input, select {
	background: #0b1220;
	color: var(--text);
	border: 1px solid var(--border);
	border-radius: 8px;
	padding: 10px 12px;
	outline: none;
}
input:focus, select:focus { border-color: #2a384f; }

button {
	background: var(--primary);
	color: white;
	border: 0;
	border-radius: 8px;
	padding: 10px 14px;
	cursor: pointer;
}
button.secondary { background: #1f2937; color: var(--text); }
button.danger { background: var(--danger); }
button.warning { background: var(--warning); color: #1b1b1b; }
button.small { padding: 6px 10px; }
button:disabled { opacity: 0.6; cursor: not-allowed; }

.domain-list {
	list-style: none;
	padding: 0;
	margin: 0;
	max-height: 45vh;
	overflow: auto;
	border: 1px solid var(--border);
	border-radius: 8px;
}
.domain-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
}
.domain-item:last-child { border-bottom: 0; }

.logs {
	background: #0b1220;
	border: 1px solid var(--border);
	border-radius: 8px;
	padding: 12px;
	max-height: 30vh;
	overflow: auto;
	white-space: pre-wrap;
}

.footer {
	text-align: center;
	color: var(--muted);
	padding: 18px;
	border-top: 1px solid var(--border);
}