:root {
	--li-bg: #FBF6EC;
	--li-ink: #793B40;
	--li-ink-soft: #8C575A;
	--li-line: rgb(121 59 64 / .25);
	--li-line-strong: rgb(121 59 64 / .45);
	--li-accent: #466432;
	--li-arch: #F4BBAD;
	--li-art: rgb(50 18 18 / .85);
	--li-logo: #321212;
	--li-wash: rgb(244 187 173 / .3);
	--li-band-bg: #4C0000;
	--li-band-ink: #FBF6EC;
	--li-band-accent: #C37C2A;
	--li-btn-bg: #793B40;
	--li-btn-ink: #FBF6EC;
	--li-open: #466432;
	--li-soon: #C37C2A;
	--li-closed: #793B40;
}

/* Layout tokens — not part of any colour set */
:root {
	--li-gutter: clamp(20px, 3.9vw, 56px);
	--li-max: 1328px;
	--li-pad: max(var(--li-gutter), calc((100% - var(--li-max)) / 2));
	--lid-gap: 96px;
}

/* Type tokens — Bacalar Ultra Condensed ships one weight, so every display use asks for 400 and forbids
   faked bold. (The ?type=shoulders preview that swapped these tokens was removed in 0.11.2.) */
:root {
	--li-display-weight: 400;
	--li-display-synthesis: none;
	--li-display-tracking: .02em;
	--li-display-scale: 1.2; /* ultra-condensed caps carry less weight than Big Shoulders at the same size */
}

@media (min-width: 960px) {
	:root { --lid-gap: 160px; }
}

/* Sunrise — Sunshine 18 % over Ivory: a pale, luminous morning (the "sunlit" palette, default since 0.3.1) */
.lid-stop-sunrise, body.lid-hour-sunrise .li-page-hero {
	--li-bg: #F4E7C7; /* Sunshine 18 % over Ivory */
	--li-ink: #321212;
	--li-ink-soft: #4B2921;
	--li-line: rgb(50 18 18 / .25);
	--li-line-strong: rgb(50 18 18 / .45);
	--li-accent: #793B40;
	--li-arch: #D7A520; /* Sunshine — the coffee card is the sun */
	--li-art: rgb(50 18 18 / .9);
	--li-logo: #321212;
	--li-wash: rgb(215 165 32 / .18);
	--li-band-bg: #4C0000;
	--li-band-ink: #FBF6EC;
	--li-band-accent: #C37C2A;
	--li-btn-bg: #793B40;
	--li-btn-ink: #FBF6EC;
	--li-open: #466432;
	--li-soon: #8A5A1E;
	--li-closed: #4C0000;
}

/* Afternoon — Sapphire, full strength */
.lid-stop-afternoon, body.lid-hour-afternoon .li-page-hero {
	--li-bg: #184F7D; /* Sapphire, full strength */
	--li-ink: #FBF6EC;
	--li-ink-soft: #E8E1D4;
	--li-line: rgb(251 246 236 / .3);
	--li-line-strong: rgb(251 246 236 / .55);
	--li-accent: #F4BBAD;
	--li-arch: #FBF6EC;
	--li-art: rgb(23 18 15 / .85);
	--li-logo: #FBF6EC;
	--li-wash: rgb(251 246 236 / .08);
	--li-band-bg: #4C0000;
	--li-band-ink: #FBF6EC;
	--li-band-accent: #F4BBAD;
	--li-btn-bg: #FBF6EC;
	--li-btn-ink: #184F7D;
	--li-open: #FBF6EC;
	--li-soon: #FBF6EC;
	--li-closed: #FBF6EC;
}

/* Evening — Maroon, full strength */
.lid-stop-evening, body.lid-hour-evening .li-page-hero, body.lid-day-whole .li-key-bar {
	--li-bg: #4C0000; /* Maroon, full strength — the night runs straight into the footer */
	--li-ink: #FBF6EC;
	--li-ink-soft: #EAD9D2;
	--li-line: rgb(251 246 236 / .3);
	--li-line-strong: rgb(251 246 236 / .55);
	--li-accent: #F4BBAD;
	--li-arch: #793B40; /* Terra panels on Maroon */
	--li-art: rgb(251 246 236 / .7);
	--li-logo: #FBF6EC;
	--li-wash: rgb(251 246 236 / .08);
	--li-band-bg: #793B40; /* Home's night tiles; the footer is outside the stop and stays Maroon */
	--li-band-ink: #FBF6EC;
	--li-band-accent: #F4BBAD;
	--li-btn-bg: #FBF6EC;
	--li-btn-ink: #4C0000;
	--li-open: #FBF6EC;
	--li-soon: #FBF6EC;
	--li-closed: #FBF6EC;
	--li-cube-night: #17120F;
}

/* Events — Grape, the party after martini time (0.10.0, Kiva: "add the same transition from martini time to
   events"); the dome is Shell with Maroon ink, so the queen drawing reads on it. */
.lid-stop-events {
	--li-bg: #6E083B;
	--li-ink: #FBF6EC;
	--li-ink-soft: #F1DDE2;
	--li-line: rgb(251 246 236 / .3);
	--li-line-strong: rgb(251 246 236 / .55);
	--li-accent: #F4BBAD;
	--li-arch: #F4BBAD;
	--li-art: rgb(251 246 236 / .7);
	--li-logo: #FBF6EC;
	--li-wash: rgb(251 246 236 / .08);
	--li-band-bg: #4C0000;
	--li-band-ink: #FBF6EC;
	--li-band-accent: #F4BBAD;
	--li-btn-bg: #FBF6EC;
	--li-btn-ink: #6E083B;
	--li-open: #FBF6EC;
	--li-soon: #FBF6EC;
	--li-closed: #FBF6EC;
}

