/* 3D table map (test page /3d/) */
html.p3-on #planScroll,html.p3-on #pkPlanHint{display:none!important}
html:not(.p3-on) .p3{display:none!important}
.p3{position:relative;width:100%;height:clamp(420px,46vw,640px);border-radius:14px;overflow:hidden;
 background:radial-gradient(120% 90% at 50% 40%,#141821 0%,#07080b 72%);isolation:isolate;
 font-family:Manrope,system-ui,sans-serif;color:#fff;-webkit-tap-highlight-color:transparent}
@media (max-width:820px){.p3{height:min(118vw,520px);border-radius:12px}}
.p3-gl,.p3-gl canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.p3-gl canvas{touch-action:pan-y}
.p3-ui{position:absolute;inset:0;pointer-events:none}
.p3-ui>*{pointer-events:auto}
.p3-back{position:absolute;top:14px;left:14px;z-index:5;display:inline-flex;align-items:center;gap:6px;background:#f6f3ee;color:#111;border:0;
 border-radius:3px;padding:9px 14px 9px 10px;font:600 13px/1 Manrope,system-ui,sans-serif;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.p3-back[hidden]{display:none}
.p3-legend{position:absolute;top:16px;right:16px;z-index:5;display:flex;gap:16px;font:500 12px/1 Manrope,system-ui,sans-serif;color:rgba(255,255,255,.85);pointer-events:none}
.p3-legend span{display:flex;align-items:center;gap:7px}
.p3-legend i{width:10px;height:10px;border-radius:50%;background:#29d07a;box-shadow:0 0 0 3px rgba(41,208,122,.22)}
.p3-legend i.no{background:#d4283c;box-shadow:0 0 0 3px rgba(212,40,60,.22)}
.p3-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);font:500 12px/1 Manrope,system-ui,sans-serif;letter-spacing:.04em;
 color:rgba(255,255,255,.6);pointer-events:none;white-space:nowrap}
/* area label: a white card that appears on hover / tap only, docked top-centre once an area is open */
.p3-chip{position:absolute;left:0;top:0;z-index:4;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:150px;padding:11px 15px 10px 14px;
 border-radius:3px;background:#f6f3ee;color:#111;box-shadow:0 18px 40px rgba(0,0,0,.45);border-left:3px solid #111;cursor:pointer;
 pointer-events:auto;transition:opacity .18s;margin-top:-14px}
.p3-chip[hidden]{display:none}
.p3-chip.hot{border-left-color:#c8102e}
.p3-chip b{font:800 10.5px/1.2 Manrope,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.p3-chip .pr{font:700 17px/1.2 Manrope,system-ui,sans-serif;color:#8a6a2e;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.p3-chip .n{font:500 11.5px/1.3 Manrope,system-ui,sans-serif;color:#6b6b6b}
.p3-chip .n u{text-decoration:none;color:#111;font-weight:700}
.p3-chip.dock{left:50%;top:14px;margin:0;transform:translateX(-50%)!important;flex-direction:row;align-items:baseline;gap:12px;padding:10px 16px;cursor:default;white-space:nowrap}
@media (max-width:820px){.p3-chip.dock{top:auto;bottom:14px;gap:9px;padding:9px 13px}.p3-chip.dock .pr{font-size:14px}.p3-chip.dock .n{display:none}}
/* table tags in an open area */
.p3-tag{position:absolute;left:0;top:0;z-index:3;margin:0;border:0;padding:0;background:none;cursor:pointer;width:0;height:0}
.p3-tag[hidden]{display:none}
.p3-tag b{position:absolute;left:0;bottom:8px;transform:translateX(-50%);display:flex;align-items:baseline;gap:6px;white-space:nowrap;
 padding:6px 9px;border-radius:3px;background:#f6f3ee;color:#111;font:800 12px/1 Manrope,system-ui,sans-serif;box-shadow:0 6px 16px rgba(0,0,0,.45)}
.p3-tag em{position:absolute;left:0;bottom:8px;transform:translateX(-50%);opacity:0}
.p3-tag b::after{content:attr(data-m);color:#8a6a2e;font-weight:700}
.p3-tag:hover b{background:#fff}
.p3-tag.on b{background:#111;color:#fff;outline:2px solid #f6f3ee}
.p3-back svg{width:15px!important;height:15px!important;max-width:15px!important;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.p3-legend{display:none}
/* "View in 360°" card above the price slider */
.p3-360{display:flex;align-items:center;gap:12px;width:100%;margin:0 0 12px;padding:8px;border:1px solid rgba(255,255,255,.14);border-radius:12px;
 background:rgba(255,255,255,.04);color:#f3f2ef;text-align:left;cursor:pointer;font-family:Manrope,system-ui,sans-serif;transition:background .2s,border-color .2s}
.p3-360[hidden]{display:none}
.p3-360:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.32)}
.p3-360 .im{position:relative;flex:none;width:96px;height:64px;border-radius:8px;overflow:hidden;background:#1a1a1a}
.p3-360 .im img{width:100%;height:100%;object-fit:cover;display:block}
.p3-360 .im i{position:absolute;inset:auto auto 5px 5px;padding:3px 6px;border-radius:99px;background:rgba(0,0,0,.6);font:700 10px/1 Manrope,system-ui,sans-serif;font-style:normal;letter-spacing:.06em;color:#fff}
.p3-360 .tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.p3-360 b{font:700 14px/1.2 Manrope,system-ui,sans-serif}
.p3-360 small{font:500 12px/1.2 Manrope,system-ui,sans-serif;opacity:.7}
.p3-360 .ar{flex:none;width:18px!important;height:18px!important;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.7;margin-right:4px}
/* after a pick the map stays on the left; the 360 waits off-screen until the guest opens it */
html.p3-on #roomStage[data-v="map"][data-under] #planSection{display:block!important;grid-column:1/-1!important;grid-row:auto!important;order:1!important}
html.p3-on #roomStage[data-v="map"][data-under] .rs-tour{position:absolute!important;left:-12000px!important;top:0!important;width:960px!important;height:600px!important;visibility:hidden!important;pointer-events:none!important}
html.p3-on #roomStage[data-v="map"][data-under]{height:auto!important}
@media (max-width:820px){html.p3-on #roomStage[data-v="map"][data-under]>.summary.rs-below,html.p3-on #roomStage[data-v="map"][data-under]>.p3-360{order:2!important}}

#summary .p3-360{margin:0 0 12px}
#summary .p3-360+#rzkOffer{margin-top:0!important}
/* fixed room labels: plain spaced capitals, no box */
.p3-lm{position:absolute;left:0;top:0;z-index:2;pointer-events:none;font:700 11px/1 Manrope,system-ui,sans-serif;letter-spacing:.32em;text-indent:.32em;text-transform:uppercase;
 color:rgba(255,255,255,.88);text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.7);white-space:nowrap}
.p3-lm[hidden]{display:none}
@media (max-width:820px){.p3-lm{font-size:9.5px;letter-spacing:.26em;text-indent:.26em}}
/* section list inside the price panel: compact thumbnail rows */
#summary .p3-secs{display:flex!important;flex-direction:column;gap:8px;margin:0 0 12px;padding-top:34px;width:100%}
#summary .p3-secs .bb-sec{display:grid!important;grid-template-columns:76px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:12px;row-gap:2px;
 padding:6px!important;min-height:0!important;height:auto!important;flex:none!important;text-align:left}
#summary .p3-secs .bb-sec-img{grid-row:1/3;grid-column:1;width:76px!important;height:52px!important;min-height:0!important;border-radius:8px;overflow:hidden;display:block}
#summary .p3-secs .bb-sec-img img{width:100%;height:100%;object-fit:cover;display:block}
#summary .p3-secs .bb-sec-tag{display:none!important}
#summary .p3-secs .bb-sec-row{grid-column:2;display:flex!important;justify-content:space-between;align-items:baseline;gap:8px;padding:0!important;align-self:end}
#summary .p3-secs .bb-sec>small{grid-column:2;padding:0!important;align-self:start}
#summary .p3-secs .bb-sec[hidden]{display:none!important}
#summary .p3-secs .bb-sec-img{height:44px!important}
html.p3-on #pkSide>:not(.p3-list):not(.bb-secs):not(#bbSecs){display:none!important}

/* pinch chip top right of the map; the bottom hint goes on desktop (Tim, 23 Oct 2026) */
.p3-pinch{position:absolute;top:14px;right:14px;z-index:6;display:flex;align-items:center;gap:8px;padding:8px 13px;border-radius:99px;background:rgba(12,12,14,.72);border:1px solid rgba(214,216,220,.22);color:#e9eaec;font:500 12px/1 Manrope,"neue-haas-grotesk-text",system-ui,sans-serif;letter-spacing:.04em;pointer-events:none;white-space:nowrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.p3-pinch svg{width:15px!important;height:15px!important;max-width:15px!important;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.p3-mob .p3-pinch{display:none!important}
html.p3-on:not(.p3-mob) .p3-hint{display:none!important}
