*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--n-50: #f8f9fa;--n-100: #f1f3f5;--n-200: #e9ecef;--n-300: #dee2e6;--n-400: #ced4da;--n-500: #adb5bd;--n-600: #6c757d;--n-700: #495057;--n-800: #343a40;--n-900: #212529;--a-50: #e7f5ff;--a-100: #d0ebff;--a-300: #74c0fc;--a-500: #339af0;--a-600: #228be6;--a-700: #1c7ed6;--color-success: #2f9e44;--color-warning: #f08c00;--color-danger: #e03131;--color-info: #0c8599;--surface: var(--n-50);--surface-raised: #ffffff;--surface-border: var(--n-200);--text-body: var(--n-900);--text-muted: var(--n-600);--text-inverse: #ffffff;--accent: var(--a-600);--accent-hover: var(--a-700);--r-sm: 4px;--r-md: 8px;--r-lg: 12px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:14px;line-height:1.5;color:var(--text-body);background:var(--surface)}body{min-height:100vh}#app{min-height:100vh;display:flex;flex-direction:column}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button,.btn{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-2) var(--sp-4);border:1px solid transparent;border-radius:var(--r-sm);font-size:14px;font-family:inherit;line-height:1.4;cursor:pointer;transition:background .14s,border-color .14s,opacity .14s;min-height:32px}.btn-primary{background:var(--accent);color:var(--text-inverse)}.btn-primary:hover{background:var(--accent-hover)}.btn-default{background:var(--surface-raised);border-color:var(--surface-border);color:var(--text-body)}.btn-default:hover{background:var(--n-100)}.btn-danger{background:var(--color-danger);color:var(--text-inverse)}.btn-danger:hover{background:#c92a2a}.btn-sm{padding:var(--sp-1) var(--sp-2);font-size:12px;min-height:26px}button:disabled,.btn:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input,select,textarea{display:block;width:100%;padding:var(--sp-2) var(--sp-3);border:1px solid var(--surface-border);border-radius:var(--r-sm);background:var(--surface-raised);color:var(--text-body);font-size:14px;font-family:inherit;line-height:1.4;transition:border-color .14s}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px var(--a-100)}.form-group{display:flex;flex-direction:column;gap:var(--sp-1);margin-bottom:var(--sp-4)}.form-group label{font-size:13px;font-weight:500;color:var(--text-body)}.form-group .hint{font-size:12px;color:var(--text-muted)}.form-group .error-msg{font-size:12px;color:var(--color-danger)}.form-group input.has-error,.form-group select.has-error{border-color:var(--color-danger)}.card{background:var(--surface-raised);border:1px solid var(--surface-border);border-radius:var(--r-md);padding:var(--sp-6)}.card-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--sp-4);margin-bottom:var(--sp-4);border-bottom:1px solid var(--surface-border)}.card-header h2{font-size:16px;font-weight:600}table{width:100%;border-collapse:collapse;font-size:13px}thead th{text-align:left;padding:var(--sp-2) var(--sp-3);background:var(--n-100);font-weight:500;font-size:12px;color:var(--text-muted);border-bottom:1px solid var(--surface-border);position:sticky;top:0;z-index:1}tbody td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--n-100);vertical-align:middle}tbody tr:hover>td{background:var(--n-50)}tbody tr:last-child>td{border-bottom:none}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:500;line-height:1.6}.badge-green{background:#d3f9d8;color:#2b8a3e}.badge-red{background:#ffe3e3;color:#c92a2a}.badge-blue{background:var(--a-50);color:var(--a-700)}.badge-gray{background:var(--n-200);color:var(--n-700)}.badge-orange{background:#fff3bf;color:#e67700}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:200}.modal{background:var(--surface-raised);border-radius:var(--r-lg);padding:var(--sp-6);width:480px;max-width:96vw;box-shadow:0 8px 32px #00000029;display:flex;flex-direction:column;gap:var(--sp-4)}.modal h3{font-size:16px;font-weight:600}.modal-footer{display:flex;justify-content:flex-end;gap:var(--sp-2)}.loading{display:flex;align-items:center;justify-content:center;padding:var(--sp-8);color:var(--text-muted)}.empty{display:flex;align-items:center;justify-content:center;padding:var(--sp-8);color:var(--text-muted);flex-direction:column;gap:var(--sp-2)}.error-banner{background:#fff5f5;border:1px solid #ffc9c9;border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4);color:var(--color-danger);font-size:13px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-6)}.page-header h1{font-size:20px;font-weight:600}.page-actions{display:flex;gap:var(--sp-2)}.table-wrap{overflow-x:auto}