:root{
  color-scheme: light;
  --page:#f7f5f0;
  --surface:#ffffff;
  --surface-2:#fbfaf7;
  --ink-1:#15181f;
  --ink-2:#565a63;
  --ink-muted:#8a8d95;
  --accent:#a8752c;
  --accent-ink:#5c3f18;
  --accent-soft:rgba(168,117,44,0.12);
  --border:rgba(21,24,31,0.12);
  --gridline:#e8e6df;
  --shadow: 0 1px 2px rgba(21,24,31,0.05), 0 10px 28px -14px rgba(21,24,31,0.18);
  --c-straight:#2a78d6; --c-skinny:#008300; --c-bootcut:#e87ba4; --c-baggy:#eda100;
  --c-slim:#1baf7a; --c-flare:#eb6834; --c-cargo:#4a3aa7; --c-carpenter:#e34948;
  --g-dama:#b8567e; --g-caballero:#3c6e9c;
  --c-extra-1:#7a6c5d; --c-extra-2:#0f8b8d; --c-extra-3:#b0499b; --c-extra-4:#5d7b2f;
  --s-inv:#7d8696; --s-ven:#a8752c;
  --ok:#1f7a4d; --ok-soft:rgba(31,122,77,0.12);
  --warn:#9a6200; --warn-soft:rgba(237,161,0,0.16);
  --bad:#c0392b; --bad-soft:rgba(208,59,59,0.12);
}
@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){
    color-scheme: dark;
    --page:#0d1015; --surface:#171b22; --surface-2:#1d222b;
    --ink-1:#f3f1ea; --ink-2:#b7bac2; --ink-muted:#82858d;
    --accent:#d7a552; --accent-ink:#f6ddb0; --accent-soft:rgba(215,165,82,0.18);
    --border:rgba(255,255,255,0.12); --gridline:#2b2f37;
    --shadow:0 1px 2px rgba(0,0,0,0.35), 0 10px 28px -14px rgba(0,0,0,0.6);
    --c-straight:#3987e5; --c-skinny:#00a300; --c-bootcut:#d55181; --c-baggy:#c98500;
    --c-slim:#199e70; --c-flare:#d95926; --c-cargo:#9085e9; --c-carpenter:#e66767;
    --g-dama:#e08cae; --g-caballero:#7fb1de;
    --c-extra-1:#a89886; --c-extra-2:#2bb3b5; --c-extra-3:#d27cc1; --c-extra-4:#8fb35a;
    --s-inv:#8e97a8; --s-ven:#d7a552;
    --ok:#5fcf98; --ok-soft:rgba(95,207,152,0.14);
    --warn:#f0b54a; --warn-soft:rgba(240,181,74,0.16);
    --bad:#ff7b6e; --bad-soft:rgba(255,123,110,0.14);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --page:#0d1015; --surface:#171b22; --surface-2:#1d222b;
  --ink-1:#f3f1ea; --ink-2:#b7bac2; --ink-muted:#82858d;
  --accent:#d7a552; --accent-ink:#f6ddb0; --accent-soft:rgba(215,165,82,0.18);
  --border:rgba(255,255,255,0.12); --gridline:#2b2f37;
  --shadow:0 1px 2px rgba(0,0,0,0.35), 0 10px 28px -14px rgba(0,0,0,0.6);
  --c-straight:#3987e5; --c-skinny:#00a300; --c-bootcut:#d55181; --c-baggy:#c98500;
  --c-slim:#199e70; --c-flare:#d95926; --c-cargo:#9085e9; --c-carpenter:#e66767;
  --g-dama:#e08cae; --g-caballero:#7fb1de;
  --c-extra-1:#a89886; --c-extra-2:#2bb3b5; --c-extra-3:#d27cc1; --c-extra-4:#8fb35a;
  --s-inv:#8e97a8; --s-ven:#d7a552;
  --ok:#5fcf98; --ok-soft:rgba(95,207,152,0.14);
  --warn:#f0b54a; --warn-soft:rgba(240,181,74,0.16);
  --bad:#ff7b6e; --bad-soft:rgba(255,123,110,0.14);
}
:root[data-theme="light"]{
  color-scheme: light;
  --page:#f7f5f0; --surface:#ffffff; --surface-2:#fbfaf7;
  --ink-1:#15181f; --ink-2:#565a63; --ink-muted:#8a8d95;
  --accent:#a8752c; --accent-ink:#5c3f18; --accent-soft:rgba(168,117,44,0.12);
  --border:rgba(21,24,31,0.12); --gridline:#e8e6df;
  --c-straight:#2a78d6; --c-skinny:#008300; --c-bootcut:#e87ba4; --c-baggy:#eda100;
  --c-slim:#1baf7a; --c-flare:#eb6834; --c-cargo:#4a3aa7; --c-carpenter:#e34948;
  --g-dama:#b8567e; --g-caballero:#3c6e9c;
  --c-extra-1:#7a6c5d; --c-extra-2:#0f8b8d; --c-extra-3:#b0499b; --c-extra-4:#5d7b2f;
  --s-inv:#7d8696; --s-ven:#a8752c;
  --ok:#1f7a4d; --ok-soft:rgba(31,122,77,0.12);
  --warn:#9a6200; --warn-soft:rgba(237,161,0,0.16);
  --bad:#c0392b; --bad-soft:rgba(208,59,59,0.12);
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--page);
  color:var(--ink-1);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100%;
}
a{ color:inherit; }

