/* Kim Callas – 3D-Rundgang · Stile passend zum Figma-Design (04 · 3D-Rundgang) */
.kc-tour {
  --kc-accent: #3d6dad; --kc-accent-ink: #2e5888; --kc-accent-soft: #eef4fb;
  --kc-ink: #18211c; --kc-muted: #69726c; --kc-line: #e7e9e2; --kc-yellow: #ffd34d;
  --kc-glass: rgba(255, 255, 255, .92); --kc-dark: rgba(24, 33, 28, .78);
  --kc-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  --kc-font: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --kc-font-head: "Outfit", var(--kc-font);
  position: relative; overflow: hidden; isolation: isolate;
  container-type: inline-size; container-name: kc-tour;
  height: min(var(--kc-height, 820px), calc(100dvh - 112px)); min-height: min(420px, calc(100dvh - 112px));
  scroll-margin-top: 100px;
  border-radius: var(--kc-radius, 0); background: #dfeaf5;
  font-family: var(--kc-font); color: var(--kc-ink); -webkit-tap-highlight-color: transparent;
  user-select: none; -webkit-user-select: none; outline: none;
}
.kc-tour:focus-visible { box-shadow: inset 0 0 0 3px var(--kc-accent); }
.kc-tour *, .kc-tour *::before, .kc-tour *::after { box-sizing: border-box; }
.kc-tour button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; padding: 0; }
.kc-tour button:focus-visible, .kc-tour a:focus-visible { outline: 3px solid var(--kc-accent); outline-offset: 2px; }
.kc-tour svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.kc-tour svg.kc-fill { fill: currentColor; stroke: none; }
.kc-tour [hidden] { display: none !important; }
.kc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.kc-tour__stage, .kc-tour__stage canvas, .kc-tour__labels, .kc-tour__poster, .kc-tour__overlay, .kc-tour__hud { position: absolute; inset: 0; }
.kc-tour__stage canvas { display: block; cursor: grab; touch-action: none; }
.kc-tour__labels { pointer-events: none; }

/* Poster & Start */
.kc-tour__poster { display: grid; place-items: center; background: #dfeaf5; }
.kc-tour__poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kc-tour__poster::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 23, 20, .05), rgba(15, 23, 20, .45)); }
.kc-tour__start { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; padding: 8px 26px 8px 8px; border-radius: 999px; background: #fff; box-shadow: var(--kc-shadow); text-align: left; transition: transform .2s; }
.kc-tour__start:hover { transform: translateY(-2px); }
.kc-tour__start strong { display: block; font-size: 17px; }
.kc-tour__start small { display: block; font-size: 13px; color: var(--kc-muted); }
.kc-tour__start-icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--kc-accent); color: #fff; }
.kc-tour[data-state="loading"] .kc-tour__start { visibility: hidden; }

