@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#0056b3f2,#00388bf2);color:#fff;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;margin:0;min-height:100vh;padding:0}.App{background:inherit;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.container{background:#0000;margin:0 auto;max-width:1200px;padding:20px}.card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 10px 25px #0000001a;color:#333;margin-bottom:24px;padding:32px;transition:all .3s ease}.card:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;transform:translateY(-2px)}.btn{background:linear-gradient(135deg,#667eea,#764ba2);display:inline-flex;font-family:Inter,sans-serif;font-size:16px;justify-content:center;min-width:140px;padding:14px 28px}.btn:hover{box-shadow:0 10px 25px #3b82f64d}.btn:disabled{box-shadow:none}.btn-secondary{background:#6c757d}.btn-secondary:hover{box-shadow:0 10px 25px #6c757d4d}.btn-success{background:linear-gradient(135deg,#28a745,#20c997)}.btn-success:hover{box-shadow:0 10px 25px #28a7454d}.btn-danger{background:linear-gradient(135deg,#dc3545,#e74c3c)}.btn-danger:hover{box-shadow:0 10px 25px #dc35454d}.form-group{margin-bottom:24px}.form-label{color:#374151;display:block;font-size:14px;font-weight:600;letter-spacing:.5px;margin-bottom:8px;text-transform:uppercase}.form-control{background:#f9fafb;border:2px solid #e5e7eb;border-radius:12px;font-family:Inter,sans-serif;font-size:16px;padding:14px 16px;transition:all .3s ease;width:100%}.form-control:focus{background:#fff;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;outline:none}.dropzone{background:#f8fafc;border:2px dashed #667eea;border-radius:16px;cursor:pointer;overflow:hidden;padding:48px 24px;position:relative;text-align:center;transition:all .3s ease}.dropzone:hover{background:#f1f5f9;border-color:#764ba2;transform:translateY(-1px)}.dropzone.active{background:#f0fdf4;border-color:#28a745}.dropzone:before{background:linear-gradient(90deg,#0000,#667eea1a,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.dropzone:hover:before{left:100%}.status{align-items:center;border:1px solid;border-radius:12px;display:flex;font-weight:500;gap:12px;margin-bottom:20px;padding:16px}.status.success{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.status.error{background:#fef2f2;border-color:#fecaca;color:#dc2626}.status.info{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}.status.warning{background:#fffbeb;border-color:#fed7aa;color:#d97706}.loading{animation:spin 1s linear infinite;border:3px solid #f3f3f3;border-radius:50%;border-top-color:#667eea;display:inline-block;height:20px;width:20px}.grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.flex{gap:16px}.flex,.flex-between{align-items:center;display:flex}.flex-between{justify-content:space-between}.text-center{text-align:center}.mb-0{margin-bottom:0}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mb-4{margin-bottom:32px}.mt-0{margin-top:0}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:32px}.floating-animation{animation:float 6s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.pulse-animation{animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.header{background:#fff;border-bottom:1px solid #e5e7eb;box-shadow:0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;position:sticky;top:0;z-index:50}.header-nav{height:72px;justify-content:space-between;margin:0 auto;max-width:1200px;padding:0 24px}.header-brand,.header-logo,.header-nav{align-items:center;display:flex}.header-logo{background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:8px;height:40px;justify-content:center;margin-right:12px;width:40px}.header-title{background:linear-gradient(135deg,#2563eb,#7c3aed);-webkit-background-clip:text;background-clip:text;color:#0000;font-family:Inter,sans-serif;font-size:24px;font-weight:700}.header-nav-links{align-items:center;display:flex;gap:32px}.header-nav-link{color:#6b7280;font-family:Inter,sans-serif;font-weight:500;text-decoration:none;transition:color .3s ease}.header-nav-link:hover{color:#3b82f6}.header-cta{background:#3b82f6;border-radius:9999px;color:#fff;font-family:Inter,sans-serif;font-size:14px;font-weight:600;padding:8px 24px;text-decoration:none;transition:all .3s ease}.header-cta:hover{background:#2563eb;box-shadow:0 4px 12px #3b82f64d;transform:translateY(-1px)}.text-white{color:#fff}.text-blue-100{color:#dbeafe}.text-blue-200{color:#bfdbfe}.text-green-300{color:#86efac}@media (max-width:768px){.container{padding:16px}.card{margin-bottom:20px;padding:24px}.grid{gap:20px;grid-template-columns:1fr}.flex{align-items:stretch;flex-direction:column}.flex .btn{margin-bottom:12px;width:100%}.dropzone{padding:32px 16px}.header-nav{height:64px;padding:0 16px}.header-nav-links{display:none}.header-title{font-size:20px}}.video-comparison-overlay{align-items:center;background:#000000e6;bottom:0;display:flex;justify-content:center;left:0;overflow:hidden;padding:20px;position:fixed;right:0;top:0;z-index:1000}.video-comparison-container{background:#fff;border-radius:16px;box-shadow:0 20px 40px #0000004d;display:flex;flex-direction:column;max-height:90vh;max-width:1400px;overflow:hidden;width:100%}.video-comparison-header{align-items:center;background:#f9fafb;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;padding:20px 24px}.video-comparison-header h2{color:#111827;font-size:1.5rem;font-weight:600;margin:0}.close-button{background:none;border:none;border-radius:8px;color:#6b7280;cursor:pointer;font-size:1.5rem;padding:8px;transition:all .2s}.close-button:hover{background:#e5e7eb;color:#374151}.video-comparison-content{flex:1 1;overflow-y:auto;padding:24px}.video-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:1fr 1fr;margin-bottom:24px}.video-container{display:flex;flex-direction:column}.video-container h3{color:#374151;font-size:1.1rem;font-weight:600;margin:0 0 12px;text-align:center}.video-container video{appearance:none;background:#000;border-radius:12px;box-shadow:0 4px 12px #0000001a;height:auto;width:100%}.video-container video::-webkit-media-controls,.video-container video::-webkit-media-controls-panel{display:none!important}.video-container video::-webkit-media-controls-play-button,.video-container video::-webkit-media-controls-timeline{display:none!important}.video-container video::-webkit-media-controls-current-time-display,.video-container video::-webkit-media-controls-time-remaining-display{display:none!important}.video-container video::-webkit-media-controls-mute-button,.video-container video::-webkit-media-controls-volume-slider{display:none!important}.error-message{align-items:center;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#dc2626;display:flex;gap:8px;margin-bottom:16px;padding:12px 16px}.loading-message{align-items:center;color:#6b7280;display:flex;gap:12px;justify-content:center;padding:24px}.loading-spinner{border:2px solid #e5e7eb;height:20px;width:20px}.video-controls{background:#f9fafb;border-radius:12px;margin-bottom:24px;padding:20px}.control-buttons{display:flex;gap:12px;margin-bottom:16px}.play-button{align-items:center;background:#3b82f6;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1rem;justify-content:center;min-width:48px;padding:12px 16px;transition:all .2s}.play-button:hover{background:#2563eb}.play-button:disabled{background:#9ca3af;cursor:not-allowed}.progress-bar{background:#e5e7eb;border-radius:6px;cursor:pointer;height:12px;margin-bottom:8px;position:relative;transition:all .2s ease;width:100%}.progress-bar:hover{background:#d1d5db;height:16px}.progress-bar:hover .progress-fill{background:linear-gradient(90deg,#2563eb,#1e40af)}.progress-fill{background:linear-gradient(90deg,#3b82f6,#1d4ed8);border-radius:6px;height:100%;position:relative;transition:width .1s ease}.progress-fill:after{background:#fff;border:2px solid #3b82f6;border-radius:50%;box-shadow:0 2px 4px #0003;content:"";height:12px;opacity:0;position:absolute;right:-6px;top:50%;transform:translateY(-50%);transition:opacity .2s ease;width:12px}.progress-bar:hover .progress-fill:after{opacity:1}.time-display{color:#374151;font-size:.9rem;font-weight:600;margin-top:4px;text-align:center}.progress-container{margin-bottom:16px;position:relative}.progress-container:before{background:#000c;border-radius:4px;bottom:100%;color:#fff;content:attr(data-tooltip);font-size:.75rem;left:50%;opacity:0;padding:4px 8px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .2s ease;white-space:nowrap;z-index:10}.progress-container:hover:before{opacity:1}.thumbnail-preview{bottom:100%;margin-bottom:8px;pointer-events:none;position:absolute;transform:translateX(-50%);z-index:20}.thumbnail-video-container{background:#000;border:2px solid #3b82f6;border-radius:8px;box-shadow:0 4px 12px #0000004d;overflow:hidden}.thumbnail-time{background:#000c;border-radius:4px;color:#fff;font-size:.75rem;font-weight:600;margin-top:4px;padding:4px 8px;text-align:center;white-space:nowrap}.comparison-info{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr}.info-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:16px;text-align:center}.info-card h4{color:#374151;font-size:1rem;font-weight:600;margin:0 0 8px}.info-card p{color:#6b7280;font-size:.875rem;line-height:1.4;margin:0}@media (max-width:1024px){.video-grid{gap:16px}.comparison-info,.video-grid{grid-template-columns:1fr}.video-comparison-container{margin:0 10px;max-width:100%}}@media (max-width:768px){.video-comparison-overlay{padding:10px}.video-comparison-content,.video-comparison-header{padding:16px 20px}.video-controls{padding:16px}.control-buttons{justify-content:center}}@media (max-width:480px){.video-comparison-header h2{font-size:1.25rem}.video-container h3{font-size:1rem}.play-button{font-size:.875rem;padding:10px 12px}}.stroke-display{background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:12px;box-shadow:0 4px 6px -1px #0000001a;color:#fff;margin:16px 0;max-width:100%;overflow:hidden;padding:16px;position:relative;z-index:1}.stroke-display-header h4{color:#fff;font-size:1rem;font-weight:600;margin:0 0 12px}.stroke-display-content{display:flex;flex-direction:column;gap:8px}.stroke-info{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.stroke-name{font-size:1.1rem;font-weight:600}.stroke-confidence{font-size:.9rem;opacity:.9}.alt-strokes-label{font-size:.85rem;opacity:.8}.alt-strokes-list{gap:4px}.alt-stroke{font-size:.8rem;font-weight:700}.stroke-confidence{background:#fff3;border-radius:6px;color:#fffc;font-size:.875rem;padding:4px 8px}.alternative-strokes{margin-top:8px}.alt-strokes-label{color:#ffffffb3;font-size:.75rem;margin-bottom:4px}.alt-strokes-list{display:flex;flex-wrap:wrap;gap:6px}.alt-stroke{background:#fff3;border-radius:4px;color:#fff;font-size:.75rem;padding:2px 6px}.angle-selector-container{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border:1px solid #bae6fd;border-radius:12px;margin-bottom:24px;padding:20px}.angle-selector-header{align-items:center;display:flex;gap:8px;margin-bottom:16px}.angle-selector-icon{font-size:1.25rem}.angle-selector-title{color:#0369a1;font-size:1.1rem;font-weight:600}.angle-selector-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-bottom:16px}.angle-option{background:#fff;border:2px solid #e0e7ff;border-radius:10px;cursor:pointer;padding:12px 16px;text-align:left;transition:all .2s ease}.angle-option:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f626}.angle-option.selected{background:linear-gradient(135deg,#eff6ff,#dbeafe);border-color:#3b82f6;box-shadow:0 2px 8px #3b82f633}.angle-option.unavailable{cursor:not-allowed;opacity:.6}.angle-option.unavailable:hover{border-color:#e0e7ff;box-shadow:none}.angle-option-name{color:#374151;font-size:.9rem;font-weight:600;margin-bottom:4px}.angle-option-status{font-size:.75rem}.status-available{background:#d1fae5;border-radius:4px;color:#059669;padding:2px 8px}.status-coming-soon{background:#fef3c7;border-radius:4px;color:#d97706;padding:2px 8px}.angle-info{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:12px 16px}.angle-description{color:#4b5563;font-size:.9rem;line-height:1.4;margin:0 0 12px}.key-techniques{display:flex;flex-direction:column;gap:8px}.key-techniques-label{color:#6b7280;font-size:.8rem;font-weight:500}.technique-tags{display:flex;flex-wrap:wrap;gap:6px}.technique-tag{background:#f3f4f6;border-radius:6px;color:#374151;font-size:.8rem;padding:4px 10px}.reference-placeholder{align-items:center;background:linear-gradient(135deg,#fefce8,#fef9c3);border:2px dashed #fbbf24;border-radius:12px;display:flex;flex-direction:column;justify-content:center;min-height:300px;padding:40px 24px;text-align:center}.placeholder-icon{font-size:3rem;margin-bottom:16px}.placeholder-title{color:#92400e;font-size:1.25rem;font-weight:600;margin-bottom:8px}.placeholder-description{color:#a16207;font-size:.95rem;line-height:1.5;margin-bottom:16px;max-width:300px}.placeholder-note{background:#fff9;border-radius:8px;color:#78716c;font-size:.85rem;line-height:1.4;max-width:280px;padding:12px}@media (max-width:768px){.angle-selector-grid{grid-template-columns:1fr 1fr}}@media (max-width:480px){.angle-selector-grid{grid-template-columns:1fr}.angle-option{padding:10px 12px}}.stroke-analysis{background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-radius:16px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;margin:20px 0;padding:24px}.stroke-analysis-header{margin-bottom:24px;text-align:center}.stroke-analysis-title{align-items:center;color:#1e293b;display:flex;font-size:1.5rem;font-weight:700;justify-content:center;margin-bottom:8px}.title-icon{font-size:1.75rem;margin-right:8px}.stroke-analysis-subtitle{color:#64748b;font-size:.875rem;margin:0}.stroke-analysis-error,.stroke-analysis-loading,.stroke-analysis-no-data{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:40px;text-align:center}.loading-spinner{animation:spin 1s linear infinite;border:3px solid #e2e8f0;border-radius:50%;border-top-color:#3b82f6;height:32px;margin-bottom:16px;width:32px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.error-icon,.no-data-icon{font-size:2rem;margin-bottom:16px}.dominant-stroke-card{background:#fff;border:2px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 4px #0000001a;margin-bottom:24px;padding:20px}.dominant-stroke-header{align-items:center;display:flex;margin-bottom:16px}.stroke-icon-large{font-size:3rem;margin-right:16px}.stroke-info{flex:1 1}.stroke-name{color:#1e293b;font-size:1.25rem;font-weight:700;margin:0 0 8px}.stroke-description{color:#64748b;font-size:.875rem;line-height:1.4;margin:0}.stroke-confidence{align-items:center;display:flex;gap:12px}.confidence-bar{background:#e2e8f0;border-radius:4px;flex:1 1;height:8px;overflow:hidden}.confidence-fill{border-radius:4px;height:100%;transition:width .3s ease}.confidence-text{color:#374151;font-size:.875rem;font-weight:600;min-width:80px;text-align:right}.stroke-distribution{background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;margin-bottom:24px;padding:20px}.distribution-title{color:#1e293b;font-size:1.125rem;font-weight:600;margin:0 0 16px}.distribution-grid{display:flex;flex-direction:column;gap:12px}.distribution-item{align-items:center;display:flex;gap:12px}.distribution-header{align-items:center;display:flex;gap:8px;min-width:120px}.distribution-icon{font-size:1.25rem}.distribution-name{color:#374151;font-size:.875rem;font-weight:500}.distribution-bar{background:#e2e8f0;border-radius:3px;flex:1 1;height:6px;overflow:hidden}.distribution-fill{border-radius:3px;height:100%;transition:width .3s ease}.distribution-stats{align-items:center;display:flex;gap:8px;justify-content:flex-end;min-width:100px}.percentage{color:#374151;font-size:.875rem;font-weight:600}.count{color:#64748b;font-size:.75rem}.stroke-features{background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;margin-bottom:24px;padding:20px}.features-title{color:#1e293b;font-size:1.125rem;font-weight:600;margin:0 0 16px}.features-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.feature-card{align-items:flex-start;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;display:flex;gap:12px;padding:16px}.feature-icon{flex-shrink:0;font-size:1.5rem}.feature-content h5{color:#1e293b;font-size:.875rem;font-weight:600;margin:0 0 4px}.feature-content p{color:#64748b;font-size:.75rem;line-height:1.4;margin:0}.analysis-summary{background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;margin-bottom:24px;padding:20px}.summary-title{color:#1e293b;font-size:1.125rem;font-weight:600;margin:0 0 16px}.summary-stats{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.summary-stat{align-items:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;display:flex;flex-direction:column;padding:16px}.stat-label{color:#64748b;font-size:.75rem;margin-bottom:4px;text-align:center}.stat-value{color:#1e293b;font-size:1.125rem;font-weight:700;text-align:center}.stroke-timeline{background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;padding:20px}.timeline-title{color:#1e293b;font-size:1.125rem;font-weight:600;margin:0 0 16px}.timeline-container{max-height:300px;overflow-y:auto;padding-right:8px}.timeline-item{align-items:center;border-bottom:1px solid #f1f5f9;display:flex;gap:12px;padding:8px 0}.timeline-item:last-child{border-bottom:none}.timeline-marker{align-items:center;border-radius:50%;box-shadow:0 2px 4px #0000001a;display:flex;flex-shrink:0;font-size:1rem;height:32px;justify-content:center;width:32px}.timeline-content{display:flex;flex:1 1;flex-direction:column;gap:2px}.timeline-stroke{color:#1e293b;font-size:.875rem;font-weight:600}.timeline-confidence{color:#64748b;font-size:.75rem}.timeline-time{color:#94a3b8;font-family:monospace;font-size:.75rem}.timeline-more{color:#64748b;font-size:.875rem;font-style:italic;padding:12px;text-align:center}@media (max-width:768px){.stroke-analysis{margin:16px 0;padding:16px}.dominant-stroke-header{flex-direction:column;text-align:center}.stroke-icon-large{margin-bottom:12px;margin-right:0}.features-grid,.summary-stats{grid-template-columns:1fr}.distribution-item{align-items:flex-start;flex-direction:column;gap:8px}.distribution-header{min-width:auto}.distribution-stats{justify-content:flex-start;min-width:auto}}.timeline-container::-webkit-scrollbar{width:6px}.timeline-container::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.timeline-container::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.timeline-container::-webkit-scrollbar-thumb:hover{background:#94a3b8}.App{min-height:100vh;padding:0}.App h1{color:#333;font-family:Inter,sans-serif;font-size:2.5rem;font-weight:700;margin-bottom:8px}.App h2{font-size:1.5rem;margin-bottom:16px}.App h2,.App h3{color:#333;font-family:Inter,sans-serif;font-weight:600}.App h3{font-size:1.25rem;margin-bottom:12px}.App h4{font-size:1.1rem}.App h4,.App h5{color:#333;font-family:Inter,sans-serif;font-weight:600;margin-bottom:8px}.App h5{font-size:1rem}.App p{line-height:1.6;margin-bottom:8px}.App p,.App pre{font-family:Inter,sans-serif}.App pre{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;font-size:14px;line-height:1.4;overflow-x:auto;padding:16px}.App header{margin-bottom:32px}.App header h1{margin-bottom:8px}.App header p{color:#fff;font-family:Inter,sans-serif;font-size:1.2rem;margin:0}.bg-gradient-to-r{background:linear-gradient(to right,var(--tw-gradient-stops))}.from-blue-600{--tw-gradient-from:#2563eb;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,#2563eb00)}.to-purple-600{--tw-gradient-to:#9333ea}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.text-transparent{color:#0000}.space-y-2>*+*{margin-top:.5rem}.space-y-3>*+*{margin-top:.75rem}.space-y-4>*+*{margin-top:1rem}.space-y-6>*+*{margin-top:1.5rem}.space-x-6>*+*{margin-left:1.5rem}.flex-wrap{flex-wrap:wrap}.gap-3{gap:.75rem}.gap-4{gap:1rem}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.from-green-50{--tw-gradient-from:#f0fdf4;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,#f0fdf400)}.to-blue-50{--tw-gradient-to:#eff6ff}.border-green-200{border-color:#bbf7d0}.bg-gray-50{background-color:#f9fafb}.bg-white{background-color:#fff}.rounded-xl{border-radius:.75rem}.rounded-lg{border-radius:.5rem}.rounded-2xl{border-radius:1rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-lg{font-size:1.125rem}.text-lg,.text-xl{line-height:1.75rem}.text-xl{font-size:1.25rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-medium{font-weight:500}.text-gray-500{color:#374151}.text-gray-600{color:#1f2937}.text-blue-600{color:#2563eb}.text-green-500{color:#10b981}.text-green-600{color:#059669}.text-purple-600{color:#9333ea}.text-blue-500{color:#3b82f6}.bg-blue-100{background-color:#dbeafe}.bg-purple-100{background-color:#f3e8ff}.bg-green-100{background-color:#dcfce7}.w-10{width:2.5rem}.h-10{height:2.5rem}.w-16{width:4rem}.h-16{height:4rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.overflow-x-auto{overflow-x:auto}.btn{align-items:center;background:linear-gradient(135deg,#10b981,#059669);border:none;border-radius:12px;box-shadow:0 4px 12px #10b9814d;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:8px;padding:12px 24px;text-decoration:none;transition:all .3s ease}.btn:hover{box-shadow:0 6px 20px #10b98166;transform:translateY(-2px)}.btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.btn-success{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 4px 12px #10b9814d}.btn-success:hover{box-shadow:0 6px 20px #10b98166}.btn-secondary{background:linear-gradient(135deg,#6b7280,#4b5563);box-shadow:0 4px 12px #6b72804d}.btn-secondary:hover{box-shadow:0 6px 20px #6b728066}.btn-primary{background:linear-gradient(135deg,#3b82f6,#1d4ed8);box-shadow:0 4px 12px #3b82f64d}.btn-primary:hover{box-shadow:0 6px 20px #3b82f666}.btn-ideal{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 4px 12px #f59e0b4d}.btn-ideal:hover{box-shadow:0 6px 20px #f59e0b66}@media (max-width:768px){.App{padding:0}.App h1{font-size:2rem}.App h2{font-size:1.25rem}.container{padding:10px}.card{padding:16px}.grid{grid-template-columns:1fr}.flex{align-items:stretch;flex-direction:column}.flex .btn{margin-bottom:8px}.space-x-6{flex-direction:column;gap:.5rem}.space-x-6>*+*{margin-left:0}.grid-cols-2{grid-template-columns:1fr}}.swim-type-selector{display:flex;gap:.75rem}.swim-type-btn{align-items:center;background:#ffffff0a;border:2px solid #ffffff26;border-radius:8px;color:#aaa;cursor:pointer;display:flex;flex:1 1;flex-direction:column;gap:.25rem;padding:.75rem .5rem;text-align:center;transition:border-color .15s,background .15s,color .15s}.swim-type-btn:hover{background:#63b3ed14;border-color:#63b3ed80;color:#e2e8f0}.swim-type-btn.active{background:#63b3ed26;border-color:#63b3ed;color:#fff}.swim-type-label{font-size:.95rem;font-weight:600}.swim-type-desc{font-size:.72rem;line-height:1.3;opacity:.7}@media (max-width:600px){.swim-type-selector{flex-direction:column}}
/*# sourceMappingURL=main.8b4aada8.css.map*/