@tailwind base;@tailwind components;@tailwind utilities;@layer base{html{scroll-behavior:smooth}body{@apply antialiased text-gray-800 dark:text-gray-200;}:focus-visible{@apply outline-none ring-2 ring-blue-500 ring-offset-2 dark:ring-offset-gray-900;}}@layer components{.btn{@apply inline-flex items-center justify-center px-4 py-2 rounded-lg font-medium transition-all duration-300 transform hover:scale-105 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-60 disabled:cursor-not-allowed relative overflow-hidden;}.btn:before{content:"";@apply absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent translate-x-[-200%] skew-x-[-20deg] transition-transform duration-700;}.btn:hover:before{@apply translate-x-[200%];}.btn-primary{@apply btn bg-gradient-to-r from-blue-600 to-blue-700 text-white hover:from-blue-700 hover:to-blue-800 dark:from-blue-500 dark:to-blue-600 dark:hover:from-blue-600 dark:hover:to-blue-700 focus:ring-blue-500 shadow-lg shadow-blue-500/25;}.btn-secondary{@apply btn bg-gradient-to-r from-gray-200 to-gray-300 text-gray-800 hover:from-gray-300 hover:to-gray-400 dark:from-gray-700 dark:to-gray-800 dark:text-gray-200 dark:hover:from-gray-600 dark:hover:to-gray-700 focus:ring-gray-500 shadow-lg shadow-gray-500/10;}.card{@apply bg-white dark:bg-gray-800 rounded-xl shadow-lg transition-transform duration-300 hover:scale-[1.02] border border-gray-200 dark:border-gray-700;}.input{@apply w-full px-4 py-2 rounded-lg border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 transition-colors duration-200;}.badge{@apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;}.badge-success{@apply badge bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200;}.badge-warning{@apply badge bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200;}.badge-error{@apply badge bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200;}.progress-bar{@apply relative bg-gray-200 dark:bg-gray-700 overflow-hidden rounded-full;}.progress-bar__fill{@apply h-full transition-all duration-500 ease-out rounded-full relative;}.progress-bar__shine{@apply absolute top-0 bottom-0 right-0 w-24 pointer-events-none;background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.4) 45%,transparent 100%);animation:shimmer 2s linear infinite}.shadow-fab{box-shadow:0 8px 32px #1f26875e}}.fade-in{animation:fadeIn .3s ease-in}.slide-in{animation:slideIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}@keyframes pulse-ring{0%{transform:scale(.8);opacity:.5}80%,to{transform:scale(1.5);opacity:0}}@keyframes pulse-dot{0%{transform:scale(.8)}50%{transform:scale(1)}to{transform:scale(.8)}}.glass{@apply bg-white bg-opacity-10 backdrop-blur-lg border border-white border-opacity-20;}.dark .glass{@apply bg-gray-900 bg-opacity-10 border-gray-800;}.pulse-ring{animation:pulse-ring 2s cubic-bezier(.25,.46,.45,.94) infinite}.pulse-dot{animation:pulse-dot 2s cubic-bezier(.25,.46,.45,.94) infinite}.fab{@apply fixed bottom-6 right-6 w-14 h-14 flex items-center justify-center rounded-full bg-gradient-to-r from-blue-600 to-blue-700 text-white shadow-lg hover:from-blue-700 hover:to-blue-800 transform hover:scale-110 transition-all duration-300 z-50;}.fab:before{content:"";@apply absolute inset-0 rounded-full;background:radial-gradient(circle at center,rgba(255,255,255,.1) 0%,transparent 70%)}.loading-dots:after{content:".";animation:dots 1.5s steps(5,end) infinite}@keyframes dots{0%,20%{content:"."}40%{content:".."}60%{content:"..."}80%,to{content:""}}@keyframes shimmer{0%{transform:translate(0)}to{transform:translate(-200%)}}:root{--gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--gradient-success: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);--gradient-warning: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);--gradient-danger: linear-gradient(135deg, #fa709a 0%, #fee140 100%);--glass-bg: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, .37);--animation-bounce: cubic-bezier(.68, -.55, .265, 1.55);--animation-smooth: cubic-bezier(.25, .46, .45, .94)}.dark{--glass-bg: rgba(0, 0, 0, .2);--glass-border: rgba(255, 255, 255, .1);--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .5)}.theme-midnight{background:linear-gradient(135deg,#0c0c0c,#1a1a2e,#16213e);color:#e0e6ed}.theme-forest{background:linear-gradient(135deg,#134e5e,#71b280);color:#f0fff0}.theme-ocean{background:linear-gradient(135deg,#667db6,#0082c8 35% 100%);color:#f0f8ff}.glass-card{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--glass-shadow)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 5px #3b82f680}50%{box-shadow:0 0 20px #3b82f6cc}}@keyframes slide-in-right{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fade-in-up{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.animate-float{animation:float 3s ease-in-out infinite}.animate-pulse-glow{animation:pulse-glow 2s ease-in-out infinite}.animate-slide-in{animation:slide-in-right .5s var(--animation-bounce)}.animate-fade-in-up{animation:fade-in-up .6s var(--animation-smooth)}.gradient-animated{background-size:400% 400%;animation:gradient-shift 3s ease infinite}.custom-scrollbar::-webkit-scrollbar{width:8px}.custom-scrollbar::-webkit-scrollbar-track{background:#0000001a;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#764ba2,#667eea)}.btn-gradient{background:var(--gradient-primary);background-size:200% 200%;transition:all .3s var(--animation-smooth)}.btn-gradient:hover{background-position:right center;transform:translateY(-2px);box-shadow:0 10px 20px #0003}.btn-gradient:active{transform:translateY(0);box-shadow:0 5px 10px #0003}.settings-card{transition:all .3s var(--animation-smooth);border:1px solid transparent}.settings-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px #0000001a;border-color:#3b82f64d}.tab-button{position:relative;overflow:hidden;transition:all .3s var(--animation-smooth)}.tab-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.tab-button:hover:before{left:100%}.toggle-switch{position:relative}.toggle-switch:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(59,130,246,.3) 0%,transparent 70%);border-radius:50%;transform:translate(-50%,-50%);transition:all .3s var(--animation-smooth);pointer-events:none}.toggle-switch:active:after{width:100px;height:100px}.range-slider{-webkit-appearance:none;appearance:none;height:6px;border-radius:5px;background:linear-gradient(90deg,#e5e7eb,#3b82f6);outline:none;transition:all .3s var(--animation-smooth)}.range-slider:hover{transform:scaleY(1.2)}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--gradient-primary);cursor:pointer;transition:all .3s var(--animation-smooth);box-shadow:0 2px 6px #0003}.range-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 4px 12px #3b82f666}.status-online{background:#10b981;animation:pulse-glow 2s ease-in-out infinite}.status-offline{background:#ef4444}.status-syncing{background:#f59e0b;animation:pulse 1s ease-in-out infinite}.loading-spinner{width:20px;height:20px;border:2px solid #f3f4f6;border-top:2px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.settings-card{margin:.5rem}.tab-button{font-size:.875rem;padding:.5rem 1rem}.btn-gradient{width:100%;margin-bottom:.5rem}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.focus-ring:focus{outline:2px solid #3b82f6;outline-offset:2px}.focus-ring:focus:not(:focus-visible){outline:none}@media print{.settings-card{box-shadow:none;border:1px solid #e5e7eb;page-break-inside:avoid}.btn-gradient{background:#3b82f6!important;color:#fff!important}}@media (prefers-contrast: high){.settings-card,.toggle-switch,.btn-gradient{border:2px solid}}.ride-tracker{max-width:72rem;margin:0 auto;position:relative}.ride-tracker-header{text-align:center;margin-bottom:2rem;position:relative}.ride-tracker-header-gradient{position:absolute;top:-1rem;left:0;width:100%;height:8rem;background:linear-gradient(to bottom,rgba(59,130,246,.1),rgba(96,165,250,.05),transparent);pointer-events:none}.ride-status-dashboard{background:linear-gradient(to right,#f3f4f6,#e5e7eb);border-radius:.75rem;padding:1.5rem;margin-bottom:2rem;position:relative}.dark .ride-status-dashboard{background:linear-gradient(to right,#14532d33,#065f4633)}.controls-section{display:flex;flex-direction:column;gap:1rem}@media (min-width: 1024px){.controls-section{flex-direction:row;align-items:center;justify-content:space-between}}.ride-fab{position:fixed;bottom:1.5rem;right:1.5rem;width:3.5rem;height:3.5rem;border-radius:9999px;color:#fff;display:flex;align-items:center;justify-content:center;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s;transform:translateZ(0);cursor:pointer;z-index:50}.ride-fab:hover{transform:scale(1.1)}.quick-action-fab-menu{position:fixed;bottom:6rem;right:1.5rem;display:flex;flex-direction:column;gap:1rem;z-index:40}.battery-usage-bar{width:100%;height:.5rem;background-color:#e5e7eb;border-radius:9999px}.dark .battery-usage-bar{background-color:#374151}.battery-usage-indicator{height:100%;border-radius:9999px;position:relative;background-color:#10b981}.battery-usage-consumed{position:absolute;top:0;right:0;height:100%;background-color:#f87171;border-top-right-radius:9999px;border-bottom-right-radius:9999px}.card-hover-effect{transition:all .3s}.card-hover-effect:hover{transform:scale(1.02);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.ride-form{background-color:#fff;border-radius:.75rem;padding:1.5rem;margin-bottom:2rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.dark .ride-form{background-color:#1f2937}.tuneup-progress-bar{height:.5rem;background-color:theme("colors.gray.200");border-radius:9999px;overflow:hidden}.tuneup-progress-bar.dark{background-color:theme("colors.gray.700")}.tuneup-progress-bar-fill{height:100%;background-color:theme("colors.blue.500");transition:width .5s}.tuneup-section{background-color:theme("colors.white");border-radius:.75rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;overflow:hidden}.tuneup-section.dark{background-color:theme("colors.gray.800")}.tuneup-section-header{padding:1rem;background-color:theme("colors.gray.50")}.tuneup-section-header.dark{background-color:theme("colors.gray.700")}#root{min-height:100vh;width:100%}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a8a8a8}html{scrollbar-width:thin;scrollbar-color:#c1c1c1 #f1f1f1}.dark ::-webkit-scrollbar-track{background:#2d2d2d}.dark ::-webkit-scrollbar-thumb{background:#555}.dark ::-webkit-scrollbar-thumb:hover{background:#777}.dark html{scrollbar-color:#555 #2d2d2d}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.focus\:ring-2:focus{outline:2px solid rgba(59,130,246,.5);box-shadow:0 0 0 2px #3b82f680}button,a,input,select,textarea{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.container{width:100%;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}