.bottom-nav[data-v-81563b5e]{background:var(--bg-surface);border-top:1px solid var(--border);z-index:100;padding-bottom:env(safe-area-inset-bottom,0);display:none;position:fixed;bottom:0;left:0;right:0}@media (width<=768px){.bottom-nav[data-v-81563b5e]{display:flex}}.bottom-tab[data-v-81563b5e]{color:var(--text-secondary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;flex-direction:column;flex:1;align-items:center;padding:8px 4px;font-family:Sarabun,sans-serif;transition:color .2s;display:flex}.bottom-tab.active[data-v-81563b5e]{color:var(--accent)}.bottom-tab[data-v-81563b5e]:active{opacity:.7}.tab-icon[data-v-81563b5e]{font-size:22px;line-height:1}.tab-label[data-v-81563b5e]{margin-top:2px;font-size:10px}.drawer-overlay[data-v-81563b5e]{z-index:200;background:#00000080;align-items:flex-end;display:flex;position:fixed;inset:0}.drawer[data-v-81563b5e]{background:var(--bg-surface);width:100%;padding:12px 0 calc(80px + env(safe-area-inset-bottom)) 0;border-radius:16px 16px 0 0}.drawer-handle[data-v-81563b5e]{background:var(--border);border-radius:2px;width:40px;height:4px;margin:0 auto 16px}.drawer-items[data-v-81563b5e]{padding:0 8px}.drawer-item[data-v-81563b5e]{width:100%;color:var(--text-primary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:10px;align-items:center;gap:14px;padding:14px 16px;font-family:Sarabun,sans-serif;font-size:16px;display:flex}.drawer-item[data-v-81563b5e]:active{background:var(--bg-elevated)}.drawer-item.active[data-v-81563b5e]{color:var(--accent);background:var(--bg-elevated)}.drawer-item.logout[data-v-81563b5e]{color:var(--error)}.drawer-icon[data-v-81563b5e]{text-align:center;width:28px;font-size:22px}.drawer-divider[data-v-81563b5e]{background:var(--border);height:1px;margin:8px 16px}.drawer-user[data-v-81563b5e]{align-items:center;gap:12px;padding:12px 16px;display:flex}.drawer-enter-active[data-v-81563b5e],.drawer-leave-active[data-v-81563b5e]{transition:opacity .25s}.drawer-enter-from[data-v-81563b5e],.drawer-leave-to[data-v-81563b5e]{opacity:0}.drawer-enter-active .drawer[data-v-81563b5e],.drawer-leave-active .drawer[data-v-81563b5e]{transition:transform .25s}.drawer-enter-from .drawer[data-v-81563b5e],.drawer-leave-to .drawer[data-v-81563b5e]{transform:translateY(100%)}.upload-section[data-v-9ca2c6c3]{margin-bottom:24px}.upload-form[data-v-9ca2c6c3]{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:20px}.drop-zone[data-v-9ca2c6c3]{border:2px dashed var(--border);text-align:center;cursor:pointer;border-radius:10px;justify-content:center;align-items:center;min-height:140px;padding:30px 20px;transition:all .2s;display:flex}.drop-zone[data-v-9ca2c6c3]:hover,.drop-zone.drag-over[data-v-9ca2c6c3]{border-color:var(--accent);background:#4f8ef70d}.drop-zone.has-files[data-v-9ca2c6c3]{justify-content:flex-start;align-items:flex-start;padding:16px}.drop-icon[data-v-9ca2c6c3]{margin-bottom:10px;font-size:36px}.drop-text-pc[data-v-9ca2c6c3]{color:var(--text-secondary);font-size:14px}.drop-text-mobile[data-v-9ca2c6c3]{color:var(--text-secondary);margin-top:4px;font-size:13px}@media (hover:hover){.drop-text-mobile[data-v-9ca2c6c3],.mobile-btns[data-v-9ca2c6c3]{display:none}}@media (hover:none){.drop-text-pc[data-v-9ca2c6c3]{display:none}.drop-zone[data-v-9ca2c6c3]{min-height:80px}}.mobile-btns[data-v-9ca2c6c3]{flex-wrap:wrap;gap:10px;margin-top:12px;display:flex}.preview-grid[data-v-9ca2c6c3]{flex-wrap:wrap;gap:10px;width:100%;display:flex}.preview-item[data-v-9ca2c6c3]{width:100px;position:relative}.preview-item img[data-v-9ca2c6c3]{object-fit:cover;border:1px solid var(--border);border-radius:6px;width:100px;height:80px}.preview-name[data-v-9ca2c6c3]{color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:10px;overflow:hidden}.remove-btn[data-v-9ca2c6c3]{background:var(--error);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:14px;line-height:1;display:flex;position:absolute;top:-6px;right:-6px}.upload-progress[data-v-9ca2c6c3]{flex:1;align-items:center;display:flex}.upload-progress .progress-bar[data-v-9ca2c6c3]{flex:1}.photo-item[data-v-8d25b2a4]{cursor:pointer;background:var(--bg-elevated);border-radius:8px;position:relative;overflow:hidden}.photo-item img[data-v-8d25b2a4]{object-fit:cover;width:100%;height:120px;transition:transform .2s;display:block}.photo-item:hover img[data-v-8d25b2a4]{transform:scale(1.04)}.photo-overlay[data-v-8d25b2a4]{pointer-events:none;background:0 0;justify-content:center;align-items:center;height:120px;transition:background .2s;display:flex;position:absolute;inset:0 0 auto}.photo-item:hover .photo-overlay[data-v-8d25b2a4]{background:#00000059}.zoom-icon[data-v-8d25b2a4]{opacity:0;font-size:28px;transition:opacity .2s}.photo-item:hover .zoom-icon[data-v-8d25b2a4]{opacity:1}.photo-info[data-v-8d25b2a4]{padding:8px;font-size:11px}.photo-desc[data-v-8d25b2a4]{color:var(--accent);white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:500;overflow:hidden}.delete-photo-btn[data-v-8d25b2a4]{cursor:pointer;opacity:0;background:#000000a6;border:none;border-radius:4px;padding:3px 5px;font-size:14px;line-height:1;transition:opacity .15s;position:absolute;top:4px;right:4px}.photo-item:hover .delete-photo-btn[data-v-8d25b2a4]{opacity:1}.lightbox[data-v-8d25b2a4]{z-index:1000;-webkit-user-select:none;user-select:none;background:#000000f2;flex-direction:column;display:flex;position:fixed;inset:0}.lb-topbar[data-v-8d25b2a4]{background:#0009;flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.lb-meta[data-v-8d25b2a4]{flex:1;align-items:center;gap:8px;min-width:0;display:flex;overflow:hidden}.lb-category[data-v-8d25b2a4]{background:var(--accent);color:#fff;white-space:nowrap;border-radius:10px;flex-shrink:0;padding:2px 8px;font-size:11px}.lb-desc[data-v-8d25b2a4]{color:var(--accent);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.lb-name[data-v-8d25b2a4]{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.lb-actions[data-v-8d25b2a4]{flex-shrink:0;gap:8px;display:flex}.lb-btn[data-v-8d25b2a4]{color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#ffffff1f;border:none;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;text-decoration:none;transition:background .15s;display:flex}.lb-btn[data-v-8d25b2a4]:hover{background:#ffffff38}.lb-img-wrap[data-v-8d25b2a4]{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;overflow:hidden}.lb-img[data-v-8d25b2a4]{object-fit:contain;pointer-events:none;border-radius:4px;max-width:100%;max-height:100%}.lb-arrow[data-v-8d25b2a4]{color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#ffffff1f;border:none;border-radius:8px;justify-content:center;align-items:center;width:52px;height:72px;font-size:40px;line-height:1;transition:background .15s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.lb-arrow[data-v-8d25b2a4]:hover{background:#ffffff40}.lb-prev[data-v-8d25b2a4]{left:8px}.lb-next[data-v-8d25b2a4]{right:8px}.lb-counter[data-v-8d25b2a4]{text-align:center;color:#ffffff80;flex-shrink:0;padding:10px;font-size:13px}@media (width<=768px){.lb-arrow[data-v-8d25b2a4]{width:44px;height:56px;font-size:32px}.lb-prev[data-v-8d25b2a4]{left:4px}.lb-next[data-v-8d25b2a4]{right:4px}.lb-name[data-v-8d25b2a4]{display:none}}.price-grid[data-v-81f28b0d]{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-top:4px;display:grid}.price-row[data-v-81f28b0d]{background:var(--bg-elevated);border-radius:8px;align-items:center;gap:8px;padding:10px 12px;display:flex}.price-label[data-v-81f28b0d]{flex:1;font-size:13px}.price-unit[data-v-81f28b0d]{color:var(--text-secondary);white-space:nowrap;text-align:right;min-width:70px;font-size:11px}.price-input-wrap[data-v-81f28b0d]{align-items:center;gap:4px;display:flex}.price-input[data-v-81f28b0d]{text-align:right;width:90px;padding:6px 10px}.price-unit-label[data-v-81f28b0d]{color:var(--text-secondary);white-space:nowrap;font-size:12px}.export-card[data-v-bbbabe51]{background:var(--bg-surface);border:1px solid var(--border);cursor:pointer;border-radius:12px;align-items:center;gap:16px;padding:20px;transition:all .2s;display:flex;position:relative;overflow:hidden}.export-card.featured[data-v-bbbabe51]{border-color:var(--accent);background:linear-gradient(135deg, var(--bg-surface) 0%, #4f8ef714 100%)}.export-card[data-v-bbbabe51]:active{transform:scale(.98)}.export-card[data-v-bbbabe51]:hover{border-color:var(--accent);box-shadow:0 4px 20px #4f8ef726}.export-icon[data-v-bbbabe51]{flex-shrink:0;font-size:36px}.export-info[data-v-bbbabe51]{flex:1}.export-title[data-v-bbbabe51]{margin-bottom:4px;font-size:16px;font-weight:600}.export-desc[data-v-bbbabe51]{color:var(--text-secondary);font-size:12px;line-height:1.4}.export-badge[data-v-bbbabe51]{background:var(--accent);color:#fff;border-radius:10px;padding:2px 8px;font-size:10px;font-weight:600;position:absolute;top:10px;right:10px}.export-loading[data-v-bbbabe51]{z-index:500;color:#fff;background:#00000080;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}@media (width<=768px){.grid-2[data-v-bbbabe51]{grid-template-columns:1fr!important}}:root{--bg-primary:#0f1117;--bg-surface:#1a1d27;--bg-elevated:#242836;--accent:#4f8ef7;--success:#3ddc84;--warning:#ffb340;--error:#ff5f5f;--text-primary:#fff;--text-secondary:#9ca3af;--border:#2d3748}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-primary);color:var(--text-primary);min-height:100vh;font-family:Sarabun,sans-serif}.app-container{min-height:100vh;display:flex}.sidebar{background:var(--bg-surface);border-right:1px solid var(--border);flex-direction:column;width:220px;padding:20px 0;display:flex}.sidebar-header{border-bottom:1px solid var(--border);margin-bottom:20px;padding:0 20px 20px}.sidebar-logo{color:var(--accent);font-size:20px;font-weight:700}.sidebar-subtitle{color:var(--text-secondary);margin-top:4px;font-size:11px}.sidebar-nav{flex:1}.nav-item{color:var(--text-secondary);cursor:pointer;align-items:center;gap:12px;padding:12px 20px;text-decoration:none;transition:all .2s;display:flex}.nav-item:hover,.nav-item.active{background:var(--bg-elevated);color:var(--text-primary)}.nav-item.active{border-left:3px solid var(--accent);padding-left:17px}.nav-icon{text-align:center;width:20px}.sidebar-footer{border-top:1px solid var(--border);padding:15px 20px}.user-info{align-items:center;gap:10px;display:flex}.user-avatar{font-size:24px}.user-name{font-size:14px;font-weight:500}.user-role{color:var(--text-secondary);font-size:11px}.main-content{flex:1;padding:30px;overflow-y:auto}.page-title{margin-bottom:25px;font-size:28px;font-weight:700}.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;margin-bottom:20px;padding:24px}.card-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.card-title{font-size:18px;font-weight:600}.grid-2{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.stat-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:20px}.stat-value{color:var(--accent);font-size:32px;font-weight:700}.stat-label{color:var(--text-secondary);margin-top:5px;font-size:14px}.btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-family:Sarabun,sans-serif;font-size:14px;font-weight:500;transition:all .2s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:#3a7be5}.btn-secondary{background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border)}.btn-danger{background:var(--error);color:#fff}.btn-success{background:var(--success);color:#0f1117}.form-group{margin-bottom:16px}.form-label{color:var(--text-secondary);margin-bottom:6px;font-size:14px;display:block}.form-input,.form-select,.form-textarea{background:var(--bg-elevated);border:1px solid var(--border);width:100%;color:var(--text-primary);border-radius:8px;padding:10px 14px;font-family:Sarabun,sans-serif;font-size:14px}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent);outline:none}.form-textarea{resize:vertical;min-height:80px}.table-container{overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--border);padding:12px 16px}th{color:var(--text-secondary);text-transform:uppercase;font-size:12px;font-weight:600}td{font-size:14px}tr:hover td{background:var(--bg-elevated)}.pin-container{text-align:center;max-width:300px;margin:50px auto}.pin-title{margin-bottom:30px;font-size:24px;font-weight:600}.pin-dots{justify-content:center;gap:15px;margin-bottom:30px;display:flex}.pin-dot{border:2px solid var(--border);border-radius:50%;width:16px;height:16px;transition:all .2s}.pin-dot.filled{background:var(--accent);border-color:var(--accent)}.pin-numpad{grid-template-columns:repeat(3,1fr);gap:12px;max-width:260px;margin:0 auto;display:grid}.pin-key{background:var(--bg-surface);border:1px solid var(--border);cursor:pointer;color:var(--text-primary);-webkit-user-select:none;user-select:none;border-radius:10px;padding:20px;font-family:Sarabun,sans-serif;font-size:24px;font-weight:600;transition:all .2s}.pin-key:hover{background:var(--bg-elevated)}.pin-key:active{background:var(--accent);color:#fff;transform:scale(.95)}.pin-key.action{color:var(--text-secondary);font-size:14px}.pin-key.action:active{background:var(--bg-elevated);color:var(--text-primary)}.pin-error{color:var(--error);margin-top:15px;font-size:14px}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--bg-surface);border-radius:12px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-title{font-size:18px;font-weight:600}.modal-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;font-size:24px;line-height:1}.modal-body{padding:24px}.modal-footer{border-top:1px solid var(--border);justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}.badge{border-radius:20px;padding:4px 10px;font-size:12px;font-weight:500}.badge-success{color:var(--success);background:#3ddc8433}.badge-warning{color:var(--warning);background:#ffb34033}.badge-info{color:var(--accent);background:#4f8ef733}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:15px;display:grid}.photo-item{background:var(--bg-elevated);border-radius:8px;position:relative;overflow:hidden}.photo-item img{object-fit:cover;width:100%;height:120px}.photo-item .photo-info{padding:8px;font-size:11px}.photo-category{background:var(--accent);border-radius:4px;padding:2px 6px;font-size:10px;display:inline-block}.boq-summary{background:var(--bg-elevated);border-radius:10px;margin-top:20px;padding:20px}.boq-row{border-bottom:1px solid var(--border);justify-content:space-between;padding:8px 0;display:flex}.boq-row:last-child{color:var(--success);border-bottom:none;font-size:18px;font-weight:700}.empty-state{text-align:center;color:var(--text-secondary);padding:60px 20px}.empty-icon{margin-bottom:20px;font-size:60px}.toast{background:var(--bg-surface);border:1px solid var(--border);z-index:2000;border-radius:10px;align-items:center;gap:10px;padding:15px 20px;animation:.3s slideIn;display:flex;position:fixed;bottom:20px;right:20px}.toast.success{border-color:var(--success)}.toast.error{border-color:var(--error)}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.login-page{background:var(--bg-primary);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-box{background:var(--bg-surface);border:1px solid var(--border);border-radius:16px;width:100%;max-width:380px;padding:40px}.login-logo{text-align:center;margin-bottom:30px}.login-logo h1{color:var(--accent);font-size:28px}.login-logo p{color:var(--text-secondary);margin-top:5px;font-size:14px}.tabs{background:var(--bg-elevated);border-radius:8px;gap:4px;margin-bottom:20px;padding:4px;display:flex}.tab{text-align:center;cursor:pointer;border-radius:6px;flex:1;padding:10px;font-size:13px;transition:all .2s}.tab.active{background:var(--accent);color:#fff}.activity-item{border-bottom:1px solid var(--border);gap:12px;padding:12px 0;display:flex}.activity-icon{background:var(--bg-elevated);border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.activity-content{flex:1}.activity-text{font-size:14px}.activity-time{color:var(--text-secondary);margin-top:4px;font-size:12px}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=768px){.sidebar{display:none}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.mobile-padded{padding-bottom:calc(72px + env(safe-area-inset-bottom));padding-top:20px;padding-left:16px;padding-right:16px}.modal{border-radius:0;width:100%;max-width:100%;max-height:100vh}.modal-overlay{align-items:flex-end}}