/* Tokens de diseño de la suite Simple. FUENTE ÚNICA: la paleta del panel de InmoSimple (estilo Apple: claro, oscuro y vidrio).
   Las tres plataformas usan exactamente estos valores; `suite.py diseno` revisa que no se separen. */
:root {
  color-scheme: light;
  --ui-canvas: 245 245 247;
  --ui-surface: 255 255 255;
  --ui-surface-sunken: 241 241 244;
  --ui-line: 226 226 231;
  --ui-fg: 29 29 31;
  --ui-fg-muted: 86 88 96;
  --ui-fg-inverse: 255 255 255;
  --ui-accent: 10 91 211;
  --ui-accent-hover: 8 71 166;
  --ui-accent-text: 10 91 211;
  --ui-accent-fg: 255 255 255;
  --ui-accent-soft: 236 243 255;
  --ui-shadow-sm: 0 1px 2px rgb(0 0 0 / .04), 0 2px 8px -2px rgb(0 0 0 / .05);
  --ui-shadow-lg: 0 2px 6px rgb(0 0 0 / .04), 0 24px 56px -12px rgb(0 0 0 / .16);
  --ui-glass: rgb(255 255 255 / .72);
  --ui-glass-line: rgb(0 0 0 / .07);
  --ui-radius-control: .625rem;
  --ui-radius-card: 1.125rem;
  --ui-radius-sheet: 1.375rem;
  --ui-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;
  --ui-surface-inverse: 29 29 31;
  --ui-line-strong: 206 206 212;
  --ui-fg-subtle: 102 106 116;
  --ui-success: 21 128 61;
  --ui-success-soft: 234 247 239;
  --ui-warning: 180 83 9;
  --ui-warning-soft: 253 245 230;
  --ui-danger: 185 28 28;
  --ui-danger-soft: 253 242 242;
  --ui-info: 21 94 158;
  --ui-info-soft: 234 242 253;
  --ui-success-fg: 255 255 255;
  --ui-warning-fg: 255 255 255;
  --ui-danger-fg: 255 255 255;
  --ui-info-fg: 255 255 255;
  --ui-shadow-xs: 0 1px 2px rgb(0 0 0 / .04);
  --ui-shadow-md: 0 1px 2px rgb(0 0 0 / .04), 0 8px 24px -6px rgb(0 0 0 / .08);
  --ui-glass-strong: rgb(255 255 255 / .86);
  --ui-glass-highlight: inset 0 1px 0 rgb(255 255 255 / .6);
  --ui-glass-filter: saturate(180%) blur(20px);
  --ui-overlay: rgb(16 16 20 / .28);
}
[data-theme="dark"] {
  color-scheme: dark;
  --ui-canvas: 10 10 12;
  --ui-surface: 28 28 30;
  --ui-surface-sunken: 44 44 46;
  --ui-line: 52 52 56;
  --ui-fg: 245 245 247;
  --ui-fg-muted: 174 177 186;
  --ui-fg-inverse: 29 29 31;
  --ui-accent-hover: 60 138 240;
  --ui-accent-text: 127 180 255;
  --ui-accent-soft: 22 38 68;
  --ui-shadow-sm: 0 1px 2px rgb(0 0 0 / .3), 0 2px 8px -2px rgb(0 0 0 / .3);
  --ui-shadow-lg: 0 2px 6px rgb(0 0 0 / .3), 0 24px 56px -12px rgb(0 0 0 / .6);
  --ui-glass: rgb(30 30 32 / .7);
  --ui-glass-line: rgb(255 255 255 / .08);
  --ui-surface-inverse: 245 245 247;
  --ui-line-strong: 72 72 77;
  --ui-fg-subtle: 146 150 160;
  --ui-accent: 22 104 224;
  --ui-accent-fg: 255 255 255;
  --ui-success: 74 222 128;
  --ui-success-soft: 24 45 33;
  --ui-warning: 251 191 36;
  --ui-warning-soft: 50 40 18;
  --ui-danger: 248 113 113;
  --ui-danger-soft: 54 27 27;
  --ui-info: 96 165 250;
  --ui-info-soft: 22 38 58;
  --ui-success-fg: 10 11 14;
  --ui-warning-fg: 10 11 14;
  --ui-danger-fg: 10 11 14;
  --ui-info-fg: 10 11 14;
  --ui-shadow-xs: 0 1px 2px rgb(0 0 0 / .3);
  --ui-shadow-md: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px -6px rgb(0 0 0 / .45);
  --ui-glass-strong: rgb(36 36 38 / .86);
  --ui-glass-highlight: inset 0 1px 0 rgb(255 255 255 / .05);
  --ui-overlay: rgb(0 0 0 / .5);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font: 16px/1.6 var(--ui-font); background: rgb(var(--ui-canvas)); color: rgb(var(--ui-fg)); -webkit-font-smoothing: antialiased; }

