:root{--primary:#1e3a8a;--primary-hover:#1e40af;--primary-light:#eff6ff;--accent:#2563eb;--success:#16a34a;--danger:#dc2626;--warning:#d97706;--bg-main:#f8fafc;--bg-card:#fff;--border-color:#cbd5e1;--text-main:#0f172a;--text-muted:#64748b;--radius:8px;--shadow:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f}*{box-sizing:border-box;margin:0;padding:0;font-family:Microsoft JhengHei,微軟正黑體,-apple-system,BlinkMacSystemFont,sans-serif}body{background-color:var(--bg-main);color:var(--text-main);flex-direction:column;min-height:100vh;display:flex}.navbar{color:#fff;z-index:100;background-color:#0f172a;justify-content:space-between;align-items:center;padding:12px 24px;display:flex;position:sticky;top:0;box-shadow:0 2px 8px #0003}.navbar-brand{color:#f8fafc;letter-spacing:1px;align-items:center;gap:10px;font-size:18px;font-weight:700;display:flex}.navbar-user{align-items:center;gap:15px;font-size:14px;display:flex}.user-badge{background-color:#ffffff1a;border-radius:20px;align-items:center;gap:6px;padding:4px 12px;display:flex}.btn-logout{color:#fca5a5;cursor:pointer;background-color:#dc262633;border:1px solid #dc262666;border-radius:6px;padding:5px 12px;font-size:13px;transition:all .2s}.btn-logout:hover{color:#fff;background-color:#dc2626}.app-container{width:100%;max-width:1200px;margin:20px auto;padding:0 15px 40px}.tabs-header{border-bottom:2px solid #e2e8f0;gap:8px;margin-bottom:20px;padding-bottom:2px;display:flex;overflow-x:auto}.tab-btn{color:var(--text-muted);cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-bottom:none;border-radius:8px 8px 0 0;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.tab-btn:hover{background:var(--primary-light);color:var(--primary)}.tab-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.card{border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;border:1px solid #e2e8f0;margin-bottom:20px;padding:20px}.card-title{color:var(--primary);align-items:center;gap:8px;margin-bottom:14px;font-size:16px;font-weight:700;display:flex}.form-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.form-group{flex-direction:column;display:flex}.form-group label{color:var(--text-main);margin-bottom:4px;font-size:12px;font-weight:700}.form-group input,.form-group select{border:1px solid #cbd5e1;border-radius:6px;outline:none;padding:8px 10px;font-size:13px;transition:border-color .2s}.form-group input:focus,.form-group select:focus{border-color:var(--accent);box-shadow:0 0 0 2px #2563eb26}.btn{cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:8px 16px;font-size:14px;font-weight:600;transition:background .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover)}.btn-success{background:var(--success);color:#fff}.btn-success:hover{background:#15803d}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#b91c1c}.btn-sm{padding:4px 8px;font-size:12px}#printable-area{color:#000;box-sizing:border-box;background:#fff;border:1px solid #000;width:730px;margin:0 auto;padding:20px}.a4-header{color:#333;justify-content:space-between;font-size:10px;display:flex}.company-title{text-align:center;letter-spacing:2px;margin:6px 0 10px;font-size:22px;font-weight:700}.company-title span{margin-left:15px;font-size:18px}table.info-table,table.product-table,table.stamp-table{border-collapse:collapse;table-layout:fixed;width:100%!important}th,td{text-align:center;word-wrap:break-word;word-break:break-all;white-space:normal;vertical-align:middle;border:1px solid #000;padding:4px 5px;font-size:11px}th{background:#f0f0f0;height:30px;font-weight:700}#product-tbody td{height:38px}input.table-input,select.table-input{background:0 0;border:none;outline:none;width:100%;font-family:inherit;font-size:11px}.info-table td{text-align:left;height:24px}.info-label{background-color:#fafafa;width:16%;font-weight:700;text-align:right!important}.bg-yellow{background-color:#ffc}.bg-green-light{background-color:#e2efda}.text-red{color:red;font-weight:700}.text-blue{color:#00f}.col-name{width:34%;text-align:left!important;padding-left:6px!important}.col-qty,.col-unit{width:8%}.col-price,.col-total{width:14%}.col-note{width:16%}.col-action{width:6%}.pdf-mode .no-print{display:none!important}.pdf-mode .col-name{width:40%!important}.pdf-text-node{word-break:break-all!important;white-space:normal!important;color:#000!important;font-size:11px!important;line-height:1.35!important}.terms-container{border:1px solid #000;margin-top:-1px;font-size:9.5px;page-break-inside:avoid!important;break-inside:avoid!important}.terms-header{text-align:center;background-color:#d9d9d9;border-bottom:1px solid #000;padding:3px;font-size:11px;font-weight:700}.terms-body{display:flex}.terms-left{text-align:left;border-right:1px solid #000;width:52%;padding:5px;line-height:1.35}.terms-right{width:48%}.terms-right table{height:100%}.terms-right td{text-align:left;height:auto;padding:2px 5px}.bottom-notes{text-align:left;margin-top:5px;font-size:9.5px;line-height:1.35;page-break-inside:avoid!important;break-inside:avoid!important}.signature-grid{text-align:left;border:1px solid #000;margin-top:5px;font-size:10.5px;font-weight:700;display:flex;page-break-inside:avoid!important;break-inside:avoid!important}.signature-grid div{border-right:1px solid #000;flex:1;padding:22px 5px 5px}.signature-grid div:last-child{border-right:none}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f172abf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.login-card{background:#fff;border-radius:12px;width:90%;max-width:400px;padding:30px;box-shadow:0 20px 25px -5px #0003}.login-header{text-align:center;margin-bottom:24px}.login-header h2{color:var(--primary);margin-top:8px;font-size:20px}.data-table{border-collapse:collapse;width:100%;margin-top:10px}.data-table th,.data-table td{text-align:left;border:1px solid #e2e8f0;padding:10px;font-size:13px}.data-table th{color:var(--text-main);background-color:#f1f5f9;font-weight:700}.data-table tr:hover{background-color:#f8fafc}@media (width<=768px){#printable-area{width:100%;padding:10px;overflow-x:auto}.navbar{flex-direction:column;align-items:flex-start;gap:10px}}