@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";:root{color:#393d36;font-synthesis:none;background:#f7f7f2;font-family:Manrope,Arial,sans-serif}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:0}button:focus-visible,a:focus-visible{outline-offset:4px;outline:2px solid #6e7955}#app{min-height:100vh;display:flex}.sidebar{background:#fdfdf9;border-right:1px solid #e5e6dd;flex-direction:column;flex-shrink:0;width:292px;padding:34px 26px 20px;display:flex}.brand{color:#3e4438;letter-spacing:-4px;font-size:46px;font-weight:800;line-height:1;text-decoration:none}.brand span{letter-spacing:3px;margin-top:13px;font-size:8px;font-weight:600;display:block}.project-label,.eyebrow,.section-label,.setting-label{letter-spacing:1.8px;color:#8e9386;font-size:9px;font-weight:700}.project-label{margin-top:49px}h1{letter-spacing:-1.1px;margin:16px 0;font-size:29px;font-weight:500;line-height:1.35}h1>span{color:#87956b}.intro{color:#93978e;margin:0 0 35px;font-size:11px;line-height:1.9}.section-label{justify-content:space-between;margin-bottom:12px;display:flex}.section-label>span{color:#a6ac9b}.room{text-align:left;border-radius:7px;align-items:center;gap:12px;width:100%;margin-bottom:5px;padding:13px 11px;transition:background .2s;display:flex}.room:hover{background:#f1f2eb}.room.active{color:#536142;background:#e9eddf}.room-icon{width:25px;font-size:23px;font-weight:400}.room>span:nth-child(2){font-size:12px;font-weight:600}.room small{color:#989d90;margin-top:5px;font-size:9px;font-weight:400;display:block}.room b{opacity:0;margin-left:auto;font-size:14px;font-weight:400}.room.active b{opacity:1}.reference{border-top:1px solid #e7e8e0;gap:11px;margin-top:30px;padding-top:20px;display:flex}.reference img{object-fit:cover;border-radius:4px;width:54px;height:67px}.reference div>span{letter-spacing:1.3px;color:#989d90;font-size:8px}.reference p{margin:8px 0;font-size:10px}.reference button{color:#7c866c;padding:0;font-size:9px}footer{color:#9a9e94;align-items:center;gap:6px;margin-top:auto;padding-top:28px;font-size:9px;display:flex}footer>span:last-child{margin-left:auto}.dot{background:#889771;border-radius:50%;width:5px;height:5px;display:inline-block}main{flex:1;min-width:0;padding:0 34px}header{justify-content:space-between;align-items:center;height:90px;display:flex}.breadcrumb{color:#848a7d;font-size:10px}.breadcrumb span{color:#b8bcb1;padding:0 14px}.outline{border:1px solid #d9ddd0;border-radius:5px;gap:9px;padding:10px 14px;font-size:10px;display:flex}.workspace{background:radial-gradient(at 45% 45%,#f3f2e9,#eaece3);border:1px solid #e0e3d7;border-radius:11px;height:calc(100vh - 259px);min-height:450px;position:relative;overflow:hidden}.scene-heading{pointer-events:none;z-index:1;position:absolute;top:27px;left:28px}h2{letter-spacing:-.8px;margin:9px 0;font-size:25px;font-weight:500}.scene-heading p{color:#909687;margin:0;font-size:10px}.view-switch{z-index:2;background:#f8f9f2bb;border:1px solid #dce0d1;border-radius:6px;padding:4px;display:flex;position:absolute;top:25px;right:23px}.view-switch button{color:#939a8a;border-radius:4px;padding:8px 12px;font-size:10px}.view-switch button.active{color:#58654b;background:#fff;box-shadow:0 2px 6px #454b3010}#viewport{touch-action:none;width:100%;height:100%}canvas{display:block}.scene-note{color:#7d8672;align-items:center;gap:7px;font-size:9px;display:flex;position:absolute;bottom:25px;left:25px}.compass{color:#929c85;pointer-events:none;flex-direction:column;align-items:center;font-size:9px;display:flex;position:absolute;top:90px;right:32px}.compass span{font-size:34px;font-weight:400;transform:rotate(-25deg)}.zoom{background:#fbfcf7cf;border:1px solid #d6dccd;border-radius:6px;flex-direction:column;display:flex;position:absolute;bottom:24px;right:23px}.zoom button{width:33px;height:31px;font-size:18px}.zoom button+button{border-top:1px solid #e2e6da}.hint{white-space:nowrap;color:#929985;pointer-events:none;background:#fcfdf6c9;border:1px solid #e1e5d6;border-radius:6px;align-items:center;gap:10px;padding:10px 14px;font-size:9px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.hint>span{font-size:15px}.hint i{background:#b1b8a7;width:2px;height:2px}.settings{border-bottom:1px solid #e0e3d8;justify-content:space-between;align-items:center;gap:20px;padding:27px 0 25px;display:flex}.setting-intro h3{margin:7px 0 0;font-size:14px;font-weight:500}.setting{border-left:1px solid #e0e3d8;padding-left:25px}.setting-label{margin-bottom:12px;font-size:8px;display:block}.light-switch{background:#eceedf;border-radius:5px;gap:3px;padding:3px;display:flex}.light-switch button{color:#8a927e;padding:6px 11px;font-size:10px}.light-switch .active{color:#58634d;background:#fff;border-radius:3px;box-shadow:0 2px 4px #35401c0d}.swatches{align-items:center;gap:9px;display:flex}.swatch{background:var(--swatch);border:3px solid #f7f7f2;border-radius:50%;width:23px;height:23px;box-shadow:0 0 0 1px #0000}.swatch.active{box-shadow:0 0 0 1px #899477}.swatches>span{color:#969c8c;margin-left:4px;font-size:9px}.toggle-row{color:#777f6b;cursor:pointer;align-items:center;gap:9px;font-size:9px;display:flex}.toggle-row input{opacity:0;position:absolute}.toggle{background:#c4c9bb;border-radius:10px;width:28px;height:16px;position:relative}.toggle:after{content:"";background:#fff;border-radius:50%;width:10px;height:10px;transition:transform .2s;position:absolute;top:3px;left:3px}.toggle-row input:checked+.toggle{background:#7c8966}.toggle-row input:checked+.toggle:after{transform:translate(12px)}.toggle-row input:focus-visible+.toggle{outline:2px solid #546541}.bottom-note{color:#9ea493;justify-content:space-between;padding:16px 0;font-size:8px;display:flex}dialog{background:#f8f7ef;border:none;border-radius:12px;max-height:94vh;padding:10px}dialog::backdrop{background:#20251dc9}dialog img{max-width:85vw;max-height:88vh;display:block}dialog button{background:#fff;border-radius:50%;width:32px;height:32px;font-size:24px;position:absolute;top:18px;right:18px}#toast{color:#fff;opacity:0;pointer-events:none;background:#4e5a41;border-radius:7px;padding:12px 22px;font-size:12px;transition:opacity .2s;position:fixed;bottom:25px;left:50%;transform:translate(-50%)}#toast.visible{opacity:1}@media (width>=1600px){.sidebar{width:330px;padding:42px 34px}main{padding:0 45px}.room{padding:17px 12px}.intro{margin-bottom:45px}.reference{margin-top:45px}}@media (width<=1100px){.sidebar{width:240px;padding:28px 18px}main{padding:0 20px}.setting{padding-left:15px}.swatches>span{display:none}.scene-heading h2{font-size:20px}.view-switch{top:100px;right:15px}.hint{gap:6px;font-size:8px}.setting-intro h3{font-size:12px}}@media (width<=760px){#app{display:block}.sidebar{border-right:0;width:100%;padding:18px}.brand{font-size:30px}.brand span{margin-top:7px;font-size:6px}.project-label,h1,.intro,.section-label,.reference,footer{display:none}#rooms{gap:6px;margin-top:18px;display:flex;overflow:auto}.room{flex-shrink:0;width:auto;padding:9px}.room small,.room b,.room-icon{display:none}.room>span:nth-child(2){font-size:10px}main{padding:0 14px}header{height:55px}.workspace{height:60vh;min-height:440px}.scene-heading{top:20px;left:20px}.scene-heading h2{font-size:22px}.view-switch{top:103px}.hint{padding:8px;font-size:8px;bottom:15px;left:15px;transform:none}.scene-note{bottom:55px;left:18px}.zoom{bottom:16px;right:12px}.settings{flex-wrap:wrap;gap:22px;padding:22px 0}.setting-intro{width:100%}.setting{border:0;padding-left:0}.bottom-note{gap:15px;font-size:7px}.compass{top:155px}}