:root{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:#f6f1e8;background:#302b27;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible{outline:2px solid #dcb98b;outline-offset:4px}[hidden]{display:none!important}.lab-ui{display:none!important}#lab-gl{position:fixed;inset:0;width:100%;height:100%;z-index:0;touch-action:none;outline:none}#showroom{min-height:100svh;background:radial-gradient(ellipse at 50% 0%,#806752 0,#3f3730 66%,#272321 100%);padding-bottom:34px}.room-hero{position:relative;height:min(76vh,800px);min-height:510px;background:url('../assets/showroom/background.png') center top / 100% 100% no-repeat}.brand-horizontal{position:absolute;z-index:2;top:26px;left:3.5%;width:265px;filter:drop-shadow(0 0 12px #f6b56488)}.wall-sign{position:absolute;left:50%;top:27%;transform:translate(-50%,-50%);width:205px;filter:drop-shadow(0 0 12px #f2ab6199);pointer-events:none}.wall-sign img{width:100%;display:block}#roomStage{position:absolute;inset:0}#roomStage canvas{display:block;width:100%;height:100%;touch-action:pan-y}.selection{position:relative;max-width:1330px;margin:-6px auto 0;padding:0 32px}.selection h1{font-size:23px;font-weight:400;letter-spacing:.12em;display:flex;align-items:center;gap:26px;justify-content:center;margin:0 0 25px}.selection h1:before,.selection h1:after{content:"";width:100px;height:1px;background:linear-gradient(90deg,transparent,#cdbba6)}.selection h1:after{transform:rotate(180deg)}.room-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.room-card{position:relative;isolation:isolate;min-height:118px;border:1px solid #c9b7a076;border-radius:14px;overflow:hidden;background:var(--card) center / cover no-repeat;color:#fff;text-align:left;padding:22px 18px;transition:border-color .18s,box-shadow .18s}.room-card:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#211d1955,transparent 68%);z-index:-1}.room-card>span:first-child{font-size:17px;white-space:nowrap;font-weight:500;text-shadow:0 1px 5px #0008}.room-card:hover,.room-card.object-hover{border-color:#f6dbc0;box-shadow:0 0 0 1px #f6dbc044,inset 0 0 30px #f6dbc015}#detail{position:fixed;inset:0;z-index:2;pointer-events:none;color:#30343b}.detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:26px 32px;pointer-events:none}.detail-header>*{pointer-events:auto}.back-button,.info-button{border:1px solid #8e81742b;border-radius:10px;background:#fff9;color:inherit;padding:12px 17px;min-height:44px;backdrop-filter:blur(10px)}.back-button{font-size:14px;display:flex;align-items:center;gap:9px}.product-ident{position:absolute;left:50%;transform:translateX(-50%);text-align:center}.product-ident h1{font-size:21px;font-weight:500;margin:1px 0 13px;letter-spacing:.02em}.color-choices{display:flex;gap:11px;justify-content:center}.color-swatch{width:24px;height:24px;border:2px solid #ffffffb0;border-radius:50%;padding:0;background:var(--swatch);position:relative}.color-swatch[aria-pressed=true]:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid currentColor}.info-button{font-size:21px;padding:8px 14px}.single-dock{pointer-events:auto;position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:stretch;width:min(730px,calc(100% - 48px));padding:7px;border:1px solid #ffffffb3;border-radius:16px;background:#fffc;box-shadow:0 10px 40px #38302716;backdrop-filter:blur(18px)}.single-dock button{flex:1;min-width:0;white-space:nowrap;border:0;background:none;color:inherit;border-radius:10px;min-height:48px;padding:10px 8px;font-size:14px}.single-dock button:hover{background:#95857513}.single-dock button[aria-pressed=true]{background:#d3c3ae7a;color:#503e2b}.single-dock button+button{border-left:1px solid #a898841c}.part-card{pointer-events:auto;position:absolute;right:28px;top:125px;max-width:245px;padding:20px;background:#fffE;border:1px solid #fff;border-radius:12px;font-size:13px;box-shadow:0 8px 24px #0001}.part-card p{line-height:1.7;margin-bottom:0}.part-card button{float:right;border:0;background:none;font-size:20px;margin:-12px -9px 0 8px}body[data-page=detail]{background:radial-gradient(ellipse at 25% 15%,#eee7dc 0%,#d9d0c4 50%,#b9b0a6 100%)}body[data-page=detail][data-theme=graphite]{background:radial-gradient(ellipse at 30% 20%,#5b5d60 0%,#303236 45%,#191b1e 100%);color:#eee}body[data-theme=graphite] #detail{color:#f3f1ed}body[data-theme=graphite] .single-dock,body[data-theme=graphite] .back-button,body[data-theme=graphite] .info-button,body[data-theme=graphite] .part-card{background:#353638dd;border-color:#ffffff20}body[data-theme=graphite] .single-dock button[aria-pressed=true]{background:#8e827b77;color:#fff}#loading{position:fixed;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content;max-width:calc(100% - 24px);padding:18px clamp(12px,4vw,26px);white-space:nowrap;text-align:center;border:1px solid #d9c4ac80;border-radius:12px;background:#332b25eb;color:#f7eee1;font-size:14px;box-shadow:0 12px 60px #0003}#notice{position:fixed;z-index:9;left:50%;bottom:105px;transform:translateX(-50%);opacity:0;pointer-events:none;background:#302a24dd;color:white;padding:10px 15px;border-radius:8px;font-size:13px;transition:opacity .15s}#notice.visible{opacity:1}dialog{border:1px solid #d5c9bd;border-radius:16px;padding:27px;color:#34312f;background:#f7f3ed;max-width:min(520px,calc(100vw - 32px));font-size:14px;line-height:1.8}dialog::backdrop{background:#17120d60;backdrop-filter:blur(3px)}dialog h2{font-size:18px}#closeInfo{float:right;border:0;background:none;font-size:22px}#developer{border-top:1px solid #c8b9a6;padding-top:15px}#developer label{display:block;margin:12px 0}#developer select{float:right}.back-button:hover{background:#fffD}
@media(min-width:1800px){.room-hero{height:77vh;max-height:1100px}.room-cards{gap:20px}.room-card{height:145px}}
@media(max-width:699px){#showroom{padding-bottom:max(25px,env(safe-area-inset-bottom))}.room-hero{height:420px;min-height:0;background-size:auto 100%;background-position:center top}.brand-horizontal{top:22px;left:50%;transform:translateX(-50%);width:238px}.wall-sign{top:28%;width:142px}.selection{padding:0 20px;margin:0 auto;max-width:480px}.selection h1{font-size:16px;letter-spacing:.04em;gap:13px;margin:9px 0 18px}.selection h1:before,.selection h1:after{width:33px}.room-cards{grid-template-columns:1fr;gap:10px}.room-card{min-height:88px;padding:19px 21px;background-size:cover;background-position:center}.room-card>span:first-child{font-size:17px}.detail-header{padding:15px 13px;gap:5px}.back-button{padding:10px;min-width:43px}.back-button span{font-size:11px}.product-ident h1{font-size:17px;margin:1px 0 12px}.color-swatch{width:21px;height:21px}.info-button{min-height:40px;font-size:20px;padding:6px 12px}.single-dock{width:calc(100% - 20px);bottom:max(12px,env(safe-area-inset-bottom));padding:5px;border-radius:13px}.single-dock button{font-size:11px;min-height:46px;padding:10px 3px;letter-spacing:-.03em}.part-card{right:12px;top:105px;max-width:200px;font-size:12px;padding:15px}#notice{bottom:86px;max-width:90vw;font-size:12px;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.room-hero:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:70px;pointer-events:none;background:linear-gradient(transparent,#423930)}
@media(max-width:360px){.single-dock{width:calc(100% - 12px);padding:4px}.single-dock button{font-size:9.5px;padding-inline:1px}.back-button span{font-size:10px}.product-ident h1{font-size:16px}}

@media(max-width:699px){.room-hero{height:360px}.brand-horizontal{top:12px;width:205px}}
@media(max-width:699px){.brand-horizontal{top:8px;width:175px}}
/* Final composition: one continuous architectural image and its floor crop. */
#showroom{position:relative;height:100svh;min-height:760px;padding:0;background:none;z-index:2;isolation:isolate}.room-hero{position:absolute;inset:0;height:auto;min-height:0;max-height:none;background:none}.room-hero:after{display:none}.room-backdrop{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.architecture{position:absolute;inset:0 0 auto;height:var(--architecture-height,80vh);background:url('../assets/showroom/background.png') center top / auto 100% no-repeat;background-color:#594b40}.floor-extension{position:absolute;top:var(--wall-y,60vh);left:0;right:0;bottom:0;background:url('../assets/showroom/background.png') center bottom / auto 408.16% no-repeat}.architecture{background-size:max(100%, calc(var(--architecture-height,80vh) * 1.792)) 100%}.floor-extension{background-size:max(100%, calc(var(--architecture-height,80vh) * 1.792)) 408.16%}
.wall-sign{top:var(--wall-logo-y,29vh);width:clamp(170px,15vw,220px);filter:none;isolation:isolate}.wall-sign .sign-face{position:relative;z-index:2;width:100%;filter:drop-shadow(0 0 2px #ffefcf)}.wall-sign .sign-glow{position:absolute;inset:0;z-index:1;filter:blur(7px) drop-shadow(0 0 9px #ffb65c);opacity:.63}.wall-spill{position:absolute;inset:-35px -70px;background:radial-gradient(ellipse,#ffbc7250 0%,#f4ad4720 38%,transparent 72%);z-index:0}.selection{position:absolute;bottom:28px;left:0;right:0;width:100%;max-width:1330px;margin:auto;padding:0 32px;z-index:3}.selection h1{font-size:22px;margin:0 0 22px}.room-card{min-height:116px;background-position:center}.room-card>span:first-child{font-size:16px;font-weight:400}.room-card:before{background:linear-gradient(90deg,#211d1930,transparent 68%)}
#detailBackdrop{position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse at 24% 18%,#f1e8d9 0%,#ddd0bf 39%,#b7a897 74%,#9b8b7b 100%);pointer-events:none}#detailBackdrop:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 83%,#f5e9d12b 0%,transparent 49%),linear-gradient(0deg,#64503d15,transparent 36%)}#lab-gl{z-index:1}#detail{z-index:3}body[data-theme=graphite] #detailBackdrop{background:radial-gradient(ellipse at 30% 15%,#5c5a58,#302f2f 57%,#1c1b1a)}.detail-header{padding:25px 30px}.product-ident h1{font-size:16px;letter-spacing:.08em;font-weight:400;margin:1px 0 14px}.back-button,.info-button{border:1px solid #a591752d;border-radius:7px;background:#f1e8dc4d;box-shadow:none;backdrop-filter:blur(8px);min-height:40px;padding:9px 13px;font-size:12px}.info-button{font-size:18px}.color-swatch{width:20px;height:20px;border:1px solid #f5eee5}.color-swatch[aria-pressed=true]:after{inset:-4px;border-color:#6b5a48}.single-dock{width:min(610px,calc(100% - 48px));padding:4px;border:1px solid #bda98e59;border-radius:10px;background:#eee5d6b8;box-shadow:0 7px 24px #4e382614;backdrop-filter:blur(14px)}.single-dock button{min-height:44px;font-size:12px;border-radius:6px;color:#4e443a}.single-dock button+button{border-left:1px solid #b5a38926}.single-dock button[aria-pressed=true]{background:#b59e7e40;color:#392c1f;box-shadow:inset 0 0 0 1px #9a805b24}.single-dock button:hover{background:#b59e7e28}.part-card{background:#f1e9dce8;border-color:#c7b49955}.transitioning #showroom button,.transitioning #detail button,.transitioning #lab-gl{pointer-events:none}body:not([data-dev=true]) #infoButton{display:none}
@media(max-width:699px){#showroom{min-height:820px}.room-hero{height:auto;min-height:0}.wall-sign{width:142px}.selection{bottom:max(20px,env(safe-area-inset-bottom));padding:0 20px;max-width:480px}.selection h1{font-size:16px;margin-bottom:17px}.room-card{min-height:86px}.room-card>span:first-child{font-size:16px}.detail-header{padding:17px 14px}.product-ident h1{font-size:14px}.back-button{font-size:11px;padding:8px 10px}.single-dock{width:calc(100% - 20px);border-radius:9px;padding:3px}.single-dock button{font-size:11px;min-height:46px;padding-inline:3px}.color-swatch{width:19px;height:19px}}
@media(max-width:360px){.single-dock{width:calc(100% - 12px)}.single-dock button{font-size:9.5px;padding-inline:1px}.product-ident h1{font-size:12px}}
#showroom{min-height:820px}.wall-sign{width:var(--sign-width,180px)}
@media(min-width:700px) and (max-width:999px){.room-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.room-card{min-height:96px}.selection{max-width:820px}.selection h1{font-size:18px;margin-bottom:17px}}
#showroom{overflow:hidden}
.room-hero{transform-origin:0 0}
.room-platform{position:absolute;height:auto;display:block;pointer-events:none}
#roomStage{z-index:1}
.wall-sign{z-index:2}
.single-dock button:disabled{opacity:.45;cursor:default}
.dock-row {
  position:absolute;
  bottom:max(24px,env(safe-area-inset-bottom));
  left:50%;
  transform:translateX(-50%);
  width:min(662px,calc(100% - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right))));
  display:flex;
  align-items:center;
  gap:8px;
}
.dock-row .single-dock {
  position:static;
  transform:none;
  flex:1;
  min-width:0;
  width:auto;
}
#helpButton {
  -webkit-tap-highlight-color:transparent;
  pointer-events:auto;
  flex:0 0 44px;
  height:44px;
  border:1px solid #bda98e80;
  border-radius:50%;
  background:#eee5d6db;
  color:#473a2a;
  font-size:17px;
}
#helpButton[aria-expanded=true] {background:#dacbb7}
#controlHelp {
  pointer-events:auto;
  position:absolute;
  right:0;
  bottom:calc(100% + 10px);
  width:max-content;
  max-width:100%;
  box-sizing:border-box;
  padding:12px 15px;
  border:1px solid #bda98e80;
  border-radius:10px;
  background:#f5ecdef5;
  color:#473a2a;
  box-shadow:0 6px 20px #34291b20;
  font-size:13px;
  line-height:1.65;
  transition:opacity .14s, visibility .14s;
}
#controlHelp[inert] {opacity:0;visibility:hidden;pointer-events:none}
#controlHelp ul {margin:4px 0 0;padding-left:1.25em}
.help-touch {display:none}
@media(pointer:coarse) {
  .help-mouse {display:none}
  .help-touch {display:block}
}
@media(max-width:699px) {
  .dock-row {bottom:max(12px,env(safe-area-inset-bottom));gap:5px}
}
@media(max-width:360px) {
  .dock-row .single-dock button {font-size:9px;padding-inline:0}
}

/* The platform and the first WebGL frame are revealed as a single composition. */
.room-platform {width:0;visibility:hidden}
.stage-ready .room-platform {visibility:visible}
@media(max-width:699px) {
  #showroom {height:100dvh;min-height:570px}
  .selection {bottom:max(10px,env(safe-area-inset-bottom));padding-inline:clamp(12px,4vw,20px)}
  .selection h1 {margin-bottom:9px;font-size:14px}
  .room-cards {gap:6px}
  .room-card {min-height:clamp(56px,10.3dvh,86px);padding:8px 15px;border-radius:12px}
  .room-card>span:first-child {font-size:14px}
  .card-arrow {top:50%;bottom:auto;transform:translateY(-50%);right:12px}
}
/* Match the mobile layout defaults to the first camera layout while assets decode. */
@media(max-width:640px) {
  #showroom {
    --architecture-height:max(319.2px,56dvh);
    --wall-y:calc(var(--architecture-height) * .755);
    --wall-logo-y:calc(var(--architecture-height) * .37);
    --sign-width:142px;
  }
}

/* Card art remains proportional and the whole card remains the button. */
.room-card[data-showroom-product=lavo] {
  background-size:max(112%, calc(116px * 1000 / 563)) auto;
  background-position:right 44%;
}
.room-card {
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .18s,box-shadow .18s,transform .12s;
}
.room-card:is(:active,.card-selected) {
  transform:scale(.986);
  border-color:#f2d8ba;
  box-shadow:inset 0 1px 15px #2c1e2c69,inset 0 0 0 1px #f6dbc066;
}
@media(max-width:699px) {
  .room-card[data-showroom-product=lavo] {background-size:112% auto}
}
@media(prefers-reduced-motion:reduce) {
  .room-card:is(:active,.card-selected) {transform:none}
}

.transitioning .selection {will-change:opacity,transform}