:root{--ease-out: cubic-bezier(.23, 1, .32, 1);--surface: #ffffff;--surface-subtle: #f8fafc;--border: #e2e8f0;--text: #172033;--muted: #64748b;--primary: #2563eb}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Microsoft YaHei,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;color:var(--text);background:#f4f6fa;line-height:1.5;min-height:100vh;-webkit-font-smoothing:antialiased}.app-header{background:#fffffff0;border-bottom:1px solid #e2e8f0;position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.header-inner{max-width:1440px;margin:0 auto;padding:0 20px;min-height:60px;display:flex;align-items:center;justify-content:space-between}.app-title{font-size:16px;font-weight:600;cursor:pointer;color:#2563eb;border:0;background:transparent;display:flex;align-items:center;gap:10px;white-space:nowrap;font-family:inherit}.app-title img{display:block;width:auto}.title-text{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}.title-main{font-size:16px;font-weight:600;color:#2563eb}.title-sub{font-size:11px;font-weight:400;color:#94a3b8;letter-spacing:.5px;white-space:nowrap}.app-nav{display:flex;flex:1;gap:12px;align-items:center;justify-content:flex-end;flex-wrap:wrap;overflow:visible}.app-nav::-webkit-scrollbar{display:none}.nav-group{position:relative;flex-shrink:0}.nav-group-btn{display:flex;align-items:center;gap:4px;border:0;background:transparent;cursor:pointer;font-size:14px;color:#334155;padding:8px 12px;border-radius:8px;font-family:inherit;white-space:nowrap}.nav-group-btn:hover{background:#f1f5f9;color:#1a1a2e}.nav-group-active>.nav-group-btn{background:#eff6ff;color:#2563eb;font-weight:600}.nav-caret{font-size:10px;opacity:.7;transition:transform .16s var(--ease-out)}.nav-group-open>.nav-group-btn .nav-caret{transform:rotate(180deg)}.nav-dropdown{position:absolute;top:calc(100% + 6px);left:0;min-width:160px;padding:6px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 12px 30px #0f172a24;z-index:300;display:none}.nav-group-open .nav-dropdown{display:flex;flex-direction:column;opacity:1;transform:translateY(0) scale(1);transform-origin:top left;transition:opacity .16s var(--ease-out),transform .16s var(--ease-out)}@starting-style{.nav-group-open .nav-dropdown{opacity:0;transform:translateY(-4px) scale(.97)}}.nav-dropdown .nav-link{padding:8px 12px;border-radius:6px;white-space:nowrap}.nav-dropdown .nav-link.router-link-active{background:#eff6ff}.nav-link{text-decoration:none;color:#475569;padding:6px 14px;border-radius:6px;transition:color .15s ease,background-color .15s ease,transform .14s var(--ease-out);white-space:nowrap}.nav-link:active{transform:scale(.97)}.nav-link.router-link-active{background:#eff6ff;color:#2563eb;font-weight:600}.nav-primary{background:#2563eb;color:#fff}.app-main{max-width:1440px;margin:0 auto;padding:24px 20px}.back-to-top{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:250;display:inline-flex;align-items:center;gap:5px;min-height:40px;padding:9px 12px;border:1px solid #dbe4f0;border-radius:999px;background:#fffffff0;box-shadow:0 8px 24px #0f172a24;color:#2563eb;font:600 13px/1 Microsoft YaHei,sans-serif;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.back-to-top svg{width:17px;height:17px}.back-to-top:hover{border-color:#bfdbfe;background:#eff6ff}.back-to-top:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:2px}.card{background:#fff;border-radius:12px;border:1px solid #e2e8f0;padding:20px;box-shadow:0 1px 2px #0f172a08}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:12px}.card-title{font-size:16px;font-weight:600}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#475569;font-size:14px;cursor:pointer;transition:transform .14s var(--ease-out),color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease;text-decoration:none}.btn:active:not(:disabled){transform:scale(.97)}.btn:focus-visible,.nav-link:focus-visible,.app-title:focus-visible,.template-card:focus-visible{outline:3px solid rgba(37,99,235,.22);outline-offset:2px}.btn:disabled{opacity:.52;cursor:not-allowed;transform:none}.btn-primary{background:#2563eb;border-color:#2563eb;color:#fff}.btn-danger{color:#dc2626;border-color:#fecaca}.btn-sm{padding:4px 10px;font-size:12px}.btn-group{display:flex;gap:8px;flex-wrap:wrap}.form-group{margin-bottom:12px}.form-label{display:block;font-size:12px;font-weight:500;color:#64748b;margin-bottom:4px}.form-input,.form-select,.form-textarea{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#1a1a2e;background:#fff;transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.form-textarea{resize:vertical;min-height:60px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.data-table{width:100%;border-collapse:collapse}.table-scroll{width:100%;overflow-x:auto;border-radius:8px}.data-table th,.data-table td{padding:8px 10px;text-align:left;border:1px solid #e2e8f0;font-size:13px}.data-table th{background:#f8fafc;font-weight:600;color:#475569;white-space:nowrap}.data-table td{color:#1a1a2e}.data-table td input,.data-table td textarea{width:100%;border:none;background:transparent;padding:2px;font-size:13px;outline:none;font-family:inherit}.data-table td input:focus,.data-table td textarea:focus{background:#f0f9ff;border-radius:4px}.data-table td textarea{resize:vertical;min-height:28px}.data-table .col-actions,.data-table .col-number{width:40px;text-align:center}.data-table .col-price,.data-table .col-qty,.data-table .col-total{width:110px;text-align:right}.data-table .col-total{font-weight:600}.data-table .total-row td{font-weight:600;background:#f8fafc}.tag{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:500}.tag-blue{background:#dbeafe;color:#1d4ed8}.tag-green{background:#d1fae5;color:#059669}.tag-gray{background:#f1f5f9;color:#64748b}.tag-orange{background:#ffedd5;color:#d97706}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:400;opacity:1;transition:opacity .16s var(--ease-out)}.modal{background:#fff;border-radius:12px;padding:24px;width:500px;max-width:90vw;max-height:80vh;overflow-y:auto;box-shadow:0 24px 60px #0f172a38;opacity:1;transform:translateY(0) scale(1);transition:opacity .18s var(--ease-out),transform .22s var(--ease-out)}@starting-style{.modal-overlay{opacity:0}.modal{opacity:0;transform:translateY(8px) scale(.97)}}.modal-title{font-size:18px;font-weight:600;margin-bottom:16px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.ot-toast{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:300;max-width:min(560px,90vw);padding:12px 18px;border-radius:10px;font-size:14px;box-shadow:0 12px 32px #0f172a2e;transition:opacity .2s var(--ease-out)}.ot-toast.success{background:#ecfdf5;border:1px solid #a7f3d0;color:#047857}.ot-toast.error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}.doc-container{background:#fff;padding:30px 35px;margin-bottom:20px;font-family:Microsoft YaHei,Arial,SimSun,sans-serif;color:#000;position:relative}.doc-company-header{font-size:11px;color:#000;text-align:center;margin-bottom:2px;font-family:SimSun,serif}.doc-title{font-family:Microsoft YaHei,SimHei,sans-serif;font-size:18px;font-weight:700;text-align:center;color:#000;margin-bottom:0;letter-spacing:1px}.doc-title-line{border:none;border-top:1.5px solid #000;margin:6px auto 14px;width:100%}.doc-header-info{display:grid;grid-template-columns:auto 1fr;gap:2px 16px;margin:10px 0 14px;font-size:11px;line-height:1.6}.doc-header-info .label{color:#000;font-weight:500;text-align:left}.doc-header-info .value{color:#000;font-weight:400}.doc-table-wrapper{border-left:1px solid #000;border-right:1px solid #000;margin:0 0 10px}.doc-table{width:100%;border-collapse:collapse;font-size:11px}.doc-table thead th{background:#9cf;font-weight:600;padding:6px 8px;border:none;text-align:left;color:#000;font-size:11px;white-space:nowrap}.doc-table thead th.right{text-align:right}.doc-table thead th.center{text-align:center}.doc-table tbody td{padding:3px 8px;border:none;border-bottom:.5px solid #999;text-align:left;font-size:10px;vertical-align:top;color:#000}.doc-table tbody tr:last-child td{border-bottom:none}.doc-table tbody td.price,.doc-table tbody td.qty,.doc-table tbody td.total{text-align:right;font-family:Arial,sans-serif}.doc-table tbody td.price{font-family:Arial,sans-serif}.doc-table tbody td.model{font-family:SimSun,serif;font-size:10px;white-space:nowrap}.doc-table tbody td.desc{font-size:9px;font-family:Microsoft YaHei,Arial,sans-serif}.doc-table-bottom-line{border:none;border-top:1.5px solid #000;margin:0;width:100%}.doc-summary{margin-top:6px;text-align:right;font-size:12px;padding-right:5px}.doc-summary .line{margin:2px 0;font-size:11px}.doc-summary .line.total-label{font-weight:700;font-size:12px}.doc-remark{margin-top:12px;padding:10px 14px;background:#c5d9f1;border-radius:0;font-size:10px;line-height:1.6;white-space:pre-wrap;color:#000}.doc-remark-title{font-weight:700;font-size:11px;margin-bottom:4px}.doc-company-info{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:8px;margin-top:10px}.doc-company-box{border:1px solid #000;padding:10px 12px;font-size:11px}.doc-company-box h3{font-size:12px;font-weight:700;margin-bottom:6px}.doc-company-box p{margin:2px 0;font-size:11px}.doc-signature{margin-top:8px;display:flex;justify-content:space-between;font-size:12px}@media print{.app-header,.back-to-top,.no-print{display:none!important}.app-main{padding:0}.doc-container{border:none;border-radius:0;padding:15px 20px;box-shadow:none}}.text-center{text-align:center}.text-right{text-align:right}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mb-8{margin-bottom:8px}.mb-16{margin-bottom:16px}.flex-between{display:flex;justify-content:space-between;align-items:center}.gap-8{gap:8px}.empty-state{text-align:center;padding:60px 20px;color:#94a3b8}.empty-state p{margin-top:8px;font-size:14px}.doc-link{color:#2563eb;text-decoration:none;font-weight:500}.doc-link:hover{text-decoration:underline}.tag-final{background:#fef3c7;color:#d97706;font-size:11px;padding:2px 10px;border-radius:4px;display:inline-block;font-weight:600}.form-input:disabled,.form-select:disabled,.form-textarea:disabled{background:#f8fafc;color:#94a3b8;cursor:not-allowed}.bottom-two-col{display:flex;gap:32px;align-items:stretch}.cost-col{flex:1;min-width:0;padding:12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px}.summary-col{flex:1;min-width:0;padding:12px;background:#fffbeb;border:1px solid #fde68a;border-radius:6px}.page-heading{min-width:180px}.page-heading .card-title{margin:0}.page-subtitle{margin-top:3px;color:var(--muted);font-size:12px}.page-toolbar{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}.search-input{width:min(240px,100%)}.loading-state,.error-state{min-height:120px;display:flex;align-items:center;justify-content:center;gap:9px;color:var(--muted)}.error-state{min-height:72px;padding:16px;color:#b91c1c;background:#fef2f2;border-radius:8px}.status-message{min-height:20px;margin-top:10px;font-size:13px;color:#047857;text-align:right}.status-message.error{color:#b91c1c}.spinner{width:16px;height:16px;border:2px solid #bfdbfe;border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (hover: hover) and (pointer: fine){.nav-link:hover{background:#f1f5f9;color:#1a1a2e}.nav-primary:hover{background:#1d4ed8;color:#fff}.btn:hover{background:#f1f5f9;border-color:#cbd5e1}.btn-primary:hover{background:#1d4ed8;border-color:#1d4ed8}.btn-danger:hover{background:#fef2f2;border-color:#fca5a5}.data-table tbody tr:hover td{background:#fafcff}}@media (max-width: 640px){.bottom-two-col{flex-direction:column}.app-main{padding:14px 10px}.card{padding:14px;border-radius:10px}.header-inner{padding:8px 10px;align-items:flex-start;flex-direction:column}.app-nav{width:100%;justify-content:flex-start;padding-bottom:2px;flex-wrap:nowrap;overflow-x:auto}.nav-link{padding:6px 10px}.nav-dropdown{position:fixed;top:64px;left:12px;right:12px;min-width:0}.nav-dropdown .nav-link{padding:12px}.form-row,.form-row-3{grid-template-columns:1fr}.page-toolbar{width:100%;margin-left:0}.search-input{width:100%}.back-to-top{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));min-width:44px;min-height:44px}}@media (prefers-reduced-motion: reduce){.btn,.nav-link,.template-card,.modal,.nav-dropdown,.ot-toast{transition:color .12s ease,background-color .12s ease,border-color .12s ease,opacity .12s ease}.btn:active:not(:disabled),.nav-link:active,.template-card:active{transform:none}.modal,.nav-dropdown{transform:none}.spinner{animation-duration:1s}}