* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #f5f7fa; color: #1a1a2e; padding: 20px; }
.container { max-width: 1400px; margin: 0 auto; }
h1 { font-size: 1.5rem; margin-bottom: 20px; color: #232f3e; }
.site-selector { margin-bottom: 20px; display: flex; gap: 10px; align-items: center; }
.site-selector select { padding: 8px 12px; font-size: 1rem; border: 1px solid #ccc; border-radius: 4px; }
.site-selector button { padding: 8px 16px; background: #ff9900; color: #fff; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; }
.site-selector button:hover { background: #e88800; }
.card { background: #fff; border-radius: 8px; padding: 20px; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.card h2 { font-size: 1.1rem; margin-bottom: 12px; color: #232f3e; border-bottom: 1px solid #eee; padding-bottom: 8px; }
.field { margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.field label { width: 220px; font-size: 0.85rem; color: #555; }
.field input, .field select { flex: 1; padding: 6px 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 0.9rem; }
.field input[type="checkbox"] { flex: none; width: 18px; height: 18px; }
.field .hint { font-size: 0.75rem; color: #888; margin-left: 5px; }
textarea { width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px; font-family: monospace; font-size: 0.85rem; min-height: 80px; }
.save-bar { position: sticky; bottom: 20px; background: #232f3e; color: #fff; padding: 12px 20px; border-radius: 8px; display: flex; justify-content: space-between; align-items: center; }
.save-bar button { padding: 10px 24px; background: #ff9900; color: #fff; border: none; border-radius: 4px; cursor: pointer; font-size: 1rem; font-weight: bold; }
.save-bar button:hover { background: #e88800; }
.status { font-size: 0.85rem; }
.status.ok { color: #4caf50; }
.status.err { color: #f44336; }
#loading { text-align: center; padding: 40px; color: #888; }
#resultsTable td, #resultsTable th { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:3px 4px; max-width:0; }
#resultsTable { table-layout:fixed; }
#resultsTable th:nth-child(1) { width:7%; }
#resultsTable th:nth-child(2) { width:2.5%; }
#resultsTable th:nth-child(3) { width:4%; }
#resultsTable th:nth-child(4) { width:5%; }
#resultsTable th:nth-child(5) { width:5%; }
#resultsTable th:nth-child(6) { width:6%; }
#resultsTable th:nth-child(7) { width:5%; }
#resultsTable th:nth-child(8) { width:5%; }
#resultsTable th:nth-child(9) { width:14%; }
#resultsTable th:nth-child(10) { width:12%; }
#resultsTable th:nth-child(11) { width:4%; }
#resultsTable th:nth-child(12) { width:9%; }
#resultsTable th:nth-child(13) { width:6%; }
#resultsTable th:nth-child(14) { width:8%; }
.field .use-default { display:inline-flex; align-items:center; gap:3px; font-size:0.7rem; color:#888; margin-left:8px; }
.field .use-default input { width:14px; height:14px; }
.field input:disabled, .field select:disabled { background:#f0f0f0; color:#999; }

/* Classes replacing inline styles */
.card-info { background:#f0f4ff; border-left: 4px solid #232f3e; }
.details-tree { margin-bottom:8px; }
.summary-tree { cursor:pointer; font-weight:bold; font-size:0.9rem; }
.tree-content { font-size:0.8rem; padding:12px; background:#fff; border-radius:6px; margin-top:8px; overflow-x:auto; }
.tree-pre { font-family:monospace; line-height:1.5; margin:0; font-size:0.75rem; }
.info-text { font-size:0.85rem; line-height:1.5; color:#444; }
.info-text-mt { font-size:0.85rem; line-height:1.5; color:#444; margin-top:8px; }
.btn-refresh { padding:8px 16px; background:#4caf50; color:#fff; border:none; border-radius:4px; cursor:pointer; display:none; }
.link-debug { margin-left:auto; font-size:0.85rem; color:#666; text-decoration:none; }
.card-pending { border-left:4px solid #ff9900; }
.hidden { display:none; }
.summary-results { font-size:0.9rem; margin-bottom:10px; }
.details-occupied { font-size:0.8rem; margin-bottom:8px; }
.summary-occupied { cursor:pointer; font-weight:bold; }
.occupied-list { margin-top:4px; columns:3; font-size:0.75rem; }
.tab-buttons { margin-bottom:8px; }
.btn-tab { padding:4px 12px; border:1px solid #ccc; border-radius:4px; cursor:pointer; }
.btn-tab-active { padding:4px 12px; border:1px solid #ccc; border-radius:4px; cursor:pointer; background:#232f3e; color:#fff; }
.label-fullwindow { margin-left:12px; font-size:0.8rem; cursor:pointer; }
.table-scroll { overflow-x:auto; }
#resultsTable { width:100%; border-collapse:collapse; font-size:0.8rem; }
.btn-csv-ob { padding:8px 16px; border:none; border-radius:4px; cursor:pointer; background:#4caf50; color:#fff; margin-right:8px; }
.btn-csv-ib { padding:8px 16px; border:none; border-radius:4px; cursor:pointer; background:#2196f3; color:#fff; }
.btn-download-assignments { padding:8px 16px; border:none; border-radius:4px; cursor:pointer; background:#ff9900; color:#fff; }
#csvButtons { margin-top:12px; }
#assignButtons { margin-top:12px; }
.tab-btn { padding:8px 16px; border:1px solid #ccc; border-radius:4px; cursor:pointer; background:#fff; margin-right:4px; }
.tab-btn.active { background:#232f3e; color:#fff; }
.section-desc { font-size:0.8rem; color:#666; margin-bottom:12px; }
.section-heading { font-size:0.85rem; margin:12px 0 6px; color:#232f3e; }
.section-heading-mt { font-size:0.85rem; margin:16px 0 6px; color:#232f3e; }
.hours-note { font-size:0.75rem; color:#666; margin-bottom:6px; }
.hours-grid { display:grid; grid-template-columns:100px 80px 10px 80px; gap:6px; align-items:center; margin-bottom:6px; }
.hours-grid label { font-size:0.85rem; }
.hours-grid input { font-size:0.8rem; }
.door-groups-header { display:grid; grid-template-columns:60px 80px 10px 80px 80px 30px; gap:6px; align-items:center; margin-bottom:6px; }
.btn-add-group { margin:8px 0; padding:4px 12px; font-size:0.8rem; border:1px solid #ccc; border-radius:4px; cursor:pointer; }
.btn-add-group-sm { margin:4px 0; padding:4px 12px; font-size:0.8rem; border:1px solid #ccc; border-radius:4px; cursor:pointer; }
.btn-add-group-sm-mb { margin:4px 0 12px; padding:4px 12px; font-size:0.8rem; border:1px solid #ccc; border-radius:4px; cursor:pointer; }
.subheading { font-size:0.85rem; margin:14px 0 6px; color:#232f3e; }
.subheading-mt { font-size:0.85rem; margin:8px 0 4px; color:#232f3e; }
.parking-header { display:grid; grid-template-columns:120px 60px 70px 10px 70px 1fr 30px; gap:4px; font-size:0.8rem; margin-bottom:6px; }
.btn-add-parking { margin:4px 0; padding:4px 12px; font-size:0.75rem; border:1px solid #ccc; border-radius:4px; cursor:pointer; }
.catchall-grid { margin-top:12px; display:grid; grid-template-columns:120px 60px 70px 10px 70px 80px; gap:6px; font-size:0.85rem; align-items:center; }
.catchall-grid-mt { display:grid; grid-template-columns:120px 60px 70px 10px 70px 80px; gap:6px; font-size:0.85rem; align-items:center; margin-top:4px; }
.catchall-grid input { font-size:0.8rem; }
.catchall-grid label { font-size:0.75rem; }
.catchall-grid-mt input { font-size:0.8rem; }
.catchall-grid-mt label { font-size:0.75rem; }
.text-center { text-align:center; }
.field-bold label { font-weight:bold; }
.rules-grid-header { display:grid; grid-template-columns:140px 1fr 1fr; gap:6px; font-size:0.85rem; margin-bottom:8px; }
.rules-grid-row { display:grid; grid-template-columns:140px 1fr 1fr; gap:6px; margin-bottom:6px; }
.btn-add-category { padding:4px 12px; border:1px dashed #999; border-radius:4px; cursor:pointer; background:#fff; color:#666; font-size:0.8rem; }
.btn-add-category-mb { padding:4px 12px; border:1px dashed #999; border-radius:4px; cursor:pointer; background:#fff; color:#666; font-size:0.8rem; margin-bottom:12px; }
.cx-header { font-size:0.9rem; margin:16px 0 8px; color:#232f3e; }
.btn-import-ra { padding:4px 12px; font-size:0.8rem; border:1px solid #4caf50; border-radius:4px; cursor:pointer; background:#fff; color:#4caf50; }
.import-hint { font-size:0.75rem; color:#666; margin-left:8px; }
.import-row { margin-bottom:8px; }
.cx-note { font-size:0.8rem; color:#666; margin-bottom:8px; }
.lanes-header { display:grid; grid-template-columns:1fr 80px 80px 80px 30px; gap:4px; font-size:0.8rem; margin-bottom:4px; font-weight:bold; }
.btn-add-lane { padding:4px 12px; border:1px dashed #999; border-radius:4px; cursor:pointer; background:#fff; color:#666; font-size:0.8rem; margin-top:4px; }
.btn-clear-lanes { padding:4px 12px; border:1px solid #d32f2f; border-radius:4px; cursor:pointer; background:#fff; color:#d32f2f; font-size:0.8rem; margin-top:4px; }
.slack-link { margin-left:8px; font-size:0.8rem; }
.trailer-pool-input-sm { width:250px; }
.trailer-pool-input-xs { width:60px; }
.h2-mt { margin-top:20px; }
.pending-item { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid #eee; }
.pending-site { color:#888; font-size:0.85rem; }
.btn-approve { margin-left:auto; padding:4px 12px; background:#4caf50; color:#fff; border:none; border-radius:4px; cursor:pointer; }
.btn-reject { padding:4px 12px; background:#f44336; color:#fff; border:none; border-radius:4px; cursor:pointer; }
.file-input-hidden { display:none; }
.subheading-12 { font-size:0.85rem; margin:12px 0 4px; color:#232f3e; }

/* Dynamic element styles */
.lane-row { display:grid; grid-template-columns:1fr 80px 80px 80px 30px; gap:4px; margin-bottom:3px; }
.lane-row-unassigned { background:#fff3e0; border-radius:4px; padding:2px 4px; }
.input-sm { font-size:0.8rem; }
.input-bold { font-weight:bold; }
.input-muted { font-size:0.8rem; color:#666; }
.input-muted-more { font-size:0.8rem; color:#999; }
.btn-remove { border:none; background:none; color:#d32f2f; cursor:pointer; }
.btn-remove-lg { border:none; background:none; color:#d32f2f; cursor:pointer; font-size:1.1rem; }
.door-group-row { display:grid; grid-template-columns:60px 80px 10px 80px 80px 30px; gap:6px; align-items:center; margin-bottom:6px; }
.door-count { font-size:0.7rem; color:#666; }
.text-center { text-align:center; }
.parking-group-row { display:grid; grid-template-columns:120px 60px 70px 10px 70px 1fr 50px 30px; gap:4px; align-items:center; margin-bottom:4px; }
.label-rev { font-size:0.7rem; white-space:nowrap; }
.custom-category-row { display:grid; grid-template-columns:140px 1fr 1fr 30px; gap:6px; margin-bottom:6px; }
.link-fmc { text-decoration:none; font-size:0.7rem; }
.row-border { border-bottom:1px solid #eee; }
.td-pad { padding:3px 8px; }
.td-sm { font-size:0.7rem; }
.td-blue { color:#0066c0; }
.td-route { font-size:0.75rem; }
.td-bold { font-weight:bold; }
.td-warning { padding:8px; color:#d32f2f; font-weight:bold; }
.td-error { padding:8px; color:#d32f2f; font-weight:bold; }
.td-success { padding:8px; color:#4caf50; }
.th-left { padding:4px 8px; text-align:left; }
.row-danger { background:#ffebee; }
.row-warning { background:#fff3e0; }
.row-header { background:#f5f5f5; }
.combined-first { background:#fff8e1; border-top:2px solid #ff9900; }
.combined-rest { background:#fff8e1; }
.thead-row { background:#f0f4ff; }
