/* =====================================================================
   Plenum — hoja de estilo única.
   Claro y oscuro. Pensado primero para el celular.
   ===================================================================== */
:root{
  --ground:#e9edeb; --surface:#fafcfb; --surface-2:#f2f5f3;
  --line:#ccd5d1; --line-soft:#e0e6e3;
  --ink:#16232a; --ink-soft:#4c5c60; --ink-faint:#7f8e8f;
  --accent:#a8552a; --accent-soft:#f0e2d8; --on-accent:#fff;
  --series:#a8552a; --reference:#8c9a9c;
  --good:#0ca30c; --warning:#fab219; --serious:#ec835a; --critical:#d03b3b;
  --warn-ink:#8a6100;
  --shadow:0 1px 2px rgba(22,35,42,.05), 0 4px 14px rgba(22,35,42,.045);
  --sans:'Archivo','Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono','SFMono-Regular',Menlo,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#0e1417; --surface:#182226; --surface-2:#1e2a2e;
    --line:#2d3b40; --line-soft:#243035;
    --ink:#e6edea; --ink-soft:#a7b6b4; --ink-faint:#78888b;
    --accent:#dd8a52; --accent-soft:#33241a; --on-accent:#16232a;
    --series:#d95926; --reference:#7d8b8e; --warn-ink:#fab219;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ground:#0e1417; --surface:#182226; --surface-2:#1e2a2e;
  --line:#2d3b40; --line-soft:#243035;
  --ink:#e6edea; --ink-soft:#a7b6b4; --ink-faint:#78888b;
  --accent:#dd8a52; --accent-soft:#33241a; --on-accent:#16232a;
  --series:#d95926; --reference:#7d8b8e; --warn-ink:#fab219;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35);
  color-scheme:dark;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--ground); color:var(--ink);
  font-family:var(--sans); font-size:15px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
  padding-top:env(safe-area-inset-top,0px);
}
[hidden]{display:none !important;}
img{max-width:100%;}
.mono{font-family:var(--mono);}
.num{font-variant-numeric:tabular-nums;}
a{color:var(--accent);}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px;}

/* ---------- arranque ---------- */
.boot{
  min-height:70vh; display:grid; place-content:center; justify-items:center;
  gap:14px; color:var(--ink-faint); font-size:14px;
}
.boot-mark{
  width:26px;height:26px;border-radius:5px;background:var(--accent);
  animation:pulse 1.1s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:.35;transform:scale(.9);}50%{opacity:1;transform:scale(1);}}
@media (prefers-reduced-motion:reduce){.boot-mark{animation:none;opacity:.7;}}

/* ---------- marca ---------- */
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:17px;letter-spacing:-.02em;}
.brand .mark{width:19px;height:19px;border-radius:3px;background:var(--accent);
  display:grid;place-items:center;flex:none;}
.brand .mark::after{content:"";width:7px;height:7px;border-radius:1px;
  background:var(--surface);transform:rotate(45deg);}

/* ---------- entrar ---------- */
.login{min-height:82vh;display:grid;place-content:center;padding:24px;}
.login-card{
  width:min(400px,100%); background:var(--surface);
  border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow);
  padding:28px 24px;
}
.login .brand{margin-bottom:22px;}
.login h1{font-size:20px;margin:0 0 6px;letter-spacing:-.01em;}
.login p.sub{margin:0 0 20px;color:var(--ink-faint);font-size:14px;}
label{display:block;font-size:12px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-faint);font-family:var(--mono);margin-bottom:6px;}
input[type=email],input[type=text]{
  width:100%;padding:11px 12px;font-size:16px;font-family:var(--sans);
  background:var(--surface-2);color:var(--ink);
  border:1px solid var(--line);border-radius:6px;
}
input::placeholder{color:var(--ink-faint);}
.btn{
  width:100%;margin-top:16px;padding:12px 16px;font-size:15px;font-weight:600;
  font-family:var(--sans);background:var(--accent);color:var(--on-accent);
  border:none;border-radius:6px;cursor:pointer;
}
.btn:hover{filter:brightness(1.07);}
.btn:disabled{opacity:.55;cursor:default;filter:none;}
.btn.ghost{background:none;color:var(--ink-soft);border:1px solid var(--line);}
.note{margin-top:16px;font-size:13px;color:var(--ink-faint);line-height:1.55;}
.msg{margin-top:16px;padding:11px 13px;border-radius:6px;font-size:13.5px;line-height:1.5;}
.msg.ok{background:color-mix(in srgb,var(--good) 12%,transparent);color:var(--ink);}
.msg.bad{background:color-mix(in srgb,var(--critical) 12%,transparent);color:var(--ink);}

