/* Component scope only. WordPress consumes its existing ACSS variables. */
[data-kpx-mount] { position: relative; min-width: 0; color: var(--text-light); }
[data-kpx-mount] [hidden] { display: none !important; }
[data-kpx-frame] { min-width: 0; width: 100%; }
[data-kpx-state="loading"] [data-kpx-frame] { position: absolute; inset: 0 0 auto; visibility: hidden; pointer-events: none; }
.kpx-quick-frame { display: block; width: 100%; min-height: 400px; border: 0; border-radius: var(--radius-l); background: var(--bg-dark); }
[data-kpx-status], [data-kpx-account-state] { min-height: 1.55em; color: var(--text-light-muted); }
[data-kpx-mount] [data-kpx-sample] { min-height: 400px; }
[data-kpx-mount] a, [data-kpx-mount] button { min-height: 44px; overflow-wrap: anywhere; }
[data-kpx-mount] :focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
[data-kpx-navigation-request] { padding: var(--space-s); border: 1px solid var(--border-color-light); border-radius: var(--radius); background: var(--bg-light); }
[data-kpx-account-state] { font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { [data-kpx-mount] { scroll-behavior: auto; } }