body {
        background: #1e1e2f;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        font-family: Arial, sans-serif;
    }

.calculator {
            background: #2c2c3e;
            padding: 20px;
            border-radius: 15px;
            width: 360px;
            box-shadow: 0 0 20px rgba(0,0,0,0.5);
        }

#display {
            width: 100%;
            height: 60px;
            font-size: 24px;
            text-align: right;
            padding: 10px;
            margin-bottom: 15px;
            border-radius: 10px;
            border: none;
            background: #111;
            color: #0f0;
        }

        .buttons {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 10px;
        }

        button {
            padding: 15px;
            font-size: 16px;
            border: none;
            border-radius: 10px;
            cursor: pointer;
            background: #444;
            color: white;
        }

        button:hover {
            background: #666;
        }

        .operator {
            background: #ff9500;
        }

        .operator:hover {
            background: #ffa733;
        }

        .equal {
            background: #28a745;
            grid-column: span 2;
        }

        .equal:hover {
            background: #34c759;
        }

        .clear {
            background: #dc3545;
        }

        .clear:hover {
            background: #ff4d5a;
        }