:root {
	--ink: #1d2327;
	--muted: #646970;
	--paper: #f0f0f1;
	--surface: #fff;
	--line: #dcdcde;
	--line-strong: #c3c4c7;
	--sage: #2271b1;
	--sage-soft: #f0f6fc;
	--danger: #b32d2e;
	--ok: #007017;
	--warn: #8a5a00;
	--sans: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
	--mono: Consolas, "Cascadia Mono", "Liberation Mono", monospace;
}

* { box-sizing: border-box; }

html, body {
	margin: 0;
	min-height: 100%;
	background: var(--paper);
	color: var(--ink);
	font: 15px/1.5 var(--sans);
}

a { color: var(--sage); text-decoration: none; }
a:hover { color: #135e96; text-decoration: underline; }

.disk-shell {
	display: flex;
	min-height: 100vh;
}

.disk-side {
	width: 196px;
	flex: 0 0 196px;
	padding: 20px 14px;
	border-right: 1px solid var(--line);
	background: #fff;
	display: flex;
	flex-direction: column;
}

.disk-brand {
	display: flex;
	align-items: center;
	gap: 0;
	margin: 0 0 20px;
	padding: 0 8px;
	color: var(--ink);
	text-decoration: none;
}
.disk-brand:hover { color: var(--ink); text-decoration: none; }

.disk-mark { display: none; }

.disk-brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.disk-brand-text strong {
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0;
}
.disk-brand-text em {
	margin-top: 1px;
	font-style: normal;
	font-size: 12px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--muted);
}

.disk-user {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin: 0 0 22px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--line);
}
.disk-user-name {
	font-size: 13px;
	color: var(--ink);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
a.disk-user-out {
	font-size: 12px;
	color: var(--muted);
	text-decoration: none;
}
a.disk-user-out:hover { color: var(--ink); }

.disk-nav { display: flex; flex-direction: column; gap: 4px; }
.disk-nav a {
	display: block;
	padding: 6px 8px;
	border-radius: 2px;
	border-left: 2px solid transparent;
	color: var(--ink);
	font-size: 13px;
	text-decoration: none;
}
.disk-nav a:hover { background: var(--paper); text-decoration: none; }
.disk-nav a.active {
	background: var(--sage-soft);
	border-left-color: var(--sage);
	color: var(--sage);
}

.disk-main {
	flex: 1;
	min-width: 0;
	padding: 28px 32px 64px;
	max-width: 1040px;
}
.disk-main:has(.fm) { max-width: 1180px; }

.disk-top { margin-bottom: 28px; }
.disk-kicker {
	display: block;
	margin-bottom: 2px;
	font-size: 12px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--muted);
}
.disk-top h1 {
	margin: 0;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.25;
}
.disk-top p {
	margin: 8px 0 0;
	max-width: 40em;
	color: var(--muted);
	font-size: 14px;
}

