:root{color-scheme:dark;--ink:#e5dfd0;--muted:#a3aaab;--gold:#dfc794;--nearness:0;--pan-x:0px;--pan-y:0px}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#0c1215;color:var(--ink);font:16px/1.55 Georgia,serif}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:1px solid #e1c795;outline-offset:9px}button:disabled{cursor:default}#field{position:relative;width:100%;height:100%;min-height:350px;isolation:isolate;overflow:hidden;touch-action:none;cursor:grab;background:radial-gradient(ellipse at 52% 62%,#1b252a55 0,transparent 55%),linear-gradient(164deg,#111c20 0%,#10191f 41%,#0a1117 75%,#0e1217 100%)}#field.dragging{cursor:grabbing}#grain{position:absolute;width:100%;height:100%;inset:0;opacity:.035;mix-blend-mode:screen;pointer-events:none;z-index:6}.ground{position:absolute;inset:-15%;pointer-events:none;transform:translate(calc(var(--pan-x)*.08),calc(var(--pan-y)*.08)) scale(calc(1 + var(--nearness)*.07));transition:filter 1s;filter:blur(45px)}.wash{position:absolute;border-radius:50%;opacity:.55}.wash-one{width:92%;height:56%;left:1%;top:45%;transform:rotate(-17deg);background:radial-gradient(ellipse,#829b9c0e,transparent 67%)}.wash-two{width:56%;height:70%;left:56%;top:-8%;transform:rotate(35deg);background:radial-gradient(ellipse,#31485522,transparent 70%)}.wash-three{width:69%;height:39%;left:3%;top:38%;background:radial-gradient(ellipse,#75735a0b,transparent 72%)}header{position:absolute;left:5%;right:5%;top:35px;display:flex;justify-content:space-between;align-items:center;z-index:10;pointer-events:none}header button{pointer-events:auto;background:none;border:0;padding:8px 0}#origin{font-size:18px;letter-spacing:-.02em;color:#d7d5ca}.brand-mark{font-size:22px;color:#c6ab79;margin-left:14px}#notes-button{font:11px/1.5 system-ui,sans-serif;color:#a0a8a9;letter-spacing:.02em}#notes-button span{margin-left:11px;color:#c4bcaa}#place{position:absolute;left:50%;top:51%;z-index:8;transform:translate(-50%,-50%);will-change:left,top}#house{position:relative;display:flex;align-items:center;flex-direction:column;min-width:190px;min-height:140px;border:0;background:transparent;padding:0 20px 18px;touch-action:manipulation;cursor:pointer}#house:focus-visible{outline-offset:6px;border-radius:50%}.light{height:64px;width:90px;position:relative;display:block;transform:scale(calc(1 + var(--nearness)*1.4));transform-origin:50% 50%;pointer-events:none}.heart{position:absolute;width:7px;height:7px;top:29px;left:42px;border-radius:50%;background:#f0dfb8;box-shadow:0 0 8px 2px #edd8a87d,0 0 22px 5px #dfb87028;transition:box-shadow 1s}.halo{position:absolute;width:96px;height:96px;left:-3px;top:-16px;background:radial-gradient(circle,#d0ad6c13,transparent 66%);border-radius:50%;animation:breathe 9s ease-in-out infinite;transform-origin:center}.near-halo{position:absolute;width:230px;height:160px;left:-70px;top:-49px;border-radius:50%;background:radial-gradient(ellipse,#d5b87809,transparent 65%);opacity:var(--nearness)}.name{font-size:calc(25px + var(--nearness)*13px);font-weight:400;line-height:1.2;letter-spacing:-.025em;color:#dfd7c6;transition:color .5s;margin-top:9px;white-space:nowrap}.invitation{font:9px/1.5 system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase;display:block;margin-top:17px;color:#9c9d91;opacity:.7;transition:opacity .4s,transform .4s;transform:translateY(0)}#house:hover .name{color:#f0e6ce}#house:hover .heart{box-shadow:0 0 12px 3px #edd8a89d,0 0 36px 10px #dfb87028}#house:hover .invitation{opacity:1;transform:translateY(2px)}body.near #house .invitation{opacity:0;pointer-events:none}.edge-vignette{position:absolute;inset:0;pointer-events:none;z-index:7;background:radial-gradient(ellipse at center,transparent 40%,#040a0d40 100%)}footer{position:absolute;bottom:35px;left:5%;right:5%;z-index:10;display:flex;justify-content:space-between;gap:25px;align-items:center;pointer-events:none;font:10px/1.7 system-ui,sans-serif;letter-spacing:.025em;color:#929d9f}footer button{pointer-events:auto;border:0;background:none;font:inherit;color:#a8ada8;padding:8px 0}#bearing{display:flex;align-items:center;gap:12px}.small-line{width:24px;height:1px;background:#637071}.controls{display:flex;align-items:center;gap:32px}#return{color:#d2c5a7}#return span{margin-left:10px}#motion{color:#838f92}#notes{position:absolute;z-index:20;right:3%;top:90px;bottom:90px;width:min(410px,94%);overflow:auto;background:#e9e3d3;color:#303a35;padding:37px 33px;box-shadow:0 20px 90px #0005;cursor:auto;touch-action:pan-y;border:1px solid #bdb8a2}#close-notes{position:absolute;right:16px;top:9px;border:0;background:none;color:#526057;font-size:27px;line-height:1;padding:6px}.eyebrow{font:9px/1.5 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#697265}#notes h1{font-size:43px;font-weight:400;line-height:1.04;letter-spacing:-.04em;margin:25px 0}#notes p{font-size:18px;line-height:1.5}#notes .plain{font:12px/1.8 system-ui,sans-serif;color:#616c60}.note-rule{border-top:1px solid #b6bba7;margin:25px 0}#begin-again{font:11px/1.5 system-ui,sans-serif;border:0;border-bottom:1px solid #929c83;background:none;color:#33493b;padding:9px 0;margin-top:15px}.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}body.still .halo{animation:none}@keyframes breathe{0%,100%{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.14)}}@media(max-width:600px){header{top:22px;left:7%;right:7%}#origin{font-size:17px}footer{bottom:22px;left:7%;right:7%;align-items:flex-end;gap:15px}.controls{flex-direction:column;align-items:flex-end;gap:2px}#bearing{font-size:9px;gap:8px}.small-line{width:14px}#notes{right:3%;top:75px;bottom:85px;padding:30px 25px}#notes h1{font-size:38px}#notes p{font-size:17px}}@media(prefers-reduced-motion:reduce){.halo{animation:none}*{scroll-behavior:auto!important}}

/* Public first distance. No illustrative room or internal sketch UI. */
header{justify-content:flex-start}#field{cursor:default}#house{min-height:170px;min-width:230px}.invitation{opacity:.8}.heart{width:6px;height:6px;left:42px;top:29px}#bearing{max-width:370px;align-items:flex-start}.arrival-note{position:absolute;top:calc(51% + 103px);left:50%;transform:translateX(-50%);width:min(430px,calc(100% - 48px));text-align:center;color:#a6afae;font:12px/1.85 system-ui,sans-serif;letter-spacing:.01em;z-index:8}.arrival-note p{margin:0}.trace-details{margin:17px auto 0;max-width:390px}.trace-details summary{cursor:pointer;color:#a9aaa0;font:11px/1.6 system-ui,sans-serif;text-underline-offset:4px;list-style:none;text-decoration:underline;text-decoration-color:#6f7878}.trace-details summary::-webkit-details-marker{display:none}.trace-details[open]{padding:15px 18px;background:#142026f0;border:1px solid #45515277;text-align:left;border-radius:2px}.trace-details[open] summary{margin-bottom:10px}.trace-details p{font-size:11px;line-height:1.8;color:#c2c6bf}.computer-invitation{display:none}.entering .arrival-note{opacity:0;transition:opacity .32s}.entering #place{transition:transform .65s cubic-bezier(.2,.65,.25,1);transform:translate(-50%,-50%) scale(2.2)}.entering .name{opacity:0;transition:opacity .45s}.entering .invitation{opacity:0}.entering .heart{box-shadow:0 0 25px 10px #edd8a8aa,0 0 80px 30px #dfb87030}.entering header,.entering footer{opacity:0;transition:opacity .35s}.trace-details:focus-within{outline:1px solid #b6c0b4;outline-offset:6px}@media(max-width:640px){.computer-invitation{display:block;margin-top:14px!important;color:#a5afa8;font:11px/1.8 system-ui,sans-serif}.arrival-note{top:calc(45% + 95px)}#place{top:45%!important}footer{bottom:16px}#bearing{max-width:240px;font-size:9px}#house{min-height:140px}}@media(max-height:540px){#place{top:37%!important}.arrival-note{top:calc(37% + 72px);font-size:11px}.trace-details{margin-top:8px}header{top:12px}footer{bottom:10px}}@media(prefers-reduced-motion:reduce){.entering #place,.entering .name,.entering header,.entering footer,.entering .arrival-note{transition:none}}

#house{color:inherit;text-decoration:none}#house:focus-visible{outline:1px solid #e1c795;outline-offset:9px}
/* Let the optional note open within the ground rather than below the screen. */
#field:has(.trace-details[open]) #place{top:30%!important;transition:top .35s ease}
.arrival-note:has(.trace-details[open]){top:44%;transition:top .35s ease}
.trace-details[open]{max-height:35vh;overflow:auto;touch-action:pan-y;scrollbar-width:thin}
@media(max-width:640px){#field:has(.trace-details[open]) #place{top:25%!important}.arrival-note:has(.trace-details[open]){top:39%}.arrival-note:has(.trace-details[open]) .computer-invitation{display:none}}
@media(prefers-reduced-motion:reduce){#field:has(.trace-details[open]) #place,.arrival-note:has(.trace-details[open]){transition:none}}