/* FLUXO café chrome, v2 (loaded last). One typeface (Archivo; its wide cut for titles, like the FLUXO wordmark),
   two sizes of control (40 and 46 px), paper surfaces with a hairline, ink text, monochrome; cobalt only for something live (voice on, unread). */
:root{
  --u-paper:#f7f7f5;--u-paper2:#ecebe7;--u-ink:#1d1e22;--u-ink2:#55575e;--u-ink3:#8a8c92;--u-hair:rgba(29,30,34,.12);
  --u-cobalt:#2f45a8;--u-cobalt2:#ececea;--u-graphite:#2b2c30;--u-shadow:0 1px 2px rgba(20,21,24,.08),0 10px 28px -14px rgba(20,21,24,.35);
  --u-font:'Archivo',system-ui,sans-serif;
  --fx-display:var(--u-font);--fx-body:var(--u-font);--ss-ui:var(--u-font);--ss-display:var(--u-font)}
body,#experience,#spatial,dialog,button,input{font-family:var(--u-font)}

/* titles: the wide cut, medium weight, never italic */
.fluxo-identity h1,#info h2,#settings h2,#people h2,#spatial .panel h3,.fx-loader h2,#spatial .fx-status,.scene-caption #sceneLabel{
  font-family:var(--u-font)!important;font-style:normal!important;font-weight:600!important;font-stretch:118%!important;letter-spacing:-.015em!important}
#info h2,#settings h2,#people h2,#spatial .panel h3{font-size:26px!important;line-height:1.08!important}
.fx-loader h2{font-size:clamp(40px,5.6vw,80px)!important;line-height:1!important}
.fx-loader h2 em{font-style:normal;font-weight:400;font-stretch:100%}
#spatial .fx-status{font-size:17px!important}

/* ── top left: one compact identity pill ── */
header .identity.fluxo-identity{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;background:var(--u-paper)!important;border-radius:999px!important;box-shadow:var(--u-shadow)!important;padding:0 18px 0 16px!important;min-height:44px;gap:12px}
.fluxo-identity .fx-mark{height:12px!important}
.fluxo-identity .property-heading{padding-left:12px!important}
.fluxo-identity h1{font-size:15px!important;line-height:1!important;color:var(--u-ink)!important}
.fluxo-identity .property-location{font:500 10px/1 var(--u-font)!important;letter-spacing:.06em!important;margin-top:3px!important;color:var(--u-ink3)!important}
#localWeather.fluxo-local-weather{background:var(--u-paper)!important;border:0!important;border-radius:999px!important;box-shadow:var(--u-shadow)!important;padding:7px 14px!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
#localWeather.fluxo-local-weather *{font-family:var(--u-font)!important}

/* ── top right: actions + atmosphere ── */
header .header-actions{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;background:var(--u-paper)!important;border-radius:999px!important;box-shadow:var(--u-shadow)!important;padding:2px!important;gap:0!important}
header .header-actions button{min-width:40px!important;min-height:40px!important;border-radius:999px!important}
header .header-actions button:hover{background:var(--u-paper2)!important}
#sceneControls>summary{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;background:var(--u-paper)!important;border-radius:999px!important;box-shadow:var(--u-shadow)!important;min-height:40px!important;font:500 13px/1 var(--u-font)!important;color:var(--u-ink)!important}
html body #sceneControls .scene-controls-body{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;background:var(--u-paper)!important;border-radius:16px!important;box-shadow:var(--u-shadow)!important}

/* ── bottom dock ── */
html body .tour-dock{background:var(--u-paper)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;border-radius:999px!important;box-shadow:var(--u-shadow)!important}
.tour-dock button,.views button,#walkButton,#roomViewsButton,.tour-dock .orn.in-dock button{font:500 12px/1 var(--u-font)!important;letter-spacing:.02em!important;text-transform:none!important}
.tour-dock .book-btn.fx-shop{border-radius:999px!important}
#walkHint{background:var(--u-ink)!important;color:var(--u-paper)!important;border:0!important;border-radius:999px!important;font:500 12px/1 var(--u-font)!important;padding:10px 14px!important}
#spatial .toast,#spatial .toast.glass{border-radius:999px!important}

/* chat, voice rail: see cafe-ui.css (v26) */

/* ── phones: a quieter top ── */
@media (max-width:600px){
  header .identity.fluxo-identity{min-height:40px;padding:0 14px!important}
  .fluxo-identity .property-location{display:none!important}
  .fluxo-identity .property-heading{border-left:0!important;padding-left:0!important}
  .fluxo-identity .fx-mark{display:none!important}
  #localWeather.fluxo-local-weather{display:none!important}
  header .header-actions button{min-width:38px!important;min-height:38px!important}
  #sceneControls:not([open])>summary{width:40px;min-width:40px!important;padding:0!important;justify-content:center;font-size:0!important;gap:0!important}
  #sceneControls:not([open])>summary>*:not(svg:first-of-type){display:none!important}
  #sceneControls{top:64px!important;right:12px!important;left:auto!important}
}

