:root{--color-page: #fafafa;--color-page-soft: #f7f7f8;--color-surface: #ffffff;--color-surface-hover: #f6f7f8;--color-surface-sunken: #f4f5f6;--color-border: #eaeaea;--color-border-strong: #dcdcdc;--color-divider: #f0f0f0;--color-text: #1f2329;--color-text-secondary: #6b7280;--color-text-tertiary: #9aa1ab;--color-text-inverse: #ffffff;--color-accent: #2c5ce6;--color-accent-hover: #2450cc;--color-accent-active: #1e44b0;--color-accent-weak: #eef2fe;--color-accent-border: #cdd9fb;--color-success: #16794a;--color-success-weak: #e7f7ee;--color-warning: #a15c00;--color-warning-weak: #fff4e5;--color-danger: #c0362c;--color-danger-weak: #fdeceb;--tag-draft-bg: #f0f1f3;--tag-draft-text: #6b7280;--tag-transit-bg: #eef2fe;--tag-transit-text: #2c5ce6;--tag-partial-bg: #fff7e0;--tag-partial-text: #9a6b00;--tag-signed-bg: #e7f7ee;--tag-signed-text: #16794a;--tag-cancelled-bg: #f0f1f3;--tag-cancelled-text: #9aa1ab;--tag-overdue-bg: #fdeceb;--tag-overdue-text: #c0362c;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;--font-mono: "SFMono-Regular", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;--fs-title: 22px;--fs-h2: 18px;--fs-h3: 15px;--fs-body: 14px;--fs-sm: 13px;--fs-xs: 12px;--fs-metric: 26px;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--lh-tight: 1.3;--lh-normal: 1.6;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--sp-12: 48px;--radius-xs: 4px;--radius-sm: 6px;--radius: 10px;--radius-control: 10px;--radius-lg: 12px;--radius-xl: 16px;--radius-pill: 999px;--shadow-xs: 0 1px 2px rgba(16, 24, 40, .04);--shadow-sm: 0 1px 3px rgba(16, 24, 40, .06), 0 1px 2px rgba(16, 24, 40, .03);--shadow-md: 0 6px 16px rgba(16, 24, 40, .08);--shadow-lg: 0 16px 40px rgba(16, 24, 40, .12);--shadow-island: 0 12px 32px rgba(15, 23, 42, .07), 0 2px 8px rgba(15, 23, 42, .04);--control-h: 36px;--control-h-sm: 30px;--control-h-lg: 40px;--sidebar-w: 220px;--sidebar-w-collapsed: 64px;--sidebar-inset: 12px;--topbar-h: 56px;--content-max: 1320px;--z-drawer: 900;--z-dialog: 1000;--z-popover: 1050;--z-toast: 1100;--transition-fast: .15s ease;--transition: .2s ease}*,*:before,*:after{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:var(--color-page);color:var(--color-text);font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-normal);-webkit-font-smoothing:antialiased}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accent-hover)}h1,h2,h3,h4{margin:0;font-weight:var(--fw-semibold);line-height:var(--lh-tight)}.app-shell{display:flex;min-height:100vh}.sidebar-brand-mark{width:20px;height:20px;flex-shrink:0;display:grid;place-items:center;color:var(--color-text-primary)}.sidebar-brand-mark svg{width:80%;height:80%;display:block;transform:translateY(-1px)}.main-area{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{height:var(--topbar-h);flex:0 0 var(--topbar-h);background:#ffffffdb;-webkit-backdrop-filter:saturate(180%) blur(8px);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-6);position:sticky;top:0;z-index:20}.topbar-title{font-size:var(--fs-h3);font-weight:var(--fw-semibold)}.topbar-right{display:flex;align-items:center;gap:var(--sp-4)}.topbar-meta{font-size:var(--fs-xs);color:var(--color-text-tertiary)}.page{padding:var(--sp-6);max-width:var(--content-max);width:100%;margin:0 auto}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-5)}.page-title{font-size:var(--fs-title);font-weight:var(--fw-semibold);letter-spacing:-.01em}.page-sub{margin-top:var(--sp-1);font-size:var(--fs-sm);color:var(--color-text-secondary)}.page-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-xs)}.card-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--color-divider)}.card-title{font-size:var(--fs-h3);font-weight:var(--fw-semibold)}.card-body{padding:var(--sp-5)}.card-body.tight{padding:var(--sp-3) 0 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--control-h);padding:0 14px;border-radius:var(--radius-control);border:1px solid var(--color-border-strong);background:var(--color-surface);color:var(--color-text);font-size:var(--fs-sm);font-family:inherit;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast);white-space:nowrap}.btn:hover{background:var(--color-surface-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-text-inverse)}.btn-primary:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.btn-ghost{border-color:transparent;background:transparent;color:var(--color-text-secondary)}.btn-ghost:hover{background:var(--color-surface-hover);color:var(--color-text)}.btn-danger{color:var(--color-danger);border-color:#f2cfcc;background:var(--color-danger-weak)}.btn-danger:hover{background:#fbe2e0}.btn-sm{height:var(--control-h-sm);padding:0 10px;font-size:var(--fs-xs);border-radius:8px}.btn-lg{height:var(--control-h-lg);padding:0 20px;font-size:var(--fs-body)}.btn-block{width:100%}.link-btn{border:none;background:none;padding:0;color:var(--color-accent);font-size:var(--fs-sm);cursor:pointer;font-family:inherit}.link-btn:hover{color:var(--color-accent-hover);text-decoration:underline}.link-btn.danger{color:var(--color-danger)}.field{display:flex;flex-direction:column;gap:6px;min-width:0}.field-label{font-size:var(--fs-sm);color:var(--color-text-secondary);display:flex;align-items:center;gap:4px}.field-label .req{color:var(--color-danger)}.field-hint{font-size:var(--fs-xs);color:var(--color-text-tertiary)}.input,.select,.textarea{width:100%;height:var(--control-h);padding:0 12px;border-radius:var(--radius-control);border:1px solid var(--color-border-strong);background:var(--color-surface);color:var(--color-text);font-size:var(--fs-body);font-family:inherit;outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.textarea{height:auto;min-height:78px;padding:8px 12px;line-height:1.6;resize:vertical}.input:focus,.select:focus,.textarea:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-weak)}.input::placeholder,.textarea::placeholder{color:var(--color-text-tertiary)}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%236b7280' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:30px}.select{-webkit-appearance:base-select;-moz-appearance:base-select;appearance:base-select;align-items:center}.select::picker-icon,.select option::checkmark{display:none}.select::picker(select){-webkit-appearance:base-select;-moz-appearance:base-select;appearance:base-select;margin-top:4px;padding:4px;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-surface);box-shadow:0 10px 26px #10182821,0 2px 6px #1018280f;overflow-y:auto;max-height:300px}.select option{display:flex;align-items:center;min-height:30px;padding:6px 10px;border-radius:6px;font-size:var(--fs-sm);color:var(--color-text);cursor:pointer}.select option:hover,.select option:focus-visible{background:var(--color-surface-hover)}.select option:checked{background:var(--color-accent-weak);color:var(--color-accent)}.checkbox{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox input{width:15px;height:15px;accent-color:var(--color-accent);cursor:pointer}.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--sp-4) var(--sp-5)}.form-grid .span-2{grid-column:span 2}.table-wrap{width:100%;overflow-x:auto}.table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-sm)}.table th{text-align:left;font-weight:var(--fw-medium);color:var(--color-text-secondary);background:var(--color-page-soft);padding:10px var(--sp-3);white-space:nowrap;border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:1}.table td{padding:11px var(--sp-3);border-bottom:1px solid var(--color-divider);vertical-align:middle}.table tbody tr:hover td{background:var(--color-surface-hover)}.table tbody tr:last-child td{border-bottom:none}.table .num{font-variant-numeric:tabular-nums;text-align:right}.table .actions{white-space:nowrap;text-align:right}.col-resizer{position:absolute;top:0;bottom:0;right:0;width:10px;z-index:3;cursor:col-resize;touch-action:none}.col-resizer:after{content:"";position:absolute;top:22%;bottom:22%;right:0;width:1px;border-radius:1px;background:var(--color-accent);opacity:0;transition:opacity var(--transition-fast)}.col-resizer:hover:after,.col-resizer.is-active:after{opacity:1}.table th.col-resizable:hover{z-index:2}.table th.col-resizable.is-dragging{z-index:4}.table.has-col-widths td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table.has-col-widths th{overflow:hidden;text-overflow:ellipsis}body.is-resizing-columns,body.is-resizing-columns *{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}.table th+th{border-left:1px solid var(--color-border-strong)}.table th.has-sort{padding-right:30px;cursor:pointer}.table th.has-sort:hover{color:var(--color-text-primary)}.col-sort{position:absolute;top:50%;right:13px;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:12px;height:18px;color:var(--color-text-tertiary);cursor:pointer;-webkit-user-select:none;user-select:none;opacity:1;transition:opacity var(--transition-fast),color var(--transition-fast)}.col-sort svg{display:block;overflow:visible}.col-sort-up,.col-sort-down{fill:currentColor;opacity:.6;transition:opacity var(--transition-fast),fill var(--transition-fast)}.col-sort:hover{color:var(--color-text-secondary)}.col-sort:hover .col-sort-up,.col-sort:hover .col-sort-down{opacity:1}.col-sort.is-asc .col-sort-up,.col-sort.is-desc .col-sort-down{fill:var(--color-accent);opacity:1}.col-sort.is-asc .col-sort-down,.col-sort.is-desc .col-sort-up{opacity:.2}.table th.is-sorted{color:var(--color-text-primary);font-weight:var(--fw-semibold)}.progress{height:6px;border-radius:var(--radius-pill);background:var(--color-surface-sunken);box-shadow:inset 0 0 0 1px #1018280a;overflow:hidden}.progress-bar{height:100%;border-radius:inherit;background:var(--color-accent)}.progress-bar.is-complete{background:var(--color-success)}.progress-cell{display:flex;align-items:center;gap:var(--sp-3)}.progress-cell .progress{flex:1;min-width:0}.progress-value{flex:0 0 auto;width:44px;text-align:right;font-size:var(--fs-xs);font-variant-numeric:tabular-nums;color:var(--color-text-secondary)}.progress-value.is-complete{color:var(--color-success);font-weight:var(--fw-medium)}.mono{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--color-text-secondary)}.strong{font-weight:var(--fw-medium)}.tag{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:var(--radius-pill);font-size:var(--fs-xs);background:var(--color-surface-sunken);color:var(--color-text-secondary);white-space:nowrap}.tag-draft{background:var(--tag-draft-bg);color:var(--tag-draft-text)}.tag-transit{background:var(--tag-transit-bg);color:var(--tag-transit-text)}.tag-partial{background:var(--tag-partial-bg);color:var(--tag-partial-text)}.tag-signed{background:var(--tag-signed-bg);color:var(--tag-signed-text)}.tag-cancelled{background:var(--tag-cancelled-bg);color:var(--tag-cancelled-text)}.tag-overdue{background:var(--tag-overdue-bg);color:var(--tag-overdue-text)}.tag-accent{background:var(--color-accent-weak);color:var(--color-accent)}.filter-bar{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--color-divider)}.filter-bar .input,.filter-bar .select,.filter-bar .btn{height:32px;border-radius:8px;font-size:var(--fs-sm)}.filter-bar .input,.filter-bar .select{width:auto;min-width:0}.filter-bar .filter-search{width:268px;padding-left:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Ccircle cx='6.2' cy='6.2' r='4.3' fill='none' stroke='%239aa1ab' stroke-width='1.35'/%3E%3Cpath d='M9.4 9.4 12.6 12.6' stroke='%239aa1ab' stroke-width='1.35' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:10px center}.filter-bar .filter-select{width:124px}.filter-bar .filter-actions{display:flex;flex:0 0 auto;gap:var(--sp-2);margin-left:auto}.date-range{display:inline-flex;align-items:center;height:32px;padding:0 8px;border:1px solid var(--color-border-strong);border-radius:8px;background:var(--color-surface);font-size:var(--fs-sm);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.date-range:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-weak)}.date-range .input{width:116px;height:100%;padding:0 2px;border:0;border-radius:0;background:transparent;box-shadow:none;font-size:var(--fs-sm)}.date-field{position:relative;display:inline-flex;align-items:center;flex:0 0 auto}.date-field-ph{position:absolute;left:2px;color:var(--color-text-tertiary);font-size:var(--fs-sm);line-height:1;pointer-events:none;white-space:nowrap}.date-field.is-empty .input::-webkit-datetime-edit{color:transparent}.date-field.is-empty:focus-within .date-field-ph{display:none}.date-field.is-empty:focus-within .input::-webkit-datetime-edit{color:var(--color-text)}.date-range .input:focus{border:0;box-shadow:none}.date-range .input::-webkit-calendar-picker-indicator{opacity:.45;cursor:pointer}.date-range .input::-webkit-calendar-picker-indicator:hover{opacity:.75}.date-range-sep{flex:0 0 auto;width:10px;height:1px;margin:0 5px;background:var(--color-text-tertiary)}.grow{flex:1}.pagination{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--color-divider);font-size:var(--fs-sm);color:var(--color-text-secondary)}.pagination-actions{display:flex;align-items:center;gap:var(--sp-2)}.empty{padding:var(--sp-10) var(--sp-4);text-align:center;color:var(--color-text-tertiary);font-size:var(--fs-sm)}.empty-icon{width:40px;height:40px;margin:0 auto var(--sp-3);border-radius:12px;border:1px dashed var(--color-border-strong);display:grid;place-items:center;color:var(--color-text-tertiary)}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#10182852;display:grid;place-items:center;z-index:var(--z-dialog);padding:var(--sp-4)}.modal{width:min(560px,100%);max-height:86vh;overflow-y:auto;background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--color-border)}.modal.wide{width:min(820px,100%)}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--color-divider)}.modal-body{padding:var(--sp-5)}.modal-foot{display:flex;justify-content:flex-end;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5);border-top:1px solid var(--color-divider)}.close-btn{border:none;background:none;cursor:pointer;color:var(--color-text-tertiary);font-size:18px;line-height:1;padding:4px;border-radius:6px}.close-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.alert{padding:10px 14px;border-radius:var(--radius-sm);font-size:var(--fs-sm);border:1px solid var(--color-border);background:var(--color-page-soft);color:var(--color-text-secondary)}.alert-warn{background:var(--color-warning-weak);border-color:#f4d9ae;color:var(--color-warning)}.alert-danger{background:var(--color-danger-weak);border-color:#f2cfcc;color:var(--color-danger)}.alert-success{background:var(--color-success-weak);border-color:#bfe6d1;color:var(--color-success)}.toast-layer{position:fixed;top:20px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:var(--sp-2);z-index:var(--z-toast);pointer-events:none}.toast{padding:9px 16px;border-radius:var(--radius-pill);background:#1f2329eb;color:#fff;font-size:var(--fs-sm);box-shadow:var(--shadow-md);animation:toast-in .18s ease}.toast.error{background:#c0362cf2}@keyframes toast-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--sp-3)}.metric{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--sp-4) var(--sp-5);box-shadow:var(--shadow-xs)}.metric-label{font-size:var(--fs-sm);color:var(--color-text-secondary);display:flex;align-items:center;gap:6px}.metric-value{margin-top:6px;font-size:var(--fs-metric);font-weight:var(--fw-semibold);letter-spacing:-.02em;font-variant-numeric:tabular-nums}.metric-foot{margin-top:2px;font-size:var(--fs-xs);color:var(--color-text-tertiary)}.metric.warn .metric-value{color:var(--color-warning)}.metric.danger .metric-value{color:var(--color-danger)}.metric.accent .metric-value{color:var(--color-accent)}.row{display:flex;align-items:center;gap:var(--sp-2)}.row-between{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}.stack{display:flex;flex-direction:column;gap:var(--sp-4)}.stack-sm{display:flex;flex-direction:column;gap:var(--sp-2)}.muted{color:var(--color-text-secondary)}.tertiary{color:var(--color-text-tertiary)}.text-sm{font-size:var(--fs-sm)}.text-xs{font-size:var(--fs-xs)}.mt-2{margin-top:var(--sp-2)}.mt-4{margin-top:var(--sp-4)}.mt-6{margin-top:var(--sp-6)}.divider{height:1px;background:var(--color-divider);margin:var(--sp-4) 0}.skeleton{background:linear-gradient(90deg,#f2f3f5 25%,#e9eaec 37%,#f2f3f5 63%);background-size:400% 100%;animation:skeleton 1.2s ease infinite;border-radius:6px}@keyframes skeleton{0%{background-position:100% 50%}to{background-position:0 50%}}@media print{.sidebar,.topbar,.page-actions,.no-print{display:none!important}body{background:#fff}.page{padding:0;max-width:none}.card{border:none;box-shadow:none}.print-sheet{page-break-after:always}}@media (max-width: 900px){.page{padding:var(--sp-4)}.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:span 1}.topbar{padding:0 var(--sp-4)}}
