:root { --accent: #00d2ff; --bg: #0a0a0f; }
body { margin: 0; background: var(--bg); color: #fff; font-family: 'Rajdhani'; overflow: hidden; }

.main-grid { display: flex; height: 100vh; }
.sidebar { width: 340px; background: #11111a; padding: 30px; border-right: 1px solid #222; }

.logo { font-family: 'Orbitron'; font-size: 2rem; margin-bottom: 40px; }
.logo span { color: var(--accent); }

.input-group { margin-bottom: 20px; position: relative; }
label { font-size: 11px; color: #888; letter-spacing: 2px; display: block; margin-bottom: 8px; }

input, select { width: 100%; background: #000; border: 1px solid #333; color: #fff; padding: 12px; border-radius: 4px; }
.results-drop { position: absolute; width: 100%; background: #111; z-index: 100; max-height: 180px; overflow-y: auto; }
.results-drop div { padding: 10px; border-bottom: 1px solid #222; cursor: pointer; }
.results-drop div:hover { background: var(--accent); color: #000; }

.preset-btn { background: #1a1a1a; border: 1px solid #333; color: #fff; padding: 10px 15px; cursor: pointer; border-radius: 4px; }
.preset-btn.active { border-color: var(--accent); color: var(--accent); }

.calculate-btn { width: 100%; padding: 18px; background: var(--accent); border: none; font-family: 'Orbitron'; font-weight: 900; cursor: pointer; margin-top: 20px; }

/* Display Alanı */
.display { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; background: radial-gradient(circle at center, #161625 0%, #0a0a0f 100%); }
.speedo-container { position: relative; width: 400px; height: 250px; text-align: center; }
.gauge { width: 400px; height: 200px; border: 12px solid #222; border-radius: 400px 400px 0 0; border-bottom: none; position: relative; }
.needle { position: absolute; bottom: 0; left: 50%; width: 3px; height: 160px; background: var(--accent); transform-origin: bottom; transform: rotate(-90deg); transition: 1.5s cubic-bezier(0.1, 0.7, 0.1, 1); }
#fps-num { font-family: 'Orbitron'; font-size: 8rem; margin: 0; text-shadow: 0 0 20px rgba(0,210,255,0.4); }

.analysis-box { display: flex; gap: 20px; margin-top: 40px; }
.status-card { background: rgba(255,255,255,0.03); padding: 20px 30px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.05); text-align: center; min-width: 180px; }