/* Shared KD preference controls.  kHouse and Peak use the same form
 * contract in desktop chrome and their mobile drawers; the site skins only
 * provide tokens.  The compact visual surface never shrinks the actual 44px
 * select or no-JavaScript submit target. */
.kd-prefs, .kd-currency-pill { display: inline-flex; align-items: center; gap: var(--kd-s-3); }
.kd-langpill { display: inline-flex; align-items: center; border: 0; border-radius: 0; background: transparent; padding: 0; }
.kd-currency-pill__label { display: inline-flex; align-items: center; }
.kd-currency-pill__select, .kd-langpill__select {
    appearance: none;
    -webkit-appearance: none;
    inline-size: 10ch;
    max-inline-size: 10ch;
    min-inline-size: 0;
    min-block-size: var(--kd-touch-min);
    padding: var(--kd-s-1) var(--kd-s-5) var(--kd-s-1) var(--kd-s-3);
    border: var(--kd-border-w) solid var(--kd-border-strong, var(--kd-fg-muted));
    border-radius: var(--kd-r-1);
    background-color: var(--kd-bg);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--kd-s-1) center;
    background-size: var(--kd-s-2) calc(var(--kd-s-2) - var(--kd-border-w));
    color: var(--kd-fg);
    cursor: pointer;
    font-family: var(--kd-font-mono);
    font-size: var(--kd-text-0);
    letter-spacing: var(--kd-track-mono);
    text-transform: uppercase;
}
.kd-currency-pill__select:hover, .kd-langpill__select:hover { border-color: var(--kd-fg); }
.kd-currency-pill__select:focus-visible, .kd-langpill__select:focus-visible { outline: none; box-shadow: 0 0 0 calc(var(--kd-s-1) - var(--kd-border-w)) var(--kd-accent-ring); }
.kd-currency-pill__go {
    min-inline-size: var(--kd-touch-min);
    min-block-size: var(--kd-touch-min);
    padding: var(--kd-s-1) var(--kd-s-2);
    border: var(--kd-border-w) solid var(--kd-border);
    border-radius: var(--kd-r-1);
    background: transparent;
    color: var(--kd-fg-muted);
    cursor: pointer;
    font-family: var(--kd-font-mono);
    font-size: var(--kd-text-0);
}
.kd-currency-pill__go[hidden] { display: none; }
.kd-currency-pill__reset { padding: var(--kd-s-1) var(--kd-s-2); border: 0; background: transparent; color: var(--kd-fg-muted); cursor: pointer; font: inherit; }