:root{--background: #000000;--foreground: #ffffff;--border: #333333;--muted: #888888;--accent: #ffffff;--surface: #111111;--hover: #1a1a1a}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--background);color:var(--foreground);font-size:14px;font-weight:400;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{height:100%;display:flex}.main-content{flex:1;display:flex;overflow:hidden}.canvas-container{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--background);overflow:hidden;position:relative}.canvas-wrapper{position:relative;max-width:100%;max-height:100%}.canvas-wrapper canvas{display:block;max-width:100%;max-height:100%}.upload-area{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}.upload-logo{margin-bottom:32px;color:var(--border)}.upload-title{font-size:24px;font-weight:400;color:var(--foreground);letter-spacing:-.02em;margin-bottom:12px;text-align:center}.upload-subtitle{color:var(--muted);font-size:16px;margin-bottom:32px}.upload-button{display:flex;align-items:center;gap:12px;background:var(--foreground);color:var(--background);padding:14px 24px;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;transition:all .15s ease;margin-bottom:24px}.upload-button:hover{opacity:.9}.upload-hint{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px}.kbd-hint{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;background:var(--surface);border:1px solid var(--border);border-radius:6px;font-size:12px;font-weight:500;font-family:inherit;color:var(--muted)}.sidebar{width:450px;border-left:1px solid var(--border);display:flex;flex-direction:column;background:var(--background);overflow:hidden}.sidebar-section{border-bottom:1px solid var(--border)}.budget-section{flex:1;display:flex;flex-direction:column;min-height:0}.budget-content{flex:1;overflow-y:auto;min-height:0}.sidebar-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);border-bottom:1px solid var(--border)}.btn-group{background:transparent;color:var(--muted);border:1px solid var(--border);padding:4px 10px;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;font-family:inherit;border-radius:10px;transition:all .15s ease}.btn-group:hover{border-color:var(--foreground);color:var(--foreground)}.sidebar-content{padding:0;max-height:300px;overflow-y:auto}.area-item{display:flex;flex-direction:column;padding:12px 16px;border-bottom:1px solid var(--border);gap:8px;transition:background .15s ease}.area-item.selected{background:var(--surface)}.area-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer}.area-checkbox input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border:1px solid var(--border);border-radius:4px;background:transparent;cursor:pointer;position:relative;transition:all .15s ease}.area-checkbox input[type=checkbox]:hover{border-color:var(--muted)}.area-checkbox input[type=checkbox]:checked{background:var(--foreground);border-color:var(--foreground)}.area-checkbox input[type=checkbox]:checked:after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--background);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}.area-item:last-child{border-bottom:none}.area-item-header{display:flex;align-items:center;justify-content:space-between}.area-item-type{font-size:12px;color:var(--muted)}.area-item-size{font-size:14px;font-weight:500}.area-item-inputs{display:flex;gap:8px}.area-item-inputs input{flex:1;background:var(--surface);border:1px solid var(--border);color:var(--foreground);padding:6px 10px;font-size:13px;font-family:inherit}.area-item-inputs input:focus{outline:none;border-color:var(--muted)}.area-item-inputs input::placeholder{color:var(--muted)}.btn-add{background:var(--foreground);color:var(--background);border:none;padding:6px 12px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit}.btn-add:hover{opacity:.9}.selection-summary{background:var(--surface);border:1px solid var(--foreground);padding:12px;margin-bottom:12px;overflow:hidden}.selection-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.selection-title{font-size:13px;font-weight:500;color:var(--foreground)}.btn-clear{background:transparent;border:none;color:var(--muted);font-size:12px;cursor:pointer;font-family:inherit}.btn-clear:hover{color:var(--foreground)}.selection-total{font-size:24px;font-weight:600;color:var(--foreground);margin-bottom:12px}.selection-inputs{display:flex;flex-wrap:wrap;gap:8px}.selection-inputs input{flex:1;min-width:0;background:var(--background);border:1px solid var(--border);color:var(--foreground);padding:8px 12px;font-size:13px;font-family:inherit;border-radius:8px;-moz-appearance:textfield}.selection-inputs input::-webkit-outer-spin-button,.selection-inputs input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.selection-inputs input:focus{outline:none;border-color:var(--muted)}.selection-inputs input::placeholder{color:var(--muted)}.selection-inputs .btn-add{padding:8px 16px;flex-shrink:0;border-radius:8px}.budget-item{display:grid;grid-template-columns:1fr auto auto auto auto;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border);gap:12px;cursor:pointer;transition:background .15s ease}.budget-item:hover{background:var(--surface)}.budget-item.selected{background:var(--surface);border-left:3px solid var(--foreground);padding-left:13px}.budget-item:last-child{border-bottom:none}.budget-item-name{color:var(--foreground);font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.budget-item-area{color:var(--muted);font-size:12px;min-width:70px;text-align:right;white-space:nowrap}.budget-item-rate{color:var(--muted);font-size:12px;min-width:80px;text-align:right;white-space:nowrap}.budget-item-price{background:transparent;border:none;border-bottom:1px solid var(--border);color:var(--foreground);font-size:13px;font-family:inherit;width:50px;text-align:right;padding:4px 0}.budget-item-price:focus{outline:none;border-color:var(--muted)}.budget-item-unit{color:var(--muted);font-size:11px;white-space:nowrap}.budget-item-total{color:var(--foreground);font-size:13px;font-weight:500;min-width:70px;text-align:right;white-space:nowrap}.btn-delete{background:transparent;border:none;color:var(--muted);font-size:16px;cursor:pointer;padding:4px 8px;line-height:1}.btn-delete:hover{color:var(--foreground)}.budget-total{display:grid;grid-template-columns:1fr auto auto;align-items:center;padding:16px;border-top:1px solid var(--border);font-weight:600;gap:8px;flex-shrink:0}.budget-total span:last-child{text-align:right;white-space:nowrap}.btn-export{background:transparent;border:none;color:var(--muted);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:color .15s ease}.btn-export:hover{color:var(--foreground)}.empty-state{padding:24px 16px;text-align:center;color:var(--muted);font-size:13px}.calibration-input{position:absolute;bottom:24px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:4px;background:var(--surface);border:1px solid var(--border);padding:4px;border-radius:20px}.calibration-input input{width:56px;background:var(--background);border:1px solid var(--border);color:var(--foreground);padding:6px 10px;font-size:13px;font-family:inherit;text-align:center;border-radius:16px;-moz-appearance:textfield}.calibration-input input::-webkit-outer-spin-button,.calibration-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.calibration-input input:focus{outline:none;border-color:var(--muted)}.calibration-input span{color:var(--muted);font-size:13px;padding:6px 10px;white-space:nowrap}.calibration-input button{background:var(--foreground);color:var(--background);border:none;padding:6px 14px;border-radius:16px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .15s ease}.calibration-input button:hover{opacity:.9}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--background)}::-webkit-scrollbar-thumb{background:var(--border)}::-webkit-scrollbar-thumb:hover{background:var(--muted)}.canvas-mode-toggle{position:absolute;top:24px;left:50%;transform:translate(-50%);display:flex;gap:4px;background:var(--surface);border:1px solid var(--border);padding:4px;border-radius:20px}.mode-toggle-btn{padding:6px 14px;border-radius:16px;border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;font-weight:500;font-family:inherit;transition:all .15s ease}.mode-toggle-btn:hover{background:var(--hover);color:var(--foreground)}.mode-toggle-btn.active{background:var(--foreground);color:var(--background)}.area-mode-toggle{position:absolute;bottom:24px;left:50%;transform:translate(-50%);display:flex;gap:4px;background:var(--surface);border:1px solid var(--border);padding:4px;border-radius:20px}.area-mode-btn{padding:6px 14px;border-radius:16px;border:none;background:transparent;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:500;font-family:inherit;transition:all .15s ease}.area-mode-btn:hover{background:var(--hover);color:var(--foreground)}.area-mode-btn.active{background:var(--foreground);color:var(--background)}.area-mode-btn svg{flex-shrink:0;display:block}.floating-menu{position:absolute;top:24px;left:24px;display:flex;align-items:center;gap:4px;background:var(--surface);border:1px solid var(--border);padding:4px;border-radius:20px;z-index:100}.menu-toggle{width:26px;height:26px;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--muted);cursor:pointer;transition:all .15s ease}.menu-toggle:hover{background:var(--hover);color:var(--foreground)}.project-name-wrapper{position:relative;display:flex;align-items:center}.project-name-measure{position:absolute;visibility:hidden;white-space:pre;font-size:13px;font-weight:500;font-family:inherit;padding:6px 14px}.project-name-input{background:transparent;border:none;border-radius:16px;color:var(--foreground);font-size:13px;font-weight:500;font-family:inherit;padding:6px 14px;min-width:40px;transition:background .15s ease}.project-name-input:hover{background:var(--hover)}.project-name-input:focus{outline:none;background:var(--hover)}.project-name-input::placeholder{color:var(--muted)}.menu-dropdown{position:absolute;top:calc(100% + 4px);left:0;background:var(--surface);border:1px solid var(--border);border-radius:12px;min-width:140px;padding:4px;z-index:101;overflow:hidden}.menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px;background:transparent;border:none;border-radius:8px;color:var(--foreground);font-size:13px;font-weight:500;font-family:inherit;cursor:pointer;text-align:left;transition:all .15s ease}.menu-item:hover{background:var(--hover)}.menu-item:disabled{opacity:.4;cursor:not-allowed}.menu-item:disabled:hover{background:transparent}.menu-item-danger{color:#ff6b6b}.menu-item-danger:hover{background:#ff6b6b1a}
