:root{--bg-color:#fff;--text-color:#333;--primary-color:#007bff;--secondary-bg:#eee;--component-bg:#ddd}@media(prefers-color-scheme:dark){:root{--bg-color:#1a1a1a;--text-color:#e0e0e0;--secondary-bg:#2d2d2d;--component-bg:#3d3d3d}}body{font-family:Arial,sans-serif;display:flex;justify-content:center;align-items:center;height:100vh;margin:0;background-color:var(--bg-color);color:var(--text-color)}.container{text-align:center;background-color:var(--bg-color);padding:20px;border-radius:10px;box-shadow:0 0 10px rgba(0,0,0,0.1)}#timer{font-size:20px;margin-bottom:20px;color:#007bff}.numbers,.operators{display:flex;justify-content:center;margin-bottom:20px;gap:10px}.numbers div,.operators div{font-size:24px;padding:10px;background-color:var(--component-bg);border-radius:5px;cursor:pointer;user-select:none;width:50px;text-align:center}.numbers div.used{text-decoration:line-through;background-color:#ccc;cursor:not-allowed}.expression{font-size:24px;margin-bottom:20px;padding:10px;background-color:var(--secondary-bg);border-radius:5px;min-height:40px}.buttons{display:flex;justify-content:center;gap:10px}button{font-size:18px;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;background-color:#007bff;color:#fff}button:hover{background-color:color-mix(in srgb,var(--primary-color)90%,black)}#backspace{background-color:#6c757d}#backspace:hover{background-color:#5a6268}#clear{background-color:#ffc107;color:#000}#clear:hover{background-color:#e0a800}#result{font-size:20px;margin-top:20px;min-height:30px;display:flex;justify-content:center;align-items:center;color:transparent}#result:not(:empty){color:inherit}body,.container,button,.numbers div,.operators div{transition:background-color 0.3s ease,color 0.3s ease}