.warehouse-demo{background:#fffdf5;border:1px solid #cddfba;border-radius:27px;box-shadow:0 16px 55px #23401a0c}.scene-toolbar{background:#fffdf5;border-color:#dce9d0;padding:18px 26px}.scene-toolbar>span{font-size:12px}.scene-toolbar button{background:#edf6df;border-color:#c7dda9}.spatial-stage{position:relative;height:510px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 50%,#fffdf5 0%,#f2f7e9 58%,#e5efd6 100%)}.spatial-stage:before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#41750505 1px,transparent 1px),linear-gradient(90deg,#41750505 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse,black,transparent 80%);pointer-events:none}.spatial-top{position:absolute;left:26px;right:26px;top:20px;display:flex;justify-content:space-between;align-items:center;gap:15px;z-index:2;pointer-events:none}.spatial-caption{display:inline-flex;align-items:center;gap:10px;font-size:9px;letter-spacing:1.5px;font-weight:800;color:#365624}.spatial-caption i{width:7px;height:7px;background:#7ed321;border-radius:50%;box-shadow:0 0 0 4px #7ed32118}.spatial-help{font-size:10px;color:#738366}.spatial-stage canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y;outline-offset:-5px}.spatial-stage canvas:active{cursor:grabbing}.spatial-tools{position:absolute;right:23px;bottom:20px;display:flex;gap:4px;background:#fffdf5db;border:1px solid #d2e2c1;border-radius:25px;padding:5px;backdrop-filter:blur(12px);z-index:3;box-shadow:0 3px 15px #203b1607}.spatial-tools button{border:0;border-radius:50%;width:36px;height:36px;background:none;color:#417505;font-size:19px;cursor:pointer}.spatial-tools button:hover{background:#7ed321;color:#213c18}.spatial-status{position:absolute;left:25px;bottom:25px;z-index:2;display:flex;align-items:center;gap:10px;font-size:10px;font-weight:700;letter-spacing:.2px;background:#fffdf5d9;padding:10px 14px;border:1px solid #dce7d2;border-radius:22px;backdrop-filter:blur(10px)}.spatial-status-dot{width:6px;height:6px;border-radius:50%;background:#f5a623}.step-buttons{gap:10px;border:0;padding:15px 20px 0;background:#fffdf5}.step-buttons button{border:1px solid #d9e7c8;border-radius:13px;background:#f4f8ed;font-size:14px;min-height:62px;padding:18px 22px}.step-buttons button:last-child{border:1px solid #d9e7c8}.step-buttons button.active{box-shadow:0 3px 0 #417505;transform:translateY(-2px)}.step-buttons button:nth-child(2).active{box-shadow:0 3px 0 #b5700c}.step-explanation{padding:25px 28px;min-height:135px}.step-explanation h3{font-size:22px}.step-explanation p{font-size:13px}@media(max-width:1000px){.spatial-stage{height:455px}.spatial-tools{right:18px}.spatial-status{left:18px}}@media(max-width:760px){.spatial-stage{height:375px}.spatial-top{left:16px;right:16px;top:17px}.spatial-caption{font-size:8px;letter-spacing:1px}.spatial-help{font-size:8px}.spatial-tools{right:12px;bottom:14px;padding:3px;gap:0}.spatial-tools button{width:31px;height:35px;font-size:17px}.spatial-status{left:12px;bottom:64px;padding:7px 10px;font-size:8px}.step-buttons{padding:13px 12px 0;gap:7px}.step-buttons button{font-size:10px;min-height:56px;padding:12px 9px;gap:6px}.step-buttons button span{font-size:8px}.step-buttons button b{font-size:16px}.step-explanation{padding:22px;gap:15px}.step-explanation h3{font-size:21px}.spatial-stage:before{background-size:24px 24px}}@media(max-width:380px){.spatial-stage{height:340px}.spatial-help{display:none}.step-buttons button b{display:none}.step-buttons button{font-size:9px;padding:11px 7px}}

/* Fixed point of view; the scene itself carries the movement. */
.spatial-stage canvas,.spatial-stage canvas:active{cursor:default;touch-action:pan-y}.spatial-stage{background:radial-gradient(ellipse at 47% 40%,#fffdf5 0%,#f0f7e7 62%,#e5efd6 100%)}.spatial-status{bottom:22px}.spatial-top .spatial-help{font-size:9px;letter-spacing:.4px}