:root{--bg-color: #050505;--text-color: #eaeaea;--accent-color: #00ff99;--star-color: #ff4d4d;--sun-color: #ffaa00;--panel-bg: rgba(20, 20, 20, .8);--border-color: #333}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-color);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}#root{width:100vw;height:100vh;display:flex;flex-direction:column}.app-container{position:relative;width:100%;height:100%}.canvas-container{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1}.panel{position:absolute;top:20px;z-index:10;background-color:var(--panel-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:20px;border-radius:12px;border:1px solid var(--border-color);box-shadow:0 8px 32px #00000080;display:flex;flex-direction:column;gap:15px;transition:all .3s ease;width:280px}.panel:hover{border-color:#00ff994d;box-shadow:0 8px 32px #00ff991a}.left-panel{left:20px}.right-panel{right:20px}.input-group{display:flex;flex-direction:column;gap:8px}.input-group label{font-size:.8rem;text-transform:uppercase;letter-spacing:1px;color:#888}.input-group input{background-color:#00000080;border:1px solid var(--border-color);color:var(--text-color);padding:10px 15px;border-radius:6px;font-size:1rem;outline:none;transition:border-color .2s ease;width:100%}.input-group input:focus{border-color:var(--accent-color)}button.plot-btn{background-color:var(--accent-color);color:#000;border:none;padding:12px 24px;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;height:42px;text-transform:uppercase;letter-spacing:1px;width:100%}button.plot-btn:hover{background-color:#00cc7a;transform:translateY(-2px);box-shadow:0 4px 15px #00ff994d}button.plot-btn:active{transform:translateY(0)}.title-section{display:flex;flex-direction:column;border-bottom:1px solid var(--border-color);padding-bottom:15px;margin-bottom:5px}.title-section h1{font-size:1.5rem;font-weight:700;background:linear-gradient(90deg,#fff,#888);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.title-section p{font-size:.8rem;color:#888}.legend{position:absolute;bottom:20px;left:20px;z-index:10;background-color:var(--panel-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:15px;border-radius:8px;border:1px solid var(--border-color);display:flex;flex-direction:column;gap:10px}.legend-item{display:flex;align-items:center;gap:10px;font-size:.9rem}.legend-color{width:12px;height:12px;border-radius:50%}.lc-sun{background-color:var(--sun-color);box-shadow:0 0 8px var(--sun-color)}.lc-center{background-color:#fff;box-shadow:0 0 10px #fc0}.lc-star{background-color:var(--star-color);box-shadow:0 0 8px var(--star-color)}.lc-line{background-color:var(--accent-color);height:2px;width:16px;border-radius:0}.stats-card{background-color:#0006;border:1px solid var(--border-color);padding:15px;border-radius:8px;font-size:.85rem;display:flex;flex-direction:column;gap:8px}.stats-row{display:flex;justify-content:space-between}.stats-label{color:#888}.stats-value{color:var(--accent-color);font-weight:600}