/* An opt-in arrangement of the same work. The ordinary portfolio stays still. */
.living-toolbar{margin:0 var(--pad) 28px;gap:14px 22px;align-items:center;flex-wrap:wrap}
.living-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.living-controls .living-icon-button,.option-row .living-icon-button{
 position:relative;display:inline-flex;align-items:center;justify-content:center;
 flex:0 0 48px;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;
 border:0;border-radius:50%;background:transparent;color:#377d96;line-height:1;
 transition:background-color 180ms ease;
}
.living-controls .living-house-button[aria-pressed="true"],.option-row .living-house-button[aria-pressed="true"]{background:var(--panel);color:#377d96}
.living-icon-button svg{display:block;flex:none}
.house-ground{fill:#758574}
.house-sun{fill:#c99546}
.house-annex,.rearrange-tile{fill:#758574}
.house-door,.house-window{fill:#f2f0e9;transition:fill 180ms ease}
[data-living-toggle][aria-pressed="true"] .house-window{fill:#f4ce75}
[data-living-toggle][aria-pressed="true"] .house-door{fill:#e9dcaf}
.living-play-mark{display:none}
[data-paused="true"] .living-pause-mark{display:none}
[data-paused="true"] .living-play-mark{display:block}
html[data-theme="ink"] .living-icon-button,
html[data-theme="ink"] .living-house-button[aria-pressed="true"]{color:#b9e4e9}
html[data-theme="ink"] .house-ground{fill:#394a44}
html[data-theme="ink"] .house-annex,
html[data-theme="ink"] .rearrange-tile{fill:#a5b39c}
html[data-theme="ink"] .house-door,
html[data-theme="ink"] .house-window{fill:#263730}
html[data-theme="ink"] [data-living-toggle][aria-pressed="true"] .house-window{fill:#f4ce75}
html[data-theme="ink"] [data-living-toggle][aria-pressed="true"] .house-door{fill:#e9dcaf}
.living-tooltip{
 position:absolute;top:calc(100% + 6px);left:0;z-index:30;
 padding:7px 10px;border-radius:8px;background:var(--ink);color:var(--bg);
 font-size:14px;font-weight:400;line-height:1.4;white-space:nowrap;
 visibility:hidden;opacity:0;pointer-events:none;
}
.living-icon-button:focus-visible{z-index:4}
.living-icon-button:focus-visible .living-tooltip{visibility:visible;opacity:1;pointer-events:auto}
@media(hover:hover){
 .living-icon-button:not(:disabled):hover{background:var(--panel);z-index:4}
 .living-icon-button:not(:disabled):hover .living-tooltip{visibility:visible;opacity:1;pointer-events:auto}
}
.living-icon-button.tooltip-dismissed .living-tooltip{visibility:hidden;opacity:0;pointer-events:none}
html[data-motion="off"] .living-icon-button,html[data-motion="off"] .house-door,html[data-motion="off"] .house-window{transition:none}
@media(prefers-reduced-motion:reduce){.living-icon-button,.house-door,.house-window{transition:none}}
[data-living-status]{font-size:14px;line-height:1.5;color:var(--muted);max-width:42ch}
[data-living-settings]{padding-top:18px!important;border-top:1px solid var(--line)!important;margin-top:20px!important;margin-bottom:0!important}
[data-living-toggle][hidden],[data-living-pause][hidden],[data-living-next][hidden],[data-living-settings][hidden]{display:none!important}
.living-section-pair{display:contents}
[data-living-catalog][hidden],[data-living-still][hidden]{display:none!important}
.living-catalog{padding-top:0}
.living-catalog .section-title{border:0;padding-top:0;margin-bottom:19px}
.living-catalog .project-number{display:none}
.living-catalog .project-card{transform-origin:top left}
.living-catalog .project-caption h3{overflow-wrap:normal}

/* Each project uses the same compact card and can take either large lead slot. */
html[data-living="on"]:not([data-mode="cinema"]) .living-catalog-grid .project-caption h3{font-size:clamp(22px,2vw,27px)}
html[data-living="on"]:not([data-mode="cinema"]) .living-catalog-grid>.project-card:nth-child(-n+2) .project-caption h3{font-size:29px}
html[data-living="on"] .living-catalog .contain .project-image img{object-fit:contain}

/* Equal slots let the actual cards trade places without shifting the page below. */
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid{grid-template-columns:repeat(6,minmax(0,1fr));align-items:start}
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card{grid-column:span 2;grid-row:auto;display:block;padding:0;border:0;margin:0}
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card:nth-child(-n+2){grid-column:span 3}
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card>.project-image{aspect-ratio:1.6;grid-row:auto;height:auto}
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card>.project-caption{padding:16px 0 0}
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card>.project-intro{margin-top:12px}
html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card>.project-preview{grid-column:auto}
html[data-living="on"]:not([data-mode="cinema"]) .home .art-introduction{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin:15px var(--pad) 60px;align-items:stretch}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair>section{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;margin:0;gap:0;background:var(--panel);align-items:start;min-width:0}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair>section>a{display:block;grid-row:1;width:100%;height:auto;aspect-ratio:1.55;overflow:hidden}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair>section>a img{width:100%;height:100%;aspect-ratio:1.55;object-fit:cover}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair>section>div{grid-row:2;padding:24px 26px 28px}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair h2{font-size:clamp(28px,3vw,40px);margin-top:9px}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair h2 br{display:none}
html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair p:not(.eyebrow){margin:12px 0 18px}

@media(max-width:700px){
 .living-toolbar{gap:8px;margin-bottom:24px}
 .living-controls{gap:6px}
 [data-living-status]{width:100%;font-size:14px}
 html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid,
 html[data-living="on"]:not([data-mode="cinema"]) .home .art-introduction,
 html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair{grid-template-columns:minmax(0,1fr)}
 html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card,
 html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card:nth-child(-n+2){grid-column:1}
 html[data-living="on"]:not([data-mode="cinema"]) .home .selected-grid>.project-card>.project-image{aspect-ratio:1.42}
 html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair{gap:30px;margin-bottom:40px}
 html[data-living="on"]:not([data-mode="cinema"]) .living-section-pair>section>div{padding:22px}
 html[data-living="on"]:not([data-mode="cinema"]) .living-catalog-grid .project-caption h3,
 html[data-living="on"]:not([data-mode="cinema"]) .living-catalog-grid>.project-card:nth-child(-n+2) .project-caption h3{font-size:28px}
}
@media print{.living-toolbar,[data-living-settings]{display:none!important}}