@font-face{font-family:Field Sans;src:url('assets/nimbus-sans-regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Field Roman;src:url('assets/nimbus-roman-regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
/* Three visual roles only: neutral field, ink, faint optical focus. */
:root{scrollbar-gutter:stable;--field:#f8f9fa;--ink:#383e43;--focus:#e9edf0;color:var(--ink);background:var(--field);font-family:Field Sans,Arial,sans-serif;font-synthesis:none;scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0}
button,a,summary{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
button,a,summary{touch-action:manipulation}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:1px solid var(--ink);outline-offset:7px}
[tabindex="-1"]:focus{outline:none}
[hidden]{display:none!important}
/* Clip at an in-viewport origin: Safari can paint translated links in browser chrome. */
.skip{position:fixed;left:24px;top:calc(24px + env(safe-area-inset-top,0px));z-index:10;background:var(--field);width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip:focus-visible{width:auto;height:auto;padding:12px;overflow:visible;clip-path:none}
.light{position:fixed;inset:-15%;pointer-events:none;background:radial-gradient(ellipse at 57% 47%,var(--focus),transparent 52%);opacity:.48;z-index:-1}
.brand{position:absolute;z-index:1;left:calc(29% - 29px);top:24svh;display:grid;place-items:center;width:58px;height:58px;transition:opacity .6s}
.brand::before{content:"";position:absolute;inset:-10px}
.brand:focus-visible{outline:1px solid var(--ink);outline-offset:10px}
.brand img{display:block;width:100%;height:auto}
.orient,.close{position:fixed;right:6.1vw;bottom:6.5svh;min-height:44px;padding:8px 0;display:flex;align-items:center;gap:27px;font-size:13px;letter-spacing:.015em;z-index:3}
.close{margin-right:var(--scrollbar-width,0px)}
/* Legacy legal-page controls retain their existing appearance. */
.nav-icon{position:relative;display:block;flex:0 0 17px;width:17px;height:17px}
.nav-icon::before,.nav-icon::after{content:"";position:absolute;background:currentColor}
.nav-icon::before{width:11px;height:1px;left:3px;top:8px}
.nav-icon::after{width:1px;height:11px;left:8px;top:3px;transform:rotate(0deg);transition:transform 240ms cubic-bezier(.4,0,.2,1)}
body.orienting .orient .nav-icon::after,.close .nav-icon::after{transform:rotate(90deg)}
dialog[open] .close .nav-icon::after{animation:icon-open 240ms cubic-bezier(.4,0,.2,1)}
@keyframes icon-open{from{transform:rotate(0deg)}to{transform:rotate(90deg)}}
main{transition:opacity .5s ease}
section{position:relative;min-height:110svh}
.threshold{min-height:104svh;padding:47svh 8vw 24svh 44%}
h1,h2,p{margin:0;font-weight:400}
h1{font-size:clamp(24px,2.15vw,32px);line-height:1.65;letter-spacing:-.025em}
h1 span{display:inline-block;margin-left:2.1em}
.opening{padding:23svh 13vw 29svh 27%}
.setting{max-width:490px}
h2{font-size:13px;line-height:1.5;letter-spacing:.015em;margin-bottom:42px}
.opening p{font-size:24px;line-height:1.5;letter-spacing:-.018em;max-width:420px}
.opening .afterthought{font-family:Field Roman,Georgia,serif;font-size:23px;line-height:1.5;margin:58px 0 0 23%}
.quiet-link{display:inline-flex;align-items:center;gap:26px;min-height:44px;font-size:13px;line-height:1.5}
.opening .quiet-link{margin-top:62px}
.quiet-link span{transition:transform .35s}
.quiet-link:hover span{transform:translateY(3px)}
.thought{padding:31svh 12vw 24svh 45%;min-height:116svh}
.question{font-size:30px;line-height:1.65;letter-spacing:-.025em}
.question span{display:inline-block;margin-left:1.4em}
.reading{margin-top:48px;max-width:360px}
summary{list-style:none;cursor:pointer;font-size:13px;min-height:44px;display:flex;align-items:center;gap:25px;width:fit-content}
summary::-webkit-details-marker{display:none}
.disclosure-icon{display:inline-block;flex:none;font-size:17px;letter-spacing:normal;transition:transform .4s}
.reading[open] .disclosure-icon,body.orienting .orient .disclosure-icon,.close .disclosure-icon{transform:rotate(45deg)}
dialog[open] .close .disclosure-icon{animation:disclosure-open .4s ease}
@keyframes disclosure-open{from{transform:rotate(0deg)}to{transform:rotate(45deg)}}
.thought-label{display:grid}
.thought-label>span{grid-area:1 / 1}
.reading:not([open]) .when-open,.reading[open] .when-closed{visibility:hidden}
.excerpt{padding-top:24px}
.excerpt p{font-family:Field Roman,Georgia,serif;font-size:22px;line-height:1.5}
.excerpt small{display:block;margin-top:24px;font-size:12px;line-height:1.5}
.return{position:absolute;left:6.1vw;bottom:6.5svh}
dialog{position:fixed;inset:0;width:100vw;height:100%;scrollbar-gutter:stable;max-width:none;max-height:none;margin:0;border:0;padding:0;color:var(--ink);background:var(--field)}
dialog::backdrop{background:var(--field)}
/* One typographic sequence; the secondary line belongs to the same setting. */
.orientation-composition{width:min(560px,62vw);margin:24svh 0 10svh 30%}
.way{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.way>a,.way>.access{font-size:clamp(25px,2.3vw,33px);line-height:1.5;min-height:48px;padding:3px 0;letter-spacing:-.025em;transition:opacity .4s,transform .5s,letter-spacing .5s}
.way>a:nth-child(2){margin-left:2.2em}
.way>.access{margin-left:2.2em}
#access-note{font-size:13px;line-height:1.7;margin:0 0 0 5.6em;max-width:240px}
#orientation[data-coordinate]:not([data-coordinate=""]) .way>:is(a,button):not(.focused){opacity:.58}
.way>.focused{transform:translateX(3px);letter-spacing:-.012em}
.way>:focus-visible{outline:none;text-shadow:0 0 .6px currentColor;letter-spacing:.025em!important}
body.orienting main,body.orienting .brand{opacity:0}
body.orienting{overflow:hidden}
dialog[open] .orientation-composition{animation:orientation-in .55s ease-out both}
.service{display:flex;gap:22px;flex-wrap:wrap;align-items:center;font-size:12px;line-height:1.5}
.service a{display:inline-flex;align-items:center;min-height:44px}
.orientation-composition>.service{margin:45px 0 0 6em;gap:14px}
.static-nav>.service{flex-basis:100%;margin-top:24px}
.static-nav{padding:40px 8vw;display:flex;gap:30px;flex-wrap:wrap}
@keyframes orientation-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:900px){.brand{left:calc(22% - 26px);width:52px}.threshold{padding-left:35%}h1{font-size:27px}.opening{padding-left:22%;padding-right:15%}.thought{padding-left:32%;padding-right:8%}}
@media(max-width:540px){.brand{left:36px;top:17svh;width:48px;height:48px}.threshold{padding:44svh 28px 25svh 36px;min-height:108svh}h1{font-size:25px;line-height:1.7}h1 span{margin-left:1.45em}.orient,.close{right:30px;bottom:30px;gap:23px}.opening{padding:24svh 36px 22svh;min-height:110svh}.opening p{font-size:22px;line-height:1.55}.opening .afterthought{font-size:22px;margin-top:42px;margin-left:24px}h2{font-size:12px;margin-bottom:34px}.opening .quiet-link{margin-top:48px}.thought{padding:29svh 28px 23svh 48px;min-height:112svh}.question{font-size:26px}.question span{margin-left:24px}.reading{margin-top:42px}.excerpt p{font-size:21px}.return{left:36px;bottom:105px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.light{opacity:.35}}

/* The signet's dense horizontal strokes need more edge tension than the label. */
.brand{position:absolute;left:5.2vw;top:42px;width:52px;height:52px}
.orient,.close{top:auto;bottom:6.5svh;right:6.1vw;gap:20px}
dialog{overflow-y:auto}
@media(max-width:900px){.brand{left:5vw;top:38px;width:48px;height:48px}.orient,.close{top:auto;bottom:5svh;right:6vw}.orientation-composition{margin-left:25%;width:65vw}}
@media(max-width:540px){.brand{left:25px;top:27px;width:44px;height:44px}.orient,.close{top:auto;bottom:max(28px,env(safe-area-inset-bottom));right:30px;gap:17px;font-size:12px}.orientation-composition{margin:26svh 28px 60px 48px;width:auto}.way{gap:19px}.way>a,.way>.access{font-size:27px}.way>a:nth-child(2),.way>.access{margin-left:1.2em}.orientation-composition>.service{margin:34px 0 0 32px;gap:12px}#access-note{margin-left:32px;font-size:12px}}
@media(max-height:500px){.orientation-composition{margin-top:100px;margin-bottom:40px}.way{gap:8px}.orientation-composition>.service{margin-top:16px}}

/* Five coordinates share one focus language, with a quieter legal register. */
.orientation-composition{margin-top:20svh;margin-bottom:130px}
.way{gap:17px}
.way>a.secondary{font-size:clamp(19px,1.65vw,24px);margin-left:3.1em;min-height:44px}
.way>a.secondary+ a.secondary{margin-left:4.35em}
.static-nav{padding-bottom:100px;flex-direction:column;align-items:flex-start;gap:12px}
.static-nav>a,.static-nav summary{min-height:44px;display:flex;align-items:center}
.static-nav>.secondary{font-size:14px;margin-left:24px}
@media(max-width:540px){.orientation-composition{margin-top:21svh;margin-bottom:120px}.way{gap:14px}.way>a.secondary{font-size:21px;margin-left:1.55em}.way>a.secondary+a.secondary{margin-left:2.4em}}
@media(max-height:600px){.orientation-composition{margin-top:45px;margin-bottom:110px}.way{gap:6px}}
@media print{.orient,.brand,dialog,.static-nav{display:none!important}}

/* A shared utility position; without JavaScript the original end link remains. */
.return-ready:is(.return,.legal-return){position:fixed;left:6.1vw;bottom:6.5svh;margin:0;z-index:3;visibility:hidden;pointer-events:none}
.return-ready.is-visible{visibility:visible;pointer-events:auto}
@media(max-width:900px){.return-ready:is(.return,.legal-return){left:6vw;bottom:5svh}}
@media(max-width:540px){
  .return-ready:is(.return,.legal-return){left:30px;bottom:max(28px,env(safe-area-inset-bottom));font-size:12px;gap:17px}
}
@media print{.return-ready{display:none!important}}

/* Shared utility backing, preserving the existing desktop/tablet footprint. */
.denkraum .orient::before{content:"";position:fixed;inset:auto 0 0;height:calc(6.5svh + 44px);background:var(--field);z-index:-1;pointer-events:none}
@media(max-width:1100px){.essay .orient::before{content:"";position:fixed;inset:auto 0 0;height:calc(11svh + 44px);background:var(--field);z-index:-1;pointer-events:none}}

/* viewport-fit=cover exposes the actual iOS insets. Opaque edge surfaces keep
   scrolling text out of the system areas, including while the dialog is open. */
@media screen{
  :root{--shell-top:env(safe-area-inset-top,0px);--shell-bottom:env(safe-area-inset-bottom,0px);scroll-padding-top:var(--shell-top)}
  body{padding-top:var(--shell-top)}
  body::before,dialog::before{content:"";position:fixed;inset:0 0 auto;height:var(--shell-top);background:var(--field);z-index:4;pointer-events:none}
  dialog{padding-top:var(--shell-top);height:100%;height:100dvh}
}
@media screen and (max-width:540px), screen and (pointer:coarse) and (max-height:540px){
  :root{--shell-utility:calc(88px + var(--shell-bottom));scroll-padding-bottom:var(--shell-utility)}
  body.shell-ready{padding-bottom:var(--shell-utility)}
  .brand{top:calc(27px + var(--shell-top))}
  .orient,.close,.return-ready:is(.return,.legal-return){bottom:calc(28px + var(--shell-bottom))}
  .orient,.close{right:max(30px,env(safe-area-inset-right,0px))}
  .return-ready:is(.return,.legal-return){left:max(30px,env(safe-area-inset-left,0px))}
  .orient::before{display:none}
  body.shell-ready::after,dialog::after{content:"";position:fixed;inset:auto 0 0;height:var(--shell-utility);background:var(--field);z-index:2;pointer-events:none}
  dialog{padding-bottom:var(--shell-utility);scroll-padding-bottom:var(--shell-utility)}
}