:root{
  --bg:#f3f2f2; --ink:#201e1d; --gold:#bfa166; --gold-deep:#8a6a2b;
  --muted:color-mix(in srgb,var(--ink) 66%,transparent);
  --soft:color-mix(in srgb,var(--ink) 80%,transparent);
  --rule:color-mix(in srgb,#bfa166 55%,transparent);
  --line:color-mix(in srgb,var(--ink) 18%,transparent);
  --ok:#2f6b3f; --warn:#9a6a00; --bad:#a3262a;
  --font:'Source Serif 4',Georgia,'Times New Roman',serif;
  --gut:clamp(16px,4vw,40px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.wrap{max-width:1040px;margin:0 auto;padding:0 var(--gut) 80px}
[hidden]{display:none!important}

/* barra */
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px var(--gut);border-bottom:1px solid var(--rule);position:sticky;top:0;background:var(--bg);z-index:5}
.brand{font-size:18px;font-weight:600;letter-spacing:-.01em;text-decoration:none}
.brand i{font-weight:400;color:var(--gold-deep)}
.who{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted)}
.linkbtn{background:none;border:0;padding:6px 0;cursor:pointer;text-decoration:underline;text-underline-offset:.2em;font-size:13px;color:var(--ink)}

/* tipografía */
h1{font-size:clamp(30px,6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:26px 0 0;font-weight:600}
h2{font-size:clamp(20px,3vw,26px);line-height:1.15;margin:0;font-weight:600;letter-spacing:-.01em}
.eyebrow{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0}
.sub{color:var(--muted);margin:6px 0 0}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--gold);background:var(--gold);color:var(--ink);cursor:pointer;text-decoration:none}
.btn:hover{background:color-mix(in srgb,var(--gold) 82%,var(--ink))}
.btn.line{background:transparent;border-color:var(--gold-deep)}
.btn.line:hover{background:color-mix(in srgb,var(--gold) 16%,transparent)}
.btn.sm{min-height:36px;padding:6px 12px;font-size:11.5px}
.btn.danger{background:transparent;border-color:var(--bad);color:var(--bad)}
.btn[disabled]{opacity:.5;cursor:default}

/* login */
.login{max-width:380px;margin:12vh auto 0;padding:0 var(--gut)}
.login h1{margin-top:8px}

