/* Design tokens, reset and base elements. */

:root {
    --month-row-height: 44px;
    --font-display: Poppins, Inter, ui-sans-serif, system-ui, sans-serif;
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --transition: 160ms ease;
    --focus-ring: 3px solid var(--focus-color);
    --touch-target: 44px;
    --toolbar-height: 72px;
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    overflow: hidden;
    background: var(--color-bg);
    color: var(--color-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.45;
}

button, input, select {
    font: inherit;
}

button, select {
    cursor: pointer;
}

button {
    border: 0;
}

svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 3px;
}
