/*
 * PixelMags Free Tools (tools.css)
 * Styles for the UI built by assets/js/tools.js. Every class is prefixed pmt-.
 * Colours, radii and fonts come from the theme's --pm-* custom properties.
 * Buttons use the theme's .pm-btn classes; form fields inherit the theme's
 * body.pm-site field styles (the rules below are low-specificity fallbacks).
 */

.pmt-root {
	font-family: var(--pm-font);
	color: var(--pm-text);
	font-size: 15px;
	line-height: 1.5;
	min-width: 0;
	max-width: 100%;
}

.pmt-root *,
.pmt-root *::before,
.pmt-root *::after {
	box-sizing: border-box;
}

.pmt-root [hidden] {
	display: none !important;
}

.pmt-root canvas,
.pmt-root img {
	max-width: 100%;
}

.pmt-sr-only,
.pmt-file-input {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.pmt-root :focus-visible {
	outline: 2px solid var(--pm-accent);
	outline-offset: 2px;
}

/* ---------- Drop zone ---------- */

.pmt-drop {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 40px 20px;
	text-align: center;
	background: var(--pm-bg-alt);
	border: 1px dashed var(--pm-border-strong);
	border-radius: var(--pm-radius);
	cursor: pointer;
	transition: border-color 150ms ease, background-color 150ms ease;
}

.pmt-drop:hover,
.pmt-is-dragging .pmt-drop,
.pmt-drop.pmt-is-dragging {
	border-color: var(--pm-accent);
	background: var(--pm-accent-soft);
}

.pmt-icon {
	display: inline-flex;
	color: var(--pm-accent);
}

.pmt-drop-title {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
	color: var(--pm-heading);
}

.pmt-drop-hint {
	margin: 0;
	font-size: 13px;
	color: var(--pm-muted);
	max-width: 46ch;
}

.pmt-drop--compact {
	flex-direction: row;
	flex-wrap: wrap;
	padding: 14px 16px;
	gap: 8px 14px;
}

.pmt-drop--compact .pmt-icon {
	display: none;
}

.pmt-drop--compact .pmt-drop-title {
	font-size: 15px;
}

.pmt-drop--mini {
	flex-direction: row;
	flex-wrap: wrap;
	padding: 12px 14px;
	gap: 8px 12px;
	margin-bottom: 8px;
}

/* ---------- Status messages ---------- */

.pmt-status:empty {
	display: none;
}

.pmt-status {
	margin: 16px 0 0;
	padding: 10px 14px;
	font-size: 14px;
	border: 1px solid var(--pm-border);
	border-left-width: 3px;
	border-radius: var(--pm-radius-sm);
	background: var(--pm-surface);
	color: var(--pm-text);
	overflow-wrap: anywhere;
}

.pmt-status--busy,
.pmt-status--info {
	border-left-color: var(--pm-accent);
}

.pmt-status--success {
	border-left-color: var(--pm-success);
}

.pmt-status--warn {
	border-left-color: var(--pm-warning);
}

.pmt-status--error {
	border-left-color: var(--pm-danger);
	color: var(--pm-danger);
}

.pmt-is-busy .pmt-stage {
	opacity: 0.6;
	transition: opacity 150ms ease;
}

.pmt-is-busy {
	cursor: progress;
}

/* ---------- Workspace layout ---------- */

.pmt-workspace {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 24px;
	margin-top: 20px;
	align-items: start;
}

.pmt-main,
.pmt-side {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.pmt-panel {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 20px;
	background: var(--pm-surface);
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius);
}

.pmt-panel:empty {
	display: none;
}

.pmt-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.pmt-actions .pm-btn {
	flex: 1 1 auto;
	justify-content: center;
}

.pmt-btn-row,
.pmt-inline-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

@media (max-width: 860px) {
	.pmt-workspace {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- File info ---------- */

.pmt-fileinfo:empty {
	display: none;
}

.pmt-meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 1px;
	margin: 0;
	background: var(--pm-border);
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius-sm);
	overflow: hidden;
}

.pmt-meta-item {
	min-width: 0;
	padding: 10px 12px;
	background: var(--pm-surface);
}

.pmt-meta dt {
	margin: 0;
	font-size: 12px;
	color: var(--pm-muted);
}

.pmt-meta dd {
	margin: 2px 0 0;
	font-size: 14px;
	font-weight: 500;
	color: var(--pm-heading);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pmt-meta--stack {
	grid-template-columns: minmax(0, 1fr);
}

.pmt-meta--stack .pmt-meta-item {
	display: flex;
	justify-content: space-between;
	gap: 12px;
}

.pmt-meta--stack dd {
	margin: 0;
	text-align: right;
	white-space: normal;
	overflow-wrap: anywhere;
}

/* ---------- Preview stage ---------- */

.pmt-checker,
.pmt-stage {
	background-color: var(--pm-surface);
	background-image: repeating-conic-gradient(var(--pm-bg-alt) 0% 25%, var(--pm-surface) 0% 50%);
	background-size: 20px 20px;
}

.pmt-stage {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 260px;
	padding: 16px;
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius);
	overflow: hidden;
}

.pmt-stage > canvas,
.pmt-stage > img {
	display: block;
	max-width: 100%;
	max-height: 70vh;
	width: auto;
	height: auto;
	box-shadow: 0 0 0 1px var(--pm-border);
}

.pmt-stage--plain {
	display: block;
	padding: 0;
	min-height: 0;
	background: none;
	border: 0;
	border-radius: 0;
	overflow: visible;
}

.pmt-empty {
	margin: 0;
	color: var(--pm-muted);
	font-size: 14px;
}

/* Before / after */

.pmt-compare {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.pmt-compare:empty {
	display: none;
}

@media (max-width: 560px) {
	.pmt-compare {
		grid-template-columns: minmax(0, 1fr);
	}
}

.pmt-figure {
	margin: 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.pmt-figure-body {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 160px;
	padding: 12px;
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius);
	background-color: var(--pm-bg-alt);
	overflow: hidden;
}

.pmt-figure-body.pmt-checker {
	background-color: var(--pm-surface);
}

.pmt-figure-body canvas,
.pmt-figure-body img {
	display: block;
	max-width: 100%;
	max-height: 50vh;
	width: auto;
	height: auto;
}

.pmt-figcap {
	font-size: 13px;
	color: var(--pm-muted);
	overflow-wrap: anywhere;
}

/* ---------- Form fields ---------- */

.pmt-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	margin: 0;
}

.pmt-label {
	font-size: 13px;
	font-weight: 500;
	color: var(--pm-heading);
}

.pmt-label-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
}

