.nav{z-index:100;background:var(--bg-glass);-webkit-backdrop-filter:blur(20px)saturate(1.8);border-bottom:1px solid var(--border-glass);height:64px;position:fixed;top:0;left:0;right:0}.nav-inner{max-width:1200px;padding:0 var(--space-lg);align-items:center;gap:var(--space-lg);height:100%;margin:0 auto;display:flex}.nav-logo{align-items:center;gap:var(--space-xs);color:var(--text-primary);margin-right:auto;font-size:15px;font-weight:600;text-decoration:none;display:flex}.nav-links{gap:var(--space-xxs);display:flex}.nav-link-r{border-radius:var(--radius-full);color:var(--text-secondary);padding:4px 10px;font-size:13px;font-weight:500;text-decoration:none;transition:all .2s}.nav-link-r:hover,.nav-link-r.active{background:var(--hairline);color:var(--text-primary);text-decoration:none}.theme-toggle{border:1px solid var(--border-glass);border-radius:var(--radius-md);cursor:pointer;width:36px;height:36px;color:var(--text-secondary);background:0 0;justify-content:center;align-items:center;transition:all .2s;display:flex}.theme-toggle:hover{background:var(--bg-card-hover)}html.light .moon-icon,html.dark .sun-icon{display:none}.main{padding-top:64px}.hero{padding:var(--space-4xl) var(--space-lg) var(--space-3xl);text-align:center;position:relative;overflow:hidden}.hero-bg{z-index:0;background:radial-gradient(at 30%,#7928ca14 0%,#0000 60%),radial-gradient(at 70%,#0070f314 0%,#0000 60%);position:absolute;inset:0}.hero-stars{z-index:0;position:absolute;inset:0;overflow:hidden}.star{background:var(--text-secondary);opacity:.3;border-radius:50%;width:4px;height:4px;animation:8s ease-in-out infinite starFloat;position:absolute}.s1{width:3px;height:3px;animation-duration:7s;top:15%;left:10%}.s2{width:5px;height:5px;animation-duration:9s;animation-delay:-2s;top:25%;left:85%}.s3{width:3px;height:3px;animation-duration:11s;animation-delay:-4s;top:55%;left:20%}.s4{width:4px;height:4px;animation-duration:8s;animation-delay:-1s;top:60%;left:75%}.s5{width:3px;height:3px;animation-duration:10s;animation-delay:-6s;top:75%;left:50%}.s6{opacity:.15;width:6px;height:6px;animation-duration:12s;animation-delay:-3s;top:35%;left:45%}@keyframes starFloat{0%,to{opacity:.3;transform:translateY(0)scale(1)}50%{opacity:.6;transform:translateY(-15px)scale(1.3)}}.hero-content{z-index:1;max-width:700px;margin:0 auto;position:relative}.hero-badge{border-radius:var(--radius-full);color:var(--violet);margin-bottom:var(--space-md);letter-spacing:.2px;background:#7928ca1a;padding:4px 14px;font-size:12px;font-weight:500;display:inline-flex}.hero-title{letter-spacing:-1.8px;margin:0 0 var(--space-md);color:var(--text-primary);font-size:42px;font-weight:600;line-height:1.1}.hero-subtitle{color:var(--text-secondary);max-width:560px;margin:0 auto;font-size:16px;line-height:1.7}.calculator-section{padding:0 var(--space-lg) var(--space-4xl)}.calculator-grid{gap:var(--space-lg);grid-template-columns:380px 1fr;align-items:start;max-width:1200px;margin:0 auto;display:grid}@media (width<=900px){.calculator-grid{grid-template-columns:1fr}}.inputs-panel{position:sticky;top:80px}.inputs-card{padding:var(--space-xl)}.section-title{letter-spacing:-.4px;margin:0 0 var(--space-lg);color:var(--text-primary);font-size:18px;font-weight:600}.section-subtitle-sm{color:var(--text-mute);margin:-16px 0 var(--space-lg);font-size:13px}.input-row{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}@media (width<=500px){.input-row{grid-template-columns:1fr}}.input-group{margin-bottom:var(--space-md)}.input-group label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:500;display:block}.input-with-slider{align-items:center;gap:var(--space-xs);flex-wrap:wrap;display:flex}.input-num{border:1px solid var(--border-glass);border-radius:var(--radius-sm);background:var(--bg-card);width:70px;height:36px;color:var(--text-primary);text-align:center;outline:none;padding:0 8px;font-size:14px;font-weight:500;transition:border-color .2s}.input-num:focus{border-color:var(--link)}.input-unit{color:var(--text-mute);min-width:28px;font-size:12px;font-weight:500}.slider{appearance:none;background:var(--hairline);cursor:pointer;border-radius:2px;outline:none;flex:1;min-width:120px;height:4px}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--link);cursor:pointer;border:2px solid var(--canvas);border-radius:50%;width:16px;height:16px;transition:transform .15s;box-shadow:0 1px 3px #00000026}.slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.btn-group{flex-wrap:wrap;gap:6px;display:flex}.btn-group button{border:1px solid var(--border-glass);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;flex:1;justify-content:center;align-items:center;gap:6px;padding:8px 12px;font-size:13px;font-weight:500;transition:all .2s;display:flex}.btn-group button:hover{background:var(--bg-card-hover)}.btn-group button.active{background:var(--link);color:#fff;border-color:var(--link)}.time-input-row{align-items:center;gap:var(--space-sm);display:flex}.time-input-row .btn-group{flex:1}.select-input{border:1px solid var(--border-glass);border-radius:var(--radius-sm);background:var(--bg-card);width:100%;height:40px;color:var(--text-primary);cursor:pointer;outline:none;padding:0 10px;font-size:13px;transition:border-color .2s}.select-input:focus{border-color:var(--link)}.cycles-control{align-items:center;gap:var(--space-xs);display:flex}.cycle-adjust-btn{border:1px solid var(--border-glass);border-radius:var(--radius-sm);background:var(--bg-card);width:36px;height:36px;color:var(--text-primary);cursor:pointer;justify-content:center;align-items:center;font-size:18px;font-weight:600;transition:all .2s;display:flex}.cycle-adjust-btn:hover{background:var(--bg-card-hover);border-color:var(--link)}.cycle-hint{color:var(--text-mute);margin-left:4px;font-size:11px}.results-panel{gap:var(--space-lg);flex-direction:column;display:flex}.result-card{padding:var(--space-xl)}.result-grid{text-align:center;margin-bottom:var(--space-lg)}.primary-result{padding:var(--space-lg);border-radius:var(--radius-lg);border:1px solid var(--border-glass);background:linear-gradient(135deg,#7928ca0d,#0070f30d)}.primary-label{color:var(--text-mute);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;font-size:12px}.primary-time{letter-spacing:-1.5px;color:var(--violet);font-size:42px;font-weight:700}.sleep-metrics-grid{gap:var(--space-md);margin-top:var(--space-lg);grid-template-columns:repeat(2,1fr);display:grid}.metric-card{padding:var(--space-md);border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-glass);text-align:center}.metric-value{color:var(--text-primary);font-size:16px;font-weight:600}.metric-label{color:var(--text-mute);text-transform:uppercase;letter-spacing:.3px;margin-top:4px;font-size:11px}.freshness-gauge-container{gap:var(--space-xl);margin:var(--space-lg) 0;align-items:center;display:flex}@media (width<=768px){.freshness-gauge-container{flex-direction:column}}.freshness-gauge{flex-shrink:0;width:200px;height:200px;position:relative}.gauge-svg{width:100%;height:100%}.gauge-bg{stroke:var(--hairline)}.gauge-circle{transition:stroke-dashoffset .8s cubic-bezier(.34,1.56,.64,1),stroke .4s}.gauge-center{text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.gauge-value{letter-spacing:-1px;font-size:36px;font-weight:700}.gauge-label{margin-top:2px;font-size:13px;font-weight:600;transition:color .3s}.gauge-sub{color:var(--text-mute);text-transform:uppercase;letter-spacing:.3px;margin-top:4px;font-size:10px}.quality-meter{padding:var(--space-lg);background:var(--bg-glass);border:1px solid var(--border-glass);border-radius:var(--radius-lg);flex:1}.quality-header{margin-bottom:var(--space-sm);justify-content:space-between;align-items:center;display:flex}.quality-label{margin:0;font-size:16px;font-weight:600}.quality-score{color:var(--text-mute);font-size:14px;font-weight:500}.quality-bar-track{background:var(--hairline);border-radius:4px;height:8px;overflow:hidden}.quality-bar-fill{border-radius:4px;height:100%;transition:width .6s}.quality-desc{color:var(--text-mute);text-transform:uppercase;letter-spacing:.3px;margin-top:6px;font-size:11px}.sleep-summary{margin-top:var(--space-md);padding:var(--space-md);background:var(--bg-glass);border:1px solid var(--border-glass);border-radius:var(--radius-md)}.sleep-summary p{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.7}.sleep-summary strong{color:var(--text-primary)}.cycle-options-grid{gap:var(--space-sm);grid-template-columns:repeat(4,1fr);display:grid}@media (width<=768px){.cycle-options-grid{grid-template-columns:repeat(2,1fr)}}.cycle-option{padding:var(--space-md);border:1px solid var(--border-glass);border-radius:var(--radius-md);background:var(--bg-card);cursor:pointer;flex-direction:column;align-items:center;gap:2px;font-family:inherit;transition:all .2s;display:flex}.cycle-option:hover{box-shadow:var(--shadow-level-3);transform:translateY(-2px)}.cycle-option.active{border-color:var(--violet);background:#7928ca14}.cycle-option-cycles{color:var(--text-primary);font-size:14px;font-weight:600}.cycle-option-time{color:var(--violet);font-size:12px;font-weight:500}.cycle-option-duration{color:var(--text-mute);font-size:10px}.cycle-timeline{gap:var(--space-sm);flex-direction:column;max-height:400px;padding-right:4px;display:flex;overflow-y:auto}.cycle-timeline::-webkit-scrollbar{width:4px}.cycle-timeline::-webkit-scrollbar-track{background:var(--hairline);border-radius:2px}.cycle-timeline::-webkit-scrollbar-thumb{background:var(--text-mute);border-radius:2px}.timeline-cycle{opacity:0;animation:.4s forwards fadeInUp}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.cycle-header{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-xs);display:flex}.cycle-number{border-radius:var(--radius-full);letter-spacing:.2px;padding:2px 10px;font-size:11px;font-weight:600}.cycle-time{color:var(--text-mute);font-size:12px}.cycle-stages{border-radius:var(--radius-md);gap:2px;min-height:32px;display:flex;overflow:hidden}.stage-bar{opacity:0;transform-origin:0;justify-content:center;align-items:center;min-width:8px;padding:4px 2px;transition:all .3s;animation:.5s forwards stageGrow;display:flex;position:relative}@keyframes stageGrow{0%{opacity:0;flex:0}to{opacity:.85}}.stage-bar:hover{opacity:1!important;flex:2!important}.stage-bar:hover .stage-label{opacity:1}.stage-label{color:#fff;white-space:nowrap;opacity:0;text-shadow:0 1px 2px #0000004d;font-size:8px;font-weight:500;transition:opacity .2s}.stage-legend{gap:var(--space-md);margin-top:var(--space-sm);flex-wrap:wrap;display:flex}.legend-item{color:var(--text-mute);align-items:center;gap:6px;font-size:11px;display:flex}.legend-dot{border-radius:50%;width:8px;height:8px}.analysis-grid{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}.analysis-item{padding:var(--space-md);border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-glass)}.analysis-item.full-width{grid-column:1/-1}.analysis-label{color:var(--text-mute);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px;font-size:11px}.analysis-value{color:var(--text-primary);font-size:18px;font-weight:600}.analysis-bar-value{letter-spacing:-.5px;font-size:28px;font-weight:700}.analysis-bar-track{background:var(--hairline);border-radius:3px;height:6px;margin-top:8px;overflow:hidden}.analysis-bar-fill{border-radius:3px;height:100%;transition:width .6s}.insights-section,.scenarios-section{padding:0}.section-band{padding:var(--space-4xl) var(--space-lg)}.section-band.light{background:var(--bg-glass)}.band-content{max-width:1200px;margin:0 auto}.section-heading{letter-spacing:-1px;margin:var(--space-sm) 0;color:var(--text-primary);font-size:28px;font-weight:600}.section-subtitle{color:var(--text-secondary);margin:0 0 var(--space-xl);max-width:600px;font-size:15px;line-height:1.7}.insights-grid{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}@media (width<=700px){.insights-grid{grid-template-columns:1fr}}.insight-card{gap:var(--space-md);padding:var(--space-lg);opacity:0;animation:.4s forwards fadeInUp;display:flex}.insight-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.insight-icon svg{width:20px;height:20px}.insight-info{color:var(--link);background:#0070f31a}.insight-trending{color:var(--violet);background:#7928ca1a}.insight-heart{color:var(--highlight-pink);background:#ff00801a}.insight-lightbulb{color:var(--warning);background:#f5a62326}.insight-activity{color:var(--cyan);background:#50e3c226}.insight-content h4{color:var(--text-primary);margin:0 0 4px;font-size:14px;font-weight:600}.insight-content p{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.7}.scenarios-grid{gap:var(--space-md);grid-template-columns:repeat(4,1fr);display:grid}@media (width<=900px){.scenarios-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=500px){.scenarios-grid{grid-template-columns:1fr}}.scenario-btn{cursor:pointer;text-align:left;align-items:center;gap:var(--space-md);padding:var(--space-lg);border:1px solid var(--border-glass);opacity:0;width:100%;font-family:inherit;transition:all .2s;animation:.4s forwards fadeInUp;display:flex}.scenario-btn:hover{box-shadow:var(--shadow-level-4);transform:translateY(-2px)}.scenario-btn.active{border-color:var(--violet)}.scenario-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;font-size:20px;display:flex}.scenario-info{flex:1;min-width:0}.scenario-label{color:var(--text-primary);font-size:14px;font-weight:600}.scenario-detail{color:var(--text-mute);margin-top:2px;font-size:11px}.scenario-impact{margin-top:2px;font-size:12px;font-weight:500}.scenario-arrow{color:var(--text-mute);font-size:18px}.scenario-results{margin-top:var(--space-xl);padding:var(--space-xl);display:none}.scenario-results.visible{display:block}.results-title{margin:0 0 var(--space-sm);color:var(--text-primary);font-size:18px;font-weight:600}.scenario-desc{color:var(--text-secondary);margin:0 0 var(--space-lg);font-size:14px}.scenario-comparison{gap:var(--space-xl);align-items:center;display:flex}@media (width<=768px){.scenario-comparison{flex-direction:column}}.scenario-ring{flex-shrink:0;width:150px;height:150px;position:relative}.s-ring-svg{width:100%;height:100%}.s-ring-circle{transition:stroke-dashoffset .6s cubic-bezier(.34,1.56,.64,1)}.s-ring-center{text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.s-ring-value{letter-spacing:-.5px;color:var(--text-primary);font-size:22px;font-weight:700}.s-ring-diff{font-size:14px;font-weight:600}.s-ring-label{color:var(--text-mute);text-transform:uppercase;letter-spacing:.2px;margin-top:2px;font-size:10px}.scenario-metrics{gap:var(--space-md);flex:1;grid-template-columns:repeat(2,1fr);display:grid}.scenario-metric{text-align:center;padding:var(--space-md);background:var(--bg-glass);border-radius:var(--radius-md)}.scenario-metric .metric-label{color:var(--text-mute);text-transform:uppercase;letter-spacing:.3px;font-size:11px}.scenario-metric .metric-value{color:var(--text-primary);margin-top:4px;font-size:20px;font-weight:700}.edu-grid{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}@media (width<=700px){.edu-grid{grid-template-columns:1fr}}.edu-card{padding:var(--space-xl)}.edu-icon{border-radius:var(--radius-md);width:36px;height:36px;color:var(--violet);margin-bottom:var(--space-sm);background:linear-gradient(135deg,#7928ca1a,#0070f31a);justify-content:center;align-items:center;display:flex}.edu-card h3{margin:0 0 var(--space-sm);color:var(--text-primary);font-size:16px;font-weight:600}.edu-card p{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.7}.edu-card ul{padding:0 0 0 var(--space-lg);color:var(--text-secondary);margin:0;font-size:13px;line-height:1.8}.edu-card li strong{color:var(--text-primary)}.edu-card li em{color:var(--text-mute)}.faq-card{grid-column:1/-1}.faq-list{margin-top:var(--space-sm)}.faq-item{border-top:1px solid var(--border-glass);padding:4px 0}.faq-item details{font-size:14px}.faq-item summary{color:var(--text-primary);cursor:pointer;align-items:center;gap:var(--space-xs);padding:8px 0;font-weight:600;list-style:none;display:flex}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:before{content:"+";color:var(--violet);margin-right:4px;font-size:16px;font-weight:400;transition:transform .2s}.faq-item details[open] summary:before{content:"−"}.faq-item details p{color:var(--text-secondary);margin:0 0 var(--space-sm) 0;padding-left:20px;font-size:13px;line-height:1.7}.related-grid{gap:var(--space-md);grid-template-columns:repeat(4,1fr);display:grid}@media (width<=800px){.related-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=500px){.related-grid{grid-template-columns:1fr}}.related-card{padding:var(--space-lg);color:inherit;gap:var(--space-xs);flex-direction:column;text-decoration:none;transition:transform .2s,box-shadow .2s;display:flex}.related-card:hover{box-shadow:var(--shadow-level-4);text-decoration:none;transform:translateY(-2px)}.related-icon{border-radius:var(--radius-md);width:40px;height:40px;color:var(--violet);background:linear-gradient(135deg,#7928ca1a,#0070f31a);justify-content:center;align-items:center;display:flex}.related-card h3{color:var(--text-primary);margin:0;font-size:14px;font-weight:600}.related-card p{color:var(--text-mute);margin:0;font-size:12px;line-height:1.4}.disclaimer-section .section-band{padding-bottom:var(--space-2xl)}.disclaimer-content{text-align:center;max-width:700px}.disclaimer-icon{width:48px;height:48px;margin:0 auto var(--space-md);color:var(--warning);background:#f5a6231a;border-radius:50%;justify-content:center;align-items:center;display:flex}.disclaimer-content h3{margin:0 0 var(--space-md);color:var(--text-primary);font-size:18px;font-weight:600}.disclaimer-content p{color:var(--text-secondary);margin:0 0 var(--space-sm);font-size:13px;line-height:1.7}.disclaimer-footer{color:var(--text-mute);font-size:12px;font-style:italic}.footer{border-top:1px solid var(--border-glass)}.footer-inner{max-width:1200px;padding:var(--space-lg);text-align:center;color:var(--text-mute);margin:0 auto;font-size:13px}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px)saturate(1.4);border:1px solid var(--border-glass);border-radius:var(--radius-lg);box-shadow:var(--shadow-glass);transition:all .2s}.glass-card:hover{background:var(--bg-card-hover);box-shadow:var(--shadow-level-3)}
