.csh-public {
	--color-bg: #f3f2f2;
	--color-surface: #eae9e9;
	--color-text: #201e1d;
	--color-accent: #f40009;
	--color-accent-100: #fde3e2;
	--color-accent-400: #f74c47;
	--color-accent-600: #d10008;
	--color-accent-700: #ac0007;
	--color-accent-800: #780005;
	--color-neutral-100: #f8f4f4;
	--color-neutral-200: #eae7e7;
	--color-neutral-300: #d7d3d3;
	--color-neutral-400: #bab6b6;
	--color-neutral-600: #7d7979;
	--color-neutral-700: #605d5d;
	--color-neutral-800: #444141;
	--color-neutral-900: #2d2b2b;
	--color-divider: color-mix(in srgb, #201e1d 40%, transparent);
	--font-heading: var(--csh-font-narrow);
	--font-body: var(--csh-font);
	--font-heading-weight: 800;
	--radius-md: 0;
	width: 100%;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
}

.csh-public.csh-public--search {
	min-height: 0;
	background: linear-gradient(to right, #ffffff 0 50%, var(--color-bg) 50% 100%);
}

.csh-public--search .csh-reference-search {
	min-height: 0 !important;
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 40px !important;
}

.csh-public--search .csh-reference-search__features {
	width: min(560px, 100%);
	padding-left: 0 !important;
	justify-self: end;
}

@media (min-width: 761px) {
	.csh-public--search .csh-reference-search {
		padding-top: 78px !important;
	}

	.csh-reference-report__content {
		padding-top: 128px !important;
	}

}

.csh-public h1,
.csh-public h2,
.csh-public h3,
.csh-public h4,
.csh-public h5,
.csh-public h6 {
	font-family: var(--font-heading);
	font-weight: var(--font-heading-weight);
	line-height: 1.12;
	letter-spacing: -.015em;
}

.csh-public a { color: var(--color-accent-700); text-decoration: none; }
.csh-public a:hover { color: var(--color-accent); }

.csh-public-kicker {
	margin: 0;
	color: var(--color-accent);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.csh-public-kicker__normal-case { font-weight: 400; text-transform: none; }

.csh-public .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 8px 14.4px;
	border: 1px solid transparent;
	border-radius: 8px !important;
	background: transparent;
	color: var(--color-text);
	font-family: var(--font-heading);
	font-size: 14px;
	font-weight: var(--font-heading-weight);
	line-height: 1.2;
	text-decoration: none;
}

.csh-public .btn-primary { background: var(--color-accent); color: var(--color-bg); }
.csh-public .btn-primary:hover { background: var(--color-accent-600); color: var(--color-bg); }
.csh-public .btn-secondary { border-color: var(--color-divider); }
.csh-public .btn-secondary:hover { background: color-mix(in srgb, var(--color-text) 7%, transparent); }

.csh-public .input {
	width: 100%;
	min-height: 36px;
	padding: 6px 10px;
	border: 1px solid var(--color-divider);
	border-radius: 8px !important;
	background: var(--color-surface);
	color: var(--color-text);
	caret-color: var(--color-accent);
}

.csh-public .input:hover { border-color: color-mix(in srgb, var(--color-text) 45%, transparent); }
.csh-public .input:focus-visible { border-color: var(--color-accent); outline-offset: 0; }

.csh-public .table { width: 100%; border-collapse: collapse; font-size: 14px; }
.csh-public .table th {
	padding: 8px;
	border-bottom: 2px solid var(--color-divider);
	color: color-mix(in srgb, var(--color-text) 60%, transparent);
	font-size: 11px;
	letter-spacing: .08em;
	text-align: left;
	text-transform: uppercase;
}
.csh-public .table td { padding: 8px; border-bottom: 1px solid var(--color-divider); }
.csh-public .table tbody tr:hover { background: color-mix(in srgb, var(--color-text) 4%, transparent); }

.csh-report { padding: 0 0 64px; }

.csh-reference-report__content {
	padding-bottom: 128px;
	width: 100%;
	max-width: 1440px;
	margin-right: auto;
	margin-left: auto;
}

.csh-reference-report__photo {
	display: grid;
	place-items: center;
	background: repeating-linear-gradient(45deg, var(--color-neutral-800) 0 8px, var(--color-neutral-700) 8px 16px);
	color: var(--color-neutral-300);
	font-family: ui-monospace, monospace;
	font-size: 10px;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.csh-reference-report__photo img { width: 100%; height: 100%; object-fit: cover; }
.csh-public-photo-gallery { margin-bottom: 48px; padding-top: 16px; border-top: 2px solid var(--color-text); }
.csh-public-photo-gallery h2 { margin: 0 0 16px; font-size: 20px; }
.csh-public-photo-gallery__strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; overflow: visible; }
.csh-public-photo-gallery__strip img { display: block; width: 100%; min-width: 0; aspect-ratio: 4 / 3; object-fit: cover; }

/* A photograph in the strip opens on its own, as large as the screen
   allows. The cover picture at the top is left alone. */
.csh-public-photo-gallery__shot { display: block; width: 100%; min-width: 0; padding: 0; border: 0; background: none; cursor: zoom-in; }
.csh-public-photo-gallery__shot:focus-visible { outline: 2px solid var(--color-accent-700); outline-offset: 2px; }

.csh-photo-viewer { width: min(92vw, 1024px); max-width: 92vw; max-height: 92vh; padding: 0; border: 0; background: none; overflow: visible; }
.csh-photo-viewer::backdrop { background: rgba(0, 0, 0, .82); }
.csh-photo-viewer__shot { display: block; width: 100%; max-height: 92vh; object-fit: contain; cursor: zoom-out; }
/* The cross sits on the photograph itself, top right. Beside it, above or
   below, it would be pushed off a telephone screen by a tall photograph. */
.csh-photo-viewer__close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .92);
	color: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}

