/* Pulso 1.1. Shared control anatomy and progressive native-select styling. */
:root {
  --p-control-shadow:inset 0 1px 0 #ffffff0d,0 2px 3px #00000012;
  --p-action-shadow:inset 0 1px 0 #ffffff33,0 2px 0 #242980,0 4px 9px #00000020;
  --p-field-bg:var(--p-surface);
}
:root[data-theme="light"] { --p-control-shadow:inset 0 1px 0 #fff,0 1px 2px #0c0e140c; }
.p-button { border-radius:var(--p-radius-control); padding:12px 18px; gap:10px; background:linear-gradient(#ffffff05,#ffffff00),var(--p-surface-raised); box-shadow:var(--p-control-shadow); font-weight:700; letter-spacing:-.015em; transition:background var(--p-motion-fast),border-color var(--p-motion-fast),box-shadow var(--p-motion-fast),transform var(--p-motion-fast); }
.p-button:not(:disabled):not([aria-disabled="true"]):hover { border-color:var(--p-text-subtle); background:var(--p-surface-raised); box-shadow:inset 0 1px 0 #ffffff14,0 3px 8px #0000001a; }
.p-button.primary { background:linear-gradient(180deg,var(--p-action),var(--p-action-hover)); border-color:var(--p-action); color:var(--p-action-ink); box-shadow:var(--p-action-shadow); }
.p-button.primary:not(:disabled):not([aria-disabled="true"]):hover { background:var(--p-action-hover); border-color:var(--p-action-hover); box-shadow:var(--p-action-shadow); }
.p-button.primary:not(:disabled):not([aria-disabled="true"]):active { background:var(--p-action-active); box-shadow:inset 0 1px 2px #0003; }
.p-button.ghost { background:transparent; border-color:transparent; box-shadow:none; }
.p-button.ghost:not(:disabled):not([aria-disabled="true"]):hover { background:var(--p-brand-soft); border-color:transparent; box-shadow:none; }
.p-button.danger { background:var(--p-danger-fill); color:#fff; border-color:var(--p-danger-fill); }
.p-button.danger:not(:disabled):not([aria-disabled="true"]):hover { background:var(--p-danger-fill); border-color:var(--p-danger-fill); box-shadow:inset 0 0 0 2px #ffffff50; }
.p-button:disabled,.p-button[aria-disabled="true"] { opacity:.48; box-shadow:none; transform:none; }
.p-button[aria-busy="true"] { opacity:.8; }
.p-button.icon { width:48px; height:48px; }
.p-button svg,.p-input-shell>svg { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.p-field { gap:9px; }.p-label { font-weight:650; font-size:13px; letter-spacing:.005em; }.p-help,.p-error { line-height:1.6; }
.p-input,.p-select { min-height:var(--p-control-default); border-radius:var(--p-radius-control); background:var(--p-field-bg); padding:12px 14px; font:500 16px/1.4 var(--p-font-body); box-shadow:var(--p-control-shadow); transition:border-color var(--p-motion-fast),box-shadow var(--p-motion-fast); }
.p-input:not(:disabled):hover,.p-select:not(:disabled):hover { border-color:var(--p-text-subtle); }
.p-input:focus,.p-select:focus-visible { outline:3px solid var(--p-focus); outline-offset:3px; border-color:var(--p-brand); }
.p-input[aria-invalid="true"],.p-select[aria-invalid="true"] { border-color:var(--p-danger); }
.p-input:disabled,.p-select:disabled { opacity:.6; cursor:not-allowed; background:var(--p-surface-raised); box-shadow:none; }
.p-input[readonly] { background:var(--p-surface-raised); }
.p-input-shell { position:relative; display:flex; align-items:center; gap:10px; min-width:0; background:var(--p-field-bg); border:1px solid var(--p-border-control); border-radius:var(--p-radius-control); padding:0 14px; box-shadow:var(--p-control-shadow); color:var(--p-text-subtle); }
.p-input-shell .p-input { min-width:0; flex:1; width:100%; border:0; border-radius:0; background:transparent; box-shadow:none; padding:12px 0; }
.p-input-shell:focus-within { outline:3px solid var(--p-focus); outline-offset:3px; border-color:var(--p-brand); }
.p-input-shell .p-input:focus { outline:none; }
.p-input-shell:has([aria-invalid="true"]) { border-color:var(--p-danger); }
.p-input-shell:has(:disabled) { background:var(--p-surface-raised); opacity:.6; }
.p-input-shell .p-input:disabled { opacity:1; }
.p-input-affix { font:600 12px var(--p-font-body); white-space:nowrap; color:var(--p-text-muted); }
.p-input-affix.unit { padding-left:12px; border-left:1px solid var(--p-border); }
.p-success { color:var(--p-success); font-size:12px; line-height:1.6; }
.p-input-shell.valid { border-color:var(--p-success); }.p-input-shell.valid>svg:last-child { color:var(--p-success); }
:is(.p-select,.lang-sel,.dota-h2h select) { cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%238994AC' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; background-size:20px; padding-right:44px; }
:is(.p-select,.lang-sel,.dota-h2h select) option { background:var(--p-surface); color:var(--p-text); }
@supports (appearance:base-select) {
  :is(.p-select,.lang-sel,.dota-h2h select),:is(.p-select,.lang-sel,.dota-h2h select)::picker(select) { appearance:base-select; }
  :is(.p-select,.lang-sel,.dota-h2h select) { background-image:none; padding-right:14px; display:flex; align-items:center; gap:12px; }
  :is(.p-select,.lang-sel,.dota-h2h select)::picker-icon { content:""; margin-left:auto; width:8px; height:8px; border-right:1.8px solid currentColor; border-bottom:1.8px solid currentColor; transform:translateY(-2px) rotate(45deg); color:var(--p-text-subtle); flex:none; }
  :is(.p-select,.lang-sel,.dota-h2h select):open::picker-icon { transform:translateY(2px) rotate(225deg); }
  :is(.p-select,.lang-sel,.dota-h2h select):open { border-color:var(--p-brand); outline:3px solid var(--p-focus); outline-offset:3px; }
  :is(.p-select,.lang-sel,.dota-h2h select)::picker(select) { background:var(--p-surface); color:var(--p-text); border:1px solid var(--p-border-control); border-radius:16px; padding:6px; margin-block:9px; box-shadow:0 16px 40px #00000030,inset 0 1px 0 #ffffff0a; max-height:min(360px,65dvh); overflow-y:auto; }
  :is(.p-select,.lang-sel,.dota-h2h select) option { min-height:44px; padding:11px 12px; display:flex; align-items:center; gap:12px; border-radius:10px; font:500 14px/1.5 var(--p-font-body); white-space:normal; }
  :is(.p-select,.lang-sel,.dota-h2h select) option:checked { background:var(--p-brand-soft); color:var(--p-brand); font-weight:700; }
  :is(.p-select,.lang-sel,.dota-h2h select) option:is(:hover,:focus) { background:var(--p-surface-raised); outline:2px solid var(--p-focus); outline-offset:-2px; }
  :is(.p-select,.lang-sel,.dota-h2h select) option::checkmark { order:2; margin-left:auto; font-size:15px; }
  :is(.p-select,.lang-sel,.dota-h2h select) option:disabled { opacity:.5; cursor:not-allowed; }
  :is(.p-select,.lang-sel,.dota-h2h select) optgroup { padding:6px 0; }
  :is(.p-select,.lang-sel,.dota-h2h select) optgroup>legend { padding:8px 12px; font-size:11px; color:var(--p-text-muted); }
}
/* Keep system high-contrast colors, native arrows and focus visible. */
@media (forced-colors:active) {
  .p-button,.p-input,.p-input-shell,.p-select { box-shadow:none; border:1px solid ButtonText; }
  .p-button.primary { background:ButtonFace; color:ButtonText; }
  :is(.p-select,.lang-sel,.dota-h2h select) { appearance:auto; background-image:none; }
  :is(.p-select,.lang-sel,.dota-h2h select)::picker(select) { appearance:auto; }
}
/* Disabled controls keep their resting appearance even under the pointer. */
.p-button.primary:disabled:hover,.p-button.primary[aria-disabled="true"]:hover { background:linear-gradient(180deg,var(--p-action),var(--p-action-hover)); border-color:var(--p-action); box-shadow:none; }
.p-button:not(.primary):not(.danger):not(.ghost):disabled:hover { background:linear-gradient(#ffffff05,#ffffff00),var(--p-surface-raised); border-color:var(--p-border-control); }