/* Componentes del panel de la suite Simple. Usa los tokens de tokens.css. */
.ui-body { min-height: 100vh; display: flex; flex-direction: column; }
.ui-top { position: sticky; top: 0; z-index: 20; background: var(--ui-glass); border-bottom: 1px solid var(--ui-glass-line); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); }
.ui-top-in { max-width: 80rem; margin: 0 auto; padding: 0 1.25rem; height: 3.5rem; display: flex; align-items: center; gap: .75rem; }
a { color: rgb(var(--ui-accent-text)); }
.ui-brand { font-weight: 700; font-size: 1.1rem; letter-spacing: -.02em; text-decoration: none; margin-right: auto; color: rgb(var(--ui-fg)); }
.ui-brand b { color: rgb(var(--ui-accent-text)); }
.ui-nav { display: flex; gap: .25rem; }
.ui-nav a { text-decoration: none; color: rgb(var(--ui-fg-muted)); font-size: .93rem; padding: .35rem .7rem; border-radius: var(--ui-radius-control); }
.ui-nav a:hover { background: rgb(var(--ui-surface-sunken)); color: rgb(var(--ui-fg)); }
.ui-nav a[aria-current="page"] { background: rgb(var(--ui-accent-soft)); color: rgb(var(--ui-accent-text)); font-weight: 600; }
.ui-tool { font: inherit; font-size: .85rem; font-weight: 600; color: rgb(var(--ui-fg)); background: transparent; border: 1px solid rgb(var(--ui-line)); border-radius: var(--ui-radius-control); padding: .35rem .7rem; cursor: pointer; text-decoration: none; }
.ui-tool:hover { background: rgb(var(--ui-surface-sunken)); }
.ui-main { flex: 1; padding: 2rem 0 3rem; }
.ui-wrap { max-width: 80rem; margin: 0 auto; padding: 0 1.25rem; }
.ui-narrow { max-width: 26rem; margin: 0 auto; }
.ui-h1 { font-size: 1.6rem; letter-spacing: -.02em; margin: 0 0 .25rem; }
.ui-sub { color: rgb(var(--ui-fg-muted)); margin: 0 0 1.5rem; }
.ui-stack { display: grid; gap: 1rem; }
.ui-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.ui-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }

.ui-card { background: rgb(var(--ui-surface)); border: 1px solid rgb(var(--ui-line)); border-radius: var(--ui-radius-card); padding: 1.25rem; box-shadow: var(--ui-shadow-sm); }
.ui-card > h2 { margin: 0 0 .75rem; font-size: 1.05rem; letter-spacing: -.01em; }

