/* MONO — responsive.css : breakpoint-specific overrides not covered elsewhere */

@media (max-width: 1023px) {
    .desktop-only { display: none !important; }
}

@media (min-width: 1024px) {
    .mobile-only { display: none !important; }
}

/* iPhone 13 / small mobile: tighten spacing */
@media (max-width: 430px) {
    .app-main { padding-left: var(--space-3); padding-right: var(--space-3); }
    h1 { font-size: 24px; }
    .grid-cols-4 { grid-template-columns: repeat(2, 1fr); }
    .grid-cols-3 { grid-template-columns: repeat(1, 1fr); }
}

/* Tablet portrait */
@media (min-width: 600px) and (max-width: 1023px) {
    .app-main { max-width: 640px; }
    .grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
}

/* Tables: horizontal scroll container so pages never scroll sideways */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border); border-radius: var(--radius-md); }
.table-scroll table { min-width: 640px; }
.table-scroll th, .table-scroll td { padding: var(--space-3); text-align: left; font-size: 13px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.table-scroll th { color: var(--text-secondary); font-weight: 600; background: var(--surface); position: sticky; top: 0; }
.table-scroll tr:last-child td { border-bottom: none; }

/* Touch target safety net */
button, a, input, select, .btn, .icon-btn, .bottom-nav__item { touch-action: manipulation; }