*{box-sizing:border-box}html,body{margin:0;background:#2b231a;color:#faf2e0;font-family:Georgia,'Times New Roman',serif}#house{height:100svh;min-height:500px;position:relative;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #f3d8a0;outline-offset:5px}header{position:absolute;top:0;left:0;right:0;padding:27px 34px;display:flex;align-items:center;justify-content:space-between;pointer-events:none;background:linear-gradient(#160e0866,transparent);text-shadow:0 2px 8px #241309}header .name{font-size:23px;letter-spacing:-.025em}header button{pointer-events:auto;border:0;background:none;font-size:15px;padding:10px 0;text-shadow:inherit}footer{position:absolute;bottom:0;left:0;right:0;padding:42px 34px 27px;display:flex;align-items:end;justify-content:space-between;gap:20px;pointer-events:none;background:linear-gradient(transparent,#150c0888);text-shadow:0 2px 6px #1a120d}footer>div{display:flex;flex-direction:column;gap:7px}#location{font-size:19px}footer small{font-size:12px;letter-spacing:.025em;opacity:.92}footer nav{display:flex;gap:25px;pointer-events:auto;align-items:center}footer button{background:none;border:0;border-bottom:1px solid #f9edda77;padding:12px 0;font-size:15px;text-shadow:inherit}footer button:hover{border-color:#f9edda}footer button span{margin-left:16px}#home{font-size:13px}#doorways button{position:absolute;left:0;top:0;transform:translate(-50%,-100%);background:transparent;border:0;display:flex;flex-direction:column;align-items:center;gap:10px;min-width:88px;padding:14px 12px;font-size:16px;text-shadow:0 1px 6px #000,0 1px 15px #000;transition:opacity .3s}#doorways button i{width:7px;height:7px;background:#fff4dc;border-radius:50%;box-shadow:0 0 0 6px #34221533;transition:box-shadow .2s}#doorways button:hover i{box-shadow:0 0 0 8px #fff4dc44}#loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#342c22;z-index:5}#loading span{font-size:32px}#loading small{font-size:14px;opacity:.7}[hidden]{display:none!important}#house-index,#collection{position:absolute;inset:0 0 0 auto;width:min(550px,100%);padding:78px 52px 40px;background:#f4eee1;color:#403428;z-index:6;overflow:auto;box-shadow:-20px 0 80px #21170f25}h1{font-weight:400;font-size:48px;letter-spacing:-.045em;margin:24px 0}p{font-size:17px;line-height:1.7;color:#675a4a}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:.17em}.close{position:absolute;right:28px;top:26px;background:none;border:0;font-size:13px;color:#594d40;padding:10px 0}#house-index nav{display:flex;flex-direction:column;margin-top:40px}#house-index nav button{border:0;border-top:1px solid #bbae9a80;background:none;text-align:left;padding:24px 0;font-size:25px}#house-index small{display:block;margin-top:10px;font-size:13px;color:#726452}#collection-list{margin:38px 0}#collection-list div,#collection-list :is(a,button.contact-email){display:block;border-top:1px solid #bbae9a80;padding:22px 0;color:#403428;text-decoration:none;font-size:23px}#collection-list small{display:block;font-size:14px;line-height:1.5;color:#756755;margin-top:10px}.content-note{font-size:12px;color:#837664}body:not(.ready) footer,body:not(.ready) #doorways{visibility:hidden}@media(max-width:600px){header{padding:18px 22px}header .name{font-size:21px}footer{padding:44px 22px 22px;flex-direction:column;align-items:start;gap:14px}footer nav{width:100%;justify-content:space-between;gap:16px}footer button{font-size:14px}#doorways button{font-size:14px;min-width:75px}#house-index,#collection{padding:75px 28px 32px}h1{font-size:42px}#location{font-size:17px}}
footer .room-shortcuts{display:none}@media(max-width:600px){footer .room-shortcuts{display:flex;justify-content:start;gap:25px}footer .room-shortcuts button{padding:5px 0;border:0}}

/* Geist: quiet navigation against the richly worked house. */
:root{--reading-paper:#fffbed;--reading-peach:#faeddf;--reading-hover:#f2e1ce;--reading-ink:#332e28;--reading-muted:#71685c;--reading-rule:#59452e18}
html,body{font-family:'Geist',Arial,sans-serif;color:#f8f3e9;font-weight:400;-webkit-font-smoothing:antialiased}
header .name{font-size:22px;font-weight:500;letter-spacing:-.045em}
#location{font-weight:500;letter-spacing:-.025em}
#doorways button{font-size:14px;font-weight:500;gap:14px;text-shadow:none}
#doorways button span{padding:9px 13px;background:#251b13b8;border:1px solid #f7f0e323;border-radius:5px;box-shadow:0 3px 15px #1e130c1a;transition:background .22s,transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .22s}
#doorways button:hover span,#doorways button:focus-visible span{background:#f8f3e9;color:#30251c;transform:translateY(-3px);box-shadow:0 8px 24px #1e130c33}
#doorways button i{width:5px;height:5px;position:relative;background:#f8f3e9}
#doorways button i:before{content:'';position:absolute;width:1px;height:12px;bottom:9px;left:2px;background:#f8f3e999}
#doorways button i:after{content:'';position:absolute;inset:-6px;border:1px solid #f8f3e999;border-radius:50%;transform:scale(.5);opacity:0;transition:transform .25s,opacity .25s}
#doorways button:hover i:after{transform:scale(1);opacity:1}
#doorways button:hover i{box-shadow:none}
#house-index,#collection{background:#f6f1e7;color:#30271f;animation:room-arrive .48s cubic-bezier(.16,1,.3,1);box-shadow:-30px 0 100px #170d0738}
h1{font-size:52px;line-height:1.08;letter-spacing:-.06em;font-weight:400}
p{font-size:15px;line-height:1.8}#collection-list div,#collection-list :is(a,button.contact-email){font-size:21px;letter-spacing:-.025em;transition:padding .24s,background .24s,color .24s}
#collection-list :is(a,button.contact-email):hover{padding-left:16px;padding-right:16px;background:#30271f;color:#f6f1e7;border-radius:5px}
#collection-list :is(a,button.contact-email):hover small{color:#e1d8c9}
#house-index nav button{font-size:24px;letter-spacing:-.035em;transition:padding .22s,background .22s}
#house-index nav button:hover{padding-left:12px;background:#e9e1d4}
@keyframes room-arrive{from{opacity:0;transform:translateX(32px)}to{opacity:1;transform:translateX(0)}}
#collection[data-room="The verandah"]{width:min(420px,46%);padding:78px 32px 32px}
@media(max-width:600px){#collection[data-room="The verandah"]{inset:auto 0 0;width:100%;max-height:48svh;padding:32px 26px 24px}#collection[data-room="The verandah"] h1{font-size:32px;margin:14px 0}#collection[data-room="The verandah"] #collection-list{margin:16px 0}#collection[data-room="The verandah"] .close{top:12px;right:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Screenshot-inspired reading: compact hierarchy, warm paper, soft groupings. */
body:not(.ready) #verandah-hello{visibility:hidden}
#collection[data-room="The verandah"] #collection-list small{overflow-wrap:anywhere}
header button.name{padding:6px 0;pointer-events:auto}
header button.name:hover{text-decoration:underline;text-underline-offset:5px}
html,body{font-size:16px;line-height:1.55;letter-spacing:0;font-optical-sizing:auto}
header .name{font-size:20px;letter-spacing:-.025em}
#location{font-size:17px;letter-spacing:-.012em}
#house-index,#collection{background:var(--reading-paper);color:var(--reading-ink);padding:84px 36px 36px;border-left:1px solid var(--reading-rule);box-shadow:-16px 0 64px #23180f24}
#house-index h1,#collection h1,#collection[data-room="The verandah"] h1{font-size:28px;line-height:1.25;font-weight:500;letter-spacing:-.025em;margin:14px 0 18px;text-wrap:balance}
#house-index p,#collection p{font-size:16px;line-height:1.6;font-weight:400;letter-spacing:0;color:var(--reading-ink);max-width:60ch;margin:0 0 24px}
.eyebrow{font-size:13px;line-height:1.4;font-weight:500;text-transform:none;letter-spacing:0;color:var(--reading-muted)}
#collection-intro{background:var(--reading-peach);padding:15px 17px;border-radius:15px}
#house-index nav{margin-top:28px;gap:6px}
#house-index nav button{border:0;border-radius:12px;padding:15px 17px;font-size:17px;line-height:1.45;font-weight:500;letter-spacing:-.01em}
#house-index nav button:hover,#house-index nav button:focus-visible{padding-left:17px;background:var(--reading-peach)}
#house-index small{margin-top:4px;font-size:14px;line-height:1.5;font-weight:400;color:var(--reading-muted);letter-spacing:0}
#collection-list{margin:24px 0 28px;background:var(--reading-peach);border:1px solid var(--reading-rule);border-radius:14px;overflow:hidden}
#collection-list div,#collection-list :is(a,button.contact-email){position:relative;border:0;padding:16px 18px;font-size:17px;line-height:1.5;font-weight:500;letter-spacing:-.01em;color:var(--reading-ink);transition:background .18s ease}
#collection-list>:not(:first-child){border-top:1px solid var(--reading-rule)}
#collection-list small{font-size:15px;line-height:1.55;font-weight:400;letter-spacing:0;color:var(--reading-muted);margin-top:4px;max-width:55ch}
#collection-list :is(a,button.contact-email){padding-right:42px}
#collection-list :is(a,button.contact-email):after{content:'↗';position:absolute;right:18px;top:17px;font-weight:400;color:var(--reading-muted)}
#collection-list :is(a,button.contact-email):hover,#collection-list :is(a,button.contact-email):focus-visible{padding:16px 42px 16px 18px;background:var(--reading-hover);color:var(--reading-ink);border-radius:0}
#collection-list :is(a,button.contact-email):hover small{color:var(--reading-muted)}
#collection-list :is(a,button.contact-email):focus-visible{outline-offset:-3px}
.content-note{display:block;font-size:13px;line-height:1.5;color:var(--reading-muted)}
.close{font-size:13px;font-weight:400;color:var(--reading-muted);border-radius:7px;padding:7px 9px}
.close:hover{background:var(--reading-peach);color:var(--reading-ink)}
#doorways button span{border-radius:9px;font-size:14px;letter-spacing:0}
#doorways button:hover span,#doorways button:focus-visible span{background:var(--reading-paper);color:var(--reading-ink)}
#collection ::selection,#house-index ::selection{background:#cbdcea;color:#292d31}
.accessible-name{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.intro-active header,body.intro-active #doorways,body.intro-active #verandah-hello,body.intro-active .room-shortcuts{visibility:hidden;opacity:0;pointer-events:none}
header,#doorways,#verandah-hello,.room-shortcuts{transition:opacity .5s ease}
body.intro-active footer{background:linear-gradient(transparent,#150c0877)}
body.intro-active .room-shortcuts{display:none}
#loading{z-index:7}
#enter-cue{position:absolute;left:50%;top:62%;transform:translateX(-50%);z-index:4;display:flex;flex-direction:column;align-items:center;gap:7px;color:#fff7e8;font-family:Geist,-apple-system,sans-serif;text-shadow:0 2px 8px #24170d;pointer-events:none;white-space:nowrap}
#enter-cue>span{font-size:14px;font-weight:500}
#enter-cue .enter-arrow{font-size:23px;animation:invite-in 2s ease-in-out infinite}
#enter-house{pointer-events:auto;border:1px solid #fff1d777;border-radius:30px;background:#382a1ee8;color:#fff7e8;padding:12px 23px;font-size:14px;box-shadow:0 4px 18px #24170d25;transition:background .2s,transform .2s}
#enter-house:hover{background:#55412a;transform:translateY(-2px)}
#enter-house span{margin-left:10px}
#enter-cue .swipe-label{display:none}
body:not(.ready) #enter-cue{visibility:hidden}
@keyframes invite-in{0%,100%{transform:translateY(-3px)}50%{transform:translateY(3px)}}
@media(pointer:coarse){#enter-cue .scroll-label{display:none}#enter-cue .swipe-label{display:block}}
@media(max-width:600px){#enter-cue{top:61%}}
@media(prefers-reduced-motion:reduce){#enter-cue .enter-arrow{animation:none}#enter-house{transition:none}}
@media(max-width:600px){#house-index,#collection{padding:76px 24px 28px}#house-index h1,#collection h1{font-size:26px}#collection[data-room="The verandah"] h1{font-size:24px}#house #verandah-hello{bottom:205px}}
#verandah-hello{position:absolute;left:28px;top:50%;z-index:3;display:flex;align-items:center;gap:10px;padding:10px 14px;background:#251b13cc;color:#f8f3e9;border:1px solid #f7f0e34d;border-radius:5px;font-size:14px;font-weight:500;box-shadow:0 8px 25px #1e130c33;transition:transform .25s,background .2s}#verandah-hello:hover{transform:translateX(5px);background:#f8f3e9;color:#30251c}#verandah-hello small{font-size:11px;opacity:.65;border-left:1px solid currentColor;padding-left:10px}#verandah-hello i{width:5px;height:5px;border-radius:50%;background:currentColor;margin-left:3px}@media(max-width:600px){#verandah-hello{left:18px;top:auto;bottom:128px;font-size:13px}}

/* Thinnai entrance: reveal navigation at the verandah. */
body.intro-active footer{visibility:hidden;pointer-events:none}
body:not(.arrival-entered) .drone-shell{visibility:hidden;opacity:0;pointer-events:none}
.drone-shell{transition:opacity .7s}
#enter-cue{top:auto;bottom:38px;gap:6px}
#enter-cue .enter-arrow{display:none}
#enter-house{background:#34291fe8;border-color:#f3e4c34d;border-radius:6px;padding:12px 25px}
#enter-cue>span{font-size:12px;font-weight:400;opacity:.85}
#doorways button span,#verandah-hello{border-radius:4px;background:#30271fd9}
footer .room-shortcuts{display:none}
#forward{display:none}
header{background:linear-gradient(#160e0844,transparent)}
@media(max-width:600px){#enter-cue{top:auto;bottom:30px}footer{flex-direction:row;align-items:end}footer nav{width:auto}#guidance{max-width:160px}#house #verandah-hello{bottom:185px}}
/* Email remains usable even without a configured mail handler. */
#collection #email-copy-status{position:sticky;bottom:0;margin:16px 0 0;padding:12px 16px;border-radius:10px;background:var(--reading-ink);color:var(--reading-paper);font-size:14px;box-shadow:0 4px 20px #23180f18}
#collection-list button.contact-email{width:100%;text-align:left;font-family:inherit;background:transparent;cursor:pointer}
#collection-list button.contact-email:after{content:'⧉'}