.pmt-range-value {
	font-family: var(--pm-mono);
	font-size: 12px;
	color: var(--pm-muted);
	white-space: nowrap;
}

.pmt-hint {
	margin: 0;
	font-size: 12px;
	line-height: 1.45;
	color: var(--pm-muted);
}

/* Low-specificity fallbacks: the theme's body.pm-site field styles win. */
:where(.pmt-root) :where(.pmt-input, .pmt-select, .pmt-textarea) {
	width: 100%;
	min-width: 0;
	padding: 8px 10px;
	font: inherit;
	font-size: 14px;
	color: var(--pm-heading);
	background: var(--pm-surface);
	border: 1px solid var(--pm-border-strong);
	border-radius: var(--pm-radius-sm);
	transition: border-color 150ms ease, box-shadow 150ms ease;
}

:where(.pmt-root) :where(.pmt-input, .pmt-select, .pmt-textarea):focus {
	border-color: var(--pm-accent);
	outline: none;
	box-shadow: 0 0 0 3px var(--pm-accent-soft);
}

.pmt-root .pmt-input,
.pmt-root .pmt-select,
.pmt-root .pmt-textarea {
	width: 100%;
	max-width: 100%;
}

.pmt-textarea {
	resize: vertical;
	min-height: 120px;
}

.pmt-mono,
.pmt-root .pmt-mono {
	font-family: var(--pm-mono);
	font-size: 12px;
	line-height: 1.5;
	word-break: break-all;
}

.pmt-range {
	width: 100%;
	margin: 0;
	accent-color: var(--pm-accent);
	cursor: pointer;
}

.pmt-checkbox {
	width: 16px;
	height: 16px;
	margin: 0;
	accent-color: var(--pm-accent);
	cursor: pointer;
	flex: none;
}

