/* ========================================
   Responsive Styles - Zill-dle
   ======================================== */

/* Height-specific adjustments for shorter screens (737px and below) */
@media (max-height: 737px) {
    .game-instructions {
        padding: 1rem;
        gap: 0.75rem;
    }

    .instruction-logo {
        width: 120px;
        height: auto;
    }

    .instructions-list ul {
        gap: 0.5rem;
    }
    .instructions-list{
        margin-top: 0;
    }
}
/* Mobile Devices (481px - 767px) */
@media only screen and (max-width: 767px) {
    .game-controls.GameStarted {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 0.5em;
    }
    
    .game-instructions img {
        max-height: 150px;
    }
    .intro_text {
        max-width: 90%;
        text-align: center;
        font-size: 24px;
    }
    .instructions-list {
        max-width: 90%;
    }
    .instructions-list ul {
        font-size: .9em;
    }
    .placeholder-image {
        height: 230px;
    }
    .polaroid-stack {
        height: 280px;
        display: flex;
        justify-content: center;
    }
    .property-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: .25em;
    }
    .info-field {
        width: 100%;
        padding: 0;
    }
    .info-row {
        width: 100%;
    }
    .house-display {
        padding: 1em;
    }
    .image_display {
        width: 90%;
    }
    .form-control {
        width: 100%;
        flex-grow: 1;
        min-width: 0;
    }
    .form-group{
        margin-left: 5px;
    }
    .guess-stats {
        margin-right: 5px;
    }
}

/* Tablets Portrait (768px - 1024px) */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    
}

/* Tablets Landscape & Small Desktops (1025px - 1280px) */
@media only screen and (min-width: 1025px) and (max-width: 1280px) {
    
}

/* Desktops & Laptops (1281px - 1440px) */
@media only screen and (min-width: 1281px) and (max-width: 1440px) {
    
}

/* Large Desktops (1441px and up) */
@media only screen and (min-width: 1441px) {
    
}

/* Ultra Wide Screens (1920px and up) */
@media only screen and (min-width: 1920px) {
    
}

/* Orientation Specific */
@media only screen and (orientation: portrait) {
    
}

@media only screen and (orientation: landscape) {
    
}

/* High DPI / Retina Displays */
@media only screen and (-webkit-min-device-pixel-ratio: 2),
       only screen and (min-resolution: 192dpi) {
    
}

/* Print Styles */
@media print {
    
}