/* ── People: your bubble ── */
.fx-you{display:grid;grid-template-columns:210px 1fr;gap:16px;align-items:start;margin:0 0 18px}
.fx-you-stage{position:relative;background:radial-gradient(120% 90% at 50% 30%,#fbfbfa 0%,#e6e6e3 55%,#cfcfcb 100%);border-radius:18px;overflow:hidden;aspect-ratio:1}
.fx-you-row.muted{opacity:.38}
.fx-you-hint{margin:0;font:400 12px/1.45 var(--u-font);color:var(--u-ink3)}
.fx-up{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:12px;border-radius:16px;background:var(--u-paper2)}
#people .fx-up-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px!important;border:0!important;border-radius:999px!important;background:var(--u-ink)!important;color:var(--u-paper)!important;font:500 13px/1 var(--u-font)!important;cursor:pointer}
#people .fx-up-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#people .fx-up-btn:disabled{opacity:.6;cursor:progress}
#people .fx-up-rm{min-height:40px;padding:0 14px!important;border:1px solid var(--u-hair)!important;border-radius:999px!important;background:transparent!important;color:var(--u-ink)!important;font:500 13px/1 var(--u-font)!important;cursor:pointer}
.fx-up-note{flex:1 1 220px;margin:0;font:400 12px/1.45 var(--u-font);color:var(--u-ink2)}
#people .fx-chips button{min-height:32px!important;padding:0 12px!important;font-size:12.5px!important}
.fx-you-stage canvas{width:100%;height:100%;display:block}
#people .fx-shuffle{min-height:32px;padding:0 14px!important;border-radius:999px!important;font:500 12.5px/1 var(--u-font)!important;position:absolute;left:50%;bottom:10px;transform:translateX(-50%);border:0;border-radius:999px;background:var(--u-paper);color:var(--u-ink);font:500 12px/1 var(--u-font);padding:9px 14px;box-shadow:var(--u-shadow);cursor:pointer}
.fx-you-opts{display:grid;gap:10px}
.fx-you-row{display:grid;gap:6px}
.fx-you-row>span{font:500 11px/1 var(--u-font);letter-spacing:.06em;text-transform:uppercase;color:var(--u-ink3)}
.fx-dots{display:grid;grid-template-columns:repeat(6,24px);gap:7px}
#people .fx-dots button{width:24px!important;height:24px!important;min-width:0!important;min-height:0!important;padding:0!important;border-radius:50%!important;border:0;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);cursor:pointer;padding:0}
#people .fx-dots button[aria-checked=true]{box-shadow:0 0 0 2px var(--u-paper),0 0 0 4px var(--u-ink)}
.fx-chips{display:flex;flex-wrap:wrap;gap:6px}
#people .fx-chips button{border:1px solid var(--u-hair);background:var(--u-paper);color:var(--u-ink);border-radius:999px!important;font:500 13px/1 var(--u-font)!important;padding:0 14px!important;min-height:34px;cursor:pointer}
#people .fx-chips button[aria-checked=true]{background:var(--u-ink);border-color:var(--u-ink);color:var(--u-paper)}
#people .guest-form{display:block}
@media (max-width:600px){.fx-you{grid-template-columns:1fr}.fx-you-stage{aspect-ratio:auto;height:210px}.fx-you-stage canvas{width:auto;height:100%;margin:0 auto}}
/* the atmosphere control gets a sun, so it no longer looks like Settings */
#sceneControls>summary>svg:first-of-type{display:none!important}
#sceneControls>summary::before{content:"";flex:none;width:19px;height:19px;background:currentColor;-webkit-mask:var(--sun) center/contain no-repeat;mask:var(--sun) center/contain no-repeat;
  --sun:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2.5v2M12 19.5v2M2.5 12h2M19.5 12h2M5.3 5.3l1.4 1.4M17.3 17.3l1.4 1.4M5.3 18.7l1.4-1.4M17.3 6.7l1.4-1.4'/%3E%3C/svg%3E")}
@media (max-width:600px){#sceneControls:not([open])>summary>*{display:none!important}}

/* dialogs: solid paper, rounded, no glass */
html body #people,html body #settings,html body #info{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;background:var(--u-paper)!important;color:var(--u-ink)!important;border-radius:22px!important;box-shadow:0 30px 80px -30px rgba(20,21,24,.55)!important}
#people{width:min(560px,calc(100% - 24px))!important}
#people::backdrop,#settings::backdrop,#info::backdrop{background:rgba(20,21,24,.35)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
#people .dialog-close,#settings .dialog-close,#info .dialog-close{width:40px;height:40px;border-radius:999px!important;background:var(--u-paper2)!important;border:0!important;display:grid;place-items:center}
#people .guest-row input{border:1px solid var(--u-hair)!important;border-radius:999px!important;background:#fff!important;min-height:42px;padding:0 16px!important;font:400 14px var(--u-font)!important}
#people .guest-row button{border-radius:999px!important;background:var(--u-ink)!important;color:var(--u-paper)!important;border:0!important;min-height:42px;padding:0 18px!important;font:500 13px var(--u-font)!important}
#people label{font:500 11px/1 var(--u-font)!important;letter-spacing:.06em!important;text-transform:uppercase;color:var(--u-ink3)!important}