.pmt-field--check {
	flex-direction: row;
	align-items: center;
	gap: 8px;
}

.pmt-field--check label {
	font-size: 14px;
	color: var(--pm-text);
	cursor: pointer;
}

.pmt-color-row {
	display: flex;
	align-items: center;
	gap: 10px;
}

.pmt-color {
	width: 44px;
	height: 34px;
	padding: 2px;
	background: var(--pm-surface);
	border: 1px solid var(--pm-border-strong);
	border-radius: var(--pm-radius-sm);
	cursor: pointer;
	accent-color: var(--pm-accent);
}

.pmt-color-hex {
	font-family: var(--pm-mono);
	font-size: 13px;
	color: var(--pm-muted);
	text-transform: uppercase;
}

.pmt-file-native {
	width: 100%;
	max-width: 100%;
	font-size: 13px;
	color: var(--pm-text);
}

.pmt-row2 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	align-items: end;
}

.pmt-row2--auto {
	grid-template-columns: minmax(0, 240px) minmax(0, 1fr);
}

.pmt-row3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	align-items: end;
}

@media (max-width: 420px) {
	.pmt-row3,
	.pmt-row2--auto {
		grid-template-columns: minmax(0, 1fr);
	}
}

.pmt-group {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.pmt-subhead {
	margin: 4px 0 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--pm-heading);
}

/* Segmented buttons (theme .pm-btn with a pressed state) */

.pmt-seg {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.pmt-root .pmt-seg-btn[aria-pressed="true"] {
	border-color: var(--pm-accent);
	background: var(--pm-accent-soft);
	color: var(--pm-accent-hover);
}

/* ---------- Summaries, badges, notices ---------- */

.pmt-summary {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-top: 12px;
	border-top: 1px solid var(--pm-border);
}

.pmt-summary:empty {
	display: none;
}

.pmt-kv {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 14px;
}

.pmt-kv span {
	color: var(--pm-muted);
}

.pmt-kv strong {
	color: var(--pm-heading);
	font-weight: 600;
	text-align: right;
	overflow-wrap: anywhere;
}

.pmt-badge {
	display: inline-block;
	padding: 1px 8px;
	font-size: 12px;
	font-weight: 600;
	border-radius: 999px;
	border: 1px solid currentColor;
	white-space: nowrap;
}

.pmt-badge--success {
	color: var(--pm-success);
}

.pmt-badge--warning {
	color: var(--pm-warning);
}

.pmt-text-danger {
	color: var(--pm-danger);
}

.pmt-text-warning {
	color: var(--pm-warning);
}

.pmt-notice {
	margin: 0;
	padding: 12px 14px;
	font-size: 14px;
	background: var(--pm-surface);
	border: 1px solid var(--pm-border);
	border-left: 3px solid var(--pm-accent);
	border-radius: var(--pm-radius-sm);
	color: var(--pm-text);
}

.pmt-notice--error,
.pmt-notice--danger {
	border-left-color: var(--pm-danger);
	color: var(--pm-heading);
}

.pmt-notice--danger {
	font-weight: 500;
}

.pmt-notice--success {
	border-left-color: var(--pm-success);
}

.pmt-notice--warning {
	border-left-color: var(--pm-warning);
}

/* ---------- Batch list ---------- */

.pmt-batch {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius);
	background: var(--pm-surface);
	overflow: hidden;
}

.pmt-batch:empty {
	display: none;
}

.pmt-batch-item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	padding: 12px 16px;
	margin: 0;
	border-top: 1px solid var(--pm-border);
}

.pmt-batch-item:first-child {
	border-top: 0;
}

.pmt-batch-item.pmt-is-selected {
	background: var(--pm-bg-alt);
}

.pmt-batch-meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1 1 260px;
}