.wrap{ max-width:920px; margin:0 auto; padding:0 clamp(12px,4vw,16px) 48px; }

header.top{ padding:clamp(16px,5vw,22px) clamp(12px,4vw,16px) 14px; max-width:920px; margin:0 auto; }
.eyebrow{
  font-size:11.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--accent); margin:0 0 6px;
}
h1{
  font-size:clamp(21px,5vw,28px); line-height:1.15; margin:0 0 6px; font-weight:700;
  letter-spacing:-0.01em; text-wrap:balance;
}
.sub{ font-size:13.5px; color:var(--ink-2); margin:0; line-height:1.5; }
.sub b{ color:var(--ink-1); font-weight:600; }

.filterbar{
  position:sticky; top:0; z-index:20;
  background:color-mix(in srgb, var(--page) 88%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  padding:10px clamp(12px,4vw,16px);
}
.filterbar-inner{ max-width:920px; margin:0 auto; display:flex; align-items:center; gap:10px; }
.filterbar label{ font-size:12px; font-weight:600; color:var(--ink-2); white-space:nowrap; }
.filters select, .dlg select, .dlg input[type=date], .dlg input[type=number], .f-dates input{
  flex:1; min-width:0;
  appearance:none; -webkit-appearance:none;
  background:var(--surface) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6"><path d="M0 0 L5 6 L10 0" fill="none" stroke="%23898781" stroke-width="1.5"/></svg>') no-repeat right 14px center;
  border:1px solid var(--border); border-radius:10px;
  color:var(--ink-1); font-size:15px; font-weight:600;
  padding:9px 34px 9px 12px;
  min-height:40px; width:100%;
}
.filters select:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }

section{ margin-top:20px; }

.genderblock{ margin-top:28px; }
.genderblock:first-of-type{ margin-top:20px; }
.gendertitle{
  display:flex; align-items:center; gap:8px;
  font-size:16px; font-weight:700; letter-spacing:-0.01em;
  margin-bottom:12px;
}
.gendertitle .gdot{ width:10px; height:10px; border-radius:50%; flex:none; }
.genderblock .tablecard{ margin-top:14px; }

.stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(6px,2vw,10px); }
.stat{
  background:var(--surface); border:1px solid var(--border); border-radius:12px;
  padding:clamp(10px,3vw,14px); box-shadow:var(--shadow); min-width:0;
}
.stat .label{
  font-size:10px; font-weight:600; color:var(--ink-muted); text-transform:uppercase; letter-spacing:0.03em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.stat .value{ font-size:clamp(17px,5vw,26px); font-weight:700; margin-top:4px; font-variant-numeric:proportional-nums; white-space:nowrap; }
.stat .value small{ font-size:11px; font-weight:600; color:var(--ink-muted); margin-left:2px;}
@media (min-width:420px){
  .stat .label{ font-size:11px; letter-spacing:0.05em; }
}

.charts{ display:grid; grid-template-columns:1fr; gap:14px; }
@media (min-width:680px){ .charts{ grid-template-columns:1fr 1fr; } }

.card{
  background:var(--surface); border:1px solid var(--border); border-radius:16px;
  padding:clamp(14px,4vw,18px) clamp(14px,4vw,18px) clamp(12px,3vw,16px); box-shadow:var(--shadow);
}
.card h2{ font-size:15px; margin:0 0 2px; font-weight:700; }
.card .cardsub{ font-size:12px; color:var(--ink-muted); margin:0 0 14px; }

.piewrap{ display:flex; justify-content:center; }
svg.pie{ width:100%; max-width:200px; height:auto; overflow:visible; }
.wedge{ cursor:pointer; transition:filter .12s ease, opacity .12s ease; }
.wedge:hover{ filter:brightness(1.06); }
.wedge.dim{ opacity:0.35; }
.wedge.active{ filter:brightness(1.08); }
.wlabel{ font-size:10.5px; font-weight:700; pointer-events:none; font-variant-numeric:tabular-nums; }

.detail{
  margin-top:12px; min-height:20px; font-size:13px; color:var(--ink-2);
  text-align:center; font-variant-numeric:tabular-nums;
}
.detail b{ color:var(--ink-1); }
.detail .dot{ display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:6px; vertical-align:middle; border:1px solid var(--border); }

.legend{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:1px; }
.legend li{
  display:flex; align-items:center; gap:9px; padding:9px 6px; border-radius:8px;
  cursor:pointer; font-size:13px; min-height:40px;
}
.legend li:hover, .legend li.active{ background:var(--surface-2); }
.legend .sw{ width:11px; height:11px; border-radius:3px; flex:none; border:1px solid var(--border); }
.legend .name{ flex:1; color:var(--ink-1); font-weight:600; }
.legend .pct{ color:var(--ink-muted); font-variant-numeric:tabular-nums; font-size:12.5px; width:38px; text-align:right; }
.legend .qty{ color:var(--ink-2); font-variant-numeric:tabular-nums; font-size:12.5px; min-width:56px; white-space:nowrap; text-align:right; }

.tablecard{ padding:0; overflow:hidden; }
.tablecard .tchead{ padding:clamp(14px,4vw,18px) clamp(14px,4vw,18px) 4px; }
.scrollbox{ overflow-x:auto; padding:6px 6px 4px; -webkit-overflow-scrolling:touch; }
table{ border-collapse:collapse; width:100%; min-width:380px; font-size:13px; }
thead th{
  position:sticky; top:0; background:var(--surface);
  font-size:10.5px; text-transform:uppercase; letter-spacing:0.04em; color:var(--ink-muted);
  font-weight:700; text-align:right; padding:9px 10px; border-bottom:1px solid var(--gridline);
}
thead th.corte-h{ text-align:left; }
tbody td{ padding:9px 10px; text-align:right; font-variant-numeric:tabular-nums; border-bottom:1px solid var(--gridline); color:var(--ink-1); }
tbody td.corte-cell{ text-align:left; font-weight:600; white-space:nowrap; }
tbody td.corte-cell .sw{ display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:7px; vertical-align:-1px; border:1px solid var(--border); }
tbody tr:last-child td{ border-bottom:none; }
tbody tr.totals td{ font-weight:700; background:var(--surface-2); border-top:1px solid var(--gridline); }
tbody tr.empty td{ color:var(--ink-muted); font-weight:400; font-style:normal; }

footer{ margin-top:22px; padding-top:14px; border-top:1px solid var(--border); font-size:11.5px; color:var(--ink-muted); line-height:1.6; }

@media (prefers-reduced-motion: reduce){ .wedge{ transition:none; } }

.lock{
  position:fixed; inset:0; z-index:100;
  background:var(--page);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.lock[hidden]{ display:none; }
.lock-card{
  width:100%; max-width:320px;
  background:var(--surface); border:1px solid var(--border); border-radius:16px;
  box-shadow:var(--shadow); padding:26px 24px 22px; text-align:center;
}
.lock-eyebrow{
  font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--accent); margin:0 0 8px;
}
.lock-card h1{ font-size:18px; margin:0 0 6px; font-weight:700; }
.lock-card p{ font-size:13px; color:var(--ink-2); margin:0 0 18px; line-height:1.5; }
.lock-card input{
  width:100%; text-align:center; font-size:15px; font-weight:600; letter-spacing:0.02em;
  background:var(--surface-2); border:1px solid var(--border); border-radius:10px;
  padding:12px 14px; color:var(--ink-1); box-sizing:border-box;
}
.lock-card input:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.lock-card button{
  width:100%; margin-top:10px; font-size:14.5px; font-weight:700;
  background:var(--accent); color:var(--surface); border:none; border-radius:10px;
  padding:12px 14px; cursor:pointer;
}
.lock-card button:hover{ filter:brightness(1.05); }
.lock-error{ min-height:18px; font-size:12.5px; color:#d03b3b; margin-top:10px; }
.app[hidden]{ display:none; }

@media (min-width:680px){ .stats{ grid-template-columns:repeat(4,1fr); } }
.stat .chip{ margin-top:6px; }

/* ---------- Cabecera ---------- */
.top-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.top-actions{ display:flex; gap:8px; flex:none; }
.btn{
  font:inherit; font-size:13px; font-weight:600; cursor:pointer;
  background:var(--surface); color:var(--ink-1);
  border:1px solid var(--border); border-radius:10px; padding:8px 12px; min-height:36px;
}
.btn:hover{ background:var(--surface-2); }
.btn-accent{ background:var(--accent); color:var(--surface); border-color:transparent; }
.btn-accent:hover{ background:var(--accent); filter:brightness(1.05); }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.btn:focus-visible, .seg button:focus-visible, .link:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.link{ font:inherit; font-size:12.5px; font-weight:600; background:none; border:none; padding:4px 2px; color:var(--accent); cursor:pointer; }
.link.danger{ color:var(--bad); }
.boot{ padding:40px 16px; text-align:center; color:var(--ink-muted); font-size:14px; }
.boot[hidden]{ display:none; }

/* ---------- Filtros ---------- */
.filters{ margin-top:4px; padding:14px; }
.f-grid{ display:grid; grid-template-columns:1fr; gap:12px 16px; }
@media (min-width:680px){ .f-grid{ grid-template-columns:1fr 1fr; } .f-wide{ grid-column:1 / -1; } }
.f-item{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.f-item > label, .f-label{ font-size:11px; font-weight:700; color:var(--ink-muted); text-transform:uppercase; letter-spacing:0.05em; }
.seg{ display:flex; flex-wrap:wrap; gap:4px; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:3px; }
.seg button{
  flex:1 1 auto; font:inherit; font-size:13px; font-weight:600; color:var(--ink-2);
  background:transparent; border:none; border-radius:8px; padding:7px 10px; min-height:34px; cursor:pointer; white-space:nowrap;
}
.seg button:hover{ color:var(--ink-1); }
.seg button.on{ background:var(--surface); color:var(--ink-1); box-shadow:0 1px 2px rgba(0,0,0,.12); }
.f-dates{ display:flex; flex-wrap:wrap; gap:8px 14px; font-size:12.5px; color:var(--ink-2); }
.f-dates[hidden]{ display:none; }
.f-dates label{ display:flex; align-items:center; gap:6px; }
.f-dates input{ width:auto; min-height:36px; padding:6px 10px; background-image:none; }

.multi{ position:relative; }
.multi summary{
  list-style:none; cursor:pointer; font-size:14px; font-weight:600;
  background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:9px 12px; min-height:40px;
}
.multi summary::-webkit-details-marker{ display:none; }
.multi summary::after{ content:"▾"; float:right; color:var(--ink-muted); }
.multi-panel{
  position:absolute; z-index:30; left:0; right:0; margin-top:4px;
  background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow); padding:8px;
}
.multi-actions{ display:flex; gap:12px; padding:0 4px 6px; border-bottom:1px solid var(--gridline); margin-bottom:6px; }
.multi-list{ max-height:260px; overflow:auto; display:grid; grid-template-columns:repeat(auto-fill, minmax(110px, 1fr)); gap:2px; }
.multi-list label{ display:flex; align-items:center; gap:6px; font-size:13px; padding:6px; border-radius:6px; cursor:pointer; }
.multi-list label:hover{ background:var(--surface-2); }

/* ---------- Avisos y chips ---------- */
.notice{ margin-top:14px; font-size:13px; line-height:1.45; border-radius:10px; padding:10px 12px; background:var(--accent-soft); color:var(--ink-1); }
.notice[hidden]{ display:none; }
.notice.error{ background:var(--bad-soft); color:var(--bad); }
.notice.ok{ background:var(--ok-soft); color:var(--ok); }
.chip{ display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.02em; border-radius:999px; padding:2px 7px; margin-left:6px; vertical-align:middle; white-space:nowrap; }
.chip-quiebre{ background:var(--bad-soft); color:var(--bad); }
.chip-sobre{ background:var(--warn-soft); color:var(--warn); }
.chip-sin{ background:var(--surface-2); color:var(--ink-2); border:1px solid var(--border); }
td.cob{ white-space:nowrap; }

/* ---------- Barras de talla ---------- */
.bars-legend{ display:flex; gap:14px; font-size:12px; color:var(--ink-2); margin:-6px 0 10px; }
.bars-legend span{ display:flex; align-items:center; gap:6px; }
.bars-legend .sw{ width:11px; height:11px; border-radius:3px; display:inline-block; }
.sw-inv, .bar-inv{ background:var(--s-inv); }
.sw-ven, .bar-ven{ background:var(--s-ven); }
.bars{ display:flex; flex-direction:column; gap:8px; }
.bar-row{ display:grid; grid-template-columns:52px 1fr; gap:10px; align-items:center; }
.bar-label{ font-size:13px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }
.bar-tracks{ display:flex; flex-direction:column; gap:3px; }
.bar-track{ position:relative; height:16px; display:flex; align-items:center; gap:6px; }
.bar-fill{ height:100%; border-radius:3px; min-width:2px; }
.bar-val{ font-size:11px; color:var(--ink-2); white-space:nowrap; font-variant-numeric:tabular-nums; }

/* ---------- Diálogo de carga ---------- */
.dlg{
  width:min(760px, calc(100vw - 24px)); max-height:calc(100vh - 24px); padding:0;
  border:1px solid var(--border); border-radius:16px; background:var(--surface); color:var(--ink-1); box-shadow:var(--shadow);
}
.dlg::backdrop{ background:rgba(10,12,16,.45); }
.dlg-inner{ display:flex; flex-direction:column; max-height:calc(100vh - 26px); }
.dlg-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; border-bottom:1px solid var(--border); }
.dlg-head h2{ margin:0; font-size:17px; }
.dlg-body{ padding:14px 16px 18px; overflow:auto; }
.dlg h3{ font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-muted); margin:20px 0 6px; }
.dlg .hint{ font-size:12.5px; color:var(--ink-2); margin:6px 0; line-height:1.45; }
.dlg-actions{ display:flex; justify-content:flex-end; margin-top:12px; }
.file{ display:block; margin-top:12px; border:1.5px dashed var(--border); border-radius:12px; padding:14px; text-align:center; cursor:pointer; background:var(--surface-2); }
.file input{ display:block; margin:0 auto 6px; font-size:13px; max-width:100%; }
.file span{ font-size:12.5px; color:var(--ink-muted); }
.cg-row{ display:flex; flex-wrap:wrap; gap:10px 16px; margin-top:12px; }
.cg-row[hidden], #cgConfig[hidden], #cgHojaWrap[hidden]{ display:none; }
.cg-row label{ display:flex; flex-direction:column; gap:4px; font-size:12px; font-weight:600; color:var(--ink-2); }
.cg-row input, .cg-row select{ width:auto; min-width:150px; }
.cg-map{ display:grid; grid-template-columns:1fr; gap:8px 14px; }
@media (min-width:560px){ .cg-map{ grid-template-columns:1fr 1fr; } }
.cg-map-item{ display:flex; flex-direction:column; gap:4px; font-size:12px; font-weight:600; color:var(--ink-2); }
.cg-stats{ display:grid; grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); gap:8px; }
.cg-stats div{ background:var(--surface-2); border:1px solid var(--border); border-radius:10px; padding:8px 10px; display:flex; flex-direction:column; }
.cg-stats b{ font-size:16px; font-variant-numeric:tabular-nums; }
.cg-stats span{ font-size:11px; color:var(--ink-muted); }
.cg-excl{ font-size:12.5px; color:var(--ink-2); margin:10px 0; padding-left:18px; }
.cg-tabla{ min-width:0; margin-top:8px; font-size:12.5px; }
.cg-tabla td, .cg-tabla th{ padding:6px 8px; }
.cg-tabla td:first-child, .cg-tabla th:first-child{ text-align:left; }
.cg-estado p{ font-size:13px; margin:6px 0; }
.cg-log{ margin-top:10px; font-size:12.5px; color:var(--ink-2); }
.cg-log summary{ cursor:pointer; font-weight:600; }
.cg-log ul{ padding-left:18px; }
.dlg input[type=date], .dlg input[type=number], .f-dates input{ background-image:none; padding-right:12px; }
.cg-plantilla{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin-top:4px; }
.cg-plantilla .hint{ margin:0; }