/* ---------- barra superior ---------- */
.topbar{
  background:var(--surface);border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:20px;padding:0 16px;height:56px;
  position:sticky;top:env(safe-area-inset-top,0px);z-index:20;
}
.topbar nav{display:none;gap:2px;flex:1;overflow-x:auto;}
.topbar nav a{color:var(--ink-soft);text-decoration:none;font-size:14px;font-weight:500;
  padding:7px 11px;border-radius:5px;white-space:nowrap;}
.topbar nav a:hover{background:var(--surface-2);color:var(--ink);}
.topbar nav a[aria-current]{background:var(--accent-soft);color:var(--accent);font-weight:600;}
.spacer{flex:1;}
.avatar{
  width:30px;height:30px;border-radius:50%;flex:none;border:none;cursor:pointer;
  background:var(--accent);color:var(--on-accent);
  display:grid;place-items:center;font-size:12px;font-weight:700;font-family:var(--sans);
}

/* ---------- barra inferior (celular) ---------- */
.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:25;
  background:var(--surface);border-top:1px solid var(--line);
  display:grid;grid-auto-flow:column;grid-auto-columns:1fr;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
.tabbar a{
  display:grid;justify-items:center;gap:3px;padding:8px 2px 7px;
  color:var(--ink-faint);text-decoration:none;font-size:10.5px;font-weight:600;
}
.tabbar a[aria-current]{color:var(--accent);}
.tabbar svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;}

/* ---------- agenda ---------- */
.daybar{display:flex;align-items:center;gap:8px;padding:11px 15px;border-bottom:1px solid var(--line-soft);}
.daybar .nav{background:none;border:1px solid var(--line);color:var(--ink-soft);border-radius:6px;
  width:32px;height:32px;font-size:18px;line-height:1;cursor:pointer;flex:none;}
.daybar .nav:hover{background:var(--surface-2);}
.daybar .dayname{flex:1;text-align:center;font-weight:600;font-size:14.5px;}
.daybar .dayname::first-letter{text-transform:uppercase;}
.week{display:grid;grid-template-columns:repeat(7,1fr);}
.week button{background:none;border:none;border-right:1px solid var(--line-soft);
  padding:9px 2px 10px;display:grid;justify-items:center;gap:2px;cursor:pointer;color:var(--ink-soft);}
.week button:last-child{border-right:none;}
.week button:hover{background:var(--surface-2);}
.week .l{font-family:var(--mono);font-size:10px;text-transform:uppercase;color:var(--ink-faint);}
.week .d{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;}
.week .n{font-family:var(--mono);font-size:10.5px;color:var(--accent);min-height:13px;}
.week button.today .d{color:var(--accent);}
.week button.on{background:var(--surface-2);box-shadow:inset 0 -2px 0 var(--accent);}
.check{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:14.5px;cursor:pointer;}
.check input{width:17px;height:17px;accent-color:var(--accent);}

main{padding:16px 14px 92px;max-width:1240px;margin:0 auto;}

.pageline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
h1{font-size:20px;font-weight:700;margin:0;letter-spacing:-.01em;}
.datestamp{font-size:12.5px;color:var(--ink-faint);}

/* ---------- tarjetas ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow);}
.card-head{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--line-soft);}
.card-head h2{font-size:12px;font-weight:600;margin:0;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-faint);font-family:var(--mono);}
.card-head .side{margin-left:auto;font-size:12.5px;color:var(--ink-faint);}
.empty{padding:22px 16px;color:var(--ink-faint);font-size:13.5px;text-align:center;line-height:1.6;}

.grid{display:grid;grid-template-columns:1fr;gap:14px;align-items:start;}
.stack{display:flex;flex-direction:column;gap:14px;}

/* ---------- periodo + dinero ---------- */
.tabs{display:flex;gap:3px;margin-left:auto;}
.tabs button{
  font-family:var(--mono);font-size:11.5px;background:none;
  border:1px solid transparent;color:var(--ink-faint);
  padding:4px 9px;border-radius:4px;cursor:pointer;
}
.tabs button:hover{color:var(--ink);background:var(--surface-2);}
.tabs button[aria-selected="true"]{
  background:var(--accent-soft);color:var(--accent);
  border-color:color-mix(in srgb,var(--accent) 25%,transparent);font-weight:600;
}
.money{display:grid;grid-template-columns:1fr;}
.money > div{padding:16px 15px;border-bottom:1px solid var(--line-soft);}
.money > div:last-child{border-bottom:none;}
.m-label{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-faint);display:block;margin-bottom:6px;}
.m-value{font-size:clamp(22px,6vw,29px);font-weight:700;letter-spacing:-.02em;line-height:1.1;}
.m-value.profit{color:var(--accent);}
.m-note{font-size:12.5px;color:var(--ink-faint);margin-top:5px;}