.pmt-batch-name {
	font-size: 14px;
	font-weight: 600;
	color: var(--pm-heading);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pmt-batch-detail {
	font-size: 13px;
	color: var(--pm-muted);
	overflow-wrap: anywhere;
}

.pmt-batch-detail.pmt-text-danger {
	color: var(--pm-danger);
}

.pmt-batch-detail.pmt-text-warning {
	color: var(--pm-warning);
}

.pmt-batch-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

/* ---------- Cropper ---------- */

.pmt-stage--crop {
	padding: 16px;
}

.pmt-crop {
	position: relative;
	display: inline-block;
	max-width: 100%;
	line-height: 0;
	overflow: hidden;
	user-select: none;
	-webkit-user-select: none;
}

.pmt-crop-canvas {
	display: block;
	max-width: 100%;
	max-height: 70vh;
	width: auto;
	height: auto;
}

.pmt-crop-box {
	position: absolute;
	border: 1px solid #fff;
	box-shadow: 0 0 0 1px rgba(10, 10, 11, 0.5), 0 0 0 9999px rgba(10, 10, 11, 0.5);
	cursor: move;
	touch-action: none;
}

.pmt-crop-box:focus-visible {
	outline: 2px solid var(--pm-accent);
	outline-offset: 0;
}

.pmt-crop-grid {
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0.55);
	border-style: solid;
	border-width: 0;
}

.pmt-crop-grid--v {
	top: 0;
	bottom: 0;
	left: 33.333%;
	right: 33.333%;
	border-left-width: 1px;
	border-right-width: 1px;
}

.pmt-crop-grid--h {
	left: 0;
	right: 0;
	top: 33.333%;
	bottom: 33.333%;
	border-top-width: 1px;
	border-bottom-width: 1px;
}

.pmt-crop-handle {
	position: absolute;
	width: 22px;
	height: 22px;
	margin: -11px 0 0 -11px;
	touch-action: none;
}

.pmt-crop-handle::after {
	content: "";
	position: absolute;
	left: 6px;
	top: 6px;
	width: 10px;
	height: 10px;
	background: #fff;
	border: 1px solid var(--pm-accent);
	border-radius: 2px;
}

.pmt-crop-handle--nw { left: 0; top: 0; cursor: nwse-resize; }
.pmt-crop-handle--ne { left: 100%; top: 0; cursor: nesw-resize; }
.pmt-crop-handle--sw { left: 0; top: 100%; cursor: nesw-resize; }
.pmt-crop-handle--se { left: 100%; top: 100%; cursor: nwse-resize; }

@media (pointer: coarse) {
	.pmt-crop-handle {
		width: 32px;
		height: 32px;
		margin: -16px 0 0 -16px;
	}

	.pmt-crop-handle::after {
		left: 10px;
		top: 10px;
		width: 12px;
		height: 12px;
	}
}

/* ---------- Marketplace checker ---------- */

.pmt-check-summary {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--pm-heading);
}

.pmt-checklist {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.pmt-check {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius-sm);
	background: var(--pm-surface);
}

.pmt-check-badge {
	flex: none;
	min-width: 62px;
	padding: 1px 6px;
	font-size: 11px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	border: 1px solid currentColor;
	border-radius: 999px;
}

.pmt-check--pass .pmt-check-badge { color: var(--pm-success); }
.pmt-check--warn .pmt-check-badge { color: var(--pm-warning); }
.pmt-check--fail .pmt-check-badge { color: var(--pm-danger); }
.pmt-check--info .pmt-check-badge { color: var(--pm-muted); }

.pmt-check--fail {
	border-color: var(--pm-danger);
}

.pmt-check-body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	font-size: 13px;
	color: var(--pm-muted);
}

.pmt-check-body strong {
	font-size: 14px;
	font-weight: 600;
	color: var(--pm-heading);
}

