.space-canvas{position:relative;isolation:isolate;width:100%;overflow:hidden;background:#07170f;box-sizing:border-box}.space-background{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;position:absolute!important;inset:0!important;pointer-events:none;transform:none!important}.space-layer{position:absolute!important;box-sizing:border-box;margin:0!important;padding:0!important;background:transparent;border:0;border-radius:0;color:#fff5dd;text-decoration:none;min-width:0;min-height:0;overflow:hidden;font:inherit;cursor:pointer}.space-layer>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.space-layer>span:not(.hotspot-badge){display:block;max-width:100%;background:#092719e8;border:1px solid #bca779;border-radius:8px;padding:4px;font-size:clamp(9px,1.4vw,16px);overflow-wrap:anywhere}.space-layer:focus-visible{outline:3px solid #ffd177;outline-offset:-3px}.space-frame>img{box-sizing:border-box;border:6px ridge #9e8050}.space-edit .space-layer{outline:1px dashed #e8c98a;touch-action:none}.space-edit .space-layer.is-selected{outline:3px solid #57dbdd;outline-offset:-3px;z-index:101}.space-edit .space-hidden{opacity:.3}.space-mounted> :not(.space-live){display:none!important}.space-live{position:relative;width:100%;height:100%}.space-detail{width:min(90vw,650px);background:#0b261b;color:#fff1d0;border:1px solid #bd9f61;border-radius:16px;padding:24px}.space-detail::backdrop{background:#000a}.space-detail p{white-space:pre-wrap;overflow-wrap:anywhere}.space-detail a{color:#f3d692}.space-detail button{float:right;padding:8px}

.space-resize{position:absolute;right:0;bottom:0;width:20px;height:20px;background:#57dbdd;border:2px solid #082a20;box-sizing:border-box;cursor:nwse-resize;touch-action:none}

.space-layer.legacy-hotspot-badge{overflow:visible}

/* Inyoung only: visible pills match the host room's restrained 8px badges.
   The whole separate button remains tappable; no pixels are baked into art. */
.space-mounted .space-layer.inyoung-control{
  display:flex!important;align-items:stretch;justify-content:stretch;
  overflow:visible!important;z-index:6;touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.space-mounted .space-layer.inyoung-control > .inyoung-control-label{
  display:inline-flex!important;align-items:center;justify-content:center;gap:3px;
  width:100%;height:100%;min-width:0;margin:0!important;
  box-sizing:border-box;padding:1px 3px!important;
  border:1px solid rgba(237,206,137,.66)!important;
  border-radius:999px!important;
  background:rgba(5,38,26,.94)!important;color:#fff0cd!important;
  box-shadow:0 5px 13px rgba(0,0,0,.32)!important;
  font:700 clamp(8px,1.05vw,11px)/1.05 system-ui,'Noto Sans KR',sans-serif!important;
  letter-spacing:-.035em;white-space:nowrap!important;
  overflow:hidden!important;overflow-wrap:normal!important;
}
.space-mounted .inyoung-control-icon{flex:none;color:#f0d89a;font-size:1em;line-height:1}
.space-mounted .inyoung-control-text{display:block;min-width:0;white-space:nowrap}
.space-mounted .inyoung-control:hover > .inyoung-control-label,
.space-mounted .inyoung-control:focus-visible > .inyoung-control-label{
  background:rgba(15,56,39,.97)!important;border-color:#ffe2a0!important;
  box-shadow:0 0 0 2px rgba(243,210,144,.2),0 5px 15px rgba(0,0,0,.34)!important;
}
.space-mounted .inyoung-control:focus-visible{outline:2px solid #ffe2a0;outline-offset:1px}
@media(max-width:820px){
 .space-mounted .space-layer.inyoung-control > .inyoung-control-label{
  padding:1px 2px!important;gap:2px;
  font-size:clamp(8px,2.15vw,10px)!important;
 }
}


/* Artwork stays below native controls and cannot consume their pointer events. */
.space-canvas.has-art-frames > .space-layer{z-index:1}
.art-frame-surface,.art-frame-surface *{pointer-events:none!important}
.video-art-surface{position:absolute;left:0;top:0;z-index:2;overflow:hidden;transform-origin:0 0}
.video-art-trigger{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer}
.video-art-trigger img{display:block;width:100%;height:100%;object-position:center}
.video-art-trigger span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:20px 28px;border-radius:50%;background:#000b;color:white;font-size:64px}
.video-art-trigger:focus-visible{outline:8px solid #ffd177;outline-offset:-8px}
.video-art-trigger[hidden]{display:none}
.video-art-player{position:absolute;inset:0;background:#000}
.video-art-player iframe{width:100%;height:100%;border:0;display:block}
.video-art-tools{position:absolute;left:2%;right:2%;z-index:3;background:#10291ff5;color:#fff;padding:8px;display:flex;flex-wrap:wrap;gap:8px;box-sizing:border-box}
.video-art-tools button,.video-art-tools a{min-height:44px;padding:8px;color:#fff;background:#203e31;border:1px solid #c9b787;border-radius:5px;font:inherit;cursor:pointer}
.video-art-tools p{width:100%;margin:0;font-size:13px}
.video-art-expanded{width:min(90vw,900px);padding:12px;background:#10291f;color:white;border:1px solid #c9b787}
.video-art-expanded::backdrop{background:#000b}
.video-art-expanded .video-art-player{position:relative;min-height:200px;aspect-ratio:16/9}
.video-art-expanded .video-art-tools{position:static}
.video-art-enlarged-content .video-art-player{position:relative;min-height:200px;aspect-ratio:16/9}
.video-art-enlarged-content .video-art-tools{position:static}
#artScene .video-art-surface,.space-edit .video-art-surface{pointer-events:none}
#artFramePanel{margin:20px 0;padding:14px;border:1px solid #bca779;border-radius:10px}
#artFramePanel .space-toolbar{flex-wrap:wrap}
#artEditor{position:fixed;inset:0;margin:auto;width:min(1160px,96vw);height:94dvh;max-width:96vw;max-height:94dvh;padding:12px;box-sizing:border-box;border:1px solid #bca779;border-radius:12px;background:#091f16;color:#fff2d3;overflow:hidden}
#artEditor[open]{display:grid;grid-template-rows:auto auto auto minmax(120px,1fr) auto;gap:8px}
#artEditor::backdrop{background:#000b}
#artEditor header{display:flex;align-items:center;justify-content:space-between;gap:8px}
#artEditor h2{font-size:18px;margin:0}
#artEditor button,#artEditor select{min-height:44px;margin:0;font-size:14px}
.art-editor-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.art-editor-tools label{flex:1;min-width:100px;margin:0;font-size:12px}
#artEditor select{width:100%;padding:6px}
#artStatus{font-size:13px;margin:0;min-height:38px;line-height:19px}
#artViewport{position:relative;min-height:0;overflow:hidden;background:#030b08;touch-action:none;user-select:none;contain:layout paint}
#artScene{pointer-events:none}
#artOverlay{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.art-outline{fill:transparent;stroke:#e5c887;stroke-width:2;cursor:pointer;vector-effect:non-scaling-stroke}
.art-outline.selected{stroke:#54e2df;stroke-width:3}
.art-candidate{fill:#45ceca25;stroke:#fff;stroke-width:2;stroke-dasharray:6 3;pointer-events:none}
#artHandles{position:absolute;inset:0;pointer-events:none}
#artHandles button{position:absolute;width:48px;height:48px;min-height:48px;border-radius:50%;transform:translate(-50%,-50%);padding:0;background:#57dbdd;color:#052219;border:3px solid #fff;pointer-events:auto;touch-action:none;font-weight:800;box-shadow:0 1px 5px #000}
#artHandles[hidden],#artEditor [hidden]{display:none!important}
.art-editor-bottom{max-height:32dvh;overflow:auto}
#artProperties{padding-top:6px}
.art-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:8px 0}
.art-settings label{font-size:13px;margin:0}
@media(max-width:600px){#artEditor{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:10px}#artEditor h2{font-size:16px}.art-editor-tools button{padding:6px 10px}.art-settings{grid-template-columns:1fr 1fr}#artStatus{min-height:57px}.art-editor-tools label{flex-basis:120px}}


/* HYELL: published space layers must retain the exact original purple
   four-button badge appearance defined for #roomHotspots in experience.css.
   Scoped to the four HYELL action layers; preserve hitboxes and handlers. */
body[data-room-id="guest_9c8ffe90"] .space-mounted .space-layer:is(
 [data-layer-id="hotspot-author-5"],
 [data-layer-id="hotspot-shelf-6"],
 [data-layer-id="hotspot-channel-8"],
 [data-layer-id="hotspot-buy-9"]
) > .hotspot-badge{
 left:0;top:0;right:auto;bottom:auto;transform:none;box-sizing:border-box;
 width:100%;height:100%;min-width:0;display:flex;align-items:center;justify-content:center;
 gap:0;padding:0 4px;
 border:1px solid rgba(225,204,164,.65);border-radius:9px;
 background:rgba(47,35,61,.88);color:#fff3df;
 font-size:11px;font-weight:600;letter-spacing:0;line-height:1.3;
 box-shadow:0 3px 10px rgba(26,15,40,.18);text-shadow:none;
}
body[data-room-id="guest_9c8ffe90"] .space-mounted .space-layer:is(
 [data-layer-id="hotspot-author-5"],
 [data-layer-id="hotspot-shelf-6"],
 [data-layer-id="hotspot-channel-8"],
 [data-layer-id="hotspot-buy-9"]
) .hotspot-badge-icon{display:none}
body[data-room-id="guest_9c8ffe90"] .space-mounted .space-layer:is(
 [data-layer-id="hotspot-author-5"],
 [data-layer-id="hotspot-shelf-6"],
 [data-layer-id="hotspot-channel-8"],
 [data-layer-id="hotspot-buy-9"]
):is(:hover,:focus-visible) > .hotspot-badge{
 background:rgba(64,46,79,.96);border-color:#efd9ad;
 box-shadow:0 0 0 2px rgba(239,217,173,.22);
}

/* CMS may swap the main-hall artwork, not the native filter/entrance behavior.
   The rendered background stays in flow while the original interactive geometry
   overlays it at the established 864x1536-relative coordinates. */
#fairFrame.space-mounted > .space-live{z-index:1}
#fairFrame.space-mounted > .booth-mask{display:block!important;z-index:3}
#fairFrame.space-mounted > .booth-enter-hotspot{display:block!important;z-index:5}