/* ---------- por cobrar ---------- */
.ar-top{padding:15px;display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;}
.ar-total{font-size:27px;font-weight:700;letter-spacing:-.02em;line-height:1;}
.ar-over{margin-left:auto;text-align:right;}
.ar-over .v{font-size:16px;font-weight:700;color:var(--critical);line-height:1.2;}
.ar-over .l{font-size:11.5px;color:var(--ink-faint);font-family:var(--mono);}
.aging{border-top:1px solid var(--line-soft);}
.aging-row{display:grid;grid-template-columns:72px 1fr 82px;align-items:center;gap:10px;
  padding:9px 15px;font-size:13px;}
.aging-row + .aging-row{border-top:1px solid var(--line-soft);}
.aging-row .b{font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);}
.aging-row .v{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;}
.bar{height:7px;border-radius:2px;background:var(--surface-2);overflow:hidden;}
.bar i{display:block;height:100%;border-radius:2px;}

/* ---------- listas ---------- */
.row{display:flex;align-items:center;gap:12px;padding:12px 15px;border-top:1px solid var(--line-soft);}
.row:first-of-type{border-top:none;}
.time{font-family:var(--mono);font-size:12.5px;color:var(--ink-faint);min-width:56px;flex:none;
  font-variant-numeric:tabular-nums;}
.row .body{min-width:0;flex:1;}
.row .t{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.row .s{font-size:12.5px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.row .amt{font-weight:600;font-variant-numeric:tabular-nums;font-size:14px;flex:none;}

.pill{display:inline-flex;align-items:center;gap:5px;flex:none;font-family:var(--mono);
  font-size:11px;font-weight:600;padding:3px 8px;border-radius:3px;letter-spacing:.02em;}
.pill.crit{color:var(--critical);background:color-mix(in srgb,var(--critical) 13%,transparent);}
.pill.warn{color:var(--warn-ink);background:color-mix(in srgb,var(--warning) 22%,transparent);}
.pill.ok{color:var(--good);background:color-mix(in srgb,var(--good) 13%,transparent);}

.counts{display:grid;grid-template-columns:1fr 1fr;}
.counts > div{padding:15px;border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);}
.counts > div:nth-child(2n){border-right:none;}
.counts .n{font-size:22px;font-weight:700;letter-spacing:-.02em;}
.counts .v{font-size:12.5px;color:var(--ink-soft);margin-top:2px;font-variant-numeric:tabular-nums;}

/* ---------- gráfica ---------- */
.chart-wrap{padding:14px 10px 6px;overflow-x:auto;}
.chart-wrap svg{width:100%;min-width:420px;height:auto;display:block;}
.legend{display:flex;gap:16px;padding:0 15px 14px;font-size:12.5px;color:var(--ink-soft);flex-wrap:wrap;}
.legend span{display:inline-flex;align-items:center;gap:6px;}
.swatch{width:14px;height:3px;border-radius:2px;display:inline-block;}

.footnote{margin-top:20px;font-size:12.5px;color:var(--ink-faint);max-width:70ch;line-height:1.6;}

/* ---------- pantallas grandes ---------- */
@media (min-width:900px){
  main{padding:20px 22px 56px;}
  .topbar{gap:26px;padding:0 22px;}
  .topbar nav{display:flex;}
  .tabbar{display:none;}
  main{padding-bottom:56px;}
  .grid{grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);gap:16px;}
  .money{grid-template-columns:repeat(3,1fr);}
  .money > div{border-bottom:none;border-right:1px solid var(--line-soft);padding:18px 16px;}
  .money > div:last-child{border-right:none;}
  h1{font-size:21px;}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;}}

