*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#202a31;background:#f8f9fa}button,input,summary{font:inherit}button,summary{cursor:pointer}button{border:1px solid #d5dce0;background:#fff;color:#26343e;border-radius:8px;padding:10px 15px;transition:background .2s}button:hover{background:#edf1f4}button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #d17a3d;outline-offset:3px}header{height:88px;background:#fff;border-bottom:1px solid #dce1e5;padding:0 32px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:14px}.mark{background:#263943;color:#fff;font-size:26px;font-weight:300;padding:0 11px;border-radius:5px}h1{font-size:21px;margin:0;font-weight:650;letter-spacing:-.6px}.brand p{font-size:13px;color:#64727b;margin:0}.badge{font-size:13px;color:#657780;border:1px solid #dbe1e5;border-radius:20px;padding:5px 12px}main{display:grid;grid-template-columns:minmax(0,1fr) 350px;height:calc(100dvh - 88px)}.viewport{position:relative;overflow:hidden;background:#e5e9ed;min-height:520px}#canvas{position:absolute;inset:0}#canvas canvas{width:100%;height:100%;display:block;touch-action:none}.views{position:absolute;z-index:2;top:24px;left:24px;display:flex;gap:4px;background:#ffffffed;padding:5px;border-radius:12px;box-shadow:0 3px 15px #33455509}.views button{background:none;border:0;font-size:14px;padding:8px 13px}.views button.active{background:#263943;color:white}.camera{position:absolute;left:24px;bottom:59px;display:flex;gap:6px}.camera button{font-size:14px;background:#ffffffec}.hint{position:absolute;bottom:26px;left:25px;font-size:13px;color:#52636e}.scale{position:absolute;bottom:26px;right:24px;color:#61717a;font-size:12px}#loading{position:absolute;top:50%;width:100%;text-align:center;pointer-events:none}aside{background:white;border-left:1px solid #dbe1e5;overflow:auto;padding:29px 26px 24px}.sectiontitle{font-size:12px;letter-spacing:1.6px;color:#647884;font-weight:650}h2{font-size:29px;font-weight:500;line-height:1.2;letter-spacing:-1px;margin:15px 0}.intro{color:#68747c;font-size:14px;margin:0 0 25px}.controls{border-top:1px solid #e2e6e8;padding:22px 0 20px}.controls label{display:flex;justify-content:space-between;font-size:14px;gap:12px}.controls output{color:#8b532d}input[type=range]{width:100%;accent-color:#a76334;margin:16px 0 20px}.controls .check{justify-content:flex-start;align-items:center;gap:10px}.check input{accent-color:#263943;width:17px;height:17px;margin:0}.spec{background:#f4f6f7;border-radius:10px;padding:15px}.spec>div{display:flex;flex-direction:column;margin-bottom:12px}.spec>div:last-child{margin-bottom:0}.spec span{color:#6b777e;font-size:12px}.spec strong{font-size:15px;font-weight:550;letter-spacing:.4px}.materials-title{margin:27px 0 18px}.material{display:flex;align-items:center;gap:13px;margin-bottom:17px}.material strong{display:block;font-size:14px;font-weight:600}.material div>span{font-size:12px;display:block;color:#6b777e}.swatch{display:block;width:43px;height:43px;border-radius:50%;flex-shrink:0;border:1px solid #00000010}.white{background:linear-gradient(135deg,#dddeda,#fff 40%,#f0f0ec 60%,#fff)}.oak{background:#a29a8b url('./oak.jpg') center/cover}.orange{background:#c0662c}.download{width:100%;background:#263943;color:white;display:flex;justify-content:space-between;font-size:14px;margin:26px 0 18px}.download:hover{background:#3e5561}.download:disabled{opacity:.6}#download-status{font-size:13px;color:#6b777e}details{border-top:1px solid #e2e6e8;padding:13px 0;font-size:14px}summary{font-weight:550}details p{color:#64717a;font-size:14px}.source{font-size:12px;color:#6b777e}a{color:#516b7a}.dimension-label{font-size:14px}.error{background:#fff8ed;padding:24px!important;pointer-events:auto!important;max-width:450px;left:50%;transform:translate(-50%,-50%)}
@media(min-width:1600px){main{grid-template-columns:minmax(0,1fr) 380px}aside{padding:35px}}@media(max-width:900px){header{height:72px;padding:0 18px}main{grid-template-columns:1fr;height:auto}.viewport{height:68dvh;min-height:490px}aside{border-left:0;overflow:visible;padding:25px}h2 br{display:none}.spec{display:grid;grid-template-columns:1fr 1fr;gap:12px}.spec>div{margin:0}.badge{font-size:12px}.views{top:16px;left:12px;right:12px;width:fit-content}.views button{font-size:13px;padding:9px 10px}.hint{left:16px;bottom:18px;font-size:12px}.scale{display:none}.camera{left:16px;bottom:47px}.controls{max-width:560px}.material{display:inline-flex;margin-right:25px}.materials-title{margin-top:24px}.download{max-width:400px}.brand p{font-size:12px}}@media(max-width:400px){.badge{display:none}h2{font-size:25px}.viewport{min-height:450px}.views button{padding:8px}}

.room-spec{padding:14px 0 18px;border-top:1px solid #e2e6e8;display:grid;gap:9px}.room-spec>div{display:flex;justify-content:space-between;gap:10px;font-size:13px}.room-spec strong{white-space:nowrap;font-weight:600;color:#8b532d}.wall{background:#f1f1ec}.control-note{font-size:12px;color:#64717a;margin:12px 0 0}#room-options{margin-top:14px}.views{max-width:calc(100% - 32px);flex-wrap:wrap}.hint{max-width:calc(100% - 30px)}@media(max-width:600px){.views{right:12px;max-width:calc(100% - 24px);gap:1px}.views button{font-size:12px;padding:8px}.hint{font-size:11px}.room-spec{max-width:560px}.room-spec>div{font-size:14px}}

.swatch.tile{background:#d8d4cb url('./floor-stone.png') center/cover}

.handle-controls{border-top:1px solid #e2e6e8;padding:18px 0 22px}.handle-controls label{display:block;font-size:13px;margin:12px 0 6px}.handle-controls>label{margin-top:0;font-weight:600}.handle-controls select{font:inherit;font-size:14px;width:100%;min-height:42px;padding:8px;border:1px solid #d5dce0;border-radius:7px;background:#fff;color:#26343e}.handle-controls select:focus-visible{outline:3px solid #d17a3d;outline-offset:2px}