* { box-sizing: border-box; margin: 0; padding: 0; font-family: sans-serif; }
body { background: #121212; display: flex; justify-content: center; align-items: center; min-height: 100vh; color: white; }
.main-wrapper { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; justify-content: center; }
.calculator { width: 320px; padding: 20px; background: #1c1c1c; border-radius: 30px; }
#display { width: 100%; height: 60px; font-size: 2rem; text-align: right; margin-bottom: 15px; border-bottom: 2px solid #333; overflow-x: auto; white-space: nowrap; }
.buttons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.grid-cientifico { display: none; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 10px; grid-column: span 4; }
.grid-cientifico.active { display: grid; }
button { height: 45px; border-radius: 20px; border: none; background: #333; color: white; cursor: pointer; }
.btn-op { background: #ff9f0a; }
.btn-top { background: #a5a5a5; color: black; }
.btn-zero { grid-column: span 2; }
.btn-hist { width: 100%; margin-top: 10px; background: #222; }
.historial-box { width: 250px; background: #1c1c1c; padding: 20px; border-radius: 20px; display: none; height: 350px; overflow-y: auto; border: 1px solid #333; }