@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Space+Grotesk:wght@400;500;600&display=swap";.app{min-height:100vh;display:flex;flex-direction:column}.app>*{flex-shrink:0}body{font-family:Arial,sans-serif;background:#1a1a2e;min-height:100vh;display:flex;flex-direction:column}header{background:#16213e;color:#fff;padding:15px 20px;text-align:center;position:relative}header h1{font-size:1.5rem;margin-bottom:5px}header p{font-size:.9rem;opacity:.8}.view-toggle-container{display:flex;justify-content:center;gap:10px;margin-top:10px}@media(max-width:768px){.view-toggle-container{flex-wrap:wrap;margin-top:10px}.view-toggle-btn{padding:8px 15px;font-size:.9rem}}.view-toggle-btn{padding:10px 20px;font-size:1rem;border:none;border-radius:6px;cursor:pointer;transition:all .3s;background:#333;color:#aaa}.view-toggle-btn.active{background:#4caf50;color:#fff}.view-toggle-btn:hover:not(.active){background:#444}.toggle-container{display:flex;justify-content:center;gap:10px;padding:15px;background:#16213e;border-radius:8px;box-shadow:0 4px 12px #0000001a}.toggle-btn{padding:10px 25px;font-size:1rem;border:none;border-radius:6px;cursor:pointer;transition:all .3s}.toggle-btn.active{background:#4caf50;color:#fff}.toggle-btn:not(.active){background:#333;color:#aaa}.toggle-btn:hover:not(.active){background:#444}.viewer-container{flex:1;display:flex;flex-direction:column;padding:20px;position:relative;width:100%;min-height:100vh;height:100%;min-height:calc(100vh - 40px);flex-basis:0}.viewer-content{flex:1;display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-height:0;flex-basis:0}#viewer{width:100%;height:100%;min-height:0;display:flex;flex-direction:column;flex:1 1 auto}model-viewer{width:100%!important;height:100%!important;min-height:100px!important;background-color:#2a2a4a;border-radius:12px;box-shadow:0 10px 40px #0000004d;display:block;flex:1 1 auto;min-width:100px!important}.viewer-header{display:flex;justify-content:center;padding:15px 0}.viewer-content{flex:1;display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-height:0}#viewer{width:100%;height:100%;min-height:0;display:flex;flex-direction:column}.view-content{width:100%;height:100%;display:none}.view-content.active{display:block}.floor-plan-placeholder{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center;padding:20px;color:#aaa}.floor-plan-placeholder a{color:#4caf50;text-decoration:none}.floor-plan-placeholder a:hover{text-decoration:underline}model-viewer{width:100%!important;height:100%!important;min-height:0;background-color:#2a2a4a;border-radius:12px;box-shadow:0 10px 40px #0000004d;display:block}.controls{background:#16213e;color:#fff;padding:15px 20px;text-align:center}.controls p{font-size:.85rem;opacity:.7}.legend-container{position:absolute;top:30px;right:30px;background:#fffffff2;padding:15px;border-radius:8px;font-size:.8rem;box-shadow:0 4px 15px #0003;z-index:10;width:250px}.legend-container h3{margin-bottom:10px;font-size:.9rem}.legend-item{display:flex;align-items:center;margin:5px 0}.legend-color{width:20px;height:20px;border-radius:3px;margin-right:8px}.mobile-toggle-btn{position:absolute;top:30px;left:30px;background:#4caf50;color:#fff;border:none;padding:10px 15px;border-radius:6px;cursor:pointer;z-index:10;display:none}.mobile-fullscreen-btn{position:absolute;top:30px;right:30px;background:#4caf50;color:#fff;border:none;padding:8px 10px;border-radius:4px;cursor:pointer;font-size:1rem;z-index:1000;display:none}.mobile-fullscreen-toggle-btn{position:absolute;top:30px;left:30px;background:#4caf50;color:#fff;border:none;padding:8px 10px;border-radius:4px;cursor:pointer;font-size:1rem;z-index:1000;display:none}.notes-section{position:absolute;top:300px;right:30px;background:#fffffff2;padding:15px;border-radius:8px;box-shadow:0 4px 15px #0003;z-index:10;width:300px;max-height:400px;overflow-y:hidden;overflow-x:hidden}.notes-container{max-height:250px;overflow-y:auto;overflow-x:hidden}.notes-section h3{margin-bottom:10px;font-size:.9rem}.notes-section textarea{width:100%;height:80px;padding:8px;border:1px solid #ddd;border-radius:4px;margin-bottom:10px;resize:vertical}.notes-section button{background:#4caf50;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;width:100%;box-sizing:border-box;font-size:1rem}@media(max-width:768px){.legend-container,.notes-section{position:static;width:100%;margin:20px 0;display:none}.mobile-toggle-btn,.mobile-fullscreen-btn{display:block}.mobile-fullscreen-toggle-btn,.fullscreen-btn-legend{display:none}.legend-container.visible,.notes-section.visible{display:block;position:static;width:100%;margin:20px 0}.viewer-container{padding-top:80px}}.fullscreen{position:fixed!important;top:0!important;left:0!important;width:100%!important;height:100%!important;z-index:1000!important;background:#1a1a2e}.fullscreen .viewer-container{position:fixed!important;top:0!important;left:0!important;width:100%!important;height:100%!important;padding:0!important;z-index:1000!important}.fullscreen model-viewer{width:100%!important;height:100%!important;max-width:none!important;border-radius:0!important;box-shadow:none!important}.fullscreen .legend-container,.fullscreen .notes-section,.fullscreen .fullscreen-btn,.fullscreen .fullscreen-btn-legend{position:fixed!important;z-index:1001!important}.fullscreen .legend-container{top:30px!important;right:30px!important;left:auto!important}.fullscreen .notes-section{top:300px!important;right:30px!important;left:auto!important;width:300px!important}.fullscreen .notes-container{max-height:250px!important}.fullscreen .mobile-toggle-btn{top:30px!important;left:30px!important}.fullscreen .fullscreen-btn-legend{top:10px!important;right:10px!important}.fullscreen .controls{position:fixed!important;bottom:0!important;left:0!important;width:100%!important;z-index:1001!important;background:#16213ee6}.fullscreen .controls p{margin:15px 20px;text-align:center}.fullscreen .toggle-container{position:fixed!important;top:10px!important;left:50%!important;transform:translate(-50%)!important;z-index:1001!important;background:#16213ee6!important;padding:10px!important;border-radius:6px!important}*{margin:0;padding:0;box-sizing:border-box}.floor-plan-app{min-height:100vh;background:#0a1628;font-family:Space Grotesk,sans-serif;display:flex;flex-direction:column}.header{background:linear-gradient(180deg,#0f2847,#0a1628);border-bottom:1px solid #1e3a5f;padding:16px 24px;display:flex;align-items:center;justify-content:space-between}.header h1{color:#e8f4ff;font-size:18px;font-weight:500;letter-spacing:.5px;display:flex;align-items:center;gap:10px}.header h1:before{content:"";display:block;width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A90D9' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M3 9h18M9 21V9'/%3E%3C/svg%3E") center/contain no-repeat}.stats{display:flex;gap:24px;font-family:JetBrains Mono,monospace;font-size:13px}.stat{color:#7eb8da}.stat-value{color:#e8f4ff;font-weight:600}.main-container{display:flex;flex:1;overflow:hidden}.sidebar{width:240px;background:#0d1f35;border-right:1px solid #1e3a5f;padding:20px;display:flex;flex-direction:column;gap:20px}.sidebar-section h3{color:#5a8bb8;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px}.room-buttons{display:flex;flex-direction:column;gap:8px}.room-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#0a1628;border:1px solid #1e3a5f;border-radius:6px;color:#c4daf0;font-family:Space Grotesk,sans-serif;font-size:13px;cursor:pointer;transition:all .15s ease}.room-btn:hover{background:#122a4a;border-color:#2e5a8f;transform:translate(2px)}.room-btn:before{content:"";width:14px;height:14px;border-radius:3px;flex-shrink:0}.room-btn[data-color="#4A90D9"]:before{background:#4a90d9}.room-btn[data-color="#7BC4A8"]:before{background:#7bc4a8}.room-btn[data-color="#E8A54B"]:before{background:#e8a54b}.room-btn[data-color="#E86B4B"]:before{background:#e86b4b}.room-btn[data-color="#9B8AC4"]:before{background:#9b8ac4}.room-btn[data-color="#C4A07B"]:before{background:#c4a07b}.room-btn[data-color="#8B7355"]:before{background:#8b7355}.room-btn[data-color="#5BA58B"]:before{background:#5ba58b}.properties-panel{padding-top:20px;border-top:1px solid #1e3a5f}.properties-panel.hidden{opacity:.4}.property-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.property-label{color:#7eb8da;font-size:12px}.property-input{width:120px;padding:6px 8px;background:#0a1628;border:1px solid #1e3a5f;border-radius:4px;color:#e8f4ff;font-family:JetBrains Mono,monospace;font-size:12px}.property-input:focus{outline:none;border-color:#4a90d9}.canvas-container{flex:1;position:relative;overflow:auto;background:#081120}.canvas{position:relative;width:1200px;height:800px;margin:20px;background:#0a1628;border:2px solid #1e3a5f;border-radius:4px;overflow:hidden}.grid-overlay{position:absolute;inset:0;background-image:linear-gradient(to right,#1e3a5f22 1px,transparent 1px),linear-gradient(to bottom,#1e3a5f22 1px,transparent 1px);background-size:4px 4px;pointer-events:none}.grid-overlay:after{content:"";position:absolute;inset:0;background-image:linear-gradient(to right,#1e3a5f44 1px,transparent 1px),linear-gradient(to bottom,#1e3a5f44 1px,transparent 1px);background-size:20px 20px;pointer-events:none}.scale-indicator{position:absolute;bottom:20px;left:20px;display:flex;align-items:center;gap:8px;color:#5a8bb8;font-family:JetBrains Mono,monospace;font-size:11px}.scale-bar{width:80px;height:4px;background:linear-gradient(90deg,#4A90D9 50%,transparent 50%);background-size:40px 4px;border:1px solid #4A90D9}.room{position:absolute;border:2px solid;border-radius:4px;cursor:move;-webkit-user-select:none;user-select:none;transition:box-shadow .15s ease}.room:hover{box-shadow:0 0 20px #4a90d933}.room.selected{box-shadow:0 0 0 2px #4a90d9,0 0 30px #4a90d94d}.room.snapping{box-shadow:0 0 0 2px #4a90d9,0 0 0 4px #7bc4a8}.room-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.room-name{display:block;color:#e8f4ff;font-size:13px;font-weight:500;text-shadow:0 1px 3px rgba(0,0,0,.5)}.room-size{display:block;color:#7eb8da;font-family:JetBrains Mono,monospace;font-size:11px;margin-top:2px}.wall-dimension{position:absolute;color:#7eb8da;font-family:JetBrains Mono,monospace;font-size:10px;background:#0a1628d9;padding:1px 4px;border-radius:2px;pointer-events:none;white-space:nowrap}.wall-top{top:-18px;left:50%;transform:translate(-50%)}.wall-bottom{bottom:-18px;left:50%;transform:translate(-50%)}.wall-left{left:-8px;top:50%;transform:translate(-100%) translateY(-50%)}.wall-right{right:-8px;top:50%;transform:translate(100%) translateY(-50%)}.delete-btn{position:absolute;top:-10px;right:-10px;width:22px;height:22px;background:#dc3545;border:2px solid #0a1628;border-radius:50%;color:#fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10}.delete-btn:hover{background:#ff4757}.resize-handle{position:absolute;width:10px;height:10px;background:#4a90d9;border:2px solid #0a1628;border-radius:2px;z-index:5}.resize-n{top:-5px;left:50%;transform:translate(-50%);cursor:n-resize}.resize-ne{top:-5px;right:-5px;cursor:ne-resize}.resize-e{top:50%;right:-5px;transform:translateY(-50%);cursor:e-resize}.resize-se{bottom:-5px;right:-5px;cursor:se-resize}.resize-s{bottom:-5px;left:50%;transform:translate(-50%);cursor:s-resize}.resize-sw{bottom:-5px;left:-5px;cursor:sw-resize}.resize-w{top:50%;left:-5px;transform:translateY(-50%);cursor:w-resize}.resize-nw{top:-5px;left:-5px;cursor:nw-resize}.help-text{position:absolute;top:20px;right:20px;color:#5a8bb8;font-size:12px;text-align:right;line-height:1.6}.help-text kbd{display:inline-block;padding:2px 6px;background:#1e3a5f;border-radius:3px;font-family:JetBrains Mono,monospace;font-size:11px}.door{position:absolute;width:40px;height:40px;cursor:move;-webkit-user-select:none;user-select:none;z-index:10}.door-frame{position:absolute;bottom:0;left:0;width:40px;height:4px;background:#e8f4ff;border-radius:1px}.door-swing{position:absolute;bottom:0;left:0;width:36px;height:36px;border:2px solid #e8f4ff;border-bottom:none;border-left:none;border-radius:0 100% 0 0;transform-origin:bottom left}.door.selected .door-frame,.door.selected .door-swing{border-color:#4a90d9;background:#4a90d9}.door.selected .door-swing{background:transparent}.door-delete{top:-8px;right:-8px}.rotate-btn{position:absolute;bottom:-8px;right:-8px;width:22px;height:22px;background:#4a90d9;border:2px solid #0a1628;border-radius:50%;color:#fff;font-size:12px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10}.rotate-btn:hover{background:#5ba0e9}.add-door-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#0a1628;border:1px dashed #4A90D9;border-radius:6px;color:#4a90d9;font-family:Space Grotesk,sans-serif;font-size:13px;cursor:pointer;transition:all .15s ease;margin-top:12px}.add-door-btn:hover{background:#122a4a;border-style:solid}.add-door-btn:before{content:"🚪";font-size:14px}.file-buttons{display:flex;flex-direction:column;gap:8px}.file-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;background:#0a1628;border:1px solid #1e3a5f;border-radius:6px;color:#c4daf0;font-family:Space Grotesk,sans-serif;font-size:13px;cursor:pointer;transition:all .15s ease}.file-btn:hover{background:#122a4a;border-color:#2e5a8f}.export-btn:before{content:"↓";font-size:14px;font-weight:700}.import-btn:before{content:"↑";font-size:14px;font-weight:700}