/* ==========================================================================
   poste.cc · SPACING, RADIUS, MOTION, LAYOUT
   --------------------------------------------------------------------------
   4px base grid. Radii are rounded-but-not-bubbly (a tidy, official feel).
   Motion is quick and matter-of-fact: short eases, gentle fades, no bounce.
   ========================================================================== */

:root{
    /* Spacing — 4px grid */
    --sp-0:0;
    --sp-1:4px;
    --sp-2:8px;
    --sp-3:12px;
    --sp-4:16px;
    --sp-5:20px;
    --sp-6:24px;
    --sp-8:32px;
    --sp-10:40px;
    --sp-12:48px;
    --sp-16:64px;
    --sp-20:80px;
    --sp-24:96px;

    /* Radius */
    --r-xs:5px;
    --r-sm:8px;
    --r-md:11px; /* controls */
    --r-lg:15px; /* cards */
    --r-xl:20px; /* hero / map panels */
    --r-2xl:26px;
    --r-pill:999px; /* status pills, chips, toggles */

    /* Borders */
    --bw:1px;
    --bw-2:1.5px;

    /* Layout */
    --container:1140px;
    --container-sm:720px;
    --gutter:clamp(16px, 4vw, 24px);
    --header-h:60px;

    /* Motion — quick, matter-of-fact */
    --ease-out:cubic-bezier(0.22, 0.61, 0.36, 1);
    --ease-in-out:cubic-bezier(0.45, 0, 0.2, 1);
    --dur-fast:120ms;
    --dur-med:200ms;
    --dur-slow:360ms;

    /* Z-index */
    --z-header:100;
    --z-dropdown:200;
    --z-toast:300;
    --z-modal:400;
}

@media (prefers-reduced-motion:reduce){
    :root{ --dur-fast:0ms; --dur-med:0ms; --dur-slow:0ms; }
}