:root{--bg:#0a0e27;--bg-secondary:#1a1f3a;--text:#e0e0e0;--text-secondary:#b0b0b0;--primary:#00d9ff;--primary-dark:#00a8cc;--accent:#ff6b6b;--success:#51cf66;--border:#2a2f45;--shadow:0 4px 12px #00000080;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;font-family:var(--sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;font-size:16px;line-height:1.5;overflow-x:hidden}#root{flex-direction:column;width:100%;height:100%;display:flex}.app{background:var(--bg);max-width:480px;height:100vh;color:var(--text);flex-direction:column;margin:0 auto;display:flex;position:relative}.header{text-align:center;border-bottom:1px solid var(--border);box-shadow:var(--shadow);background:linear-gradient(135deg,#1a1f3a 0%,#252b47 100%);padding:24px 16px 16px}.header h1{color:var(--primary);letter-spacing:2px;text-transform:uppercase;margin:0 0 4px;font-size:32px;font-weight:700}.header .tagline{color:var(--primary);letter-spacing:1px;font-size:12px;font-weight:500}.main{scroll-behavior:smooth;flex:1;padding-bottom:70px;overflow-y:auto}.main::-webkit-scrollbar{width:6px}.main::-webkit-scrollbar-track{background:0 0}.main::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.tab-content{padding:16px}.tab-content h2{color:var(--primary);margin-bottom:16px;font-size:24px;font-weight:700}.search-section{flex-direction:column;gap:8px;margin-bottom:16px;display:flex}.search-input{background:var(--bg-secondary);border:1px solid var(--border);width:100%;color:var(--text);border-radius:12px;outline:none;padding:12px 16px;font-size:14px;transition:all .3s}.search-input::placeholder{color:var(--text-secondary)}.search-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #00d9ff1a}.categories-scroll{scroll-behavior:smooth;gap:8px;margin-bottom:16px;padding-bottom:8px;display:flex;overflow-x:auto}.categories-scroll::-webkit-scrollbar{height:4px}.categories-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.category-btn{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);white-space:nowrap;cursor:pointer;border-radius:20px;outline:none;flex-shrink:0;padding:8px 16px;font-size:13px;font-weight:600;transition:all .3s}.category-btn:hover{border-color:var(--primary);color:var(--primary)}.category-btn.active{background:var(--primary);border-color:var(--primary);color:var(--bg)}.jobs-list{flex-direction:column;gap:12px;display:flex}.job-card{background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;border-radius:12px;padding:16px;transition:all .3s}.job-card:hover{border-color:var(--primary);box-shadow:0 0 0 2px #00d9ff1a}.job-card.completed{opacity:.6;border-color:var(--success)}.job-header{justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px;display:flex}.job-header h3{color:var(--text);flex:1;margin:0;font-size:16px;font-weight:700}.job-price{color:var(--primary);white-space:nowrap;font-size:18px;font-weight:700}.job-info{flex-wrap:wrap;gap:8px;margin-bottom:8px;display:flex}.job-badge{color:var(--primary);text-transform:uppercase;background:#00d9ff26;border:1px solid #00d9ff4d;border-radius:12px;padding:4px 12px;font-size:11px;font-weight:600;display:inline-block}.job-district{color:var(--accent);background:#ff6b6b26;border:1px solid #ff6b6b4d;border-radius:12px;padding:4px 12px;font-size:11px;font-weight:600;display:inline-block}.job-distance{color:var(--success);background:#51cf6626;border:1px solid #51cf664d;border-radius:12px;padding:4px 12px;font-size:11px;font-weight:600;display:inline-block}.job-details{border-top:1px solid var(--border);margin-bottom:12px;padding-top:8px}.job-details p{color:var(--text-secondary);margin:4px 0;font-size:13px}.job-details strong{color:var(--text);font-weight:600}.job-status{background:#51cf661a;border:1px solid #51cf6633;border-radius:8px;margin-bottom:12px;padding:8px}.job-status p{color:var(--success);margin:0;font-size:13px}.job-actions{flex-direction:column;gap:8px;display:flex}.btn-take,.btn-complete,.btn-cancel,.btn-submit{cursor:pointer;text-transform:uppercase;letter-spacing:.5px;text-align:center;border:none;border-radius:8px;outline:none;padding:12px 16px;font-size:14px;font-weight:700;transition:all .3s}.btn-take{background:var(--primary);color:var(--bg);width:100%}.btn-take:hover:not(:disabled){background:var(--primary-dark);box-shadow:0 0 0 2px #00d9ff4d}.btn-take:disabled{background:var(--bg-secondary);color:var(--text-secondary);border:1px solid var(--border);cursor:not-allowed}.btn-complete{background:var(--success);color:var(--bg);flex:1}.btn-complete:hover{background:#47b85c}.btn-cancel{background:var(--accent);color:var(--bg);flex:1}.btn-cancel:hover{background:#ff5252}.btn-submit{background:var(--primary);color:var(--bg);width:100%;margin-top:16px}.btn-submit:hover{background:var(--primary-dark)}.empty-state{text-align:center;color:var(--text-secondary);padding:32px 16px;font-size:14px}.add-job-form{flex-direction:column;gap:16px;display:flex}.form-group{flex-direction:column;display:flex}.form-group label{color:var(--text);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;font-size:13px;font-weight:700}.form-group input,.form-group textarea,.form-group select{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text);font-size:14px;font-family:var(--sans);border-radius:8px;outline:none;padding:12px 16px;transition:all .3s}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-secondary)}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #00d9ff1a}.form-group textarea{resize:vertical;min-height:100px;font-family:var(--sans)}.my-jobs{flex-direction:column;gap:12px;display:flex}.profile-section{flex-direction:column;gap:24px;display:flex}.profile-header{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;align-items:center;gap:16px;padding:16px;display:flex}.profile-avatar{background:var(--primary);width:64px;height:64px;color:var(--bg);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:24px;font-weight:700;display:flex}.profile-info h3{color:var(--text);margin:0 0 4px;font-size:18px;font-weight:700}.profile-info p{color:var(--primary);margin:0;font-size:12px;font-weight:600}.profile-stats{grid-template-columns:1fr 1fr 1fr;gap:12px;display:grid}.stat{background:var(--bg-secondary);border:1px solid var(--border);text-align:center;border-radius:12px;padding:16px}.stat-value{color:var(--primary);margin-bottom:4px;font-size:24px;font-weight:700}.stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:11px}.profile-details{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.profile-details h4{color:var(--primary);text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px;font-size:14px;font-weight:700}.profile-details p{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.6}.bottom-nav{background:var(--bg-secondary);border-top:1px solid var(--border);justify-content:space-around;align-items:center;gap:8px;max-width:480px;height:70px;margin:0 auto;padding:0 8px;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 12px #00000080}.nav-btn{height:56px;color:var(--text-secondary);cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:0 0;border:none;border-radius:8px;outline:none;flex-direction:column;flex:1;justify-content:center;align-items:center;font-size:12px;font-weight:700;transition:all .3s;display:flex}.nav-btn span{display:block}.nav-btn:hover{background:#00d9ff1a}.nav-btn.active{color:var(--primary);background:#00d9ff33}@media (width<=480px){.app,.bottom-nav{max-width:100%}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.tab-content{animation:.3s fadeIn}
