:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#150a10;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.app{max-width:900px;margin:0 auto;padding:2rem;position:relative;overflow:hidden}.floating-hearts{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:hidden}.heart{position:absolute;bottom:-20px;font-size:1.5rem;opacity:.15;animation:floatUp linear infinite}.heart:before{content:"♥";color:#ff6b9d}@keyframes floatUp{0%{transform:translateY(0) rotate(0);opacity:0}10%{opacity:.15}90%{opacity:.15}to{transform:translateY(-100vh) rotate(360deg);opacity:0}}h1{font-size:2.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,#ff6b9d,#c44569);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}h2{font-size:1.5rem;margin-top:2rem;margin-bottom:1rem;color:#ffb6c1;border-bottom:1px solid rgba(255,107,157,.3);padding-bottom:.5rem}h3{font-size:1.1rem;margin-bottom:.5rem;color:#aaa}.subtitle{color:#666;font-style:italic;margin-bottom:2rem}.timer-section{background:linear-gradient(135deg,#2d1f2f,#1f1a2e);border-radius:16px;padding:2rem;margin-bottom:2rem;box-shadow:0 4px 20px #ff6b9d26;transition:all .5s ease;border:1px solid rgba(255,107,157,.2)}.timer-section.completed{background:linear-gradient(135deg,#2d1f2a,#3e1630);box-shadow:0 4px 30px #ff6b9d66;border:2px solid #ff6b9d}.completion-banner{background:linear-gradient(135deg,#ff6b9d,#c44569);color:#fff;padding:1rem;border-radius:8px;margin-bottom:1rem;font-size:1.2rem;font-weight:700;text-align:center;animation:celebratePulse 1s ease-in-out infinite}@keyframes celebratePulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.duration-display{display:flex;flex-direction:column;align-items:center;gap:.75rem;margin-bottom:1.5rem}.duration-item{display:flex;flex-direction:column;align-items:center;background:#0000004d;padding:1rem 1.5rem;border-radius:12px}.duration-item.years{padding:1rem 2rem}.duration-item.years .duration-value{font-size:2.2rem;color:#ff6b9d}.duration-row{display:flex;gap:.5rem}.duration-item.small{padding:.5rem .75rem;min-width:50px}.duration-item.small .duration-value{font-size:1.2rem}.duration-value{font-size:1.8rem;font-weight:700;color:#ffb6c1;font-family:Courier New,monospace}.duration-label{font-size:.7rem;color:#666;text-transform:uppercase;margin-top:.25rem}.seconds-count{font-size:1rem;color:#888;margin-top:.5rem}.highlight{color:#ff6b9d;font-weight:700}.comparison-section{background:linear-gradient(135deg,#2a1a2a,#2d1f2d);border-radius:16px;padding:2rem;margin-bottom:2rem;border:1px solid rgba(255,107,157,.15)}.factorial-display{font-size:1.1rem;margin-bottom:.5rem;word-break:break-all}.comparison-text,.year-comparison{color:#888;margin-top:.5rem}.visualization-section{margin-bottom:2rem}.description{color:#aaa;line-height:1.8;font-size:1.1rem;margin-bottom:2rem;background:#ff6b9d0d;padding:1.5rem;border-radius:12px;border-left:4px solid #ff6b9d}.progress-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.progress-item{background:linear-gradient(135deg,#2a1f2a,#2d252d);border-radius:12px;padding:1.5rem;box-shadow:0 2px 10px #ff6b9d1a;border:1px solid rgba(255,107,157,.1)}.stat{font-size:.95rem;color:#ffb6c1;font-family:Courier New,monospace;margin:.5rem 0}.note{font-size:.8rem;color:#666;margin:.2rem 0}.note:last-of-type{margin-bottom:1rem}.progress-container{margin-top:1rem}.progress-label{font-size:.85rem;color:#888;margin-bottom:.5rem}.progress-bar-bg{height:12px;background:#333;border-radius:6px;overflow:hidden}.progress-bar-fill{height:100%;border-radius:6px;transition:width .3s ease}.progress-text{font-size:.75rem;color:#666;margin-top:.3rem;font-family:Courier New,monospace}.final-progress{background:linear-gradient(135deg,#1a0f1a,#2d1a2a);border-radius:16px;padding:2rem;margin-bottom:2rem;border:1px solid rgba(255,107,157,.2)}.mega-progress{margin:1.5rem 0}.final-note{color:#888;font-size:1rem;line-height:1.6}.fun-facts{background:#ff6b9d0d;border-radius:12px;padding:1.5rem 2rem;border:1px solid rgba(255,107,157,.15);margin-bottom:1.5rem}.fun-facts ul{list-style:none;padding:0}.fun-facts li{color:#aaa;border-bottom:1px solid rgba(255,107,157,.1);position:relative;padding:.75rem 0 .75rem 1.5rem}.fun-facts li:last-child{border-bottom:none}.fun-facts li:before{content:"♥";position:absolute;left:0;color:#ff6b9d}.animation-container{width:100%;height:140px;display:flex;justify-content:center;align-items:center;margin-bottom:1rem;background:#0003;border-radius:8px;overflow:hidden;transition:all .3s ease;border:2px solid transparent}.animation-container.idle{opacity:.5;filter:grayscale(80%)}.animation-container.active{opacity:1;filter:grayscale(0%);border-color:#ff6b9d66;box-shadow:0 0 20px #ff6b9d33}.animation-container.event-trigger{animation:eventPulse .5s ease-out}@keyframes eventPulse{0%{transform:scale(1);box-shadow:0 0 20px #ff6b9d33}50%{transform:scale(1.05);box-shadow:0 0 40px #ff6b9d99;border-color:#ff6b9d}to{transform:scale(1);box-shadow:0 0 20px #ff6b9d33}}.animation-svg{width:140px;height:140px}.speed-control{margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.1)}.speed-control h3{margin-bottom:1rem;color:#888}.slider-container{margin-bottom:1rem}.speed-slider{width:100%;height:8px;border-radius:4px;background:linear-gradient(90deg,#333,#ff6b9d,#c44569);outline:none;-webkit-appearance:none;cursor:pointer}.speed-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 2px 6px #0000004d;transition:transform .2s}.speed-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.speed-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;cursor:pointer;border:none;box-shadow:0 2px 6px #0000004d}.multiplier-display{font-size:1.3rem;color:#ffb6c1;font-weight:700;margin-top:.5rem;font-family:Courier New,monospace}.multiplier-value{font-size:.9rem;color:#666;margin-top:.25rem}.preset-buttons{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;margin-bottom:1rem}.preset-btn{padding:.4rem .8rem;font-size:.75rem;background:#ff6b9d0d;border:1px solid rgba(255,107,157,.3);border-radius:20px;color:#888;cursor:pointer;transition:all .2s}.preset-btn:hover{background:#ff6b9d33;border-color:#ff6b9d;color:#fff}.preset-btn.active{background:#ff6b9d4d;border-color:#ff6b9d;color:#ffb6c1}.reset-btn{padding:.5rem 1rem;font-size:.85rem;background:#ff6b9d1a;border:1px solid #ff6b9d;border-radius:8px;color:#ff6b9d;cursor:pointer;transition:all .2s}.reset-btn:hover{background:#ff6b9d33}.valentine-letter{background:linear-gradient(135deg,#2d1a2a,#3e1630);border-radius:16px;padding:2.5rem;margin-top:2rem;border:1px solid rgba(255,107,157,.3);box-shadow:0 4px 20px #ff6b9d26;text-align:center}.valentine-letter p{color:#ccc;line-height:1.8;font-size:1.05rem;margin-bottom:1.2rem;font-style:italic}.valentine-signature{color:#ff6b9d;font-weight:700;font-size:1.15rem;margin-top:1.5rem}.love-footer{text-align:center;font-size:1.5rem;font-weight:700;color:#ff6b9d;margin-top:2rem;padding:1rem 0}@media(max-width:600px){.app{padding:1rem}h1{font-size:1.8rem}.duration-item.years .duration-value{font-size:1.5rem}.duration-item.small{padding:.4rem .5rem;min-width:45px}.duration-item.small .duration-value{font-size:1rem}.progress-grid{grid-template-columns:1fr}.preset-buttons{justify-content:center}.preset-btn{font-size:.65rem;padding:.3rem .6rem}.animation-container{height:120px}.animation-svg{width:120px;height:120px}}
