/* Shared design tokens and mobile-first base rules, loaded by every page
   before its own stylesheet. Keep this file small: it only holds things
   every page needs (tokens, touch-target safety, table overflow handling),
   not page-specific layout. */

:root {
    --color-navy: #032117;
    --color-yellow: #ecad0a;
    --color-blue: #209dd7;
    --color-purple: #753991;
    --color-gray: #888888;
}

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

/* iOS Safari zooms the page in on focus when a form control's font-size is
   under 16px. Forcing 16px here stops that zoom-and-scroll-back jump. */
input,
select,
textarea,
button {
    font-size: 16px;
}

/* A table wider than its container would otherwise force the whole page to
   scroll sideways or squash columns unreadably. Wrap any <table> in
   <div class="table-scroll"> to scroll just the table instead. */
.table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-scroll table {
    min-width: max-content;
}