.pmt-fix-out {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pmt-fix-out:empty {
	display: none;
}

/* ---------- Colour picker ---------- */

.pmt-pick-wrap {
	position: relative;
	display: inline-block;
	max-width: 100%;
	line-height: 0;
}

.pmt-pick-canvas {
	display: block;
	max-width: 100%;
	max-height: 70vh;
	width: auto;
	height: auto;
	cursor: crosshair;
	touch-action: none;
}

.pmt-pick-marker {
	position: absolute;
	width: 18px;
	height: 18px;
	margin: -9px 0 0 -9px;
	border: 2px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 1px rgba(10, 10, 11, 0.7);
	pointer-events: none;
}

.pmt-loupe-row {
	display: flex;
	gap: 12px;
	align-items: stretch;
}

.pmt-loupe {
	width: 120px;
	height: 120px;
	flex: none;
	border: 1px solid var(--pm-border-strong);
	border-radius: var(--pm-radius-sm);
	image-rendering: pixelated;
}

.pmt-swatch-big {
	flex: 1 1 auto;
	min-height: 120px;
	border: 1px solid var(--pm-border-strong);
	border-radius: var(--pm-radius-sm);
	background: var(--pm-bg-alt);
}

.pmt-values {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.pmt-copy-row {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.pmt-copy-label {
	flex: none;
	width: 34px;
	font-size: 12px;
	font-weight: 600;
	color: var(--pm-muted);
}

.pmt-code {
	flex: 1 1 auto;
	min-width: 0;
	padding: 6px 8px;
	font-family: var(--pm-mono);
	font-size: 13px;
	color: var(--pm-heading);
	background: var(--pm-bg-alt);
	border: 1px solid var(--pm-border);
	border-radius: 6px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pmt-palette-wrap {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pmt-palette-wrap:empty {
	display: none;
}

.pmt-palette {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 10px;
}

.pmt-palette-item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 10px;
	background: var(--pm-surface);
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius-sm);
}

.pmt-palette-swatch {
	display: block;
	width: 100%;
	height: 56px;
	padding: 0;
	border: 1px solid var(--pm-border);
	border-radius: 6px;
	cursor: pointer;
}

.pmt-palette-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
}

.pmt-palette-meta .pmt-code {
	padding: 2px 6px;
	font-size: 12px;
}

/* ---------- Base64 ---------- */

.pmt-tabs {
	margin-bottom: 16px;
}

.pmt-tabs .pmt-label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------- Grid splitter ---------- */

.pmt-tiles {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
}

.pmt-tile {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 10px;
	background: var(--pm-surface);
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius-sm);
}

.pmt-tile-thumb {
	display: block;
	width: 100%;
	height: 110px;
	object-fit: contain;
	background: var(--pm-bg-alt);
	border-radius: 4px;
}

.pmt-tile-meta {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 6px;
	font-size: 14px;
	color: var(--pm-heading);
}

/* ---------- Calculators ---------- */

.pmt-calc {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	align-items: start;
}

@media (max-width: 760px) {
	.pmt-calc {
		grid-template-columns: minmax(0, 1fr);
	}
}

.pmt-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
	padding: 20px;
	background: var(--pm-surface);
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius);
}

.pmt-card--wide {
	grid-column: 1 / -1;
}

.pmt-card-title {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	color: var(--pm-heading);
}

.pmt-ratio-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	gap: 10px;
	align-items: end;
}

.pmt-ratio-sep {
	padding-bottom: 8px;
	font-size: 20px;
	font-weight: 600;
	color: var(--pm-muted);
}

.pmt-result {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 14px 16px;
	background: var(--pm-bg-alt);
	border: 1px solid var(--pm-border);
	border-radius: var(--pm-radius-sm);
}

.pmt-result p {
	margin: 0;
}

.pmt-result-main {
	font-size: 22px;
	line-height: 1.25;
	color: var(--pm-heading);
	overflow-wrap: anywhere;
}

.pmt-result-main strong {
	font-weight: 600;
}

.pmt-result-sub {
	font-size: 14px;
	color: var(--pm-text);
}

.pmt-result .pmt-meta {
	background: var(--pm-border);
}

.pmt-quality {
	padding-left: 10px;
	font-size: 13px;
	border-left: 3px solid var(--pm-border-strong);
}

.pmt-quality--success { border-left-color: var(--pm-success); }
.pmt-quality--warning { border-left-color: var(--pm-warning); }
.pmt-quality--danger { border-left-color: var(--pm-danger); }

/* ---------- Small screens ---------- */

@media (max-width: 480px) {
	.pmt-drop {
		padding: 28px 16px;
	}

	.pmt-panel,
	.pmt-card {
		padding: 16px;
	}

	.pmt-stage {
		min-height: 200px;
		padding: 10px;
	}

	.pmt-batch-item {
		padding: 12px;
	}

	.pmt-meta {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (prefers-reduced-motion: reduce) {
	.pmt-root * {
		transition: none !important;
	}
}