/* --- Desktop-Specific Overrides --- */
@media (pointer: fine) and (hover: hover) {
    :root {
        /* Minimize the action container footprint */
        --keyboard-height: 44px;
    }
    #keyboard {
        display: flex; /* Show virtual keyboard on PC */
        position: fixed;
        bottom: 60px; /* Float above the action bar */
        right: 20px;
        width: 360px; /* Restrict to a mobile-like width */
        background-color: var(
            --bg-color
        ); /* Match theme background */
        border-radius: 12px;
        padding: 8px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
        pointer-events: none; /* Makes the entire keyboard unclickable */
        z-index: 10000;
    }
    /* Hide the bottom row (Space and Return) entirely */
    #keyboard .row:last-child {
        display: none;
    }
    /* Hide Backspace, but use visibility so the row doesn't shift */
    .key.backspace {
        visibility: hidden;
    }
    #display-container {
        max-width: 800px;
        margin: 0 auto;
        padding: 40px 20px;
    }
    #text-output {
        font-size: 26px; /* Slightly upscaled for desktop monitors */
    }
    #keyboard::before {
        content: "Allowed Characters:";
        display: block;
        text-align: center;
        font-family: -apple-system, BlinkMacSystemFont, sans-serif;
        font-size: 14px;
        font-weight: 700;
        color: rgba(0, 0, 0, 0.4);
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-top: 4px;
        margin-bottom: 8px;
    }
}