@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{--bg: #121212;--surface: #1C1C1C;--surface-2: #252525;--fg: #F4F4F0;--muted: #717D7E;--border: #2A2A2A;--accent: #FF5F1F;--accent-dim: rgba(255, 95, 31, .15);--arc-blue: #00B4D8;--arc-blue-dim: rgba(0, 180, 216, .15);--warning: #FBBF24;--success: #22C55E;--danger: #EF4444;--font-display: "Barlow Condensed", sans-serif;--font-body: "Space Grotesk", sans-serif;--radius: 8px;--radius-sm: 4px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px}*{margin:0;padding:0;box-sizing:border-box}html,body{background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}#root{min-height:100vh}.app{max-width:1200px;margin:0 auto;padding:var(--space-4) var(--space-4) 100px}@media(min-width:768px){.app{padding:var(--space-6) var(--space-6) 100px}}.app-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5)}.app-logo{font-family:var(--font-display);font-weight:700;font-size:24px;letter-spacing:.5px;text-transform:uppercase;color:var(--fg);line-height:1}.app-logo span{color:var(--accent)}.app-subtitle{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1.5px;margin-left:auto;white-space:nowrap}.counters{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin-bottom:var(--space-5)}.counter-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-4) var(--space-3);text-align:center;position:relative;overflow:hidden}.counter-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;border-radius:var(--radius-sm) var(--radius-sm) 0 0}.counter-card.active:before{background:var(--arc-blue)}.counter-card.overdue:before{background:var(--accent)}.counter-card.completed:before{background:var(--success)}.counter-value{font-family:var(--font-display);font-weight:700;font-size:40px;line-height:1;letter-spacing:1px}.counter-card.active .counter-value{color:var(--arc-blue)}.counter-card.overdue .counter-value{color:var(--accent)}.counter-card.completed .counter-value{color:var(--success)}.counter-label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);margin-top:var(--space-2);font-weight:500}.section-heading{font-family:var(--font-display);font-weight:600;font-size:18px;text-transform:uppercase;letter-spacing:1px;color:var(--fg);margin-bottom:var(--space-3);display:flex;align-items:center;gap:var(--space-2)}.section-heading:after{content:"";flex:1;height:1px;background:var(--border)}.controls{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-4)}@media(min-width:640px){.controls{flex-direction:row;align-items:center}}.search-wrap{position:relative;flex:1}.search-input{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px 12px 42px;color:var(--fg);font-family:var(--font-body);font-size:15px;outline:none;transition:border-color .15s}.search-input:focus{border-color:var(--accent)}.search-input::placeholder{color:var(--muted)}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}.filter-chips{display:flex;gap:var(--space-2);overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.filter-chips::-webkit-scrollbar{display:none}.chip{background:var(--surface);border:1px solid var(--border);border-radius:100px;padding:8px 14px;color:var(--muted);font-family:var(--font-body);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .15s}.chip:hover{border-color:var(--muted);color:var(--fg)}.chip.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.jobs-list{display:flex;flex-direction:column;gap:var(--space-2)}.job-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;position:relative;transition:border-color .15s}.job-card:hover{border-color:#3a3a3a}.job-card-border{position:absolute;top:0;left:0;bottom:0;width:5px;border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.job-card.overdue .job-card-border{background:var(--accent)}.job-card.due-soon .job-card-border{background:linear-gradient(180deg,var(--accent) 0%,var(--bg) 100%)}.job-card.completed .job-card-border{background:var(--success)}.job-card.normal .job-card-border{background:var(--border)}.job-card-header{display:flex;align-items:center;padding:var(--space-4);gap:var(--space-3);cursor:pointer;padding-left:calc(var(--space-4) + 5px)}.job-card-info{flex:1;min-width:0}.job-name{font-family:var(--font-body);font-weight:600;font-size:15px;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.job-meta{display:flex;align-items:center;gap:var(--space-2);margin-top:4px;font-size:13px;color:var(--muted);flex-wrap:wrap}.job-meta-dot{width:3px;height:3px;border-radius:50%;background:var(--muted);flex-shrink:0}.job-type-badge{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--arc-blue);background:var(--arc-blue-dim);padding:2px 8px;border-radius:var(--radius-sm)}.status-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:4px 10px;border-radius:100px;white-space:nowrap;flex-shrink:0}.status-badge:before{content:"";width:6px;height:6px;border-radius:50%}.status-badge.quoted{color:var(--muted);background:#717d7e26}.status-badge.quoted:before{background:var(--muted)}.status-badge.scheduled{color:var(--arc-blue);background:var(--arc-blue-dim)}.status-badge.scheduled:before{background:var(--arc-blue)}.status-badge.in-progress{color:var(--accent);background:var(--accent-dim)}.status-badge.in-progress:before{background:var(--accent)}.status-badge.on-hold{color:var(--warning);background:#fbbf2426}.status-badge.on-hold:before{background:var(--warning)}.status-badge.completed{color:var(--success);background:#22c55e26}.status-badge.completed:before{background:var(--success)}.deadline-badge{font-size:12px;font-weight:600;white-space:nowrap;flex-shrink:0}.deadline-badge.overdue{color:var(--accent)}.deadline-badge.due-soon{color:var(--warning)}.deadline-badge.normal{color:var(--muted)}.job-detail{border-top:1px solid var(--border);padding:var(--space-4);padding-left:calc(var(--space-4) + 5px)}.job-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4)}@media(min-width:640px){.job-detail-grid{grid-template-columns:repeat(4,1fr)}}.detail-item{display:flex;flex-direction:column;gap:2px}.detail-label{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:500}.detail-value{font-size:14px;color:var(--fg);font-weight:500}.job-actions{display:flex;gap:var(--space-2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;border-radius:var(--radius);font-family:var(--font-body);font-size:14px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--surface-2);color:var(--fg);transition:all .15s;white-space:nowrap}.btn:hover{border-color:var(--muted)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:#e54f15;border-color:#e54f15}.btn-danger{background:transparent;border-color:var(--danger);color:var(--danger)}.btn-danger:hover{background:#ef44441a}.btn-sm{padding:7px 14px;font-size:13px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-around;padding:var(--space-2) var(--space-4) calc(var(--space-2) + env(safe-area-inset-bottom,0px));z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;color:var(--muted);font-family:var(--font-body);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;padding:var(--space-1) var(--space-3);transition:color .15s}.nav-item.active{color:var(--accent)}.nav-item:hover{color:var(--fg)}.nav-add-btn{width:52px;height:52px;border-radius:50%;background:var(--accent);border:3px solid var(--bg);color:#fff;font-size:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;margin-top:-20px;box-shadow:0 4px 12px #ff5f1f66;transition:transform .15s;flex-shrink:0}.nav-add-btn:hover{transform:scale(1.05)}.nav-add-btn:active{transform:scale(.95)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:200;display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .15s ease}@media(min-width:640px){.modal-overlay{align-items:center}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius) var(--radius) 0 0;width:100%;max-width:560px;max-height:92vh;overflow-y:auto;animation:slideUp .2s ease}@media(min-width:640px){.modal{border-radius:var(--radius)}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);z-index:1}.modal-title{font-family:var(--font-display);font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:1px}.modal-close{background:none;border:none;color:var(--muted);font-size:24px;cursor:pointer;padding:0;line-height:1}.modal-close:hover{color:var(--fg)}.modal-body{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4)}.modal-footer{display:flex;gap:var(--space-2);justify-content:flex-end;padding:var(--space-4) var(--space-5);border-top:1px solid var(--border);position:sticky;bottom:0;background:var(--surface)}.field{display:flex;flex-direction:column;gap:var(--space-2)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.field-label{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:600}.field-input,.field-select{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;color:var(--fg);font-family:var(--font-body);font-size:15px;outline:none;transition:border-color .15s;width:100%}.field-input:focus,.field-select:focus{border-color:var(--accent)}.field-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;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='%23717D7E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}.field-option{background:var(--surface);color:var(--fg)}.empty-state{text-align:center;padding:var(--space-8) var(--space-4);color:var(--muted)}.empty-state-icon{margin-bottom:var(--space-3);opacity:.5}.empty-state-text{font-size:15px;line-height:1.6}.empty-state-text strong{color:var(--accent)}.loading{text-align:center;padding:var(--space-8);color:var(--muted);font-size:14px}.spinner{display:inline-block;width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;bottom:90px;left:50%;transform:translate(-50%);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);padding:12px 20px;font-size:14px;font-weight:500;color:var(--fg);z-index:300;box-shadow:0 4px 20px #0006;animation:toastIn .2s ease}@keyframes toastIn{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.confirm-dialog{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:250;display:flex;align-items:center;justify-content:center;padding:var(--space-4);animation:fadeIn .15s ease}.confirm-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-5);max-width:360px;width:100%;text-align:center}.confirm-text{font-size:15px;color:var(--fg);margin-bottom:var(--space-4);line-height:1.5}.confirm-actions{display:flex;gap:var(--space-2);justify-content:center}