/* =====================================================================
   Listas, fichas y formularios
   ===================================================================== */
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap;}
.card + .toolbar{margin-top:14px;}
.search{flex:1;min-width:180px;position:relative;}
.search input{padding-left:34px;}
.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);
  width:15px;height:15px;stroke:var(--ink-faint);fill:none;stroke-width:2;}
.btn-sm{
  padding:10px 14px;font-size:14px;font-weight:600;font-family:var(--sans);
  background:var(--accent);color:var(--on-accent);border:none;border-radius:6px;
  cursor:pointer;white-space:nowrap;flex:none;
}
.btn-sm:hover{filter:brightness(1.07);}
.btn-sm.ghost{background:none;color:var(--ink-soft);border:1px solid var(--line);}
.btn-sm.ghost:hover{background:var(--surface-2);filter:none;}
.btn-row{display:flex;gap:9px;margin-top:18px;flex-wrap:wrap;}
.btn-row .btn-sm{flex:1;min-width:130px;}

a.rowlink{display:block;color:inherit;text-decoration:none;}
a.rowlink:hover{background:var(--surface-2);}
.row .chev{width:16px;height:16px;flex:none;stroke:var(--ink-faint);fill:none;stroke-width:2;}

.badge{
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;padding:2px 7px;border-radius:3px;flex:none;
  background:var(--surface-2);color:var(--ink-faint);border:1px solid var(--line-soft);
}
.badge.pm{background:var(--accent-soft);color:var(--accent);border-color:transparent;}

.backlink{
  display:inline-flex;align-items:center;gap:5px;font-size:13.5px;color:var(--ink-soft);
  text-decoration:none;margin-bottom:10px;
}
.backlink:hover{color:var(--ink);}
.backlink svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;}

.facts{display:grid;gap:0;}
.fact{display:flex;gap:12px;padding:11px 15px;border-top:1px solid var(--line-soft);font-size:14px;}
.fact:first-child{border-top:none;}
.fact dt{color:var(--ink-faint);width:104px;flex:none;font-size:13px;}
.fact dd{margin:0;min-width:0;word-break:break-word;}
.fact a{text-decoration:none;}

.form{padding:15px;display:grid;gap:14px;}
.field{display:grid;gap:6px;align-content:start;}
.field textarea{
  width:100%;padding:11px 12px;font-size:16px;font-family:var(--sans);
  background:var(--surface-2);color:var(--ink);border:1px solid var(--line);
  border-radius:6px;resize:vertical;min-height:72px;
}
.field select{
  width:100%;padding:11px 12px;font-size:16px;font-family:var(--sans);
  background:var(--surface-2);color:var(--ink);border:1px solid var(--line);border-radius:6px;
}
.field .hint{font-size:12.5px;color:var(--ink-faint);}
.two{display:grid;grid-template-columns:1fr;gap:14px;}
@media (min-width:640px){ .two{grid-template-columns:1fr 1fr;} .two.thirds{grid-template-columns:2fr 1fr 1fr;} }
.form .msg{margin-top:0;}

/* ---------- estimados ---------- */
.lineas .row{align-items:flex-start;}
.lineas .qty{width:52px;flex:none;}
.lineas input[type=number]{
  width:100%;padding:7px 8px;font-size:14px;font-family:var(--mono);
  background:var(--surface-2);color:var(--ink);border:1px solid var(--line);
  border-radius:5px;text-align:right;font-variant-numeric:tabular-nums;
}
.lineas .price{width:104px;flex:none;}
.lineas .kill{
  background:none;border:none;color:var(--ink-faint);cursor:pointer;
  font-size:17px;line-height:1;padding:4px 2px;flex:none;
}
.lineas .kill:hover{color:var(--critical);}
.addline{padding:13px 15px;border-top:1px solid var(--line-soft);display:grid;gap:9px;}
@media (min-width:640px){ .addline{grid-template-columns:1fr 70px auto;align-items:end;} }

.sum{display:grid;}
.sum > div{padding:14px 15px;border-bottom:1px solid var(--line-soft);display:flex;
  align-items:baseline;gap:12px;}
.sum > div:last-child{border-bottom:none;}
.sum .k{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-faint);width:96px;flex:none;}
.sum .n{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em;}
.sum .tag{margin-left:auto;font-family:var(--mono);font-size:12px;font-weight:600;
  padding:3px 8px;border-radius:3px;}
