/* Owner-approved eight spaces and movable Concierge launcher. */
.space-rail-scroll { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 0; }
.space-rail a { min-width: 0; min-height: 5.8rem; border-left: 1px solid #2e2e31; padding: .85rem .2rem .75rem; font-size: .68rem; scroll-snap-align: start; }
.space-rail a:last-child { border-right: 1px solid #2e2e31; }
.space-icon { width: 1.7rem; height: 1.7rem; }
.space-gallery { background: #f3f3f1; }
.space-gallery .section-title { max-width: 48rem; }
.space-gallery .section-title > p:last-child { max-width: 43rem; margin-top: .8rem; color: var(--muted); font-size: .89rem; }
.space-gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem 1.5rem; margin-top: 2.5rem; }
.space-gallery-card { scroll-margin-top: calc(var(--header-height) + 1rem); border-top: 1px solid var(--line); padding-top: .75rem; }
.space-gallery-card:target { outline: 2px solid var(--gold); outline-offset: .5rem; }
.space-gallery-card figure { margin: 0; }
.space-gallery-card img { width: 100%; aspect-ratio: 1.6; object-fit: cover; border-radius: 2px; }
.space-gallery-card figcaption { margin-top: .65rem; color: var(--muted); font-size: .69rem; line-height: 1.45; }
.space-gallery-card figcaption[data-space-kind="Phối cảnh 3D"] { color: #6f5837; font-weight: 600; }
.space-gallery-copy { padding-top: 1.1rem; }
.space-gallery-copy h3 { margin-top: .3rem; font-size: clamp(1.3rem, 2vw, 1.75rem); }
.space-gallery-copy > p { max-width: 42rem; margin-top: .6rem; color: var(--muted); font-size: .84rem; }
.space-gallery-copy ul { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; margin: .95rem 0 0; padding: 0; list-style: none; }
.space-gallery-copy li { border-left: 2px solid var(--gold); padding-left: .55rem; color: var(--ink); font-size: .72rem; }
.space-gallery-actions { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin-top: 1.2rem; }
.space-gallery-actions a { border-bottom: 1px solid currentColor; color: var(--ink); font-size: .76rem; font-weight: 700; text-decoration: none; }
.space-gallery-actions a:hover, .space-gallery-actions a:focus-visible { color: var(--gold); }

.concierge { display: flex; flex-direction: column; align-items: stretch; width: max-content; max-width: calc(100vw - 1.5rem); }
.concierge[data-open="true"] { width: min(27.5rem, calc(100vw - 2rem)); }
.concierge-foot { order: 2; display: flex; align-items: center; min-height: 3.75rem; }
.concierge-launcher { min-width: 15.2rem; min-height: 3.75rem; gap: .55rem; border: 1px solid #998662; border-radius: 999px; background: rgba(17, 17, 18, .90); color: #f9f9f7; padding: .35rem .85rem .35rem .4rem; backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); touch-action: none; user-select: none; cursor: grab; }
.concierge[data-dragging="true"] .concierge-launcher { cursor: grabbing; }
.concierge-launcher .concierge-icon { position: relative; width: 2.55rem; height: 2.55rem; flex: 0 0 2.55rem; display: grid; place-items: center; border: 1px solid #b49c72; border-radius: 50%; color: #dcc8a4; }
.concierge-icon svg { width: 1.55rem; height: 1.55rem; }
.concierge-icon .concierge-online { position: absolute; top: -.1rem; right: -.14rem; width: .55rem; height: .55rem; border: 1px solid #111112; border-radius: 50%; background: #45cd73; }
.concierge-launcher > .concierge-launcher-copy { width: auto; height: auto; min-width: 0; flex: 1 1 auto; display: grid; place-items: stretch; gap: .08rem; border: 0; border-radius: 0; color: inherit; text-align: left; }
.concierge-launcher-copy strong { color: #fff; font-size: .83rem; line-height: 1.2; white-space: nowrap; }
.concierge-launcher-copy small { color: #e2e0d9; font-size: .62rem; line-height: 1.25; font-weight: 500; white-space: nowrap; }
.concierge[data-open="true"] .concierge-foot { border: 1px solid #998662; border-top: 0; border-radius: 0 0 1rem 1rem; background: #111112; overflow: hidden; }
.concierge[data-open="true"] .concierge-launcher { min-width: 0; width: auto; flex: 1 1 auto; margin: 0; border: 0; border-radius: 0; background: transparent; backdrop-filter: none; cursor: pointer; }
.concierge-collapse { flex: 0 0 auto; margin-right: .75rem; border: 1px solid #58514a; border-radius: 999px; background: transparent; color: #dcc8a4; padding: .38rem .65rem; cursor: pointer; font-size: .7rem; font-weight: 700; }
.concierge-collapse[hidden] { display: none; }
.concierge-collapse:focus-visible, .concierge-send:focus-visible { outline: 2px solid #b59a6b; outline-offset: 2px; }
.concierge-panel { position: relative; top: auto; right: auto; bottom: auto; left: auto; order: 1; width: 100%; height: min(37rem, max(0px, calc(100dvh - var(--gu-panel-top, 11.75rem) - var(--gu-open-bottom, 1rem) - 3.75rem))); min-height: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #b9b5ab; border-bottom: 0; border-radius: 1rem 1rem 0 0; background: #f3f3f1; color: #111112; }
.concierge-panel[hidden] { display: none; }
.concierge-day { padding: .85rem 1rem .2rem; color: #7e7b76; text-align: center; font-size: .65rem; }
.concierge-log { flex: 1 1 auto; min-height: 0; height: auto; }
.concierge-message > p { border-radius: .95rem; background: #fff; color: #111112; font-size: .86rem; line-height: 1.55; }
.concierge-message-user > p { border-color: #111112; background: #111112; color: #fff; }
.concierge-prompts { border-top: 0; padding-top: .35rem; }
.concierge-prompts button { border-color: #d1cfca; background: #fff; color: #111112; font-size: .73rem; }
.concierge-form { grid-template-columns: minmax(0, 1fr) 2.7rem; align-items: center; padding: .65rem .85rem .35rem; }
.concierge-form textarea { min-height: 2.7rem; max-height: 5rem; border: 1px solid #c8c6c1; border-radius: 1.4rem; background: #fff; color: #111112; padding: .7rem 1rem; resize: none; font-size: .83rem; }
.concierge-send { width: 2.7rem; height: 2.7rem; border: 0; border-radius: 50%; background: #dcc8a4; color: #111112; cursor: pointer; font-size: 1.35rem; }
.concierge-status:empty { display: none; }
.concierge-handoff { flex-wrap: wrap; gap: .25rem .6rem; border-top: 0; padding: .3rem .85rem .65rem; font-size: .72rem; }
.concierge-handoff a { color: #111112; }

@media (min-width: 100rem) {
  .concierge { right: max(1rem, calc((100vw - var(--container)) / 2)); }
}

@media (max-width: 47.99rem) {
  .space-rail-scroll { display: flex; width: min(calc(100% - 1.5rem), var(--container)); gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; }
  .space-rail a { flex: 0 0 25%; min-height: 4rem; padding: .35rem .15rem .5rem; font-size: .7rem; }
  .space-icon { width: 1.35rem; height: 1.35rem; }
  .space-gallery-grid { grid-template-columns: 1fr; gap: 2.3rem; margin-top: 1.7rem; }
  .space-gallery-card img { aspect-ratio: 1.4; }
  .space-gallery-copy ul { display: grid; gap: .35rem; }
  .concierge { right: .75rem; bottom: calc(7.4rem + env(safe-area-inset-bottom)); left: auto; }
  .concierge-launcher { min-width: 12.6rem; min-height: 3.4rem; padding: .3rem .65rem .3rem .35rem; }
  .concierge-launcher .concierge-icon { width: 2.25rem; height: 2.25rem; flex-basis: 2.25rem; }
  .concierge-launcher-copy strong { font-size: .77rem; }
  .concierge-launcher-copy small { font-size: .58rem; }
  .concierge[data-open="true"] { position: fixed; inset: auto .5rem .5rem .5rem; width: auto; max-width: none; height: calc(100dvh - 1rem); }
  .concierge[data-open="true"] .concierge-panel { flex: 1 1 auto; height: auto; overflow: hidden; }
  .concierge[data-open="true"] .concierge-foot { flex: 0 0 auto; }
  .concierge[data-open="true"] .concierge-launcher { min-height: 3.75rem; }
  .concierge-collapse { margin-right: .55rem; }
}

@media (prefers-reduced-motion: reduce) {
  .concierge-launcher { transition: none; }
}

/* Round two: the supplied engineer mark and a single connected chat surface. */
.concierge { right: 32px; bottom: 26px; }
.concierge[data-open="true"] { width: min(372px, calc(100vw - 2rem)); }
.concierge-launcher { min-height: 56px; }
.concierge-launcher .concierge-icon { width: 42px; height: 42px; flex-basis: 42px; }
.concierge-icon img { display: block; width: 26px; height: 26px; }
.concierge-icon .concierge-online { background: #3dbe6b; }
.concierge-panel { height: min(560px, max(0px, calc(100dvh - var(--gu-panel-top, 8rem) - var(--gu-open-bottom, 1rem) - 56px))); }
.concierge-backdrop[hidden] { display: none; }
.concierge[data-compact="true"]:not([data-open="true"]) .concierge-launcher { min-width: 56px; width: 56px; padding: 6px; }
.concierge[data-compact="true"]:not([data-open="true"]) .concierge-launcher-copy { display: none; }

@media (max-width: 47.99rem) {
  .mobile-sticky-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) 64px minmax(0,1.55fr); align-items: stretch; gap: 5px; padding: 7px 8px calc(7px + env(safe-area-inset-bottom)); }
  .mobile-sticky-actions a { min-width: 0; }
  .mobile-sticky-actions .mobile-chat-action { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; width: 64px; min-height: 46px; border: 0; border-radius: 4px; background: #111112; color: #fff; font: inherit; font-size: .66rem; font-weight: 700; cursor: pointer; }
  .mobile-chat-action img { width: 24px; height: 24px; }
  .mobile-chat-action i { position: absolute; top: 5px; right: 13px; width: 7px; height: 7px; border-radius: 50%; background: #3dbe6b; }
  .mobile-chat-action:focus-visible { outline: 2px solid #aa8f60; outline-offset: 2px; }
  .concierge { display: none; }
  .concierge[data-open="true"] { position: fixed; display: flex; inset: 124px 0 0; width: 100%; max-width: none; height: auto; z-index: 70; }
  .concierge[data-open="true"] .concierge-panel { flex: 1 1 auto; height: auto; border-right: 0; border-left: 0; border-radius: 16px 16px 0 0; }
  .concierge[data-open="true"] .concierge-foot { flex: 0 0 auto; border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0; padding-bottom: env(safe-area-inset-bottom); }
  .concierge[data-open="true"] .concierge-launcher { min-height: 56px; }
  .concierge-backdrop { position: fixed; inset: 0; z-index: 69; background: rgba(0,0,0,.5); }
  body[data-concierge-open="true"] { overflow: hidden; }
}
