/**
 * Visually-Hidden ("sr-only") Style
 *
 * Single source of truth for the standard visually-hidden-but-accessible
 * clipping technique — hides content visually while keeping it in the
 * accessibility tree (screen readers, `aria-live` regions).
 *
 * Two forms are exported from the same declarations so component stylesheets
 * and JS-created DOM elements never drift out of sync:
 * - `srOnlyMixin` — a `.sr-only` class for component `styles: [...]` arrays.
 * - `SR_ONLY_INLINE_STYLE` — the equivalent `cssText` string for elements
 *   created outside any component's shadow root (e.g. a live region appended
 *   directly to `document.body`).
 *
 * @example
 * ```ts
 * // Component stylesheet
 * import { srOnlyMixin } from '../../styles';
 * return { styles: [srOnlyMixin, componentStyles], template: html`<span class="sr-only">...</span>` };
 *
 * // JS-created element outside a shadow root
 * import { SR_ONLY_INLINE_STYLE } from '../../styles';
 * el.style.cssText = SR_ONLY_INLINE_STYLE;
 * ```
 */
export declare const SR_ONLY_INLINE_STYLE: string;
export declare const srOnlyMixin: import("@vielzeug/ore").CSSResult;
/**
 * Coarse Pointer Mixin
 *
 * Under `@media (pointer: coarse)`, promotes the full component one size tier
 * so padding, gap, font-size, height, and icon-size all grow proportionally
 * with the WCAG 44 px touch target — not just the minimum height in isolation:
 *
 * - default / `size="md"` → lg-scale tokens + `--_touch-target: var(--size-11)`
 * - `size="sm"` → md-scale tokens + `--_touch-target: var(--size-11)`
 * - `size="lg"` → touch target only (already at max scale)
 *
 * Interactive elements inside the component that need a guaranteed tap target
 * should still reference `--_touch-target`:
 *
 * ```css
 * .close { min-height: var(--_touch-target); min-width: var(--_touch-target); }
 * ```
 *
 * @example
 * ```ts
 * import { coarsePointerMixin } from '../../styles';
 *
 * return {
 *   styles: [coarsePointerMixin, componentStyles],
 *   template: html`...`
 * };
 * ```
 */
export declare const coarsePointerMixin: import("@vielzeug/ore").CSSResult;
/**
 * Reduced Motion Mixin
 *
 * Defines `--_motion-transition: none` and `--_motion-animation: none` on
 * `:host` under `@media (prefers-reduced-motion: reduce)`.
 * Component CSS opts in via CSS variable fallbacks:
 *
 * ```css
 * .panel { transition: var(--_motion-transition, opacity 300ms ease); }
 * .loader { animation: var(--_motion-animation, spin 0.6s linear infinite); }
 * ```
 *
 * @example
 * ```ts
 * import { reducedMotionMixin } from '../../styles';
 *
 * return {
 *   styles: [reducedMotionMixin, componentStyles],
 *   template: html`...`
 * };
 * ```
 */
export declare const reducedMotionMixin: import("@vielzeug/ore").CSSResult;
//# sourceMappingURL=accessibility.css.d.ts.map