/* ============================================================
   Narzędzia (/przybornik/...) - kalkulatory i trenery.
   Korzysta ze zmiennych i klas .guide-* z landing.css (ładowany wcześniej).
   ============================================================ */

.tools-wrap {
	max-width: 980px;
}
.tools-wrap .guide-body, .tools-wrap .guide-faq, .tools-wrap .guide-cta { max-width: 860px; }
.tools-wrap.gl .guide-cat-title { margin-top: 34px; }
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.tools-disclaimer {
	margin-top: 26px;
	border-top: 1px solid var(--paper-line);
	padding-top: 14px;
}

/* ---------- panel narzędzia ---------- */
.tool-app {
	background: var(--surface, #fff);
	border: 1px solid var(--paper-line);
	border-top: 3px solid var(--amber);
	padding: 22px 24px 24px;
	margin: 22px 0 34px;
}
.tool-fields {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 14px 18px;
}
.tool-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
}
.tool-field em {
	font-style: normal;
	font-weight: 400;
	color: var(--ink-soft);
}
.tool-field small {
	font-weight: 400;
	color: var(--ink-soft);
	font-size: 11.5px;
}
.tool-field-wide {
	grid-column: 1 / -1;
}
.tool-input {
	display: flex;
	align-items: stretch;
	border: 1px solid var(--paper-line);
	background: var(--surface, #fff);
	border-radius: 3px;
	overflow: hidden;
}
.tool-input:focus-within {
	border-color: var(--amber);
	box-shadow: 0 0 0 2px rgba(217, 142, 43, 0.18);
}
.tool-input input,
.tool-input select {
	border: none;
	background: transparent;
	padding: 10px 12px;
	font-size: 15px;
	font-family: var(--font-body);
	color: var(--ink);
	min-width: 0;
	flex: 1;
	outline: none;
}
.tool-input select {
	cursor: pointer;
}
.tool-input input + select {
	flex: 0 0 auto;
	border-left: 1px solid var(--paper-line);
	background: var(--bg, var(--paper));
	padding: 10px 8px;
}
.tool-input i {
	font-style: normal;
	display: flex;
	align-items: center;
	padding: 0 12px;
	background: var(--bg, var(--paper));
	border-left: 1px solid var(--paper-line);
	color: var(--ink-soft);
	font-size: 13px;
}
.tool-form textarea {
	width: 100%;
	border: 1px solid var(--paper-line);
	border-radius: 3px;
	padding: 12px 14px;
	font-family: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace;
	font-size: 14.5px;
	line-height: 1.5;
	resize: vertical;
	color: var(--ink);
	font-weight: 400;
}
.tool-form textarea:focus {
	outline: none;
	border-color: var(--amber);
	box-shadow: 0 0 0 2px rgba(217, 142, 43, 0.18);
}
.tool-form-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 16px;
	margin: 16px 0 4px;
}
.tool-examples {
	font-size: 13px;
	color: var(--ink-soft);
	display: flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	align-items: center;
}
.link-btn {
	background: none;
	border: none;
	padding: 0;
	color: var(--amber-dark);
	font: inherit;
	font-size: 13px;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
}
.link-btn:hover {
	color: var(--ink);
}
.btn-outline-dark {
	background: var(--surface, #fff);
	color: var(--ink);
	border: 1px solid var(--paper-line);
}
.btn-outline-dark:hover {
	border-color: var(--ink);
}
.tool-label {
	font-size: 13px;
	font-weight: 600;
	margin: 0 0 8px;
}

/* ---------- wyniki ---------- */
.tool-result {
	margin-top: 18px;
}
.tool-hint {
	color: var(--ink-soft);
	font-size: 13.5px;
	margin: 0;
}
.tool-error {
	color: var(--danger);
	font-size: 14px;
	margin: 8px 0;
}
.tool-alert {
	background: var(--tint-red, #fbeceb);
	border-left: 3px solid var(--danger);
	padding: 10px 14px;
	font-size: 14px;
	margin: 12px 0;
}
.tool-note {
	font-size: 13px;
	color: var(--ink-soft);
	line-height: 1.55;
	margin: 12px 0;
}
.tool-note a {
	color: var(--amber-dark);
}
.tool-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: 10px;
}
.tool-card {
	background: var(--bg, var(--paper));
	border: 1px solid var(--paper-line);
	padding: 12px 14px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.tool-card-label {
	font-size: 11.5px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ink-soft);
	font-weight: 600;
}
.tool-card-value {
	font-family: var(--font-head);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.2;
}
.tool-card-note {
	font-size: 12.5px;
	color: var(--ink-soft);
}
.tool-card.is-main {
	background: var(--solid, var(--navy-950));
	border-color: var(--solid, var(--navy-950));
	color: var(--paper);
}
.tool-card.is-main .tool-card-label,
.tool-card.is-main .tool-card-note {
	color: #b9c2cc;
}
.tool-card.is-warn {
	border-left: 3px solid var(--amber);
}
.tool-card.is-bad {
	border-left: 3px solid var(--danger);
	background: var(--tint-red, #fbeceb);
}
.tool-steps {
	margin-top: 16px;
	border: 1px solid var(--paper-line);
	background: var(--surface-2, #fcfbf8);
}
.tool-steps summary {
	cursor: pointer;
	padding: 10px 14px;
	font-weight: 600;
	font-size: 13.5px;
}
.tool-steps ol {
	margin: 0;
	padding: 0 18px 12px 34px;
	font-size: 14px;
	line-height: 1.6;
}
.tool-steps li {
	margin-bottom: 4px;
}
.tool-table-wrap {
	overflow-x: auto;
}
.tool-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}
.tool-table td {
	border-bottom: 1px solid var(--paper-line);
	padding: 9px 4px;
}
.tool-table td:last-child {
	text-align: right;
	font-family: var(--font-head);
	font-weight: 600;
	font-size: 17px;
}
.tool-table tr.is-from td {
	color: var(--amber-dark);
}
.tool-checks {
	list-style: none;
	padding: 0;
	margin: 12px 0 0;
	font-size: 14px;
}
.tool-checks li {
	padding: 6px 10px;
	margin-bottom: 4px;
}
.tool-checks .is-ok {
	background: var(--tint-teal, #e6f3ef);
	color: var(--ink-teal, #1f6b5e);
}
.tool-checks .is-bad {
	background: var(--tint-red, #fbeceb);
	color: var(--danger);
}
.tool-figure {
	margin: 16px 0 0;
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.tool-figure svg {
	color: var(--amber-dark);
	flex: 0 0 auto;
}
.tool-figure figcaption {
	font-size: 12.5px;
	color: var(--ink-soft);
	max-width: 260px;
}
.svg-rwy {
	fill: #3b4652;
}
.svg-center {
	stroke: #e8e6dd;
	stroke-width: 2;
	stroke-dasharray: 8 7;
}
.svg-num {
	fill: #fff;
	font-family: var(--font-head);
	font-size: 11px;
	font-weight: 600;
}
.svg-wind {
	stroke: currentColor;
	stroke-width: 4;
	stroke-linecap: round;
}

/* ---------- chipy (filtry) ---------- */
.chip-group {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
}
.chip {
	border: 1px solid var(--paper-line);
	background: var(--surface, #fff);
	color: var(--ink-soft);
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 12.5px;
	font-family: var(--font-body);
	cursor: pointer;
}
.chip:hover {
	border-color: var(--ink-soft);
}
.chip.is-active {
	background: var(--solid, var(--navy-950));
	border-color: var(--solid, var(--navy-950));
	color: var(--paper);
}
.chip-wrap {
	margin-bottom: 14px;
}

/* ---------- METAR: dekoder i trener ---------- */
.mt-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	margin-bottom: 14px;
}
.mt-score {
	font-size: 13.5px;
	color: var(--ink-soft);
	margin-bottom: 12px;
}
.mt-card {
	border: 1px solid var(--paper-line);
	background: var(--surface-2, #fcfbf8);
	padding: 18px 20px;
}
.mt-card-head,
.mt-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 12px;
	font-size: 12.5px;
	color: var(--ink-soft);
	margin-bottom: 10px;
}
.mt-head {
	justify-content: flex-start;
}
.mt-badge {
	background: var(--solid, var(--navy-950));
	color: var(--paper);
	font-weight: 700;
	font-size: 11.5px;
	letter-spacing: 0.05em;
	padding: 3px 8px;
	border-radius: 2px;
}
.mt-src {
	font-weight: 600;
}
.mt-src.is-real {
	color: var(--ink-teal, #1f6b5e);
}
.mt-tape {
	font-family: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace;
	font-size: 16px;
	line-height: 2.1;
	background: var(--navy-950);
	color: #e8e6dd;
	padding: 12px 16px;
	border-radius: 3px;
	word-break: break-word;
	margin-bottom: 14px;
}
.mt-chip {
	padding: 2px 4px;
	border-radius: 2px;
	cursor: pointer;
	transition: background 0.12s;
	white-space: nowrap;
}
.mt-chip:hover,
.mt-chip.is-hover {
	background: #2e4560;
}
.mt-chip.is-hl {
	background: var(--amber);
	color: #241704;
}
.mt-chip.mt-unknown {
	background: var(--danger);
	color: #fff;
}
.mt-chip.mt-trend,
.mt-chip.mt-change {
	color: #f2c27e;
}
.mt-chip.mt-rmk {
	color: #8d9aa8;
}
.mt-section {
	font-family: var(--font-head);
	font-size: 15px;
	margin: 18px 0 8px;
}
.mt-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--surface, #fff);
	font-size: 14px;
}
.mt-table td {
	border: 1px solid var(--paper-line);
	padding: 8px 12px;
	vertical-align: top;
	line-height: 1.5;
}
.mt-raw {
	font-family: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace;
	font-weight: 500;
	white-space: nowrap;
	width: 1%;
}
.mt-table tr.is-hover td,
.mt-table tr.is-flash td {
	background: var(--tint-amber, #fbf1e2);
}
.mt-table tr.is-unknown td {
	background: var(--tint-red, #fbeceb);
}
.mt-vfr {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 12px 14px;
	margin: 6px 0 4px;
	font-size: 14px;
	border-left: 3px solid;
}
.mt-vfr small {
	color: var(--ink-soft);
	font-size: 12px;
	line-height: 1.5;
}
.mt-vfr.is-ok {
	background: var(--tint-teal, #e6f3ef);
	border-color: var(--teal);
}
.mt-vfr.is-bad {
	background: var(--tint-red, #fbeceb);
	border-color: var(--danger);
}
.mt-q {
	margin-top: 4px;
}
.mt-topic {
	font-size: 11.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--amber-dark);
	font-weight: 700;
	margin-bottom: 4px;
}
.mt-progress {
	font-weight: 600;
}
.mt-prompt {
	font-family: var(--font-head);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	margin: 0 0 14px;
}
.mt-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.mt-option {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	text-align: left;
	background: var(--surface, #fff);
	border: 1px solid var(--paper-line);
	border-radius: 3px;
	padding: 11px 14px;
	font-size: 14.5px;
	font-family: var(--font-body);
	color: var(--ink);
	line-height: 1.45;
	cursor: pointer;
	transition: border-color 0.12s;
}
.mt-option:hover:not([disabled]) {
	border-color: var(--amber);
}
.mt-option[disabled] {
	cursor: default;
}
.mt-letter {
	flex: 0 0 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--bg, var(--paper));
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 700;
}
.mt-option.is-correct {
	border-color: var(--teal);
	background: var(--tint-teal, #e6f3ef);
}
.mt-option.is-correct .mt-letter {
	background: var(--teal);
	color: #fff;
}
.mt-option.is-wrong {
	border-color: var(--danger);
	background: var(--tint-red, #fbeceb);
}
.mt-option.is-wrong .mt-letter {
	background: var(--danger);
	color: #fff;
}
.mt-option.is-dim {
	opacity: 0.6;
}
.mt-feedback {
	margin-top: 14px;
	padding: 12px 14px;
	font-size: 14px;
	line-height: 1.6;
	border-left: 3px solid;
	background: var(--surface, #fff);
}
.mt-feedback.is-ok {
	border-color: var(--teal);
}
.mt-feedback.is-bad {
	border-color: var(--danger);
}
.mt-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 14px;
}
.mt-stats-wrap h3 {
	font-family: var(--font-head);
	font-size: 15px;
	margin: 24px 0 10px;
}
.mt-stats-wrap h3 small {
	font-family: var(--font-body);
	font-weight: 400;
	color: var(--ink-soft);
	font-size: 12px;
}
.mt-stats {
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 13.5px;
}
.mt-stats li {
	display: grid;
	grid-template-columns: minmax(120px, 220px) 1fr 90px;
	align-items: center;
	gap: 10px;
	padding: 5px 0;
}
.mt-bar {
	height: 8px;
	background: var(--paper-dim);
	border-radius: 4px;
	overflow: hidden;
}
.mt-bar span {
	display: block;
	height: 100%;
	background: var(--teal);
}
.mt-pct {
	text-align: right;
	font-weight: 600;
}
.mt-pct small {
	font-weight: 400;
	color: var(--ink-soft);
}
.mt-decoded .mt-tape {
	margin-top: 4px;
}

/* ---------- trener zadań ---------- */
.nt-form {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 14px;
	align-items: center;
}
.nt-answer {
	display: flex;
	align-items: stretch;
	border: 1px solid var(--paper-line);
	border-radius: 3px;
	background: var(--surface, #fff);
	overflow: hidden;
}
.nt-answer:focus-within {
	border-color: var(--amber);
}
.nt-answer input {
	border: none;
	padding: 11px 12px;
	font-size: 17px;
	width: 150px;
	font-family: var(--font-head);
	outline: none;
}
.nt-unit {
	display: flex;
	align-items: center;
	padding: 0 12px;
	background: var(--bg, var(--paper));
	color: var(--ink-soft);
	font-size: 14px;
	border-left: 1px solid var(--paper-line);
}

/* ---------- masa i wyważenie ---------- */
.mb-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	min-width: 520px;
}
.mb-table th {
	text-align: left;
	font-size: 11.5px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ink-soft);
	padding: 6px 6px;
	border-bottom: 1px solid var(--paper-line);
}
.mb-table td {
	padding: 5px 6px;
	border-bottom: 1px solid var(--paper-dim);
	vertical-align: middle;
}
.mb-table input {
	width: 100%;
	border: 1px solid var(--paper-line);
	border-radius: 3px;
	padding: 7px 9px;
	font-size: 14px;
	font-family: var(--font-body);
}
.mb-table input:focus {
	outline: none;
	border-color: var(--amber);
}
.mb-table td:nth-child(2),
.mb-table td:nth-child(3) {
	width: 18%;
}
.mb-moment {
	font-family: var(--font-head);
	font-weight: 600;
	white-space: nowrap;
	width: 14%;
}
.mb-sub {
	display: block;
	font-size: 11.5px;
	color: var(--ink-soft);
	margin-top: 2px;
}
.mb-del {
	background: none;
	border: none;
	font-size: 20px;
	line-height: 1;
	color: var(--ink-soft);
	cursor: pointer;
	padding: 2px 6px;
}
.mb-del:hover {
	color: var(--danger);
}
.mb-app .tool-fields {
	margin-top: 12px;
}

@media (max-width: 560px) {
	.tool-app {
		padding: 16px 14px 18px;
		margin-left: -8px;
		margin-right: -8px;
	}
	.tool-fields {
		grid-template-columns: 1fr;
	}
	.mt-card {
		padding: 14px 12px;
	}
	.mt-tape {
		font-size: 14px;
		padding: 10px 12px;
	}
	.mt-prompt {
		font-size: 16.5px;
	}
	.mt-stats li {
		grid-template-columns: 1fr 70px;
	}
	.mt-stats .mt-bar {
		display: none;
	}
	.mt-table td {
		display: block;
		border-top: none;
	}
	.mt-table tr td:first-child {
		border-top: 1px solid var(--paper-line);
	}
	.mt-raw {
		width: auto;
		white-space: normal;
		word-break: break-word;
		background: var(--bg, var(--paper));
		padding: 6px 12px;
	}
	.mb-table {
		min-width: 0;
	}
	.mb-table thead {
		display: none;
	}
	.mb-table,
	.mb-table tbody {
		display: block;
	}
	.mb-table tr {
		display: grid;
		grid-template-columns: 1fr 1fr auto;
		gap: 6px;
		padding: 10px 0;
		border-bottom: 1px solid var(--paper-line);
	}
	.mb-table td {
		display: block;
		padding: 0;
		border: none;
		width: auto !important;
	}
	.mb-table td:first-child {
		grid-column: 1 / -2;
	}
	.mb-table td:nth-child(5) {
		grid-column: -2 / -1;
		grid-row: 1;
		text-align: right;
	}
	.mb-moment {
		grid-column: 1 / -1;
		font-size: 13px;
		color: var(--ink-soft);
	}
	.mb-moment::before {
		content: 'Moment: ';
		font-family: var(--font-body);
		font-weight: 400;
	}
	.tool-card-value {
		font-size: 22px;
	}
}

/* ---------- symulatory (lekcje interaktywne) ---------- */
.sim-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--paper-line); margin: -4px 0 16px; overflow-x: auto; }
.sim-tab { background: none; border: 0; border-bottom: 2px solid transparent; padding: 8px 14px; font-family: var(--font-head); font-weight: 600; font-size: 14px; color: var(--ink-soft); cursor: pointer; white-space: nowrap; margin-bottom: -1px; }
.sim-tab.is-active { color: var(--ink); border-bottom-color: var(--amber); }
.sim-stage { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px; align-items: center; }
.sim-dial { width: 100%; height: auto; display: block; }
.sim-section { width: 100%; height: auto; display: block; border: 1px solid var(--paper-line); }
.sim-readout { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 0; margin: 16px 0 0; border: 1px solid var(--paper-line); }
.sim-readout > div { padding: 8px 12px; border-right: 1px solid var(--paper-line); }
.sim-readout > div:last-child { border-right: 0; }
.sim-readout dt { font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); }
.sim-readout dd { margin: 2px 0 0; font-family: var(--font-head); font-weight: 600; font-size: 17px; color: var(--ink); font-variant-numeric: tabular-nums; }
.sim-readout dd.sim-big { color: var(--amber-dark); }
.sim-warnbox.is-warn { background: var(--tint-red, #fbeceb); box-shadow: inset 3px 0 0 var(--danger); }
.sim-warnbox.is-warn dd { color: var(--danger); }
.sim-msg { margin: 12px 0 0; padding: 10px 12px; border-left: 3px solid var(--teal); background: var(--bg, var(--paper)); font-size: 14.5px; color: var(--ink); min-height: 2.6em; }
.sim-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 18px; margin-top: 16px; }
.sim-ctl { display: flex; flex-direction: column; gap: 6px; }
.sim-ctl-wide { grid-column: 1 / -1; }
.sim-ctl-l { font-size: 13px; color: var(--ink-soft); }
.sim-ctl-l output { font-family: var(--font-head); font-weight: 600; color: var(--ink); margin-left: 4px; }
.sim-ctl input[type=range] { width: 100%; accent-color: var(--amber); }
.sim-btns { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; }
.sim-btn-ghost { background: none; color: var(--ink); border: 1px solid var(--ink-soft); }
.sim-btn-ghost:hover { border-color: var(--amber); }
.sim-lbl.sim-red { fill: var(--danger); }
.sim-lbl-sea { fill: #2c4a5a; }
[data-theme="dark"] .sim-lbl-sea { fill: #9fb0c1; }
.sim-btns .btn[disabled] { opacity: .45; cursor: default; }

/* rysunki SVG symulatorów - kolory z tokenów, więc tryb ciemny działa sam */
.sim svg text { font-family: var(--font-body); }
.sim-dial-rim { fill: #1b2633; }
.sim-dial-face { fill: #0b1420; }
.sim-tick { stroke: #c9c6b8; stroke-width: 1; }
.sim-tick-big { stroke: #e8e6dd; stroke-width: 2.5; }
.sim-dial-num { fill: #e8e6dd; font-size: 17px; font-family: var(--font-head) !important; font-weight: 600; }
.sim-dial-unit { fill: #9fb0c1; font-size: 9.5px; letter-spacing: .05em; }
.sim-kollsman { fill: #000; stroke: #4b5a68; }
.sim-kollsman-t { fill: #d98e2b; font-size: 14px; font-family: var(--font-head) !important; font-weight: 700; }
.sim-hand-h { stroke: #e8e6dd; stroke-width: 3.5; stroke-linecap: round; }
.sim-hand-k { stroke: #e8e6dd; stroke-width: 7; stroke-linecap: round; }
.sim-hub { fill: #d98e2b; }
.sim-sky { fill: var(--surface-2, #f3f1e9); }
.sim-ground { fill: #b7ad8e; }
.sim-sea { fill: #8fb7c9; }
[data-theme="dark"] .sim-ground { fill: #3b4a3c; }
[data-theme="dark"] .sim-sea { fill: #234257; }
.sim-msl { stroke: var(--ink-soft); stroke-dasharray: 2 3; }
.sim-runway { fill: var(--ink); }
.sim-ref { stroke: var(--amber); stroke-width: 2; }
.sim-ref-t { fill: var(--amber-dark); font-size: 12px; font-weight: 600; }
.sim-std { stroke: var(--teal); stroke-width: 1.2; stroke-dasharray: 6 4; }
.sim-std-t { fill: var(--teal); font-size: 11.5px; }
.sim-lbl { fill: var(--ink-soft); font-size: 12px; }
.sim-lbl-b { fill: var(--ink); font-weight: 600; }
.sim-lbl.sim-amber { fill: var(--amber-dark); }
.sim-plane path { fill: var(--ink); }
.sim-arrow-true { stroke: var(--ink); stroke-width: 1.5; }
.sim-arrow-ind { stroke: var(--amber); stroke-width: 2.5; }
.sim-arrow-clr { stroke: var(--danger); stroke-width: 2; stroke-dasharray: 4 3; }
.sim-planned { stroke: var(--teal); stroke-width: 1.5; stroke-dasharray: 7 5; }
.sim-track { fill: none; stroke: var(--amber); stroke-width: 2.5; }

@media (max-width: 640px) {
	.sim-stage { grid-template-columns: 1fr; }
	.sim-dial { max-width: 170px; margin: 0 auto; }
	.sim-controls { grid-template-columns: 1fr; }
	.sim-readout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sim-readout > div { border-right: 0; border-bottom: 1px solid var(--paper-line); }
	.sim-readout > div:nth-child(odd) { border-right: 1px solid var(--paper-line); }
	.sim-readout > div:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0; }
}
.sim-ctl-top { flex-direction: row; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.sim-btn-sm { padding: 6px 14px; font-size: 13px; }
.sim-stage-wt { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; }
.sim-tri-wrap { margin: 0; }
.sim-tri-wrap figcaption { font-size: 12.5px; color: var(--ink-soft); margin-top: 6px; line-height: 1.4; }
.sim-teal-t { color: var(--teal); } .sim-amber-t { color: var(--amber-dark); }
.sim-controls-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sim-wind-a { stroke: var(--ink-soft); stroke-width: 1.2; opacity: .45; }
.sim-north { fill: var(--ink); }
.sim-pt { fill: var(--ink); } .sim-pt-b { fill: none; stroke: var(--ink); stroke-width: 2.5; }
.sim-nose { stroke: var(--ink); stroke-width: 1; stroke-dasharray: 2 2; }
.sim-mk-amber { fill: var(--amber); } .sim-mk-ink { fill: var(--ink-soft); } .sim-mk-teal { fill: var(--teal); }
.sim-v-tas { stroke: var(--ink-soft); stroke-width: 2.5; }
.sim-v-wind { stroke: var(--teal); stroke-width: 2.5; }
.sim-v-gs { stroke: var(--amber); stroke-width: 3; }
.sim-arc { fill: none; stroke: var(--danger); stroke-width: 1.5; }
.sim-lbl.sim-teal { fill: var(--teal); font-weight: 600; }
@media (max-width: 640px) {
	.sim-stage-wt { grid-template-columns: 1fr; }
	.sim-tri-wrap svg { max-width: 220px; }
	.sim-controls-4 { grid-template-columns: 1fr 1fr; }
}
.sim-readout dd.sim-dd-sm { font-size: 15px; }
.sim-ctl-time { margin-top: 12px; }
.sim-muted { color: var(--ink-soft); }
.sim-chart-wrap { margin: 14px 0 0; }
.sim-chart-wrap figcaption { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); margin-bottom: 4px; }
.sim-air-warm { fill: #d98e2b; opacity: .10; }
.sim-air-cold { fill: #3f7fa7; opacity: .16; }
[data-theme="dark"] .sim-air-cold { opacity: .30; }
.sim-air-t { font-size: 12px; font-weight: 600; font-style: italic; }
.sim-air-t-cold { fill: #3f7fa7; } .sim-air-t-warm { fill: var(--amber-dark); }
[data-theme="dark"] .sim-air-t-cold { fill: #8fc3e0; }
.sim-front-warm { stroke: #c1443b; stroke-width: 2.5; }
.sim-front-cold { stroke: #2f6fb0; stroke-width: 2.5; }
[data-theme="dark"] .sim-front-cold { stroke: #6aa6e0; }
.sim-cloud { fill: #ffffff; stroke: #9aa5b1; stroke-width: 1; }
.sim-cloud-hi { fill: #ffffff; opacity: .75; }
.sim-cloud-ns, .sim-cloud-cb { fill: #8d98a5; stroke: #6b7682; }
.sim-cloud-mid { fill: #d5dade; }
.sim-cloud-st { fill: #b9c0c7; }
[data-theme="dark"] .sim-cloud { fill: #c9d1da; stroke: #7d8a98; }
[data-theme="dark"] .sim-cloud-ns, [data-theme="dark"] .sim-cloud-cb { fill: #6b7786; }
[data-theme="dark"] .sim-cloud-mid { fill: #9aa6b3; } [data-theme="dark"] .sim-cloud-st { fill: #808c99; }
.sim-cloud-t { fill: #14202c; font-size: 12px; font-weight: 700; }
.sim-rain { stroke: #3f7fa7; stroke-width: 1.2; opacity: .7; }
.sim-drizzle { stroke: #3f7fa7; stroke-width: 1; stroke-dasharray: 2 4; opacity: .7; }
[data-theme="dark"] .sim-rain, [data-theme="dark"] .sim-drizzle { stroke: #8fc3e0; }
.sim-axis { fill: var(--ink-soft); font-size: 10.5px; }
.sim-mast { stroke: var(--ink); stroke-width: 1.5; }
.sim-station { fill: var(--amber); }
.sim-baro { fill: none; stroke: var(--ink); stroke-width: 2; }
.sim-baro-dot { fill: var(--amber); stroke: var(--surface, #fff); stroke-width: 2; }
.sim-baro-now { stroke: var(--amber); stroke-width: 1; }
.sim-baro-zero { stroke: var(--ink-soft); stroke-dasharray: 3 3; }
.sim-air-t { paint-order: stroke; stroke: var(--surface-2, #f3f1e9); stroke-width: 3px; stroke-linejoin: round; }
@media (max-width: 640px) {
	.sim-section .sim-lbl, .sim-section .sim-ref-t, .sim-section .sim-std-t, .sim-section .sim-air-t, .sim-section .sim-cloud-t { font-size: 17px; }
	.sim-section .sim-axis { font-size: 15px; }
}

/* ---------- Przybornik: lista (Zacznij od, kafelki) ---------- */
.gl-cat { font: 700 10.5px var(--font-body); letter-spacing: .07em; text-transform: uppercase; color: var(--amber-dark); }
.pz-start { margin: 26px 0 4px; }
.pz-feat { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pz-feat-card { position: relative; display: flex; flex-direction: column; gap: 5px; padding: 20px 20px 22px; background: var(--navy-950, #0b1420); color: #e8e6dd; border: 1px solid #22364d; border-top: 3px solid var(--amber); text-decoration: none; transition: border-color .15s; }
.pz-feat-card:hover { border-color: var(--amber); }
.pz-feat-card .gl-ic { background: transparent; border-color: #3a506b; color: var(--amber); width: 46px; height: 46px; margin-bottom: 8px; }
.pz-feat-card .gl-title { font-size: 17px; color: #fff; }
.pz-feat-card .gl-desc { color: #b9c2cc; -webkit-line-clamp: 3; }
.pz-feat-go { position: absolute; right: 16px; top: 22px; color: var(--amber); transition: transform .15s; }
.pz-feat-card:hover .pz-feat-go { transform: translateX(3px); }
.pz-related { margin-top: 12px; }

/* ---------- Przybornik: strona narzędzia ---------- */
.tool-app:has(> .tool-form[data-calc]) { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 0 28px; align-items: start; }
.tool-app:has(> .tool-form[data-calc]) > .tool-form { grid-column: 1; grid-row: 1; }
.tool-app:has(> .tool-form[data-calc]) > .tool-result { grid-column: 2; grid-row: 1; margin: 0; padding: 16px 18px 18px; background: var(--paper-dim, #f3f1ea); border: 1px solid var(--paper-line); border-left: 3px solid var(--amber); min-height: 180px; position: sticky; top: 84px; scroll-margin-top: 90px; }
.tool-app:has(> .tool-form[data-calc]) > .tool-result::before { content: 'Wynik'; display: block; margin-bottom: 10px; font: 700 10.5px var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--amber-dark); }
.tool-app:has(> .tool-form[data-calc]) .tool-fields { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }

.pz-toc { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -12px 0 30px; padding-bottom: 18px; border-bottom: 1px solid var(--paper-line); }
.pz-toc-l { font: 700 10.5px var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); margin-right: 4px; }
.pz-toc a { padding: 6px 12px; border: 1px solid var(--paper-line); background: var(--surface, #fff); color: var(--ink); font-size: 13px; text-decoration: none; }
.pz-toc a:hover { border-color: var(--amber); color: var(--amber-dark); }
.tools-wrap .guide-body h2, .tools-wrap .guide-faq { scroll-margin-top: 84px; }

.pz-cta-tag { font: 700 10.5px var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--amber); margin-bottom: 6px; }
.pz-cta-act { display: flex; flex-direction: column; align-items: stretch; gap: 10px; text-align: center; }
.pz-cta-link { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; color: #e8e6dd; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 900px) {
	.tool-app:has(> .tool-form[data-calc]) { display: block; }
	.tool-app:has(> .tool-form[data-calc]) > .tool-result { position: static; margin-top: 18px; min-height: 0; }
	.pz-feat { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
	.pz-toc { flex-wrap: nowrap; overflow-x: auto; margin-right: -16px; padding-right: 16px; scrollbar-width: none; }
	.pz-toc::-webkit-scrollbar { display: none; }
	.pz-toc a { white-space: nowrap; }
	.pz-toc-l { white-space: nowrap; }
}