/* Breakpoint tokens — shared with JS via getComputedStyle().
   CSS media queries cannot use var(), so @media rules must repeat the
   literal value with a comment pointing back to the token. */

@layer tokens {
    :root {
        --bp-sm: 48rem;   /*  768 px — mobile / tablet boundary */
        --bp-md: 60rem;   /*  960 px */
        --bp-lg: 80rem;   /* 1280 px */
    }
}