.control-panel{position:fixed;right:1rem;top:50%;transform:translateY(-50%);background:#0a0a0ff2;border:1px solid rgba(0,212,255,.3);border-radius:16px;padding:1.5rem;min-width:260px;max-width:300px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;touch-action:manipulation}.control-panel h2{font-family:Orbitron,sans-serif;font-size:1rem;color:var(--accent-blue);margin-bottom:1.5rem;text-align:center}.control-group{margin-bottom:1.25rem}.control-group label{display:block;font-size:.75rem;color:var(--text-secondary);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.1em}.control-group input[type=range]{width:100%;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#00d4ff33;border-radius:3px;outline:none;cursor:pointer}.control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:var(--accent-blue);border-radius:50%;cursor:pointer;box-shadow:0 0 10px var(--glow-blue)}.control-group input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--accent-blue);border-radius:50%;cursor:pointer;border:none;box-shadow:0 0 10px var(--glow-blue)}.value-display{display:inline-block;float:right;font-family:Orbitron,sans-serif;font-size:.875rem;color:var(--accent-orange)}.type-selector{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.type-btn{padding:.5rem .75rem;background:#00d4ff1a;border:1px solid rgba(0,212,255,.2);border-radius:8px;color:var(--text-secondary);font-size:.75rem;cursor:pointer;transition:all .2s ease;touch-action:manipulation}.type-btn:hover{background:#00d4ff33;color:var(--text-primary)}.type-btn.active{background:#00d4ff4d;border-color:var(--accent-blue);color:var(--accent-blue);box-shadow:0 0 15px var(--glow-blue)}.param-hint{font-size:.6rem;color:var(--text-secondary);opacity:.6;margin-left:.5rem}.type-info{margin-top:1.5rem;padding-top:1rem;border-top:1px solid rgba(0,212,255,.2);display:flex;justify-content:space-between;align-items:center}.type-name{font-family:Orbitron,sans-serif;font-size:.875rem;font-weight:600}.type-range{font-size:.7rem;color:var(--text-secondary)}@media (max-width: 768px){.control-panel{position:fixed;right:0;left:0;bottom:0;top:auto;transform:none;border-radius:16px 16px 0 0;min-width:unset;max-height:45vh;overflow-y:auto}.type-selector{grid-template-columns:repeat(4,1fr)}.type-btn{padding:.5rem;font-size:.65rem}}.hero{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;overflow:hidden}.hero-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:600px;background:radial-gradient(circle,rgba(0,212,255,.1) 0%,transparent 70%);border-radius:50%;animation:pulse 4s ease-in-out infinite}@keyframes pulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.8}}.hero-title{font-family:Orbitron,sans-serif;font-size:clamp(2.5rem,10vw,6rem);font-weight:900;letter-spacing:.2em;background:linear-gradient(135deg,var(--text-primary) 0%,var(--accent-blue) 50%,var(--accent-orange) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 60px var(--glow-blue);margin-bottom:1rem;animation:titleGlow 3s ease-in-out infinite alternate;position:relative;z-index:1}@keyframes titleGlow{0%{filter:drop-shadow(0 0 20px var(--glow-blue))}to{filter:drop-shadow(0 0 40px var(--glow-orange))}}.hero-subtitle{font-size:clamp(1rem,3vw,1.5rem);color:var(--text-secondary);letter-spacing:.3em;margin-top:1rem}.scroll-indicator{position:absolute;bottom:2rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--text-secondary);font-size:.875rem}.scroll-arrow{width:24px;height:24px;border-right:2px solid var(--accent-blue);border-bottom:2px solid var(--accent-blue);transform:rotate(45deg);animation:bounce 2s infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:rotate(45deg) translateY(0)}40%{transform:rotate(45deg) translateY(6px)}60%{transform:rotate(45deg) translateY(3px)}}.info-section{min-height:100vh;padding:4rem 2rem;display:flex;flex-direction:column;align-items:center}.section-title{font-family:Orbitron,sans-serif;font-size:clamp(1.5rem,5vw,2.5rem);color:var(--accent-blue);margin-bottom:3rem;text-align:center}.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1200px;width:100%;margin-bottom:4rem}.info-card{--card-color: var(--accent-blue);background:#0a0a0fd9;border:1px solid rgba(0,212,255,.2);border-radius:12px;padding:1.5rem;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.info-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--card-color);opacity:.5;transition:opacity .3s ease}.info-card:hover{border-color:var(--card-color);box-shadow:0 0 30px #00d4ff33;transform:translateY(-4px)}.info-card:hover:before{opacity:1}.info-card.expanded{border-color:var(--card-color);box-shadow:0 0 40px #00d4ff4d;grid-column:span 1}.info-card.expanded:before{opacity:1;height:4px}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.info-card h3{font-family:Orbitron,sans-serif;font-size:1.1rem;color:var(--card-color);margin:0}.card-badge{font-size:.65rem;color:var(--text-secondary);background:#ffffff0d;padding:.25rem .5rem;border-radius:4px;text-transform:uppercase;letter-spacing:.05em}.mass-range{font-size:.8rem;color:var(--accent-blue);margin-bottom:.75rem;font-family:Orbitron,sans-serif}.description{color:var(--text-secondary);font-size:.85rem;line-height:1.6;margin:0}.card-expanded{margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.1);animation:expandIn .3s ease}@keyframes expandIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.detail-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.detail-label{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.1em}.detail-value{font-family:Orbitron,sans-serif;font-size:.9rem;color:var(--card-color)}.details{font-size:.8rem;color:var(--text-secondary);line-height:1.7;margin:0}.card-indicator{position:absolute;bottom:1rem;right:1rem;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.indicator-icon{font-size:1.25rem;color:var(--card-color);transition:transform .3s ease}.info-card.expanded .indicator-icon{transform:rotate(180deg)}.science-note{background:#00d4ff0d;border:1px solid rgba(0,212,255,.3);border-radius:12px;padding:2rem 3rem;text-align:center}.science-note h3{font-family:Orbitron,sans-serif;color:var(--accent-blue);margin-bottom:.5rem}.science-note p{font-size:2rem;color:var(--text-primary);font-family:Orbitron,sans-serif;margin-bottom:.5rem}.formula-note{color:var(--text-secondary);font-size:.875rem}.scroll-nav{position:fixed;right:1.5rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:1.25rem;z-index:1000}.scroll-dot{position:relative;width:14px;height:14px;background:transparent;border:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}.dot-inner{width:10px;height:10px;border-radius:50%;background:#e8e8e84d;transition:all .3s ease}.scroll-dot:hover .dot-inner{background:#e8e8e899;transform:scale(1.2)}.scroll-dot.active .dot-inner{background:var(--accent-blue);box-shadow:0 0 12px var(--glow-blue);transform:scale(1.3)}.dot-label{position:absolute;right:24px;background:#0a0a0ff2;border:1px solid rgba(0,212,255,.3);padding:.4rem .75rem;border-radius:6px;font-size:.7rem;color:var(--text-primary);white-space:nowrap;opacity:0;pointer-events:none;transform:translate(8px);transition:all .2s ease;font-family:"Exo 2",sans-serif}.scroll-dot:hover .dot-label{opacity:1;transform:translate(0)}@media (max-width: 768px){.scroll-nav{right:.75rem;gap:1rem}.dot-label{display:none}}.performance-stats{position:fixed;bottom:20px;right:20px;background:#000c;border:1px solid rgba(0,212,255,.5);border-radius:8px;padding:12px 16px;font-family:Courier New,monospace;font-size:12px;color:#00d4ff;z-index:1000;min-width:180px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.performance-stats.hidden{display:none}.performance-stats-title{font-weight:700;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid rgba(0,212,255,.3);display:flex;justify-content:space-between;align-items:center}.performance-stats-title span{color:#fff}.performance-stats-close{background:none;border:none;color:#00d4ff;cursor:pointer;font-size:14px;padding:0;line-height:1}.performance-stats-close:hover{color:#ff6b35}.performance-stats-row{display:flex;justify-content:space-between;margin:4px 0}.performance-stats-label{color:#aaa}.performance-stats-value{font-weight:700}.performance-stats-value.good{color:#0f8}.performance-stats-value.warning{color:#fa0}.performance-stats-value.bad{color:#f44}.performance-stats-quality{display:flex;gap:4px;margin-top:8px;padding-top:8px;border-top:1px solid rgba(0,212,255,.3)}.quality-indicator{width:24px;height:4px;background:#00d4ff33;border-radius:2px}.quality-indicator.active{background:#00d4ff}.quality-indicator.low{background:#ff6b35}.performance-stats-toggle{position:fixed;bottom:20px;right:20px;background:#000c;border:1px solid rgba(0,212,255,.5);border-radius:20px;width:40px;height:40px;color:#00d4ff;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;z-index:999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s}.performance-stats-toggle:hover{background:#00d4ff33;border-color:#00d4ff}.performance-stats-toggle.shown{display:none}:root{--bg-deep: #050508;--bg-dark: #0a0a0f;--accent-blue: #00d4ff;--accent-orange: #ff6b35;--accent-gold: #ffd700;--text-primary: #e8e8e8;--text-secondary: #8888aa;--glow-blue: rgba(0, 212, 255, .4);--glow-orange: rgba(255, 107, 53, .4)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:"Exo 2",sans-serif;background:var(--bg-deep);color:var(--text-primary);overflow-x:hidden;line-height:1.6;min-height:100vh;touch-action:manipulation}#root{min-height:100vh}canvas{display:block;touch-action:none}@media (max-width: 768px){html{font-size:14px}}
