:root {
    --bg-color: #fdfdfd;
    --text-color: #2d3436;
    --accent: #0984e3;
    --border: #dfe6e9;
}
body { font-family: 'Segoe UI', Tahoma, sans-serif; background: var(--bg-color); color: var(--text-color); display: flex; justify-content: center; margin: 0; padding: 20px; }
#app { width: 100%; max-width: 600px; }
header { text-align: center; margin-bottom: 20px; }
#status-message { text-align: center; font-weight: bold; margin: 10px 0; min-height: 1.2em; transition: color 0.3s; }
.success { color: #27ae60; }
.error { color: #e74c3c; }
#plot { background: white; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 20px; }
button { padding: 15px; border: 1px solid var(--border); background: white; cursor: pointer; border-radius: 6px; transition: all 0.2s; font-size: 1rem; }
button:hover { background: var(--accent); color: white; border-color: var(--accent); }
