:root {
  color-scheme: light;
  --paper: #f8f7f2;
  --ink: #30362e;
  --muted: #6d7268;
  --green: #52623e;
  --line: #dedfd4;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--serif); font-size: 15px; line-height: 1.8; -webkit-font-smoothing: antialiased; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; background: radial-gradient(ellipse at 2% 20%, #e8ebdd70, transparent 48%), radial-gradient(ellipse at 100% 85%, #f0e9d880, transparent 44%); pointer-events: none; }
::selection { background: #dce3c8; color: #273022; }
[hidden] { display: none !important; }
a { color: inherit; text-decoration-color: #9aa38c; text-underline-offset: 4px; text-decoration-thickness: 1px; }
a:hover { color: var(--green); text-decoration-color: var(--green); }
a:focus-visible, button:focus-visible, main:focus-visible { outline: 2px solid var(--green); outline-offset: 6px; border-radius: 2px; }
button { font: inherit; color: inherit; }
button:disabled { cursor: wait; }
svg { display: block; width: 18px; height: 18px; }
p, h1, h2, h3, pre { margin: 0; }
#garden { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.page { position: relative; max-width: 1080px; padding: 0 38px; margin: 0 auto; }
.work-section, .play-section, .house-shelter, .site-footer { max-width: 804px; margin-inline: auto; }
.play-section, .house-shelter { position: relative; z-index: 4; }
.skip-link { position: fixed; left: 16px; top: -80px; padding: 8px 16px; background: var(--paper); z-index: 10; }
.skip-link:focus { top: 16px; }
.site-header { position: sticky; top: 0; z-index: 6; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 18px 0; background: #f8f7f2f5; backdrop-filter: blur(8px); border-bottom: 1px solid #dedfd470; }
.home-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; font-family: var(--mono); font-size: 13px; line-height: 1; text-decoration: none; }
.home-mark { font-size: 29px; line-height: 1; color: var(--green); }
nav { display: flex; align-items: center; gap: 27px; font-family: var(--mono); font-size: 12px; }
nav a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; line-height: 1; white-space: nowrap; text-decoration: none; color: var(--muted); }
nav a:hover { text-decoration: underline; }
nav a[aria-current] { color: var(--ink); text-decoration: underline; text-underline-offset: 6px; }
.intro { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 38px; align-items: center; padding: 71px 0 73px; }
.intro-content { grid-column: 1; grid-row: 1; min-width: 0; }
.rain-window { grid-column: 2; grid-row: 1; width: 340px; color: #65796e; text-align: center; pointer-events: none; }
.window-scene { width: 42ch; margin: 0 auto; font: clamp(10px, 2.8vw, 12px)/1.35 var(--mono); }
.rain-window pre { font: inherit; white-space: pre; }
.window-opening { position: relative; }
.rain-pane { position: relative; height: 17.55em; margin: 0 4ch; overflow: hidden; background: #e6ece63b; }
.window-shutter { position: absolute; top: 0; color: #8a907c; }
.window-left { left: 0; }
.window-right { right: 0; }
.window-mullion { position: absolute; top: 0; left: 50%; transform: translateX(-50%); color: #8a907c; }
.window-crossbar { position: absolute; top: 47%; left: 0; color: #8a907c; }
.still-weather { opacity: 0.45; }
[data-rain] .still-weather { opacity: 0; }
.window-lintel, .window-sill { color: #7c856c; }
.window-caption { display: block; font: italic 14px/1.8 var(--serif); margin-top: 15px; color: var(--muted); }
.eyebrow { font-family: var(--mono); font-size: 10px; letter-spacing: 0.055em; color: var(--muted); }
h1 { font-family: var(--serif); font-size: clamp(48px, 8vw, 72px); font-weight: 400; letter-spacing: -3.2px; line-height: 1.12; }
.name-period { color: #8b956c; }
.intro-line { font-family: var(--serif); color: #626c54; font-size: 28px; line-height: 1.4; letter-spacing: -0.5px; margin: 21px 0 27px; }
.intro-copy { max-width: 555px; color: #555d51; }
.intro-copy p + p { margin-top: 13px; }
.intro-copy a { color: var(--ink); }
.social-links { display: flex; flex-wrap: wrap; gap: 24px; padding: 0; margin: 24px 0 0; list-style: none; font-family: var(--mono); font-size: 11px; }
.social-links a { text-decoration: none; }
.social-links a:hover { text-decoration: underline; }
.social-links span { margin-left: 3px; color: var(--muted); }
.garden-note { display: flex; align-items: center; gap: 10px; color: var(--muted); font-family: var(--serif); font-size: 14px; font-style: italic; margin-top: 38px; }
.note-dash { width: 22px; height: 1px; background: #a7af96; }
.section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; padding: 0 0 20px; border-bottom: 1px solid var(--line); }
h2 { font-family: var(--serif); font-weight: 400; font-size: 25px; line-height: 1.35; letter-spacing: -0.5px; }
.work-item { display: grid; grid-template-columns: 152px 1fr; gap: 29px; padding: 30px 0; border-bottom: 1px solid var(--line); }
.work-art { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 178px; border: 1px solid #dfe3d5; border-radius: 3px; background: #ecede4; color: #748162; }
.graph-art { background: #e9edeb; border-color: #dce3df; color: #6d847c; }
.agent-art { background: #e9e9ef; border-color: #dcdce7; color: #79718d; }
.speech-art { background: #eeece2; border-color: #e1ddce; color: #897a5e; }
.art-corner { position: absolute; top: 7px; left: 10px; font-family: var(--mono); font-size: 9px; opacity: 0.8; }
.work-art pre { font-family: var(--mono); font-size: 12px; line-height: 1.35; }
.art-caption { font-family: var(--mono); font-size: 7px; letter-spacing: 0.02em; margin-top: 12px; }
.work-copy { align-self: center; }
.work-copy .eyebrow { font-size: 9px; }
h3 { font-family: var(--serif); font-weight: 400; font-size: 25px; letter-spacing: -0.5px; line-height: 1.35; margin: 7px 0 9px; }
h3 a { text-decoration: none; }
h3 a:hover { text-decoration: underline; }
.external-arrow { display: inline-block; font-family: var(--mono); font-size: 15px; color: #7d896b; vertical-align: 2px; }
.external-arrow, .social-links a span, .say-hello span { display: inline-block; transition: transform 180ms ease; }
h3 a:is(:hover, :focus-visible) .external-arrow, .social-links a:is(:hover, :focus-visible) span, .say-hello:is(:hover, :focus-visible) span { transform: translate(2px, -2px); }
.work-art { transition: color 200ms ease, border-color 200ms ease; }
.work-item:is(:hover, :focus-within) .work-art { color: #52623e; border-color: #b6c0a7; }
.work-copy > p { font-size: 13px; color: #5d6457; line-height: 1.8; }
.work-copy > .project-recognition { margin-top: 10px; color: var(--green); font-size: 11px; }
.work-copy > .project-context { margin-top: 8px; color: var(--muted); font-size: 11px; }
.work-links { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-family: var(--mono); font-size: 9px; margin-top: 14px; color: var(--muted); }
.work-links a { color: var(--green); }
.more-links { margin: 23px 0 0; font: 11px/1.8 var(--mono); color: var(--green); }
.links-main { max-width: 804px; margin: 0 auto; padding: 63px 0 55px; }
.links-main h1 { margin: 18px 0 24px; font-size: clamp(38px, 6vw, 56px); letter-spacing: -1.6px; }
.links-intro { max-width: 540px; color: #5d6457; font-size: 14px; }
.public-links { margin-top: 46px; }
.public-link-list { list-style: none; margin: 0; padding: 0; }
.public-link-entry { padding: 26px 0; border-bottom: 1px solid var(--line); }
.public-link-entry h3 { margin: 8px 0 12px; }
.public-link-entry > p { max-width: 640px; color: #5d6457; font-size: 13px; }
.public-link-entry > .project-recognition { margin-top: 10px; color: var(--green); font-size: 11px; }
.play-section { padding-top: 58px; }
.play-section > .section-heading { margin-bottom: 22px; }
.play-intro { max-width: 610px; margin: 18px 0 23px; color: #5d6457; font-size: 13px; }
.graph-fallback { padding: 22px 15px; border: 1px solid var(--line); border-radius: 3px; font-family: var(--mono); font-size: 11px; line-height: 1.8; color: var(--green); overflow-x: auto; }
.about-section { padding: 67px 0 42px; }
.about-main { max-width: 804px; margin: 0 auto; }
.home-hearth, .roofed-hearth { padding: 64px 0 30px; text-align: center; }
.home-hearth .hearth, .roofed-hearth .hearth { margin-bottom: 0; }
.hearth-companions { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: clamp(8px, 2vw, 24px); }
.hearth-companions .hearth { font-size: clamp(8px, 1vw, 11px); }
.hearth-object { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; justify-self: center; min-width: 44px; min-height: 44px; max-width: 100%; color: #748162; text-decoration: none; }
.hearth-object pre { font: clamp(8px, 1vw, 11px)/1.35 var(--mono); text-align: left; }
.hearth-object > span { margin-top: 12px; color: var(--muted); font: italic 13px/1.6 var(--serif); }
.hearth-object:is(:hover, :focus-visible) { color: var(--green); }
.hearth-object:is(:hover, :focus-visible) > span { color: var(--green); text-decoration: underline; text-underline-offset: 4px; }
.record-corner { position: relative; justify-self: center; max-width: 100%; }
.listening-toggle { display: block; min-height: 44px; margin: 0 auto; padding: 8px; border: 0; background: transparent; color: var(--green); font: 11px/1.5 var(--mono); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.listening-card { position: absolute; z-index: 1; bottom: calc(100% + 10px); left: 0; width: min(320px, calc(100vw - 80px)); max-height: min(380px, 55vh); overflow: auto; padding: 18px; border: 1px solid #bec5b2; border-radius: 6px; background: var(--paper); box-shadow: 0 8px 26px #30362e12; color: var(--ink); text-align: left; }
.listening-card[data-placement="below"] { bottom: auto; top: calc(100% + 10px); }
.listening-status { margin-bottom: 12px; color: var(--green); font: 12px/1.6 var(--mono); }
.listening-track { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; min-height: 44px; text-decoration: none; }
.listening-track:hover .listening-destination { text-decoration: underline; }
.listening-cover { flex: 0 0 80px; width: 80px; height: 80px; border-radius: 4px; object-fit: contain; }
.listening-metadata { display: flex; flex: 1 1 140px; min-width: 0; flex-direction: column; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.listening-metadata > span, .listening-metadata time { color: var(--muted); }
.listening-metadata time, .listening-destination { margin-top: 6px; font-size: 12px; }
.listening-attribution { display: flex; justify-content: flex-start; align-items: center; min-height: 44px; margin-top: 12px; }
.listening-attribution img { display: block; width: 160px; height: 67px; }
.error-main { max-width: 804px; margin: 0 auto; padding: 64px 0 42px; }
.error-main .house-body { text-align: center; }
.error-main h1 { margin-bottom: 18px; font-size: clamp(32px, 5vw, 44px); letter-spacing: -0.7px; }
.error-main p { max-width: 40ch; margin: 0 auto 20px; font-size: 16px; }
.error-main .hearth { margin-bottom: 0; }
.error-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 32px; }
.error-actions a { display: inline-flex; align-items: center; min-height: 44px; }
.hearth-about-link { display: table; margin: 0 auto 22px; font: italic 15px/1.6 var(--serif); color: var(--green); }
.house-roof { width: 100%; color: #8d987d; overflow: hidden; }
.house-roof pre { margin: 0; text-align: center; font: 11px/1.35 var(--mono); white-space: pre; }
.house-body { margin-top: -3px; padding: 28px 30px 22px; border: 1px solid #bec5b277; border-top: 0; border-radius: 0 0 3px 3px; background: var(--paper); }
.house-body .about-copy { --stair-step: clamp(0.75rem, 2vw, 1.35rem); --stair-gap: 0.85rem; max-width: 600px; margin: 0 auto; }
.house-furniture { display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; padding-top: 38px; }
.house-furniture .hearth { flex: 0 0 auto; margin: 0; }
.house-furniture .about-garden { align-self: flex-end; flex: 0 0 auto; }
.picture-frame { flex: 0 0 auto; margin: 0; text-align: center; color: #8c927d; }
.picture-frame pre { font: 11px/1.35 var(--mono); text-align: left; }
.picture-frame figcaption { margin-top: 12px; color: var(--muted); font: italic 12px/1.6 var(--serif); }
.about-section #about-heading { margin: 9px 0 20px; font-size: clamp(29px, 4vw, 36px); letter-spacing: -0.7px; }
.about-copy p { font-size: 15px; color: #5d6457; margin-top: 12px; }
.sidequest-path { margin: 1.1rem 0 1.8rem; padding: 0; list-style: none; color: #5d6457; font: inherit; }
.sidequest-path > li, .sidequest-conclusion > span { display: block; position: relative; margin-bottom: var(--stair-gap); padding-inline-start: 1.25rem; overflow-wrap: anywhere; text-wrap: pretty; }
.sidequest-path > li:nth-child(2), .sidequest-conclusion > span + span { --thread-ink: #8b5260; margin-inline-start: var(--stair-step); }
.sidequest-path > li:nth-child(3) { --thread-ink: #4b6f86; margin-inline-start: calc(2 * var(--stair-step)); }
.sidequest-path > li:nth-child(4) { --thread-ink: #805f38; margin-inline-start: calc(3 * var(--stair-step)); }
.sidequest-path > li::before, .sidequest-conclusion > span::before { content: ""; position: absolute; z-index: 1; left: -2px; top: calc(0.9em - 2px); width: 5px; height: 5px; border: 1px solid color-mix(in srgb, var(--thread-ink, var(--green)) 55%, var(--paper)); border-radius: 50%; background: var(--paper); pointer-events: none; }
.sidequest-path > li:not(:last-child)::after, .sidequest-conclusion > span:not(:last-child)::after { content: ""; position: absolute; left: 0; top: 0.9em; bottom: calc(-0.9em - var(--stair-gap)); width: var(--stair-step); border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); border-bottom-left-radius: 6px; pointer-events: none; }
.sidequest-path > li:last-child, .sidequest-conclusion > span:last-child { margin-bottom: 0; }
.say-hello { display: inline-block; margin-top: 21px; font-family: var(--mono); font-size: 10px; color: var(--green); }
.about-garden { align-self: center; text-align: center; color: #879275; }
.about-garden pre { display: inline-block; text-align: left; font: 11px/1.4 var(--mono); }
.about-garden > span { display: block; font: italic 13px/1.6 var(--serif); margin-top: 12px; }
.click-umbrella { position: absolute; z-index: 3; margin: 0; transform: translate(-50%, -40%); pointer-events: none; user-select: none; font: 600 12px/1.15 var(--mono); color: #52623e; text-shadow: 0 0 4px var(--paper), 0 0 7px var(--paper); white-space: pre; }
.hearth { position: relative; width: 35ch; max-width: 100%; margin: 0 auto 36px; text-align: center; font: 11px/1.35 var(--mono); color: #9c8b73; }
.hearth-surround { font: inherit; text-align: left; }
.hearth-fire { position: absolute; top: 3.8em; left: 50%; width: 15ch; height: 6.75em; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(ellipse at 50% 70%, #e1bc7540, transparent 75%); box-shadow: 0 6px 24px #dca25218; color: #a16d3e; }
.hearth-frame { position: absolute; inset: 0; font: inherit; text-align: center; opacity: 0; }
.hearth-frame-one { opacity: 1; }
.hearth-caption { display: block; margin-top: 12px; color: var(--muted); font: italic 13px/1.6 var(--serif); }
[data-rain="moving"] .hearth-frame-one { animation: hearth-one 2.4s steps(1, end) infinite; }
[data-rain="moving"] .hearth-frame-two { animation: hearth-two 2.4s steps(1, end) infinite; }
[data-rain="moving"] .hearth-frame-three { animation: hearth-three 2.4s steps(1, end) infinite; }
@keyframes hearth-one { 0%, 32% { opacity: 1; } 33%, 100% { opacity: 0; } }
@keyframes hearth-two { 0%, 32% { opacity: 0; } 33%, 65% { opacity: 1; } 66%, 100% { opacity: 0; } }
@keyframes hearth-three { 0%, 65% { opacity: 0; } 66%, 100% { opacity: 1; } }
.site-footer { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; border-top: 1px solid var(--line); padding: 22px 0 105px; font-family: var(--mono); font-size: 9px; color: var(--muted); }
.footer-name { color: var(--ink); text-decoration: none; }
.site-footer > a:last-child { margin-left: auto; text-decoration: none; }
.site-footer > a:hover { text-decoration: underline; }
.garden-controls { position: fixed; bottom: 20px; right: 24px; z-index: 4; display: flex; gap: 12px; align-items: center; border: 1px solid #dbdfd1; border-radius: 30px; background: #f8f7f2f5; box-shadow: 0 3px 20px #35452a05; padding: 4px 13px; }
.garden-controls button { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; border: 0; padding: 0 3px; cursor: pointer; background: transparent; font-family: var(--mono); font-size: 10px; color: #626b54; }
.garden-controls button:hover { color: #303c25; }
.control-rain { font-size: 13px; letter-spacing: 2px; color: #758780; }
.control-divider { width: 1px; height: 12px; background: var(--line); }
.sound-waves { display: none; }
[aria-pressed="true"] .sound-waves { display: block; }
[aria-pressed="true"] .sound-muted { display: none; }
.garden-status { position: fixed; z-index: 4; bottom: 75px; right: 24px; max-width: min(340px, calc(100vw - 48px)); font-size: 12px; color: #7a4032; background: var(--paper); }
.garden-status:not(:empty) { padding: 8px 12px; border: 1px solid #d8c6b7; border-radius: 5px; }

@media (hover: hover) and (pointer: fine) and (forced-colors: none) {
  html[data-umbrella-cursor="closed"] { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='28' viewBox='0 0 24 28'%3E%3Cg fill='none' stroke='%2352623e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 8 15h8L12 3Z' fill='%23f8f7f2'/%3E%3Cpath d='M12 3v20c0 3-4 3-4 0'/%3E%3C/g%3E%3C/svg%3E") 12 3, auto; }
  html[data-umbrella-cursor="open"] { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='28' viewBox='0 0 24 28'%3E%3Cg fill='none' stroke='%2352623e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12a10 9 0 0 1 20 0q-2-2-5 0-5-3-10 0-3-2-5 0Z' fill='%23f8f7f2'/%3E%3Cpath d='M12 3v20c0 3-4 3-4 0M12 3q-5 3-5 9m5-9q5 3 5 9'/%3E%3C/g%3E%3C/svg%3E") 12 3, auto; }
}

@media (min-width: 1200px) {
  .page { max-width: 1080px; padding: 0 38px; }
  .intro { padding-top: 87px; }
}
@media (max-width: 960px) {
  .intro { grid-template-columns: minmax(0, 1fr); gap: 35px; }
  .rain-window { grid-column: 1; grid-row: 2; width: min(100%, 340px); justify-self: center; }
}
@media (max-width: 650px) {
  .page { padding: 0 25px; }
  .site-header { padding: 16px 0; }
  body { font-size: 16px; }
  nav { gap: clamp(4px, 2vw, 13px); font-size: 12px; }
  .intro { padding: 49px 0 54px; }
  h1 { font-size: 55px; letter-spacing: -2.6px; }
  .intro-line { font-size: 26px; }
  .intro-copy, .links-intro, .about-copy p, .work-copy > p, .public-link-entry > p { font-size: 16px; }
  .work-copy > .project-recognition, .work-copy > .project-context, .public-link-entry > .project-recognition { font-size: 13px; }
  .work-links, .more-links, .social-links { font-size: 12px; }
  .section-heading { align-items: flex-start; }
  h2 { font-size: 23px; }
  .work-item { grid-template-columns: 100px 1fr; gap: 19px; padding: 26px 0; }
  .work-art { min-height: 150px; }
  .work-art pre { font-size: 9px; }
  .art-caption { display: none; }
  h3 { font-size: 23px; }
  .work-copy .eyebrow, .public-link-entry .eyebrow { font-size: 11px; }
  .play-section { padding-top: 46px; }
  .about-section { padding-top: 50px; }
  .house-body { padding: 22px 12px 18px; }
  .house-furniture .hearth { font-size: clamp(5px, 1.5vw, 9px); }
  .house-furniture .about-garden pre, .picture-frame pre { font-size: clamp(6px, 1.8vw, 9px); }
  .house-furniture .hearth-caption, .house-furniture .about-garden > span, .picture-frame figcaption { font-size: clamp(8px, 1.7vw, 12px); }
  .house-furniture .about-garden > span { margin-top: 12px; }
  .hearth-companions { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px 12px; }
  .hearth-companions .hearth { grid-column: 1 / -1; grid-row: 1; font-size: 9px; }
  .hearth-companions .record-corner { grid-column: 1; grid-row: 2; }
  .hearth-companions .mailbox { grid-column: 2; grid-row: 2; }
  .hearth-object pre { font-size: 10px; }
  .hearth-object > span, .hearth-companions .hearth-caption { font-size: 14px; }
  .listening-metadata { font-size: 16px; }
  .links-main { padding-top: 40px; }
  .site-footer { gap: 6px 15px; font-size: 11px; }
  .site-footer > span { flex-basis: calc(100% - 85px); text-align: right; }
  .site-footer > a:last-child { margin-left: 0; }
  .garden-controls { bottom: 14px; right: 14px; }
  .garden-status { right: 14px; }
}
@media (max-width: 380px) {
  .page { padding: 0 20px; }
  h1 { font-size: 48px; }
  .work-item { grid-template-columns: 1fr; gap: 19px; }
  .work-art { min-height: 125px; }
  .work-art pre { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .external-arrow, .social-links a span, .say-hello span, .work-art { transition: none; }
  [data-rain] .hearth-frame { animation: none; }
  h3 a:is(:hover, :focus-visible) .external-arrow, .social-links a:is(:hover, :focus-visible) span, .say-hello:is(:hover, :focus-visible) span { transform: none; }
}
@media print {
  #garden, .garden-controls, .garden-status, .garden-note, .skip-link, .rain-window, .click-umbrella, .hearth, .house-roof, .picture-frame { display: none !important; }
  body { background: white; }
  .page { max-width: none; }
  .intro { padding: 25px 0; }
  .site-header { position: static; padding: 0; backdrop-filter: none; }
  .work-item, .about-section { break-inside: avoid; }
  .site-footer { padding-bottom: 0; }
}