.flash {
	margin-bottom: 12px;
	padding: 8px 10px;
	border: 1px solid var(--line);
	border-radius: 2px;
	background: #fff;
	font-size: 13px;
}
.flash-ok { border-color: #b8e6bf; color: var(--ok); }
.flash-error { border-color: #f0c4c4; color: var(--danger); }
.local-banner {
	background: #fff;
	color: var(--muted);
	border: 1px solid var(--line);
	padding: 8px 10px;
	margin: 0 0 16px;
	font-size: 13px;
}
.local-banner-login { margin: 16px; }
.flash-warn { background: #f8f1e4; color: var(--warn); }

.grid-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 22px;
}
.stat {
	padding: 10px 12px;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 2px;
}
.stat b {
	display: block;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
	word-break: break-all;
}
.stat span {
	display: block;
	margin-top: 4px;
	color: var(--muted);
	font-size: 12px;
}

.panel {
	margin-bottom: 12px;
	padding: 14px 16px;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 2px;
}
.panel-files {
	background: #fff;
	border-color: var(--line);
	box-shadow: none;
	padding: 12px;
}

.panel h3 {
	margin: 18px 0 8px;
	font-size: 15px;
}
.panel h2 {
	margin: 0 0 10px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ink);
}
.panel-files h2 { color: #1d2327; }
.panel pre {
	margin: 0;
	max-height: 380px;
	overflow: auto;
	padding: 10px 12px;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 2px;
	color: var(--ink);
	font-size: 12px;
	line-height: 1.5;
}

.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th {
	padding: 0 12px 8px 0;
	text-align: left;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--muted);
	border-bottom: 1px solid var(--line);
}
.table td {
	padding: 12px 12px 12px 0;
	border-bottom: 1px solid var(--line);
	vertical-align: middle;
}
.table tr:last-child td { border-bottom: 0; }
.table a { font-weight: 600; }

.mono, .md5 { font-family: var(--mono); font-size: 12.5px; }

.table-log {
	table-layout: fixed;
	width: 100%;
}
.table-log th:nth-child(1) { width: 18%; }
.table-log th:nth-child(2) { width: 8%; }
.table-log th:nth-child(3) { width: 8%; }
.table-log th:nth-child(4) { width: 16%; }
.table-log th:nth-child(5) { width: 12%; }
.table-log th:nth-child(6) { width: 38%; }
.table-log td { vertical-align: top; color: var(--ink); }
.table-log td:nth-child(1) { white-space: nowrap; }
.table-log td:nth-child(4) {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.table-log td:nth-child(5) { overflow-wrap: anywhere; }
.log-params-cell {
	min-width: 0;
	color: var(--ink);
	background: #fff;
}
.log-params {
	margin: 0;
	color: var(--ink);
}
.log-params > div {
	display: block;
	padding: 8px 0;
}
.log-params > div + div { border-top: 1px solid #e6e7e9; }
.log-params dt {
	margin: 0 0 2px;
	color: #1d2327;
	font-family: var(--sans);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}
.log-params dd {
	margin: 0;
	min-width: 0;
	color: #1d2327;
	font-family: var(--mono);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
	overflow-wrap: anywhere;
	word-break: break-word;
}
.log-params > div:has(.log-params-cards) {
	display: block;
}
.log-params > div:has(.log-params-cards) > dt {
	margin-bottom: 6px;
}
.log-params-cards > .log-params > div {
	display: block;
}
.log-params-cards > .log-params dt {
	margin-bottom: 2px;
	color: #646970;
	font-size: 12px;
}
.log-params-cards {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.log-params-cards > .log-params {
	margin: 0;
	padding: 2px 12px;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
}
.log-params-plain {
	color: #1d2327;
	font-family: var(--mono);
	font-size: 13px;
}
.log-params-list {
	margin: 0;
	padding-left: 1.15em;
	color: #1d2327;
	font-family: var(--mono);
	font-size: 13px;
	line-height: 1.45;
}
.log-params-list li + li { margin-top: 3px; }
.log-empty { color: #1d2327; }

.row { margin-bottom: 14px; }
.btn-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

input[type=text],
input[type=password],
textarea,
select {
	width: 100%;
	max-width: 100%;
	padding: 7px 8px;
	border: 1px solid var(--line-strong);
	border-radius: 2px;
	background: #fff;
	color: var(--ink);
	font: inherit;
	outline: none;
}
.btn-row input[type=text],
.btn-row select { width: auto; }
textarea { min-height: 180px; resize: vertical; }
.brief-box { margin-top: 14px; }
.brief-text {
	margin: 0;
	max-height: 320px;
	overflow: auto;
	white-space: pre-wrap;
	font-family: var(--mono);
	font-size: 12.5px;
	line-height: 1.45;
}
input:focus, textarea:focus, select:focus {
	border-color: var(--sage);
	box-shadow: 0 0 0 1px var(--sage);
}

label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	color: var(--muted);
}
span.required { display: none; }
.errorMessage, .errorSummary {
	margin-top: 6px;
	color: var(--danger);
	font-size: 13px;
}

.btn, input[type=submit].btn {
	display: inline-block;
	padding: 6px 12px;
	border: 1px solid var(--sage);
	border-radius: 2px;
	background: var(--sage);
	color: #fff;
	font: inherit;
	font-size: 13px;
	cursor: pointer;
	text-decoration: none;
}
.btn:hover, input[type=submit].btn:hover { background: #135e96; border-color: #135e96; color: #fff; text-decoration: none; }
.btn-danger {
	background: #fff;
	color: var(--danger);
	border: 1px solid #f0c4c4;
}
.btn-danger:hover { background: #fcf0f1; color: var(--danger); border-color: #f0c4c4; }

.fm {
	border: 1px solid #8c919a;
	border-radius: 6px;
	background: #fff;
	box-shadow: inset 0 0 0 1px #fff;
	overflow: hidden;
}
.fm-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	padding: 7px 10px;
	background: #1d2327;
	color: #dcdcde;
	font-size: 13px;
}
.fm-bar a {
	color: #fff;
	text-decoration: none;
	padding: 2px 6px;
	border-radius: 3px;
}
.fm-bar a:hover { background: #2c3338; text-decoration: none; }
.fm-split {
	display: flex;
	align-items: stretch;
	min-height: 560px;
	background: #fff;
}
.fm-side {
	flex: 0 0 272px;
	width: 272px;
	max-height: 720px;
	overflow: auto;
	padding: 6px 4px;
	background: #f0f0f1;
	border-right: 1px solid #c3c4c7;
}
.fm-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	padding: 3px 8px;
	border-radius: 3px;
	color: #1d2327;
	text-decoration: none;
	text-align: left;
}
.fm-item:hover { background: #fff; text-decoration: none; color: #1d2327; }
.fm-item.active {
	background: #d5e8f7;
	box-shadow: inset 0 0 0 1px #72aee6;
}
.fm-item.fm-vuln {
	background: #f8ebe8;
	box-shadow: inset 3px 0 0 #8d3b32;
}
.fm-item.fm-vuln:hover { background: #f3ddd9; }
.fm-item.fm-vuln.active {
	background: #f3d4cf;
	box-shadow: inset 3px 0 0 #8d3b32, inset 0 0 0 1px #8d3b32;
}
.fm-jumps {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0 0 10px;
}
.fm-jumps > span {
	font-size: 12px;
	font-weight: 600;
	color: #8d3b32;
}
a.fm-jump {
	display: inline-block;
	padding: 3px 8px;
	border: 1px solid #e3b7b2;
	border-radius: 4px;
	background: #f8ebe8;
	color: #8d3b32;
	font-family: var(--mono);
	font-size: 12px;
	text-decoration: none;
}
a.fm-jump:hover { background: #f3ddd9; text-decoration: none; }
a.fm-jump.current { box-shadow: inset 0 0 0 1px #8d3b32; }
a.fm-jump-nav {
	background: #8d3b32;
	border-color: #8d3b32;
	color: #fff;
	font-family: var(--sans);
	font-weight: 600;
}
a.fm-jump-nav:hover { background: #732f28; color: #fff; }
a.fm-jump-nav.current { box-shadow: inset 0 0 0 1px #fff; }
.fm-file-vuln { color: #8d3b32; font-weight: 600; }
.fm-item svg { width: 16px; height: 16px; flex: 0 0 16px; display: block; }
.fm-name {
	min-width: 0;
	font-size: 13px;
	line-height: 1.3;
	word-break: break-all;
}
.fm-preview {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	background: #fff;
}
.fm-preview .hint { margin: 0; padding: 8px 12px; border-bottom: 1px solid #dcdcde; background: #f6f7f7; }
.fm-filebar {
	display: flex;
	align-items: center;
	border-bottom: 1px solid #dcdcde;
	background: #f6f7f7;
}
.fm-filebar .hint { flex: 1; min-width: 0; border-bottom: 0; }
.fm-copy {
	flex: 0 0 auto;
	margin: 0 8px 0 0;
	padding: 3px 10px;
	border: 1px solid #8c919a;
	border-radius: 2px;
	background: #fff;
	color: #1d2327;
	font: 12px/1.4 "Segoe UI", sans-serif;
	cursor: pointer;
}
.fm-copy:hover { background: #f0f0f1; }
.fm-raw {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.fm-placeholder {
	margin: auto;
	color: #646970;
	font-size: 13px;
}
.fm-side .hint { margin: 8px 10px; }
.code-view {
	margin: 0;
	flex: 1;
	max-height: 680px;
	overflow: auto;
	padding: 8px 0;
	background: #fff;
	border-radius: 0;
	font-family: var(--mono);
	font-size: 12.5px;
	line-height: 1.6;
}
.code-row {
	display: flex;
	align-items: flex-start;
	min-height: 1.6em;
}
.code-ln {
	flex: 0 0 3.4em;
	padding: 0 10px 0 6px;
	text-align: right;
	color: #8c919a;
	user-select: none;
	background: #f6f7f7;
}
.code-row code,
.code-row code.hljs {
	flex: 1;
	min-width: 0;
	padding: 0 12px;
	background: transparent;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	white-space: pre;
	overflow: visible;
}
.code-row-vuln,
.code-row-vuln code,
.code-row-vuln code.hljs {
	background: #f8d0cb;
}
.code-row-vuln .code-ln {
	color: #8d3b32;
	font-weight: 700;
	background: #f3bdb6;
}
.hljs-keyword, .hljs-selector-tag, .hljs-built_in { color: #2271b1; }
.hljs-string, .hljs-attr { color: #b32d2e; }
.hljs-comment, .hljs-quote { color: #646970; font-style: italic; }
.hljs-number, .hljs-literal { color: #8a5a00; }
.hljs-title, .hljs-function, .hljs-section { color: #1d2327; }
.hljs-variable, .hljs-template-variable, .hljs-name { color: #1d2327; }
.hljs-meta, .hljs-type { color: #646970; }
.tag {
	display: inline-block;
	min-width: 52px;
	font-size: 11px;
	letter-spacing: 0.06em;
	color: var(--muted);
}
.tag-post { color: var(--sage); font-weight: 600; }
.tag-ok { color: var(--ok); font-weight: 600; }
.tag-bad { color: var(--danger); font-weight: 600; }
.auth-flag {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0;
}
.auth-flag-yes { background: #fef3f2; color: #b42318; }
.auth-flag-no { background: #ecfdf3; color: #027a48; }
.verdict-table { margin-bottom: 16px; }
.verdict-table th { width: 7rem; }
.verdict-reason { margin-left: 10px; color: #1d2327; }
.sev {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
}
.sev-critical { background: #fef3f2; color: #b42318; }
.sev-high { background: #fffaeb; color: #b54708; }
.sev-medium { background: #eff8ff; color: #175cd3; }
.sev-low { background: #ecfdf3; color: #027a48; }
.agent-description {
	margin: 8px 0 16px;
	max-width: 46rem;
	color: #1d2327;
	font-size: 15px;
	line-height: 1.55;
}
.hook-file { color: var(--muted); }

.hint { margin: 12px 0 0; color: var(--muted); font-size: 13px; }
.user-form { max-width: 420px; }
.token-once {
	margin: 0 0 12px;
	padding: 8px 10px;
	border: 1px solid var(--line-strong);
	border-radius: 2px;
	background: #fff;
	font-family: var(--mono);
	font-size: 13px;
	word-break: break-all;
}
.empty { padding: 8px 0 4px; color: var(--muted); }

.badge {
	display: inline-block;
	padding: 0 6px;
	border: 1px solid var(--line);
	border-radius: 2px;
	background: #fff;
	color: var(--muted);
	font-size: 12px;
	line-height: 1.6;
}
.badge-running { border-color: #c5d9ed; color: #135e96; }
.badge-ready { border-color: #b8e6bf; color: var(--ok); }
.badge-failed { border-color: #f0c4c4; color: var(--danger); }
.badge-destroyed { text-decoration: line-through; }
.ttl-soon { color: #a16207; font-weight: 600; }
.doc {
	margin: 0;
	white-space: pre-wrap;
	font-size: 13px;
	line-height: 1.45;
}
.state-list { margin: 8px 0 0; padding-left: 18px; }
.state-list li { margin: 2px 0; }

.login-wrap {
	min-height: 100vh;
	display: grid;
	place-items: center;
	padding: 32px 16px;
}
.login-card {
	width: 100%;
	max-width: 360px;
}
.login-mark {
	margin: 0 0 22px;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.2;
}
.login-card .btn,
.login-card input[type=submit].btn {
	width: 100%;
	margin-top: 6px;
	padding: 12px 16px;
}

@media (max-width: 800px) {
	.disk-shell { display: block; }
	.disk-side {
		width: auto;
		border-right: 0;
		border-bottom: 1px solid var(--line);
		padding: 18px 16px 14px;
	}
	.disk-brand { margin-bottom: 14px; }
	.disk-user { margin-bottom: 12px; padding-bottom: 12px; }
	.disk-nav { flex-direction: row; flex-wrap: wrap; }
	.disk-main { padding: 24px 16px 48px; }
	.disk-top h1 { font-size: 20px; }
	.grid-stats { grid-template-columns: 1fr; }
	.panel { overflow-x: auto; }
	.table { min-width: 640px; }
	.table.table-log,
	.table.table-log tbody,
	.table.table-log tr,
	.table.table-log td {
		display: block;
		width: auto;
		min-width: 0;
	}
	.table.table-log { min-width: 0; }
	.table.table-log tr:first-child { display: none; }
	.table.table-log tr {
		margin: 0 0 14px;
		padding-bottom: 8px;
		border-bottom: 1px solid var(--line);
	}
	.table.table-log td {
		padding: 4px 0;
		border: 0;
	}
	.table.table-log td::before {
		display: block;
		margin-bottom: 2px;
		color: #646970;
		font-family: var(--sans);
		font-size: 11px;
		font-weight: 600;
	}
	.table.table-log td:nth-child(1)::before { content: "Время UTC"; }
	.table.table-log td:nth-child(2)::before { content: "Действие"; }
	.table.table-log td:nth-child(3)::before { content: "Итог"; }
	.table.table-log td:nth-child(4)::before { content: "Объект"; }
	.table.table-log td:nth-child(5)::before { content: "Кратко"; }
	.table.table-log td:nth-child(6)::before { content: "Параметры"; }
	.table.table-log td.log-params-cell {
		max-width: none;
		min-width: 0;
	}
	.fm-split { flex-direction: column; min-height: 0; }
	.fm-side {
		width: auto;
		flex-basis: auto;
		max-height: 220px;
		border-right: 0;
		border-bottom: 1px solid #c3c4c7;
	}
}