.csh-photo-viewer__close svg { display: block; }

@media (max-width: 760px) {
	.csh-photo-viewer { width: 96vw; max-width: 96vw; }
}

@media (max-width: 1100px) {
	.csh-public-photo-gallery__strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.csh-report-missing { padding: 64px 48px; }
.csh-report-missing h1 { margin: 16px 0; font-size: 44px; }
.csh-report-missing > p { max-width: 560px; color: var(--color-neutral-700); }
.csh-public-button { display: inline-flex; margin-top: 20px; }

@media (max-width: 760px) {
	.csh-public-photo-gallery__strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.csh-reference-search {
		grid-template-columns: 1fr !important;
		gap: 48px !important;
		padding: 42px 20px !important;
	}
	.csh-reference-search__form-row { flex-direction: column; }

	/* On a telephone the search stands in one column, so the split background
	   and the two-column rule written for a wide screen are taken back. */
	.csh-public.csh-public--search { background: #fff; }
	.csh-public--search .csh-reference-search {
		grid-template-columns: 1fr !important;
		gap: 32px !important;
	}
	.csh-public--search .csh-reference-search__features { width: 100%; justify-self: stretch; }
	.csh-reference-search__features { padding: 28px 0 0 !important; border-top: 2px solid var(--color-divider); border-left: 0 !important; }
	.csh-reference-report__hero { padding: 24px 20px !important; }
	.csh-reference-report__identity { width: 100%; flex-direction: column; }
	.csh-reference-report__photo { width: min(100%, 300px) !important; }
	.csh-reference-report__actions { width: 100%; }
	.csh-reference-report__actions .btn { flex: 1; }
	.csh-reference-report__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	/* The four readings are told in smaller type on a telephone. */
	.csh-reference-report__metrics dd { font-size: 22px !important; }
	.csh-reference-report__metrics dt { font-size: 11px !important; }
	.csh-reference-report__metrics > div { padding: 14px 16px !important; }
	.csh-reference-report__content { grid-template-columns: minmax(0, 1fr) !important; gap: 32px !important; padding: 42px 20px 32px !important; }
	.csh-reference-report__toc { position: static !important; }
	/* A wide table scrolls inside its own section instead of dragging the
	   whole page sideways. */
	.csh-reference-report__content > * { min-width: 0; }
	.csh-reference-report__content section { overflow-x: auto; }
	.csh-reference-insurance { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* The square that carries this page's own address: paper cannot be clicked. */
.csh-print-code { display: none; }

@media print {
	@page { margin: 14mm; }

	/* Ink on paper: no filled areas, and nothing written in white. */
	.csh-public,
	.csh-public * { background: transparent !important; color: #000 !important; box-shadow: none !important; }

	.csh-public a { text-decoration: none; }

	.csh-reference-report__actions,
	.csh-reference-report__toc,
	.csh-copy-vin { display: none !important; }

	.csh-reference-report__hero { padding: 0 0 16px !important; border-bottom: 2px solid #000; }
	.csh-reference-report__photo { width: 46mm !important; }

	/* Photograph, name and square stand on one line, and the name is given
	   the room it needs so the words are not broken apart. */
	.csh-reference-report__hero > div { flex-wrap: nowrap !important; align-items: flex-start !important; gap: 6mm !important; }
	/* A sheet of paper is narrower than 760px, so the rules written for a
	   telephone would otherwise stand the name under the photograph. */
	.csh-reference-report__identity {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		width: auto !important;
		flex-direction: row !important;
		gap: 6mm !important;
	}
	.csh-reference-report__identity h1 { font-size: 28px !important; overflow-wrap: normal !important; word-break: normal !important; }

	.csh-reference-report__metrics { gap: 0 !important; margin: 16px 0 0 !important; }
	.csh-reference-report__metrics > div { padding: 12px 16px 12px 0 !important; }
	.csh-reference-report__metrics dd { font-size: 26px !important; }

	.csh-reference-report__content { display: block !important; padding: 24px 0 !important; }
	.csh-reference-report__content section { break-inside: avoid; }

	.csh-public-photo-gallery__strip { grid-template-columns: repeat(auto-fill, 28mm) !important; gap: 3mm !important; }
	.csh-public-photo-gallery__strip img { width: 28mm !important; height: 21mm !important; }
	.csh-public-photo-gallery__shot { width: 28mm !important; }
	.csh-photo-viewer { display: none !important; }

	/* A table that runs over the fold carries its heading to the next page. */
	.csh-public thead { display: table-header-group; }
	.csh-public tr,
	.csh-public img { break-inside: avoid; }
	.csh-public th,
	.csh-public td { border-color: #000 !important; }

	/* Top right of the first page, where the PDF keeps its own square. */
	.csh-print-code {
		display: block;
		flex: 0 0 auto;
		align-self: flex-start;
		margin-left: auto;
		break-inside: avoid;
	}

	.csh-print-code img { width: 24mm; height: 24mm; }
	.csh-print-code span { display: none; }
}

/* What a part is: the brand, the kind and the place, under its name. */
.csh-part-detail {
	display: inline-block;
	margin-top: 2px;
	color: var(--color-neutral-700, #605d5d);
	font-size: 12px;
}

/* What a visit or a part cost, in lari: it starts under its heading like
   every other column and never breaks from its sign. The column is only
   as wide as a price up to 9,999.00 ₾, the same in the service table and
   in the parts table, so the two line up at the right. */
.csh-public .table .csh-cell-money { width: 85px; white-space: nowrap; text-align: left; font-variant-numeric: tabular-nums; }

/* Under the service and the parts table: the word stands just left of the
   price column and the sum in it. */
.csh-public .table tfoot td { border-bottom: 0; font-weight: 700; }
.csh-public .table .csh-cell-total { text-align: right; }