/* Rooms — Navy, the night sky at the end of the day (0.10.0, Kiva: "do another gradient transition into rooms");
   Home's footer continues it. */
.lid-stop-rooms {
	--li-bg: #0E1D37;
	--li-ink: #FBF6EC;
	--li-ink-soft: #DCDFE6;
	--li-line: rgb(251 246 236 / .3);
	--li-line-strong: rgb(251 246 236 / .55);
	--li-accent: #F4BBAD;
	--li-arch: #184F7D;
	--li-art: rgb(251 246 236 / .7);
	--li-logo: #FBF6EC;
	--li-wash: rgb(251 246 236 / .08);
	--li-band-bg: #0E1D37;
	--li-band-ink: #FBF6EC;
	--li-band-accent: #F4BBAD;
	--li-btn-bg: #FBF6EC;
	--li-btn-ink: #0E1D37;
	--li-open: #FBF6EC;
	--li-soon: #FBF6EC;
	--li-closed: #FBF6EC;
}

.lid-stop-sunrise, .lid-stop-afternoon, .lid-stop-evening, .lid-stop-events, .lid-stop-rooms,
body.lid-hour-sunrise .li-page-hero, body.lid-hour-afternoon .li-page-hero,
body.lid-hour-evening .li-page-hero, body.lid-day-whole .li-key-bar {
	background-color: var(--li-bg);
	color: var(--li-ink);
}

/* Gaps between stops — decorative; the hexes are copies of the neighbouring stops' --li-bg */
.lid-gap {
	height: var(--lid-gap);
	background: linear-gradient(var(--lid-from), var(--lid-to));
}

/* OKLab, not OKLCH, for every blend: OKLCH's hue path put a green band in tan → slate (0.2.2), a pale
   cyan band in slate → ivory and a purple cast in slate → rose (seen 2026-10-09, all four spaces
   compared side by side); OKLab blends straight across in every pair. sRGB stays the no-support fallback. */
@supports (background: linear-gradient(in oklab, red, blue)) {
	.lid-gap { background: linear-gradient(in oklab, var(--lid-from), var(--lid-to)); }
}

/* The lead-in under the tape is a short breath, not a full gap: the page should start, not clear its throat. */
.lid-gap--sunrise { height: calc(var(--lid-gap) * .6); }

.lid-gap--sunrise { --lid-from: #FBF6EC; --lid-to: #F4E7C7; } /* copies: Ivory → sunrise bg */
.lid-gap--afternoon { --lid-from: #F4E7C7; --lid-to: #184F7D; } /* copies: sunrise bg → afternoon bg */
.lid-gap--evening { --lid-from: #184F7D; --lid-to: #4C0000; } /* copies: afternoon bg → evening bg */
.lid-gap--events { --lid-from: #4C0000; --lid-to: #6E083B; } /* copies: evening bg → events bg */
.lid-gap--rooms { --lid-from: #6E083B; --lid-to: #0E1D37; } /* copies: events bg → rooms bg */
.lid-gap--footer { --lid-from: #0E1D37; --lid-to: #0E1D37; } /* copies: rooms bg → Home's band bg (one colour: the night is continuous) */
body.lid-day-whole .li-key-bar { --lid-from: #FBF6EC; --lid-to: #4C0000; } /* copies: Ivory → evening bg (the Cafe + Bar bar room's lead-in) */

body { margin: 0; }
.wp-site-blocks > * { margin-block-start: 0; }

/* Short pages (the 404, a happening) keep the footer at the bottom of the screen, not mid-way up it. */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100svh;
}

.wp-site-blocks > main { flex: 1 0 auto; }

html { background: var(--li-bg); color: var(--li-ink); }

/* html + :is() is (0,0,2): above theme.json's element rule, below any class (the small caps keep theirs). */
html :is(h1, h2, h3, h4, h5, h6) {
	font-weight: var(--li-display-weight);
	font-synthesis: var(--li-display-synthesis);
	letter-spacing: var(--li-display-tracking);
}

html h1 { font-size: calc(var(--wp--preset--font-size--xx-large) * var(--li-display-scale)); }
html h2 { font-size: calc(var(--wp--preset--font-size--x-large) * var(--li-display-scale)); }
html h3 { font-size: calc(27px * var(--li-display-scale)); }

.li-vh {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.li-smallcaps, .is-style-li-smallcaps {
	font-family: var(--wp--preset--font-family--subhead);
	text-transform: uppercase;
	letter-spacing: .3em;
	font-size: 12px;
	font-weight: 400; /* Graduate ships one weight; never let a heading's weight fake-bold it. */
	line-height: 1.6;
	color: var(--li-ink);
}

.li-script, .is-style-li-script {
	font-family: var(--wp--preset--font-family--script);
	font-size: clamp(24px, 2.4vw, 34px);
	line-height: 1.1;
	color: var(--li-accent);
	text-transform: none;
}

.is-style-li-lead { font-size: 18px; max-width: 34em; }

a { text-decoration-color: var(--li-line-strong); text-underline-offset: .18em; }
a:hover { text-decoration-color: currentColor; }

:focus-visible { outline: 2px solid var(--li-ink); outline-offset: 3px; }

[hidden] { display: none !important; }