:root{font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;color:#272d2b;background:#eeefed;font-synthesis:none;--surface:#fafaf8;--accent:#526b60;--border:#dedfda}*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #809b8a;outline-offset:4px}button:disabled{opacity:.4;cursor:default}.app{height:100dvh;max-width:1600px;margin:auto;background:var(--surface);display:flex;flex-direction:column;overflow:hidden}header{height:78px;flex-shrink:0;display:flex;align-items:center;gap:30px;padding:0 28px;border-bottom:1px solid var(--border)}h1{font-size:23px;font-weight:650;letter-spacing:.02em;margin:0;white-space:nowrap}.schemes{display:flex;margin-left:auto;align-self:stretch;gap:22px}.schemes button{position:relative;border:0;background:none;padding:0 10px;font-size:15px;white-space:nowrap}.schemes button.active{font-weight:600}.schemes button.active:after{content:"";position:absolute;height:3px;border-radius:3px;background:var(--accent);bottom:0;left:4px;right:4px}.icon{border:0;background:#fafaf8ed;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;flex-shrink:0}.workspace{display:flex;flex:1;min-height:0}.viewport{position:relative;flex:1;min-width:0;min-height:0;background:#d8d6ce;overflow:hidden}.canvas-host{width:100%;height:100%;touch-action:none}.canvas-host canvas{width:100%;height:100%;display:block;touch-action:none}.room-title{position:absolute;top:22px;left:22px;padding:11px 14px;font-size:16px;background:#fafaf8f2;border-radius:4px;pointer-events:none}.reset{position:absolute;right:22px;top:19px}.gesture{position:absolute;left:22px;bottom:18px;font-size:12px;color:#fff;text-shadow:0 1px 5px #252525;background:#272d2b68;padding:7px 10px;border-radius:3px;pointer-events:none}.loading,.error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;background:#eeefede8;color:#526b60;font-size:14px}.error{flex-direction:column}.error button{padding:10px 18px;border:1px solid var(--accent);border-radius:4px;background:var(--surface)}.spinner{width:22px;height:22px;border:2px solid #b3beb5;border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.room-panel{width:264px;flex-shrink:0;padding:22px 20px 18px;overflow-y:auto;border-left:1px solid var(--border)}h2{margin:0 0 22px;font-size:19px;font-weight:600}.room-list{display:grid;grid-template-columns:1fr 1fr;gap:22px 16px}.room-choice{border:0;background:none;padding:0;font-size:13px;text-align:center;min-width:0}.thumb{display:block;aspect-ratio:1.28;border-radius:5px;margin-bottom:8px;overflow:hidden;background:#e4e1da;outline:1px solid transparent;outline-offset:3px}.thumb img{width:100%;height:100%;object-fit:cover}.room-choice.active{color:var(--accent);font-weight:650}.room-choice.active .thumb{outline:2px solid var(--accent)}.thumb-placeholder{height:100%;display:grid;place-items:center;color:#7b807a}.room-choice:hover .thumb{filter:brightness(1.04)}footer{height:94px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-top:1px solid var(--border)}.palette{display:flex;gap:24px;align-items:center}.floor-label{font-size:17px;margin-right:10px}.material{display:flex;gap:12px;align-items:center;border:0;background:none;padding:4px;font-size:15px;min-height:44px}.material i{display:block;width:36px;height:36px;border-radius:50%;border:1px solid #a4a8a2;outline:2px solid transparent;outline-offset:3px}.material i.light{background:#b8b8b0}.material i.dark{background:#62686b}.material.active i{outline-color:var(--accent)}.render-button{border:1px solid var(--accent);background:none;color:#272d2b;border-radius:7px;min-width:126px;padding:11px 22px;font-size:15px;min-height:44px}.render-button:hover{background:#edf0ec}.modal{position:fixed;inset:0;background:#151a18ed;z-index:50;display:flex;align-items:center;justify-content:center;padding:60px 20px 30px}.modal>.icon{position:absolute;right:18px;top:18px}.modal figure{margin:0;max-width:1200px;max-height:100%;text-align:center}.modal img{max-width:100%;max-height:calc(100dvh - 120px);object-fit:contain}.modal figcaption{color:#fff;margin-top:16px;font-size:14px}.app.expanded .room-panel,.app.expanded footer{display:none}.app.expanded header{height:56px}.app.expanded header h1{font-size:18px}@media(max-width:700px){header{height:112px;position:relative;padding:0 18px 52px;justify-content:center;gap:0}h1{font-size:20px}.full{position:absolute;right:12px;top:7px}.schemes{position:absolute;left:18px;right:18px;bottom:0;height:52px;gap:16px;margin:0}.schemes button{flex:1;font-size:14px;padding:0 2px}.workspace{flex-direction:column}.viewport{flex:1;min-height:220px}.room-title{top:16px;left:16px;font-size:14px;padding:10px 12px}.reset{top:13px;right:13px}.gesture{left:12px;bottom:12px;font-size:11px;padding:5px 8px}.gesture span{display:none}.room-panel{width:100%;border-left:0;padding:14px 14px 10px;overflow:visible;flex-shrink:0}.room-panel h2{display:none}.room-list{display:flex;gap:12px;overflow-x:auto;padding:4px 3px;scrollbar-width:none}.room-list::-webkit-scrollbar{display:none}.room-choice{flex:0 0 69px;font-size:12px}.thumb{margin-bottom:7px;aspect-ratio:1.22}footer{height:calc(76px + env(safe-area-inset-bottom));padding:0 18px env(safe-area-inset-bottom)}.palette{gap:12px}.floor-label{font-size:14px;margin-right:2px}.material{gap:8px;padding:3px;font-size:13px}.material i{width:29px;height:29px}.render-button{min-width:94px;padding:10px 13px;font-size:13px}.modal{padding:60px 10px 20px}.app.expanded header{padding-bottom:0}.app.expanded .schemes{display:none}.app.expanded .viewport{min-height:0}}@media(max-width:360px){.palette{gap:8px}footer{padding-left:12px;padding-right:12px}.material{gap:5px}.render-button{min-width:80px}.room-choice{flex-basis:63px}}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}@media(max-width:1000px)and (max-height:550px)and (orientation:landscape){header{height:56px;padding:0 12px;gap:12px;justify-content:space-between}h1{font-size:17px}.schemes{position:static;height:56px;margin-left:auto;gap:8px}.schemes button{font-size:12px;padding:0 5px}.full{position:static}.workspace{flex-direction:row}.viewport{min-height:0}.room-panel{width:170px;padding:15px 12px;overflow-y:auto;border-left:1px solid var(--border)}.room-panel h2{display:none}.room-list{display:grid;grid-template-columns:1fr 1fr;gap:16px 12px;overflow:visible}.room-choice{font-size:11px}footer{height:60px;padding:0 15px}.material i{width:28px;height:28px}.app.expanded header{padding:0 12px}}
