:root{--paper:#f4eedf;--ink:#29231d;--muted:#695d4e;--cedar:#c27d4a;--gutter:clamp(1.25rem,4.3vw,5rem)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}html{background:var(--paper)}body{color:var(--ink);font:1rem/1.6 Arial,sans-serif;background:var(--paper)}p,h1,figure{margin:0}svg{fill:currentColor}.holding-page{max-width:1700px;height:100vh;height:100dvh;margin-inline:auto;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding-inline:var(--gutter);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.masthead{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:clamp(.6rem,3dvh,2.5rem) clamp(.3rem,1.5dvh,1rem)}.wordmark{width:clamp(112px,12vw,168px);height:auto;flex-shrink:0;overflow:visible}.status{display:flex;gap:.7rem;align-items:center;font-size:.75rem;line-height:1.5}.status-line{width:24px;height:1px;background:var(--cedar);flex-shrink:0}.main-content{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);padding-bottom:clamp(.25rem,1.2dvh,1rem)}.message{text-align:center;padding-top:clamp(.4rem,3dvh,2.5rem)}.eyebrow{font-size:.75rem;line-height:1.5;color:var(--muted);margin-bottom:clamp(.4rem,2dvh,1.5rem)}h1{font-size:clamp(1.5rem,min(5.8vw,9dvh),5.7rem);line-height:1.06;font-weight:400}h1>span{display:inline-block}.illustration{min-height:0;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;margin:0}.venue-art{display:block;width:100%;height:100%;max-width:1140px;min-height:0;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,black 13%,black 85%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,black 13%,black 85%,transparent)}.page-footer{display:grid;grid-template-columns:1fr 1.4fr .4fr;gap:1rem;align-items:center;border-top:1px solid #695d4e38;padding-block:clamp(.4rem,1.8dvh,1.25rem);font-size:.75rem;line-height:1.75}.location{justify-self:start}.opening-note{text-align:center;color:var(--muted);font-size:.875rem}.brand-symbol{width:29px;height:auto;justify-self:end}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ink-text{font-family:Arial,sans-serif;letter-spacing:0}.ink-word{display:inline-block;height:1em;vertical-align:-.2em;overflow:visible;max-width:100%}
@media(max-width:700px){.status-line{display:none}.status{gap:0}.eyebrow{max-width:20rem;margin-inline:auto}h1{font-size:clamp(1.5rem,min(10vw,8dvh),3.65rem);line-height:1.1}.page-footer{grid-template-columns:1fr auto;gap:.4rem 1rem}.opening-note{grid-row:2;grid-column:1;text-align:left;line-height:1.6}.brand-symbol{grid-column:2;grid-row:1 / span 2;width:29px}.location{line-height:1.6}}
@media(max-height:500px) and (min-width:601px){.masthead{padding-block:.5rem .2rem}.message{padding-top:.2rem}.eyebrow{margin-bottom:.3rem}.page-footer{padding-block:.35rem;line-height:1.4}.opening-note{line-height:1.4}.brand-symbol{width:22px}h1{font-size:clamp(1.5rem,8dvh,2.5rem)}}
@media print{html,body{height:auto;overflow:visible}.holding-page{height:95vh}body{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* Original paper layout, with discreet day/night controls. */
:root{--rule:#695d4e38}
:root[data-theme="night"]{--paper:#0c141d;--ink:#f2e8d7;--muted:#ccbea8;--rule:#ccbea840}
body{background:var(--paper);isolation:isolate}
 .page-texture{position:fixed;inset:0;z-index:-1;pointer-events:none}.page-texture i{position:absolute;inset:0;background-repeat:no-repeat;background-position:left top;background-size:max(2400px,220vw) auto;opacity:0}.page-texture [data-texture="day"]{opacity:1;background-image:url('assets/senja-day.webp')}.page-texture [data-texture="night"]{background-size:auto,max(2400px,220vw) auto}
.wordmark,.brand-symbol{filter:invert(var(--logo-invert,0))}
.scene-host{width:100%;height:100%;max-width:1140px;min-height:0;position:relative}
.scene-host>svg,.static-scene{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.scene-host>[hidden]{display:none!important}
.venue-art{mask-image:none;-webkit-mask-image:none}
.page-footer{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);border-color:var(--rule)}
.footer-brand{justify-self:end;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;max-width:100%;gap:.5rem}
.contact-logo{display:grid;place-items:center;flex-shrink:0;min-width:44px;min-height:44px;color:inherit;text-decoration:none;border-radius:3px}
.contact-logo .brand-symbol{justify-self:center;display:block}
.contact-logo:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media(min-width:701px){.opening-note{justify-self:center}}

/* One continuous light control in the former top-right status position. */
.main-content{grid-template-rows:auto minmax(0,1fr) auto}
.masthead{position:relative}
.appearance{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;align-items:flex-start;gap:.5rem;max-width:100%;padding:0;margin:0}
/* Retain the adopted architectural anchor after moving its former controls. */
html[data-light] .main-content::after{content:"";display:block;height:calc(44px + .875rem - 5px + .75rem)}
.location{color:inherit;text-decoration:none;min-height:44px;display:block;align-content:center;border-radius:3px}
.location:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(hover:hover){.location:hover{text-decoration:underline;text-underline-offset:4px}}
.appearance[hidden],.motion-control[hidden],[data-motion-label][hidden]{display:none!important}
.light-slider{position:relative;width:9.5rem;max-width:45vw}
.light-slider input{display:block;appearance:none;-webkit-appearance:none;width:100%;height:44px;margin:0;border:0;outline:none;background:transparent;color:var(--muted);cursor:pointer;touch-action:pan-y}
.light-slider input::-webkit-slider-runnable-track{height:.75px;background:var(--muted)}
.light-slider input::-moz-range-track{height:.75px;background:var(--muted)}
.light-slider input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:6px;height:6px;border:0;border-radius:50%;background:var(--muted);box-shadow:none;margin-top:-2.625px}
.light-slider input::-moz-range-thumb{width:6px;height:6px;border:0;border-radius:50%;background:var(--muted);box-shadow:none}
.light-labels{position:absolute;top:44px;left:0;right:0;display:grid;grid-template-columns:1fr 1fr 1fr;text-align:center;align-items:center;font-size:.625rem;line-height:1.4;color:var(--muted);margin-top:-5px}
.light-labels>span:first-child{text-align:left}.light-labels>span:last-child{text-align:right}
.appearance button{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.6875rem;line-height:1.4;min-width:44px;min-height:44px;padding:.5rem;cursor:pointer;border-radius:50%}
.auto-control[aria-pressed="true"]{color:var(--ink);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.appearance .motion-control{display:grid;place-items:center;flex:0 0 44px;width:44px;padding:.25rem}
.motion-control svg{display:block;width:14px;height:14px}
.motion-control:disabled{opacity:.5;cursor:default}
.appearance button:focus-visible{outline:1px solid var(--ink);outline-offset:1px}
/* No field-shaped focus box. Keyboard focus remains visible at the thumb. */
.light-slider input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--paper),0 0 0 4px var(--ink)}
.light-slider input:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--paper),0 0 0 4px var(--ink)}
/* Keep inactive text at the contrast-checked muted colour, not faded opacity. */
html[data-light-label="0"] .light-labels>span:nth-child(1),
html[data-light-label="1"] .light-labels>span:nth-child(2),
html[data-light-label="2"] .light-labels>span:nth-child(3){color:var(--ink)}
@media(hover:hover){.appearance button:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 5%,transparent)}}
/* The artwork fills the page: real sky above, real road below. */
.scene-host[data-full-page="true"]{position:fixed;inset:0;width:100%;height:100%;max-width:none;z-index:0;pointer-events:none}
html[data-full-scene="true"] .page-texture{display:none}
.scene-host>svg{max-width:none}
html[data-full-scene="true"][data-theme="dusk"] :is(.message,.masthead,.page-footer,.appearance){filter:drop-shadow(0 1px 2px #20142380)}
/* Keep the simplified mobile composition and original contact link. */
@media(max-width:700px){
  .eyebrow,.opening-note{display:none}
  .message{padding-top:clamp(1rem,5dvh,2.5rem)}
  .page-footer{grid-template-columns:minmax(0,1fr) auto;gap:.5rem;align-items:center}
  .footer-brand{grid-column:2;grid-row:1;flex-direction:row;flex-wrap:nowrap;align-items:center}
  .location{grid-column:1;grid-row:1;font-size:.75rem;line-height:1.6}
  .footer-brand .brand-symbol{width:23px}
  .appearance{gap:0}
  .light-slider{width:clamp(120px,calc(100vw - 240px),180px);max-width:none}
  html[data-light] .main-content::after{height:calc(44px + .875rem - 5px + 1rem)}
}
@media(max-width:700px) and (max-height:500px){.message{padding-top:.5rem}}
/* Large text and short-height layouts remain scrollable and reachable. */
@media(max-height:440px),(max-width:330px){html,body{height:auto;min-height:100%;overflow:auto}.holding-page{height:auto;min-height:100dvh;grid-template-rows:auto 1fr auto}.main-content{grid-template-rows:auto minmax(150px,1fr) auto}.illustration{min-height:150px}.page-footer{margin-top:.5rem;grid-template-columns:minmax(0,1fr);gap:.4rem}.location,.footer-brand{grid-column:1;grid-row:auto;justify-self:center}.opening-note{grid-column:1}.status{white-space:normal}.light-slider{max-width:42vw}}
@media print{.appearance{display:none}}
@media(max-height:500px){.masthead{min-height:60px}.appearance{top:0;transform:none}}
@media(max-width:330px){.masthead{display:block}.appearance{position:relative;top:auto;right:auto;transform:none;justify-content:flex-end;margin-top:.5rem}}

/* Explicit background/foreground layers also work in iOS compositing. */
.holding-page{position:relative;z-index:1;pointer-events:none}
.holding-page a,.holding-page button,.holding-page input{pointer-events:auto}
/* Keep the native building fallback visible while enhanced layers decode.
   Opening cast opacity belongs to the shared animation clock. */
.static-scene{z-index:0}
.scene-host>[data-senja-scene]{z-index:1}

/* Quiet, readable controls; the building remains the primary image. */
.light-labels{font-size:.75rem}
.light-slider{width:11rem}
.contact-logo{display:flex;gap:.75rem;padding-inline:.35rem}
.contact-label{font-size:.75rem;line-height:1.4}
.mobile-opening-note{display:none}
@media(max-width:700px){
  .light-slider{width:clamp(138px,calc(100vw - 240px),180px)}
  .mobile-opening-note{display:block;grid-column:1 / -1;grid-row:2;font-size:.75rem;color:var(--muted);line-height:1.55;text-align:center;padding-top:.3rem}
  .contact-logo{flex-direction:column-reverse;gap:.2rem;padding-inline:0;min-width:66px}
  .contact-label{font-size:.75rem}
  .page-footer{padding-bottom:max(.75rem,env(safe-area-inset-bottom))}
}
@media(min-width:331px) and (max-width:350px){.masthead{display:block}.appearance{position:relative;top:auto;right:auto;transform:none;justify-content:flex-end;margin-top:.3rem}}

/* One owner for each safe inset. Scene artwork still reaches every edge. */
.holding-page{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}
@media(max-width:700px){.page-footer{padding-bottom:.75rem}}

.contact-panel[hidden],.contact-reveal[hidden]{display:none!important}
.contact-panel{position:absolute;right:0;bottom:calc(100% + .6rem);z-index:3;display:flex;align-items:center;gap:.35rem;width:max-content;max-width:calc(100vw - 2*var(--gutter));padding:.35rem .45rem .35rem .8rem;border:1px solid var(--rule);border-radius:4px;background:var(--paper);color:var(--ink);box-shadow:0 3px 14px #0002;pointer-events:auto}
.contact-address{font:13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--muted);user-select:text;-webkit-user-select:text;white-space:nowrap}
.contact-panel button{appearance:none;background:transparent;border:0;color:inherit;min-width:44px;min-height:44px;padding:.45rem;cursor:pointer;font:13px/1.4 Arial,sans-serif}
.contact-close svg{display:block;width:16px;height:16px}
.contact-panel :focus-visible{outline:1px solid var(--ink);outline-offset:2px;border-radius:2px}
@media(max-width:700px){
  .footer-brand{position:relative}
  .contact-logo{-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
  .contact-reveal:focus-visible{clip:auto;width:max-content;max-width:calc(100vw - 2*var(--gutter));height:auto;right:0;bottom:calc(100% + .6rem);margin:0;padding:.6rem;background:var(--paper);color:var(--ink);font:13px/1.4 system-ui;border:1px solid var(--ink);white-space:normal;z-index:4}
}

@media(max-width:700px){
  .location,.contact-label,.mobile-opening-note,.light-labels{font-size:.8125rem}
  .appearance{top:max(22px,50%)}
  .light-slider{width:clamp(154px,calc(100vw - 240px),180px)}
  .light-labels{grid-template-columns:auto minmax(0,1fr) auto;gap:.25rem}
  .mobile-opening-note{text-wrap:balance}
}
@media(max-height:500px) and (min-width:601px) and (orientation:landscape){
  .eyebrow{display:none}
  html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
  .holding-page{height:auto;min-height:100dvh}
  .main-content{grid-template-rows:auto minmax(150px,1fr) auto}
  .illustration{min-height:150px}
}
@media(max-width:700px){
  html[data-large-text],html[data-large-text] body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
  html[data-large-text] .holding-page{height:auto;min-height:100dvh}
  html[data-large-text] .masthead{display:block}
  html[data-large-text] .appearance{position:relative;top:auto;right:auto;transform:none;justify-content:flex-end;margin-top:.5rem;padding-bottom:2rem}
  html[data-large-text] .light-slider{width:100%;min-width:0}
  html[data-large-text] .light-labels{position:static;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem .45rem}
  html[data-large-text] .light-labels .ink-word{max-width:none}
  html[data-large-text] .main-content{grid-template-rows:auto minmax(150px,1fr) auto}
  html[data-large-text] .illustration{min-height:150px}
  html[data-large-text] .page-footer{grid-template-columns:minmax(0,1fr);gap:.6rem}
  html[data-large-text] .location,html[data-large-text] .footer-brand,html[data-large-text] .mobile-opening-note{grid-column:1;grid-row:auto;justify-self:center}
}

/* Native hidden venue entry. Inline padding extends the tap area without
   changing line boxes; the existing note text and punctuation stay in place. */
.venue-entry{position:relative;color:inherit;text-decoration:none;padding-block:14px;cursor:pointer}
.venue-entry:visited{color:inherit}
.venue-entry:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:2px}
@media(hover:hover){.venue-entry:hover{text-decoration:underline;text-underline-offset:4px}}

/* Visible feedback for the existing mobile Copy action; no page-level change. */
.contact-panel{display:grid;grid-template-columns:minmax(0,1fr) auto auto}
.contact-feedback{grid-column:1/-1;max-width:18rem;padding:.15rem .35rem .4rem;font:13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}
.contact-feedback[hidden]{display:none}

/* 27 Sep 2026 (senja_fixes_2026-09-27c). Windows high contrast turns the drawn text white over the pale painting:
   give each line of home text a solid backing in that mode only. */
@media (forced-colors:active){.holding-page .ink-text{background-color:Canvas}}
/* 27 Sep 2026 (senja_fixes_2026-09-27c). Phones held in portrait show the line above the headline too ("A PRIVATE
   EVENT VENUE"), so the first screen says what Senja is. It stays hidden in landscape, as before, and below 351 px,
   where the masthead stacks and the light slider's labels sit in that spot. */
@media (min-width:351px) and (max-width:700px) and (orientation:portrait){.holding-page .eyebrow{display:block}}

/* 29 Sep 2026 (senja_fixes_2026-09-29): skip link on the home page, as on the other pages. */
.skip-link{position:fixed;top:1rem;left:1rem;z-index:1000;transform:translateY(-200%);padding:.65rem 1rem;background:var(--paper);color:var(--ink);font:1rem/1.5 Arial,sans-serif}
.skip-link:focus{transform:none}
#page-main:focus{outline:none}
