/* The House opening: motion only when the visitor allows it. */
.house-entrance {
  position: relative;
  display: grid;
  place-items: center;
  align-content: center;
  gap: clamp(12px, 2vw, 24px);
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100svh;
  padding: 64px 24px 104px;
  background: #000;
  color: #eee9df;
  text-align: center;
}
.house-entrance h1 {
  margin: 0;
  max-width: 100%;
  font-family: 'Bodoni Moda', Georgia, serif;
  font-weight: 400;
  font-size: clamp(28px, 7vw, 112px);
  line-height: 1.3;
  letter-spacing: .045em;
}
.house-entrance-tagline {
  margin: 0;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.35;
  font-weight: 400;
  letter-spacing: .015em;
}
@media (prefers-reduced-motion: no-preference) {
  .house-entrance h1 { animation: house-arrive 3.8s ease-out both; }
  .house-entrance-tagline { animation: house-arrive 2.6s .9s ease-out both; }
}
@keyframes house-arrive {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.house-clock { margin-top: 10px; color: #eee9df; }
.house-clock svg { display: block; transition: transform 2.4s ease-in-out; }
.hourglass-frame { fill: none; stroke: currentColor; stroke-width: 1; stroke-linecap: round; opacity: .7; }
.hourglass-case { fill: none; stroke: currentColor; stroke-width: .75; stroke-linejoin: round; opacity: .85; }
.hourglass-glint { stroke-width: .5; opacity: .35; }
.hourglass-sand { fill: currentColor; opacity: .7; }
.sand-stream { fill: none; stroke: currentColor; stroke-width: 1; stroke-linecap: round; stroke-dasharray: 1 8; }
.entrance-down { position: absolute; bottom: max(22px,env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); display: grid; place-items: center; gap: 12px; padding: 8px 14px; color: #eee9df; }
.entrance-down span { font-family: 'Bodoni Moda', Georgia, serif; font-size: 10px; letter-spacing: .24em; white-space: nowrap; }
.entrance-down svg { fill: none; stroke: currentColor; stroke-width: 1; }
.entrance-down:focus-visible { outline: 1px solid #eee9df; outline-offset: 5px; }
#houseNavigation { padding: 36px 20px 40px; outline: none; }
#houseNavigation .nav { margin-top: 0; }
@media(prefers-reduced-motion:no-preference) {
 .house-clock { animation: house-arrive 2s 1.5s both; }
 .sand-stream { animation: sand-fall 1.8s linear infinite; }
 .is-flipped .sand-stream { animation-direction: reverse; }
 .entrance-down svg { animation: entrance-drift 2.8s ease-in-out infinite; }
}
@media(prefers-reduced-motion:reduce) { .house-clock svg { transition: none; } }
@keyframes sand-fall { to { stroke-dashoffset: -18; } }
@keyframes entrance-drift { 50% { transform: translateY(5px); opacity: .45; } }
.house-celestial { margin: 0; color: #eee9df; width: 240px; max-width: 100%; }
.house-celestial[hidden] { display: none; }
.celestial-map { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.celestial-engraving { fill: none; stroke: currentColor; stroke-width: .65; stroke-linecap: round; }
.celestial-orbit { opacity: .28; stroke-dasharray: 1 4; }
.celestial-stars { opacity: .35; }
.celestial-labels { fill: currentColor; font: 6px Georgia,serif; letter-spacing: 1.5px; text-anchor: middle; opacity: .55; }
.house-celestial figcaption { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 5px; font: 8px Georgia,serif; letter-spacing: .18em; }
@media(prefers-reduced-motion:no-preference) { .house-celestial { animation: house-arrive 2s 1.8s both; } }
@media(max-height:650px) {
 .house-entrance { gap: 9px; padding-top: 28px; padding-bottom: 105px; }
 .house-clock { margin-top: 0; }
 .house-clock svg { width: 60px; height: 75px; }
 .house-celestial { width: 210px; }
}

.clock-dock { position: fixed; z-index: 1300; right: max(20px,env(safe-area-inset-right)); bottom: max(20px,env(safe-area-inset-bottom)); display: grid; justify-items: end; gap: 10px; }
.clock-dock .house-clock { display: grid; place-items: center; margin: 0; padding: 6px; border: 0; background: #000; border-radius: 0; min-width: 48px; min-height: 56px; box-shadow: none; }
.clock-dock .house-clock svg { width: 38px; height: 48px; }
#houseTime { font: 24px/1.2 'Bodoni Moda',Georgia,serif; font-variant-numeric: tabular-nums; letter-spacing: .06em; color: #eee9df; background: #000; padding: 5px 8px; }
#houseTime[hidden] { display: none; }
.house-rooms,.cosmos-room { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 70px 28px 110px; color: #eee9df; background: #000; text-align: center; outline: none; }
.rooms-kicker { font-size: 11px; letter-spacing: .3em; margin: 0 0 60px; opacity: .6; }
.house-doors { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(28px,7vw,100px); }
.house-door { display: grid; justify-items: center; gap: 25px; padding: 24px 12px; background: transparent; color: #eee9df; border: none; box-shadow: none; min-width: 190px; }
.house-door svg { fill: none; stroke: currentColor; stroke-width: .65; transition: transform .8s ease,opacity .8s ease; opacity: .7; }
.house-door span { font: 11px 'Bodoni Moda',Georgia,serif; letter-spacing: .14em; }
.house-door:hover svg { opacity: 1; transform: rotate(8deg); }
.house-door:focus-visible,.house-clock:focus-visible,.cosmos-back:focus-visible { outline: 1px solid #eee9df; outline-offset: 5px; }
.cosmos-room[hidden] { display: none; }
.cosmos-back { position: absolute; top: 28px; left: 28px; padding: 12px; border: 0; background: none; color: #eee9df; font-size: 10px; letter-spacing: .15em; }
.cosmos-room h2 { font: 400 clamp(28px,4vw,54px) 'Bodoni Moda',Georgia,serif; margin: 20px 0 32px; }
.cosmos-room .house-celestial { width: min(850px,100%); animation: none; }
.cosmos-room .celestial-map { width: 100%; }
.cosmos-room .house-celestial figcaption { margin-top: 28px; font-size: 11px; letter-spacing: .2em; gap: 12px; }
.cosmos-room .house-celestial figcaption svg { width: 24px; height: 24px; }
.cosmos-footnote { margin: 26px 0 0; font-family: Georgia, 'Times New Roman', serif; font-size: 25px; opacity: .6; }
@media(prefers-reduced-motion:reduce) { .house-door svg { transition: none; } .house-door:hover svg { transform: none; } }
@media(display-mode:standalone) { .clock-dock { bottom: max(64px,calc(env(safe-area-inset-bottom) + 58px)); } }

.house-doors { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(960px,100%);gap:clamp(12px,4vw,60px); }
.house-door { min-width:0; }
.fortune-room { position:relative;min-height:100vh;min-height:100svh;padding:70px 24px 110px;background:#000;color:#eee9df;text-align:center;outline:none; }
.fortune-room[hidden],.fortune-delivery[hidden],.fortune-reading[hidden] { display:none !important; }
.fortune-back { position:absolute;top:28px;left:28px;padding:12px;border:0;background:none;color:#eee9df;font-size:10px;letter-spacing:.15em; }
.fortune-room h2 { font:400 clamp(28px,4vw,46px) 'Bodoni Moda',Georgia,serif;margin:6px 0; }
.fortune-invitation { font:26px Georgia, 'Times New Roman', serif;opacity:.65;margin:10px 0 24px; }
.fortune-machine { position:relative;width:224px;max-width:100%;margin:0 auto 80px; }
.fortune-machine-button { display:block;width:100%;padding:0;border:0;background:none;color:#eee9df;box-shadow:none; }
.fortune-machine-button svg { display:block;width:100%;height:auto; }
.fortune-machine-button:disabled { opacity:1;cursor:default; }
.cabinet-lines { fill:none;stroke:currentColor;stroke-width:.8;stroke-linejoin:round;stroke-linecap:round; }
.cabinet-curtains { opacity:.45; }
.cabinet-type { fill:currentColor;font:8px Georgia,serif;letter-spacing:2px;text-anchor:middle; }
.cabinet-type text:last-child { font-size:5px;letter-spacing:1.5px; }
.teller-eyes { fill:currentColor; }
.crystal-ball { fill:#eee9df0a; }
.fortune-delivery { position:absolute;top:86.5%;left:20%;width:60%;height:108px;overflow:hidden;padding:0 2px 2px; }
#fortuneSlip { display:flex;flex-direction:column;justify-content:space-between;gap:20px;width:100%;height:88px;padding:18px 6px 12px;background:#e7dfce;color:#191713;border:1px solid #a99c83;border-radius:0;box-shadow:0 4px 15px #0008;transform:translateY(-100%);font:8px Georgia,serif;letter-spacing:.15em; }
#fortuneSlip span:first-child { font-size:12px;letter-spacing:.22em; }
#fortuneSlip:disabled { opacity:1; }
.dispensing #fortuneSlip { animation:fortune-paper 4.2s cubic-bezier(.3,.1,.3,1) forwards; }
.has-fortune #fortuneSlip { transform:translateY(0); }
.fortune-status { font:11px/1.7 'Bodoni Moda',Georgia,serif;letter-spacing:.05em;color:#b5ab9b;max-width:340px;margin:0 auto;min-height:38px; }
.fortune-reading { max-width:500px;margin:24px auto 0;padding:28px clamp(18px,4vw,38px);background:#e7dfce;color:#191713;border:1px solid #a99c83;outline-offset:5px; }
.fortune-number { font:8px Georgia,serif;letter-spacing:.17em; }
#fortuneWords { font:400 clamp(22px,3vw,30px)/1.45 'Bodoni Moda',Georgia,serif;margin:24px 0; }
.fortune-signature { display:block;font:28px Georgia, 'Times New Roman', serif; }
#anotherFortune { display:block;margin:22px auto 0;padding:12px 0;background:none;color:inherit;border:0;border-bottom:1px solid #746956;font:9px Georgia,serif;letter-spacing:.16em; }
.fortune-room button:focus-visible { outline:1px solid currentColor;outline-offset:5px; }
@keyframes fortune-paper { from{transform:translateY(-100%)}to{transform:translateY(0)} }
@keyframes oracle-breath { 50%{fill:#eee9df30;filter:drop-shadow(0 0 3px #eee9df55)} }
@media(prefers-reduced-motion:no-preference){.dispensing .crystal-ball{animation:oracle-breath 2.1s ease-in-out 2;}}
@media(prefers-reduced-motion:reduce){.dispensing #fortuneSlip{animation:none;transform:translateY(0);}}
@media(max-width:600px){
 .house-rooms{padding-left:16px;padding-right:16px;}
 .house-door{padding:18px 0;gap:18px;}
 .house-door svg{width:60px;height:60px;}
 .house-door span{font-size:9px;line-height:1.8;letter-spacing:.09em;}
 .rooms-kicker{margin-bottom:36px;}
}