.site-awning { --awning-fabric-ready: 1; position: relative; z-index: 1; width: 100%; height: clamp(150px, 22.5vw, 337.5px); background: var(--cream); pointer-events: none; }
.site-awning img { width: 100%; max-width: none; height: 100%; object-fit: fill; }
.awning-fabric { position: absolute; inset: -20px 0; width: 100%; height: calc(100% + 40px); pointer-events: none; }
.awning-fixed-rail { position: absolute; inset: 0; background-size: 100% 100%; background-repeat: no-repeat; pointer-events: none; }
.site-awning.is-fabric-active > img { opacity: 0; }
.awning-supports { position: absolute; z-index: 3; inset: 0; background-size: 100% 100%; background-repeat: no-repeat; pointer-events: none; }
.entrance-art { padding: max(82px, var(--entrance-tools-space, 0px)) clamp(12px, 4vw, 72px) 100px; }
.entrance-backdrop { inset: 0; transform: none; transition: none; background: radial-gradient(ellipse at 24% 18%, #fff8e9, transparent 62%), linear-gradient(#f5ebdd 72%, #e6dac3); }
.entrance-shop { display: block; width: min(1100px, 100%); height: min(790px, 100%); transform: none; transition: none; isolation: isolate; container-type: size; }
.bakery-entrance.is-entering .entrance-shop { animation: none; }
.entrance-masonry { position: absolute; inset: 21% 5% 9%; background: linear-gradient(90deg, rgb(255 249 226 / 18%), transparent 65%, rgb(84 58 36 / 17%)), var(--facade-plaster) center / 490px 490px, #e9d9bc; border-inline: 1px solid #b99d7c; box-shadow: 7px 4px 0 #b8a080; }
.entrance-masonry::after { content: ""; position: absolute; inset: auto 0 0; height: 16%; background: repeating-linear-gradient(0deg, transparent 0 16px, #d3bea3 16px 19px), repeating-linear-gradient(90deg, #a38167 0 58px, #d3bea3 58px 61px, #b48f72 61px 117px, #d3bea3 117px 120px); border-top: 5px solid #bfa484; box-shadow: inset 0 3px 0 #e8d0ad; }
.entrance-upper-storey { position: absolute; inset: 0 0 auto; display: block; width: 100%; height: 25%; }
.entrance-upper-storey img { width: 100%; height: 100%; object-fit: fill; }
.entrance-sign { position: absolute; z-index: 2; left: 8%; top: 24%; width: 84%; height: 15%; display: flex; align-items: center; justify-content: center; gap: clamp(10px, 2.2vw, 28px); margin: 0; padding: 4px 20px; border: 4px solid #493729; border-radius: 2px; color: #fffaf1; background: var(--sign-wood) center / cover no-repeat, #62432f; box-shadow: inset 0 2px 0 #c19b70, inset 0 -2px 0 #a47d54, 0 5px 0 #8a6a4c, 0 9px 9px rgb(52 37 25 / 20%); }
.entrance-sign::after { content: ""; position: absolute; inset: 5px; border: 1px solid rgb(225 188 132 / 38%); pointer-events: none; }
.entrance-sign .entrance-sign-mark { width: auto; max-width: 16%; height: 82%; max-height: 100px; aspect-ratio: 1; object-fit: contain; margin: 0; padding: 7px; border: 1px solid #d9b47c; border-radius: 50%; background: #fffaf1; box-shadow: 1px 2px 0 #b99a70, 3px 4px 0 #765333, 5px 7px 0 #3c291b, 7px 9px 7px rgb(15 9 4 / 72%), 0 0 3px #fff3d5, 0 0 19px rgb(255 205 116 / 70%); }
.entrance-sign-copy { display: grid; justify-items: center; min-width: 0; }
.entrance-wordmark { display: block; white-space: nowrap; font: 400 clamp(24px, 6.4cqh, 55px)/1.22 var(--script); color: #fffaf1; text-shadow: 0 -1px 0 #fffdf6, 1px 1px 0 #d4b184, 2px 2px 0 #a68055, 3px 3px 0 #785232, 4px 4px 0 #432b1a, 7px 10px 5px rgb(14 8 3 / 82%), 0 0 3px #fff0c0, 0 0 11px rgb(255 203 98 / 85%), 0 0 28px rgb(255 165 50 / 50%); }
.entrance-descriptor { color: #f5ebdd; font: 500 13px/1.3 var(--sans); margin-top: 3px; text-shadow: 0 2px 2px #291c11; }
.entrance-cornice { position: absolute; z-index: 3; left: 4%; top: 39%; width: 92%; height: 2%; min-height: 8px; background: linear-gradient(#e6d0aa, #b19a74 35%, #745e43 39%, #b19972 66%, #dac199); box-shadow: 0 6px 9px rgb(75 54 35 / 18%); }
.entrance-awning { position: absolute; z-index: 5; left: 4%; top: 40%; width: 92%; height: 11%; margin: 0; border: 0; border-radius: 0; background: none; filter: drop-shadow(3px 7px 3px rgb(66 43 26 / 18%)); }
.entrance-awning img { width: 100%; height: 100%; object-fit: fill; }
.entrance-pier { position: absolute; z-index: 3; top: 40%; bottom: 10%; width: 5%; border-inline: 1px solid #9b825e; background: linear-gradient(90deg, #dac8a7, #f1e2c4 20%, #d6c2a0 38%, #c6ad89 78%, #ab8e6a); box-shadow: 5px 2px 5px rgb(74 53 33 / 12%); }
.entrance-pier-left { left: 5.8%; }
.entrance-pier-right { right: 5.8%; }
.entrance-pier::before { content: ""; position: absolute; inset: 0 -8% auto; height: 9%; background: linear-gradient(#f3e3c3, #b69e7b 36%, #e3cda8 45%, #bea17c); border: 1px solid #ac926f; }
.entrance-pier::after { content: ""; position: absolute; inset: auto -12% 0; height: 13%; background: linear-gradient(#d9c4a1, #a89070 28%, #e0caaa 33%, #b79b77); border: 1px solid #9e8565; }
.entrance-doorway { position: absolute; left: 10.8%; right: 10.8%; top: 48%; bottom: 11%; width: auto; margin: 0; }
.entrance-bell-mount { top: -4px; width: 18px; height: 10px; left: calc(50% - 9px); z-index: 6; background: #c4a579; border-color: #675137; }
.entrance-bell { top: 2px; width: 42px; height: 45px; left: calc(50% - 21px); z-index: 6; }
.entrance-doorframe { isolation: isolate; display: block; background: #eadcc4; border: 9px solid #34483a; border-top-width: 12px; border-radius: 2px 2px 0 0; box-shadow: inset 0 0 0 3px #8a9979, -3px -2px 0 #ecdfc3, 5px 4px 0 #9b8a6c, 0 7px 7px rgb(49 36 24 / 18%); }
.entrance-doorframe::before { content: none; }
.entrance-room { --bakery-scene-ready: 1; position: absolute; inset: 0; overflow: hidden; background: #f2e6d0; border-radius: 3px 3px 0 0; }
.entrance-room::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 45px rgb(91 64 34 / 16%); pointer-events: none; }
.entrance-room-poster { display: block; position: absolute; inset: -5%; width: 110%; height: 110%; transform: translate(calc(var(--look-x, 0) * -3%), calc(var(--look-y, 0) * -3%)); transition: transform .12s ease-out; pointer-events: none; }
.entrance-room-poster img { width: 100%; height: 100%; object-fit: cover; }
.bakery-interior { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.entrance-room.is-3d-ready .entrance-room-poster { visibility: hidden; }
.entrance-door { position: absolute; top: 0; z-index: 2; width: 29%; overflow: hidden; background: transparent; border: 2px solid var(--green); }
.entrance-door-left { left: 21%; }
.entrance-door-right { right: 21%; }
.entrance-glass { inset: 9px 7px 18%; isolation: isolate; display: flex; align-items: flex-end; justify-content: center; background-color: transparent; background-image: none; border: 3px double #ded8ba; border-radius: 9px 9px 2px 2px; box-shadow: 0 0 0 420px var(--green), inset 0 0 12px rgb(255 250 241 / 12%); }
.entrance-fixed-bay { position: absolute; z-index: 2; top: 0; bottom: 0; width: 21%; overflow: hidden; border-inline: 4px solid #34483a; }
.entrance-fixed-bay-left { left: 0; }
.entrance-fixed-bay-right { right: 0; }
.entrance-display-glass { position: absolute; inset: 9px 6px 18%; border: 3px double #ded8ba; border-radius: 3px; background: linear-gradient(125deg, rgb(255 250 241 / 15%), transparent 35% 71%, rgb(255 250 241 / 8%) 72% 74%, transparent 75%); box-shadow: 0 0 0 300px #34483a, inset 0 0 10px rgb(37 36 22 / 14%); }
.entrance-display-glass::after { content: ""; position: absolute; inset: 22% -2px auto; height: 5px; border-top: 1px solid #acb391; background: #425845; }
.entrance-bay-panel { position: absolute; inset: auto 7px 7px; height: 12%; border: 2px solid #718269; background: linear-gradient(135deg, #4a604b, #34483a); box-shadow: inset 2px 3px 0 #293e30; }
.entrance-glass::after { content: ""; position: absolute; z-index: 2; inset: 0; border-radius: inherit; background: linear-gradient(125deg, rgb(255 250 241 / 18%), transparent 28% 45%, rgb(255 250 241 / 10%) 46% 50%, transparent 51%); pointer-events: none; }
.entrance-glass img, .entrance-glass svg { width: 34px; max-width: 20%; height: auto; margin-bottom: 13px; opacity: .7; }
.entrance-glass { --neon-tube: #fffdf5; --neon-halo: #ffd39b; --neon-spill: rgb(255 190 112 / 32%); }
.entrance-door-right .entrance-glass { --neon-tube: #fff3ed; --neon-halo: #ffa995; --neon-spill: rgb(255 160 138 / 30%); }
.entrance-glass::before { content: ""; position: absolute; z-index: 0; left: 50%; bottom: 2px; width: 78px; max-width: 100%; height: 56px; transform: translateX(-50%); background: radial-gradient(ellipse, var(--neon-spill), transparent 70%); pointer-events: none; }
/* Only the two pane emblems glow; the hanging plaque and its cord stay unlit. */
.entrance-glass > img, .entrance-glass > svg { position: relative; z-index: 1; opacity: 1; overflow: visible; pointer-events: none; }
.entrance-glass > img { filter: brightness(0) invert(1) sepia(.12) drop-shadow(0 0 1px var(--neon-tube)) drop-shadow(0 0 2.5px var(--neon-halo)) drop-shadow(0 0 6px var(--neon-halo)); }
.entrance-glass > svg { filter: drop-shadow(0 0 1px var(--neon-tube)) drop-shadow(0 0 2.5px var(--neon-halo)) drop-shadow(0 0 6px var(--neon-halo)); }
.entrance-glass > svg path { stroke: var(--neon-tube); stroke-width: 3.5; }
.entrance-open-sign { position: absolute; z-index: 1; top: 6px; right: 7px; width: min(106px, calc(100% - 12px)); transform: rotate(-4deg); transform-origin: 50% 5px; pointer-events: none; }
.entrance-open-sign .open-sign-cord { display: block; width: 100%; max-width: none; height: 5px; margin: 0; opacity: 1; }
.open-sign-board { position: relative; display: grid; justify-items: center; gap: 1px; padding: 3px 4px 2px; border: 2px solid var(--green); border-radius: 8px 6px 8px 6px; background: var(--paper); color: var(--green); box-shadow: 2px 3px 0 #d6ab98, 4px 7px 9px rgb(39 31 22 / 24%), inset 0 0 0 3px var(--cream); }
.open-sign-board::before, .open-sign-board::after { content: ""; position: absolute; top: -3px; width: 4px; height: 4px; border: 1px solid var(--brown); border-radius: 50%; background: #e9c591; }
.open-sign-board::before { left: 12.5%; }
.open-sign-board::after { right: 12.5%; }
.open-sign-greeting { font: 400 16px/1.15 var(--script); }
.open-sign-board strong { font: 600 24px/1.25 var(--sans); letter-spacing: .015em; }
.open-sign-heart { display: none; }
.entrance-door-panel { inset: auto 7px 8px; height: 12%; border-radius: 2px; background: linear-gradient(135deg, rgb(255 250 241 / 6%), transparent 60%), var(--green); box-shadow: inset 2px 3px 0 #293e30; }
.entrance-handle { z-index: 3; background: #e9c591; border-color: #8b6a45; box-shadow: 1px 1px 2px rgb(0 0 0 / 18%); }
.entrance-threshold { position: absolute; z-index: 4; left: 10%; right: 10%; bottom: 8.8%; height: 2.4%; background: linear-gradient(#e9d9b8, #ceb794 25%, #ab9372 29%, #baa380); border: 1px solid #a38d6c; box-shadow: 0 3px 2px rgb(58 46 31 / 18%); }
.entrance-step { position: absolute; z-index: 3; left: 8%; right: 8%; bottom: 6.7%; height: 2.5%; background: linear-gradient(#e6d8bc, #cfbd9f 48%, #a89172 52%, #b9a283); border: 1px solid #b8a180; box-shadow: 0 4px 3px rgb(55 45 32 / 18%); }
.entrance-pavement { position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; height: 14%; object-fit: fill; pointer-events: none; }
@media (max-width: 600px) {
  .entrance-art { padding: max(84px, calc(2.5rem + 16px), var(--entrance-tools-space, 0px)) 12px max(112px, calc(6.25rem - 12px)); }
  .entrance-shop { width: 100%; height: min(770px, 100%); }
  .entrance-upper-storey { height: 27%; }
  .entrance-masonry { top: 24%; left: 3%; right: 3%; }
  .entrance-sign { left: 4%; top: 26%; width: 92%; height: 14%; gap: 7px; padding: 5px 7px; border-width: 3px; }
  .entrance-sign .entrance-sign-mark { max-width: 18%; height: 66%; padding: 4px; box-shadow: 1px 2px 0 #b99a70, 3px 4px 0 #765333, 5px 7px 5px #382619, 0 0 15px #c19554; }
  .entrance-wordmark { font-size: clamp(21px, 6.5vw, 35px); text-shadow: 0 -1px 0 #fffdf6, 1px 1px 0 #d4b184, 2px 2px 0 #785232, 3px 3px 0 #432b1a, 4px 6px 3px #29190b, 0 0 9px #d2a460; }
  .entrance-descriptor { font-size: 10px; margin-top: 3px; }
  .entrance-cornice { top: 40%; }
  .entrance-awning { top: 41%; height: 9%; }
  .entrance-doorway { left: 6%; right: 6%; top: 48%; bottom: 11%; width: auto; }
  .entrance-doorframe { border-width: 6px; border-top-width: 10px; }
  .entrance-door { width: 50%; }
  .entrance-door-left { left: 0; }
  .entrance-door-right { right: 0; }
  .entrance-fixed-bay { display: none; }
  .entrance-glass { inset-inline: 5px; border-radius: 6px 6px 2px 2px; }
  .entrance-open-sign { width: min(90px, calc(100% - 12px)); }
  .entrance-bell { width: 32px; height: 34px; left: calc(50% - 16px); top: 0; }
  .entrance-pier { top: 40%; width: 3%; }
  .entrance-pier-left { left: 3%; }
  .entrance-pier-right { right: 3%; }
  .entrance-threshold { left: 5%; right: 5%; }
  .entrance-step { left: 3%; right: 3%; }
}
@media (max-height: 600px) {
  .entrance-art { padding-top: max(74px, calc(2.5rem + 16px), var(--entrance-tools-space, 0px)); padding-bottom: 104px; }
  .entrance-shop { width: min(800px, 100%); }
  .entrance-upper-storey { height: 24%; }
  .entrance-sign { top: 23%; height: 17%; padding-block: 4px; }
  .entrance-wordmark { font-size: 23px; }
  .entrance-descriptor { font-size: 11px; margin-top: 0; }
  .entrance-cornice { top: 40%; }
  .entrance-awning { top: 41%; height: 10%; }
  .entrance-doorway { top: 49%; bottom: 11%; }
  .entrance-bell { width: 26px; height: 28px; left: calc(50% - 13px); top: 0; }
  .entrance-bell-mount { top: -5px; }
  .entrance-open-sign { top: 6px; }
  .open-sign-board { padding-block: 2px; border-radius: 6px; }
  .open-sign-greeting { font-size: 16px; }
  .open-sign-board strong { font-size: 24px; }
  .open-sign-heart { display: none; }
  .entrance-glass { inset-block: 6px 15%; }
  .entrance-glass > img, .entrance-glass > svg { width: 22px; margin-bottom: 5px; }
  .entrance-glass::before { height: 38px; }
  .entrance-handle { height: 26px; }
}
@media (max-width: 360px) {
  .entrance-open-sign { width: 72px; right: 2px; }
  .open-sign-board { padding-inline: 1px; }
}
@media (max-height: 600px) and (max-width: 600px) {
  .entrance-art { padding-bottom: max(104px, calc(6.25rem - 12px)); }
  .entrance-wordmark { font-size: 21px; }
  .entrance-descriptor { font-size: 9px; }
  .entrance-sign { gap: 5px; }
}
@container (max-height: 350px) {
  .entrance-upper-storey { height: 20%; }
  .entrance-masonry { top: 19%; }
  .entrance-sign { top: 19%; height: 18%; padding-block: 2px; }
  .entrance-descriptor { margin-top: 0; }
  .entrance-cornice { top: 37%; }
  .entrance-awning { top: 38%; height: 11%; }
  .entrance-pier { top: 37%; }
  .entrance-doorway { top: 46%; }
  .entrance-open-sign { transform: rotate(-3deg); }
  .entrance-open-sign .open-sign-cord { height: 5px; }
  .open-sign-board { padding-block: 0; }
}
@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  .entrance-room-poster { transform: none; transition: none; }
}
@media (hover: none) {
  .bakery-entrance:not([data-tilt-view="on"]) .entrance-room-poster { transform: none; transition: none; }
}
@media print {
  .site-awning, .bakery-entrance { display: none; }
}
@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  .awning-fabric, .awning-fixed-rail { display: none !important; }
  .site-awning.is-fabric-active > img { opacity: 1; }
}
