/* RSM Staff Desk. A working screen: dense, plain, and quick to read. */

.rsm-sd {
	font-size: 16px;
	line-height: 1.55;
	color: var(--ink, var(--sdc-ink-171a1f, #171a1f));
}

.rsm-sd .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 8px;
	padding: 10px 16px;
	background: var(--blue, var(--sdc-fill-blue-0055a5, #0055a5));
	color: var(--sdc-on-dark-ffffff, #fff);
	font-size: 15px;
	font-weight: 800;
	cursor: pointer;
	text-decoration: none;
}

.rsm-sd .button.is-plain {
	background: var(--sdc-surface-2-eef1f4, #eef1f4);
	color: var(--sdc-ink-39414a, #39414a);
}

.rsm-sd-bar {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	margin-bottom: 18px;
}

.rsm-sd-bar h2 {
	margin: 0;
	font-size: 24px;
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.rsm-sd-who {
	font-size: 14px;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
}

.rsm-sd-who a,
.rsm-sd-back {
	color: var(--blue, var(--sdc-text-blue-0055a5, #0055a5));
	font-weight: 800;
	margin-left: 10px;
}

/* Sign in. */

.rsm-sd-login {
	max-width: 420px;
	margin: 0 auto;
	border: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	border-radius: var(--radius-sm, 11px);
	background: var(--sdc-surface-ffffff, #fff);
	padding: 26px 28px;
}

.rsm-sd-login h2 { margin: 0 0 16px; font-size: 22px; }

.rsm-sd-login label {
	display: block;
	font-size: 14px;
	font-weight: 800;
	margin: 0 0 6px;
}

.rsm-sd-login input[type="text"],
.rsm-sd-login input[type="password"] {
	width: 100%;
	height: 46px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 0 12px;
	font-size: 16px;
}

.rsm-sd-help {
	font-size: 14px;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
	margin: 10px 0 0;
}

.rsm-sd-error,
.rsm-sd-flash.is-error {
	border-left: 4px solid var(--sdc-line-orange-a4341a, #a4341a);
	background: var(--sdc-surface-fdf3f1, #fdf3f1);
	padding: 10px 14px;
	margin: 0 0 14px;
	font-size: 15px;
}

.rsm-sd-flash.is-ok {
	border-left: 4px solid var(--sdc-line-green-18864b, #18864b);
	background: var(--sdc-surface-f1faf4, #f1faf4);
	padding: 10px 14px;
	margin: 0 0 14px;
	font-size: 15px;
}

.rsm-sd-blocked {
	border: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	border-radius: var(--radius-sm, 11px);
	padding: 26px;
	text-align: center;
}

/* Filters. */

.rsm-sd-filters {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 0 0 16px;
}

.rsm-sd-filters input[type="search"] {
	flex: 1 1 260px;
	height: 44px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 0 12px;
	font-size: 16px;
}

.rsm-sd-filters select {
	height: 44px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 0 10px;
	background: var(--sdc-surface-ffffff, #fff);
	font-size: 15px;
}

/* Tables. */

.rsm-sd-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.rsm-sd-table th,
.rsm-sd-table td {
	text-align: left;
	padding: 11px 12px;
	border-bottom: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	vertical-align: top;
}

.rsm-sd-table thead th {
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
}

.rsm-sd-right { text-align: right; }

.rsm-sd-table tfoot .is-grand th,
.rsm-sd-table tfoot .is-grand td {
	border-top: 2px solid var(--ink, var(--sdc-line-dark-171a1f, #171a1f));
	font-size: 17px;
	font-weight: 900;
}

.rsm-sd-sub {
	display: block;
	font-size: 13px;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
}

.rsm-sd-status {
	display: inline-block;
	border-radius: 999px;
	padding: 3px 10px;
	font-size: 12px;
	font-weight: 900;
	background: var(--sdc-surface-2-eef1f4, #eef1f4);
	color: var(--sdc-ink-39414a, #39414a);
	white-space: nowrap;
}

.rsm-sd-status.is-processing { background: var(--sdc-surface-2-dceafa, #dceafa); color: var(--sdc-text-blue-0b3f75, #0b3f75); }
.rsm-sd-status.is-completed  { background: var(--sdc-surface-2-d7ecdd, #d7ecdd); color: var(--sdc-text-green-14532d, #14532d); }
.rsm-sd-status.is-on-hold    { background: var(--sdc-fill-yellow-f6e6ad, #f6e6ad); color: var(--sdc-text-orange-6b5514, #6b5514); }
.rsm-sd-status.is-cancelled,
.rsm-sd-status.is-failed     { background: var(--sdc-surface-2-eee1dd, #eee1dd); color: var(--sdc-text-orange-7a2f18, #7a2f18); }

.rsm-sd-flag {
	display: inline-block;
	border-radius: 999px;
	padding: 2px 9px;
	font-size: 12px;
	font-weight: 800;
	background: var(--sdc-fill-yellow-f6e6ad, #f6e6ad);
	color: var(--sdc-text-orange-6b5514, #6b5514);
}

.rsm-sd-pages {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	margin: 16px 0 0;
}

.rsm-sd-pages a {
	border: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	border-radius: 7px;
	padding: 7px 12px;
	font-size: 14px;
	font-weight: 800;
	color: var(--blue, var(--sdc-text-blue-0055a5, #0055a5));
}

.rsm-sd-pages a.is-here {
	background: var(--blue, var(--sdc-fill-blue-0055a5, #0055a5));
	border-color: var(--blue, var(--sdc-line-blue-0055a5, #0055a5));
	color: var(--sdc-on-dark-ffffff, #fff);
}

/* One order. */

.rsm-sd-cols {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(260px, .9fr);
	gap: 18px;
	align-items: start;
}

.rsm-sd-card {
	border: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	border-radius: var(--radius-sm, 11px);
	background: var(--sdc-surface-ffffff, #fff);
	padding: 18px 20px;
	margin: 0 0 16px;
}

.rsm-sd-card h3 { margin: 0 0 12px; font-size: 18px; }
.rsm-sd-card h4 {
	margin: 16px 0 4px;
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
}

.rsm-sd-card address { font-style: normal; font-size: 15px; line-height: 1.55; }

.rsm-sd-dl { margin: 0; }

.rsm-sd-dl > div {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	border-bottom: 1px solid var(--sdc-line-f0f3f6, #f0f3f6);
}

.rsm-sd-dl dt { margin: 0; font-size: 14px; color: var(--muted, var(--sdc-ink-2-656d77, #656d77)); }
.rsm-sd-dl dd { margin: 0; font-size: 15px; font-weight: 700; text-align: right; }

.rsm-sd-card textarea {
	width: 100%;
	min-height: 80px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 10px 12px;
	font: inherit;
	font-size: 15px;
	margin-bottom: 10px;
}

.rsm-sd-card select {
	height: 44px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 0 10px;
	background: var(--sdc-surface-ffffff, #fff);
	font-size: 15px;
	margin-right: 8px;
	max-width: 100%;
}

.rsm-sd-check {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	margin: 0 0 10px;
}

.rsm-sd-quote {
	border-left: 3px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	padding-left: 12px;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
	font-style: italic;
	margin: 0;
}

.rsm-sd-cancel {
	border-color: var(--sdc-line-orange-e6d6a8, #e6d6a8);
	background: var(--sdc-surface-fdfaf1, #fdfaf1);
}

.rsm-sd-decide {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.rsm-sd-docs {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 0;
}

.rsm-sd-notes {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rsm-sd-notes li {
	border-left: 3px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	padding: 0 0 0 14px;
	margin: 0 0 14px;
}

.rsm-sd-notes li.is-customer { border-left-color: var(--blue, var(--sdc-line-blue-0055a5, #0055a5)); }

.rsm-sd-note-body { font-size: 15px; }
.rsm-sd-note-body p { margin: 0 0 6px; }

.rsm-sd-note-meta {
	font-size: 13px;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.rsm-sd-empty {
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
	font-size: 15px;
}

/* Narrow screens: the desk is used on a phone at the counter. */

@media (max-width: 860px) {
	.rsm-sd-cols { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	.rsm-sd-table thead { display: none; }

	.rsm-sd-table,
	.rsm-sd-table tbody,
	.rsm-sd-table tfoot,
	.rsm-sd-table tr,
	.rsm-sd-table th,
	.rsm-sd-table td {
		display: block;
		width: 100%;
	}

	.rsm-sd-table tbody tr {
		border: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
		border-radius: 10px;
		padding: 4px 2px;
		margin: 0 0 10px;
	}

	.rsm-sd-table tbody td {
		display: flex;
		justify-content: space-between;
		gap: 14px;
		border-bottom: 0;
		padding: 6px 12px;
	}

	.rsm-sd-table tbody td:before {
		content: attr(data-label);
		font-size: 12px;
		font-weight: 900;
		letter-spacing: .04em;
		text-transform: uppercase;
		color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
		flex: 0 0 auto;
	}

	.rsm-sd-right { text-align: right; }
}

/* Row actions on the list: open the order, or print straight from here. */

.rsm-sd-rowacts {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.rsm-sd-rowacts .rsm-doc-iconlink {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	border-radius: 7px;
	background: var(--sdc-surface-ffffff, #fff);
	color: var(--sdc-text-blue-2b3a4a, #2b3a4a);
}

.rsm-sd-rowacts .rsm-doc-iconlink:hover {
	border-color: var(--blue, var(--sdc-line-blue-0055a5, #0055a5));
	color: var(--blue, var(--sdc-text-blue-0055a5, #0055a5));
	background: var(--sdc-surface-f4f9fd, #f4f9fd);
}

/* The two presses that make up most of a day. */

.rsm-sd-quick {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 12px 0 0;
}

.rsm-sd-quick form {
	margin: 0;
}

.rsm-sd .button.is-go {
	background: var(--green, var(--sdc-fill-green-18864b, #18864b));
}

.rsm-sd .button.is-stop {
	background: var(--sdc-surface-ffffff, #fff);
	border: 1px solid var(--sdc-line-orange-d8bcb3, #d8bcb3);
	color: var(--sdc-text-orange-8a2f16, #8a2f16);
}

.rsm-sd .button.is-stop:hover {
	background: var(--sdc-surface-fdf3f1, #fdf3f1);
}

.rsm-sd-docs .button {
	gap: 8px;
}

.rsm-sd-docs .rsm-doc-icon {
	flex: 0 0 auto;
}

/* Taking an order at the counter. */

.rsm-sd-newform {
	margin: 0;
}

.rsm-sd .button.is-small {
	padding: 6px 12px;
	font-size: 14px;
}

.rsm-sd-results {
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
}

.rsm-sd-results li {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	padding: 10px 0;
	border-bottom: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
}

.rsm-sd-result-name {
	flex: 1 1 220px;
	font-size: 15px;
	font-weight: 700;
}

.rsm-sd-result-price {
	font-size: 15px;
	font-weight: 800;
	white-space: nowrap;
}

.rsm-sd-qty {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
	margin: 0;
}

.rsm-sd-qty input[type="number"] {
	width: 72px;
	height: 40px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 0 8px;
	font: inherit;
	font-size: 15px;
	text-align: center;
}

.rsm-sd-hint {
	font-size: 13px;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
}

/* The address form. */

.rsm-sd-addr {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 0 24px;
}

.rsm-sd-field {
	margin: 0 0 10px;
}

.rsm-sd-field label {
	display: block;
	font-size: 13px;
	font-weight: 800;
	color: var(--muted, var(--sdc-ink-2-656d77, #656d77));
	margin: 0 0 4px;
}

.rsm-sd-field input[type="text"],
.rsm-sd-field input[type="email"],
.rsm-sd-field textarea {
	width: 100%;
	min-height: 42px;
	border: 1px solid var(--sdc-line-d5dce2, #d5dce2);
	border-radius: 8px;
	padding: 8px 10px;
	font: inherit;
	font-size: 15px;
}

/* Customer card. */

.rsm-sd-current {
	font-size: 16px;
	margin: 0 0 10px;
}

.rsm-sd-guest {
	margin: 0 0 10px;
}

.rsm-sd-newcust {
	border-top: 1px solid var(--line, var(--sdc-line-e4e8ed, #e4e8ed));
	padding-top: 12px;
	margin-top: 6px;
}

.rsm-sd-newcust > summary {
	cursor: pointer;
	font-size: 15px;
	font-weight: 800;
	color: var(--blue, var(--sdc-text-blue-0055a5, #0055a5));
	margin-bottom: 10px;
}

/* The bin. */

.rsm-sd-danger {
	border-color: var(--sdc-line-orange-e2c8c0, #e2c8c0);
	background: var(--sdc-surface-fdf7f5, #fdf7f5);
}

.rsm-sd-danger h3 {
	color: var(--sdc-text-orange-8a2f16, #8a2f16);
}

/* ---------------------------------------------------------------------------
 * Width
 *
 * The desk sits inside the theme's content column, which is 1240px wide with a
 * gutter, and that is right for a shop front and cramped for a working screen
 * with two columns of cards in it. This breaks out of the column and centres
 * the desk in the window instead.
 *
 * The formula is the ordinary full-bleed one: the parent is centred in the
 * viewport, so 100% of the parent starts at the same centre line, and a
 * negative margin of half the difference on each side pulls the desk out
 * evenly. No transform, because a transform would become the containing block
 * for anything sticky inside it, and the summary column is sticky.
 *
 * 40px is taken off the viewport rather than nothing, so there is a gutter,
 * and it is more than a scrollbar is wide, so the page never gains a sideways
 * scrollbar of its own.
 * ------------------------------------------------------------------------- */

.rsm-sd-wrap {
	--sd-max: 1560px;
}

.rsm-sd-wrap.is-wide {
	/* max() keeps the desk from ever ending up narrower than the column it
	   broke out of, which it otherwise is between about 860 and 1280 pixels,
	   where the theme's 36px gutter is tighter than this 40px one. */
	--sd-w: min( var( --sd-max ), max( 100%, calc( 100vw - 40px ) ) );
	width: var( --sd-w );
	margin-left: calc( ( 100% - var( --sd-w ) ) / 2 );
	margin-right: calc( ( 100% - var( --sd-w ) ) / 2 );
}

/* Wider means the order screen can afford a proper summary column rather than
   a squeezed one. Only above the width where the two columns exist at all. */
@media (min-width: 1100px) {
	.rsm-sd-wrap.is-wide .rsm-sd-cols {
		grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
		gap: 24px;
	}
}

/* Below the point where the breakout is any use, hand the width back to the
   theme rather than fighting it for a few pixels. */
@media (max-width: 860px) {
	.rsm-sd-wrap.is-wide {
		width: auto;
		margin-left: 0;
		margin-right: 0;
	}
}

/* ---------------------------------------------------------------------------
 * Working
 *
 * While a section is being fetched the desk is dimmed a little and pointer
 * events are turned off, so a second press cannot land on a control that is
 * about to be replaced. Kept deliberately quiet: a spinner over the whole
 * desk for a change that takes 200ms reads as slower than no spinner at all.
 * ------------------------------------------------------------------------- */

.rsm-sd-wrap.is-busy [data-sd-region] {
	opacity: .55;
	pointer-events: none;
	transition: opacity .12s linear;
}

.rsm-sd-wrap.is-busy {
	cursor: progress;
}

.rsm-sd .button.is-busy {
	opacity: .7;
}

/* The live region. Announced, never seen. */
.rsm-sd-say {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* Focus has to be visible: after a section is replaced the keyboard is moved
   to whatever went wrong, and it needs to be obvious where it went. */
.rsm-sd-flash:focus {
	outline: 3px solid var(--blue, var(--sdc-line-blue-0055a5, #0055a5));
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.rsm-sd-wrap.is-busy [data-sd-region] {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Colour tokens, light and dark.
 *
 * The light value of each token is the literal that used to be written where
 * its var() now sits, so with no appearance chosen this file paints exactly
 * what it painted before. The dark value is derived from the light one by a
 * rule that depends on what the colour is for, so the structure of the palette
 * survives the crossing instead of flattening into three greys.
 *
 * Generated. Change a colour here, not in the rules below, or the pair comes
 * apart.
 * ------------------------------------------------------------------------ */

:root {


	/* Paper. The whiter it was, the deeper it goes, so a panel that sat a shade off white ends up a shade off the page instead of merging into it. */
	--sdc-surface-f1faf4: #f1faf4;
	--sdc-surface-f4f9fd: #f4f9fd;
	--sdc-surface-fdf3f1: #fdf3f1;
	--sdc-surface-fdf7f5: #fdf7f5;
	--sdc-surface-fdfaf1: #fdfaf1;
	--sdc-surface-ffffff: #fff;

	/* Paper one step down, wells and inset rows. */
	--sdc-surface-2-d7ecdd: #d7ecdd;
	--sdc-surface-2-dceafa: #dceafa;
	--sdc-surface-2-eee1dd: #eee1dd;
	--sdc-surface-2-eef1f4: #eef1f4;

	/* Text. Inverts and keeps its order, so a heading still outranks the line under it. */
	--sdc-ink-171a1f: #171a1f;
	--sdc-ink-39414a: #39414a;

	/* Secondary text. */
	--sdc-ink-2-656d77: #656d77;

	/* Text that was already light on a dark band. Nothing to do. */
	--sdc-on-dark-ffffff: #fff;

	/* Rules and borders. */
	--sdc-line-d5dce2: #d5dce2;
	--sdc-line-e4e8ed: #e4e8ed;
	--sdc-line-f0f3f6: #f0f3f6;

	/* Rules on dark bands. */
	--sdc-line-dark-171a1f: #171a1f;

	/* Brand blue as text. #0055A5 on near black is 2.2:1, which is not text. Lifted it is 7.5:1 and still the brand. */
	--sdc-text-blue-0055a5: #0055a5;
	--sdc-text-blue-0b3f75: #0b3f75;
	--sdc-text-blue-2b3a4a: #2b3a4a;

	/* Brand blue as a fill, kept dark enough for white to sit on it. */
	--sdc-fill-blue-0055a5: #0055a5;

	/* Brand blue as a rule. */
	--sdc-line-blue-0055a5: #0055a5;

	/* Brand orange as text. */
	--sdc-text-orange-6b5514: #6b5514;
	--sdc-text-orange-7a2f18: #7a2f18;
	--sdc-text-orange-8a2f16: #8a2f16;

	/* Brand orange as a rule. */
	--sdc-line-orange-a4341a: #a4341a;
	--sdc-line-orange-d8bcb3: #d8bcb3;
	--sdc-line-orange-e2c8c0: #e2c8c0;
	--sdc-line-orange-e6d6a8: #e6d6a8;

	/* Success text. */
	--sdc-text-green-14532d: #14532d;

	/* Success fills. */
	--sdc-fill-green-18864b: #18864b;

	/* Success rules. */
	--sdc-line-green-18864b: #18864b;

	/* A number plate is yellow with a blue band in any light. These do not move. */
	--sdc-fill-yellow-f6e6ad: #f6e6ad;
}

:root[data-theme="dark"] {


	/* Paper. The whiter it was, the deeper it goes, so a panel that sat a shade off white ends up a shade off the page instead of merging into it. */
	--sdc-surface-f1faf4: #1d221f;
	--sdc-surface-f4f9fd: #1a1d1f;
	--sdc-surface-fdf3f1: #201d1c;
	--sdc-surface-fdf7f5: #1e1b1a;
	--sdc-surface-fdfaf1: #201f1c;
	--sdc-surface-ffffff: #141617;

	/* Paper one step down, wells and inset rows. */
	--sdc-surface-2-d7ecdd: #2c3a30;
	--sdc-surface-2-dceafa: #2a3037;
	--sdc-surface-2-eee1dd: #382e2a;
	--sdc-surface-2-eef1f4: #2a3037;

	/* Text. Inverts and keeps its order, so a heading still outranks the line under it. */
	--sdc-ink-171a1f: #d8dbe0;
	--sdc-ink-39414a: #c0c6cd;

	/* Secondary text. */
	--sdc-ink-2-656d77: #acb2b9;

	/* Text that was already light on a dark band. Nothing to do. */
	--sdc-on-dark-ffffff: #fff;

	/* Rules and borders. */
	--sdc-line-d5dce2: #3d4750;
	--sdc-line-e4e8ed: #373e48;
	--sdc-line-f0f3f6: #323a41;

	/* Rules on dark bands. */
	--sdc-line-dark-171a1f: #353c47;

	/* Brand blue as text. #0055A5 on near black is 2.2:1, which is not text. Lifted it is 7.5:1 and still the brand. */
	--sdc-text-blue-0055a5: #52abff;
	--sdc-text-blue-0b3f75: #61a7f0;
	--sdc-text-blue-2b3a4a: #6aa6e7;

	/* Brand blue as a fill, kept dark enough for white to sit on it. */
	--sdc-fill-blue-0055a5: #006fd8;

	/* Brand blue as a rule. */
	--sdc-line-blue-0055a5: #0074e1;

	/* Brand orange as text. */
	--sdc-text-orange-6b5514: #edc75a;
	--sdc-text-orange-7a2f18: #ed7c5a;
	--sdc-text-orange-8a2f16: #ed795a;

	/* Brand orange as a rule. */
	--sdc-line-orange-a4341a: #c03d1e;
	--sdc-line-orange-d8bcb3: #d17c61;
	--sdc-line-orange-e2c8c0: #d17b61;
	--sdc-line-orange-e6d6a8: #d1b461;

	/* Success text. */
	--sdc-text-green-14532d: #5ccc88;

	/* Success fills. */
	--sdc-fill-green-18864b: #18864b;

	/* Success rules. */
	--sdc-line-green-18864b: #1a9151;

	/* A number plate is yellow with a blue band in any light. These do not move. */
	--sdc-fill-yellow-f6e6ad: #413816;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {


		/* Paper. The whiter it was, the deeper it goes, so a panel that sat a shade off white ends up a shade off the page instead of merging into it. */
		--sdc-surface-f1faf4: #1d221f;
		--sdc-surface-f4f9fd: #1a1d1f;
		--sdc-surface-fdf3f1: #201d1c;
		--sdc-surface-fdf7f5: #1e1b1a;
		--sdc-surface-fdfaf1: #201f1c;
		--sdc-surface-ffffff: #141617;

		/* Paper one step down, wells and inset rows. */
		--sdc-surface-2-d7ecdd: #2c3a30;
		--sdc-surface-2-dceafa: #2a3037;
		--sdc-surface-2-eee1dd: #382e2a;
		--sdc-surface-2-eef1f4: #2a3037;

		/* Text. Inverts and keeps its order, so a heading still outranks the line under it. */
		--sdc-ink-171a1f: #d8dbe0;
		--sdc-ink-39414a: #c0c6cd;

		/* Secondary text. */
		--sdc-ink-2-656d77: #acb2b9;

		/* Text that was already light on a dark band. Nothing to do. */
		--sdc-on-dark-ffffff: #fff;

		/* Rules and borders. */
		--sdc-line-d5dce2: #3d4750;
		--sdc-line-e4e8ed: #373e48;
		--sdc-line-f0f3f6: #323a41;

		/* Rules on dark bands. */
		--sdc-line-dark-171a1f: #353c47;

		/* Brand blue as text. #0055A5 on near black is 2.2:1, which is not text. Lifted it is 7.5:1 and still the brand. */
		--sdc-text-blue-0055a5: #52abff;
		--sdc-text-blue-0b3f75: #61a7f0;
		--sdc-text-blue-2b3a4a: #6aa6e7;

		/* Brand blue as a fill, kept dark enough for white to sit on it. */
		--sdc-fill-blue-0055a5: #006fd8;

		/* Brand blue as a rule. */
		--sdc-line-blue-0055a5: #0074e1;

		/* Brand orange as text. */
		--sdc-text-orange-6b5514: #edc75a;
		--sdc-text-orange-7a2f18: #ed7c5a;
		--sdc-text-orange-8a2f16: #ed795a;

		/* Brand orange as a rule. */
		--sdc-line-orange-a4341a: #c03d1e;
		--sdc-line-orange-d8bcb3: #d17c61;
		--sdc-line-orange-e2c8c0: #d17b61;
		--sdc-line-orange-e6d6a8: #d1b461;

		/* Success text. */
		--sdc-text-green-14532d: #5ccc88;

		/* Success fills. */
		--sdc-fill-green-18864b: #18864b;

		/* Success rules. */
		--sdc-line-green-18864b: #1a9151;

		/* A number plate is yellow with a blue band in any light. These do not move. */
		--sdc-fill-yellow-f6e6ad: #413816;
	}
}