.ui-btn { display: inline-flex; align-items: center; justify-content: center; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; border: 1px solid transparent; border-radius: var(--ui-radius-control); padding: .6rem 1.1rem; background: rgb(var(--ui-accent)); color: rgb(var(--ui-accent-fg)); }
.ui-btn:hover { background: rgb(var(--ui-accent-hover)); }
.ui-btn--ghost { background: transparent; color: rgb(var(--ui-fg)); border-color: rgb(var(--ui-line)); }
.ui-btn--ghost:hover { background: rgb(var(--ui-surface-sunken)); }
.ui-btn--danger { background: rgb(var(--ui-danger)); color: #fff; }
.ui-btn--danger:hover { background: rgb(var(--ui-danger) / .85); }
.ui-btn--block { width: 100%; }

.ui-field { display: grid; gap: .3rem; }
.ui-field label { font-size: .88rem; font-weight: 600; }
.ui-input { font: inherit; width: 100%; padding: .6rem .8rem; color: rgb(var(--ui-fg)); background: rgb(var(--ui-surface)); border: 1px solid rgb(var(--ui-line)); border-radius: var(--ui-radius-control); }
.ui-input:focus { outline: 2px solid rgb(var(--ui-accent) / .45); outline-offset: 1px; border-color: rgb(var(--ui-accent)); }
.ui-error { color: rgb(var(--ui-danger)); font-size: .85rem; }
.ui-hint { color: rgb(var(--ui-fg-muted)); font-size: .85rem; }

.ui-alert { padding: .75rem 1rem; border-radius: var(--ui-radius-control); border: 1px solid rgb(var(--c) / .35); background: rgb(var(--c) / .1); color: rgb(var(--ui-fg)); font-size: .93rem; }
.ui-alert--info { --c: var(--ui-accent); }
.ui-alert--success { --c: var(--ui-success); }
.ui-alert--warning { --c: var(--ui-warning); }
.ui-alert--danger { --c: var(--ui-danger); }

.ui-badge { display: inline-block; font-size: .75rem; font-weight: 600; padding: .1rem .55rem; border-radius: 999px; background: rgb(var(--c, var(--ui-fg-muted)) / .14); color: rgb(var(--c, var(--ui-fg-muted))); }
.ui-badge--success { --c: var(--ui-success); } .ui-badge--warning { --c: var(--ui-warning); } .ui-badge--danger { --c: var(--ui-danger); } .ui-badge--accent { --c: var(--ui-accent-text); }

.ui-stat { display: grid; gap: .15rem; }
.ui-stat b { font-size: 1.8rem; letter-spacing: -.02em; }
.ui-stat span { color: rgb(var(--ui-fg-muted)); font-size: .88rem; }

.ui-table-wrap { overflow-x: auto; border: 1px solid rgb(var(--ui-line)); border-radius: var(--ui-radius-card); background: rgb(var(--ui-surface)); }
.ui-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.ui-table th, .ui-table td { text-align: left; padding: .7rem 1rem; border-bottom: 1px solid rgb(var(--ui-line)); }
.ui-table th { color: rgb(var(--ui-fg-muted)); font-weight: 600; font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; }
.ui-table tr:last-child td { border-bottom: 0; }

.ui-empty { text-align: center; padding: 2.5rem 1rem; color: rgb(var(--ui-fg-muted)); border: 1px dashed rgb(var(--ui-line)); border-radius: var(--ui-radius-card); }
.ui-empty h3 { margin: 0 0 .25rem; color: rgb(var(--ui-fg)); }

@media (max-width: 40rem) { .ui-nav { display: none; } .ui-main { padding-top: 1.25rem; } }

/* Panel con menú lateral (misma estructura que InmoSimple: lateral de vidrio, barra superior y menú plegable en el celular) */
.ui-shell { min-height: 100vh; display: grid; grid-template-columns: 16rem minmax(0, 1fr); }
.ui-side { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--ui-glass); border-right: 1px solid var(--ui-glass-line); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); overflow-y: auto; }
.ui-side-head { height: 4rem; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 0 1rem; flex: none; }
.ui-side-brand { display: inline-flex; align-items: center; gap: .6rem; min-width: 0; font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; text-decoration: none; color: rgb(var(--ui-fg)); }
.ui-mark { width: 2rem; height: 2rem; flex: none; display: grid; place-items: center; border-radius: .55rem; background: rgb(var(--ui-accent)); color: rgb(var(--ui-accent-fg)); font-weight: 700; }
.ui-trunc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ui-side-toggle { display: none; }
.ui-side-nav { display: flex; flex-direction: column; gap: .125rem; padding: .25rem .75rem 1.5rem; }
.ui-side-create { margin: 0 0 .75rem; gap: .4rem; }
.ui-navitem { display: flex; align-items: center; gap: .65rem; padding: .55rem .75rem; border-radius: var(--ui-radius-control); color: rgb(var(--ui-fg-muted)); text-decoration: none; font-size: .93rem; }
.ui-navitem:hover { background: rgb(var(--ui-surface-sunken)); color: rgb(var(--ui-fg)); }
.ui-navitem[aria-current="page"] { background: rgb(var(--ui-accent-soft)); color: rgb(var(--ui-accent-text)); font-weight: 600; }
.ui-icon { width: 1.125rem; height: 1.125rem; flex: none; }
.ui-content { min-width: 0; display: flex; flex-direction: column; }
.ui-topbar { position: sticky; top: 0; z-index: 15; height: 4rem; display: flex; align-items: center; justify-content: flex-end; gap: .6rem; padding: 0 1.25rem; background: var(--ui-glass); border-bottom: 1px solid var(--ui-glass-line); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); }
.ui-user { text-align: right; line-height: 1.2; font-size: .85rem; }
.ui-user b { display: block; font-weight: 600; }
.ui-user small { color: rgb(var(--ui-fg-muted)); }
@media (max-width: 64rem) {
  .ui-shell { grid-template-columns: minmax(0, 1fr); }
  .ui-side { position: sticky; top: 0; z-index: 25; height: auto; max-height: 100vh; border-right: 0; border-bottom: 1px solid var(--ui-glass-line); }
  .ui-side-toggle { display: inline-flex; }
  .ui-side-nav { display: none; }
  .ui-side.open .ui-side-nav { display: flex; }
  .ui-topbar { position: static; justify-content: flex-start; flex-wrap: wrap; height: auto; padding: .5rem 1rem; }
  .ui-user { text-align: left; margin-right: auto; }
}

