/* Scene 03 independent UI over the unmodified whole village. */
#fableton-businesses[data-scene="3"]{--placement-unit:1px}
#fableton-businesses[data-scene="3"] .business-wordmark{left:calc(58 * var(--placement-unit));top:calc(29 * var(--placement-unit));font-size:calc(40 * var(--placement-unit))}
#fableton-businesses[data-scene="3"] .business-brand-rule{left:calc(235 * var(--placement-unit));top:calc(38 * var(--placement-unit));height:calc(28 * var(--placement-unit))}
#fableton-businesses[data-scene="3"] .business-label{left:calc(255 * var(--placement-unit));top:calc(49 * var(--placement-unit));font-size:calc(13 * var(--placement-unit));letter-spacing:calc(4 * var(--placement-unit))}
#fableton-businesses[data-scene="3"] .business-close{top:calc(31 * var(--placement-unit));right:calc(43 * var(--placement-unit));font-size:calc(22 * var(--placement-unit))}
.placement-scene{position:absolute;inset:0;isolation:isolate}
.placement-map{position:absolute;left:50%;top:50%;width:min(100vw,200dvh);aspect-ratio:2;transform:translate(-50%,-50%);z-index:-2}
.placement-art,.placement-regions{position:absolute;inset:0;display:block;width:100%;height:100%}
.placement-regions{pointer-events:none}
.placement-regions polygon{fill:#edca76;fill-opacity:0;stroke:#f5ddb0;stroke-opacity:0;stroke-width:2;transition:fill-opacity .25s ease,stroke-opacity .25s ease}
.placement-map.is-highlighted polygon{fill-opacity:.12;stroke-opacity:.6}
.placement-region{position:absolute;inset:0;width:100%;height:100%;padding:0;background:none;border:0;z-index:1}
#fableton-businesses .placement-region:focus-visible{outline:none;box-shadow:none}
.placement-marker{position:absolute;left:43.4%;top:56.35%;min-height:44px;padding:0;display:flex;align-items:center;gap:8px;border:0;background:none;z-index:2;font-size:calc(21 * var(--placement-unit))}
.placement-dot{display:grid;place-items:center;width:38px;height:38px;border:2px solid #fff8dc;border-radius:50%;background:#10382c;flex-shrink:0}
.placement-dot::after{content:'';width:11px;height:11px;border-radius:50%;background:#e8c26d}
.placement-marker-label{display:block;padding:6px 13px;border:1px solid #d4b477;border-radius:5px;background:#0c2b22;white-space:nowrap}
.has-preference .placement-dot{outline:1px solid #edc777;outline-offset:6px}
.placement-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#071f1a66,transparent 38%),linear-gradient(0deg,#071f1a80,transparent 12%,transparent 90%,#071f1a30)}
.placement-editorial{position:absolute;left:calc(77 * var(--placement-unit));top:calc(129 * var(--placement-unit));width:calc(480 * var(--placement-unit));text-shadow:0 1px 2px #102619}
.placement-kicker,.placement-panel-kicker{font:calc(13 * var(--placement-unit))/1.3 IdeaSans,Arial,sans-serif;letter-spacing:calc(4 * var(--placement-unit));color:#eac675;margin:0}
.placement-rule{width:calc(300 * var(--placement-unit));height:2px;background:#dfc17a;margin:calc(9 * var(--placement-unit)) 0 calc(14 * var(--placement-unit))}
.placement-editorial h2{font-size:calc(53 * var(--placement-unit));line-height:1.06;font-weight:400;margin:0 0 calc(38 * var(--placement-unit))}
.placement-editorial h2 span{display:block}
.placement-scene h2:focus{outline:none}
.placement-opening-copy{font-size:calc(24 * var(--placement-unit));line-height:1.32}
.placement-opening-copy p{margin:0 0 calc(34 * var(--placement-unit))}
.placement-discovery-copy{font-size:calc(24 * var(--placement-unit));line-height:1.3}
.placement-discovery-copy p{margin:0 0 calc(10 * var(--placement-unit))}
.placement-discovery-copy p+p{font-size:calc(21 * var(--placement-unit));color:#f3edd9}
.placement-explore{min-height:48px;padding:calc(13 * var(--placement-unit)) calc(17 * var(--placement-unit));border:1px solid #dfbd74;border-radius:8px;background:#123e2feb;font-size:calc(24 * var(--placement-unit));width:calc(310 * var(--placement-unit));text-align:left;margin-top:calc(8 * var(--placement-unit))}
.placement-preference-tools{display:flex;flex-direction:column;align-items:start;margin-top:calc(25 * var(--placement-unit))}
.placement-clear,.placement-intro-back{min-height:44px;padding:5px 0;background:none;border:0;font-size:16px;text-decoration:underline;text-underline-offset:4px}
.placement-panel{position:absolute;left:calc(65 * var(--placement-unit));top:calc(183 * var(--placement-unit));width:calc(438 * var(--placement-unit));padding:calc(25 * var(--placement-unit));border:1px solid #e8c777;border-radius:15px;background:#0f2e24;box-shadow:0 3px 18px #071f1a35}
.placement-panel h2{font-size:calc(43 * var(--placement-unit));line-height:1.2;margin:calc(27 * var(--placement-unit)) 0 calc(19 * var(--placement-unit));font-weight:400}
.placement-panel-rule{height:1px;background:#d7bc78;margin:0 0 calc(18 * var(--placement-unit))}
.placement-panel p:not(.placement-panel-kicker){font-size:calc(22 * var(--placement-unit));line-height:1.5;margin:0 0 calc(23 * var(--placement-unit))}
.placement-panel p.placement-invitation{font-size:calc(21 * var(--placement-unit));line-height:1.4;color:#eee9d9;margin:0 0 calc(18 * var(--placement-unit))}
.placement-panel-actions{display:flex;align-items:center;gap:calc(18 * var(--placement-unit))}
.placement-interest{min-height:48px;white-space:nowrap;border:1px solid #eac777;border-radius:8px;background:#eac675!important;color:#102b22!important;padding:calc(12 * var(--placement-unit)) calc(14 * var(--placement-unit));font-size:calc(21 * var(--placement-unit));width:calc(238 * var(--placement-unit));text-align:left}
.placement-panel-back,.placement-workshop{min-height:44px;border:0;padding:0;background:none;font-size:calc(21 * var(--placement-unit));white-space:nowrap}
.placement-commercial{position:absolute;left:calc(77 * var(--placement-unit));top:calc(694 * var(--placement-unit));width:calc(470 * var(--placement-unit));font:calc(16 * var(--placement-unit))/1.45 IdeaSans,Arial,sans-serif;color:#f5efd9;text-shadow:0 1px 2px #0e2b23;background:#0c2a218c;border-radius:4px;padding:8px 10px}
.placement-footer{position:absolute;left:calc(55 * var(--placement-unit));right:calc(50 * var(--placement-unit));bottom:calc(18 * var(--placement-unit));display:flex;align-items:center;gap:22px;text-shadow:0 1px 2px #0e2b23}
.placement-progress{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:21px;list-style:none;padding:0;margin:0}
.placement-progress li{width:10px;height:10px;background:#f0e8ccaa;border-radius:50%;border:1px solid #f1e7c4aa}
.placement-progress li[aria-current]{background:#e8c46e;border-color:#e8c46e}
.placement-panel .placement-interest-note{font:16px/1.4 IdeaSans,Arial,sans-serif!important;margin:16px 0 0!important;color:#f8edcf}
.placement-future-wrap{display:flex;align-items:center;gap:12px;margin-top:12px;font:14px/1.35 IdeaSans,Arial,sans-serif}
.placement-future{min-height:44px;background:none;border:1px solid #c5b58680;border-radius:4px;padding:5px 12px;font-size:18px;opacity:.65}
.placement-scene[data-state="selected"]:has(.placement-interest-note:not([hidden])) .placement-commercial{left:calc(650 * var(--placement-unit));width:calc(550 * var(--placement-unit));top:calc(710 * var(--placement-unit))}
.placement-outgoing{position:absolute;inset:0;z-index:3;pointer-events:none;animation:placement-outgoing-fade .65s ease both}
.placement-arriving .placement-editorial{animation:placement-editorial-arrive .5s .8s ease both}
@keyframes placement-outgoing-fade{from{opacity:1}to{opacity:0}}
@keyframes placement-editorial-arrive{from{opacity:0}to{opacity:1}}
@media(max-width:1199px){
 #fableton-businesses[data-scene="3"] .business-wordmark{left:20px;top:10px;font-size:28px}
 #fableton-businesses[data-scene="3"] .business-brand-rule{left:137px;top:18px;height:24px}
 #fableton-businesses[data-scene="3"] .business-label{left:148px;top:27px;font-size:10px;letter-spacing:1px}
 #fableton-businesses[data-scene="3"] .business-close{right:17px;top:8px;font-size:18px}
 .placement-scene{position:relative;inset:auto;min-height:calc(100dvh - 60px);display:flex;flex-direction:column;width:100%}
 .placement-map{position:relative;left:auto;top:auto;transform:none;width:100%;aspect-ratio:2;flex-shrink:0;z-index:0}
 .placement-marker{font-size:18px;gap:5px;top:56.35%;transform:translateY(-50%);left:43.4%}
 .placement-dot{width:30px;height:30px}
 .placement-marker-label{padding:6px 9px}
 .placement-shade{display:none}
 .placement-editorial{position:relative;left:auto;top:auto;width:auto;padding:25px 24px 0;text-shadow:none}
 .placement-kicker,.placement-panel-kicker{font-size:12px;letter-spacing:3px}
 .placement-rule{width:300px;max-width:100%;margin:10px 0 16px}
 .placement-editorial h2{font-size:clamp(34px,5vw,52px);line-height:1.1;margin:0 0 22px}
 .placement-opening-copy,.placement-discovery-copy{font-size:23px;line-height:1.4;max-width:600px}
 .placement-opening-copy p{margin:0 0 20px}
 .placement-discovery-copy p{margin:0 0 12px}
 .placement-discovery-copy p+p{font-size:20px}
 .placement-desktop-break{display:none}
 .placement-explore{font-size:23px;width:auto;max-width:100%;padding:12px 17px;margin:2px 0 0;min-height:50px}
 .placement-preference-tools{margin-top:14px}
 .placement-panel{position:relative;inset:auto;align-self:start;width:calc(100% - 48px);max-width:600px;padding:22px;margin:25px 24px 0;border-radius:12px}
 .placement-panel h2{font-size:40px;margin:23px 0 19px}
 .placement-panel-rule{margin-bottom:18px}
 .placement-panel p:not(.placement-panel-kicker){font-size:22px;line-height:1.45;margin:0 0 22px}
 .placement-panel p.placement-invitation{font-size:21px;margin-bottom:20px}
 .placement-panel-actions{gap:18px;flex-wrap:wrap}
 .placement-interest{font-size:21px;width:238px;max-width:100%;padding:12px 14px;min-height:50px}
 .placement-panel-back,.placement-workshop{font-size:20px}
 .placement-commercial,.placement-scene[data-state="selected"]:has(.placement-interest-note:not([hidden])) .placement-commercial{position:relative;inset:auto;width:auto;max-width:660px;font-size:15px;padding:0;margin:24px 24px 0;background:none;text-shadow:none}
 .placement-footer{position:relative;inset:auto;margin-top:auto;padding:26px 24px 18px;flex-wrap:wrap}
 .placement-progress{position:static;transform:none;margin-left:auto;gap:18px}
 .placement-outgoing .workshop-viewport{position:absolute;inset:0;height:50vw}
}
@media(max-width:599px){
 .placement-editorial{padding:22px 20px 0}
 .placement-editorial h2{font-size:35px}
 .placement-opening-copy,.placement-discovery-copy{font-size:22px}
 .placement-panel{width:calc(100% - 40px);margin:22px 20px 0;padding:20px}
 .placement-panel h2{font-size:36px;margin-top:20px}
 .placement-marker{left:43.4%;font-size:16px;gap:4px}
 .placement-dot{width:27px;height:27px}
 .placement-marker-label{padding:7px}
 .placement-commercial{margin-left:20px;margin-right:20px}
 .placement-footer{padding-left:20px;padding-right:20px}
 .placement-progress{width:100%;justify-content:center;margin:0;gap:20px}
}
@media(max-width:359px){
 #fableton-businesses[data-scene="3"] .business-wordmark{left:14px;font-size:25px}
 #fableton-businesses[data-scene="3"] .business-brand-rule{left:115px}
 #fableton-businesses[data-scene="3"] .business-label{left:127px;font-size:9px;letter-spacing:.6px}
 #fableton-businesses[data-scene="3"] .business-close{right:12px;font-size:17px}
 .placement-editorial h2{font-size:31px}
 .placement-marker{font-size:15px;gap:3px}
 .placement-dot{width:26px;height:26px}
 .placement-marker-label{padding:6px}
}
@media(prefers-reduced-motion:reduce){.placement-regions polygon{transition:none}.placement-arriving .placement-editorial{animation:none}.placement-outgoing{display:none}}
