/* RotulaPro · identidad "plotter": tinta azul, cian de rotulación, marcas de corte y cuadrícula de plancha */
:root{
  --ink:#16324F; --ink-2:#3B5573; --ink-3:#6B8199; --ink-4:#9DB0C3;
  --cyan:#0077C8; --cyan-d:#005E9E; --cyan-l:#E3F1FB;
  --yellow:#FFC629; --magenta:#D6006F;
  --ok:#0E7C4A; --ok-l:#E2F4EB; --err:#B3261E; --err-l:#FBE9E7; --warn:#8A5A00; --warn-l:#FFF3D6;
  --bg:#F3F6F9; --panel:#FFFFFF; --line:#D5DEE7; --line-2:#E8EEF3;
  --side:#0F2740; --side-2:#183654;
  --font:Bahnschrift,"DIN Alternate","DIN 1451 Std","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"Cascadia Mono","SF Mono",Consolas,monospace;
  --r:3px; --focus:0 0 0 3px rgba(0,119,200,.35);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:16px/1.55 var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
body.app{background:var(--bg) linear-gradient(var(--line-2) 1px,transparent 1px) 0 0/100% 32px;background-attachment:fixed}
img,svg{max-width:100%}
a{color:var(--cyan);text-underline-offset:2px}
a:hover{color:var(--cyan-d)}
h1,h2,h3{line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em;font-weight:700}
h1{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.2rem)} h2{font-size:1.25rem} h3{font-size:1.05rem}
p{margin:0 0 1em} ul{margin:0}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:8px;top:8px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
.muted{color:var(--ink-3)} .small{font-size:.85rem} .mono{font-family:var(--mono);font-size:.85em} .lead{font-size:1.15rem;color:var(--ink-2);max-width:60ch}
.num{font-variant-numeric:tabular-nums;white-space:nowrap} .neg{color:var(--err)} .r{text-align:right} .right{text-align:right}
.plain{list-style:none;padding:0;margin:0} .plain li{display:flex;justify-content:space-between;gap:.75rem;padding:.4rem 0;border-bottom:1px solid var(--line-2)}
.inline{display:inline} .push{margin-left:auto} .stack{display:grid;gap:1rem;align-content:start} .stack-sm{display:grid;gap:.6rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.5rem}
.tag{display:inline-block;font-size:.72rem;padding:.05rem .45rem;border:1px solid var(--ink-4);border-radius:2px;color:var(--ink-2);vertical-align:middle;font-weight:600}
.link-sm{font-size:.85rem}
abbr{text-decoration:none;color:var(--magenta)}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:42px;padding:.55rem 1.05rem;font:600 .95rem var(--font);border:1.5px solid var(--ink);border-radius:var(--r);background:var(--panel);color:var(--ink);text-decoration:none;cursor:pointer;transition:background .15s,transform .05s,box-shadow .15s}
.btn:hover{background:var(--cyan-l);color:var(--ink)} .btn:active{transform:translateY(1px)}
.btn-primary{background:var(--cyan);border-color:var(--cyan);color:#fff;box-shadow:3px 3px 0 var(--ink)}
.btn-primary:hover{background:var(--cyan-d);border-color:var(--cyan-d);color:#fff}
.btn-primary:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}
.btn-ghost{border-color:var(--line);background:transparent} .btn-ghost:hover{border-color:var(--ink-3)}
.btn-danger{border-color:var(--err);color:var(--err);background:transparent} .btn-danger:hover{background:var(--err);color:#fff}
.btn-sm{min-height:34px;padding:.25rem .7rem;font-size:.85rem} .btn-lg{min-height:52px;padding:.8rem 1.5rem;font-size:1.05rem}
.btn-block{width:100%} .btn[disabled]{opacity:.5;cursor:not-allowed;box-shadow:none}

/* ---------- Formularios ---------- */
.form{display:block}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem 1.1rem;margin-bottom:1rem}
.form-grid.tight{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.6rem}
.span-2{grid-column:span 2} .span-3{grid-column:1/-1}
.form-section{grid-column:1/-1;margin:1.4rem 0 .6rem;padding-bottom:.35rem;font-size:1rem;border-bottom:2px solid var(--ink);display:flex;align-items:center;gap:.5rem}
.form-section:first-child{margin-top:0}
.field{display:grid;gap:.3rem;align-content:start;min-width:0}
.field label,.field .label{font-size:.85rem;font-weight:600;color:var(--ink-2)}
input,select,textarea{font:inherit;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:var(--r);padding:.55rem .7rem;min-height:42px;width:100%;min-width:0}
textarea{resize:vertical;min-height:70px}
input:hover,select:hover,textarea:hover{border-color:var(--ink-4)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--cyan);box-shadow:var(--focus)}
input[type=checkbox],input[type=radio]{width:18px;height:18px;min-height:0;padding:0;accent-color:var(--cyan);flex:none}
input[type=file]{padding:.4rem;background:var(--bg)}
input.mini{min-height:36px;padding:.3rem .5rem;max-width:110px;text-align:right}
.hint{color:var(--ink-3);font-size:.8rem}
.check,.radio{display:flex;gap:.55rem;align-items:flex-start;font-weight:500!important;color:var(--ink)!important;cursor:pointer}
.field-check{align-content:end;padding-bottom:.4rem}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.inline-form{display:flex;flex-wrap:wrap;gap:.75rem;align-items:end}
.inline-form .field{flex:1 1 150px}
.form-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.4rem;padding-top:1.1rem;border-top:1px solid var(--line)}
fieldset{border:0;padding:0;margin:0;min-width:0}
.filters{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:0 0 1rem}
.filters input[type=search]{flex:1 1 240px;max-width:380px}
.filters select{width:auto;min-width:160px}
.picker{position:relative}
.picker-list{position:absolute;z-index:20;left:0;right:0;top:100%;margin:2px 0 0;padding:0;list-style:none;background:#fff;border:1.5px solid var(--ink);border-radius:var(--r);box-shadow:4px 4px 0 rgba(22,50,79,.15);max-height:260px;overflow:auto}
.picker-list li{padding:.6rem .8rem;cursor:pointer;border-bottom:1px solid var(--line-2)} .picker-list li:hover,.picker-list li:focus{background:var(--cyan-l);outline:none}

/* ---------- Avisos, badges, chips ---------- */
.flash{padding:.75rem 1rem;margin:0 0 1rem;border-left:4px solid;border-radius:var(--r);background:#fff;transition:opacity .6s}
.flash-ok{border-color:var(--ok);background:var(--ok-l)} .flash-error{border-color:var(--err);background:var(--err-l)} .flash-info{border-color:var(--cyan);background:var(--cyan-l)}
.flash-out{opacity:0;pointer-events:none;height:0;padding:0;margin:0;overflow:hidden}
.flash-pub{max-width:960px;margin:1rem auto}
.badge{display:inline-block;font-size:.74rem;font-weight:700;padding:.12rem .55rem;border-radius:2px;border:1px solid;vertical-align:middle;white-space:nowrap}
.badge-gris{color:var(--ink-2);border-color:var(--ink-4);background:var(--bg)} .badge-cian{color:var(--cyan-d);border-color:var(--cyan);background:var(--cyan-l)}
.badge-verde{color:var(--ok);border-color:var(--ok);background:var(--ok-l)} .badge-rojo{color:var(--err);border-color:var(--err);background:var(--err-l)}
.badge-azul{color:#fff;border-color:var(--ink);background:var(--ink)} .badge-ambar{color:var(--warn);border-color:#D9A116;background:var(--warn-l)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem}
.chip{display:inline-block;padding:.3rem .8rem;border:1.5px solid var(--line);border-radius:99px;background:#fff;color:var(--ink-2);font-size:.85rem;font-weight:600;text-decoration:none}
.chip:hover{border-color:var(--ink-3)} .chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chip-cian{border-color:var(--cyan);background:var(--cyan-l);color:var(--cyan-d)} .chip-rojo{border-color:var(--err);background:var(--err-l);color:var(--err)}

/* ---------- Paneles con marcas de corte ---------- */
.panel{position:relative;background:var(--panel);border:1.5px solid var(--line);border-radius:var(--r);padding:1.25rem;margin-bottom:1rem}
.panel.crop::before,.panel.crop::after,.plano-panel::before,.plano-panel::after{content:"";position:absolute;width:14px;height:14px;pointer-events:none}
.panel.crop::before,.plano-panel::before{left:-7px;top:-7px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translate(0,0)}
.panel.crop::after,.plano-panel::after{right:-7px;bottom:-7px;border-left:2px solid var(--ink);border-top:2px solid var(--ink)}
.panel-title{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.8rem;flex-wrap:wrap}
.panel-title h2,.panel-h{margin:0 0 .6rem;font-size:1rem}
.panel-title h2{margin:0}
.section-h{margin:1.5rem 0 .8rem}
.table-panel{padding:0;overflow:hidden}
.empty{text-align:center;padding:2.5rem 1rem} .empty h2{margin-bottom:.4rem} .empty p{color:var(--ink-3)}
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}
.page-head h1{margin:0} .page-head p{margin:.2rem 0 0}
.actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.grid-2,.grid-3,.grid-4{display:grid;gap:1rem;margin-bottom:1rem}
.grid-2{grid-template-columns:repeat(2,1fr)} .grid-3{grid-template-columns:repeat(3,1fr)} .grid-4{grid-template-columns:repeat(4,1fr)}
.grid-main{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1rem;align-items:start}
.split{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1rem}
.kpi{background:var(--panel);border:1.5px solid var(--line);border-left:5px solid var(--cyan);border-radius:var(--r);padding:.9rem 1rem;display:grid;gap:.15rem}
.kpi-label{font-size:.82rem;color:var(--ink-3);font-weight:600} .kpi-val{font-size:1.65rem;font-variant-numeric:tabular-nums;letter-spacing:-.02em} .kpi-txt{font-size:1.2rem} .kpi-sub{font-size:.82rem;color:var(--ink-3)}
.kpi-alert{border-left-color:var(--err)} .kpi-alert .kpi-val{color:var(--err)}
.kpis{margin-bottom:1rem}
.report-card{display:block;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s} .report-card:hover{border-color:var(--cyan);transform:translateY(-2px)} .report-card h2{margin-bottom:.3rem}
.meter{margin-bottom:.8rem} .meter-h{display:flex;justify-content:space-between;font-size:.88rem;margin-bottom:.25rem}
progress{width:100%;height:10px;appearance:none;border:0;background:var(--line-2);border-radius:2px;overflow:hidden}
progress::-webkit-progress-bar{background:var(--line-2)} progress::-webkit-progress-value{background:var(--cyan)} progress::-moz-progress-bar{background:var(--cyan)}
progress.hot::-webkit-progress-value{background:var(--magenta)} progress.hot::-moz-progress-bar{background:var(--magenta)}
.bars{width:100%;height:auto;display:block} .bar{fill:var(--ink-4)} .bar-now{fill:var(--cyan)} .bar-l{font:600 11px var(--font);fill:var(--ink-3)} .bar-v{font:600 10px var(--font);fill:var(--ink-2)}
.sum-list{margin:1rem 0 0;display:grid;gap:.3rem;margin-left:auto;max-width:360px}
.sum-list>div,.totals dl>div,.meta>div,.plano-data>div{display:flex;justify-content:space-between;gap:1rem} .sum-list dt,.sum-list dd,.meta dt,.meta dd,.totals dt,.totals dd{margin:0}
.sum-list dd,.totals dd{font-variant-numeric:tabular-nums} .sum-list dt,.meta dt{color:var(--ink-3)}
.grand{border-top:2px solid var(--ink);padding-top:.4rem;margin-top:.2rem;font-size:1.2rem;font-weight:700}
.internal{color:var(--ink-3);font-size:.85rem;border-top:1px dashed var(--line);padding-top:.4rem}
.meta{margin:.75rem 0 0;display:grid;gap:.35rem;font-size:.92rem}

/* ---------- Tablas ---------- */
.table-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:.93rem}
.tbl th{text-align:left;font-size:.78rem;font-weight:700;color:var(--ink-3);padding:.65rem .8rem;border-bottom:2px solid var(--ink);white-space:nowrap;background:#fff}
.tbl td{padding:.65rem .8rem;border-bottom:1px solid var(--line-2);vertical-align:top}
.tbl tbody tr:hover{background:#F8FBFE} .tbl tfoot th{border-top:2px solid var(--ink);border-bottom:0;color:var(--ink);font-size:.9rem}
.tbl-compact th,.tbl-compact td{padding:.4rem .6rem} .tbl .r,.tbl th.r{text-align:right}
.tbl tr.inactive td{opacity:.5} .tbl tr.nota td{background:var(--bg);font-style:italic}
.row-link{font-weight:700;text-decoration:none;color:var(--ink)} .row-link:hover{color:var(--cyan)}
.row-actions{white-space:nowrap}
.lines td:first-child{min-width:240px}
.tbl-edit td{padding:.35rem .4rem} .tbl-edit select{min-width:150px}
.pager{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 1rem;border-top:1px solid var(--line);flex-wrap:wrap}
.pager-now{margin:0 .6rem;font-size:.88rem}
.bulk summary{cursor:pointer;font-weight:700} .bulk[open] summary{margin-bottom:.8rem}

/* ---------- Shell de la aplicación ---------- */
.shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.side{background:var(--side);color:#fff;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:1rem .75rem;overflow-y:auto}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.2rem;letter-spacing:-.02em;color:inherit;text-decoration:none;padding:.25rem .5rem 1.1rem}
.side .brand{color:#fff} .brand:hover{color:inherit}
.nav{display:grid;gap:2px;flex:1;align-content:start}
.nav a{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;color:#C9D8E8;text-decoration:none;border-radius:var(--r);font-weight:600;font-size:.94rem;border-left:3px solid transparent}
.nav a:hover{background:var(--side-2);color:#fff} .nav a.active{background:var(--side-2);color:#fff;border-left-color:var(--yellow)}
.side-foot{border-top:1px solid var(--side-2);padding-top:.9rem;display:grid;gap:.6rem}
.who strong{display:block;font-size:.92rem} .who small{color:#9DB0C3}
.side .btn-ghost{color:#fff;border-color:#3B5573;width:100%} .side .btn-ghost:hover{background:var(--side-2)}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:1rem;padding:.7rem 1.5rem;background:#fff;border-bottom:1.5px solid var(--line);position:sticky;top:0;z-index:30}
.top-title{font-weight:700;flex:1;color:var(--ink-2)}
.content{padding:1.5rem;max-width:1280px;width:100%}
.burger{display:none;width:44px;height:44px;border:1.5px solid var(--line);background:#fff;border-radius:var(--r);padding:11px 10px;cursor:pointer;flex-direction:column;justify-content:space-between}
.burger span{display:block;height:2px;background:var(--ink)}
.scrim{position:fixed;inset:0;background:rgba(15,39,64,.55);z-index:40}

/* ---------- Editor de presupuestos ---------- */
.quote-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1rem;align-items:start}
.quote-side{position:sticky;top:76px;display:grid;gap:1rem}
.lin{border:1.5px solid var(--line);border-left:5px solid var(--cyan);border-radius:var(--r);padding:.8rem;margin-bottom:.8rem;background:#fff;display:grid;gap:.6rem}
.lin[data-tipo=libre]{border-left-color:var(--yellow)} .lin[data-tipo=texto]{border-left-color:var(--ink-4);background:var(--bg)}
.lin:focus-within{border-color:var(--cyan);box-shadow:var(--focus)}
.lin-head{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:.5rem;align-items:center}
.lin-head:has(.lin-prod[hidden]){grid-template-columns:150px 1fr auto}
.lin-tools{display:flex;gap:.3rem;justify-content:flex-end}
.lin-dims{display:grid;grid-template-columns:110px 110px minmax(0,1fr);gap:.6rem;align-items:end}
.lin label{display:grid;gap:.2rem;font-size:.78rem;font-weight:600;color:var(--ink-3)}
.lin-opts{display:flex;flex-wrap:wrap;gap:.3rem 1rem;align-self:center} .lin-opts .check{font-size:.88rem}
.lin-price{display:grid;grid-template-columns:repeat(auto-fit,minmax(82px,1fr));gap:.6rem;align-items:end}
.lin-total{display:grid;text-align:right;font-size:.78rem;color:var(--ink-3)} .lin-total strong{font-size:1.15rem;color:var(--ink);font-variant-numeric:tabular-nums}
.lin-msg{margin:0;font-size:.82rem;color:var(--ink-3);min-height:0} .lin-msg:empty{display:none} .lin-msg-err{color:var(--err)}
.lin-simple{grid-template-columns:1fr} .lin-simple .lin-tools{justify-content:flex-start}
.empty-lines{text-align:center;padding:1.5rem}
.plano{background:#fff;border:1px dashed var(--ink-4);border-radius:var(--r);padding:.4rem}
.plano-panel .plano{border:0;padding:0}
.pl-fill{fill:var(--cyan-l)} .pl-hatch{stroke:var(--cyan);stroke-width:1;opacity:.35} .pl-edge{fill:none;stroke:var(--ink);stroke-width:2}
.pl-dim{stroke:var(--magenta);stroke-width:1.2;fill:none} .pl-ext{stroke:var(--ink-4);stroke-width:1} .pl-txt{font:700 11px var(--font);fill:var(--magenta)}
.plano-data{margin:.6rem 0 0;display:grid;gap:.25rem;font-size:.9rem} .plano-data dt{color:var(--ink-3)} .plano-data dd{margin:0;text-align:right} .plano-data .wide{flex-direction:column;gap:0} .plano-data .wide dd{text-align:left;font-size:.82rem}
.desglose h3{font-size:.85rem;margin:.9rem 0 .3rem}
.totals dl{margin:0 0 1rem;display:grid;gap:.35rem}
.margin-line{font-size:.85rem;color:var(--ink-2);background:var(--ok-l);padding:.4rem .6rem;border-radius:var(--r)} .margin-line.low{background:var(--warn-l);color:var(--warn)}
.prod-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1rem;align-items:start} .tester{position:sticky;top:76px}
.calc-out{margin-top:.8rem}
.opts{margin:.6rem 0;display:grid;gap:.3rem}
.opts legend{font-size:.85rem;font-weight:600;color:var(--ink-2);margin-bottom:.3rem}
.cobros li{align-items:center} .vf .qr-box{display:grid;justify-items:start;gap:.4rem;margin-top:.8rem}
.qr-box svg{width:110px;height:110px;border:1px solid var(--line);padding:4px}
.pop{position:relative} .pop summary{list-style:none;cursor:pointer} .pop summary::-webkit-details-marker{display:none}
.popbox{position:absolute;right:0;z-index:15;background:#fff;border:1.5px solid var(--ink);padding:1rem;width:260px;box-shadow:4px 4px 0 rgba(22,50,79,.15);text-align:left}
.plan-now h2{display:flex;gap:.6rem;align-items:center} .usage{margin-top:1rem} .usage>div{display:grid} .usage strong{font-size:1.3rem}
.plan-edit{border-bottom:1px solid var(--line-2);padding-bottom:1rem;margin-bottom:1rem}

/* ---------- Planes ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem;align-items:stretch;margin:1.5rem 0}
.plan{background:#fff;border:1.5px solid var(--line);border-radius:var(--r);padding:1.5rem;display:flex;flex-direction:column;gap:.5rem}
.plan h3{font-size:1.3rem;margin:0} .plan .price{font-size:1rem;margin:.4rem 0 0} .plan .price strong{font-size:2.6rem;letter-spacing:-.03em}
.plan-hl{border-color:var(--ink);border-width:2px;box-shadow:6px 6px 0 var(--yellow);position:relative}
.ticks{list-style:none;padding:0;margin:.6rem 0 1rem;display:grid;gap:.4rem;flex:1}
.ticks li{padding-left:1.5rem;position:relative;font-size:.94rem}
.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:.85rem;height:.45rem;border-left:2.5px solid var(--ok);border-bottom:2.5px solid var(--ok);transform:rotate(-45deg) translateY(-30%)}
.per{display:grid;gap:.3rem;margin-bottom:.6rem}

/* ---------- Web pública ---------- */
.pub-head{display:flex;align-items:center;gap:1.5rem;padding:.8rem clamp(1rem,4vw,3rem);background:#fff;border-bottom:1.5px solid var(--ink);position:sticky;top:0;z-index:30}
.pub-head .brand{padding:0;color:var(--ink)}
.pub-nav{display:flex;gap:1.4rem;flex:1;margin-left:1rem} .pub-nav a{color:var(--ink-2);text-decoration:none;font-weight:600;font-size:.94rem} .pub-nav a:hover{color:var(--cyan)}
.pub-cta{display:flex;gap:.5rem}
body.pub{background:var(--bg) linear-gradient(var(--line-2) 1px,transparent 1px) 0 0/100% 40px}
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;padding:clamp(2rem,6vw,5rem) clamp(1rem,4vw,3rem);max-width:1240px;margin:0 auto}
.hero h1{font-size:clamp(2.1rem,1.2rem + 3.6vw,3.7rem);letter-spacing:-.035em;line-height:1.02;margin-bottom:1rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.6rem 0 .8rem}
.calc{padding:1.4rem;background:#fff;box-shadow:8px 8px 0 var(--yellow);border-color:var(--ink);border-width:2px}
.calc-title{font-size:1.1rem;margin-bottom:.9rem}
.calc-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.75rem;margin-bottom:.9rem}
.calc-view{display:grid;grid-template-columns:1.1fr .9fr;gap:1rem;align-items:center}
.calc-out2{margin:0;display:grid;gap:.5rem} .calc-out2>div{display:flex;flex-direction:column} .calc-out2 dt{font-size:.78rem;color:var(--ink-3);font-weight:600} .calc-out2 dd{margin:0;font-variant-numeric:tabular-nums;font-weight:600}
.calc-price dd{font-size:2rem;color:var(--cyan);letter-spacing:-.03em;font-weight:800}
.band{padding:clamp(2.5rem,6vw,5rem) clamp(1rem,4vw,3rem);max-width:1240px;margin:0 auto}
.band>h2{font-size:clamp(1.5rem,1rem + 1.8vw,2.2rem);letter-spacing:-.025em;margin-bottom:1.5rem}
.band-tint{max-width:none;background:var(--ink);color:#fff} .band-tint>*{max-width:1240px;margin-left:auto;margin-right:auto}
.band-tint a{color:var(--yellow)} .band-tint .muted{color:var(--ink-4)}
.band-narrow{max-width:820px} .band-cta{text-align:center;max-width:none;background:var(--cyan);color:#fff} .band-cta h2{margin-bottom:.4rem} .band-cta .btn-primary{background:#fff;color:var(--ink);border-color:var(--ink)}
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(1.5rem,4vw,4rem)}
.feature-list article{padding:1.4rem 0 1.4rem 1.2rem;border-left:4px solid var(--ink);margin-bottom:.4rem}
.feature-list article:nth-child(3n+1){border-left-color:var(--cyan)} .feature-list article:nth-child(3n+2){border-left-color:var(--yellow)} .feature-list article:nth-child(3n){border-left-color:var(--magenta)}
.feature-list h3{font-size:1.15rem} .feature-list p{margin:0;color:var(--ink-2)}
.vf-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,4rem);align-items:center}
.band-tint .ticks li::before{border-color:var(--yellow)}
.chain{width:100%;height:auto;max-width:420px;justify-self:center}
.chain .blk rect{fill:#fff;stroke:#fff} .chain .blk-now rect{fill:var(--yellow)} .chain .t1{font:700 15px var(--font);fill:var(--ink)} .chain .t2{font:13px var(--mono);fill:var(--cyan-d)} .chain .t3{font:11px var(--mono);fill:var(--ink-3)}
.chain .lnk{stroke:var(--yellow);stroke-width:2.5;fill:none}
.faq{border-bottom:1.5px solid var(--line);padding:.9rem 0} .faq summary{cursor:pointer;font-weight:700;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--cyan)} .faq[open] summary::after{content:"−"} .faq summary::-webkit-details-marker{display:none} .faq p{margin:.6rem 0 0;color:var(--ink-2)}
.pub-foot{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;justify-content:space-between;padding:2rem clamp(1rem,4vw,3rem);background:var(--side);color:#C9D8E8}
.pub-foot p{margin:.2rem 0 0;color:#9DB0C3} .pub-foot nav{display:flex;gap:1.2rem;flex-wrap:wrap} .pub-foot a{color:#fff} .pub-foot small{flex-basis:100%;color:#9DB0C3}
.pub-doc{max-width:900px;margin:0 auto;padding:2rem clamp(1rem,4vw,2rem)} .legal h2{margin-top:1.6rem} .legal p{max-width:70ch}
.accept-box{border-color:var(--ink);border-width:2px}
.auth{max-width:420px;margin:clamp(2rem,8vh,5rem) auto;padding:1.75rem;border-color:var(--ink);border-width:2px;box-shadow:6px 6px 0 var(--yellow)} .auth-wide{max-width:640px} .auth h1{font-size:1.6rem} .auth .field{margin-bottom:1rem} .auth .form-grid .field{margin:0}
.center-page{text-align:center;padding:5rem 1rem} .err-code{font-size:6rem;font-weight:800;margin:0;color:var(--cyan);letter-spacing:-.05em;line-height:1}

/* ---------- Responsive ---------- */
@media (max-width:1100px){.grid-main,.quote-layout,.prod-layout{grid-template-columns:1fr}.quote-side,.tester{position:static}.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:960px){
  .shell{grid-template-columns:1fr}.burger{display:flex}
  .side{position:fixed;z-index:50;left:0;top:0;width:268px;transform:translateX(-100%);transition:transform .22s}
  body.menu-open .side{transform:none}.topbar{padding:.6rem 1rem}.content{padding:1rem}
  .hero,.vf-grid,.feature-list,.split{grid-template-columns:1fr}
  .pub-nav{display:none}.pub-head{gap:.75rem}.pub-head .pub-cta{margin-left:auto}
}
@media (max-width:720px){
  .form-grid{grid-template-columns:1fr 1fr}.span-3{grid-column:1/-1}.grid-3,.grid-2,.grid-4{grid-template-columns:1fr}
  .grid-3.kpis,.grid-4.kpis{grid-template-columns:1fr 1fr}
  .calc-grid{grid-template-columns:1fr 1fr}.calc-grid .span-2{grid-column:1/-1}.calc-view{grid-template-columns:1fr}
  .lin-head{grid-template-columns:1fr auto}.lin-head .lin-tipo{grid-column:1/-1}.lin-dims{grid-template-columns:1fr 1fr}.lin-opts{grid-column:1/-1}
  .page-head{align-items:stretch}
  /* tablas → tarjetas */
  .tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl tr{border-bottom:2px solid var(--line);padding:.6rem .9rem}
  .tbl td{border:0;padding:.22rem 0;display:flex;justify-content:space-between;gap:1rem;text-align:right}
  .tbl td::before{content:attr(data-label);font-size:.78rem;font-weight:700;color:var(--ink-3);text-align:left;flex:none}
  .tbl td:first-child,.tbl td[colspan]{font-size:1rem}
  .tbl td.r{text-align:right} .tbl td:not([data-label])::before{content:none} .row-actions{justify-content:flex-end}
  .tbl tfoot,.tbl tfoot tr{display:flex;justify-content:space-between} .tbl-edit input,.tbl-edit select{max-width:none}
  .lines td:first-child{min-width:0;display:block;text-align:left} .lines td:first-child::before{content:none}
  .popbox{position:fixed;left:1rem;right:1rem;top:20%;width:auto}
}
@media (max-width:420px){.form-grid{grid-template-columns:1fr}.span-2{grid-column:1/-1}.hero h1{font-size:2rem}}
@media print{.side,.topbar,.actions,.btn,.filters{display:none!important}.shell{display:block}body{background:#fff}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ---------- Ajustes finos ---------- */
input.copy{font-family:var(--mono);font-size:.82rem;background:var(--bg);cursor:copy}
input.copy.copied{border-color:var(--ok);background:var(--ok-l)}
.custom-range{display:inline-flex;gap:.5rem;align-items:center}.custom-range input{width:auto}
.hero-copy{min-width:0}
.lin-desc textarea{min-height:54px}
.plano-empty{text-align:center;padding:1.2rem .5rem;border:1px dashed var(--ink-4);border-radius:var(--r)}
.lin-reset{margin-left:.3rem}

/* ---------- Albaranes, proformas, envío y adjuntos ---------- */
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin: 0 0 14px; }
.tab { background: none; border: 0; padding: 9px 14px; font: inherit; font-weight: 600; color: var(--ink-3); cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.tab.on { color: var(--ink); border-bottom-color: var(--cyan); }
.tab:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.envio textarea { min-height: 8rem; }
.envio [hidden] { display: none !important; }
.adj li { align-items: center; gap: 10px; }
.adj-name { min-width: 0; overflow-wrap: anywhere; }
.adj-act { display: flex; align-items: center; gap: 6px; flex: none; }
.tbl .sel { width: 34px; padding-right: 0; }
.tbl tr.sel-on { background: color-mix(in srgb, var(--cyan) 7%, transparent); }
.bulk-bar { position: sticky; bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 10px 14px;
  background: var(--ink); color: #fff; border-radius: var(--r); box-shadow: 0 6px 20px rgba(22, 50, 79, .25); }
.bulk-bar[hidden] { display: none; }
.firma-pad { display: block; width: 100%; max-width: 600px; height: auto; aspect-ratio: 3 / 1; background: #fff; border: 1.5px dashed var(--ink); border-radius: 6px; touch-action: none; cursor: crosshair; margin: 6px 0; }
img.firma { display: block; margin-top: 6px; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; max-width: 100%; height: auto; }
.field .label { display: block; font-weight: 600; margin-bottom: 4px; }
.neg { color: var(--err); }

/* ---------- Banca ---------- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 0 0 18px; }
.stat { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.stat-l { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); font-weight: 600; }
.stat-v { font-size: 1.6rem; line-height: 1.15; color: var(--ink); font-variant-numeric: tabular-nums; }
.bank-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px; margin-bottom: 14px; }
.bank-card header { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.bank-card h2 { margin: 0; font-size: 1.05rem; }
.bank-saldo { font-size: 1.5rem; font-weight: 700; margin: 10px 0 4px; font-variant-numeric: tabular-nums; }
.bank-card .btn-row { margin: 10px 0 6px; }
.pos { color: var(--ok); } .neg { color: var(--err); }
.mov-tbl .num, .doc-pick .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.mov-tbl tr.gasto td { color: var(--ink-3); }
.mov-tbl .row-link { color: inherit; text-decoration: none; font-weight: 500; }
.mov-tbl .row-link:hover { text-decoration: underline; }
.score { display: inline-block; min-width: 2.2em; text-align: center; padding: 1px 7px; border-radius: 999px; font-size: .78rem; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.score.shi { background: var(--ok); } .score.smid { background: #B7791F; } .score.slo { background: #8A94A0; }
.doc-pick input.amt { width: 7.5em; text-align: right; }
input.bad { border-color: var(--err); background: var(--err-l); }
.mov-concept { font-size: 1.02rem; margin: 0 0 10px; overflow-wrap: anywhere; }
.ia-box summary { cursor: pointer; }
.ia-box .form { margin-top: 12px; }
.ia-hint { margin: 0 0 12px; }
.meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 18px; margin: 0; }
.meta dt { font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); }
.meta dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 720px) { .doc-pick input.amt { width: 6em; } .stat-v { font-size: 1.35rem; } }

/* ---------- SEPA e importador ---------- */
.linklike { background: none; border: 0; padding: 0; font: inherit; color: var(--cyan); text-decoration: underline; cursor: pointer; }
.dev summary { list-style: none; cursor: pointer; } .dev summary::-webkit-details-marker { display: none; }
.dev[open] > form { position: absolute; right: 1rem; z-index: 5; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: .75rem; box-shadow: 0 6px 20px rgba(22,50,79,.18); min-width: 260px; }
.tbl tr.inactiva td { color: var(--ink-3); }
.hint.pos { color: var(--ok); } .hint.neg { color: var(--err); }
.pad { padding: 1rem 1.25rem; }
.cards3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.card-link { text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: .5rem; } .card-link:hover { border-color: var(--cyan); }
.avisos { margin: 0; padding-left: 1.1rem; } .avisos li.w { color: var(--warn); }
.checks { display: grid; gap: .4rem; margin-bottom: 1rem; }
.cards2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.mini-card { border: 1px solid var(--line); border-radius: var(--r); padding: .75rem .9rem; background: var(--panel); }
.mini-h { display: flex; align-items: center; gap: .5rem; margin-bottom: .35rem; }
.rowsp { display: flex; justify-content: space-between; gap: .75rem; }
.flash-inline.err { color: var(--err); } .ok-text { color: var(--ok); }
.checklist { list-style: none; margin: .25rem 0 .75rem; padding: 0; display: grid; gap: .3rem; }
.checklist li::before { content: "✓ "; color: var(--ok); font-weight: 700; }
.checklist li.x::before { content: "✗ "; color: var(--err); } .checklist li.x { color: var(--err); }
.checklist li.w::before { content: "! "; color: var(--warn); } .checklist li.w { color: var(--warn); }
.ico-sepa, .ico-doc { display: inline-block; width: 1.1em; height: 1.1em; vertical-align: -.18em; background: currentColor; -webkit-mask: var(--m) center/contain no-repeat; mask: var(--m) center/contain no-repeat; color: var(--cyan); }
.ico-sepa { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h18v12H3zM3 10h18M7 15h4' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E"); }
.ico-doc { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h9l4 4v14H6zM14 3v5h5M9 13h7M9 17h7' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E"); }

/* ---------- asistentes (importador, SEPA): pasos, selector, tarjetas, barra de acción ---------- */
.stepper { display: flex; margin: 0 0 1.25rem; padding: 0; list-style: none; counter-reset: paso; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); overflow: hidden; }
.stepper li { flex: 1; display: flex; align-items: center; gap: .6rem; padding: .7rem .9rem; color: var(--ink-3); border-right: 1px solid var(--line); font-weight: 600; font-size: .92rem; min-width: 0; }
.stepper li:last-child { border-right: 0; }
.stepper li::before { counter-increment: paso; content: counter(paso); flex: none; width: 1.65rem; height: 1.65rem; border-radius: 50%; border: 2px solid var(--line); display: grid; place-items: center; font-size: .8rem; background: var(--panel); color: var(--ink-3); }
.stepper li small { display: block; font-weight: 400; color: var(--ink-3); font-size: .78rem; line-height: 1.2; }
.stepper li.on { background: var(--cyan-l); color: var(--ink); box-shadow: inset 0 -3px 0 var(--yellow); }
.stepper li.on::before { background: var(--ink); border-color: var(--ink); color: #fff; }
.stepper li.done { color: var(--ok); }
.stepper li.done::before { content: "✓"; background: var(--ok); border-color: var(--ok); color: #fff; }
.stepper.fail li.on { box-shadow: inset 0 -3px 0 var(--err); }
@media (max-width: 760px) { .stepper { flex-wrap: wrap; } .stepper li { flex: 1 1 50%; border-bottom: 1px solid var(--line); } .stepper li small { display: none; } }

.seg { border: 0; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.seg legend { font-size: .86rem; color: var(--ink-2); margin-bottom: .35rem; padding: 0; }
.seg-opt { position: relative; display: block; margin: 0; cursor: pointer; }
.seg-opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.seg-opt > span { display: block; border: 1.5px solid var(--line); border-radius: var(--r); padding: .7rem .85rem; background: var(--panel); min-height: 4.2rem; }
.seg-opt b { display: block; }
.seg-opt small { color: var(--ink-3); font-size: .82rem; line-height: 1.3; display: block; }
.seg-opt input:checked + span { border-color: var(--cyan); box-shadow: inset 0 0 0 1px var(--cyan); background: var(--cyan-l); }
.seg-opt input:focus-visible + span { box-shadow: var(--focus); }
.seg-opt .rec { display: inline-block; margin-left: .35rem; font-size: .7rem; font-weight: 700; padding: 0 .4rem; border-radius: 99px; background: var(--ok-l); color: var(--ok); vertical-align: 1px; }
@media (max-width: 560px) { .seg { grid-template-columns: 1fr; } }

.ayuda { border: 1px solid var(--line-2); background: var(--bg); border-radius: var(--r); padding: .55rem .8rem; margin: 0 0 1rem; font-size: .9rem; }
.ayuda summary { cursor: pointer; font-weight: 600; color: var(--ink-2); }
.ayuda ol { margin: .5rem 0 .25rem 1.1rem; padding: 0; } .ayuda li { margin: .2rem 0; }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .75rem; margin: 0 0 1rem; }
.tile { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: .8rem 1rem; }
.tile b { display: block; font-size: 1.6rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.tile span { color: var(--ink-3); font-size: .82rem; }
.tile.ok b { color: var(--ok); } .tile.warn b { color: var(--warn); } .tile.err b { color: var(--err); }

.acciones { position: sticky; bottom: 0; z-index: 5; display: flex; gap: .75rem; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: .75rem 1rem; margin: 1rem 0 0; background: var(--panel); border: 1px solid var(--line); border-top: 3px solid var(--yellow); border-radius: var(--r); box-shadow: 0 -6px 16px rgba(22,50,79,.08); }
.acciones .txt { color: var(--ink-2); font-size: .92rem; }

.origen-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin: 0 0 1rem; }
.origen-card { display: flex; flex-direction: column; gap: .5rem; text-decoration: none; color: inherit; border: 1.5px solid var(--line); border-radius: var(--r); background: var(--panel); padding: 1rem; transition: border-color .15s, transform .15s; }
.origen-card:hover { border-color: var(--cyan); transform: translateY(-2px); }
.origen-card .ic { width: 2.4rem; height: 2.4rem; border-radius: var(--r); display: grid; place-items: center; background: var(--cyan-l); color: var(--cyan-d); font-weight: 700; }
.origen-card h2 { margin: 0; font-size: 1.1rem; } .origen-card p { margin: 0; color: var(--ink-3); font-size: .9rem; }
.origen-card .go { margin-top: auto; color: var(--cyan-d); font-weight: 700; font-size: .9rem; }
@media (prefers-reduced-motion: reduce) { .origen-card { transition: none; } .origen-card:hover { transform: none; } }

.pasos-sig { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .75rem; margin: 0 0 1rem; }
.paso-sig { display: flex; flex-direction: column; gap: .35rem; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); padding: .85rem 1rem; }
.paso-sig .n { width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; font-size: .8rem; font-weight: 700; }
.paso-sig p { margin: 0; color: var(--ink-3); font-size: .88rem; } .paso-sig .btn { margin-top: auto; align-self: flex-start; }
.paso-sig.hecho .n { background: var(--ok); } .paso-sig.hecho .n::after { content: ""; }

.avisos-grupo { margin: 0 0 .5rem; } .avisos-grupo > summary { cursor: pointer; font-weight: 600; display: flex; gap: .5rem; align-items: center; }
.pill { display: inline-block; min-width: 1.5rem; text-align: center; padding: 0 .5rem; border-radius: 99px; font-size: .78rem; font-weight: 700; background: var(--line-2); color: var(--ink-2); }
.pill.warn { background: var(--warn-l); color: var(--warn); } .pill.err { background: var(--err-l); color: var(--err); }
.cargando { display: none; align-items: center; gap: .6rem; color: var(--ink-2); font-size: .92rem; margin-top: .75rem; }
form.busy .cargando { display: flex; }
.spin { width: 1.1rem; height: 1.1rem; border: 3px solid var(--line); border-top-color: var(--cyan); border-radius: 50%; animation: giro .8s linear infinite; }
@keyframes giro { to { transform: rotate(360deg); } } @media (prefers-reduced-motion: reduce) { .spin { animation: none; border-top-color: var(--cyan); } }
.setup { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .75rem; margin: 0 0 1rem; }
.setup .paso-sig.on { border-color: var(--cyan); box-shadow: inset 0 0 0 1px var(--cyan); }

/* ---------- gastos: escaneo móvil y formulario ---------- */
.scan { display: grid; gap: .9rem; max-width: 640px; }
.scan-btn { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .9rem; align-items: center; padding: 1rem 1.1rem; border: 1.5px solid var(--line); border-radius: var(--r); background: var(--panel); cursor: pointer; min-height: 5rem; }
.scan-btn:active { transform: scale(.99); } .scan-btn:focus-within { box-shadow: var(--focus); }
.scan-btn .scan-ico { grid-row: 1 / 3; font-size: 2rem; } .scan-btn b { font-size: 1.15rem; } .scan-btn small { color: var(--ink-3); }
.scan-cam { background: var(--cyan); color: #fff; border-color: var(--cyan); } .scan-cam small { color: #DDEFFB; }
.scan-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.scan-list li { border: 1px solid var(--line); border-left: 5px solid var(--line); border-radius: var(--r); padding: .65rem .8rem; background: var(--panel); }
.scan-list li.work { border-left-color: var(--cyan); } .scan-list li.good { border-left-color: var(--ok); } .scan-list li.warn { border-left-color: var(--yellow); } .scan-list li.bad { border-left-color: var(--err); }
.scan-list .row { display: flex; justify-content: space-between; gap: .5rem; } .scan-list .st { color: var(--ink-3); font-size: .85rem; } .scan-list .det { margin-top: .3rem; display: grid; gap: .25rem; } .scan-list .aviso-l { color: var(--warn); }
.iva-rows { display: grid; gap: .5rem; } .iva-row { display: grid; grid-template-columns: 2fr 1fr; gap: .75rem; }
.totales { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; margin: .5rem 0 1rem; padding: .75rem; background: var(--cyan-l); border-radius: var(--r); }
.totales span { display: block; font-size: .78rem; color: var(--ink-3); } .totales b { font-variant-numeric: tabular-nums; } .totales .grande b { font-size: 1.2rem; color: var(--ink); }
@media (max-width: 560px) { .totales { grid-template-columns: 1fr 1fr; } }
img.just { max-width: 100%; border: 1px solid var(--line); border-radius: var(--r); display: block; margin-bottom: .5rem; }

/* ---------- contabilidad ---------- */
.tbl.compacta td, .tbl.compacta th { padding: .3rem .5rem; } .tbl tr.sub td { border-bottom-style: dotted; }
.tbl tr.total-fila td { background: var(--cyan-l); } .tbl tfoot td { border-top: 2px solid var(--line); }
.asiento .rowsp { align-items: baseline; } .stat-grande { font-size: 1.8rem; font-weight: 700; margin: .25rem 0; font-variant-numeric: tabular-nums; } .stat-grande small { font-size: .9rem; font-weight: 400; color: var(--ink-3); }
input.r { text-align: right; }

/* ---------- rejillas auxiliares ---------- */
.grid { display: grid; gap: 1rem; } .grid.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid.g21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; }
@media (max-width: 860px) { .grid.g2, .grid.g21 { grid-template-columns: 1fr; } }

/* ---------- CRM ---------- */
.atr { color: var(--err); font-weight: 600; } .tachado { text-decoration: line-through; color: var(--ink-3); }
.lista-t { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; } .lista-t li { display: flex; gap: .65rem; align-items: flex-start; }
.chk { width: 1.4rem; height: 1.4rem; min-width: 1.4rem; border: 2px solid var(--ink-4); border-radius: 50%; background: var(--panel); cursor: pointer; padding: 0; color: #fff; font-size: .8rem; line-height: 1; margin-top: .1rem; }
.chk:hover { border-color: var(--ok); } .chk.on { background: var(--ok); border-color: var(--ok); } .chk:focus-visible { box-shadow: var(--focus); outline: 0; }
.dia { display: grid; place-items: center; width: 2.5rem; min-width: 2.5rem; padding: .15rem 0; background: var(--cyan-l); border-radius: var(--r); line-height: 1.05; } .dia b { font-size: 1.05rem; } .dia small { font-size: .68rem; text-transform: uppercase; color: var(--ink-3); }
.tline { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .8rem; } .tline li { display: flex; gap: .65rem; padding-left: .2rem; } .tline .ti { width: 1.7rem; min-width: 1.7rem; height: 1.7rem; display: grid; place-items: center; background: var(--cyan-l); border-radius: 50%; font-size: .85rem; }
.tline .t-sistema .ti { background: var(--line-2); } .tline .t-sistema { opacity: .85; } .tl-det { margin: .15rem 0; color: var(--ink-2); }
details.quick > summary { cursor: pointer; font-weight: 600; color: var(--cyan-d); padding: .2rem 0; } details.quick[open] > summary { margin-bottom: .5rem; }
.seg-mini { display: flex; gap: .35rem; flex-wrap: wrap; } .seg-mini label { cursor: pointer; } .seg-mini input { position: absolute; opacity: 0; } .seg-mini span { display: inline-block; padding: .3rem .75rem; border: 1px solid var(--line); border-radius: 99px; font-size: .88rem; background: var(--panel); }
.seg-mini input:checked + span { background: var(--cyan); border-color: var(--cyan); color: #fff; } .seg-mini input:focus-visible + span { box-shadow: var(--focus); }
.etapas { display: flex; flex-wrap: wrap; gap: .4rem; margin: .25rem 0 .75rem; } .etapa { padding: .4rem .9rem; border: 1px solid var(--line); background: var(--panel); border-radius: 99px; cursor: pointer; font: inherit; } .etapa:hover:not(:disabled) { border-color: var(--cyan); } .etapa.on { background: var(--cyan); border-color: var(--cyan); color: #fff; opacity: 1; }
.perder { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .9rem; } .perder input { flex: 1; min-width: 12rem; }
.tag.k-nuevo { background: #E8EEF3; } .tag.k-contactado { background: var(--cyan-l); } .tag.k-propuesta { background: #FFF3D6; } .tag.k-negociacion { background: #FBE1F0; } .tag.k-ganada { background: var(--ok-l); color: var(--ok); } .tag.k-perdida { background: var(--err-l); color: var(--err); }

.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 1fr); gap: .75rem; overflow-x: auto; padding-bottom: .75rem; scroll-snap-type: x proximity; }
.kcol { background: var(--line-2); border-radius: var(--r); border-top: 4px solid var(--ink-4); display: flex; flex-direction: column; min-height: 14rem; scroll-snap-align: start; }
.kcol.k-nuevo { border-top-color: var(--ink-4); } .kcol.k-contactado { border-top-color: var(--cyan); } .kcol.k-propuesta { border-top-color: var(--yellow); } .kcol.k-negociacion { border-top-color: var(--magenta); } .kcol.k-ganada { border-top-color: var(--ok); } .kcol.k-perdida { border-top-color: var(--err); }
.kcol header { display: flex; justify-content: space-between; align-items: baseline; padding: .6rem .7rem .4rem; gap: .5rem; } .kcol.over { outline: 2px dashed var(--cyan); outline-offset: -2px; background: var(--cyan-l); }
.kbody { padding: .2rem .5rem .6rem; display: grid; gap: .5rem; align-content: start; flex: 1; }
.kcard { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: .55rem .65rem; cursor: grab; box-shadow: 0 1px 0 rgba(22,50,79,.06); } .kcard.drag { opacity: .45; } .kcard.guardando { opacity: .7; } .kcard:active { cursor: grabbing; }
.kt { font-weight: 600; text-decoration: none; color: var(--ink); display: block; } .kt:hover { text-decoration: underline; } .kmeta { display: flex; gap: .6rem; align-items: baseline; margin: .3rem 0; } .kmeta > :last-child { margin-left: auto; }
.kmove select { width: 100%; font-size: .8rem; padding: .2rem .3rem; }

.cal-nav { display: flex; align-items: center; gap: .75rem; margin-bottom: .6rem; } .cal-nav h2 { margin: 0; flex: 1; text-align: center; font-size: 1.15rem; }
.cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; margin-bottom: 1rem; }
.cal-h { background: var(--line-2); text-align: center; font-size: .75rem; font-weight: 700; padding: .3rem 0; color: var(--ink-3); }
.cal-d { background: var(--panel); min-height: 5.2rem; padding: .25rem; display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: inherit; overflow: hidden; } .cal-d.vacio { background: var(--bg); }
.cal-d b { font-size: .8rem; color: var(--ink-3); } .cal-d.hoy b { background: var(--cyan); color: #fff; border-radius: 99px; width: 1.5rem; height: 1.5rem; display: grid; place-items: center; } .cal-d.sel { outline: 2px solid var(--cyan); outline-offset: -2px; } .cal-d:hover { background: var(--cyan-l); } .cal-d small { color: var(--ink-3); font-size: .7rem; }
.pt { display: block; padding: 1px 5px; border-radius: 3px; font-size: .68rem; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--cyan-l); color: var(--cyan-d); }
.pt-revision { background: #DDF3FA; color: #006C8E; } .pt-parte { background: #E3F4E6; color: var(--ok); } .pt-contrato { background: #EDE6F7; color: #5B3A99; } .pt-tarea { background: #FFF3D6; color: var(--warn); } .pt-cierre { background: #FBE1F0; color: #8C0048; } .pt-llamada { background: var(--ok-l); color: var(--ok); } .pt-visita, .pt-instalacion { background: #E8E4F8; color: #4B3A9A; }
@media (max-width: 640px) { .cal-d { min-height: 3.3rem; } .cal-d .pt { font-size: 0; height: 6px; padding: 0; margin-top: 1px; } .cal-d small { display: none; } .kanban { grid-auto-columns: 82vw; } }

/* ---------- imagen por línea de documento ---------- */
.lin-thumb { float: left; margin: 0 .7rem .3rem 0; max-width: 96px; max-height: 72px; border: 1px solid var(--line); border-radius: var(--r); background: #fff; display: block; object-fit: contain; }
.lin-thumb.boceto svg { display: block; width: 96px; height: auto; } .lin-thumb.boceto { max-height: none; overflow: hidden; }
td[data-label="Descripción"]::after { content: ""; display: block; clear: both; }
details.lin-img { margin: .35rem 0; border: 1px dashed var(--line); border-radius: var(--r); padding: .3rem .55rem; background: var(--bg); }
details.lin-img > summary { cursor: pointer; display: flex; align-items: center; gap: .6rem; font-size: .88rem; color: var(--ink-2); list-style: none; }
details.lin-img > summary::-webkit-details-marker { display: none; }
.li-th { width: 44px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); background: #fff; border-radius: var(--r); overflow: hidden; flex: none; } .li-th img { width: 100%; height: 100%; object-fit: contain; } .li-plus { color: var(--ink-4); font-size: 1.1rem; }
.li-body { display: grid; gap: .6rem; padding: .6rem 0 .3rem; } .li-body[hidden], .li-body > [hidden] { display: none; }
.li-btn { padding: .3rem .75rem; border: 1px solid var(--line); border-radius: 99px; background: var(--panel); font: inherit; font-size: .85rem; cursor: pointer; } .li-btn.on { background: var(--cyan); border-color: var(--cyan); color: #fff; } .li-btn:focus-visible { box-shadow: var(--focus); outline: 0; }
.li-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .5rem; } .li-grid label { display: grid; gap: .15rem; font-size: .8rem; color: var(--ink-3); } .li-grid input[type=color] { height: 2.1rem; padding: 0 .2rem; }
.li-sizes { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; margin-top: .4rem; } .chip-mini { padding: .15rem .55rem; border: 1px solid var(--line); border-radius: 99px; background: var(--panel); font: inherit; font-size: .78rem; cursor: pointer; } .chip-mini:hover { border-color: var(--cyan); }
.li-prev { max-width: 220px; border: 1px solid var(--line); border-radius: var(--r); background: #fff; } .li-msg.err { color: var(--err); }
.prod-img { display: flex; gap: 1rem; align-items: flex-start; flex-wrap: wrap; margin-bottom: 1rem; } .prod-img img { border: 1px solid var(--line); border-radius: var(--r); background: #fff; max-width: 220px; height: auto; } .prod-img > div { flex: 1; min-width: 240px; }

/* ---------- suscripción: métodos de pago ---------- */
.metodos { border: 0; padding: 0; margin: .5rem 0; display: grid; gap: .25rem; } .metodos legend { padding: 0; margin-bottom: .2rem; }
.callout { background: var(--cyan-l); border-left: 4px solid var(--cyan); padding: .6rem .8rem; margin: .7rem 0; border-radius: var(--r); } .callout code { word-break: break-all; }