/* SCENES/01 — scene-only fades; text and document scroll never transition. */
.site-sky{
  --scene-space-opacity:1;
  --scene-lake-opacity:0;
  --scene-beach-opacity:0;
}
/* If WebGL2 lower-document drawing is unavailable, keep a subtle themed
   document-length background. The opening color equals the original
   #050b19 body backdrop, so the approved hero is not recolored. */
.site-sky[data-scene="lake"]{
  background:linear-gradient(180deg,#050b19 0%,#050b19 29%,#0a2030 65%,#04101e 100%);
}
.site-sky[data-scene="beach"]{
  background:linear-gradient(180deg,#050b19 0%,#050b19 29%,#10232b 68%,#07121e 100%);
}
.site-sky::before{
  opacity:calc(.38 * var(--scene-space-opacity));
}
.site-sky__stars,
.space-canvas{
  opacity:var(--scene-space-opacity);
}
/* The old space vignette must not cover an independent water panorama. */
.site-sky--webgl::after{opacity:var(--scene-space-opacity)}

.scene-water-canvas{
  position:absolute;inset:0;
  width:100%;height:100%;display:block;z-index:1;
  pointer-events:none;opacity:0;
}
.scene-water-canvas[data-water-scene="lake"]{opacity:var(--scene-lake-opacity)}
.scene-water-canvas[data-water-scene="beach"]{opacity:var(--scene-beach-opacity)}
/* Experimental lake-only extension: below original lake canvas, full document. */
.scene-lake-continuation{
  position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;
  pointer-events:none;opacity:var(--scene-lake-opacity);
}
.site-sky--switching::before,
.site-sky--switching::after,
.site-sky--switching .site-sky__stars,
.site-sky--switching .space-canvas,
.site-sky--switching .scene-water-canvas,
.site-sky--switching .scene-trails-continuation,
.site-sky--switching .scene-lake-continuation,
.site-sky--switching .scene-beach-continuation{
  transition:opacity 850ms ease-in-out;
}

/* DAYSHORE/03 — selected daylight coast requires readable contrast;
 * space and lake remain untouched. */
.site-sky[data-scene="beach"][data-beach-variant="day"]{
  background:linear-gradient(168deg,#d2e6cf 0%,#e9d4ae 60%,#eedbbd 100%);
}
body.site-day-shore-active{
  --night:#ecd7b7;--white:#153e46;--silver:#325861;
  --soft:#426a6d;--muted:#5c787c;--accent:#1d6973;
  --line:rgba(20,73,78,.24);
  color-scheme:light;
}
body.site-day-shore-active .site-header{
  border-bottom-color:rgba(18,75,78,.19);
}
body.site-day-shore-active .brand-star,
body.site-day-shore-active .brand-slash,
body.site-day-shore-active .hero-overline span{
  color:#226d76;
}
body.site-day-shore-active .site-nav a,
body.site-day-shore-active .hero-meta,
body.site-day-shore-active .hero-foot,
body.site-day-shore-active .hero-overline,
body.site-day-shore-active .section-kicker,
body.site-day-shore-active .page-overline{
  color:#315a60;
}
body.site-day-shore-active .site-nav a:hover,
body.site-day-shore-active .site-nav a[aria-current="page"]{
  color:#113d46;
}
body.site-day-shore-active .home-hero h1{
  color:#123f45;text-shadow:0 1px 20px rgba(253,246,219,.75);
}
body.site-day-shore-active .home-hero h1 span{
  background:linear-gradient(103deg,#15464d,#2b767b 49%,#163f4a);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
body.site-day-shore-active .hero-lead,
body.site-day-shore-active .section-intro p{
  color:#245259;text-shadow:0 1px 12px rgba(253,247,226,.48);
}
body.site-day-shore-active .section-intro h2 em,
body.site-day-shore-active .related-title em,
body.site-day-shore-active .page-heading h1 em,
body.site-day-shore-active .studio-statement h2 em,
body.site-day-shore-active .manifesto h2 em,
body.site-day-shore-active .footer-heading span{
  color:#226673;
}
body.site-day-shore-active .line-link{
  border-bottom-color:rgba(25,91,97,.55);
}
body.site-day-shore-active .scene-switcher__dot::after{
  background:rgba(19,78,85,.51);
}
body.site-day-shore-active .scene-switcher__dot[aria-pressed="true"]::after{
  background:#124a51;box-shadow:0 0 3px rgba(255,255,255,.30);
}
body.site-day-shore-active .scene-switcher__dot:focus-visible{
  outline-color:#155a64;
}
/* Light panels here would overpower the sand; keep type legible with a
 * soft, unboxed local wash rather than obscuring the full composition. */
body.site-day-shore-active .hero-core{
  text-shadow:0 1px 10px rgba(251,247,224,.43);
}

/* HOME/THREE: accessible 3-dot background selector; visually unobtrusive. */
.scene-switcher{
  /* Only the three dots are visible; no pill, slot, blur, box or border. */
  position:fixed;right:clamp(8px,2.3vw,28px);
  top:50%;bottom:auto;transform:translateY(-50%);
  z-index:45;display:flex;align-items:center;gap:0;
  margin:0;padding:0;border:0;border-radius:0;
  background:transparent;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  font-family:var(--mono,monospace);color:#e6effc
}
.scene-switcher__status{
  /* Preserve aria-live announcements without any visible bottom caption. */
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0
}
.scene-switcher__choices{display:flex;flex-direction:column;align-items:center;gap:0}
.scene-switcher__dot{
  width:44px;height:44px;display:grid;place-items:center;
  border:0;background:transparent;padding:0;cursor:pointer
}
.scene-switcher__dot::after{
  content:"";display:block;width:4px;height:4px;
  border-radius:50%;border:0;
  background:rgba(221,235,249,.40);
  transition:background .2s,box-shadow .2s;
}
.scene-switcher__dot[aria-pressed="true"]::after{
  background:#f1f6ff;box-shadow:0 0 3px rgba(235,243,255,.35)
}
.scene-switcher__dot:focus-visible{outline:2px solid #e7f2ff;outline-offset:-2px}
.scene-switcher[aria-busy="true"] .scene-switcher__dot{opacity:.55}
@media(max-width:520px){
  .scene-switcher{right:5px;top:50%;bottom:auto;transform:translateY(-50%);gap:0;padding:0}
  .scene-switcher__dot{width:44px;height:44px}
  .scene-switcher__status{min-width:0}
}

@media(prefers-reduced-motion:reduce){
  .site-sky--switching::before,
  .site-sky--switching .site-sky__stars,
  .site-sky--switching .space-canvas,
  .site-sky--switching .scene-water-canvas,
.site-sky--switching .scene-lake-continuation,
  .site-sky--switching .scene-beach-continuation{transition:none!important}
}

/* Coarse pointers keep native vertical scroll and pinch zoom; horizontal
   gestures can finish without a browser-initiated pointercancel. */
@media (pointer:coarse) {
  body {touch-action:pan-y pinch-zoom}
}
/* DAYSHORE/TEXT-01 — readable free-floating type over the real full-document
 * sea/sand composition. Strictly HOME + selected daylight beach: no change
 * to space, trails, lake, night surf or other site sections/templates.
 * Do not add broad opaque panels or alter the underlying approved shaders. */
body.site-day-shore-active[data-page="/"]{
  --shore-sea-ink:#f4fcf7;
  --shore-sand-ink:#143d43;
  --shore-sea-edge:0 1px 2px rgba(0,29,42,.92),0 0 2px rgba(0,34,46,.72);
  --shore-sand-edge:0 1px 2px rgba(254,248,225,.7);
}
/* Heading strokes remain readable on dark sea, bright shallows AND sand.
 * The old bright 20px subtitle halo blurred the actual letter shapes. */
body.site-day-shore-active[data-page="/"] .hero-core{
  text-shadow:none;
}
body.site-day-shore-active[data-page="/"] .home-hero h1,
body.site-day-shore-active[data-page="/"] .section-intro h2,
body.site-day-shore-active[data-page="/"] .manifesto h2,
body.site-day-shore-active[data-page="/"] .footer-heading,
body.site-day-shore-active[data-page="/"] .project-row__title{
  color:var(--shore-sea-ink);
  text-shadow:var(--shore-sea-edge);
  -webkit-text-stroke:.5px rgba(7,40,52,.68);
}
body.site-day-shore-active[data-page="/"] .home-hero h1 span{
  background:none;
  color:var(--shore-sea-ink);
  -webkit-text-fill-color:var(--shore-sea-ink);
}
body.site-day-shore-active[data-page="/"] .section-intro h2 em,
body.site-day-shore-active[data-page="/"] .manifesto h2 em,
body.site-day-shore-active[data-page="/"] .footer-heading span,
body.site-day-shore-active[data-page="/"] .project-row:hover .project-row__title{
  color:var(--shore-sea-ink);
}
/* Left column stays over the sea, including the entire project list. */
body.site-day-shore-active[data-page="/"] .brand,
body.site-day-shore-active[data-page="/"] .brand-star,
body.site-day-shore-active[data-page="/"] .brand-slash,
body.site-day-shore-active[data-page="/"] .hero-overline,
body.site-day-shore-active[data-page="/"] .hero-overline span,
body.site-day-shore-active[data-page="/"] .hero-lead,
body.site-day-shore-active[data-page="/"] .hero-meta>span:first-child,
body.site-day-shore-active[data-page="/"] .hero-foot>span:first-child,
body.site-day-shore-active[data-page="/"] .section-kicker>span:first-child,
body.site-day-shore-active[data-page="/"] .manifesto-overline,
body.site-day-shore-active[data-page="/"] .project-row__no,
body.site-day-shore-active[data-page="/"] .project-row__subtitle,
body.site-day-shore-active[data-page="/"] .manifesto-foot p,
body.site-day-shore-active[data-page="/"] .line-link,
body.site-day-shore-active[data-page="/"] .view-all,
body.site-day-shore-active[data-page="/"] .footer-upper>span:first-child,
body.site-day-shore-active[data-page="/"] .footer-bottom>span:first-child{
  color:var(--shore-sea-ink);
  text-shadow:var(--shore-sea-edge);
}
body.site-day-shore-active[data-page="/"] .line-link,
body.site-day-shore-active[data-page="/"] .view-all{
  border-bottom-color:rgba(244,252,247,.7);
}
body.site-day-shore-active[data-page="/"] .line-link:hover,
body.site-day-shore-active[data-page="/"] .view-all:hover{
  color:#fff;
  border-bottom-color:rgba(255,255,255,.92);
}
/* Sand-side metadata, project categories and the right-hand intro are
 * intentionally dark. Applying white globally would lose these details. */
body.site-day-shore-active[data-page="/"] .hero-meta>span:last-child,
body.site-day-shore-active[data-page="/"] .hero-foot>span:last-child,
body.site-day-shore-active[data-page="/"] .section-kicker>span:last-child,
body.site-day-shore-active[data-page="/"] .project-row__type,
body.site-day-shore-active[data-page="/"] .project-row__arrow,
body.site-day-shore-active[data-page="/"] .section-intro p,
body.site-day-shore-active[data-page="/"] .footer-upper .text-link,
body.site-day-shore-active[data-page="/"] .footer-bottom>span:not(:first-child){
  color:var(--shore-sand-ink);
  text-shadow:var(--shore-sand-edge);
}
@media(max-width:780px){
  /* Stacked right-hand copy moves below titles, over ocean on phones. */
  body.site-day-shore-active[data-page="/"] .section-intro p{
    color:var(--shore-sea-ink);
    text-shadow:var(--shore-sea-edge);
  }
  body.site-day-shore-active[data-page="/"] .manifesto-foot .line-link{
    color:var(--shore-sea-ink);
    text-shadow:var(--shore-sea-edge);
    border-bottom-color:rgba(244,252,247,.7);
  }
}
@media(min-width:781px){
  body.site-day-shore-active[data-page="/"] .manifesto-foot .line-link{
    color:var(--shore-sand-ink);
    text-shadow:var(--shore-sand-edge);
    border-bottom-color:rgba(20,61,67,.65);
  }
}

/* DAYSHORE/TEXT-01A — mobile-only mixed shoreline correction.
 * The lower archive/footer lie on bright turquoise water and warm sand.
 * Dark ink has contrast on BOTH; global white text fails on the sand.
 * Preserve the accepted pale type over deep water in hero/work/manifesto,
 * and leave desktop/night/space/lake/trails untouched. */
@media(max-width:520px){
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro h2,
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro h2 em,
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro p,
  body.site-day-shore-active[data-page="/"] .archive-listing .section-kicker>span:first-child,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__title,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row:hover .project-row__title,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__subtitle,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__no,
  body.site-day-shore-active[data-page="/"] .archive-listing .view-all,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-heading,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-heading span,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-upper>span:first-child,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-bottom>span:first-child{
    color:#10373d;
    -webkit-text-stroke:0;
    text-shadow:0 1px 1px rgba(255,249,227,.36);
  }
  body.site-day-shore-active[data-page="/"] .archive-listing .view-all{
    border-bottom-color:rgba(16,55,61,.66);
  }
}

/* DAYSHORE/TEXT-01B — desktop/mid-width mixed coast text edges only.
 * Keep pale sea typography and the reviewed mobile dark archive/footer.
 * A narrow ink edge survives turquoise foam and warm sand without opaque cards. */
@media(min-width:521px){
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro h2,
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro h2 em,
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro p,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__title,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__subtitle,
  body.site-day-shore-active[data-page="/"] .archive-listing .view-all,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-heading,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-heading span,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-upper,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-bottom{
    text-shadow:0 1px 2px rgba(4,28,35,.9),
                0 0 4px rgba(4,30,38,.65),
                0 0 1px rgba(255,248,230,.24);
  }
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro h2,
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro h2 em,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__title,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-heading,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-heading span{
    -webkit-text-stroke:.8px rgba(8,38,45,.88);
  }
}

/* ARTWORK/FULL-COMPOSITION — respect the source image's own dimensions.
 * The inherited mobile 1.07 and desktop 1.55 aspect ratios cropped the
 * left/right artwork with cover, even though the HTML supplies 960x600.
 * Keep the complete drawing and allow its natural document height. */
.artwork img {
  width:100%;
  height:auto;
  max-height:none;
  aspect-ratio:auto;
  object-fit:contain;
}

/* DAYSHORE/TEXT-01C — small mixed-coast copy needs a fine dark glyph edge
 * when pale letters cross bright sand. Do not darken sea-side typography,
 * cover the shore with panels, or change reviewed <=520px mobile text. */
@media (min-width:521px) {
  body.site-day-shore-active[data-page="/"] .archive-listing .section-intro p,
  body.site-day-shore-active[data-page="/"] .archive-listing .project-row__subtitle,
  body.site-day-shore-active[data-page="/"] .archive-listing .view-all,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-upper,
  body.site-day-shore-active[data-page="/"] .site-footer .footer-bottom {
    -webkit-text-stroke:.32px rgba(6,32,39,.92);
    paint-order:stroke fill;
  }
}