/* Tablet-specific styles (768px - 1024px) */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    /* General layout adjustments */
    .wide-content-container, 
    .content-container {
        width: 90%;
        padding: 0 20px;
    }
    
    /* Header adjustments */
    .main-header {
        padding: 15px 20px;
    }
    
    .main-nav ul {
        gap: 10px;
    }
    
    .main-nav button {
        padding: 8px 12px;
        font-size: 0.9rem;
    }
    
    /* Hero section adjustments */
    .hero-content {
        width: 80%;
    }
    
    .main-title {
        font-size: 2.5rem;
    }
    
    .subtitle {
        font-size: 1.2rem;
    }
    
    /* Books timeline view */
    .timeline-book-content {
        width: 400px;
        height: 400px;
    }
    
    /* Book detail pages */
    .book-pages-container {
        width: 90%;
    }
    
    .book-spread {
        flex-direction: column;
    }
    
    .book-page-single {
        width: 100%;
        max-width: 500px;
        margin: 0 auto 20px;
    }
    
    /* Noisy's Studio */
    .studio-container .canvas-tools {
        flex-direction: column;
    }
    
    #canvas-container {
        margin: 0 auto 20px;
    }
    
    #sprite-panel {
        width: 100%;
        max-height: 200px;
        overflow-y: auto;
    }
    
    /* Footer adjustments */
    .footer-content {
        flex-wrap: wrap;
    }
    
    .footer-logo, 
    .footer-links, 
    .footer-newsletter {
        flex: 1 0 45%;
        margin-bottom: 20px;
    }
}