/* Overlays (Laden, Fehler, Hilfe) */
.kc-tour__overlay { display: grid; grid-template-rows:minmax(0,1fr); place-items: center; padding: 16px; background: rgba(24, 33, 28, .35); z-index: 5; }
.kc-card { max-height:100%;overflow:auto;overscroll-behavior:contain;display: grid; justify-items: center; gap: 12px; width: min(420px, 100%); padding: 26px 28px; border-radius: 24px; background: #fff; box-shadow: var(--kc-shadow); text-align: center; }
.kc-card--left { justify-items: stretch; text-align: left; width: min(460px, 100%); }
.kc-card strong { font-family: var(--kc-font-head); font-weight: 500; font-size: 20px; }
.kc-card small { color: var(--kc-muted); font-size: 14px; }
.kc-card__icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--kc-accent-soft); color: var(--kc-accent); }
.kc-card__head { position:sticky;top:0;z-index:1;background:#fff;display: flex; justify-content: space-between; align-items: center; }
.kc-progress { width: 100%; height: 6px; border-radius: 3px; background: #e3ebf5; overflow: hidden; }
.kc-progress span { display: block; height: 100%; width: 0; background: var(--kc-accent); transition: width .2s; }
.kc-tour__thumbs-fallback { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: 100%; }
.kc-tour__thumbs-fallback a { display: grid; gap: 4px; color: var(--kc-ink); text-decoration: none; font-size: 12px; }
.kc-tour__thumbs-fallback img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: 10px; }
.kc-keys { margin: 0; display: grid; }
.kc-keys > div { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--kc-line); }
.kc-keys dt { font-weight: 600; font-size: 14px; } .kc-keys dt small { display: block; font-weight: 400; font-size: 12px; }
.kc-keys dd { margin: 0; }
.kc-keys kbd { font: 600 13px var(--kc-font); padding: 4px 10px; border: 1px solid #cfd6d1; border-bottom-width: 2px; border-radius: 8px; background: #f3f6f9; white-space: nowrap; }

/* HUD */
.kc-tour__hud { pointer-events: none; z-index: 3; }
.kc-tour__hud > * { pointer-events: auto; position: absolute; }
.kc-tour__tl { top: 24px; left: 24px; display: grid; gap: 12px; justify-items: start; pointer-events: none; }
.kc-tour__tl > * { pointer-events: auto; }
.kc-tour__tr { top: 24px; right: 24px; }
.kc-tour__bl { left: 24px; bottom: 24px; }
.kc-tour__bc { left: 50%; bottom: 24px; transform: translateX(-50%); }
.kc-tour__br { right: 24px; bottom: 24px; }
.kc-tour__hint { top: 128px; left: 50%; transform: translateX(-50%); padding: 8px 14px; border-radius: 999px; background: var(--kc-dark); color: #fff; font-size: 13px; pointer-events: none; white-space: nowrap; animation: kc-fade 1s 6s forwards; }
@keyframes kc-fade { to { opacity: 0; } }
.kc-tour__measurebar { left: 50%; top: 92px; transform: translateX(-50%); display: flex; align-items: center; gap: 12px; padding: 6px 6px 6px 16px; border-radius: 999px; background: var(--kc-glass); box-shadow: var(--kc-shadow); font-size: 14px; font-weight: 500; }
.kc-tour__measurebar button { padding: 8px 14px; border-radius: 999px; background: var(--kc-ink); color: #fff; font-weight: 600; font-size: 13px; }

.kc-seg, .kc-pill { display: flex; gap: 4px; padding: 6px; border-radius: 999px; background: var(--kc-glass); box-shadow: var(--kc-shadow); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.kc-pill--v { flex-direction: column; }
.kc-seg button, .kc-pill button { display: flex; align-items: center; gap: 8px; min-height: 44px; min-width: 44px; justify-content: center; padding: 0 14px; border-radius: 999px; font-weight: 600; font-size: 14px; transition: background .15s; }
.kc-pill--v button { padding: 0; }
.kc-seg button:hover, .kc-pill button:hover { background: rgba(61, 109, 173, .1); }
.kc-seg button.is-active { background: var(--kc-accent); color: #fff; }
.kc-pill button[aria-pressed="true"] { background: var(--kc-accent-soft); color: var(--kc-accent-ink); }
.kc-title { display: grid; gap: 2px; padding: 10px 18px 12px; border-radius: 18px; background: var(--kc-dark); color: #fff; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); pointer-events: none !important; }
.kc-title strong { font-family: var(--kc-font-head); font-weight: 400; font-size: 26px; line-height: 1.15; }
.kc-title small { font-size: 13px; opacity: .9; }

/* Minimap */
.kc-minimap { width: 248px; padding: 12px 12px 10px; border-radius: 20px; background: var(--kc-glass); box-shadow: var(--kc-shadow); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.kc-eyebrow { display: block; margin: 2px 4px 8px; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--kc-accent-ink); }
.kc-minimap svg { width: 100%; height: auto; display: block; cursor: pointer; overflow: visible; stroke: none; stroke-width: 0; fill: #18211c; }
.kc-map__room { fill: #f7f6f1; stroke: #18211c; stroke-width: .06; transition: fill .2s; }
.kc-map__room:hover { fill: #e3ebf5; }
.kc-map__room.is-active { fill: #d5e3f4; }
.kc-map__terrace { fill: #efe9da; stroke: #cfc6b0; stroke-width: .05; }
.kc-map__terrace.is-active { fill: #e6dcc3; }
.kc-map__outline { fill: none; stroke: #18211c; stroke-width: .14; pointer-events: none; }
.kc-minimap text { font: 600 .42px var(--kc-font); fill: #4a534d; text-anchor: middle; dominant-baseline: middle; pointer-events: none; }
.kc-map__me { pointer-events: none; }
.kc-map__me circle { fill: var(--kc-accent); stroke: #fff; stroke-width: .1; }
.kc-map__cone { fill: rgba(61, 109, 173, .3); }

/* Stationsleiste */
.kc-strip { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 22px; background: var(--kc-glass); box-shadow: var(--kc-shadow); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); max-width: calc(100% - 48px); }
.kc-strip__list { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.kc-strip__list::-webkit-scrollbar { display: none; }
.kc-station { display: grid; gap: 4px; flex: none; width: 96px; }
.kc-station__img { position: relative; display: block; height: 58px; border-radius: 12px; overflow: hidden; background: #e3ebf5; }
.kc-station__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kc-station.is-active .kc-station__img::after { content: ""; position: absolute; inset: 0; border: 3px solid var(--kc-accent); border-radius: 12px; }
.kc-station__nr { position: absolute; top: 6px; left: 6px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #fff; color: var(--kc-accent-ink); font-size: 11px; font-weight: 600; }
.kc-station__nr svg { width: 12px; height: 12px; color: #5e7f3a; stroke-width: 2.4; }
.kc-station.is-active .kc-station__nr { background: var(--kc-accent); color: #fff; }
.kc-station__lbl { font-size: 12px; font-weight: 500; color: #4a534d; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-station.is-active .kc-station__lbl { font-weight: 600; color: var(--kc-ink); }
.kc-round { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #f3f6f9; flex: none; }
.kc-round--primary { background: var(--kc-accent); color: #fff; }
.kc-chip { display: flex; align-items: center; gap: 6px; height: 44px; padding: 0 14px 0 12px; border-radius: 999px; background: #f3f6f9; font-weight: 600; font-size: 13px; white-space: nowrap; flex: none; }
.kc-chip svg { width: 12px; height: 12px; }
.kc-chip[aria-pressed="true"] { background: var(--kc-accent-soft); color: var(--kc-accent-ink); }

/* Marker (CSS2D) */
.kc-marker { position: relative; pointer-events: auto; display: flex; align-items: center; transition: opacity .2s; }
.kc-marker.is-hidden { opacity: 0; pointer-events: none; }
.kc-marker__dot { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--kc-glass) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, .25); }
.kc-marker__dot span { width: 12px; height: 12px; border-radius: 50%; background: var(--kc-accent); }
.kc-marker__label { position: absolute; left: 44px; display: none; gap: 2px; padding: 10px 16px 10px 14px; border-radius: 14px; background: rgba(255, 255, 255, .96); box-shadow: 0 4px 12px rgba(0, 0, 0, .25); white-space: nowrap; }
.kc-marker.is-open .kc-marker__label { display: grid; }
.kc-marker__label strong { font-size: 14px; } .kc-marker__label small { font-size: 12px; color: var(--kc-muted); }
.kc-measure { padding: 6px 12px; border-radius: 999px; background: var(--kc-ink); color: #fff; font-weight: 600; font-size: 15px; }

.kc-toast { left: 50%; bottom: 120px; transform: translate(-50%, 10px); padding: 8px 14px; border-radius: 999px; background: var(--kc-ink); color: #fff; font-size: 13px; opacity: 0; transition: .2s; pointer-events: none !important; max-width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* Kompakt (Tablet/Handy) */
.kc-tour--compact .kc-tour__tr span, .kc-tour--compact .kc-chip, .kc-tour--compact .kc-tour__br, .kc-tour--compact .kc-tour__hint { display: none; }
.kc-tour--compact .kc-tour__tl, .kc-tour--compact .kc-tour__tr { top: 12px; }
.kc-tour--compact .kc-tour__tl { left: 12px; } .kc-tour--compact .kc-tour__tr { right: 12px; }
.kc-tour--compact .kc-seg button { padding: 0 12px; font-size: 13px; }
.kc-tour--compact .kc-seg button svg { display: none; }
.kc-tour--compact .kc-title strong { font-size: 20px; }
.kc-tour--compact .kc-minimap { width: 150px; left: 12px; bottom: auto; top: 150px; padding: 8px; }
.kc-tour--compact .kc-eyebrow { display: none; }
.kc-tour--compact .kc-tour__bc { bottom: 12px; max-width: calc(100% - 24px); }
.kc-tour--compact .kc-station { width: 72px; } .kc-tour--compact .kc-station__img { height: 44px; }
@media (max-width: 560px) {
  .kc-tour--compact .kc-tour__tr { top: auto; bottom: 120px; right: 12px; flex-direction: column; }
  .kc-tour--compact .kc-minimap { display: none; }
  .kc-tour--compact .kc-tour__tl { right: 12px; }
}
@media (prefers-reduced-motion: reduce) { .kc-tour * { transition: none !important; animation: none !important; } }

/* Viewer controls and responsive game navigation. */
.kc-tour { --kc-glass: rgba(255,255,255,.94); box-shadow: 0 16px 48px rgba(32,49,38,.12); }
.kc-tour button:focus-visible { outline: 3px solid var(--kc-accent); outline-offset: 3px; }
.kc-tour button:disabled { cursor: wait; opacity: .6; }
.kc-tour__start { background: #fff !important; padding: 18px 26px !important; }
.kc-tour .kc-round { background: #f3f6f9; }
.kc-tour .kc-round--primary { background: var(--kc-accent); color: #fff; }
.kc-tour .kc-chip { background: #f3f6f9; padding: 0 14px; }
.kc-tour .kc-title strong { font-size: 22px; }
.kc-tour__overlay { overflow-y: auto; }
.kc-tour__roomnav { top: 160px; left: 20px; right: 20px; width: max-content; max-width: calc(100% - 40px); flex-wrap: wrap; gap: 2px; padding: 5px; border-radius: 16px; box-shadow: 0 4px 20px #0001; }
.kc-tour__roomnav button { min-height: 44px; padding: 8px 12px; border-radius: 11px; font-size: 12px; }
.kc-tour__roomnav button:hover { background: var(--kc-accent-soft); }
.kc-tour-roomselect { display: none; }
.kc-tour .kc-portal { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 8px 14px; border-radius: 24px; background: var(--kc-dark); color: white; pointer-events: auto; font-size: 12px; backdrop-filter: blur(8px); }
.kc-portal.is-hidden { visibility: hidden; pointer-events: none; }
.kc-marker__dot { min-width: 44px; min-height: 44px; }
.kc-tour__mobileactions { right: 84px; bottom: 150px; }
.kc-tour__bc { left: 300px; right: 84px; transform: none; max-width: none; justify-content: center; }
.kc-tour .kc-strip { border-radius: 20px; box-shadow: 0 6px 24px #0002; }
.kc-tour__photo { inset: 0; z-index: -1; background: #18211c; display: grid; place-items: center; }
.kc-tour__photo img { width: 100%; height: 100%; object-fit: contain; }
.kc-tour__photo p { position: absolute; top: 85px; right: 24px; color: white; padding: 8px 14px; border-radius: 16px; background: var(--kc-dark); }
.kc-tour__hud:has(.kc-tour__photo:not([hidden])) .kc-tour__bl,
.kc-tour__hud:has(.kc-tour__photo:not([hidden])) .kc-tour__hint { display: none; }
.kc-tour__loading .kc-chip, .kc-tour__error .kc-chip { display: grid; place-items: center; background: var(--kc-accent) !important; color: white; padding: 12px 20px; text-decoration: none; }
.kc-tour .kc-tour-game, .kc-tour .kc-tour-landscape { position: absolute; top: 220px; padding: 12px 18px; border-radius: 24px; background: var(--kc-glass); color: var(--kc-ink); font-size: 13px; font-weight: 600; box-shadow: 0 4px 20px #0001; backdrop-filter: blur(12px); }
.kc-tour-game { left: 20px; }
.kc-tour-landscape { right: 20px; }
.kc-tour .kc-tour-interact { position: absolute; left: 50%; top: 55%; transform: translateX(-50%); padding: 14px 22px; border-radius: 24px; background: var(--kc-accent); color: white; box-shadow: 0 4px 24px #0003; font-size: 14px; font-weight: 600; }
.kc-tour-walkpad { display: none; position: absolute; left: 16px; bottom: 190px; grid-template-columns: repeat(3,44px); gap: 5px; touch-action: none; }
.kc-tour-walkpad button { height: 44px; border-radius: 12px; background: var(--kc-glass); color: var(--kc-ink); font-size: 22px; font-weight: 600; box-shadow: 0 2px 10px #0002; touch-action: none; }
.kc-tour-walkpad button:first-child { grid-column: 2; }
.kc-tour-walkpad button:nth-child(2) { grid-column: 1; }
.kc-tour.is-game::after { content: '+'; position: absolute; top: 50%; left: 50%; color: white; font-size: 24px; pointer-events: none; text-shadow: 0 1px 3px #000; }
.kc-tour[data-mode="dollhouse"] .kc-tour-game, .kc-tour[data-mode="plan"] .kc-tour-game, .kc-tour.is-game .kc-tour-game,
.kc-tour[data-mode="dollhouse"] .kc-tour-walkpad, .kc-tour[data-mode="plan"] .kc-tour-walkpad { display: none; }
.kc-tour__plan { position: absolute; inset: 0; z-index: 2; background: #f6f5ef; display: flex; align-items: center; justify-content: center; padding: 195px 24px 125px; overflow: hidden; touch-action: none; cursor: grab; }
.kc-tour__plan img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; transform-origin: center; user-select: none; }
.kc-tour[data-mode="plan"] .kc-tour__bl, .kc-tour[data-mode="plan"] .kc-tour__hint { display: none; }
.kc-tour-planzoom { position: absolute; right: 24px; bottom: 125px; display: flex; gap: 4px; padding: 4px; border-radius: 16px; background: white; box-shadow: 0 4px 18px #0001; z-index: 1; }
.kc-tour .kc-tour-planzoom button { width: 44px; height: 44px; border-radius: 12px; font-size: 22px; background: #eff2eb; }
.kc-tour--compact .kc-tour__roomnav { top: 135px; left: 12px; max-width: calc(100% - 24px); }
.kc-tour--compact .kc-tour__hint { display: none; }
.kc-tour--compact .kc-tour__bc { left: 210px; right: 12px; transform: none; max-width: none; }
.kc-tour--compact .kc-minimap { width: 180px; top: auto; bottom: 12px; }
.kc-tour--compact .kc-tour__mobileactions { right: 12px; bottom: 120px; }
@media (pointer: coarse) {
  .kc-tour-walkpad { display: grid; }
  .kc-tour .kc-tour-game { display: none; }
}
@media (pointer: coarse) and (min-width: 768px) { .kc-tour-walkpad { bottom: 250px; left: 20px; } }
@media (min-width: 768px) and (max-width: 1100px) { .kc-tour__roomnav button { padding: 8px 10px; } }
@media (max-width: 767px) {
  .kc-tour { height: min(var(--kc-height-mobile,700px), calc(100dvh - 112px)); border-radius: 20px; }
  .kc-tour .kc-title strong { font-size: 18px; }
  .kc-tour .kc-title small { font-size: 11px; }
  .kc-tour__roomnav, .kc-tour--compact .kc-tour__roomnav { top: 125px; left: 12px; right: auto; width: 184px; max-width: calc(100% - 24px); padding: 3px; border-radius: 14px; }
  .kc-tour__roomnav button { display: none; }
  .kc-tour-roomselect { display: block; width: 100%; height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--kc-ink); font: 600 12px var(--kc-font); padding: 0 12px; cursor: pointer; }
  .kc-tour-roomselect:focus-visible { outline: 3px solid var(--kc-accent); outline-offset: 2px; }
  .kc-tour--compact .kc-tour__tr { top: 183px; bottom: auto; right: 12px; flex-direction: row; }
  .kc-tour .kc-tour-landscape { top: 245px; right: 12px; font-size: 11px; padding: 10px 12px; }
  .kc-tour .kc-tour-game { display: none; }
  .kc-tour .kc-tour-interact { top: 49%; max-width: calc(100% - 32px); white-space: nowrap; }
  .kc-tour-walkpad { display: grid; bottom: 172px; left: 12px; }
  .kc-tour__mobileactions, .kc-tour--compact .kc-tour__mobileactions { bottom: 112px; right: 12px; }
  .kc-tour__bc, .kc-tour--compact .kc-tour__bc { left: 12px; right: 12px; bottom: 16px; border-radius: 16px; }
  .kc-tour__bc .kc-strip__list { scroll-snap-type: x proximity; }
  .kc-tour__bc .kc-station { scroll-snap-align: center; }
  .kc-tour .kc-portal { max-width: 135px; overflow: hidden; text-overflow: ellipsis; }
  .kc-tour__photo p { top: 300px; right: 12px; }
  .kc-tour__measurebar { top: 300px; width: calc(100% - 24px); border-radius: 16px; }
  .kc-tour__plan { padding: 295px 12px 110px; }
  .kc-tour-planzoom { right: 12px; bottom: 110px; }
  .kc-tour--compact .kc-minimap { display: none; }
}
@media (max-height: 600px) and (min-width: 600px) {
  .kc-tour { min-height: min(320px, calc(100dvh - 112px)); height: min(var(--kc-height, 820px), calc(100dvh - 112px)); }
  .kc-tour__bc, .kc-tour--compact .kc-tour__bc { left: 12px; bottom: 12px; }
  .kc-tour .kc-tour-game, .kc-tour .kc-tour-landscape { top: 200px; }
  .kc-tour-walkpad, .kc-tour__mobileactions { bottom: 115px; }
  .kc-tour__bl { display: none; }
  .kc-tour__plan { padding: 180px 20px 100px; }
}
/* Mobile first-person controls: clear view, one thumb moves, the other looks. */
.kc-tour-more,.kc-mobiletool,.kc-tour-joystick{display:none}
.kc-tour-joystick{position:absolute;width:100px;height:100px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(24,33,28,.22);backdrop-filter:blur(8px);touch-action:none;box-shadow:inset 0 0 0 14px rgba(255,255,255,.08)}
.kc-tour-joystick__thumb{position:absolute;left:29px;top:29px;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.94);box-shadow:0 3px 16px #0003;pointer-events:none}
.kc-tour-joystick small{position:absolute;top:106px;left:0;width:100%;text-align:center;color:white;font-size:11px;text-shadow:0 1px 5px #000}
@media(pointer:coarse){.kc-tour-joystick{display:block;left:20px;bottom:230px}.kc-tour-walkpad{display:none}}
@media(max-width:767px){
 .kc-tour .kc-tour-more{display:grid;place-items:center;position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;background:var(--kc-glass);font-size:27px;box-shadow:0 3px 14px #0001}
 .kc-tour__tl{right:68px!important}.kc-tour__tl .kc-seg{width:100%;gap:2px;padding:4px}
 .kc-tour--compact .kc-seg button{flex:1;min-width:0;padding:0 5px;font-size:11px}
 .kc-tour .kc-title{max-width:calc(100vw - 210px);padding:8px 10px;border-radius:13px}
 .kc-tour .kc-title strong{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:15px}
 .kc-tour .kc-title small{font-size:10px;white-space:nowrap}
 .kc-tour__roomnav,.kc-tour--compact .kc-tour__roomnav{top:77px;left:auto;right:12px;width:132px;padding:0}
 .kc-tour-roomselect{height:44px;padding:0 10px;font-size:11px}
 .kc-tour--compact .kc-tour__tr{display:none;top:66px;right:12px;width:176px;flex-direction:column;align-items:stretch;border-radius:18px;z-index:5}
 .kc-tour.is-tools-open .kc-tour__tr{display:flex}
 .kc-tour.is-tools-open .kc-tour__tr span{display:inline}
 .kc-tour.is-tools-open .kc-tour__tr button{justify-content:flex-start;padding:0 12px;font-size:12px}
 .kc-tour.is-tools-open .kc-mobiletool{display:flex}
 .kc-tour .kc-tour-landscape{display:none;top:362px;width:176px;min-height:44px;border-radius:16px;z-index:5}
 .kc-tour.is-tools-open .kc-tour-landscape{display:block}
 .kc-tour__mobileactions,.kc-tour--compact .kc-tour__mobileactions{bottom:125px;background:none;padding:0;box-shadow:none;backdrop-filter:none}
 .kc-tour__mobileactions button{display:none}
 .kc-tour .kc-tour__mobileactions a{background:var(--kc-accent);color:white;text-decoration:none}
 .kc-tour-walkpad{display:none}
 .kc-tour-joystick{display:block;left:18px;bottom:125px}
 .kc-tour__plan{padding-top:140px}
 .kc-tour__photo p{top:145px}
 .kc-tour__measurebar{top:140px}
}
.kc-tour[data-mode="plan"] .kc-tour-joystick,.kc-tour[data-mode="dollhouse"] .kc-tour-joystick{display:none}
/* Scene controls share a compact, touch-friendly settings panel. */
.kc-tour__tr{width:208px;flex-direction:column;align-items:stretch;padding:12px;border-radius:20px;gap:4px}
.kc-settings-title{font-size:12px;font-weight:700;padding:4px 8px;color:#64748b}
.kc-tour__tr>button{justify-content:flex-start;gap:10px;min-height:44px;border-radius:10px}
.kc-look-controls{display:flex;gap:4px}.kc-look-controls button{flex:1;min-width:40px;min-height:44px;font-size:20px}
.kc-brightness{display:grid;grid-template-columns:1fr auto;gap:4px;padding:8px;font-size:12px;font-weight:600}.kc-brightness input{grid-column:1/-1;width:100%;height:28px;accent-color:#3d6dad;touch-action:pan-x}.kc-brightness output{font-variant-numeric:tabular-nums;color:#64748b}
.kc-toggle{display:block!important;margin-left:auto;width:30px;height:18px;border-radius:10px;background:#cbd5e1;position:relative}.kc-toggle:after{content:'';position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:white;transition:transform .15s}.kc-tour__tr button[aria-pressed=true] .kc-toggle{background:#3d6dad}.kc-tour__tr button[aria-pressed=true] .kc-toggle:after{transform:translateX(12px)}
.kc-tour[data-mode=plan] .kc-look-controls{display:none}
@media(max-width:767px){.kc-tour--compact .kc-tour__tr{width:208px;padding:10px;max-height:calc(100% - 180px);overflow:auto}.kc-tour--compact .kc-tour__tl .kc-title{max-width:calc(100% - 90px)}.kc-tour.is-tools-open .kc-tour__environment{top:auto;bottom:125px}.kc-look-controls button{padding:0!important;justify-content:center!important}}
.kc-tour__tr .kc-tour-landscape{position:static!important;width:auto!important;display:flex!important;min-height:44px;border:0;box-shadow:none;margin:0;font-size:12px;justify-content:flex-start;border-radius:10px}
/* Controls are opt-in; the resting view keeps the architecture unobstructed. */
.kc-tour .kc-tour-navtoggle,.kc-tour .kc-tour-more{display:flex;align-items:center;justify-content:center;position:absolute;top:16px;z-index:8;min-height:44px;border:1px solid #ffffff80;background:var(--kc-glass);backdrop-filter:blur(12px);box-shadow:0 3px 14px #0001;color:var(--kc-ink)}
.kc-tour .kc-tour-navtoggle{left:16px;padding:0 14px;gap:8px;border-radius:24px;font-size:12px;font-weight:600}.kc-tour-navtoggle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7}
.kc-tour .kc-tour-more{right:16px;width:44px;height:44px;border-radius:50%;font-size:27px}
.kc-tour .kc-tour__tr{display:none;top:70px!important;bottom:auto!important;right:16px!important;z-index:7;max-height:calc(100% - 90px);overflow:auto}
.kc-tour.is-tools-open .kc-tour__tr{display:flex}
.kc-tour:not(.is-navigation-open) .kc-tour__tl,.kc-tour:not(.is-navigation-open) .kc-tour__roomnav,.kc-tour:not(.is-navigation-open) .kc-tour__bc,.kc-tour:not(.is-navigation-open) .kc-tour__bl,.kc-tour:not(.is-navigation-open) .kc-tour__br,.kc-tour:not(.is-navigation-open) .kc-tour__hint,.kc-tour:not(.is-navigation-open) .kc-tour__mobileactions,.kc-tour:not(.is-navigation-open) .kc-tour-game,.kc-tour:not(.is-navigation-open) .kc-portal{display:none!important}
.kc-tour.is-navigation-open .kc-tour__tl{top:74px!important}.kc-tour.is-navigation-open .kc-tour__roomnav{top:190px!important}
.kc-tour:not(.is-navigation-open) .kc-tour-joystick{bottom:32px}
.kc-tour .kc-tour__plan{padding-top:76px;padding-bottom:24px}
@media(max-width:767px){.kc-tour .kc-tour-navtoggle{top:12px;left:12px}.kc-tour .kc-tour-more{top:12px;right:12px}.kc-tour.is-navigation-open .kc-tour__tl{right:12px!important;top:68px!important}.kc-tour.is-navigation-open .kc-tour__roomnav{top:130px!important}.kc-tour.is-tools-open .kc-tour__tr span{display:inline}.kc-tour.is-tools-open .kc-mobiletool{display:flex}.kc-tour .kc-tour__tr{max-height:calc(100% - 90px)}}
@media(max-width:1024px){.kc-tour-joystick{display:block;left:18px;bottom:125px}.kc-tour-walkpad{display:none}.kc-tour.is-tools-open .kc-mobiletool{display:flex}.kc-tour .kc-tour-game{display:none}}
.kc-tour:not(.is-navigation-open) .kc-tour-joystick{bottom:32px}
.kc-tour[data-mode=plan] .kc-tour-joystick,.kc-tour[data-mode=dollhouse] .kc-tour-joystick{display:none}
@media(prefers-reduced-motion:reduce){.kc-tour .kc-toggle:after{transition:none}}
.kc-tour[data-mode=plan] .kc-brightness,.kc-tour[data-mode=plan] [data-act=furniture],.kc-tour[data-mode=plan] [data-act=roof],.kc-tour[data-mode=plan] .kc-tour__tr .kc-tour-landscape{display:none!important}
.kc-tour[data-mode=plan] [data-act=collision],.kc-tour[data-mode=dollhouse] [data-act=collision]{display:none!important}
.kc-tour.is-tools-open .kc-tour__tr>button>span{display:inline}
.kc-tour.is-tools-open .kc-mobiletool{display:flex}
/* Mouse users can use the same visible walking control as touch users. */
.kc-tour .kc-tour-joystick{display:block;left:18px;bottom:32px}
.kc-tour.is-navigation-open .kc-tour-joystick{bottom:125px}
.kc-tour[data-mode=plan] .kc-tour-joystick,.kc-tour[data-mode=dollhouse] .kc-tour-joystick{display:none}
.kc-tour .kc-tour-more{width:auto;min-width:44px;padding:0 14px;gap:7px;font-size:22px}
.kc-tour-more small{font-size:12px;font-weight:600}
@media(max-width:560px){.kc-tour .kc-tour-more{width:44px;padding:0}.kc-tour-more small{display:none}}

/* Unified viewer panels: one contained menu, with the scene visible alongside. */
.kc-tour { --kc-glass:rgba(255,255,255,.97); }
.kc-tour .kc-tour-navtoggle,.kc-tour .kc-tour-more { min-height:48px;height:48px;border-radius:14px;padding:0 16px;gap:10px;font-size:13px;box-shadow:0 4px 20px #18211c18; }
.kc-tour-more small { font-size:13px;display:block; }
.kc-tour .kc-tour-navtoggle[aria-expanded=true],.kc-tour .kc-tour-more[aria-expanded=true] { background:var(--kc-accent);color:white;border-color:var(--kc-accent); }
.kc-tour .kc-navigation-panel,.kc-tour .kc-tour__tr { position:absolute;top:76px!important;bottom:auto!important;width:340px;max-width:calc(100% - 32px);max-height:calc(100% - 100px);padding:20px;border:1px solid #fff;border-radius:22px;background:var(--kc-glass);box-shadow:0 16px 48px #18211c26;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;gap:12px;backdrop-filter:blur(20px); }
.kc-tour .kc-navigation-panel { left:16px;display:none; }
.kc-tour.is-navigation-open .kc-navigation-panel { display:grid; }
.kc-tour .kc-tour__tr { right:16px!important; }
.kc-tour .kc-panel-head { display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--kc-line); }
.kc-panel-head div { display:grid;gap:4px; }
.kc-panel-head small { color:var(--kc-muted);font-size:10px;letter-spacing:.12em;font-weight:600; }
.kc-panel-head strong { font-family:var(--kc-font-head);font-size:21px;font-weight:600; }
.kc-tour .kc-panel-head button { display:grid;place-items:center;min-width:44px;width:44px;height:44px;padding:0;border-radius:12px;background:#edf1f3; }
.kc-tour .kc-navigation-panel>div { position:static!important;transform:none!important;width:100%!important;max-width:none!important;margin:0; }
.kc-tour .kc-navigation-panel .kc-tour__tl { display:flex;flex-direction:column;gap:12px;align-items:stretch; }
.kc-tour .kc-navigation-panel .kc-seg { width:100%;border-radius:13px;padding:4px;box-shadow:none;background:#edf1f3;gap:2px; }
.kc-tour .kc-navigation-panel .kc-seg button { flex:1;min-width:0;padding:8px 2px;font-size:11px;border-radius:10px;gap:4px;flex-direction:column;min-height:56px; }
.kc-tour .kc-navigation-panel .kc-seg svg { display:block;width:18px;height:18px; }
.kc-tour .kc-navigation-panel .kc-title { background:transparent;color:var(--kc-ink);padding:4px 0;backdrop-filter:none;max-width:none; }
.kc-tour .kc-navigation-panel .kc-title strong { font-size:20px; }
.kc-tour .kc-navigation-panel .kc-title small { font-size:12px;color:var(--kc-muted); }
.kc-tour .kc-navigation-panel .kc-tour__roomnav { display:none!important; }
.kc-tour .kc-navigation-panel .kc-strip { display:grid;grid-template-columns:44px 1fr 44px;gap:8px;padding:0;background:none;box-shadow:none; }
.kc-tour .kc-navigation-panel .kc-strip__list { grid-column:1/-1;grid-row:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;gap:12px 8px; }
.kc-tour .kc-navigation-panel .kc-station { width:100%;min-width:0;gap:6px; }
.kc-tour .kc-navigation-panel .kc-station__img { height:55px;border-radius:10px; }
.kc-tour .kc-navigation-panel .kc-station__lbl { font-size:11px; }
.kc-tour .kc-navigation-panel .kc-chip { display:flex;grid-column:2;grid-row:2;justify-content:center;padding:0 8px;font-size:12px; }
.kc-tour .kc-navigation-panel [data-act=next] { grid-column:3;grid-row:2; }
.kc-tour .kc-navigation-panel .kc-minimap { display:block;padding:12px 0 0;border-radius:0;background:none;box-shadow:none;border-top:1px solid var(--kc-line); }
.kc-tour .kc-navigation-panel .kc-eyebrow { display:block; }
.kc-tour .kc-navigation-panel .kc-minimap svg { max-height:130px; }
.kc-tour .kc-tour__br,.kc-tour .kc-tour__mobileactions,.kc-tour .kc-tour__hint,.kc-tour .kc-tour-game { display:none!important; }
.kc-tour .kc-control-label { display:block;font-size:11px;font-weight:600;color:var(--kc-muted);padding:0 4px; }
.kc-tour .kc-look-controls { gap:8px; }
.kc-tour .kc-look-controls button { background:#edf1f3;border-radius:12px;min-height:48px; }
.kc-tour .kc-brightness { padding:12px 4px;border-bottom:1px solid var(--kc-line);font-size:13px;gap:8px; }
.kc-tour .kc-brightness input { height:36px; }
.kc-tour .kc-tour__tr>button { min-height:48px;font-size:13px;padding:0 12px;background:#f2f5f6;border-radius:12px; }
.kc-tour .kc-tour__tr>button>span { display:inline; }
.kc-tour .kc-toggle { width:36px;height:22px;flex:none; }
.kc-tour .kc-toggle:after { width:16px;height:16px; }
.kc-tour .kc-tour__tr button[aria-pressed=true] .kc-toggle:after { transform:translateX(14px); }
.kc-tour.is-navigation-open .kc-tour-joystick,.kc-tour.is-tools-open .kc-tour-joystick { visibility:hidden; }
@media(hover:hover) { .kc-tour button:hover { filter:brightness(.96); } }
@media(max-width:600px) {
 .kc-tour .kc-tour-navtoggle,.kc-tour .kc-tour-more { top:12px;min-height:48px;padding:0 12px;font-size:12px; }
 .kc-tour .kc-tour-more { width:auto; }
 .kc-tour-more small { display:block;font-size:12px; }
 .kc-tour .kc-navigation-panel,.kc-tour .kc-tour__tr { top:auto!important;bottom:max(12px,env(safe-area-inset-bottom))!important;left:12px;right:12px!important;width:auto;max-width:none;max-height:70%;padding:16px;border-radius:22px; }
 .kc-tour .kc-navigation-panel .kc-minimap { display:none; }
 .kc-tour .kc-tour__tr { gap:8px; }
 .kc-tour .kc-panel-head { padding-bottom:8px; }
 .kc-tour .kc-tour__tr>button { min-height:44px; }
}
.kc-tour .kc-settings-footer { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;border-top:1px solid var(--kc-line);padding-top:12px; }
.kc-tour .kc-settings-footer button { display:flex;flex-direction:column;gap:6px;min-width:0;min-height:62px;padding:8px 2px;border-radius:12px;background:#edf1f3;font-size:11px; }
.kc-tour .kc-settings-footer button span { display:inline; }
.kc-tour .kc-settings-footer .kc-mobiletool { display:flex; }
@media(max-width:600px) { .kc-tour .kc-tour__tr { max-height:80%; } }
.kc-tour.is-navigation-open .kc-navigation-panel .kc-tour__roomnav { display:flex!important;padding:0;box-shadow:none;background:#edf1f3;border-radius:12px; }
.kc-tour .kc-navigation-panel .kc-tour__roomnav button { display:none; }
.kc-tour .kc-navigation-panel .kc-tour-roomselect { display:block;min-height:44px;width:100%;padding:0 12px;border:0;border-radius:12px;background:transparent;color:var(--kc-ink);font:600 12px var(--kc-font); }
@media(max-width:600px) { .kc-tour .kc-navigation-panel { max-height:76%; } }
.kc-tour-joystick:focus-visible { outline:3px solid white;outline-offset:4px;box-shadow:0 0 0 7px var(--kc-accent); }
@media(pointer:fine) and (min-width:901px) {
 .kc-tour[data-mode=walk].is-tools-open .kc-tour__tr .kc-tour-game { display:flex!important;position:static;min-height:48px;padding:0 12px;border-radius:12px;background:#edf1f3;box-shadow:none; }
}

/* Desktop input guidance stays clear of the walking control and open panels. */
.kc-desktop-guide { display:none;pointer-events:none; }
@media (pointer:fine) and (min-width:901px) {
 .kc-tour[data-mode=walk]:not(.is-navigation-open):not(.is-tools-open) .kc-desktop-guide { display:flex;position:absolute;right:24px;bottom:24px;align-items:center;gap:16px;padding:10px 14px;border:1px solid #ffffff38;border-radius:12px;background:rgba(24,33,28,.72);color:#fff;backdrop-filter:blur(12px);font-size:12px; }
 .kc-desktop-guide span { display:flex;align-items:center;gap:6px; }
 .kc-desktop-guide b { font-weight:500; }
 .kc-desktop-guide kbd { font:600 11px var(--kc-font);padding:3px 6px;border:1px solid #ffffff60;border-radius:5px; }
 .kc-tour .kc-tour-joystick { left:24px;bottom:40px; }
}
.kc-tour .kc-tour-navtoggle:focus-visible,.kc-tour .kc-tour-more:focus-visible { outline-offset:4px; }
.kc-tour button:active:not(:disabled) { filter:brightness(.90); }
.kc-tour button:disabled { cursor:default;opacity:.45; }
@media (hover:hover) {
 .kc-tour .kc-tour-navtoggle:hover,.kc-tour .kc-tour-more:hover { box-shadow:0 6px 24px #18211c30; }
 .kc-tour .kc-look-controls button:hover,.kc-tour .kc-settings-footer button:hover,.kc-tour .kc-panel-head button:hover { background:#e0e7ed; }
}

/* Information points are an independent, optional scene layer. */
.kc-tour:not(.is-info-enabled) .kc-marker { display:none!important; }
.kc-tour .kc-info-toggle { display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;border-radius:12px;background:#edf1f3;font-size:13px; }
.kc-info-toggle .kc-toggle { margin-left:auto; }
.kc-info-toggle[aria-pressed=true] .kc-toggle { background:var(--kc-accent); }
.kc-info-toggle[aria-pressed=true] .kc-toggle:after { transform:translateX(14px); }
.kc-tour .kc-marker__dot { width:44px;height:44px; }
.kc-tour .kc-marker__label { white-space:normal;overflow-wrap:anywhere;gap:6px;padding:14px;line-height:1.45; }
.kc-tour .kc-marker__label { max-height:calc(var(--kc-height, 700px) - 110px);overflow:auto;overscroll-behavior:contain; }

/* Fullscreen must override the configured embedded height, including landscape. */
.kc-tour:fullscreen { width:100vw;height:100dvh!important;min-height:0!important;max-height:none;border-radius:0; }
.kc-tour__help .kc-card { padding:0;gap:0; }
.kc-tour__help .kc-card__head { padding:16px 24px;border-bottom:1px solid var(--kc-line); }
.kc-tour__help .kc-keys { padding:0 24px 24px; }

/* Consistent brightness control across desktop, tablet and phone browsers. */
.kc-tour .kc-brightness input[type=range] { appearance:none;-webkit-appearance:none;width:100%;margin:0;background:transparent;cursor:pointer;accent-color:var(--kc-accent); }
.kc-tour .kc-brightness input[type=range]::-webkit-slider-runnable-track { height:6px;border-radius:6px;background:#dce3e9; }
.kc-tour .kc-brightness input[type=range]::-moz-range-track { height:6px;border-radius:6px;background:#dce3e9; }
.kc-tour .kc-brightness input[type=range]::-webkit-slider-thumb { appearance:none;-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border:3px solid white;border-radius:50%;background:var(--kc-accent);box-shadow:0 2px 7px #18211c40; }
.kc-tour .kc-brightness input[type=range]::-moz-range-thumb { width:16px;height:16px;border:3px solid white;border-radius:50%;background:var(--kc-accent);box-shadow:0 2px 7px #18211c40; }
.kc-tour .kc-brightness input[type=range]:focus-visible { outline:3px solid var(--kc-accent);outline-offset:2px;border-radius:8px; }
@media(pointer:fine) and (min-width:901px) {
 .kc-tour .kc-desktop-guide { max-width:calc(100% - 190px);flex-wrap:wrap;justify-content:flex-end;row-gap:8px; }
}

/* Embedded desktop viewers respond to their own width, not the browser window. */
@container kc-tour (max-width: 420px) {
 .kc-tour .kc-tour-more { width:48px;min-width:48px;padding:0; }
 .kc-tour .kc-tour-more small { display:none; }
 .kc-tour[data-mode=walk]:not(.is-navigation-open):not(.is-tools-open) .kc-desktop-guide { display:none; }
}

.kc-desktop-guide kbd { white-space:nowrap;flex-shrink:0; }

/* Door actions belong to the scene; open panels suspend scene interaction. */
.kc-tour.is-navigation-open .kc-tour-interact,.kc-tour.is-tools-open .kc-tour-interact { display:none; }
.kc-tour .kc-tour-interact { display:inline-flex;align-items:center;justify-content:center;gap:12px; }
.kc-tour .kc-door-key { font:600 12px var(--kc-font);padding:2px 6px;border:1px solid #ffffff70;border-radius:5px; }
.kc-tour .kc-toast { width:max-content;max-width:min(600px,calc(100% - 32px));white-space:normal;text-overflow:clip;overflow:visible;line-height:1.45;text-align:center;border-radius:14px; }
@media (max-width:900px),(pointer:coarse) {
 .kc-tour .kc-tour-interact { top:auto;left:auto;right:16px;bottom:32px;transform:none;max-width:calc(100% - 148px);min-height:48px;padding:12px 16px;font-size:13px;border-radius:16px;white-space:normal; }
 .kc-tour .kc-door-key { display:none; }
 .kc-tour .kc-toast { bottom:156px;max-width:calc(100% - 32px); }
}