/* Orden y respiro de las pantallas del panel: mismo espacio entre bloques, botones que no se pegan y filtros prolijos */
.ui-wrap > :is(.ui-row, form, .ui-card, .ui-table-wrap, .ui-empty, .ui-alert, .ui-grid, .ui-stack) { margin-top: 0; margin-bottom: 1.25rem; }
.ui-wrap > h2 { margin: 1.75rem 0 .75rem; font-size: 1.15rem; letter-spacing: -.01em; }
.ui-row { gap: .75rem; }
.ui-row > .ui-field { flex: 1 1 12rem; max-width: 22rem; }
.ui-row > select.ui-input, .ui-row > .ui-field select.ui-input { width: auto; min-width: 11rem; max-width: 100%; }
.ui-row > .ui-field select.ui-input { width: 100%; }
.ui-row form { margin: 0; }
.ui-push { margin-left: auto; }
.ui-btn { min-height: 2.5rem; padding: .5rem 1.1rem; white-space: nowrap; }
.ui-btn--sm { min-height: 2.1rem; padding: .3rem .85rem; font-size: .88rem; }
.ui-table .ui-btn { min-height: 2rem; padding: .25rem .75rem; font-size: .85rem; }
.ui-table td form { margin: 0; display: inline-block; }
.ui-card .ui-row { margin-bottom: .75rem; }
.ui-card .ui-stack > .ui-btn, .ui-card form > .ui-btn { justify-self: start; }
@media (max-width: 40rem) {
  .ui-row > .ui-field, .ui-row > select.ui-input { flex: 1 1 100%; max-width: 100%; width: 100%; }
  .ui-row > .ui-btn, .ui-row > form { flex: 1 1 auto; }
  .ui-push { margin-left: 0; }
  .ui-wrap { padding: 0 1rem; }
}