.tag.good{color:var(--good);background:color-mix(in srgb,var(--good) 13%,transparent);}
.tag.warn{color:var(--warn-ink);background:color-mix(in srgb,var(--warning) 22%,transparent);}
.tag.crit{color:var(--critical);background:color-mix(in srgb,var(--critical) 13%,transparent);}

.dep .row{gap:10px;}
.dep .row.pick{background:var(--accent-soft);}
.dep .t{font-size:13.5px;font-weight:600;}
.dep .s{font-size:12px;}
.alerta{padding:12px 15px;border-top:1px solid var(--line-soft);font-size:13px;
  color:var(--ink);background:color-mix(in srgb,var(--warning) 14%,transparent);line-height:1.5;}
.status-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px;}

/* ---------- ajustes ---------- */
.who-wrap{position:relative;flex:none;}
.menu{
  position:absolute;right:0;top:38px;z-index:40;min-width:186px;
  background:var(--surface);border:1px solid var(--line);border-radius:6px;
  box-shadow:var(--shadow);overflow:hidden;padding:4px;
}
.menu a,.menu button{
  display:block;width:100%;text-align:left;padding:9px 11px;border-radius:4px;
  font-size:14px;font-family:var(--sans);color:var(--ink);text-decoration:none;
  background:none;border:none;cursor:pointer;
}
.menu a:hover,.menu button:hover{background:var(--surface-2);}
.menu button{color:var(--ink-soft);border-top:1px solid var(--line-soft);
  border-radius:0 0 4px 4px;margin-top:4px;padding-top:11px;}

.cat-head{
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-faint);padding:11px 15px 5px;
  border-top:1px solid var(--line-soft);background:var(--surface-2);
}
.cat-head:first-child{border-top:none;}
.sum .k br{display:none;}
@media (min-width:640px){ .sum .k br{display:inline;} }

/* ---------- desglose del estimado ---------- */
.sum > .desglose{display:block;padding:10px 15px 12px;}
.desglose{
  padding:0 0 2px;border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);
  margin:2px 0 4px;
}
.desglose > div{
  display:flex;align-items:baseline;gap:10px;padding:5px 0;font-size:13px;
  color:var(--ink-soft);
}
.desglose > div > span{flex:1;padding-left:14px;}
.desglose > div > b{font-variant-numeric:tabular-nums;font-weight:600;}
.desglose .tot{color:var(--ink);font-weight:600;border-top:1px solid var(--line-soft);
  margin-top:3px;padding-top:7px;}
.desglose .tot > span{padding-left:0;}
#c-desc .field{gap:6px;}
#c-desc input{font-family:var(--mono);font-variant-numeric:tabular-nums;}

/* ---------- campana de avisos ---------- */
.camp-wrap{position:relative;flex:none;margin-right:2px;}
.camp{
  position:relative;width:32px;height:32px;border:none;background:none;cursor:pointer;
  display:grid;place-items:center;border-radius:6px;color:var(--ink-soft);
}
.camp:hover{background:var(--surface-2);}
.camp svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;}
.camp.tiene{color:var(--accent);}
.camp-num{
  position:absolute;top:1px;right:1px;min-width:15px;height:15px;padding:0 3px;
  border-radius:8px;background:var(--accent);color:var(--on-accent);
  font-family:var(--sans);font-size:9.5px;font-weight:700;line-height:15px;
  text-align:center;border:1.5px solid var(--surface);
}
.camp-caja{
  position:absolute;right:0;top:38px;z-index:40;width:min(340px,calc(100vw - 24px));
  background:var(--surface);border:1px solid var(--line);border-radius:6px;
  box-shadow:var(--shadow);overflow:hidden;
}
.camp-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 11px;border-bottom:1px solid var(--line-soft);background:var(--surface-2);
}
.camp-head b{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-faint);}
#camp-lista{max-height:min(60vh,420px);overflow-y:auto;}
.camp-row{
  display:flex;gap:9px;padding:10px 11px;text-decoration:none;color:var(--ink);
  border-bottom:1px solid var(--line-soft);align-items:flex-start;
}
.camp-row:last-child{border-bottom:none;}
.camp-row:hover{background:var(--surface-2);}
.camp-row.nuevo{background:color-mix(in srgb,var(--accent) 7%,transparent);}
.camp-row.nuevo:hover{background:color-mix(in srgb,var(--accent) 12%,transparent);}
.camp-ico{font-size:15px;line-height:1.25;flex:none;width:19px;text-align:center;}
.camp-txt{display:flex;flex-direction:column;gap:1px;min-width:0;}
.camp-txt b{font-size:13.5px;font-weight:600;line-height:1.3;}
.camp-txt .s{font-size:12px;color:var(--ink-soft);line-height:1.35;}
.camp-cuando{color:var(--ink-faint);font-size:11px;}
@media (max-width:640px){
  .camp-caja{position:fixed;left:12px;right:12px;top:52px;width:auto;}
}

