@media (max-width: 980px) {
    .nav-toggle { display: inline-flex; margin-left: auto; }
    .site-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0; right: 0;
        flex-direction: column;
        align-items: stretch;
        background: var(--menu-bg);
        border-bottom: 1px solid var(--menu-border);
        padding: 0.6rem;
        margin: 0;
    }
    .site-header { flex-wrap: wrap; }
    .site-nav.is-open { display: flex; }
    .submenu { position: static; display: none; box-shadow: none; min-width: 0; margin: 0.2rem 0 0.4rem 0.6rem; }
    .has-sub.open > .submenu { display: block; }
    .chart-grid, .split, .theme-grid, .form-grid { grid-template-columns: 1fr; }
    .span-2 { grid-column: auto; }
    .brand img { height: 52px; }
}
@media (max-width: 720px) {
    .page-head, .panel-head { flex-direction: column; align-items: stretch; }
    .hero { min-height: 70vh; }
    .slide img, .slides, .slide, .carousel { min-height: 320px; }
    .slide img { height: 320px; }
    .table-wrap table { min-width: 0; }
    .table-wrap thead { display: none; }
    .table-wrap tr { display: block; border-bottom: 1px solid var(--border); padding: 0.4rem 0; }
    .table-wrap td { display: flex; justify-content: space-between; gap: 1rem; border: 0; }
    .table-wrap td::before { content: attr(data-label); color: var(--muted); }
    .actions { justify-content: flex-end; }
    .detail-list { grid-template-columns: 1fr; }
    .color-row { grid-template-columns: 1fr; }
    .modal { max-height: calc(100vh - 1rem); overflow: auto; }
}