/* Tarjetas con imagen, miniaturas, galería, panel lateral, subida por arrastre y selector segmentado (catálogo, stock y lo que venga) */
.ui-btn[hidden] { display: none; }
.ui-seg { display: inline-flex; padding: .2rem; gap: .15rem; background: rgb(var(--ui-surface-sunken)); border-radius: var(--ui-radius-control); }
.ui-seg a { display: inline-flex; align-items: center; gap: .35rem; min-height: 1.9rem; padding: .2rem .75rem; border-radius: calc(var(--ui-radius-control) - .15rem); color: rgb(var(--ui-fg-muted)); text-decoration: none; font-size: .88rem; font-weight: 600; }
.ui-seg a[aria-current="true"] { background: rgb(var(--ui-surface)); color: rgb(var(--ui-fg)); box-shadow: var(--ui-shadow-xs); }
.ui-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(15.5rem, 100%), 1fr)); }
.ui-pcard { position: relative; display: flex; flex-direction: column; overflow: hidden; color: inherit; text-decoration: none; background: rgb(var(--ui-surface)); border: 1px solid rgb(var(--ui-line)); border-radius: var(--ui-radius-card); box-shadow: var(--ui-shadow-sm); transition: transform .18s ease, box-shadow .18s ease; }
.ui-pcard:hover { transform: translateY(-2px); box-shadow: var(--ui-shadow-md); }
.ui-pcard:focus-visible { outline: 2px solid rgb(var(--ui-accent)); outline-offset: 2px; }
.ui-pcard-body { display: grid; gap: .3rem; padding: .85rem 1rem 1rem; }
.ui-pcard-title { font-weight: 650; letter-spacing: -.01em; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ui-pcard-meta { color: rgb(var(--ui-fg-muted)); font-size: .84rem; }
.ui-pcard-price { font-size: 1.15rem; font-weight: 700; letter-spacing: -.02em; }
.ui-pcard-badges { position: absolute; top: .6rem; left: .6rem; display: flex; flex-wrap: wrap; gap: .3rem; }
.ui-pcard-badges .ui-badge { background: var(--ui-glass-strong); -webkit-backdrop-filter: var(--ui-glass-filter); backdrop-filter: var(--ui-glass-filter); box-shadow: var(--ui-shadow-xs); }
.ui-thumb { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: rgb(var(--ui-surface-sunken)); display: grid; place-items: center; color: rgb(var(--ui-fg-subtle)); }
.ui-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ui-thumb svg { width: 2.6rem; height: 2.6rem; opacity: .55; }
.ui-thumb--sm { width: 3.5rem; aspect-ratio: 1; border-radius: .6rem; flex: none; }
.ui-thumb--sm svg { width: 1.4rem; height: 1.4rem; }
.ui-name-cell { display: flex; align-items: center; gap: .75rem; }
.ui-pager { display: flex; align-items: center; justify-content: center; gap: .75rem; color: rgb(var(--ui-fg-muted)); font-size: .9rem; }
.ui-filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.ui-filters .ui-input { width: auto; min-width: 9rem; padding: .4rem .7rem; }
.ui-filters .ui-finder { flex: 1 1 14rem; max-width: 24rem; }

.ui-gallery { display: grid; gap: .5rem; }
.ui-gallery-main { aspect-ratio: 4 / 3; border-radius: var(--ui-radius-card); overflow: hidden; background: rgb(var(--ui-surface-sunken)); display: grid; place-items: center; color: rgb(var(--ui-fg-subtle)); }
.ui-gallery-main img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ui-gallery-strip { display: flex; gap: .4rem; overflow-x: auto; padding-bottom: .15rem; }
.ui-gallery-strip button { flex: none; width: 4rem; aspect-ratio: 1; padding: 0; border: 2px solid transparent; border-radius: .6rem; overflow: hidden; background: none; cursor: pointer; opacity: .75; }
.ui-gallery-strip button[aria-current="true"] { border-color: rgb(var(--ui-accent)); opacity: 1; }
.ui-gallery-strip img { width: 100%; height: 100%; object-fit: cover; display: block; }

.ui-dl { display: grid; grid-template-columns: auto 1fr; gap: .45rem 1rem; margin: 0; font-size: .93rem; }
.ui-dl dt { color: rgb(var(--ui-fg-muted)); }
.ui-dl dd { margin: 0; text-align: right; font-weight: 600; overflow-wrap: anywhere; }

.ui-photos { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); }
.ui-photo .ui-badge { justify-self: start; }
.ui-photo { display: grid; gap: .4rem; padding: .5rem; border: 1px solid rgb(var(--ui-line)); border-radius: var(--ui-radius-control); background: rgb(var(--ui-surface)); }
.ui-photo[draggable="true"] { cursor: grab; }
.ui-photo.dragging { opacity: .4; }
.ui-photo .ui-thumb { border-radius: .5rem; }
.ui-photo-actions { display: flex; flex-wrap: wrap; gap: .25rem; }
.ui-photo-actions form { margin: 0; }
.ui-photo-actions .ui-btn { min-height: 1.8rem; padding: .15rem .55rem; font-size: .8rem; }
.ui-dropzone { display: grid; place-items: center; gap: .35rem; padding: 1.5rem 1rem; text-align: center; color: rgb(var(--ui-fg-muted)); border: 1.5px dashed rgb(var(--ui-line-strong)); border-radius: var(--ui-radius-card); background: rgb(var(--ui-surface-sunken) / .5); transition: border-color .15s, background .15s; }
.ui-dropzone.over { border-color: rgb(var(--ui-accent)); background: rgb(var(--ui-accent-soft)); }
.ui-dropzone input[type="file"] { max-width: 100%; }
.ui-dropzone.busy { opacity: .6; pointer-events: none; }

