*{box-sizing:border-box;margin:0;padding:0}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f5f5;overscroll-behavior:none}#root{min-height:100vh;display:flex;flex-direction:column}button{cursor:pointer;font-family:inherit}input,textarea{font-family:inherit}.app{min-height:100vh;display:flex;flex-direction:column;background:#f5f5f5}.app-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:16px;box-shadow:0 2px 8px #0000001a;position:sticky;top:0;z-index:100}.app-header .header-content{display:flex;justify-content:space-between;align-items:center;gap:12px}.app-header .header-text{flex:1}.app-header h1{font-size:24px;font-weight:600;margin:0}.app-header .subtitle{font-size:14px;opacity:.9;margin-top:4px}.btn-reset{background:#fff3;color:#fff;border:2px solid rgba(255,255,255,.5);border-radius:50%;width:44px;height:44px;font-size:24px;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.btn-reset:active{background:#ffffff4d;transform:rotate(180deg) scale(.95)}.app-content{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.loading{display:flex;justify-content:center;align-items:center;padding:40px;color:#666}.error{margin:16px;padding:16px;background:#fee;border:1px solid #fcc;border-radius:8px;color:#c33}.vehicle-list{padding:16px;display:flex;flex-direction:column;gap:12px}.vehicle-card{background:#fff;border-radius:12px;padding:16px;box-shadow:0 2px 8px #00000014;transition:transform .2s,box-shadow .2s}.vehicle-card:active{transform:scale(.98)}.vehicle-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.vehicle-title{flex:1}.vehicle-title h3{font-size:18px;font-weight:600;margin-bottom:4px;color:#333}.vehicle-title .make-model{font-size:14px;color:#666}.vehicle-badge{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase}.vehicle-badge.available{background:#d4edda;color:#155724}.vehicle-badge.in-use{background:#fff3cd;color:#856404}.vehicle-badge.offline{background:#f8d7da;color:#721c24}.vehicle-info{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:12px;padding:12px;background:#f8f9fa;border-radius:8px}.vehicle-info-item{display:flex;flex-direction:column}.vehicle-info-item label{font-size:11px;color:#666;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.vehicle-info-item span{font-size:15px;font-weight:600;color:#333}.vehicle-location{font-size:13px;color:#666;margin-bottom:12px;display:flex;align-items:center;gap:6px}.vehicle-location:before{content:"📍";font-size:16px}.btn{width:100%;padding:14px;border:none;border-radius:8px;font-size:16px;font-weight:600;transition:all .2s;text-transform:uppercase;letter-spacing:.5px}.btn:active{transform:scale(.98)}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:disabled{background:#ccc;cursor:not-allowed}.btn-secondary{background:#fff;color:#667eea;border:2px solid #667eea}.btn-danger{background:#dc3545;color:#fff}.navigation-form{padding:16px;background:#fff;border-radius:12px;margin:16px;box-shadow:0 2px 8px #00000014}.navigation-form h2{font-size:20px;margin-bottom:16px;color:#333}.selected-vehicle{background:#f8f9fa;padding:12px;border-radius:8px;margin-bottom:16px}.selected-vehicle h4{font-size:14px;color:#666;margin-bottom:4px}.selected-vehicle p{font-size:16px;font-weight:600;color:#333}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:14px;font-weight:600;color:#333;margin-bottom:8px}.form-group input{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;transition:border-color .2s}.form-group input:focus{outline:none;border-color:#667eea}.form-actions{display:flex;gap:12px;margin-top:16px}.navigation-view{padding:16px}.nav-status{background:#fff;border-radius:12px;padding:20px;margin-bottom:16px;box-shadow:0 2px 8px #00000014;text-align:center}.nav-status h2{font-size:24px;margin-bottom:8px;color:#333}.nav-status .status-text{font-size:16px;color:#667eea;font-weight:600;text-transform:uppercase;letter-spacing:1px}.nav-details{background:#fff;border-radius:12px;padding:16px;box-shadow:0 2px 8px #00000014;margin-bottom:16px}.nav-details h3{font-size:18px;margin-bottom:16px;color:#333}.nav-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.nav-detail-item{text-align:center;padding:12px;background:#f8f9fa;border-radius:8px}.nav-detail-item label{display:block;font-size:12px;color:#666;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.nav-detail-item .value{font-size:20px;font-weight:700;color:#333}.nav-detail-item .unit{font-size:12px;color:#666;margin-left:4px}.back-button{position:fixed;bottom:24px;left:50%;transform:translate(-50%);width:calc(100% - 32px);max-width:400px;z-index:50}