/* campos */
.field{display:grid;gap:6px;margin:0}
.field label,.lbl{font-size:12px;color:var(--muted)}
.in{width:100%;min-height:44px;padding:9px 12px;background:var(--bg);border:1px solid color-mix(in srgb,var(--ink) 30%,transparent);border-radius:2px}
.in:focus-visible{border-color:var(--gold-deep);outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 40%,transparent)}
textarea.in{min-height:90px;resize:vertical}
select.in{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23201e1d' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:11px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.chk{display:flex;align-items:center;gap:10px;min-height:44px}
.chk input{width:22px;height:22px;accent-color:var(--gold-deep);flex:none}

/* inicio */
.top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.alerts{margin:22px 0 0;border:1px solid var(--rule);padding:14px 16px;display:grid;gap:8px}
.alerts h2{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 2px}
.alert{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;font-size:15px}
.alert a{font-weight:600}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:22px}
.card{display:block;text-decoration:none;border:1px solid var(--line);background:color-mix(in srgb,#fff 40%,transparent);padding:18px;transition:border-color .15s}
.card:hover{border-color:var(--gold-deep)}
.card h3{font-size:24px;line-height:1.1;letter-spacing:-.015em;margin:8px 0 0;font-weight:600}
.when{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.days{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.meta{font-size:14px;color:var(--muted);margin:6px 0 0}
.meter{margin-top:14px}
.meter .row{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:4px}
.track{height:6px;background:color-mix(in srgb,var(--ink) 10%,transparent)}
.track span{display:block;height:100%;background:var(--gold-deep)}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tag{font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border:1px solid currentColor}
.tag.bad{color:var(--bad)} .tag.warn{color:var(--warn)} .tag.ok{color:var(--ok)}
.empty{margin-top:40px;padding:28px;border:1px dashed var(--line);text-align:center;color:var(--muted)}

/* ficha */
.back{display:inline-block;margin-top:18px;font-size:13px}
.hero{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;align-items:flex-end}
.big{font-size:clamp(34px,6vw,54px);line-height:1;color:var(--gold-deep);letter-spacing:-.03em;font-weight:600;margin:0}
.tabs{display:flex;gap:6px;overflow-x:auto;margin:22px calc(var(--gut) * -1) 0;padding:0 var(--gut) 2px;border-bottom:1px solid var(--rule);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;min-height:44px;padding:8px 14px;background:none;border:0;border-bottom:3px solid transparent;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;color:var(--muted)}
.tab[aria-selected="true"]{color:var(--ink);font-weight:600;border-bottom-color:var(--gold-deep)}
.panel{margin-top:22px}
.sec{margin-top:28px}
.sec>h2{margin-bottom:12px}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.savebar{position:sticky;bottom:0;z-index:4;background:var(--bg);padding:12px 0 calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--rule)}

/* tareas */
.grp{margin-top:22px}
.grp h3{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 6px;font-weight:600}
.task{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.task input{width:24px;height:24px;margin-top:2px;accent-color:var(--gold-deep);flex:none}
.task .t{flex:1;min-width:0}
.task .lab{display:block}
.task.done .lab{text-decoration:line-through;color:var(--muted)}
.task .due{font-size:12px;color:var(--muted);display:block;margin-top:2px}
.due.bad{color:var(--bad);font-weight:600} .due.warn{color:var(--warn);font-weight:600}

/* pagos */
.sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.sum div{border:1px solid var(--line);padding:12px 14px}
.sum b{display:block;font-size:22px;letter-spacing:-.01em;margin-top:2px}
.sum .ok b{color:var(--ok)} .sum .bad b{color:var(--bad)}
.list{list-style:none;margin:0;padding:0}
.list li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.list .l{min-width:0} .list small{display:block;color:var(--muted);font-size:13px}
.right{display:flex;align-items:center;gap:12px;flex:none}
.amt{font-weight:600}

/* aviso */
#toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:var(--ink);color:var(--bg);padding:10px 16px;font-size:14px;opacity:0;pointer-events:none;transition:.2s;z-index:20;max-width:90vw}
#toast.show{opacity:1;transform:translate(-50%,0)}
#toast.bad{background:var(--bad)}
.hist li{align-items:flex-start}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* calendario */
.cal{margin-top:26px;border:1px solid var(--line);background:color-mix(in srgb,#fff 40%,transparent);padding:clamp(12px,2.4vw,20px)}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.cal-head h2{text-transform:capitalize;text-align:center;flex:1}
.cal-nav{display:flex;gap:8px}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.dow{text-align:center;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:4px 0}
.day{position:relative;min-height:50px;padding:5px 4px 4px;background:var(--bg);border:1px solid transparent;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;font-size:15px}
.day.empty{background:none;cursor:default}
.day:hover{border-color:var(--gold-deep)}
.day.hoy .n{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.day.boda{background:color-mix(in srgb,var(--gold) 28%,var(--bg));border-color:var(--gold-deep);font-weight:600}
.day.choque{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 14%,var(--bg))}
.day.sel{outline:2px solid var(--ink);outline-offset:-2px}
.mk{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;min-height:8px}
.k{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold-deep)}
.k.boda{background:var(--ink);width:9px;height:9px;border-radius:1px}
.k.tarea{background:var(--gold)}
.k.tarea.atras{background:var(--bad)}
.k.saldo{background:var(--ok);border-radius:1px;transform:rotate(45deg)}
.cal-leyenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 0;font-size:12px;color:var(--muted)}
.cal-leyenda span{display:inline-flex;align-items:center;gap:6px}
.cal-det{margin-top:16px;border-top:1px solid var(--rule);padding-top:14px}
.cal-det h3{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 6px;font-weight:600}
.choque-aviso{color:var(--bad);font-weight:600;margin:6px 0}
@media (min-width:720px){.day{min-height:64px;font-size:16px}}

/* recibo */
.recibo{margin:18px 0 0;max-width:760px;background:#fff;border:1px solid var(--line);padding:clamp(20px,4vw,40px)}
.recibo header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;border-bottom:2px solid var(--gold);padding-bottom:16px}
.recibo h1{font-size:clamp(28px,5vw,40px);margin:6px 0 0}
.rnum{text-align:right}.rnum span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block}
.rnum b{font-size:22px;letter-spacing:.02em}.rnum small{display:block;color:var(--muted);font-size:12px}
.rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin:20px 0 0}
.rgrid dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.rgrid dd{margin:4px 0 0}.rgrid small{color:var(--muted)}
.rmonto{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:22px 0;padding:14px 16px;background:color-mix(in srgb,var(--gold) 22%,#fff);border:1px solid var(--gold)}
.rmonto span{font-size:12px;letter-spacing:.14em;text-transform:uppercase}.rmonto b{font-size:clamp(26px,5vw,36px);letter-spacing:-.01em}
.rtab{width:100%;border-collapse:collapse;font-size:15px}.rtab td{padding:8px 0;border-bottom:1px solid var(--line)}.rtab td:last-child{text-align:right}
.recibo footer{margin-top:24px;font-size:13px;color:var(--soft)}.rnota{color:var(--muted);font-size:12px}
@media print{.bar,.noprint,#toast{display:none!important}body{background:#fff}.wrap{padding:0}.recibo{border:0;max-width:none;padding:0;margin:0}}

/* cotizaciones */
.linea{display:grid;grid-template-columns:minmax(0,1fr) 130px auto;gap:8px;align-items:center;margin-top:8px}
@media (max-width:520px){.linea{grid-template-columns:minmax(0,1fr) 108px auto}}
.sum b{overflow-wrap:anywhere}

.costos{margin-top:16px;border-top:1px solid var(--rule)}
.cost-head,.cost-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) 120px 120px 64px;gap:0 16px;align-items:center}
.cost-head{padding:10px 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.7;border-bottom:1px solid var(--line)}
.cost-head .r,.cost-row .cm,.cost-tot b{text-align:right}
.cost-row{padding:6px 0;border-bottom:1px solid var(--line)}
.cost-row .cc small{display:block;opacity:.7;font-size:13px}
.cost-row .cm{font-variant-numeric:tabular-nums}
.cost-row .cs{min-height:40px;gap:8px;font-size:14px}
.cost-row .cq{justify-self:end}
.cost-tot{display:flex;justify-content:space-between;padding:12px 0 0;font-size:15px}
.cost-sub{margin:26px 0 10px;font-size:16px;font-weight:600}
.cost-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media (max-width:720px){
  .cost-head{display:none}
  .cost-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'cp cm' 'cc cc' 'cs cq';padding:12px 0;gap:2px 12px}
  .cost-row .cp{grid-area:cp}.cost-row .cm{grid-area:cm;font-weight:600}.cost-row .cc{grid-area:cc}.cost-row .cs{grid-area:cs}.cost-row .cq{grid-area:cq}
  .cost-form{grid-template-columns:repeat(2,minmax(0,1fr))}
}

.task .cant{font-weight:600;color:var(--gold-deep);white-space:nowrap;margin-left:4px}

.kit-gh{display:flex;gap:12px;align-items:center;margin-bottom:8px}.kit-gh .in{font-weight:600}
.kit-hd,.kit-row{display:grid;grid-template-columns:minmax(0,1.6fr) 72px minmax(0,1fr) auto;gap:8px;align-items:center}
.kit-hd{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.7;padding:0 0 4px}
.kit-row{padding:5px 0}.kit-btns{display:flex;gap:10px;align-items:center;white-space:nowrap}
.kit-btns .linkbtn[disabled]{opacity:.3;cursor:default}
@media (max-width:720px){
  .kit-hd{display:none}
  .kit-row{grid-template-columns:64px minmax(0,1fr) auto;gap:6px;border-bottom:1px solid var(--line);padding:10px 0}
  .kit-row input:nth-child(1){grid-column:1 / -1}
  .kit-btns{gap:8px}
}
.kit-gh .linkbtn{white-space:nowrap}

.kit-inl .kit-in{display:flex;gap:8px;margin-top:6px}
.kit-inl .kit-in .in{min-height:38px;padding:4px 10px;font-size:15px}
.kit-inl .kit-in input:first-child{width:72px;flex:none}.kit-inl .kit-in input:last-child{flex:1;max-width:220px;min-width:0}
.kit-inl .lab{cursor:pointer}

/* check list: filtros y una línea por ítem en escritorio */
.kit-tools{display:flex;flex-wrap:wrap;gap:14px 20px;align-items:flex-end;margin:6px 0 10px}
.kit-tools .field{min-width:200px}.kit-tools .seg{display:flex;gap:6px;flex-wrap:wrap}
.kit-tools .actions{margin:0}
.kit-head{display:none}
.kit-it .kit-in{display:flex;gap:8px;align-items:center;margin-top:6px;flex-wrap:wrap}
.kit-it .kit-in .in{min-height:38px;padding:4px 10px;font-size:15px}
.kit-it .kit-in input:first-child{width:72px;flex:none}.kit-it .kit-in input:last-child{flex:1;max-width:220px;min-width:0}
.kit-it .kc{font-weight:600;color:var(--gold-deep)}.kit-it .ku{color:var(--muted);font-size:14px}
.kit-it .lab{cursor:pointer}
@media (min-width:721px){
  .kit-head,.kit-it{display:grid;grid-template-columns:30px minmax(0,2.2fr) 84px minmax(0,1.3fr) 130px;gap:0 14px;align-items:center}
  .kit-head{padding:6px 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.7;border-bottom:1px solid var(--line)}
  .kit-it{padding:6px 0}.kit-it input[type=checkbox]{margin-top:0}
  .kit-it .t,.kit-it .kit-in{display:contents}
  .kit-it .kit-in .in{min-height:36px;width:100%;max-width:none;flex:none}
  .kit-it .due{margin-top:0;font-size:13px}
  .kit-it .kc{text-align:left}
}

/* utilidad total (panel, solo Max) */
.util{margin-top:22px}
.util-det{margin-top:14px}
.util-det summary{cursor:pointer;font-size:14px;padding:6px 0;min-height:32px}
.util-row{grid-template-columns:minmax(0,2fr) 120px 120px 150px}
.util-row .cp small{display:block;font-weight:400;opacity:.7;font-size:13px}
.util-row .cm small{opacity:.7;font-size:13px;margin-left:4px}
.util-row .cm.neg{color:var(--bad)}
@media (max-width:720px){
  .util-row.cost-head{display:none}
  .util-row{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:none;gap:4px 10px;padding:12px 0}
  .util-row .cp,.util-row .cm{grid-area:auto}
  .util-row .cp{grid-column:1/-1}
  .util-row .cm{text-align:left;font-size:14px}
  .util-row .cm::before{content:attr(data-l);display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;opacity:.6}
}

.descuento{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,2fr);gap:14px;margin-top:18px}
@media (max-width:720px){.descuento{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.descuento .field:last-child{grid-column:1/-1}}

/* cotización en PDF */
.cdoc .rtab .rhead td{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--ink)}
.cdoc .rtab td:first-child{padding-right:16px}
.csec{margin-top:22px;break-inside:avoid}
.csec h2{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 6px}
.csec p{margin:0 0 6px;font-size:14px;color:var(--soft)}
.cbank{font-size:14px;max-width:420px}
@page{size:A4;margin:14mm}
@media print{.cdoc{font-size:13px}.cdoc h1{font-size:30px}.cdoc .rmonto{break-inside:avoid;margin:16px 0}.cdoc .rtab td{padding:4px 0;font-size:13px}.cdoc .csec{margin-top:12px}.cdoc .csec p{font-size:12.5px}.cdoc .rgrid{margin-top:12px;gap:12px}.cdoc .rmonto{padding:10px 14px}.cdoc footer{margin-top:14px}}
@media (max-width:520px){.cdoc header{flex-direction:column}.cdoc .rnum{text-align:left}.cdoc .rnum b{white-space:nowrap}}

/* cotización en PDF: encabezado con logo y total más discretos */
.cdoc header{align-items:center}
.cdoc .clogo{height:clamp(44px,9vw,64px);width:auto;display:block}
.cdoc .rnum h1{font-size:20px;margin:0 0 2px;letter-spacing:.01em}
.cdoc .rnum b{font-size:16px}
.cdoc .rmonto{padding:10px 14px;margin:18px 0}
.cdoc .rmonto b{font-size:22px}
.cdoc .rmonto span{font-size:11px}
@media (max-width:520px){.cdoc header{flex-direction:row;align-items:flex-start}.cdoc .rnum{text-align:right}.cdoc .rnum b{white-space:nowrap}.cdoc .clogo{height:40px}}
@media print{.cdoc .clogo{height:56px}.cdoc .rnum h1{font-size:18px}.cdoc .rmonto{padding:8px 14px;margin:14px 0}.cdoc .rmonto b{font-size:20px}}