.ui-drawer-scrim { position: fixed; inset: 0; z-index: 40; background: var(--ui-overlay); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.ui-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 41; width: min(30rem, 100%); display: flex; flex-direction: column; background: var(--ui-glass-strong); -webkit-backdrop-filter: var(--ui-glass-filter); backdrop-filter: var(--ui-glass-filter); border-left: 1px solid var(--ui-glass-line); box-shadow: var(--ui-shadow-lg); transform: translateX(105%); visibility: hidden; transition: transform .24s cubic-bezier(.2, .8, .2, 1), visibility 0s .24s; }
.ui-drawer-open .ui-drawer-scrim { opacity: 1; pointer-events: auto; }
.ui-drawer-open .ui-drawer { transform: none; visibility: visible; transition-delay: 0s; }
.ui-drawer-head { display: flex; align-items: center; justify-content: flex-end; padding: .6rem .75rem; flex: none; }
.ui-drawer-content { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.ui-drawer-body { flex: 1; overflow-y: auto; padding: 0 1.25rem 1.5rem; display: grid; gap: 1rem; align-content: start; }
.ui-drawer-body h2 { margin: 0; font-size: 1.3rem; letter-spacing: -.02em; }
.ui-drawer-foot { display: flex; gap: .5rem; padding: .85rem 1.25rem; border-top: 1px solid var(--ui-glass-line); flex: none; }
.ui-drawer-foot .ui-btn:first-child { flex: 1; }
.ui-drawer-loading { color: rgb(var(--ui-fg-muted)); padding: 2rem 0; text-align: center; }
@media (prefers-reduced-motion: reduce) { .ui-drawer, .ui-drawer-scrim, .ui-pcard { transition: none; } }
@media (max-width: 40rem) { .ui-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; } .ui-pcard-body { padding: .65rem .75rem .8rem; } .ui-drawer { width: 100%; } }

/* Chips (año, km), precios compactos y modo seleccionar */
.ui-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.ui-chip { display: inline-flex; align-items: center; padding: .12rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 650; background: rgb(var(--ui-surface-sunken)); color: rgb(var(--ui-fg)); white-space: nowrap; }
.ui-chip--km { background: rgb(var(--ui-accent-soft)); color: rgb(var(--ui-accent-text)); }
.ui-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: .1rem .5rem; }
.ui-price-alt { color: rgb(var(--ui-fg-muted)); font-size: .78rem; font-weight: 500; }
.ui-pcard-meta b { color: rgb(var(--ui-fg)); font-weight: 600; }
.ui-gain { font-weight: 650; color: rgb(var(--ui-success)); }
.ui-gain--neg { color: rgb(var(--ui-danger)); }
.ui-pwrap { position: relative; }
.ui-pwrap > .ui-pcard { height: 100%; }
.ui-pick { display: none; position: absolute; top: .6rem; right: .6rem; z-index: 3; }
.ui-pick input { width: 1.35rem; height: 1.35rem; accent-color: rgb(var(--ui-accent)); cursor: pointer; }
td.ui-pick, th.ui-pick { position: static; width: 2.5rem; }
.is-selecting .ui-pick { display: block; }
.is-selecting td.ui-pick, .is-selecting th.ui-pick { display: table-cell; }
.is-selecting .ui-pcard, .is-selecting tr[data-ui-row] { cursor: pointer; }
.picked > .ui-pcard { outline: 2px solid rgb(var(--ui-accent)); outline-offset: -2px; }
tr.picked td { background: rgb(var(--ui-accent-soft)); }
.ui-bulkbar { display: none; position: sticky; bottom: 1rem; z-index: 30; margin-top: 1rem; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; padding: .7rem 1rem; background: var(--ui-glass-strong); -webkit-backdrop-filter: var(--ui-glass-filter); backdrop-filter: var(--ui-glass-filter); border: 1px solid var(--ui-glass-line); border-radius: var(--ui-radius-card); box-shadow: var(--ui-shadow-lg); }
.is-selecting .ui-bulkbar { display: flex; }
.ui-bulkbar .ui-input { width: auto; max-width: 9rem; padding: .35rem .6rem; }
.ui-bulkbar .ui-bulk-group { display: flex; gap: .4rem; align-items: center; }
.ui-bulkbar [disabled] { opacity: .45; cursor: not-allowed; }
.ui-sample { display: grid; grid-template-columns: 1fr auto auto auto; gap: .35rem .75rem; align-items: center; font-size: .93rem; }
@media (max-width: 40rem) { .ui-bulkbar { bottom: .5rem; } .ui-bulkbar .ui-input { max-width: 6.5rem; } }