/* --- la dirección se confirma sola ---------------------------------
   La lista cuelga del campo. En el teléfono los renglones son altos a
   propósito: se le pica con el pulgar, parado en la entrada de una
   casa, no con el mouse sentado en un escritorio. */
.dir-lista{
  position:absolute; z-index:40; left:0; right:0; top:calc(100% + 5px);
  background:var(--surface); border:1px solid var(--line); border-radius:8px;
  box-shadow:var(--shadow); overflow:hidden auto; max-height:min(56vh,320px);
}
.dir-op{
  display:block; width:100%; text-align:left; padding:12px 13px;
  background:none; border:0; border-bottom:1px solid var(--line-soft);
  cursor:pointer; font:inherit; color:var(--ink);
}
.dir-op:last-child{border-bottom:0;}
.dir-op:hover,.dir-op.on{background:var(--surface-2);}
.dir-calle{display:block; font-weight:600; font-size:14.5px; line-height:1.3;}
.dir-resto{display:block; font-size:12.5px; color:var(--ink-faint); margin-top:2px;}
.dir-aviso{padding:11px 13px; font-size:13px; color:var(--ink-faint);}
.dir-sello{margin-top:5px; font-size:12.5px; font-weight:600; color:var(--good);}

/* --- sin señal -----------------------------------------------------
   Una franja que solo aparece cuando hay algo que decir. Si siempre
   estuviera ahí, se dejaría de leer. */
.senal{
  padding:9px 15px; font-size:13px; font-weight:600; line-height:1.35;
  border-bottom:1px solid var(--line-soft);
}
.senal.sin  { background:var(--accent-soft); color:var(--warn-ink); }
.senal.yendo{ background:var(--surface-2);   color:var(--ink-soft); }
.senal.listo{ background:var(--surface-2);   color:var(--good); }
.senal.mal  { background:var(--surface-2);   color:var(--critical); }

/* --- la hoja: el detalle que se abre desde el tablero ----------------
   En el teléfono sube desde abajo; en la computadora sale al centro. */
.hoja-fondo{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.55);
  display:flex;align-items:flex-end;justify-content:center;}
.hoja-panel{background:var(--surface);color:var(--ink);width:100%;max-width:560px;
  max-height:85vh;display:flex;flex-direction:column;border:1px solid var(--line);
  border-radius:14px 14px 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.35);}
@media (min-width:760px){
  .hoja-fondo{align-items:center;}
  .hoja-panel{border-radius:14px;max-height:80vh;}
}
.hoja-cab{display:flex;align-items:center;justify-content:space-between;
  padding:13px 15px;border-bottom:1px solid var(--line-soft);}
.hoja-cab h2{font-size:15px;margin:0;}
.hoja-x{background:none;border:0;color:var(--ink-soft);font-size:28px;line-height:1;
  padding:0 4px;cursor:pointer;}
.hoja-cuerpo{overflow:auto;padding-bottom:env(safe-area-inset-bottom,0px);}
.hoja-cuerpo details > summary{list-style:none;cursor:pointer;}
.hoja-cuerpo details > summary::-webkit-details-marker{display:none;}
.hoja-cuerpo details[open] > summary .row{background:var(--surface-2);}
.hoja-cuerpo a.rowlink.sub .row{padding-left:30px;}
.aging-row{cursor:pointer;}
.aging-row:hover{background:var(--surface-2);}
.ver-mas{display:block;width:100%;text-align:left;background:none;border:0;
  border-top:1px solid var(--line-soft);padding:13px 15px;color:var(--accent);
  font:inherit;font-size:13px;font-weight:600;cursor:pointer;}