/* Demo room, guided tour, and guest prompts. Uses the Roomwise theme tokens. */
.demo-banner{display:flex;align-items:center;gap:16px;padding:12px 28px;background:repeating-linear-gradient(135deg,#f3e9dc 0 14px,#efe3d3 14px 28px);border-bottom:1px solid var(--rw-sand);color:var(--rw-ink)}
.demo-banner[hidden]{display:none}
.demo-pill{flex-shrink:0;padding:6px 11px;border-radius:999px;background:var(--rw-wordmark);color:#fff7ef;font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase}
.demo-banner p{margin:0;font-size:14px;line-height:1.4;flex:1;min-width:0}
.demo-banner p span{color:var(--muted)}
.demo-banner-actions{display:flex;gap:8px;flex-shrink:0}
.demo-banner-actions button{min-height:42px;padding:0 18px;border-radius:999px;font-weight:700;font-size:14px}
.demo-ghost{background:transparent;border:1px solid #d7c3b3;color:var(--rw-wordmark)}
.demo-ghost:hover{background:#fffaf4}
.demo-scene-badge{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:4;padding:6px 14px;border:1.5px dashed #c9a99a;border-radius:999px;background:#fffaf4e6;color:var(--rw-burgundy);font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;pointer-events:none}
.demo-scene-badge[hidden]{display:none}
html[data-demo="true"] #saved,html[data-demo="true"] #uploadBtn,html[data-demo="true"] #importProject,html[data-demo="true"] #saveToAccountBtn{display:none}
html[data-demo="true"] .room-budget{display:none}

/* Guided tour */
.tour-ring{position:fixed;z-index:1000;border-radius:16px;box-shadow:0 0 0 3px var(--rw-burgundy),0 0 0 9999px #321c1729;pointer-events:none;transition:left .25s,top .25s,width .25s,height .25s}
.tour-ring[hidden]{display:none}
.tour-card{position:fixed;z-index:1001;width:min(340px,calc(100vw - 24px));padding:18px 18px 14px;border:1px solid var(--rw-sand);border-radius:18px;background:#fffdfb;color:var(--rw-ink);box-shadow:0 18px 50px #321c172e}
.tour-card[hidden]{display:none}
.tour-step{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;color:var(--rw-burgundy)}
.tour-card h3{margin:0 0 6px;font-size:18px;letter-spacing:-.3px}
.tour-card p{margin:0;font-size:14px;line-height:1.5;color:#5d4a43}
.tour-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:14px}
.tour-actions span{display:flex;gap:6px}
.tour-actions button{min-height:38px;padding:0 14px;border-radius:999px;font-weight:700;font-size:13px}
.tour-actions button:not(.dark){background:transparent;border:1px solid var(--rw-sand);color:var(--rw-wordmark)}
.tour-actions .tour-skip{border:0!important;padding:0 4px;color:var(--muted)!important;font-weight:600}
.tour-actions button[hidden]{display:none}
.tour-card button:focus-visible,.demo-banner button:focus-visible,.landing-secondary:focus-visible,.save-account-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* Landing secondary action and setup context */
.landing-secondary{display:block;margin:14px auto 0;background:none;border:0;color:var(--rw-burgundy);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.landing-secondary[hidden]{display:none}
.landing-note{display:block;margin-top:12px;font-size:13px;color:var(--muted)}
.setup-free-note{margin:-6px 0 22px;font-size:14px;color:var(--muted)}
.room-start-cost{display:inline-block;margin-top:2px;font-size:12px;font-weight:600;color:#5f7a52}

/* Guest save prompt in the editor header */
.save-account-btn{background:transparent;border:1px solid #ffffff55;color:inherit;border-radius:999px;padding:0 14px;min-height:36px;font-weight:700}
.save-account-btn[hidden]{display:none}

/* Contextual sign-in reason */
.account-context{margin:-4px 0 14px;padding:10px 12px;border-radius:12px;background:#f6ede2;color:var(--rw-ink);font-size:14px;line-height:1.45}
.account-context[hidden]{display:none}
.account-credit-message small{display:block;margin-top:3px;font-weight:400;color:var(--muted)}

.next-step-hint{animation:hint-in .25s ease-out}
@keyframes hint-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.tour-ring{transition:none}.next-step-hint{animation:none}}
@media(max-width:700px){.demo-banner{flex-wrap:wrap;padding:10px 16px;gap:10px}.demo-banner p{flex-basis:calc(100% - 110px);font-size:13px}.demo-banner p span{display:block}.demo-banner-actions{width:100%}.demo-banner-actions button{flex:1}}
#startBtn.start{width:auto;min-width:220px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:space-between;gap:28px}
#startBtn.start span{float:none}
#startBtn[aria-busy="true"]{opacity:.75;cursor:progress}
@media(max-width:700px){#saveToAccountBtn{display:none}}

/* Home page (wireframe, Oct 2026): account buttons top right, slogan, one wide pill button, demo link under it. */
.welcome-account{top:22px;right:24px;gap:10px}
.welcome-account button{min-height:44px;padding:0 18px;border-radius:14px;background:#fff;border:1px solid #ece4da;color:#3a2f2b;font-size:15px;font-weight:600;letter-spacing:-.1px;box-shadow:0 1px 2px #511e220a}
.welcome-account button:hover{background:#fffdfa;border-color:#dccfc1}
.welcome-bottom .welcome-slogan{font-size:clamp(20px,1.9vw,30px);font-weight:300;letter-spacing:-.3px;color:#6e655c;margin:0 0 18px}
#startBtn.start{min-width:280px;min-height:48px;padding:0 34px;border-radius:999px;justify-content:center;gap:34px;font-size:clamp(16px,1.25vw,19px);font-weight:400;letter-spacing:-.1px;background:#511e22;border-color:#511e22;color:#f9f4ee}
#startBtn.start:hover{background:#43181b}
#startBtn.start span{color:#e8d6c8;font-size:1.15em}
.welcome-bottom .landing-secondary{margin:12px auto 0;font-size:13px;font-weight:600;color:#8c4a42;text-decoration:underline;text-underline-offset:3px}
.welcome-bottom .landing-note{margin-top:12px;font-size:13px;color:#8a8079}

/* Home layout measured from the mockup (2000x1122): wordmark 37.5% wide with its top at 12.5%; room unchanged;
   slogan, button and link stacked tight at the bottom (slogan 84%, button 88-94%, link 96%). */
.welcome .welcome-word{font-size:8.05vw;font-size:min(8.05vw,14.4vh);letter-spacing:-.02em;top:10.3vh}
.welcome canvas#welcomeRoom{max-height:none}
.welcome .welcome-bottom{bottom:2.4vh}
.welcome .welcome-bottom .welcome-slogan{font-size:clamp(20px,2.75vh,31px);line-height:1.15;margin:0 0 2.05vh}
.welcome #startBtn.start{min-width:max(280px,19.5vw);height:clamp(44px,5.8vh,66px);min-height:0;padding:0 32px;font-size:clamp(16px,2.05vh,23px);gap:2.2vw}
.welcome .welcome-bottom .landing-secondary,.welcome .welcome-bottom .landing-note{margin-top:.3vh;font-size:clamp(13px,1.55vh,17px)}
.welcome .welcome-account{top:2.4vh;right:2vw;gap:12px}
.welcome .welcome-account button{min-height:0;height:clamp(40px,4.9vh,56px);padding:0 clamp(14px,1.8vh,20px);font-size:clamp(14px,1.7vh,19px);border-radius:clamp(12px,1.4vh,16px)}
@media(max-width:650px){.welcome .welcome-word{font-size:13vw;top:9vh}.welcome #startBtn.start{min-width:min(320px,80vw)}}
