:root{--bg-primary:#f0f4ff;--bg-secondary:#ffffff;--bg-tertiary:#e0e7ff;--text-primary:#1e3a8a;--text-secondary:#3b82f6;--border-color:#c7d2fe;--accent-primary:#6366f1;--accent-gradient:linear-gradient(135deg,#6366f1,#8b5cf6);--radius-md:12px}
[data-theme="dark"]{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-tertiary:#334155;--text-primary:#e0e7ff;--text-secondary:#a5b4fc;--border-color:#475569}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6}
.theme-toggle{position:fixed;bottom:20px;right:20px;width:50px;height:50px;border-radius:50%;border:none;background:var(--bg-secondary);box-shadow:0 4px 6px rgba(0,0,0,0.1);cursor:pointer;z-index:1000}
.sun-icon,.moon-icon{font-size:1.5rem;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transition:opacity .3s}
.moon-icon{opacity:0}[data-theme="dark"] .sun-icon{opacity:0}[data-theme="dark"] .moon-icon{opacity:1}
.container{max-width:700px;margin:0 auto;padding:40px 20px}
header{text-align:center;margin-bottom:40px}
h1{font-size:2.5rem;font-weight:800;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.subtitle{color:var(--text-secondary);margin-top:10px}
.calculator-card{background:var(--bg-secondary);border-radius:16px;padding:30px;box-shadow:0 4px 6px rgba(0,0,0,0.1)}
.tabs{display:flex;gap:10px;margin-bottom:25px}
.tab{flex:1;padding:12px;border:2px solid var(--border-color);border-radius:var(--radius-md);background:transparent;color:var(--text-primary);cursor:pointer;font-weight:600}
.tab.active{background:var(--accent-gradient);color:white;border-color:transparent}
.tab-content{text-align:center}
.tab-content.hidden{display:none}
.tab-content p{margin-bottom:15px}
.tab-content input[type="time"]{width:100%;max-width:200px;padding:15px;font-size:1.5rem;border:2px solid var(--border-color);border-radius:var(--radius-md);text-align:center;background:var(--bg-primary);color:var(--text-primary);margin-bottom:20px}
.btn{width:100%;padding:15px;border:none;border-radius:var(--radius-md);font-size:1rem;font-weight:600;cursor:pointer}
.btn-primary{background:var(--accent-gradient);color:white}
.results{margin-top:30px;text-align:center}
.results h3{margin-bottom:20px}
.times-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:15px;margin-bottom:20px}
.time-card{padding:20px;border-radius:var(--radius-md);background:var(--bg-tertiary);text-align:center}
.time-card.optimal{background:linear-gradient(135deg,#10b981,#34d399);color:white}
.time{display:block;font-size:1.5rem;font-weight:800}
.cycles,.hours{display:block;font-size:0.85rem;opacity:0.8}
.tip{color:var(--text-secondary);font-size:0.9rem}
.info-section{background:var(--bg-secondary);padding:30px;border-radius:16px;margin:40px 0}
.info-section h2{margin-bottom:15px}
.info-section p{color:var(--text-secondary);margin-bottom:10px}
.trust-badges{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:40px 0}
.badge{text-align:center;padding:20px;background:var(--bg-secondary);border-radius:var(--radius-md)}
.badge-icon{font-size:2rem;display:block;margin-bottom:8px}
.badge-text{font-weight:700}
.faq-section{margin:40px 0}
.faq-section h2{text-align:center;margin-bottom:25px}
.faq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.faq-item{background:var(--bg-secondary);padding:25px;border-radius:var(--radius-md)}
.faq-item h3{font-size:1rem;margin-bottom:10px}
.faq-item p{color:var(--text-secondary);font-size:0.9rem}
footer{text-align:center;padding:30px;color:var(--text-secondary)}
footer a{color:var(--accent-primary)}