:root{--color-primary: #4B4ACF;--color-primary-hover: #3D3CB8;--color-primary-light: #EEEDFE;--color-primary-text: #3C3489;--color-bg-page: #F3F4F6;--color-bg-card: #FFFFFF;--color-bg-input: #FFFFFF;--color-bg-hover: #F9FAFB;--color-bg-selected: #EEEDFE;--color-border: #E5E7EB;--color-border-strong: #D1D5DB;--color-text-primary: #111827;--color-text-secondary: #6B7280;--color-text-muted: #9CA3AF;--color-text-link: #4B4ACF;--color-text-link-hover:#3D3CB8;--color-success: #16A34A;--color-success-bg: #DCFCE7;--color-success-text: #15803D;--color-warning: #D97706;--color-warning-bg: #FEF3C7;--color-warning-text: #B45309;--color-danger: #DC2626;--color-danger-bg: #FEE2E2;--color-danger-text: #B91C1C;--color-info: #2563EB;--color-info-bg: #DBEAFE;--color-info-text: #1D4ED8;--color-neutral-bg: #F3F4F6;--color-neutral-text: #374151;--sidebar-bg: #3B3AA8;--sidebar-text: rgba(255,255,255,.75);--sidebar-text-active: #FFFFFF;--sidebar-hover-bg: rgba(255,255,255,.08);--sidebar-active-bg: rgba(255,255,255,.15);--sidebar-section-text: rgba(255,255,255,.45);--font-family: "Inter", "Segoe UI", system-ui, sans-serif;--font-size-xs: 11px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 15px;--font-size-lg: 18px;--font-size-xl: 22px;--font-size-2xl: 28px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0,0,0,.05);--shadow-md: 0 2px 8px rgba(0,0,0,.08);--shadow-lg: 0 8px 24px rgba(0,0,0,.12);--transition-fast: .12s ease;--transition-base: .18s ease;--sidebar-width: 220px;--header-height: 52px;--content-padding: var(--space-6)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text-primary);background:var(--color-bg-page);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--color-text-link);text-decoration:none}a:hover{color:var(--color-text-link-hover);text-decoration:underline}.layout-wrapper,.app-layout{display:flex;min-height:100vh}.sidebar,.app-sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);background:var(--sidebar-bg);display:flex;flex-direction:column;height:100vh;position:fixed;left:0;top:0;z-index:200;overflow-y:auto;transition:transform .25s ease}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;z-index:199}.main-area,.app-main{margin-left:var(--sidebar-width);flex:1;display:flex;flex-direction:column;min-height:100vh;width:calc(100% - var(--sidebar-width))}.main-header,.app-header{height:var(--header-height);background:var(--color-bg-card);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;padding:0 var(--content-padding);position:sticky;top:0;z-index:50}.main-content,.app-content{padding:var(--content-padding);flex:1;background:var(--color-bg-page)}.hamburger-btn{display:none;background:none;border:none;cursor:pointer;padding:6px;border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:20px;line-height:1}.sidebar-logo{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-4) var(--space-3);color:var(--sidebar-text-active);font-weight:var(--font-weight-semibold);font-size:var(--font-size-base)}.sidebar-section-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--sidebar-section-text);text-transform:uppercase;letter-spacing:.08em;padding:var(--space-4) var(--space-4) var(--space-1)}.sidebar-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);color:var(--sidebar-text);font-size:var(--font-size-sm);border-radius:0;transition:background var(--transition-fast),color var(--transition-fast);cursor:pointer;-webkit-user-select:none;user-select:none}.sidebar-item:hover{background:var(--sidebar-hover-bg);color:var(--sidebar-text-active);text-decoration:none}.sidebar-item.active{background:var(--sidebar-active-bg);color:var(--sidebar-text-active);font-weight:var(--font-weight-medium)}.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6);gap:var(--space-4);flex-wrap:wrap}.page-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);line-height:1.3}.page-subtitle{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-top:var(--space-1)}.page-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.page-back{display:inline-flex;align-items:center;gap:var(--space-1);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-3);cursor:pointer}.page-back:hover{color:var(--color-text-primary)}.card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-sm)}.form-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-sm)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border)}.card-title{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.stat-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5) var(--space-6);box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:var(--space-4)}.stat-card-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.stat-card-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);line-height:1}.stat-card-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-top:var(--space-1)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:0 var(--space-4);height:36px;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast);white-space:nowrap;font-family:inherit;line-height:1}.btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-secondary{background:transparent;color:var(--color-text-primary);border-color:var(--color-border-strong)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-hover)}.btn-danger{background:var(--color-danger);color:#fff;border-color:var(--color-danger)}.btn-danger:hover:not(:disabled){background:#b91c1c;border-color:#b91c1c}.btn-ghost{background:transparent;color:var(--color-text-secondary);border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--color-bg-hover);color:var(--color-text-primary)}.btn-danger-outline{background:transparent;color:var(--color-danger);border-color:var(--color-danger)}.btn-danger-outline:hover:not(:disabled){background:var(--color-danger-bg)}.btn-sm{height:28px;padding:0 var(--space-3);font-size:var(--font-size-xs)}.form-group{display:flex;flex-direction:column;gap:var(--space-1)}.form-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.form-label-required:after{content:" *";color:var(--color-danger)}.form-input,.form-select,.form-textarea{width:100%;height:36px;padding:0 var(--space-3);font-size:var(--font-size-sm);font-family:inherit;color:var(--color-text-primary);background:var(--color-bg-input);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none}.form-textarea{height:auto;padding:var(--space-2) var(--space-3);resize:vertical;line-height:1.5}.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-muted)}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #4b4acf1f}.search-input{padding:8px 14px;border:1px solid var(--color-border-strong);border-radius:var(--radius-md);font-size:var(--font-size-sm);outline:none;width:300px;max-width:100%;color:var(--color-text-primary);font-family:inherit;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #4b4acf1f}.form-input-search{padding-left:var(--space-8);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:var(--space-3) center}.form-hint{font-size:var(--font-size-xs);color:var(--color-text-muted)}.btn-toggle-group{display:flex;border:1px solid var(--color-border-strong);border-radius:var(--radius-md);overflow:hidden}.btn-toggle{flex:1;height:36px;padding:0 var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);background:transparent;color:var(--color-text-secondary);border:none;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast);font-family:inherit}.btn-toggle.active{background:var(--color-primary);color:#fff}.btn-toggle:not(.active):hover{background:var(--color-bg-hover)}.table-wrapper{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-bg-card)}.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-wrap table{min-width:480px}table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}thead{background:var(--color-bg-page);border-bottom:1px solid var(--color-border)}th{padding:var(--space-2) var(--space-4);text-align:left;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}td{padding:var(--space-3) var(--space-4);color:var(--color-text-primary);border-bottom:1px solid var(--color-border);vertical-align:middle}tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--color-bg-hover)}td a{color:var(--color-text-link);font-weight:var(--font-weight-medium)}td a:hover{text-decoration:underline}.pagination{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.table-actions{display:flex;gap:var(--space-2)}.badge{display:inline-flex;align-items:center;padding:2px var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-full);line-height:1.4;white-space:nowrap}.badge-success{background:var(--color-success-bg);color:var(--color-success-text)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning-text)}.badge-danger{background:var(--color-danger-bg);color:var(--color-danger-text)}.badge-info{background:var(--color-info-bg);color:var(--color-info-text)}.badge-neutral{background:var(--color-neutral-bg);color:var(--color-neutral-text)}.badge-primary{background:var(--color-primary-light);color:var(--color-primary-text)}.chip{display:inline-flex;align-items:center;gap:var(--space-1);padding:3px var(--space-2);background:var(--color-primary-light);color:var(--color-primary-text);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.chip-remove{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:transparent;border:none;color:var(--color-primary-text);cursor:pointer;font-size:10px;padding:0}.chip-remove:hover{background:#4b4acf26}.tabs{display:flex;gap:0;border-bottom:1px solid var(--color-border);margin-bottom:var(--space-5)}.tab{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);border:none;border-bottom:2px solid transparent;background:transparent;cursor:pointer;margin-bottom:-1px;transition:color var(--transition-fast),border-color var(--transition-fast);font-family:inherit}.tab:hover{color:var(--color-text-primary)}.tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:center;justify-content:center;z-index:200;padding:var(--space-4)}.modal{background:var(--color-bg-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);width:100%;max-width:560px;max-height:90vh;overflow-y:auto;display:flex;flex-direction:column}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--color-border);flex-shrink:0}.modal-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.modal-close{width:28px;height:28px;border-radius:var(--radius-md);border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);font-size:18px}.modal-close:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.modal-body{padding:var(--space-6);flex:1}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-top:1px solid var(--color-border);flex-shrink:0}.form-section{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);margin-bottom:var(--space-5)}.form-section-title{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--space-5);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.form-grid-3{grid-template-columns:1fr 1fr 1fr}.form-col-full{grid-column:1 / -1}.filter-panel{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);width:200px;flex-shrink:0}.filter-group{margin-bottom:var(--space-4)}.filter-group:last-child{margin-bottom:0}.filter-group-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--space-2)}.text-link{color:var(--color-text-link)}.text-secondary{color:var(--color-text-secondary)}.text-muted{color:var(--color-text-muted)}.text-danger{color:var(--color-danger)}.text-success{color:var(--color-success)}.text-right{text-align:right}.text-center{text-align:center}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.text-sm{font-size:var(--font-size-sm)}.text-xs{font-size:var(--font-size-xs)}.divider{border:none;border-top:1px solid var(--color-border);margin:var(--space-5) 0}.empty-state{padding:var(--space-10) var(--space-6);text-align:center;color:var(--color-text-muted);font-size:var(--font-size-sm)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}.grid-form-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.grid-form-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}.list-layout{display:flex;gap:var(--space-4);align-items:flex-start}.list-sidebar{width:240px;flex-shrink:0;background:var(--color-bg-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);border:1px solid var(--color-border)}.list-main{flex:1;min-width:0}.form-item-table{display:block}.form-item-cards{display:none}.form-actions-row{display:flex;gap:var(--space-3)}.detail-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 24px}.detail-summary-row{display:flex;gap:var(--space-5)}.detail-summary-box{width:280px;flex-shrink:0}.tracking-header-grid{display:grid;grid-template-columns:32px minmax(0,1.2fr) 160px minmax(0,1fr) 32px;gap:var(--space-2);align-items:center}@media (max-width: 1024px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-form-3{grid-template-columns:1fr 1fr}.list-sidebar{width:200px}.tracking-header-grid{grid-template-columns:1fr 1fr 32px}.tracking-header-grid>:nth-child(1){display:none}.detail-info-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay.open{display:block}.main-area{margin-left:0;width:100%}.main-content{padding:var(--space-4)}.hamburger-btn{display:flex;align-items:center;justify-content:center}.grid-4{grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.grid-2{grid-template-columns:1fr;gap:var(--space-4)}.grid-form-2,.grid-form-3{grid-template-columns:1fr}.form-card{max-width:100%;padding:var(--space-5)}.search-input{width:100%}.page-header{flex-direction:column;align-items:flex-start}.page-toolbar{width:100%;justify-content:space-between}.mobile-filter-toggle{display:flex!important;align-items:center}.list-sidebar{display:none;width:100%}.list-sidebar.list-sidebar-open{display:block}.form-item-table{display:none}.form-item-cards{display:block}.form-actions-row{flex-direction:column}.form-actions-row button{width:100%}.detail-info-grid{grid-template-columns:1fr}.detail-summary-row{flex-direction:column}.detail-summary-box{width:100%}.tracking-header-grid{grid-template-columns:1fr 32px}.tracking-header-grid>:nth-child(1){display:none}}@media (max-width: 480px){.grid-4{grid-template-columns:1fr 1fr;gap:10px}.main-content{padding:var(--space-3)}.card{padding:var(--space-4)}}@media (max-width: 500px){.user-name-label{display:none}}