body{margin:0;padding:0;user-select:none}.canvas-bg{background-image:radial-gradient(circle at 2px 2px,rgba(255,255,255,.1) 1px,transparent 0);background-size:40px 40px}.custom-scrollbar::-webkit-scrollbar{width:4px}.custom-scrollbar::-webkit-scrollbar-track{background:0 0}.custom-scrollbar::-webkit-scrollbar-thumb{background:#334155;border-radius:10px}.electron-orbit{animation:rotate var(--duration,3s) linear infinite;transform-origin:center}@keyframes rotate{from{transform:rotate(0)}to{transform:rotate(360deg)}}.atom-group{transition:transform .1s ease-out}.periodic-item{transition:all .2s cubic-bezier(.4, 0, .2, 1)}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:.5rem}.panel-section{margin-bottom:2rem}.panel-title{font-size:10px;font-weight:900;color:#64748b;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.75rem}.control-btn{flex:1;padding:.5rem 0;border-radius:.5rem;border:1px solid #334155;font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.05em;transition:all .2s}.control-btn.active{background-color:rgba(99,102,241,.2);border-color:#6366f1;color:#818cf8}.control-btn:not(.active){background-color:rgba(30,41,59,.4);color:#64748b}.control-btn:not(.active):hover{background-color:rgba(51,65,85,.5)}.bond-line{transition:all .3s ease}@keyframes vacuum-effect{0%{transform:translate(var(--start-x),var(--start-y)) scale(1) rotate(0);opacity:1}100%{transform:translate(var(--center-x),var(--center-y)) scale(0) rotate(1080deg);opacity:0}}.vacuum-animate{animation:vacuum-effect .8s cubic-bezier(.4,0,1,1) forwards!important}