/* CSS Reset
 * Minimal reset for consistent cross-browser styling
 * Applied via @layer reset to ensure lowest specificity
 */

@layer reset {
    /* ============================================
     * Box sizing
     * ============================================ */
    *,
    ::before,
    ::after {
        box-sizing: border-box;
    }

    /* ============================================
     * Margin reset
     * ============================================ */
    :where(:not(dialog)) {
        margin: 0;
    }

    /* ============================================
     * Border reset
     * ============================================ */
    :where(:not(fieldset, progress, meter)) {
        background-origin: border-box;
        background-repeat: no-repeat;
        border-style: solid;
        border-width: 0;
    }

    /* ============================================
     * Media elements - block display
     * ============================================ */
    :where(img, svg, video, canvas, audio, iframe, embed, object) {
        display: block;
    }

    :where(img, svg, video) {
        block-size: auto;
        max-inline-size: 100%;
    }

    /* ============================================
     * Interactive elements
     * ============================================ */
    :where(
        a[href],
        area,
        button,
        input:not(
            [type="text"],
            [type="email"],
            [type="number"],
            [type="password"],
            [type=""],
            [type="tel"],
            [type="url"]
        ),
        label[for],
        select,
        summary,
        [tabindex]:not([tabindex*="-"], pre)
    ) {
        cursor: pointer;
    }

    :where(
        a[href],
        area,
        button,
        input,
        label[for],
        select,
        summary,
        textarea,
        [tabindex]:not([tabindex*="-"])
    ) {
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }
} /* @layer reset */