:root{--primary: #10b981;--primary-dark: #059669;--primary-light: #d1fae5;--danger: #ef4444;--danger-light: #fee2e2;--warning: #f59e0b;--warning-light: #fef3c7;--bg-primary: #f8fafc;--bg-card: #ffffff;--text-primary: #1e293b;--text-secondary: #64748b;--text-muted: #94a3b8;--border: #e2e8f0;--shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--radius: 12px;--radius-sm: 8px;--safe-area-top: env(safe-area-inset-top, 0px);--safe-area-bottom: env(safe-area-inset-bottom, 0px);--safe-area-left: env(safe-area-inset-left, 0px);--safe-area-right: env(safe-area-inset-right, 0px)}*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;min-height:100dvh;overscroll-behavior-y:contain;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;min-height:100dvh}.app{max-width:1200px;margin:0 auto;padding:20px;padding-top:calc(20px + var(--safe-area-top));padding-bottom:calc(20px + var(--safe-area-bottom));padding-left:calc(20px + var(--safe-area-left));padding-right:calc(20px + var(--safe-area-right))}.header{text-align:center;margin-bottom:32px;position:relative}.header-top{position:absolute;right:0;top:0;display:flex;gap:8px}.header-link{display:flex;align-items:center;gap:6px;padding:8px 14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;font-size:.85rem;font-weight:600;color:var(--text-secondary);transition:all .2s;box-shadow:var(--shadow)}.header-link:hover{border-color:var(--primary);color:var(--primary)}.language-toggle{display:flex;align-items:center;gap:6px;padding:8px 14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;font-size:.85rem;font-weight:600;color:var(--text-secondary);transition:all .2s;box-shadow:var(--shadow)}.language-toggle:hover{border-color:var(--primary);color:var(--primary)}.header h1{font-size:2.5rem;font-weight:700;color:var(--text-primary);display:flex;align-items:center;justify-content:center;gap:12px}.header h1 .icon{color:var(--primary)}.header p{color:var(--text-secondary);margin-top:8px;font-size:1.1rem}.controls{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:24px;justify-content:center;align-items:center}.control-group{display:flex;align-items:center;gap:8px}.control-group label{font-weight:500;color:var(--text-secondary);font-size:.9rem}.select-wrapper{position:relative}.select-wrapper select{appearance:none;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 36px 10px 14px;font-size:.95rem;font-weight:500;color:var(--text-primary);cursor:pointer;transition:all .2s;box-shadow:var(--shadow)}.select-wrapper select:hover{border-color:var(--primary)}.select-wrapper select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.select-wrapper:after{content:"▼";position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:.7rem;color:var(--text-muted);pointer-events:none}.tabs{display:flex;background:var(--bg-card);border-radius:var(--radius-sm);padding:4px;box-shadow:var(--shadow)}.tab{padding:10px 20px;border:none;background:transparent;font-size:.95rem;font-weight:500;color:var(--text-secondary);cursor:pointer;border-radius:6px;transition:all .2s}.tab:hover{color:var(--text-primary)}.tab.active{background:var(--primary);color:#fff}.toggle-wrapper{display:flex;align-items:center;gap:10px;font-size:.9rem;color:var(--text-secondary)}.toggle{position:relative;width:48px;height:26px;background:var(--border);border-radius:13px;cursor:pointer;transition:background .2s}.toggle.active{background:var(--primary)}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .2s;box-shadow:var(--shadow)}.toggle.active:after{transform:translate(22px)}.refresh-btn{display:flex;align-items:center;gap:6px;padding:10px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:.95rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s;box-shadow:var(--shadow)}.refresh-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}.refresh-btn:disabled{opacity:.6;cursor:not-allowed}.refresh-btn.loading .refresh-icon{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.refresh-icon{display:inline-block;font-size:1rem}.refresh-text{display:inline}.main-grid{display:grid;grid-template-columns:1fr;gap:24px}@media(min-width:1024px){.main-grid{grid-template-columns:2fr 1fr}}.card{background:var(--bg-card);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}.card-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.card-header .icon{color:var(--primary)}.card-header h2{font-size:1.25rem;font-weight:600}.chart-container{width:100%;height:350px}.price-windows{display:grid;gap:12px;margin-top:20px}.price-window{display:flex;align-items:center;gap:12px;padding:16px;border-radius:var(--radius-sm);background:var(--bg-primary)}.price-window.cheapest{background:var(--primary-light);border:1px solid var(--primary)}.price-window.expensive{background:var(--danger-light);border:1px solid var(--danger)}.price-window .icon{flex-shrink:0}.price-window.cheapest .icon{color:var(--primary)}.price-window.expensive .icon{color:var(--danger)}.price-window-content{flex:1}.price-window-title{font-weight:600;font-size:.9rem;color:var(--text-primary)}.price-window-time{font-size:1.1rem;font-weight:700;color:var(--text-primary);margin-top:2px}.price-window-price{font-size:.85rem;color:var(--text-secondary);margin-top:2px}.sidebar{display:flex;flex-direction:column;gap:24px}.estimator-input{margin-bottom:20px}.estimator-input label{display:block;font-weight:500;color:var(--text-secondary);margin-bottom:8px;font-size:.9rem}.slider-container{display:flex;align-items:center;gap:16px}.slider{flex:1;-webkit-appearance:none;appearance:none;height:8px;background:var(--border);border-radius:4px;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;background:var(--primary);border-radius:50%;cursor:pointer;box-shadow:var(--shadow);transition:transform .2s}.slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.slider::-moz-range-thumb{width:24px;height:24px;background:var(--primary);border-radius:50%;cursor:pointer;border:none;box-shadow:var(--shadow)}.slider-value{font-weight:700;font-size:1.1rem;color:var(--text-primary);min-width:70px;text-align:right}.savings-result{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:var(--radius-sm);padding:20px;color:#fff;text-align:center}.savings-label{font-size:.9rem;opacity:.9;margin-bottom:4px}.savings-amount{font-size:2rem;font-weight:700}.savings-note{font-size:.8rem;opacity:.8;margin-top:8px}.badges-section{margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}.badges-title{font-size:.9rem;font-weight:500;color:var(--text-secondary);margin-bottom:12px}.badges{display:flex;flex-wrap:wrap;gap:8px}.badge{display:flex;align-items:center;gap:6px;padding:6px 12px;background:var(--warning-light);border-radius:20px;font-size:.8rem;font-weight:500;color:var(--warning)}.badge.earned{background:var(--primary-light);color:var(--primary-dark)}.actions{display:flex;flex-direction:column;gap:12px}.btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;border:none;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.btn-secondary{background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border)}.status-message{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:var(--radius-sm);font-size:.9rem}.status-message.info{background:#e0f2fe;color:#0369a1}.status-message.warning{background:var(--warning-light);color:#b45309}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--text-secondary)}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{to{transform:rotate(360deg)}}.error{text-align:center;padding:40px 20px}.error .icon{color:var(--danger);margin-bottom:16px}.error h3{color:var(--text-primary);margin-bottom:8px}.error p{color:var(--text-secondary);margin-bottom:16px}.footer{text-align:center;padding:32px 20px;margin-top:32px;color:var(--text-muted);font-size:.85rem}.footer a{color:var(--primary);text-decoration:none}.footer a:hover{text-decoration:underline}@media(max-width:768px){.app{padding:16px;padding-top:calc(16px + var(--safe-area-top));padding-bottom:calc(16px + var(--safe-area-bottom))}.header{margin-bottom:24px;padding-top:48px}.header-top{position:absolute;right:0;top:0;left:0;justify-content:space-between;padding:0 4px}.header h1{font-size:1.85rem;gap:8px}.header h1 .icon{width:28px;height:28px}.header p{font-size:1rem}.controls{gap:12px}.main-grid{gap:16px}.card{padding:16px;border-radius:var(--radius-sm)}.card h2{font-size:1.1rem}}@media(max-width:640px){.app{padding:12px;padding-top:calc(12px + var(--safe-area-top));padding-bottom:calc(12px + var(--safe-area-bottom))}.header{margin-bottom:20px;padding-top:44px}.header-top{gap:6px}.header-link,.language-toggle{padding:8px 12px;font-size:.8rem}.header h1{font-size:1.6rem;flex-wrap:wrap;gap:6px}.header h1 .icon{width:24px;height:24px}.header p{font-size:.9rem;line-height:1.5}.controls{flex-direction:column;gap:10px;align-items:stretch;position:relative;padding-top:54px}.control-group{justify-content:space-between;width:100%}.control-group label{font-size:.85rem}.select-wrapper{flex:1}.select-wrapper select{width:100%;padding:12px 36px 12px 14px;font-size:1rem}.tabs{width:100%}.tab{flex:1;padding:12px 16px;font-size:.9rem;text-align:center}.toggle-wrapper{justify-content:space-between;width:100%;padding:8px 4px}.refresh-btn{position:absolute;top:0;right:0;padding:10px;min-width:44px;min-height:44px;justify-content:center;z-index:10}.refresh-btn .refresh-text{display:none}.card{padding:14px}.card h2{font-size:1rem;gap:8px;margin-bottom:12px}.card h2 .icon{width:20px;height:20px}.chart-container{height:260px;margin:0 -6px}.chart-legend{flex-wrap:wrap;gap:8px;font-size:.75rem}.price-windows{gap:10px}.price-window{flex-direction:column;text-align:center;padding:14px;gap:10px}.window-icon{width:40px;height:40px;font-size:1.25rem;margin:0 auto}.window-info h3{font-size:.95rem;margin-bottom:4px}.window-info .time{font-size:.85rem}.window-price{font-size:1.1rem;padding:6px 12px}.savings-calculator{gap:14px}.presets{gap:8px;flex-wrap:wrap}.preset{padding:8px 14px;font-size:.85rem;flex:1;min-width:80px;justify-content:center}.input-group input{padding:12px 14px;font-size:1rem}.input-group span{padding:0 14px;font-size:.9rem}.savings-result{padding:14px;flex-direction:column;gap:12px;text-align:center}.savings-amount{font-size:1.75rem}.action-buttons{flex-direction:column;gap:10px}.action-btn{width:100%;padding:14px 16px;font-size:.95rem;justify-content:center}.badge{padding:3px 8px;font-size:.65rem}.notice{padding:14px}.notice h3{font-size:.95rem}.notice p{font-size:.85rem}.loading,.error{padding:40px 20px}.footer{padding:24px 16px;font-size:.8rem}}@media(max-width:380px){.app{padding:10px}.header h1{font-size:1.4rem}.header-link,.language-toggle{padding:6px 10px;font-size:.75rem}.header-link span,.language-toggle span{display:none}.tab{padding:10px 12px;font-size:.85rem}.preset{padding:6px 10px;font-size:.8rem}.chart-container{height:220px}}@media(max-height:500px)and (orientation:landscape){.app{padding:10px 20px}.header{margin-bottom:16px}.header h1{font-size:1.5rem}.controls{flex-direction:row;flex-wrap:wrap}.chart-container{height:200px}}@media(hover:none)and (pointer:coarse){.tab,.preset,.action-btn,.header-link,.language-toggle,.toggle{min-height:44px}.select-wrapper select{min-height:48px}}.custom-tooltip{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;box-shadow:var(--shadow-lg)}.custom-tooltip .time{font-weight:600;color:var(--text-primary);margin-bottom:4px}.custom-tooltip .price{color:var(--text-secondary)}.custom-tooltip .price span{font-weight:700;color:var(--primary)}.about-page{max-width:900px;margin:0 auto}.back-button{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;font-size:.9rem;font-weight:500;color:var(--text-secondary);transition:all .2s;box-shadow:var(--shadow);margin-bottom:24px}.back-button:hover{border-color:var(--primary);color:var(--primary)}.about-hero{text-align:center;padding:48px 24px;background:linear-gradient(135deg,var(--primary-light) 0%,#e0f2fe 100%);border-radius:var(--radius);margin-bottom:32px}.about-hero-icon{display:inline-flex;align-items:center;justify-content:center;width:80px;height:80px;background:var(--primary);color:#fff;border-radius:50%;margin-bottom:20px;box-shadow:var(--shadow-lg)}.about-hero h1{font-size:2.25rem;font-weight:700;color:var(--text-primary);margin-bottom:16px}.about-hero-subtitle{font-size:1.15rem;color:var(--text-secondary);max-width:700px;margin:0 auto;line-height:1.7}.about-section{background:var(--bg-card);border-radius:var(--radius);padding:32px;margin-bottom:24px;box-shadow:var(--shadow)}.about-section.highlight{background:linear-gradient(135deg,#f0fdf4,#ecfeff);border:1px solid var(--primary-light)}.about-section h2{display:flex;align-items:center;gap:12px;font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:20px}.about-section h2 .section-icon{color:var(--primary)}.about-lead{font-size:1.15rem;font-weight:500;color:var(--text-primary);margin-bottom:12px}.about-section p{color:var(--text-secondary);line-height:1.7}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;margin-top:24px}.feature-item{text-align:center;padding:20px}.feature-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;background:var(--bg-card);color:var(--primary);border-radius:12px;margin-bottom:16px;box-shadow:var(--shadow)}.feature-item h3{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:8px}.feature-item p{font-size:.95rem;color:var(--text-secondary)}.features-list{display:flex;flex-direction:column;gap:16px}.feature-card{display:flex;align-items:flex-start;gap:16px;padding:20px;background:var(--bg-primary);border-radius:var(--radius-sm);transition:transform .2s,box-shadow .2s}.feature-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.feature-card-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:12px;color:#fff}.feature-card-icon.green{background:linear-gradient(135deg,#10b981,#059669)}.feature-card-icon.blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}.feature-card-icon.purple{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.feature-card-icon.orange{background:linear-gradient(135deg,#f59e0b,#d97706)}.feature-card-content h3{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:6px}.feature-card-content p{font-size:.95rem;color:var(--text-secondary);line-height:1.6}.steps-list{display:flex;flex-direction:column;gap:20px}.step-item{display:flex;align-items:flex-start;gap:16px}.step-number{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--primary);color:#fff;font-size:1.1rem;font-weight:700;border-radius:50%}.step-content h3{font-size:1.05rem;font-weight:600;color:var(--text-primary);margin-bottom:4px}.step-content p{font-size:.95rem;color:var(--text-secondary)}.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:20px}.benefit-item{text-align:center;padding:20px;background:var(--bg-card);border-radius:var(--radius-sm);box-shadow:var(--shadow)}.benefit-emoji{font-size:2.5rem;display:block;margin-bottom:12px}.benefit-item h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:8px}.benefit-item p{font-size:.9rem;color:var(--text-secondary)}.use-cases-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.use-case-item{display:flex;align-items:flex-start;gap:14px;padding:16px;background:var(--bg-primary);border-radius:var(--radius-sm)}.use-case-icon{font-size:1.75rem;flex-shrink:0}.use-case-item h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:4px}.use-case-item p{font-size:.9rem;color:var(--text-secondary)}.privacy-info p{margin-bottom:16px}.privacy-info ul{list-style:none;padding:0}.privacy-info li{display:flex;align-items:center;gap:10px;padding:10px 0;color:var(--text-secondary);border-bottom:1px solid var(--border)}.privacy-info li:last-child{border-bottom:none}.privacy-info li:before{content:"✓";display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--primary-light);color:var(--primary);border-radius:50%;font-size:.8rem;font-weight:700}.about-cta{text-align:center;padding:48px 32px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:var(--radius);color:#fff;margin-bottom:24px}.about-cta h2{font-size:1.75rem;font-weight:700;margin-bottom:12px}.about-cta p{font-size:1.1rem;opacity:.9;margin-bottom:24px}.btn-large{padding:16px 32px;font-size:1.1rem}.about-cta .btn-primary{background:#fff;color:var(--primary-dark)}.about-cta .btn-primary:hover{background:var(--primary-light);transform:translateY(-2px)}@media(max-width:640px){.about-hero{padding:32px 16px}.about-hero h1{font-size:1.75rem}.about-hero-subtitle{font-size:1rem}.about-section{padding:20px}.about-section h2{font-size:1.25rem}.feature-card,.step-item{flex-direction:column;text-align:center}.step-number{margin:0 auto}.use-case-item{flex-direction:column;text-align:center}.about-cta{padding:32px 20px}.about-cta h2{font-size:1.5rem}}.cookie-consent-overlay{position:fixed;bottom:0;left:0;right:0;z-index:1000;padding:16px;padding-bottom:calc(16px + var(--safe-area-bottom));pointer-events:none}.cookie-consent-banner{max-width:600px;margin:0 auto;background:var(--bg-card);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-lg);border:2px solid var(--primary);pointer-events:auto;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.cookie-close{position:absolute;top:12px;right:12px;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.cookie-close:hover{background:var(--bg-primary);color:var(--text-primary)}.cookie-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.cookie-icon{color:var(--primary);flex-shrink:0}.cookie-header h3{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin:0}.cookie-text{color:var(--text-secondary);line-height:1.6;margin-bottom:20px;font-size:.95rem}.cookie-actions{display:flex;gap:12px;margin-bottom:12px}.cookie-actions .btn{flex:1;justify-content:center}.cookie-link{display:block;text-align:center;color:var(--primary);text-decoration:none;font-size:.9rem;font-weight:500}.cookie-link:hover{text-decoration:underline}@media(max-width:640px){.cookie-consent-banner{padding:40px 20px 20px}.cookie-header h3{font-size:1.1rem}.cookie-text{font-size:.9rem}.cookie-actions{flex-direction:column}}