:root{--primary: #1976D2;--secondary: #42A5F5;--background: #f5f5f5;--surface: #ffffff;--text: #212121;--text-secondary: #757575;--error: #d32f2f;--success: #388e3c;--warning: #f57c00}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:var(--background);color:var(--text);line-height:1.6}#app{min-height:100vh}.btn{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-size:.875rem;font-weight:500;transition:all .2s;background-color:var(--primary);color:#fff}.btn:hover{opacity:.9;transform:translateY(-1px)}.btn-secondary{background-color:var(--secondary)}.btn-danger{background-color:var(--error)}.input{padding:.5rem;border:1px solid #ddd;border-radius:4px;font-size:.875rem;width:100%}.input:focus{outline:none;border-color:var(--primary)}.card{background:var(--surface);border-radius:8px;padding:1.5rem;box-shadow:0 2px 4px #0000001a;margin-bottom:1rem}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:.75rem;text-align:left;border-bottom:1px solid #ddd}.table th{background-color:var(--background);font-weight:600}.text-center{text-align:center;color:#999}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -1.5rem;padding:0 1.5rem}@media (max-width: 768px){.card{padding:1rem}.card:has(.table){overflow-x:auto}.table{font-size:.85rem;min-width:500px}.table th,.table td{padding:.5rem}}@media (max-width: 480px){.table{min-width:400px}}.view-header{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between}@media (max-width: 480px){.view-header{flex-direction:column;align-items:stretch}.view-header .btn{width:100%}}.filters-row{display:flex;flex-wrap:wrap;gap:1rem}@media (max-width: 768px){.filters-row{flex-direction:column}.filter-group{min-width:100%}}.modal-overlay{padding:2rem 1rem 1rem!important;overflow-y:auto;align-items:flex-start}.modal{max-width:100%!important;margin:auto}@media (max-width: 480px){.modal-overlay{padding:1rem .5rem .5rem!important}.modal{padding:1rem!important}}@media (max-width: 640px){.actions-cell{display:flex;flex-direction:column;gap:.25rem}.actions-cell .btn{width:100%}}
