.room .ws{--stage-w:clamp(420px,40vw,680px);--stage-top:calc(56px + 20px);position:relative;scroll-margin-top:56px}.room .ws-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--col-gap);align-items:center;min-height:56px;color:var(--muted)}.room .ws-head-title{grid-column:1/span 2;margin:0;font:inherit;color:var(--ink)}.room .ws-head-count{grid-column:3/span 1}.room .ws-head-hint{grid-column:6/span 3}.room .ws-head-all{grid-column:10/span 3;justify-self:end;display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink)}.room .ws-body{position:relative}.room .ws-list{margin:0;padding:0;list-style:none}.room .ws-row{position:relative;border-top:1px solid var(--rule)}.room .ws-row:last-child{border-bottom:1px solid var(--rule)}.room .ws-row:before{content:"";position:absolute;inset:0;background:var(--surface);transform:scaleY(0);transform-origin:bottom;transition:transform var(--t-swap) var(--ease);pointer-events:none}.room .ws-row-inner{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) auto;column-gap:24px;align-items:start;padding-top:26px;padding-bottom:24px;padding-inline-end:calc(var(--stage-w) + var(--margin) + var(--col-gap) * 2)}.room .ws-index{grid-column:1;grid-row:1;padding-top:.55em;color:var(--muted);transition:color var(--t-state) var(--ease)}.room .ws-row[data-active] .ws-index{color:var(--signal)}.room .ws-name{grid-column:2/span 2;grid-row:1;margin:0;white-space:nowrap}.room .ws-name-text{display:inline-block;transition:opacity var(--t-swap) var(--ease),transform var(--t-swap) var(--ease)}.room .ws-open:after{content:"";position:absolute;inset:0;z-index:1}.room .ws-open:focus-visible{outline:none}.room .ws-open:focus-visible:after{outline:2px solid var(--ink);outline-offset:-4px}.room .ws-meta{grid-column:2;display:flex;flex-direction:column;row-gap:4px;margin:14px 0 0;color:var(--muted)}.room .ws-kind{color:var(--ink)}.room .ws-stack{display:inline-flex;flex-wrap:wrap;gap:0}.room .ws-stack>span+span:before{content:"/";margin:0 .6em;color:var(--rule)}.room .ws-visit{grid-column:3;grid-row:2;align-self:start;position:relative;z-index:2;display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:2px;color:var(--ink);border-bottom:1px solid transparent;transition:border-color var(--t-state) var(--ease)}.room .ws-visit:focus-visible,.room .ws-visit:hover{border-bottom-color:var(--ink)}.room .ws-phone,.room .ws-phone-desk{display:none}@media (min-width:768px){.room .ws-row[data-active]:before{transform:scaleY(1)}}@media (hover:hover) and (pointer:fine){.room .ws-list:is(:hover,:focus-within) .ws-row[data-active] .ws-name-text{transform:translateX(calc(12px * var(--dir, 1)))}}.room .ws-stage-col{position:absolute;z-index:3;top:0;bottom:0;inset-inline-end:0;width:calc(var(--stage-w) + var(--margin));pointer-events:none}.room .ws-stage{--p:0;position:sticky;top:56px;display:flex;flex-direction:column;height:min(100%,calc(100svh - 56px));background:var(--surface);border-inline-start:1px solid var(--rule);border-block:1px solid var(--rule)}.room .ws-stage-bar,.room .ws-stage-foot{display:flex;align-items:center;gap:12px;height:44px;padding:0 16px;color:var(--muted)}.room .ws-stage-bar{border-bottom:1px solid var(--rule)}.room .ws-stage-foot{justify-content:space-between;border-top:1px solid var(--rule)}.room .ws-stage-count{color:var(--signal)}.room .ws-stage-host{margin-inline-start:12px;color:var(--ink)}.room .ws-stage-dims{margin-inline-start:auto}.room .ws-roll{display:inline-block;height:1.3em;overflow:hidden;vertical-align:top}.room .ws-roll-track{display:flex;flex-direction:column;transform:translateY(calc(var(--active) * -1.3em));transition:transform var(--t-swap) var(--ease)}.room .ws-roll-track>*{display:block;height:1.3em;line-height:1.3;white-space:nowrap}.room .ws-stage-ticks{display:inline-flex;gap:6px}.room .ws-stage-ticks i{position:relative;width:28px;height:2px;background:var(--rule);overflow:hidden}.room .ws-stage-ticks i:after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform var(--t-swap) var(--ease)}.room .ws-stage-ticks i[data-on]:after{transform:scaleX(1)}.room .ws-stage-view{position:relative;flex:1;overflow:hidden}.room .ws-shot{position:absolute;inset:20px;pointer-events:none}.room .ws-shot-desk,.room .ws-shot-phone{position:absolute;overflow:hidden;background:var(--ground);transition:transform var(--t-swap) var(--ease),opacity var(--t-swap) var(--ease)}.room .ws-shot-desk{top:0;left:0;width:100%;height:calc(100% - 128px);border-radius:6px;box-shadow:0 0 0 1px var(--rule);translate:0 calc(var(--p) * 18px)}.room .ws-shot-phone{bottom:0;right:5%;width:34%;max-height:calc(100% - 12px);aspect-ratio:390/844;border-radius:16px;box-shadow:0 0 0 5px var(--ground),0 0 0 6px var(--rule);translate:0 calc(var(--p) * -44px);transition-delay:0s,0s}.room .ws-shot[data-state=before] .ws-shot-desk{opacity:0;transform:translateY(-32px) scale(.98)}.room .ws-shot[data-state=after] .ws-shot-desk{opacity:0;transform:translateY(32px) scale(.98)}.room .ws-shot[data-state=before] .ws-shot-phone{opacity:0;transform:translateY(-72px)}.room .ws-shot[data-state=after] .ws-shot-phone{opacity:0;transform:translateY(72px)}.room .ws-shot[data-state=on] .ws-shot-phone{transition-delay:60ms,60ms}.room .ws-stage-path{color:var(--ink);text-transform:none}.room .ws-shot-spec{position:absolute;bottom:0;left:0;right:0;height:104px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);column-gap:24px;align-items:start;transition:transform var(--t-swap) var(--ease),opacity var(--t-swap) var(--ease)}.room .ws-shot-kind{margin:0;color:var(--ink);text-wrap:balance}.room .ws-shot-spec dl{display:grid;grid-template-columns:auto auto;justify-content:start;gap:16px;margin:0}.room .ws-shot-spec dt{margin-bottom:8px;color:var(--muted)}.room .ws-shot-spec dd{margin:0;white-space:nowrap;color:var(--ink)}.room .ws-shot[data-state=on] .ws-shot-spec{transition-delay:.1s,.1s}.room .ws-shot[data-state=before] .ws-shot-spec{opacity:0;transform:translateY(-12px)}.room .ws-shot[data-state=after] .ws-shot-spec{opacity:0;transform:translateY(12px)}@media (min-width:1024px) and (max-height:860px){.room .ws-stage{height:min(100%,calc(100svh - 112px))}}@media (max-width:1199px) and (min-width:768px){.room .ws-head-hint{display:none}}@media (max-width:1199px) and (min-width:1024px){.room .ws-name{white-space:normal}}@media (max-width:1023px){.room .ws-stage-col{display:none}.room .ws-head{grid-template-columns:auto auto 1fr;column-gap:10px}.room .ws-head-all,.room .ws-head-count,.room .ws-head-title{grid-column:auto}.room .ws-head-hint{display:none}.room .ws-row-inner{grid-template-columns:40px minmax(0,1fr);column-gap:0;padding-top:18px;padding-bottom:16px;padding-inline-end:var(--margin)}.room .ws-index{padding-top:.35em}.room .ws-name{grid-column:2;white-space:normal}.room .ws-phone{position:relative;grid-column:1/-1;display:flex;justify-content:center;height:420px;margin-top:18px;padding-top:52px;overflow:hidden;border-top:1px solid var(--rule);background:radial-gradient(ellipse 70% 60% at 50% 30%,color-mix(in srgb,var(--ink) 8%,transparent),transparent 75%),var(--surface);-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent)}.room .ws-phone-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:12px 14px;color:var(--muted)}.room .ws-phone-bar>span:first-child{color:var(--ink);text-transform:none}.room .ws-phone-screen{position:relative;flex:none;width:60%;aspect-ratio:390/844;overflow:hidden;border-radius:12px;transition:transform var(--t-enter) var(--ease)}.room .ws-row[data-active] .ws-phone-screen{transform:translateY(-8px)}.room .ws-meta{grid-column:1/-1;margin-top:6px}.room .ws-visit{grid-column:1/-1;grid-row:auto;justify-self:end;margin-top:-36px}}:root[dir=rtl] .room .ws{--dir:-1}:root[dir=rtl] .room .ws .arrow{scale:-1 1}@media (min-width:768px) and (max-width:1023px){.room .ws-row-inner{grid-template-columns:64px minmax(0,1fr);padding-top:26px;padding-bottom:22px}.room .ws-phone{display:block;height:auto;padding:52px 28px 28px;-webkit-mask-image:none;mask-image:none}.room .ws-phone-screen{display:none}.room .ws-phone-desk{position:relative;display:block;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:6px;box-shadow:0 0 0 1px var(--rule)}.room .ws-meta{margin-top:14px}.room .ws-visit{margin-top:-34px}}