:root{
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  --f:'Barlow','Segoe UI',system-ui,-apple-system,Arial,sans-serif;
  --fc:'Barlow Semi Condensed','Barlow','Arial Narrow','Segoe UI',system-ui,Arial,sans-serif;
  /* Los colores están en temas.css. */
}
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 14px/1.45 var(--f)}
h1,h2,h3,h4,p{margin:0}
h1{font:600 21px/1.2 var(--fc)} h2{font:600 16px/1.25 var(--fc)} h3{font:600 14px/1.3 var(--f)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.i{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.i.s{width:14px;height:14px} .i.l{width:22px;height:22px}
.mut{color:var(--muted)} .sm{font-size:12.5px} .num{font-variant-numeric:tabular-nums}
.row{display:flex;align-items:center;gap:8px} .row.wrap{flex-wrap:wrap} .sp{justify-content:space-between} .grow{flex:1;min-width:0}
.stack>*+*{margin-top:12px}

/* barra superior */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;height:54px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 16px}
.logo{display:flex;align-items:center;gap:8px;font:600 21px/1 var(--fc);letter-spacing:.1px;text-decoration:none;color:var(--ink)}
.wm b{font-weight:700;color:var(--accent)}
.logo-m{width:32px;height:28px;border-radius:5px;background:var(--sign);display:grid;place-items:center;color:#fff;font:700 13px/1 var(--fc);font-style:normal;letter-spacing:.4px;box-shadow:inset 0 0 0 1.5px var(--sign),inset 0 0 0 2.5px rgba(255,255,255,.9)}
.zbtn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:6px;background:var(--sign);color:#fff;font:600 14px/1 var(--fc);letter-spacing:.2px;box-shadow:inset 0 0 0 2px var(--sign),inset 0 0 0 3.5px rgba(255,255,255,.9);white-space:nowrap}
.zbtn:hover{filter:brightness(1.1)}
.srch{position:relative;flex:1;max-width:420px}
.srch .i{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted)}
.srch input{width:100%;height:34px;border:1px solid var(--line);border-radius:7px;background:var(--surface2);padding:0 34px 0 32px;outline-offset:0}
.srch kbd{position:absolute;right:8px;top:50%;transform:translateY(-50%);font:500 11px var(--f);color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:1px 5px;background:var(--surface)}
.top-r{margin-left:auto;display:flex;align-items:center;gap:6px}
.icon-btn{width:34px;height:34px;border-radius:7px;display:grid;place-items:center;color:var(--ink2);position:relative}
.icon-btn:hover{background:var(--surface2)}
.badge{min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--mark);color:#1B1F24;font:700 11px/17px var(--f);text-align:center;display:inline-block}
.icon-btn .badge{position:absolute;top:1px;right:0}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font:700 12px var(--f);flex:none}
.avatar.lg{width:72px;height:72px;font-size:24px;border:3px solid var(--surface)}
.avatar.biz{border-radius:8px;background:var(--info-soft);color:var(--info)}

/* estructura */
.app{display:grid;grid-template-columns:204px minmax(0,1fr) 250px;gap:18px;max-width:1260px;margin:0 auto;padding:16px}
.side,.right{position:sticky;top:calc(70px + env(safe-area-inset-top,0px));align-self:start;max-height:calc(100vh - 86px);overflow:auto}
#main{min-width:0;outline:0}
.nav-g{font:600 12px var(--f);color:var(--muted);padding:14px 10px 4px}
.nav-i{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;border-radius:7px;color:var(--ink2);font-weight:500;text-align:left}
.nav-i:hover{background:var(--surface)}
.nav-i.on{background:var(--surface);color:var(--accent);font-weight:600;box-shadow:inset 3px 0 0 var(--accent)}
.nav-i .badge{margin-left:auto}
.tabs{display:none}
.only-m{display:none}

/* piezas */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px}
.panel.flush{padding:0;overflow:hidden}
.panel.soft{background:var(--surface2)}
.ph{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 13px;border-radius:7px;font:600 13px/1 var(--f);border:1px solid transparent;white-space:nowrap;text-decoration:none}
.btn.pri{background:var(--accent);color:var(--accent-ink)} .btn.pri:hover{background:var(--accent-h)}
.btn.sec{background:var(--surface);border-color:var(--line);color:var(--ink)} .btn.sec:hover{background:var(--surface2)}
.btn.dan{background:var(--surface);border-color:var(--line);color:var(--danger)} .btn.dan:hover{background:var(--danger-soft)}
.btn.small{height:28px;padding:0 9px;font-size:12.5px}
.btn.block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.lnk{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.pill{display:inline-flex;align-items:center;gap:4px;font:600 12px/1 var(--f);padding:4px 8px;border-radius:99px;white-space:nowrap}
.pill.ok{background:var(--accent-soft);color:var(--accent)} .pill.warn{background:var(--mark-soft);color:var(--mark-ink)}
.pill.info{background:var(--info-soft);color:var(--info)} .pill.bad{background:var(--danger-soft);color:var(--danger)}
.pill.neu{background:var(--surface2);color:var(--ink2);border:1px solid var(--line)}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.chip{height:30px;padding:0 11px;border-radius:99px;border:1px solid var(--line);background:var(--surface);font:500 13px/1 var(--f);white-space:nowrap;display:inline-flex;align-items:center;gap:5px;color:var(--ink2)}
.chip:hover{border-color:var(--muted)} .chip.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.empty{text-align:center;padding:30px 16px;color:var(--muted)}
.empty .i{width:30px;height:30px;margin-bottom:8px} .empty h3{color:var(--ink);margin-bottom:4px} .empty .btn{margin-top:12px}
.inp,select.inp,textarea.inp{width:100%;height:36px;border:1px solid var(--line);border-radius:7px;background:var(--surface);padding:0 10px}
textarea.inp{height:auto;min-height:84px;padding:8px 10px;resize:vertical;line-height:1.45}
.inp.err{border-color:var(--danger)}
.fld{display:flex;flex-direction:column;gap:4px;min-width:0} .fld>label,.fld>.lbl{font:600 12.5px var(--f);color:var(--ink2)}
.fld .e{color:var(--danger);font-size:12px;min-height:0} .fld .h{color:var(--muted);font-size:12px}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .fgrid .full{grid-column:1/-1}
.fgrid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
table.t{width:100%;border-collapse:collapse} .t th{font:600 12px var(--f);color:var(--muted);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
.t td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle} .t tr:last-child td{border-bottom:0}
.tw{overflow-x:auto}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.kpi{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--surface)}
.kpi b{display:block;font:600 22px/1.2 var(--fc)} .kpi span{font-size:12.5px;color:var(--muted)}

/* letrero de zona */
.sign{background:var(--sign);color:#fff;border-radius:10px;padding:5px}
.sign-in{border:2px solid rgba(255,255,255,.92);border-radius:7px;padding:14px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 20px;align-items:center}
.sign h1{font:700 30px/1.05 var(--fc);letter-spacing:.2px;color:#fff}
.sign-n{font:600 15px var(--fc);opacity:.92;margin-top:3px}
.sign-rows{display:flex;flex-direction:column;gap:2px;min-width:190px}
.sign-row{display:flex;align-items:center;gap:8px;width:100%;padding:3px 6px;border-radius:4px;color:#fff;font:600 16px/1.3 var(--fc);text-align:left}
.sign-row:hover{background:rgba(255,255,255,.16)} .sign-row b{margin-left:auto;font-weight:700}
.sign-f{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.35);padding-top:10px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:13px}
.sign-f button{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.sw{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none}
.sw input{appearance:none;width:30px;height:17px;border-radius:9px;background:rgba(255,255,255,.3);position:relative;margin:0;cursor:pointer;transition:background .15s}
.sw input:after{content:"";position:absolute;left:2px;top:2px;width:13px;height:13px;border-radius:50%;background:#fff;transition:left .15s}
.sw input:checked{background:var(--mark)} .sw input:checked:after{left:15px}
.sw.dk input{background:var(--line)} .sw.dk input:checked{background:var(--accent)}

.quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.qa{display:flex;gap:10px;align-items:flex-start;text-align:left;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.qa:hover{border-color:var(--accent)} .qa .i{color:var(--accent);margin-top:1px} .qa b{display:block;font-weight:600} .qa span{font-size:12.5px;color:var(--muted)}

/* autos */
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.car{border:1px solid var(--line);border-radius:9px;background:var(--surface);overflow:hidden;cursor:pointer;display:flex;flex-direction:column}
.car:hover{border-color:var(--muted)}
.art{position:relative;aspect-ratio:16/10;background:linear-gradient(180deg,var(--art1) 0 62%,var(--art2) 62% 100%);display:grid;place-items:end center;overflow:hidden}
.art img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.sil{width:86%;margin-bottom:6%} .sil .bd{stroke:rgba(0,0,0,.28);stroke-width:1} .sil .gl{fill:var(--glass)} .sil .ty{fill:var(--tyre)} .sil .hb{fill:var(--hub)} .sil .sh{fill:rgba(0,0,0,.16)}
.art .tag{position:absolute;left:8px;top:8px}
.fav{position:absolute;right:8px;top:8px;width:30px;height:30px;border-radius:50%;background:var(--surface);color:var(--ink2);display:grid;place-items:center;border:1px solid var(--line)}
.fav.on{color:var(--danger)} .fav.on .i{fill:currentColor}
.car-b{padding:10px 12px 12px;display:flex;flex-direction:column;gap:5px;flex:1}
.car-b h3{font-size:14px;line-height:1.25}
.meta{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12.5px;color:var(--muted)} .meta span{display:inline-flex;align-items:center;gap:4px}
.price{font:700 19px/1.2 var(--fc);letter-spacing:.1px}
.car-f{display:flex;justify-content:space-between;align-items:center;gap:4px 8px;flex-wrap:wrap;margin-top:2px}
.cmp{font:600 12px var(--f);color:var(--ink2);display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border:1px solid var(--line);border-radius:6px}
.cmp.on{background:var(--accent-soft);color:var(--accent);border-color:transparent}
.filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.cmpbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:25;background:var(--ink);color:var(--surface);border-radius:10px;padding:8px 8px 8px 14px;display:flex;align-items:center;gap:10px;font-weight:600;max-width:calc(100vw - 24px)}
.cmpbar .btn.sec{background:transparent;color:inherit;border-color:rgba(127,127,127,.5)}

/* detalle */
.gal{position:relative;border-radius:9px;overflow:hidden} .gal .art{aspect-ratio:auto;height:230px} .gal .sil{width:auto;height:74%;margin-bottom:22px} .gal.foto .art{height:min(52vw,380px)}
.thumbs{display:flex;gap:6px;margin-top:6px;overflow-x:auto} .thumbs button{width:72px;height:50px;border-radius:6px;overflow:hidden;border:2px solid transparent;flex:none} .thumbs button.on{border-color:var(--accent)} .thumbs img{width:100%;height:100%;object-fit:cover}
.det{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;margin-top:14px}
.specs{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px} .spec{background:var(--surface2);border-radius:7px;padding:8px} .spec b{display:block;font-weight:600} .spec span{font-size:12px;color:var(--muted)}
.plate{display:inline-block;font:700 12px/1 var(--fc);letter-spacing:1px;border:1.5px solid var(--ink);border-radius:4px;padding:3px 6px;background:var(--surface)}
.tip{display:flex;gap:8px;font-size:12.5px;color:var(--muted)} .tip .i{color:var(--accent);margin-top:1px}

/* feed */
.post-h{display:flex;gap:10px;align-items:center} .post-h b{font-weight:600}
.post-t{margin:10px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.embed{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;border:1px solid var(--line);border-radius:8px;overflow:hidden;cursor:pointer;align-items:center} .embed:hover{border-color:var(--muted)} .embed .art{aspect-ratio:16/11} .embed>div:last-child{padding:8px 10px 8px 0}
.post-a{display:flex;gap:4px;border-top:1px solid var(--line);margin-top:12px;padding-top:6px}
.post-a button{flex:1;height:32px;border-radius:6px;font:600 13px var(--f);color:var(--ink2);display:inline-flex;gap:6px;align-items:center;justify-content:center} .post-a button:hover{background:var(--surface2)} .post-a button.on{color:var(--accent)} .post-a button.on .i{fill:var(--accent-soft)}
.cmts{margin-top:8px;display:flex;flex-direction:column;gap:8px} .cmt{display:flex;gap:8px} .cmt .avatar{width:26px;height:26px;font-size:10px} .cmt>div{background:var(--surface2);border-radius:8px;padding:6px 10px;min-width:0;overflow-wrap:anywhere}
.composer{display:flex;gap:10px;align-items:center} .composer .fake{flex:1;height:36px;border:1px solid var(--line);border-radius:18px;background:var(--surface2);color:var(--muted);text-align:left;padding:0 14px}

/* pasos */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;counter-reset:s;margin:12px 0}
.step{counter-increment:s;border-top:3px solid var(--line);padding-top:6px;font:500 12.5px var(--f);color:var(--muted)}
.step:before{content:counter(s) ". "} .step.done{border-color:var(--accent);color:var(--ink)} .step.cur{border-color:var(--mark);color:var(--ink);font-weight:600}

/* mensajes */
.msgs{display:grid;grid-template-columns:260px minmax(0,1fr);height:min(620px,calc(100vh - 110px))}
.people{border-right:1px solid var(--line);overflow:auto}
.person{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)} .person:hover{background:var(--surface2)} .person.on{background:var(--accent-soft)}
.person .grow b{display:block;font-weight:600} .person .grow span{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat{display:flex;flex-direction:column;min-width:0;min-height:0}
.chat-h{padding:10px 14px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center}
.chat-b{flex:1;overflow:auto;padding:14px;background:var(--surface2);display:flex;flex-direction:column;gap:6px}
.bub{max-width:76%;padding:7px 11px;border-radius:12px 12px 12px 3px;background:var(--surface);border:1px solid var(--line);align-self:flex-start;overflow-wrap:anywhere}
.bub.me{align-self:flex-end;background:var(--accent);color:var(--accent-ink);border-color:transparent;border-radius:12px 12px 3px 12px}
.bub small{display:block;font-size:11px;opacity:.7;margin-top:2px}
.chat-n{font-size:12px;color:var(--muted);text-align:center;padding:2px 0 6px}
.chat-q{display:flex;gap:6px;padding:8px 12px 0;overflow-x:auto}
.chat-i{display:flex;gap:8px;padding:10px 12px}

/* asesor */
.bot{display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto;padding:2px}

/* perfil */
.cover{height:96px;background:var(--sign);position:relative;overflow:hidden}
.cover:after{content:"";position:absolute;left:0;right:0;top:50%;height:4px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.85) 0 34px,transparent 34px 60px)}
.prof{padding:0 16px 14px;margin-top:-36px;position:relative}
.ptabs{display:flex;gap:2px;border-top:1px solid var(--line);padding:0 8px;overflow-x:auto}
.ptabs button{padding:10px 12px;font:600 13px var(--f);color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap} .ptabs button.on{color:var(--accent);border-color:var(--accent)}

/* derecha */
.zl{display:flex;justify-content:space-between;align-items:center;width:100%;padding:6px 8px;border-radius:6px;text-align:left;gap:8px} .zl:hover{background:var(--surface2)} .zl.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.right .panel{padding:12px} .right h2{font:600 13.5px var(--f);margin:0 0 6px 8px}

/* mapa */
.map{width:100%;max-width:340px;display:block;margin:0 auto}
.map .road{fill:none;stroke:var(--muted);stroke-width:3;stroke-linecap:round} .map .ferry{fill:none;stroke:var(--muted);stroke-width:2;stroke-dasharray:3 5}
.map .dot{fill:var(--surface);stroke:var(--sign);stroke-width:3;cursor:pointer} .map .dot.on{fill:var(--mark);stroke:var(--ink)}
.map text{font:600 12px var(--fc);fill:var(--ink)} .map .cnt{fill:var(--muted);font-weight:500} .map g{cursor:pointer}
.zgrid{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:16px;align-items:start}

/* modal y avisos */
.mbg{position:fixed;inset:0;background:rgba(10,14,12,.5);z-index:50;display:grid;place-items:center;padding:16px;overflow:auto}
.modal{background:var(--surface);border-radius:12px;width:100%;max-width:520px;padding:18px;border:1px solid var(--line);max-height:calc(100vh - 32px);overflow:auto}
.modal.narrow{max-width:400px}
.modal-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.modal-f{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;flex-wrap:wrap}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(72px + env(safe-area-inset-bottom,0px));z-index:60;background:var(--ink);color:var(--surface);padding:9px 14px;border-radius:8px;font-weight:500;max-width:calc(100vw - 24px);display:none}
.toast.show{display:block}
.drop{border:1.5px dashed var(--line);border-radius:9px;padding:20px;text-align:center;color:var(--muted)} .drop.over{border-color:var(--accent);background:var(--accent-soft)}
.pfotos{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px} .pfoto{position:relative;width:96px;height:68px;border-radius:6px;overflow:hidden;border:1px solid var(--line)} .pfoto img{width:100%;height:100%;object-fit:cover} .pfoto button{position:absolute;right:3px;top:3px;width:20px;height:20px;border-radius:50%;background:var(--ink);color:var(--surface);display:grid;place-items:center}
.best{background:var(--accent-soft);color:var(--accent);font-weight:600}
details.guide{border-bottom:1px solid var(--line);padding:12px 0} details.guide:last-child{border-bottom:0} details.guide summary{cursor:pointer;font-weight:600} details.guide ul{margin:8px 0 0;padding-left:18px;color:var(--ink2)} details.guide li{margin:3px 0;max-width:70ch}

@media (max-width:1120px){
  .app{grid-template-columns:204px minmax(0,1fr)} .right{display:none}
}
@media (max-width:860px){
  .app{grid-template-columns:minmax(0,1fr);padding:12px 12px 76px}
  .side{display:none;position:fixed;inset:0 auto 0 0;top:0;width:264px;max-height:none;z-index:45;background:var(--bg);padding:calc(12px + env(safe-area-inset-top,0px)) 10px 20px;border-right:1px solid var(--line)}
  .side.open{display:block} .scrim{position:fixed;inset:0;background:rgba(10,14,12,.5);z-index:44}
  .only-m{display:grid} .only-d{display:none!important}
  .top .srch{display:none} .logo .wm{display:none} .top-r{margin-left:0}
  .side{align-self:stretch;height:auto;overflow:auto}
  .top{gap:8px;padding:0 10px}
  .tabs{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .tabs button{height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:500 11px var(--f);color:var(--muted);position:relative} .tabs button.on{color:var(--accent);font-weight:600}
  .tabs .badge{position:absolute;top:5px;left:54%}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))} .quick,.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .det,.zgrid{grid-template-columns:minmax(0,1fr)} .specs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sign-in{grid-template-columns:minmax(0,1fr)} .sign h1{font-size:26px}
  .msgs{grid-template-columns:minmax(0,1fr);height:calc(100vh - 150px)} .msgs.open .people{display:none} .msgs:not(.open) .chat{display:none}
  .cmpbar{bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  .fgrid.c3{grid-template-columns:repeat(2,minmax(0,1fr))}
  input,select,textarea{font-size:16px!important}
}
@media (max-width:460px){
  .grid.one{grid-template-columns:minmax(0,1fr)} .fgrid,.fgrid.c3{grid-template-columns:minmax(0,1fr)}
  .embed{grid-template-columns:110px minmax(0,1fr)} .zbtn{max-width:168px} .zbtn span{overflow:hidden;text-overflow:ellipsis}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

#main>*+*{margin-top:14px}
.qa>span{font-size:14px;color:var(--ink)} .qa span span{display:block;font-size:12.5px;color:var(--muted)}

.car-z{margin-top:auto;padding-top:4px}
.btn.favon{color:var(--danger)} .btn.favon .i{fill:currentColor}
input[type=checkbox]{accent-color:var(--accent)}
.kpi b{overflow-wrap:anywhere}

.uname{font:600 14px/1.3 var(--f);color:var(--ink);text-align:left} .uname:hover{text-decoration:underline;text-underline-offset:2px}
.why{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:99px;background:var(--surface2);border:1px solid var(--line);font-size:11.5px;color:var(--ink2)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:2px;gap:2px}
.seg button{height:28px;padding:0 11px;border-radius:6px;font:600 12.5px var(--f);color:var(--muted)} .seg button.on{background:var(--ink);color:var(--surface)}
.tl{list-style:none;margin:0;padding:0} .tl li{display:flex;gap:10px;align-items:flex-start;padding:0 0 14px;position:relative}
.tl li:before{content:"";position:absolute;left:13px;top:28px;bottom:0;width:1px;background:var(--line)} .tl li:last-child{padding-bottom:0} .tl li:last-child:before{display:none}
.tl-i{width:27px;height:27px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.ucard{display:block;width:100%;text-align:left} .ucard:hover{border-color:var(--muted)}
.gcar{display:grid;grid-template-columns:170px minmax(0,1fr);gap:14px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:10px;background:var(--surface)} .gcar .art{border-radius:6px}
.notif{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);border-radius:6px} .notif:last-child{border-bottom:0} .notif:hover{background:var(--surface2)} .notif.new{font-weight:600}
.dotn{width:9px;height:9px;border-radius:50%;background:var(--mark);flex:none}
.avatar.biz.lg{border-radius:14px}
@media (max-width:560px){.gcar{grid-template-columns:minmax(0,1fr)} .gcar .art{max-height:150px}}

@media (max-width:860px){.det>.stack:first-child{display:contents} .det>.stack:first-child>*{order:2;margin-top:0} .det>.stack:first-child>:first-child{order:0} .det>.stack:last-child{order:1}}

/* ===== sitio (páginas renderizadas en el servidor) ===== */
.pagina{max-width:900px;margin:0 auto;padding:16px}
.pagina>*+*{margin-top:14px}
a.sign-row{text-decoration:none}
.sign-f a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.aviso-error{border-left:4px solid var(--danger)}
.aviso-error code{display:block;margin-top:8px;padding:8px 10px;background:var(--surface2);border-radius:6px;font-size:12.5px;overflow-wrap:anywhere}

/* ===== ingreso, registro y cuenta ===== */
.acceso{max-width:430px;margin-left:auto;margin-right:auto}
.acceso form{display:grid;gap:12px;margin:14px 0}
.acceso .row .inp{flex:1;min-width:0}
.alerta{background:var(--danger-soft);color:var(--danger);border-radius:7px;padding:9px 12px;font-weight:500}
.aviso-ok{background:var(--accent-soft);color:var(--accent);border-radius:7px;padding:9px 12px;font-weight:600}
.fld .e:empty{display:none}
.top-r form{display:inline-flex}
.nombre-usuario{max-width:160px;overflow:hidden;text-overflow:ellipsis}
@media (max-width:560px){.nombre-usuario{display:none}}
.specs.anchas{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.pagina.ancho{max-width:1200px}
.aviso-pendiente{background:var(--mark-soft);color:var(--mark-ink);border-radius:7px;padding:9px 12px;font-weight:500}
.correo{border-top:1px solid var(--line);padding:14px 0}
.correo pre{margin:8px 0 10px;padding:10px 12px;background:var(--surface2);border-radius:7px;font:400 13px/1.5 var(--f);white-space:pre-wrap;overflow-wrap:anywhere}
.externos{margin-top:14px}
.btn-externo{gap:9px;height:38px}
.separador{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px;margin:14px 0 -2px}
.separador:before,.separador:after{content:"";flex:1;height:1px;background:var(--line)}

/* ===== garaje ===== */
[hidden]{display:none!important}
.gcar .art{display:grid;place-items:center;aspect-ratio:16/10;text-decoration:none}
.sin-foto{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--muted);font-size:12.5px}
.sin-foto .i{width:26px;height:26px}
.fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}
.foto{margin:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface2)}
/* El enlace define el recuadro y la imagen lo llena recortada al centro: una foto vertical no cambia el alto de la tarjeta. */
.foto a{position:relative;display:block;aspect-ratio:4/3;overflow:hidden}
.foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.foto figcaption{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:5px;min-height:38px}
.btn.icono{padding:0;width:28px;height:28px;display:inline-grid;place-items:center}
.leyenda{display:flex;align-items:center;gap:4px;margin-top:8px}
.subir{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}
.subir .alerta{font-size:12.5px}
.oculto-accesible{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.oculto-accesible:focus+*{outline:2px solid var(--accent);outline-offset:2px}
.tl li form{flex:none}
@media (max-width:560px){.solo-ancho{display:none}}
form[aria-busy="true"]{opacity:.6;pointer-events:none}
.avisos{position:fixed;right:16px;bottom:16px;z-index:50;display:flex;flex-direction:column;gap:8px;max-width:min(360px,calc(100vw - 32px))}
.aviso-flotante{background:var(--accent);color:var(--accent-ink);padding:10px 14px;border-radius:8px;font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.18);transition:opacity .3s,transform .3s;overflow-wrap:anywhere}
.aviso-flotante.error{background:var(--danger);color:#fff}
.aviso-flotante.saliendo{opacity:0;transform:translateY(6px)}
@media (prefers-reduced-motion:reduce){.aviso-flotante{transition:none}}

/* ===== avisos y búsqueda ===== */
.fgrid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.fld.fin{align-self:end;padding-bottom:8px}
a.car{text-decoration:none;color:inherit}
a.car .art{position:relative;display:grid;place-items:center;aspect-ratio:16/10;background:var(--surface2)}
a.car .art img{width:100%;height:100%;object-fit:cover;display:block}
a.car .etiqueta{position:absolute;left:8px;top:8px}
.car-t{font-weight:600;font-size:14px;line-height:1.25}
.price.grande{font-size:26px}
.paginas{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px}
.galeria-principal{display:block;border-radius:9px;overflow:hidden;background:var(--surface2)}
.galeria-principal img{display:block;width:100%;max-height:min(62vw,520px);object-fit:contain}
.dos-columnas{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start}
.columna>*+*{margin-top:14px}
.compartir h3{margin-bottom:8px}
.compartir summary{cursor:pointer}
.acciones-venta{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.falta{margin:8px 0 0 18px;color:var(--mark-ink)}
.pill.mut{background:var(--surface2);color:var(--muted)}
@media (max-width:900px){.fgrid.c4{grid-template-columns:repeat(2,minmax(0,1fr))} .dos-columnas{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.fgrid.c4{grid-template-columns:minmax(0,1fr)} .price.grande{font-size:22px}}
.compartir .row .inp{flex:1 1 100%}
@media (max-width:560px){.filtros .fgrid.c4{grid-template-columns:repeat(2,minmax(0,1fr))} .filtros .fld.fin{grid-column:1/-1;padding-bottom:0}}

/* ===== pestañas ===== */
.pestanas{display:flex;gap:2px;margin:14px -4px -6px;overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--line);padding-top:6px}
.pestanas::-webkit-scrollbar{display:none}
.pestana{flex:none;padding:8px 12px;border-radius:7px;font-weight:600;color:var(--muted);text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.pestana:hover{background:var(--surface2);color:var(--ink)}
.pestana.activa{background:var(--accent-soft);color:var(--accent)}
.pestana .cuenta{font-size:12px;font-weight:600;background:var(--surface2);color:var(--muted);border-radius:999px;padding:1px 7px}
.pestana.activa .cuenta{background:var(--surface);color:var(--accent)}
/* Con JavaScript se muestra solo el panel de la pestaña elegida; sin él, todos, uno bajo el otro. */
.js [data-panel]{display:none}
.js [data-panel].visible{display:block}
.js .pagina>[data-panel].visible{margin-top:14px}

/* ===== ayudas de compra ===== */
.revision{border-top:1px solid var(--line);padding:8px 0}
.revision summary{cursor:pointer;font-weight:600;display:flex;align-items:center;gap:8px;list-style:none}
.revision summary::-webkit-details-marker{display:none}
.revision summary:before{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(-45deg);transition:transform .15s;flex:none;margin-left:2px}
.revision[open] summary:before{transform:rotate(45deg)}
.revision .cuenta{font-size:12px;font-weight:600;background:var(--surface2);color:var(--muted);border-radius:999px;padding:1px 7px}
.revision ul{margin:8px 0 4px 26px;display:flex;flex-direction:column;gap:6px}
.cuenta-simple{display:flex;flex-direction:column;gap:6px;margin:0}
.cuenta-simple div{display:flex;justify-content:space-between;gap:12px}
.cuenta-simple dd{margin:0;font-weight:600;white-space:nowrap}
.cuenta-simple .total{border-top:1px solid var(--line);padding-top:6px}
.cuenta-simple .total dd{font:700 17px/1.2 var(--fc)}
.pasos{counter-reset:paso;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.pasos>li{counter-increment:paso;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px}
.pasos>li:before{content:counter(paso);width:34px;height:34px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:700}
.pasos h3{margin-bottom:4px}
.pasos ul{margin:6px 0 0 18px;display:flex;flex-direction:column;gap:4px}
@media (prefers-reduced-motion:reduce){.revision summary:before{transition:none}}
.opcion{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:9px;text-decoration:none;color:inherit}
.opcion:hover{border-color:var(--muted);background:var(--surface2)}
/* Una lista con opciones largas o un selector de archivo no deben ensanchar la página en pantallas angostas. */
.fld{min-width:0}
select.inp,input.inp[type="file"]{max-width:100%;min-width:0;text-overflow:ellipsis}
.solo-angosto{display:none}
@media (max-width:560px){.solo-angosto{display:inline} .top-r{gap:4px} .top-r .btn.small{padding-left:8px;padding-right:8px}}

/* ===== muro ===== */
.dos-columnas.muro{grid-template-columns:minmax(0,1fr) 300px}
.post{padding:14px}
a.avatar{text-decoration:none}
.avatar.grande{width:56px;height:56px;font-size:20px}
a.embed{text-decoration:none;color:inherit;grid-template-columns:130px minmax(0,1fr)}
.embed .art{display:grid;place-items:center;background:var(--surface2);height:100%;min-height:92px;position:relative;overflow:hidden;aspect-ratio:auto}
.embed .art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.embed-b{display:flex;flex-direction:column;gap:2px;padding:8px 10px 8px 0;min-width:0}
.embed-b .price{font-size:16px}
.post-a form{display:flex;flex:1}
.post-a form button{width:100%}
.post-a .accion{flex:1;height:32px;border-radius:6px;font:600 13px var(--f);color:var(--ink2);display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.post-a .accion:hover{background:var(--surface2)}
.cmt form{flex:none}
.cmt .uname.sm{font-size:13px}
.comentar{margin-top:2px}
.redactar textarea{resize:vertical;min-height:58px}
.pestanas.sueltas{margin:0;border-top:0;padding-top:0}
.lista-avisos{display:flex;flex-direction:column;gap:10px}
.aviso-chico{display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px;text-decoration:none;color:inherit;align-items:center}
.aviso-chico .art{aspect-ratio:4/3;border-radius:7px;overflow:hidden;background:var(--surface2);position:relative}
.aviso-chico .art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.aviso-chico>span:last-child{display:flex;flex-direction:column;min-width:0}
.aviso-chico b{font-weight:600;font-size:13.5px;line-height:1.25}
.aviso-chico .price{font-size:15px}
.lista-zonas{display:flex;flex-direction:column;gap:2px}
.zona-fila{display:flex;justify-content:space-between;gap:8px;padding:6px 8px;border-radius:6px;text-decoration:none;color:inherit}
.zona-fila:hover{background:var(--surface2)}
.zona-fila.activa{background:var(--accent-soft);color:var(--accent);font-weight:600}
@media (max-width:900px){.dos-columnas.muro{grid-template-columns:minmax(0,1fr)}}

/* ===== aviso de espera en envíos largos ===== */
.cargando{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;gap:0;padding:20px}
.cargando .giro{flex:none;width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:giro .8s linear infinite;background:var(--surface);box-sizing:content-box;padding:0;margin-right:-38px;position:relative;z-index:1}
.cargando>span:last-child{background:var(--surface);color:var(--ink);padding:16px 18px 16px 52px;border-radius:10px;max-width:360px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.25)}
@keyframes giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.cargando .giro{animation-duration:2.5s}}
@media (max-width:560px){.redactar .row.wrap select{flex:1 1 100%;width:100%!important} .redactar .row.wrap .btn{margin-left:auto}}

/* ===== barra superior tipo red social ===== */
.top{gap:10px}
.buscar{display:flex;align-items:center;gap:8px;background:var(--surface2);border-radius:999px;padding:0 14px;height:38px;flex:0 1 300px;min-width:0;color:var(--muted)}
.buscar input{border:0;background:transparent;font:inherit;color:var(--ink);width:100%;min-width:0;outline:0}
.buscar:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.top-nav{display:flex;gap:4px;flex:1;justify-content:center;min-width:0}
.top-i{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:84px;height:54px;padding:0 10px;color:var(--ink2);text-decoration:none;font:600 11.5px var(--f);border-bottom:3px solid transparent}
.top-i .i{width:22px;height:22px}
.top-i:hover{background:var(--surface2)}
.top-i.on{color:var(--accent);border-bottom-color:var(--accent)}
.top-r{display:flex;align-items:center;gap:8px;margin-left:auto}
.campana{position:relative;width:38px;height:38px;border-radius:50%;background:var(--surface2);display:grid;place-items:center;color:var(--ink)}
.campana:hover,.campana.on{background:var(--accent-soft);color:var(--accent)}
.contador{position:absolute;top:-3px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#C4322B;color:#fff;font:700 11px/18px var(--f);text-align:center}
.menu-usuario{position:relative}
.menu-usuario summary{list-style:none;display:flex;align-items:center;gap:6px;cursor:pointer;padding:3px 10px 3px 3px;border-radius:999px;background:var(--surface2);font-weight:600}
.menu-usuario summary::-webkit-details-marker{display:none}
.menu-usuario[open] summary,.menu-usuario summary:hover{background:var(--accent-soft)}
.menu-usuario .menu{position:absolute;right:0;top:calc(100% + 8px);min-width:200px;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.16);padding:6px;display:flex;flex-direction:column;z-index:40}
.menu-usuario .menu a,.menu-usuario .menu button{display:block;width:100%;text-align:left;padding:9px 10px;border-radius:7px;color:var(--ink);text-decoration:none;font:500 14px var(--f);background:none;border:0;cursor:pointer}
.menu-usuario .menu a:hover,.menu-usuario .menu button:hover{background:var(--surface2)}
.avatar{overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.avatar.chico{width:26px;height:26px;font-size:10px}
.avatar.grande{width:96px;height:96px;font-size:32px}

/* ===== inicio en tres columnas ===== */
.pagina.inicio{max-width:1320px}
.tres{display:grid;grid-template-columns:250px minmax(0,640px) 310px;gap:20px;justify-content:center;align-items:start}
.tres>.lado{position:sticky;top:70px;display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 86px);overflow:auto;scrollbar-width:thin}
.tres>.centro{display:flex;flex-direction:column;gap:12px;min-width:0}
.menu-lado{display:flex;flex-direction:column;gap:2px}
.menu-lado a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--ink);text-decoration:none;font:500 14.5px var(--f)}
.menu-lado a:hover{background:var(--surface)}
.menu-lado a .i{width:22px;height:22px;color:var(--accent)}
.menu-lado a .num{margin-left:auto;color:var(--muted);font-weight:500}
.menu-lado a.activa{background:var(--accent-soft);color:var(--accent);font-weight:600}
.menu-lado h2{font:600 12.5px var(--f);color:var(--muted);text-transform:none;margin:12px 10px 4px}
.redactar .arriba{display:flex;gap:10px;align-items:flex-start}
.redactar textarea{border:0;background:var(--surface2);border-radius:18px;padding:10px 14px;min-height:42px;resize:none;width:100%;font:inherit;color:var(--ink)}
.redactar textarea:focus{outline:2px solid var(--accent)}
.redactar .acciones{display:flex;flex-wrap:wrap;align-items:center;gap:8px;border-top:1px solid var(--line);margin-top:10px;padding-top:10px}
.redactar .accion-foto{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:8px;font:600 13.5px var(--f);color:var(--ink2);cursor:pointer}
.redactar .accion-foto:hover{background:var(--surface2)}
.redactar .accion-foto .i{color:#2E9E5B;width:20px;height:20px}
.redactar .acciones select{height:36px;width:auto;max-width:190px;border-radius:8px}
.redactar .acciones .btn.pri{margin-left:auto}
.previas{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.previas:empty{display:none}
.previa{position:relative;width:86px;height:86px;border-radius:8px;overflow:hidden;background:var(--surface2)}
.previa img{width:100%;height:100%;object-fit:cover}
.previa button{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;cursor:pointer;font:700 13px/22px var(--f);padding:0}
.post{padding:0;overflow:hidden}
.post>.post-h,.post>.post-t,.post>.cmts,.post>.resumen{padding-left:14px;padding-right:14px}
.post>.post-h{padding-top:12px}
.post>.post-t{font-size:15px;margin:8px 0 10px}
.post>.post-t.corto{font-size:20px;line-height:1.3}
.post-fotos{display:grid;gap:2px;background:var(--line)}
.post-fotos.n2,.post-fotos.n4{grid-template-columns:1fr 1fr}
.post-fotos.n3{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.post-fotos.n3 a:first-child{grid-row:1 / 3}
.post-fotos a{display:block;position:relative;background:var(--surface2);aspect-ratio:4/3;overflow:hidden}
.post-fotos.n1 a{aspect-ratio:auto;max-height:560px}
.post-fotos.n1 img{width:100%;height:auto;max-height:560px;object-fit:cover;display:block}
.post-fotos:not(.n1) img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post-fotos.n3 a:first-child{aspect-ratio:auto}
.post a.embed{margin:0;border-left:0;border-right:0;border-radius:0;grid-template-columns:1fr;gap:0;background:var(--surface2)}
.post a.embed .art{aspect-ratio:16/10;min-height:0;height:auto}
.post a.embed .embed-b{padding:10px 14px;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.post a.embed .embed-b>span:first-child{display:flex;flex-direction:column;min-width:0}
.post a.embed .embed-b b{font-size:15.5px}
.post a.embed .price{font-size:19px;white-space:nowrap}
.post .resumen{display:flex;justify-content:space-between;color:var(--muted);font-size:13px;padding-top:8px;padding-bottom:8px}
.post .resumen a{color:inherit}
.post-a{margin:0 14px;padding:4px 0;border-top:1px solid var(--line)}
.post-a button,.post-a .accion{gap:7px;height:36px;font-size:14px}
.post-a .i{width:19px;height:19px}
.post-a button.on{color:var(--accent)}
.post>.cmts{border-top:1px solid var(--line);margin-top:0;padding-top:10px;padding-bottom:12px}
.cmt>div{border-radius:16px}
.comentar input{border-radius:999px;background:var(--surface2);border-color:transparent}
.sugerido{display:flex;align-items:center;gap:10px}
.sugerido+.sugerido{margin-top:10px}
.sugerido .grow{min-width:0}
.sugerido .uname{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.publicidad{border:1px dashed var(--line);border-radius:10px;padding:14px;color:var(--muted);text-align:center;font-size:13px}
.publicidad b{display:block;color:var(--ink2);font-size:14px;margin-top:2px}
.car-env{position:relative}
.car-env>.fav{position:absolute;top:8px;right:8px;z-index:2}
.fav button{width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#333;display:grid;place-items:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.fav button .i{width:19px;height:19px}
.fav button.on{color:var(--accent)}
.fav button.on .i{fill:currentColor}
.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chip-b{display:inline-flex;align-items:center;gap:2px;background:var(--surface2);border-radius:999px;padding:0 4px 0 12px;height:32px;font-weight:600;font-size:13px}
.chip-b a{color:var(--ink);text-decoration:none}
.chip-b button{border:0;background:none;cursor:pointer;color:var(--muted);width:24px;height:24px;border-radius:50%;font:700 14px var(--f)}
.chip-b button:hover{background:var(--line);color:var(--ink)}
.notif{display:flex;gap:12px;align-items:center;padding:12px;border-radius:9px;text-decoration:none;color:inherit}
.notif:hover{background:var(--surface2)}
.notif.nueva{background:var(--accent-soft)}
.notif .punto{width:10px;height:10px;border-radius:50%;background:var(--accent);flex:none}
.notif.leida .punto{background:transparent}
.portada-perfil{height:120px;background:var(--accent);border-radius:12px 12px 0 0;margin:-16px -16px 0}
.perfil-cab{display:flex;align-items:flex-end;gap:16px;margin-top:-44px;flex-wrap:wrap}
.perfil-cab .avatar.grande{border:4px solid var(--surface);background:var(--accent-soft)}
.perfil-cab .grow{padding-bottom:6px;min-width:0}
@media (max-width:1100px){.tres{grid-template-columns:minmax(0,640px) 300px}.tres>.lado.izq{display:none}}
@media (max-width:820px){.tres{grid-template-columns:minmax(0,1fr)}.tres>.lado{position:static;max-height:none}.tres>.lado.izq{display:flex;order:3}.buscar{display:none}.top-i{min-width:56px;padding:0 6px}.top-i span{display:none}.nombre-usuario{display:none}.menu-usuario summary{padding:3px}}
.centro{display:flex;flex-direction:column;gap:12px;min-width:0}
.post .uname,.sugerido .uname,.cmt .uname{text-decoration:none}
.post .uname:hover,.sugerido .uname:hover,.cmt .uname:hover{text-decoration:underline}
.guardar-busqueda summary{list-style:none;cursor:pointer}
.guardar-busqueda summary::-webkit-details-marker{display:none}

/* ===== pestañas del muro ===== */
.pestanas-muro{display:flex;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.pestanas-muro a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;height:46px;font:600 15px var(--f);color:var(--ink2);text-decoration:none;border-bottom:3px solid transparent}
.pestanas-muro a .i{width:20px;height:20px}
.pestanas-muro a:hover{background:var(--surface2)}
.pestanas-muro a.activa{color:var(--accent);border-bottom-color:var(--accent);background:var(--accent-soft)}
.aviso-flotante a{color:inherit;font-weight:700;text-decoration:underline;margin-left:4px}

/* ===== visor de fotos ===== */
.visor{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.9);display:flex;align-items:center;justify-content:center;padding:48px 56px}
.visor img{max-width:calc(100vw - 128px);max-height:calc(100vh - 96px);min-width:0;object-fit:contain;border-radius:4px}
.visor button{position:absolute;z-index:1;border:0;border-radius:50%;width:44px;height:44px;background:rgba(255,255,255,.16);color:#fff;font:400 28px/1 var(--f);cursor:pointer;display:grid;place-items:center}
.visor button:hover,.visor button:focus-visible{background:rgba(255,255,255,.32)}
.visor-cerrar{top:12px;right:12px}
.visor-ant{left:8px;top:50%;transform:translateY(-50%)}
.visor-sig{right:8px;top:50%;transform:translateY(-50%)}
.visor-cuenta{position:absolute;top:22px;left:50%;transform:translateX(-50%);color:#fff;font-weight:600}
@media (max-width:560px){.visor{padding:56px 8px}.visor img{max-width:calc(100vw - 16px);max-height:calc(100vh - 120px)}.visor-ant,.visor-sig{top:auto;bottom:10px;transform:none}}

/* ===== chat ===== */
.top-avisos{display:flex;align-items:center;gap:8px}
.chat{display:grid;grid-template-columns:330px minmax(0,1fr);gap:14px;height:calc(100vh - 54px - 32px);min-height:420px;max-width:1100px;margin:0 auto}
.chat>.panel{margin:0;min-height:0}
.chat-lista{display:flex;flex-direction:column;overflow:hidden;padding:14px 8px 8px}
.chat-lista h1{padding:0 8px 8px}
.chat-lista>[data-zona]{overflow-y:auto;flex:1;scrollbar-width:thin}
.chat-item{display:flex;gap:10px;align-items:center;padding:10px 8px;border-radius:9px;text-decoration:none;color:inherit}
.chat-item:hover{background:var(--surface2)}
.chat-item.activa{background:var(--accent-soft)}
.chat-item .avatar{width:44px;height:44px;font-size:15px}
.chat-item .grow{display:flex;flex-direction:column;min-width:0}
.chat-item-n{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.chat-item-n b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-item .corta,.chat-auto .corta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.chat-item.nueva .corta:last-child{font-weight:700}
.contador-chico{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font:700 11.5px/20px var(--f);text-align:center;flex:none}
.chat-panel{display:flex;flex-direction:column;padding:0;overflow:hidden}
.chat-cab{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line)}
.chat-cab .avatar{width:40px;height:40px;font-size:14px}
.chat-cab .uname{text-decoration:none;font-size:15px}
.chat-cab .volver-lista{display:none;font-size:20px}
.chat-auto{display:flex;align-items:center;gap:8px;background:var(--surface2);border-radius:9px;padding:5px 10px 5px 5px;text-decoration:none;color:inherit;max-width:240px;min-width:0}
.chat-auto .art{width:52px;height:39px;border-radius:6px;overflow:hidden;background:var(--line);flex:none;position:relative}
.chat-auto .art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.chat-auto>span:last-child{display:flex;flex-direction:column;min-width:0}
.chat-hilo{flex:1;overflow-y:auto;padding:14px;scrollbar-width:thin}
.chat-mensajes{display:flex;flex-direction:column;gap:4px;min-height:100%;justify-content:flex-end}
.chat-dia{align-self:center;font-size:12.5px;margin:8px 0 4px}
.globo{align-self:flex-start;max-width:min(75%,520px);background:var(--surface2);border-radius:18px 18px 18px 5px;padding:7px 12px;overflow-wrap:anywhere}
.globo-t{white-space:pre-wrap}
.globo.mio{align-self:flex-end;background:var(--accent);color:var(--accent-ink);border-radius:18px 18px 5px 18px}
.globo-h{font-size:11px;opacity:.7;margin-left:8px;white-space:nowrap}
.chat-visto{align-self:flex-end;margin-top:-1px}
.chat-enviar{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line)}
.chat-enviar .inp{border-radius:999px;background:var(--surface2);border-color:transparent}
@media (max-width:820px){
  .chat{grid-template-columns:minmax(0,1fr);height:calc(100vh - 54px - 16px)}
  .chat.abierto .chat-lista{display:none}
  .chat:not(.abierto) .chat-panel{display:none}
  .chat-cab .volver-lista{display:inline-grid}
  .chat-auto{max-width:150px}
  .pagina.inicio:has(.chat){padding:8px}
}

/* ===== privacidad e intereses ===== */
.opciones{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:0;display:flex;flex-direction:column;gap:10px}
.opciones legend{font:600 14px var(--f);padding:0 6px}
.marca{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.marca input{margin-top:3px;width:18px;height:18px;accent-color:var(--accent);flex:none}
.marca>span{display:flex;flex-direction:column}
.marca b{font-weight:600}
.btn.peligro{background:var(--urgente);color:#fff}
.btn.peligro:hover{background:#8F1D17}
.con-marca{position:relative}
.marca-nuevo{position:absolute;top:8px;left:8px;z-index:2}

/* ===== prenda y calificaciones ===== */
.prenda{border-left:4px solid var(--mark-ink)}
.estrella{color:#D99000;letter-spacing:1px}
.estrella.vacia{color:var(--line)}
.calificacion{padding:10px 0;border-top:1px solid var(--line)}
.calificacion:first-of-type{border-top:0}
.vendido summary{list-style:none;cursor:pointer}
.vendido summary::-webkit-details-marker{display:none}
.vendida{background:var(--accent-soft);border-radius:10px;padding:14px}
.republicar summary{list-style:none;cursor:pointer}
.republicar summary::-webkit-details-marker{display:none}
.republicar[open] summary{margin-bottom:12px}

/* ===== reportar, bloquear y moderación ===== */
.reportar{font-size:12.5px}
.reportar summary{list-style:none;cursor:pointer;color:var(--muted);display:inline-block;padding:2px 0}
.reportar summary::-webkit-details-marker{display:none}
.reportar summary:hover,.reportar[open] summary{color:var(--ink);text-decoration:underline}
.reportar-f{display:flex;flex-direction:column;gap:6px;margin-top:6px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);max-width:340px;text-align:left}
.pie-reporte{padding:0 14px 6px;text-align:right}
.pie-reporte .reportar-f{margin-left:auto}
.opciones-perfil{gap:14px;margin-bottom:12px;font-size:12.5px}
button.enlace{background:none;border:0;padding:2px 0;color:var(--muted);cursor:pointer;font:inherit}
button.enlace:hover{color:var(--ink);text-decoration:underline}
.cita{margin:0 0 10px;padding:10px 12px;border-left:3px solid var(--line);background:var(--surface2);border-radius:0 8px 8px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.lista-reportes{margin:0 0 12px;padding-left:18px}
.lista-reportes li+li{margin-top:4px}
.acciones-caso{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;border-top:1px solid var(--line);padding-top:12px}

/* ===== publicidad ===== */
a.publicidad{display:block;text-decoration:none}
a.publicidad:hover{border-color:var(--muted);color:var(--ink2)}
.anuncio{padding:0;overflow:hidden;position:relative}
.anuncio img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--surface2)}
.anuncio-marca{position:absolute;top:8px;left:8px;z-index:1;background:rgba(0,0,0,.6);color:#fff;font:600 11px var(--f);padding:2px 8px;border-radius:999px}
.anuncio:not(:has(img)) .anuncio-marca{position:static;display:inline-block;margin:12px 14px 0;background:var(--surface2);color:var(--muted)}
.anuncio-b{padding:12px 14px 14px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.anuncio-b b{font-size:15.5px}
.anuncio-b .btn{margin-top:6px}
.solicitud{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:flex-start;padding:12px 0;border-top:1px solid var(--line)}
.solicitud:first-of-type{border-top:0;padding-top:0}
.anuncio-admin{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.anuncio-admin-img{width:110px;aspect-ratio:16/9;border-radius:7px;overflow:hidden;background:var(--surface2);flex:none}
.anuncio-admin-img img{width:100%;height:100%;object-fit:cover;display:block}
.plegable{margin-top:8px}
.plegable summary{list-style:none;cursor:pointer;display:inline-block}
.plegable summary::-webkit-details-marker{display:none}
.plegable label{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:13px}
.lista-simple{margin:0;padding-left:18px}
.lista-simple li+li{margin-top:6px}
@media (max-width:560px){.anuncio-admin{flex-direction:column}.anuncio-admin-img{width:100%;max-width:220px}}

/* ===== directorio de servicios y niveles ===== */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips .chip{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);text-decoration:none;font-size:13px}
.chips .chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.directorio{display:flex;flex-direction:column;gap:10px}
.niveles{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.nivel{display:block;position:relative;border:1px solid var(--line);border-radius:12px;background:var(--surface);cursor:default}
label.nivel{cursor:pointer}
.nivel input{position:absolute;top:14px;right:14px}
.nivel:has(input:checked){border:2px solid var(--accent);background:var(--accent-soft)}
.nivel-b{display:flex;flex-direction:column;gap:4px;padding:14px}
.nivel-b>b{font-size:16px}
.nivel-p{font-size:20px;font-weight:700}
.nivel-l{margin:6px 0 0;padding-left:18px;font-size:13px}
.nivel-l li.no{color:var(--muted);text-decoration:line-through}
.casillas{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:6px}
.rubro-f{padding:6px 0;border-top:1px solid var(--line)}
.rubro-f .inp[name=nombre]{flex:1;min-width:180px}

/* ===== imágenes de un anuncio y carrusel ===== */
.carrusel{position:relative;overflow:hidden;background:var(--surface2)}
.carrusel-pista{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none}
.carrusel-pista::-webkit-scrollbar{display:none}
.carrusel-pista img{flex:0 0 100%;width:100%;scroll-snap-align:start;object-fit:cover;display:block}
.carrusel-b{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0 0 3px}
.carrusel-b.ant{left:6px}.carrusel-b.sig{right:6px}
.carrusel-b:hover,.carrusel-b:focus-visible{background:rgba(0,0,0,.8)}
.carrusel-n{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.6);color:#fff;font:600 11px var(--f);padding:2px 8px;border-radius:999px}
.anuncio .carrusel-pista img,.anuncio img.foto-unica{aspect-ratio:16/9}
.fotos-anuncio{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.foto-anuncio{display:flex;flex-direction:column;gap:2px;width:120px}
.foto-anuncio img{width:120px;aspect-ratio:16/10;object-fit:cover;border-radius:7px;background:var(--surface2);display:block}
.foto-anuncio.no-visible img{opacity:.45}
.foto-anuncio .row{gap:8px;font-size:12.5px}
.anuncio-admin{align-items:flex-start}
button.enlace.peligro{color:var(--danger)}
button.enlace.peligro:hover{color:var(--danger)}

/* ===== ficha del negocio ===== */
.negocio-f,.anuncio-f{position:relative}
a.cubre{position:absolute;inset:0;z-index:1}
.negocio h3 a,a.anuncio-t{color:inherit;text-decoration:none}
.negocio h3 a:hover,a.anuncio-t:hover{text-decoration:underline}
.ficha-negocio{overflow:hidden}
.ficha-fotos{margin:-16px -16px 16px;background:var(--surface2)}
.ficha-fotos img{width:100%;max-height:420px;aspect-ratio:16/9;object-fit:cover;display:block}
.ficha-titulo{font-size:17px;font-weight:600;margin-bottom:4px}
.ficha-contacto{margin:14px 0}
.ficha-datos{margin:0;display:grid;gap:8px}
.ficha-datos div{display:flex;gap:10px;flex-wrap:wrap}
.ficha-datos dt{font-weight:600;min-width:90px}
.ficha-datos dd{margin:0}
.ficha-descripcion{margin-top:16px;border-top:1px solid var(--line);padding-top:14px;overflow-wrap:anywhere}
.ficha-descripcion h3{font-size:16px;margin:14px 0 6px}
.ficha-descripcion h3:first-child{margin-top:0}
.ficha-descripcion p{margin:0 0 10px}
.ficha-descripcion ul{margin:0 0 10px;padding-left:20px}

/* ===== marco común de tres columnas ===== */
.tres.marco{grid-template-columns:230px minmax(0,760px) 290px}
.tres.marco.dos{grid-template-columns:230px minmax(0,1040px)}
.tres.marco>.lado .panel{padding:12px}
.tres.marco>.lado h2{font:600 13.5px var(--f);margin:0 0 8px}
.menu-lado a.activa{background:var(--accent-soft);color:var(--accent);font-weight:600}
.lado .fgrid{grid-template-columns:minmax(0,1fr)!important}
.lado .enlaces{display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.barra-movil{display:none}
.tres.marco>.lado.izq{display:flex}
@media (max-width:1320px){.tres.marco{grid-template-columns:220px minmax(0,1fr)}.tres.marco>.lado.der{grid-column:2;position:static;max-height:none}}
@media (max-width:900px){
  .tres.marco,.tres.marco.dos{grid-template-columns:minmax(0,1fr)}
  .tres.marco>.lado,.tres.marco>.lado.der{display:flex;position:static;max-height:none;grid-column:auto}
  .top-nav{display:none}
  .tres.marco>.lado.izq{order:0}
  .tres.marco>.lado.izq>.menu-principal{display:none}
  .tres.marco>.lado.izq:not(:has(>:not(.menu-principal))){display:none}
  .barra-movil{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--surface);border-top:1px solid var(--line);padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px));justify-content:space-around}
  .barra-movil a{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 2px;color:var(--muted);text-decoration:none;font:500 11px var(--f);border-radius:8px}
  .barra-movil a .i{width:22px;height:22px}
  .barra-movil a.on{color:var(--accent)}
  .barra-movil .contador{position:absolute;top:1px;left:calc(50% + 6px);min-width:16px;height:16px;border-radius:8px;background:var(--danger);color:#fff;font:600 10px/16px var(--f);text-align:center;padding:0 4px}
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom,0px))}
}
.grupo-rubro{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px}
.grupo-rubro h2{font:600 16px var(--f);margin:0}

/* ===== adivina el precio ===== */
.juego-foto{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:10px;display:block;background:var(--surface2)}
.juego-titulo{margin:12px 0 8px;font:600 20px var(--f)}
.juego-apuesta{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:14px}
.juego-apuesta .fld{flex:1;min-width:200px;margin:0}
.juego-apuesta .inp{font-size:18px}
.juego-resultado{border:2px solid var(--accent)}
.juego-puntos{font:500 14px var(--f);color:var(--muted);margin:0}
.juego-puntos b{font:700 40px/1 var(--f);color:var(--accent);margin-right:6px}
.ranking{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.ranking li{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:8px;font-size:13.5px}
.ranking li.yo{background:var(--accent-soft)}
.ranking .lugar{width:20px;text-align:center;color:var(--muted);font-weight:600}
.ranking a{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;text-decoration:none}
.ranking a:hover{text-decoration:underline}
.redes{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}

/* ===== TikTok en el perfil ===== */
.tiktok-conexion{display:flex;gap:12px;align-items:center;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:14px;background:var(--surface2)}
.aviso-ok{background:var(--accent-soft);color:var(--accent);border-radius:8px;padding:8px 12px;margin-bottom:10px;font-weight:500}
.tiktok-grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:12px}
.tiktok-video{position:relative;display:block;aspect-ratio:9/16;border:0;border-radius:10px;overflow:hidden;padding:0;cursor:pointer;background:#111;color:#fff;font:inherit;text-align:left}
.tiktok-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tiktok-titulo{position:absolute;left:0;right:0;bottom:0;padding:22px 8px 8px;font-size:12px;line-height:1.3;background:linear-gradient(transparent,rgba(0,0,0,.78));display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tiktok-video:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.tiktok-reproductor{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:12px}
.tiktok-reproductor[hidden]{display:none}
.tiktok-reproductor iframe{width:min(100%,340px);aspect-ratio:9/16;border:0;border-radius:12px;background:#111}
[data-tiktok-lista]>.btn{margin-top:12px}

/* ===== video en las publicaciones ===== */
.post-video{margin-top:10px;display:flex;flex-direction:column;align-items:center}
.post-video>.tiktok-video{width:min(100%,260px)}
.post-video>.tiktok-video[hidden]{display:none}
.tiktok-play{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.tiktok-play .i{width:54px;height:54px;color:#fff;fill:rgba(0,0,0,.45);stroke-width:1.2}
.tiktok-grilla.chica{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));max-height:340px;overflow:auto;padding:2px}
.video-selector{margin-top:10px;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--surface2)}
.video-selector[hidden],.video-elegido[hidden]{display:none}
.video-selector>.btn{margin-top:10px}
.video-elegido{margin-top:8px;font-size:13.5px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
button.accion-foto,a.accion-foto{background:none;border:0;font:inherit;color:inherit;text-decoration:none;cursor:pointer}
/* La cabecera del perfil: la foto se monta sobre la franja, pero el nombre y los botones parten debajo de ella,
   tengan el alto que tengan. */
.perfil-cab{align-items:flex-start}
.perfil-cab .grow,.perfil-cab>.row{padding-top:52px;padding-bottom:0}
.auto-video{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.auto-video .post-video,.aviso-video .post-video{align-items:flex-start}
.aviso-video{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.aviso-video h2{font:600 16px var(--f);margin:0 0 4px}

/* ===== miniatura del video y visor en grande ===== */
.con-video{position:relative}
.video-mini{position:relative;display:block;width:62px;aspect-ratio:9/16;border:2px solid #fff;border-radius:8px;overflow:hidden;padding:0;cursor:pointer;background:#16181d;color:#fff;font:inherit;box-shadow:0 1px 6px rgba(0,0,0,.35)}
.video-mini img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video-mini-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.18)}
.video-mini-play .i{width:28px;height:28px;color:#fff;fill:rgba(0,0,0,.45);stroke-width:1.4}
.video-mini-rotulo{position:absolute;left:0;right:0;bottom:0;padding:8px 2px 3px;font:600 10.5px var(--f);text-align:center;background:linear-gradient(transparent,rgba(0,0,0,.8))}
.video-mini:hover .video-mini-play{background:rgba(0,0,0,.05)}
.video-mini:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
/* sobre la foto: en la esquina de arriba, para no tapar el auto ni depender del alto de la imagen */
.con-video>.video-mini{position:absolute;left:10px;top:10px;z-index:2}
.visor-video{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;overflow:visible}
.visor-video[open]{display:flex;flex-direction:column;align-items:center;gap:10px}
.visor-video::backdrop{background:rgba(0,0,0,.78)}
.visor-video-marco iframe{display:block;height:min(82vh,720px);aspect-ratio:9/16;max-width:94vw;border:0;border-radius:14px;background:#111}
.mis-videos{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.mi-video{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px}
.mi-video>.grow{min-width:0}
.mi-video-t{display:block;margin-bottom:8px;overflow-wrap:anywhere}
.mi-video-f{display:flex;flex-direction:column;gap:10px;margin-top:10px}
/* aviso sin fotos: la portada del video hace de imagen */
.art{position:relative}
.art>.portada-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.galeria.solo-video{display:flex;flex-direction:column;gap:8px}
/* auto con video y sin fotos: la portada del video llena el lugar de la foto */
.video-grande{position:relative;display:block;width:100%;aspect-ratio:16/10;border:0;padding:0;cursor:pointer;background:#16181d;color:#fff;font:inherit;overflow:hidden}
.video-grande img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video-grande-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.22)}
.video-grande-play .i{width:68px;height:68px;color:#fff;fill:rgba(0,0,0,.45);stroke-width:1.1}
.video-grande:hover .video-grande-play{background:rgba(0,0,0,.08)}
.video-grande-rotulo{position:absolute;left:12px;bottom:10px;font:600 12.5px var(--f);background:rgba(0,0,0,.62);padding:3px 9px;border-radius:6px}
.video-grande:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
/* en la publicación va justo encima del recuadro de la foto, que mide lo mismo */
.post .con-video>.video-grande{position:absolute;top:1px;left:0;z-index:2}
.galeria.solo-video>.video-grande{border-radius:9px;max-height:min(62vw,520px)}
/* en pantallas angostas los botones de Mis videos pueden ocupar dos líneas en vez de empujar la página hacia el lado */
.mi-video .btn{white-space:normal;height:auto;min-height:32px;padding-top:6px;padding-bottom:6px;text-align:center}
.mi-video .mi-video-f .inp{max-width:100%}

/* ===== ancho completo: el menú va pegado al borde izquierdo y la publicidad al derecho ===== */
.pagina.inicio{max-width:none}
@media (min-width:1101px){
  .tres:not(.marco){grid-template-columns:minmax(230px,300px) minmax(0,680px) minmax(280px,340px);justify-content:space-between}
}
@media (min-width:1321px){
  .tres.marco{grid-template-columns:minmax(220px,280px) minmax(0,1fr) minmax(270px,330px);gap:24px;justify-content:stretch}
  .tres.marco.dos{grid-template-columns:minmax(220px,280px) minmax(0,1fr)}
  /* Una sola regla para todas las páginas: el centro usa todo el ancho disponible, como Servicios y Buscar.
     Los textos largos (términos, privacidad) se centran solos a un ancho cómodo con .legal. */
  .tres.marco>.centro,.tres.marco.dos>.centro,.tres.marco.amplio>.centro{width:100%;max-width:none}
}

/* ===== publicidad: título, formato compacto y tarjeta grande ===== */
.anuncios{display:flex;flex-direction:column;gap:8px}
.anuncios-t{font:600 15px var(--f);color:var(--ink2);margin:0 0 2px}
.anuncios .anuncio{margin:0}
.anuncio-c{display:flex;gap:11px;align-items:center;text-decoration:none;color:inherit;border-radius:10px;padding:6px}
.anuncio-c:hover{background:var(--surface2)}
.anuncio-c-i{flex:none;width:96px;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font:700 24px var(--f)}
.anuncio-c-i img{display:block;width:100%;height:100%;object-fit:cover}
.anuncio-c-b{display:flex;flex-direction:column;gap:3px;min-width:0}
.anuncio-c-b b{font-size:14.5px;line-height:1.25;overflow-wrap:anywhere}
.anuncios-pie{font-size:12.5px;color:var(--muted);text-decoration:none;padding:2px 6px}
.anuncios-pie:hover{text-decoration:underline}

/* ===== video vertical: se ve entero, con franjas oscuras a los lados, en vez de recortado ===== */
.video-grande img{object-fit:contain}
/* en las miniaturas chicas sí se recorta, pero favoreciendo la parte de arriba de la toma */
.art>.portada-video{object-position:center 22%}

/* los anuncios compactos de la columna, más grandes */
.anuncio-c{gap:12px;padding:6px 4px}
.anuncio-c-i{width:132px;font-size:30px}
.anuncio-c-b b{font-size:15px}
@media (max-width:1320px){.anuncio-c-i{width:112px}}

/* ===== anuncio dentro del muro: misma forma que la publicación de un auto ===== */
.post-publicidad .post-h .avatar{display:grid;place-items:center;text-decoration:none;font-weight:700}
.post-publicidad>.post-h{padding-bottom:10px}
.anuncio-muro-f{position:relative;background:var(--surface2)}
.anuncio-muro-f img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.anuncio-muro-f .cubre{position:absolute;inset:0}
.anuncio-muro-pie{display:flex;gap:12px;align-items:center;padding:12px 14px;background:var(--surface2)}
.anuncio-muro-pie .grow{display:flex;flex-direction:column;gap:2px;min-width:0}
.anuncio-muro-t{text-decoration:none;color:inherit;font-size:15.5px;overflow-wrap:anywhere}

/* ===== chat de la esquina inferior ===== */
.chatf{position:fixed;right:16px;bottom:0;z-index:40;display:flex;align-items:flex-end;gap:10px}
.chatf-tab{display:flex;align-items:center;gap:8px;height:42px;padding:0 16px;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;background:var(--surface);color:var(--ink);font:600 14px var(--f);cursor:pointer;box-shadow:0 -2px 12px rgba(0,0,0,.08)}
.chatf-tab:hover{background:var(--surface2)}
.chatf-contador{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#C4322B;color:#fff;font:700 11px/18px var(--f);text-align:center}
.chatf-contador[hidden]{display:none}
.chatf-panel,.chatf-ventana{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;box-shadow:0 -2px 18px rgba(0,0,0,.14);overflow:hidden}
.chatf-panel[hidden],.chatf-ventana[hidden]{display:none}
.chatf-panel{position:absolute;right:0;bottom:42px;width:320px;max-height:min(70vh,480px)}
.chatf-ventana{width:330px;height:min(70vh,440px)}
.chatf-cab{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--line);background:var(--surface2)}
.chatf-cab a.grow{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.chatf-cab a.grow b,.chatf-cab a.grow span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chatf-lista{overflow:auto;padding:6px}
.chatf-lista .chat-item{width:100%;border:0;background:none;font:inherit;text-align:left;cursor:pointer}
.chatf-lista .chat-item .contador{position:static;flex:none}
.chatf-vacio{padding:14px}
.chatf-hilo{flex:1 1 0;min-height:0;height:auto;overflow:auto;padding:10px;display:flex;flex-direction:column;justify-content:flex-start;gap:6px}
/* con pocos mensajes quedan abajo, junto al campo para escribir */
.chatf-hilo>:first-child{margin-top:auto}
.chatf-error{margin:0 10px 6px;font-size:13px}
.chatf-form{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line)}
.chatf-form[hidden]{display:none}
.chatf-form .inp{flex:1;min-width:0;height:36px}
/* en pantallas chicas no hay espacio: se usa la página de Mensajes */
@media (max-width:900px){.chatf{display:none}}

/* ===== perfil: portada, confianza junto al nombre, pestañas y bloques ===== */
.portada-perfil{position:relative;height:150px;overflow:hidden}
.portada-perfil.con-foto{height:auto;aspect-ratio:3.2/1;max-height:340px;background:#16181d}
.portada-perfil img{display:block;width:100%;height:100%;object-fit:cover}
.portada-cambiar{position:absolute;right:12px;bottom:12px;background:var(--surface)}
.portada-perfil.muestra{margin:0;border-radius:10px;height:110px}
.portada-perfil.muestra.con-foto{height:auto;max-height:200px}
.cuenta-portada{margin-bottom:14px}
.perfil-cuenta{margin:2px 0 6px;color:var(--ink2);font-size:14px}
.perfil-cuenta a{color:inherit;text-decoration:none}
.perfil-cuenta a:hover{text-decoration:underline}
.perfil-confianza{display:flex;flex-wrap:wrap;gap:6px}
.perfil-confianza a.pill{text-decoration:none}
.perfil-pestanas{display:flex;gap:2px;margin:14px -16px -16px;padding:0 10px;border-top:1px solid var(--line);overflow-x:auto}
.perfil-pestanas a{display:flex;align-items:center;gap:6px;padding:12px 12px;font:600 14px var(--f);color:var(--ink2);text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap}
.perfil-pestanas a:hover{background:var(--surface2)}
.perfil-pestanas a.activa{color:var(--accent);border-bottom-color:var(--accent)}
.perfil-cuerpo{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:16px;align-items:start;margin-top:16px}
.perfil-lado,.perfil-centro{display:flex;flex-direction:column;gap:16px;min-width:0}
.perfil-lado .panel h2{font-size:16px}
.perfil-datos{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.perfil-datos li{display:flex;align-items:center;gap:8px}
.perfil-grilla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.perfil-grilla.amplia{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.perfil-auto{position:relative;display:flex;flex-direction:column;text-decoration:none;color:inherit;min-width:0}
.perfil-auto img,.perfil-auto .sin-foto{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;background:var(--surface2);display:grid;place-items:center}
.perfil-auto-t{display:flex;flex-direction:column;font-size:12px;line-height:1.25;margin-top:4px;overflow-wrap:anywhere}
.perfil-auto-t span{color:var(--muted)}
.perfil-auto-m{position:absolute;left:4px;top:4px;font-size:10.5px}
.perfil-grilla.amplia .perfil-auto-t{font-size:13.5px}
.perfil-persona{display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none;color:inherit;font-size:12px;text-align:center;min-width:0}
.perfil-persona .avatar{width:100%;height:auto;aspect-ratio:1;border-radius:8px;font-size:18px}
.perfil-persona span{overflow-wrap:anywhere;line-height:1.2}
.personas-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 12px}
@media (max-width:1100px){.perfil-cuerpo{grid-template-columns:1fr}.perfil-grilla{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media (max-width:560px){.perfil-grilla{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ===== bloques laterales comunes ===== */
.bloque h2{font-size:16px}
.consejos{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px;font-size:13.5px;line-height:1.4}
/* la foto de perfil va encima de la portada, completa y más grande que en el resto del sitio */
.perfil .perfil-cab{position:relative;z-index:1;margin-top:-56px}
.perfil .perfil-cab .avatar.grande{width:112px;height:112px;font-size:36px;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.perfil .perfil-cab .grow,.perfil .perfil-cab>.row{padding-top:64px}
@media (max-width:560px){.perfil .perfil-cab{margin-top:-44px}.perfil .perfil-cab .avatar.grande{width:88px;height:88px;font-size:28px}.perfil .perfil-cab .grow,.perfil .perfil-cab>.row{padding-top:8px}.perfil .perfil-cab .grow{flex-basis:100%}}

/* Mensajes dentro del marco: la conversación ocupa el ancho disponible en vez de encogerse al centro */
.tres.marco>.centro>.chat{width:100%;max-width:1400px;margin:0;align-self:center}

/* La portada se ve con la misma forma en el perfil y en la vista previa de Mi cuenta: siempre a todo el ancho */
.portada-perfil.con-foto{max-height:none}
.portada-perfil.muestra,.portada-perfil.muestra.con-foto{width:100%;max-height:none}
.portada-perfil.muestra:not(.con-foto){height:110px}

/* ===== lista de conversaciones agrupada: por autos y directos ===== */
.chat-grupo{font:700 12px var(--f);text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:10px 8px 4px}
.chat-grupo:first-child{margin-top:2px}
.chat-vacia{padding:8px 6px}
.chat-de-auto{border:1px solid var(--line);border-radius:10px;margin:0 2px 8px;overflow:hidden}
.chat-de-auto-cab{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--surface2)}
.chat-de-auto-cab .art{flex:none;width:46px;height:34px;border-radius:6px;overflow:hidden;background:var(--line)}
.chat-de-auto-cab .art img{display:block;width:100%;height:100%;object-fit:cover}
.chat-de-auto-cab .grow{display:flex;flex-direction:column;min-width:0}
.chat-de-auto-cab .corta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.chat-de-auto .chat-item{border-radius:0}
.chatf-lista .chat-grupo{margin-left:6px}

/* ===== novedades y titulares ===== */
.novedades{display:flex;flex-direction:column}
.novedad{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-top:1px solid var(--line)}
.novedad:first-child{border-top:0;padding-top:4px}
.novedad-t{font:600 16px/1.3 var(--f);color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
a.novedad-t:hover{text-decoration:underline}
.novedad-r{margin:0;color:var(--ink2);font-size:14.5px;line-height:1.45;overflow-wrap:anywhere}
.novedad.compacta{padding:9px 0;gap:2px}
.novedad.compacta .novedad-t{font-size:14px}
.novedad.destacada .novedad-t{color:var(--accent)}
tr.apagada td{opacity:.6}

/* ===== cuando una sección no tiene nada que mostrar: se dice al centro, con qué hacer ===== */
.vacio{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:26px 16px;color:var(--muted)}
.vacio b{color:var(--ink);font-size:16px}
.vacio .btn{margin-top:8px}

/* ===== noticias como tarjetas: imagen, título, resumen y autos relacionados ===== */
.novedad{flex-direction:row;gap:14px;align-items:flex-start}
.novedad-c{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.novedad-i{flex:none;width:168px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--surface2)}
.novedad-i img{display:block;width:100%;height:100%;object-fit:cover}
.novedad-a{margin-top:6px;gap:12px;align-items:center}
.novedad.compacta{gap:10px}
.novedad.compacta .novedad-i{width:64px;aspect-ratio:1;border-radius:8px}
@media (max-width:560px){.novedad:not(.compacta){flex-direction:column}.novedad:not(.compacta) .novedad-i{width:100%;aspect-ratio:16/9}}
/* administración de noticias */
.fuente{border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:10px}
.fuente.apagada{opacity:.7}
.fuente-cab{display:flex;gap:10px;align-items:flex-start}
h3.sub{font:700 15px var(--f);margin:18px 0 4px}
.novedad-imagen{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.novedad-imagen img{width:168px;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
/* fallas y reparaciones */
.chips-fila{display:flex;flex-wrap:wrap;gap:6px}
a.chip{text-decoration:none;color:var(--ink)}

/* ===== automotoras ===== */
.automotora-logo{flex:none;width:52px;height:52px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;color:var(--muted)}
.automotora-logo img{width:100%;height:100%;object-fit:contain;background:#fff}
.automotora-logo.grande{width:112px;height:112px;border-radius:16px;border:4px solid var(--surface);box-shadow:0 1px 4px rgba(0,0,0,.18);background:#fff}
.automotora-logo.grande .i{width:40px;height:40px}
.automotoras{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.automotora-tarjeta{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:inherit;min-width:0}
.automotora-tarjeta:hover{background:var(--surface2)}
.automotora-tarjeta .grow{display:flex;flex-direction:column;min-width:0;gap:2px}
.automotora-tarjeta .grow>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.automotora-vende{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit}
.automotora-vende .grow{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.automotora-imagenes{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start}
.automotora-imagenes>div{display:flex;flex-direction:column;gap:8px;min-width:0}
.automotora-imagenes>.grow{flex:1 1 320px}
.automotora-imagenes .automotora-logo.grande{border-color:var(--line);box-shadow:none}
.automotora-texto{white-space:pre-line;overflow-wrap:anywhere;font-size:14.5px;line-height:1.5;margin-top:6px}
.niveles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.nivel{display:flex;flex-direction:column;gap:3px;padding:12px;border:1px solid var(--line);border-radius:12px;min-width:0}
.nivel.apagada{opacity:.55}
.nivel-precio{font:700 18px var(--f)}

/* ===== vitrina de automotora: marcar varios autos ===== */
.elegible{position:relative;min-width:0}
.elegir{position:absolute;z-index:2;top:8px;left:8px;display:inline-flex;align-items:center;gap:6px;padding:4px 9px 4px 6px;border-radius:999px;background:rgba(255,255,255,.94);border:1px solid var(--line);font:600 12px var(--f);color:var(--ink);cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.14)}
.elegir input{width:16px;height:16px;margin:0;accent-color:var(--accent)}
.elegible.marcado>.car-env{outline:2px solid var(--accent);outline-offset:2px;border-radius:14px}
.barra-seleccion{position:sticky;bottom:10px;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 4px 18px rgba(0,0,0,.12)}
.barra-seleccion .grow{display:flex;flex-direction:column;min-width:160px}
.barra-seleccion.activa{border-color:var(--accent)}
/* comparar autos */
table.comparar th:first-child{white-space:nowrap;color:var(--muted);font-weight:600;text-align:left}
table.comparar td,table.comparar thead th{min-width:170px;vertical-align:top}
table.comparar td.mejor{color:var(--accent);font-weight:700}
.comparar-auto{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit}
.comparar-auto .art{display:block;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--surface2)}
.comparar-auto .art img{display:block;width:100%;height:100%;object-fit:cover}

/* ===== vitrina a todo el ancho: contacto arriba, filtros en franja, más autos por fila ===== */
.vitrina-contacto{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px}
.vitrina-contacto li{display:flex;align-items:center;gap:6px;min-width:0;overflow-wrap:anywhere}
.vitrina-empresa{margin-top:4px}
.vitrina-pestanas{margin:0;padding:0 10px;border-top:0}
.vitrina-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.chips-fila[data-chips]{margin-bottom:8px}
.filtros-franja{border:1px solid var(--line);border-radius:12px;margin:4px 0 14px;background:var(--surface2)}
.filtros-franja>summary{cursor:pointer;padding:9px 12px;font:600 13.5px var(--f);list-style:none;display:flex;align-items:center;gap:6px}
.filtros-franja>summary::-webkit-details-marker{display:none}
.filtros-franja>summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .15s}
.filtros-franja[open]>summary::after{transform:rotate(-135deg)}
.filtros-franja form{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;padding:0 12px 12px;align-items:end}
.filtros-franja .fld label{font-size:12px}
.filtros-botones{display:flex;gap:6px;flex-wrap:wrap}
.vista-alterna{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.vista-alterna a{padding:5px 10px;font:600 12.5px var(--f);color:var(--ink2);text-decoration:none}
.vista-alterna a.activa{background:var(--accent);color:var(--accent-ink)}
/* el stock como lista compacta */
.stock-lista{display:flex;flex-direction:column;gap:8px}
.stock-lista .elegible{display:flex;align-items:center;gap:10px}
.stock-lista .elegir{position:static;flex:none;box-shadow:none}
.stock-lista .elegir span{display:none}
.fila-auto{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:8px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:inherit}
.fila-auto:hover{background:var(--surface2)}
.fila-auto .art{flex:none;width:112px;aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:var(--surface2)}
.fila-auto .art img{display:block;width:100%;height:100%;object-fit:cover}
.fila-auto-c{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.fila-auto-c b,.fila-auto-c>.mut{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila-auto-m{display:flex;gap:4px;flex-wrap:wrap}
.fila-auto .price{flex:none;font:700 17px var(--f)}
.stock-lista .elegible.marcado .fila-auto{outline:2px solid var(--accent);outline-offset:1px}
@media (max-width:560px){.fila-auto{flex-wrap:wrap}.fila-auto .art{width:84px}.fila-auto .price{width:100%;padding-left:96px}}

/* ===== deslizar: un auto por pantalla ===== */
html.con-deslizar,html.con-deslizar body{overflow:hidden}
.dz{position:fixed;inset:0;z-index:60;background:#0f1114;color:#fff;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y mandatory;outline:0}
.dz-item{position:relative;height:100vh;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;max-width:560px;margin:0 auto;background:#16181d}
.dz-fotos{flex:1;min-height:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.dz-fotos::-webkit-scrollbar{display:none}
.dz-lamina{flex:0 0 100%;scroll-snap-align:center;display:grid;place-items:center;min-width:0;height:100%}
.dz-lamina img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}
.dz-lamina .video-grande{width:100%;height:100%;border-radius:0}
.dz-lamina.sin .i{width:64px;height:64px;opacity:.4}
.dz-info{flex:none;padding:12px 14px calc(14px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;background:#16181d}
.dz-titulo{display:flex;flex-direction:column;gap:2px}
.dz-titulo b{font:700 18px/1.2 var(--f)}
.dz-precio{font:800 24px var(--f);display:flex;align-items:center;gap:8px}
.dz-datos{font-size:13.5px;opacity:.8}
.dz-acciones{display:flex;gap:8px;flex-wrap:wrap}
.dz-acciones .btn{flex:1 1 auto;justify-content:center}
.dz-acciones .btn.sec{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff}
.dz-cerrar{position:fixed;z-index:62;top:12px;left:12px;width:40px;height:40px;border-radius:999px;display:grid;place-items:center;background:rgba(0,0,0,.55);color:#fff}
.dz-marca{position:fixed;z-index:61;top:20px;left:62px;font:600 14px var(--f);text-shadow:0 1px 3px rgba(0,0,0,.7);max-width:55vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dz-cuenta{position:absolute;top:18px;right:12px;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.55);font:600 12px var(--f)}
.dz-pista-lado{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% - 100vh + 0px);display:none}
.dz-item .dz-pista-lado{display:block;position:absolute;top:56px;bottom:auto;left:50%;transform:translateX(-50%);padding:3px 10px;border-radius:999px;background:rgba(0,0,0,.5);font-size:12px;white-space:nowrap}
.dz-pista{position:absolute;left:50%;transform:translateX(-50%);top:45%;padding:8px 14px;border-radius:999px;background:rgba(0,0,0,.6);font:600 13px var(--f);white-space:nowrap;animation:dz-sube 1.6s ease-in-out 3 both;pointer-events:none}
@keyframes dz-sube{0%,100%{transform:translate(-50%,0);opacity:.95}50%{transform:translate(-50%,-14px);opacity:.6}}
.dz-fin{display:grid;place-items:center;text-align:center}
.dz-fin-c{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px}
.dz-fin-c b{font:700 20px var(--f)}
@media (prefers-reduced-motion:reduce){.dz-pista{animation:none}}
/* la barra de autos marcados queda sobre la pestaña del chat, no debajo de ella */
@media (min-width:901px){.barra-seleccion{bottom:52px}}

/* ===== panel de stock de la automotora ===== */
.barra-lote{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;margin-bottom:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);position:sticky;top:62px;z-index:4}
.barra-lote .grow{min-width:150px}
.marca-todos{display:inline-flex;align-items:center;gap:6px;font:600 13px var(--f);cursor:pointer}
.rebaja{display:inline-flex;gap:4px;align-items:center}
.rebaja .inp{width:64px;height:32px;padding:0 8px}
table.stock td{vertical-align:middle}
table.stock th.n,table.stock td.n{text-align:right;white-space:nowrap}
.stock-auto{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;min-width:220px}
.stock-auto .art{flex:none;width:72px;aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:var(--surface2)}
.stock-auto .art img{display:block;width:100%;height:100%;object-fit:cover}
.stock-auto>span:last-child{display:flex;flex-direction:column}
.stock-precio{display:flex;gap:4px;align-items:center}
.stock-precio .inp{width:124px;height:32px;padding:0 8px}
/* Un rótulo oculto dentro de una tabla ancha no debe ensanchar la página: queda contenido en el recuadro que se desliza. */
.tw{position:relative}

/* ===== impulsar un aviso ===== */
.pill.dest{background:#1f2430;color:#ffd24a;border-color:#1f2430}
.car .etiqueta.destacado{top:auto;bottom:8px;left:8px}
.car-env.destacada>.car{box-shadow:0 0 0 2px #ffd24a}
.impulsar{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.impulsar h3{font:700 16px var(--f);margin:0}
.impulsar-dato{margin:0;font-size:14.5px}
.impulsar-estado{margin:0;font-size:14px}
.impulsar-opciones{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.impulsar-opcion{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line);border-radius:12px;align-items:flex-start}
.impulsar-precio{font:800 20px var(--f);margin-top:2px}
.impulsar-opcion .btn{margin-top:4px}

/* ===== promociones de automotoras ===== */
.pill.promo{background:#7a1f6b;color:#fff;border-color:#7a1f6b}
.car-promo{display:flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.25;margin-top:2px;overflow:hidden}
.car-promo .pill{flex:none}
.promo-alcance{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;margin:0}
.promo-alcance legend{font:600 13px var(--f);padding:0 4px}
.promo-autos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 14px;max-height:240px;overflow:auto;padding:6px 2px}
.promo-autos label{display:flex;align-items:center;gap:6px;font-size:13.5px;cursor:pointer}
.promo-caja{border:1px solid #7a1f6b;border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:4px;background:rgba(122,31,107,.06)}
.promos-vitrina{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;margin-bottom:14px}

/* ===== el nivel de la automotora ===== */
.nivel.actual{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.nivel-incluye{margin:4px 0 6px;padding-left:18px;font-size:13.5px;display:flex;flex-direction:column;gap:2px}
.nivel-pagar{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.nivel-pagar .inp{flex:1 1 150px;height:34px;padding:0 8px}
.nivel>form{margin-top:auto}
.nivel-editar{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;align-items:end}
.nivel-editar .ancho{grid-column:1/-1}
.nivel-casillas{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13.5px}
.nivel-casillas label{display:inline-flex;align-items:center;gap:6px;cursor:pointer}

/* ===== check azul ===== */
.check-azul{display:inline-block;vertical-align:-3px;width:18px;height:18px;margin-left:5px;border-radius:50%;background:var(--verif) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round' d='M6.5 12.5l3.6 3.6 7.4-8'/%3E%3C/svg%3E") center/78% no-repeat}
.check-azul.grande{width:24px;height:24px;vertical-align:-4px;margin-left:8px}
.check-azul.chico{width:13px;height:13px;margin:0 4px 0 0;vertical-align:-2px}
.pill.verif{background:var(--verif-soft);color:var(--verif-ink);border-color:var(--verif-borde)}
.vendedor-verificado{color:var(--verif-ink);font-weight:600;margin-top:2px}
.verificacion{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:16px;align-items:start}
.verificacion img{display:block;width:100%;border-radius:10px;border:1px solid var(--line);background:var(--surface2)}
@media (max-width:760px){.verificacion{grid-template-columns:1fr}}

.nivel-campo{margin:0 0 10px;min-width:0}
.nivel-campo legend{font:700 14px var(--f);padding:0 6px}

.check-ventajas{border:1px solid var(--verif-borde);background:var(--verif-soft);border-radius:12px;padding:12px 14px;margin:6px 0 14px}
.check-ventajas h2{font:700 15px var(--f);margin:0 0 6px;color:var(--verif-ink)}
.check-ventajas ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px;font-size:14.5px}
.impulsar-check{min-height:1.2em}
.impulsar-precio s{font-weight:400;font-size:14px}
/* los botones de impulsar quedan todos a la misma altura, aunque una opción traiga una línea más que otra */
.impulsar-opcion .btn{margin-top:auto}
.impulsar-opcion .impulsar-check:empty{display:none}

/* ===== documentos legales y pie de página ===== */
.legal{max-width:820px;margin:0 auto;padding:24px 26px;line-height:1.6}
.legal h1{margin-bottom:4px}
.legal h2{font:700 17px var(--f);margin:22px 0 6px}
.legal p{margin:6px 0}
.legal ul{margin:6px 0 6px 20px;display:flex;flex-direction:column;gap:5px}
.pie{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;padding:18px 12px 22px;font-size:13px;color:var(--muted)}
.pie a{color:var(--muted);text-decoration:underline}
.pie a:hover{color:var(--ink)}
html.con-deslizar .pie{display:none}

/* ===== cupones de la zona ===== */
.cupones{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.cupon{display:flex;flex-direction:column;border:1.5px dashed var(--accent);border-radius:14px;background:var(--surface);min-width:0}
.cupon.apagada{border-color:var(--line);opacity:.7}
.cupon-cuerpo{display:flex;flex-direction:column;gap:4px;padding:14px 14px 10px;min-width:0}
.cupon-titulo{font:700 17px/1.25 var(--f);overflow-wrap:anywhere}
.cupon-condiciones{white-space:pre-line;overflow-wrap:anywhere;margin-top:2px}
.cupon-pie{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto;padding:10px 14px;border-top:1.5px dashed var(--line)}
.cupon-pie form{margin-left:auto}
.cupon-codigo{display:inline-block;padding:3px 10px;border-radius:8px;background:#1f2430;color:#ffd24a;font:700 14px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em}

/* ===== deslizar las publicaciones del inicio ===== */
.deslizar-acceso{margin-left:auto}
.dz-autor{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-weight:700}
.dz-autor a{color:#fff;text-decoration:none}
.dz-autor .avatar{width:30px;height:30px;font-size:12px}
.dz-autor .dz-datos{font-weight:400}
.dz-texto{margin:4px 0 0;font-size:14.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;white-space:pre-line}
.dz-auto{font-size:14px;opacity:.9}
.dz-solo-texto{padding:60px 24px 20px;background:linear-gradient(160deg,#1d3a33,#16181d)}
.dz-solo-texto p{font:600 22px/1.4 var(--f);text-align:center;overflow-wrap:anywhere;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:12;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.dz-acciones form{display:flex;flex:1 1 auto}
.dz-acciones form .btn{flex:1}
.dz-acciones .btn.sec.on{background:#b3261e;border-color:#b3261e}
.dz-anuncio .dz-cuenta{background:#ffd24a;color:#1f2430}

.dz-zona{position:fixed;z-index:62;top:44px;left:62px;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.16);color:#fff;font:600 12px var(--f);text-decoration:none}
.dz-zona:hover{background:rgba(255,255,255,.28)}

/* ===== juegos ===== */
.juegos{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.juego{display:flex;flex-direction:column;gap:6px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:inherit;text-decoration:none}
.juego:hover{border-color:var(--accent)}
.juego>b{font:700 17px var(--f)}
.juego .btn{align-self:flex-start;margin-top:auto}
.ranking.grande li{padding:8px 4px;gap:10px;font-size:15px}
.ranking.grande li.yo{background:var(--accent-soft);border-radius:8px}
.ranking.grande .avatar{width:30px;height:30px;font-size:12px}
.ranking.grande li a{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lista-simple{margin:0 0 0 18px;display:flex;flex-direction:column;gap:6px;font-size:14.5px}
.compara-marcador{display:flex;gap:10px}
.compara-tiempo{height:8px;border-radius:999px;background:var(--surface2);overflow:hidden}
.compara-tiempo span{display:block;height:100%;width:100%;background:var(--accent);transition:width .1s linear}
.compara-tiempo span.poco{background:#b3261e}
.compara-pregunta{margin:10px 0;font-size:15px;text-align:center}
.compara-par{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.compara-auto{display:flex;flex-direction:column;gap:4px;padding:0 0 12px;border:2px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden;cursor:pointer;font:inherit;color:inherit;text-align:center;min-width:0}
.compara-auto:hover,.compara-auto:focus-visible{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-soft)}
.compara-auto img,.compara-sinfoto{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--surface2)}
.compara-sinfoto{display:grid;place-items:center;color:var(--muted)}
.compara-sinfoto .i{width:64px;height:64px}
.compara-auto>b{font:700 17px/1.25 var(--f);padding:8px 10px 0;overflow-wrap:anywhere}
.compara-auto>span:not(.compara-sinfoto){padding:0 10px}
.compara-resultado{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline;padding:10px 14px;border-radius:12px;margin-bottom:12px;font-size:14.5px}
.compara-resultado.bien{background:var(--ok-soft);color:var(--ok-ink)}
.compara-resultado.mal{background:var(--danger-soft);color:var(--danger)}
.compara-resultado>b{font-size:16px}
.compara-fin{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.compara-final{font-size:18px}
@media (max-width:560px){.compara-par{gap:8px}.compara-auto>b{font-size:14.5px}}

.foto-credito{display:flex;flex-direction:column;gap:2px;margin-top:10px;font-size:12px;color:var(--muted)}
.foto-credito a{color:var(--muted);text-decoration:underline}

.fotos-modelos{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.foto-modelo{display:flex;flex-direction:column;gap:5px;min-width:0}
.foto-modelo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:var(--surface2)}
.foto-modelo b{overflow-wrap:anywhere}
.foto-modelo .row{margin-top:auto}

.compara-nota{flex-basis:100%;font-size:12.5px;opacity:.85}

.compara-inicio{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.compara-como{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:var(--surface2)}
.compara-como summary{font:700 15px var(--f);cursor:pointer}
.compara-como ol{margin:10px 0 2px 20px;display:flex;flex-direction:column;gap:7px;font-size:14.5px;line-height:1.45}
.compara-empezar{font-size:17px;padding:12px 34px}

/* ===== juegos de cinco preguntas ===== */
.cinco-detalle{width:min(100%,460px);aspect-ratio:4/3;margin:0 auto 12px;border-radius:16px;overflow:hidden;border:2px solid var(--line);background:var(--surface2)}
.cinco-detalle img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(3.2);pointer-events:none;user-select:none}
.cinco-opciones{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:720px;margin:0 auto}
.cinco-opcion{display:flex;align-items:center;gap:10px;padding:13px 14px;border:2px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer;font:600 15.5px/1.3 var(--f);color:inherit;text-align:left;min-width:0;overflow-wrap:anywhere}
.cinco-opcion:hover,.cinco-opcion:focus-visible{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-soft)}
.cinco-tecla{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--surface2);color:var(--muted);font:700 12px var(--f)}
.cinco-completa{margin:0 auto 4px;max-width:520px}
.cinco-completa img{display:block;width:100%;border-radius:14px;border:1px solid var(--line)}
.cinco .compara-pregunta{font-size:16px}
@media (max-width:560px){.cinco-opciones{grid-template-columns:1fr}}

.cinco-autor{text-align:center;font-size:13px;color:var(--muted);margin:-4px 0 10px}
.cinco-reportar{margin-top:12px;font-size:13.5px}
.cinco-reportar summary{cursor:pointer;color:var(--muted)}
.cinco-reportar form{margin-top:8px}
.cinco-reportar select{max-width:340px}

/* ===== premio de la semana e insignias ===== */
.premios{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.premio{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);min-width:0}
.premio>b{font:700 17px var(--f)}
.premio form{margin-top:auto}
.pill.insignia{background:var(--aviso-soft);color:var(--aviso-ink);border-color:var(--aviso-borde);text-decoration:none}
@media (max-width:700px){.premios{grid-template-columns:1fr}}

/* ===== negocio en el directorio: una sola tarjeta para todos los niveles ===== */
.negocio{background:var(--surface);border:1px solid var(--line);border-radius:12px;display:flex;gap:14px;align-items:center;padding:12px;height:138px;overflow:hidden}
.negocio.destacado{border:2px solid var(--accent);padding:11px}
.negocio-f{flex:none;width:152px;height:114px;overflow:hidden;border-radius:9px;background:var(--surface2)}
.negocio-f img,.negocio-f .carrusel,.negocio-f .carrusel-pista{width:152px;height:114px}
.negocio-f img{display:block;object-fit:cover}
.negocio-f .carrusel-b{width:24px;height:24px;font-size:16px}
.negocio-f .carrusel-n{right:6px;bottom:6px;font-size:10.5px;padding:1px 7px}
a.negocio-i{display:grid;place-items:center;width:100%;height:100%;font:700 44px var(--f);color:var(--accent);background:var(--accent-soft);text-decoration:none}
.negocio-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.negocio h3{font-size:16px;margin:0;display:flex;align-items:center;gap:8px;min-width:0}
.negocio h3 a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.negocio h3 .pill{flex:none}
.negocio-t{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.negocio-x{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:14px;line-height:1.4;min-height:2.8em;overflow-wrap:anywhere}
.negocio-m{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.negocio-a{display:flex;flex-direction:column;gap:6px;flex:none;width:118px}
.negocio-a .btn{width:100%;justify-content:center;text-align:center}
@media (max-width:640px){
  .negocio{height:auto;flex-wrap:wrap;align-items:flex-start}
  .negocio-f{width:96px;height:72px}
  .negocio-f img,.negocio-f .carrusel,.negocio-f .carrusel-pista{width:96px;height:72px}
  a.negocio-i{font-size:30px}
  .negocio-b{flex:1 1 0}
  .negocio-x{min-height:0}
  .negocio-a{flex-direction:row;width:100%}
  .negocio-a .btn{width:auto;flex:1}
}

.rubro-precios{flex-basis:100%}
.precios-rubro summary{cursor:pointer;font-weight:600}
.precios-rubro-t{margin-top:8px;overflow-x:auto}
.precios-rubro-t td.num,.precios-rubro-t th.num{text-align:right;white-space:nowrap}

/* ===== segundo paso al ingresar ===== */
.codigo-paso2{max-width:190px;font:600 20px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.14em}
.pasos-paso2{margin:6px 0 0 20px;display:flex;flex-direction:column;gap:16px}
.qr-paso2{margin:10px 0;padding:8px;background:#fff;border:1px solid var(--line);border-radius:12px;display:block;width:max-content;line-height:0}
.llave-paso2{font:600 15px ui-monospace,Consolas,monospace;letter-spacing:.06em;overflow-wrap:anywhere}
.codigos-respaldo{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.codigos-respaldo code{display:block;text-align:center;padding:9px 6px;border:1px solid var(--line);border-radius:9px;background:var(--surface2);font:600 16px ui-monospace,Consolas,monospace;letter-spacing:.08em}
@media print{body *{visibility:hidden}#codigos,#codigos *{visibility:visible}#codigos{position:absolute;left:0;top:0;width:100%}#codigos button{display:none}}

/* ===== notificaciones: panel de la campana y botón para borrar ===== */
.menu-notif{position:relative}
.menu-notif>summary{list-style:none;cursor:pointer}
.menu-notif>summary::-webkit-details-marker{display:none}
.menu-notif>summary>span{display:grid;place-items:center}
.menu-notif[open]>summary{background:var(--accent-soft);color:var(--accent)}
.notif-panel{position:absolute;right:0;top:calc(100% + 8px);width:380px;max-width:calc(100vw - 16px);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.16);z-index:40;display:flex;flex-direction:column;overflow:hidden}
.np-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line)}
.np-cab b{font:700 15px var(--f)}
.np-lista{max-height:min(60vh,460px);overflow-y:auto;padding:4px}
.np-vacio{padding:18px 12px;text-align:center}
.np-todas{display:block;padding:10px 12px;text-align:center;border-top:1px solid var(--line);font:600 13.5px var(--f);color:var(--accent);text-decoration:none}
.np-todas:hover{background:var(--surface2)}
.notif-panel>.np-todas:only-child{border-top:0}
.notif-fila{display:flex;align-items:center;gap:2px;border-radius:9px}
.notif-fila .notif{flex:1;min-width:0}
.notif-fila.nueva{background:var(--accent-soft)}
.notif-fila.nueva .notif{background:transparent}
.notif-fila:hover{background:var(--surface2)}
.notif-fila .notif:hover{background:transparent}
.notif-x{flex:none;width:32px;height:32px;margin-right:4px;border:0;border-radius:50%;background:transparent;color:var(--muted);font:400 20px/1 var(--f);cursor:pointer}
.notif-x:hover,.notif-x:focus-visible{background:var(--line);color:var(--ink)}
.np-lista .notif{padding:9px 8px;font-size:14px}
@media (max-width:560px){.notif-panel{position:fixed;left:8px;right:8px;top:58px;width:auto;max-width:none}}
/* El botón que abre la aplicación de autenticación solo tiene sentido en el mismo teléfono. */
.solo-tactil{display:none;margin:8px 0}
@media (pointer:coarse){.solo-tactil{display:block}}
#correo .ph,#aplicacion .ph{flex-wrap:nowrap;align-items:flex-start}
#correo .ph>div,#aplicacion .ph>div{min-width:0}
#correo .ph>.pill,#aplicacion .ph>.pill{flex:none}

/* ===== menú lateral: perfil arriba, "Ver más" y rubros de servicios ===== */
.menu-lado a.menu-yo{gap:10px;font-weight:600;padding:7px 10px}
.menu-yo-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-mas{display:flex;flex-direction:column;gap:2px}
.menu-mas>summary{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;list-style:none;color:var(--ink);font:500 14.5px var(--f)}
.menu-mas>summary::-webkit-details-marker{display:none}
.menu-mas>summary:hover{background:var(--surface)}
.menu-mas-i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--surface2);flex:none}
.menu-mas-i .i{width:14px;height:14px;color:var(--ink);transition:transform .15s}
.menu-mas[open]>summary .menu-mas-i .i{transform:rotate(180deg)}
.menu-mas .abierto,.menu-mas[open] .cerrado{display:none}
.menu-mas[open] .abierto{display:inline}
.menu-mas[open]>a{margin-top:2px}
.menu-sep{border:0;border-top:1px solid var(--line);margin:10px 6px 4px}
.menu-lado h2.menu-t{margin:6px 0 2px;font:600 13px var(--f)}
.menu-lado h2.menu-t a{padding:6px 10px;color:var(--muted);font:600 13px var(--f)}
.menu-lado h2.menu-t a.activa{color:var(--accent)}
.menu-rubro-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-lado a.menu-rubro .num{font-size:12.5px;background:var(--surface2);border-radius:999px;padding:0 7px;line-height:20px}
.menu-lado a.menu-anunciar{margin-top:4px;font:500 13px var(--f);color:var(--accent);padding:7px 10px}
@media (prefers-reduced-motion:reduce){.menu-mas-i .i{transition:none}}

.chat-consejo{margin:0;padding:7px 12px;font-size:12.5px;background:var(--aviso-soft);border-bottom:1px solid var(--aviso-borde);color:var(--aviso-ink)}
.chat-consejo .lnk{color:inherit}

/* ===== ayuda: preguntas frecuentes ===== */
.ayuda-t{font:700 15px var(--f);margin:18px 0 6px}
.ayuda{border-bottom:1px solid var(--line)}
.ayuda>summary{cursor:pointer;padding:11px 4px;font:600 14.5px var(--f);list-style:none;display:flex;justify-content:space-between;gap:12px}
.ayuda>summary::-webkit-details-marker{display:none}
.ayuda>summary::after{content:"+";color:var(--muted);font-weight:400;font-size:18px;line-height:1}
.ayuda[open]>summary::after{content:"–"}
.ayuda>summary:hover{color:var(--accent)}
.ayuda>div{padding:0 4px 12px;color:var(--ink)}
.ayuda>div p{margin:0 0 8px;max-width:70ch}

/* Una zona que abarca varios paneles de una página: no ocupa lugar propio, para que los paneles conserven su separación. */
.zona-pagina{display:contents}

/* ===== papeles a la vista ===== */
.papeles{border-top:1px solid var(--line);margin-top:18px}
.papeles h3{font:700 15px var(--f)}
.papel-foto{display:block;max-width:min(100%,520px);max-height:520px;border:1px solid var(--line);border-radius:8px;margin:8px 0}

/* ===== contrato de compraventa: se llena en pantalla y se imprime ===== */
.contrato{font:400 15px/2 var(--f);max-width:860px}
.contrato h2{text-align:center;font:700 17px var(--f);text-transform:uppercase;letter-spacing:.02em;margin-bottom:14px}
.contrato p{margin:0 0 12px;text-align:justify}
.contrato .hueco{border:0;border-bottom:1px solid var(--ink);background:transparent;font:inherit;color:inherit;padding:0 3px;max-width:100%;border-radius:0}
.contrato .hueco:focus{outline:0;background:var(--accent-soft)}
.contrato .hueco::placeholder{color:var(--muted);opacity:.6}
.contrato-auto{width:100%;border-collapse:collapse;margin:0 0 12px;line-height:1.5}
.contrato-auto th,.contrato-auto td{border:1px solid var(--line);padding:6px 9px;text-align:left}
.contrato-auto th{width:17%;font-weight:600;background:var(--surface2)}
.contrato-firmas{display:flex;gap:40px;margin-top:70px}
.contrato-firmas div{flex:1;text-align:center}
.contrato-firmas span{display:block;border-top:1px solid var(--ink);margin-bottom:4px}
@media print{
  /* Al imprimir, el sitio oculta todo salvo lo que se pidió imprimir: aquí, el contrato. */
  #contrato,#contrato *{visibility:visible}
  #contrato{position:absolute;left:0;top:0;width:100%}
  body{background:#fff}
  .contrato{border:0;box-shadow:none;padding:0;max-width:none;font-size:12.5pt}
  .contrato .hueco{border-bottom-color:#000}
  .contrato .hueco::placeholder{color:transparent}
  .contrato-auto th{background:#fff}
}
.contrato .hueco{box-sizing:border-box}
@media screen and (max-width:620px){
  .contrato{line-height:2.2;font-size:14.5px}
  .contrato p{text-align:left}
  .contrato-auto,.contrato-auto tbody,.contrato-auto tr,.contrato-auto th,.contrato-auto td{display:block;width:auto}
  .contrato-auto th{border-bottom:0;padding-bottom:2px}
  .contrato-auto td{border-top:0;padding-top:2px}
  .contrato-auto .hueco{width:100%}
  .contrato-firmas{gap:18px}
}
.contrato p{text-align:left}
@media print{.contrato .hueco:focus{background:transparent}}
/* Los márgenes del papel: sin esto el contrato sale pegado a los bordes de la hoja. */
@page{margin:20mm 18mm}

/* ===== guardar una búsqueda como interés ===== */
.guardar-interes{margin-top:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);max-width:560px}
.guardar-interes p{margin:0 0 8px}
.guardar-interes label{display:block;font-weight:600;margin-bottom:4px}
.interes-filtros{margin:2px 0}

/* ===== lo que distingue a una automotora que paga ===== */
.pill.destacada{background:var(--aviso-soft);color:var(--aviso-ink);border:1px solid var(--aviso-borde)}
.car.de-destacada{border-color:#e6c36a;box-shadow:0 0 0 1px #e6c36a inset}
.car-automotora{display:inline-flex;align-items:center;gap:5px;max-width:150px;font:600 12px var(--f);color:var(--ink)}
.car-automotora img{flex:none;width:22px;height:22px;border-radius:5px;object-fit:contain;background:#fff;border:1px solid var(--line)}
.car-automotora span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nivel-incluye li.no{color:var(--muted);list-style:none;margin-left:-16px}
.nivel-incluye li.no::before{content:"— "}

.oferta-primero{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;border:1px solid var(--accent);border-radius:10px;background:var(--accent-soft)}
.oferta-primero>div{flex:1;min-width:220px}
.oferta-primero b{display:block}
/* ===== qué busca la gente: el panel de demanda de las automotoras ===== */
.demanda-grilla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.demanda-parte{margin:0}
.demanda-lista{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:7px}
.demanda-lista li{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(60px,1fr) auto;align-items:center;gap:10px}
.demanda-que{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.demanda-barra{height:8px;border-radius:999px;background:var(--surface2);overflow:hidden}
.demanda-barra span{display:block;height:100%;border-radius:999px;background:var(--accent)}
.demanda-n{white-space:nowrap;text-align:right}
.demanda-vacio{padding:10px 0}
.demanda-bloqueado{margin-top:10px;padding:14px 16px;border:1px dashed var(--accent);border-radius:12px;background:var(--accent-soft)}
.demanda-bloqueado ul{margin:6px 0 12px 18px}
.demanda-bloqueado li{margin:3px 0}
@media (max-width:900px){.demanda-grilla{grid-template-columns:minmax(0,1fr)}.demanda-lista li{grid-template-columns:minmax(0,1fr) auto}.demanda-barra{display:none}}
/* La columna del número tiene ancho fijo: así todas las barras parten del mismo lugar. */
.demanda-lista li{grid-template-columns:minmax(0,1.4fr) minmax(60px,1fr) 150px}
@media (max-width:900px){.demanda-lista li{grid-template-columns:minmax(0,1fr) auto}}

/* Precio a convenir: se lee como texto, no como una cifra. */
.price.a-convenir{font-size:15px;font-weight:600;color:var(--muted)}
.price.grande.a-convenir{font-size:20px}

/* El saludo automático de una automotora: se ve como un mensaje recibido, pero dice que es automático. */
.chat-saludo{align-self:flex-start;max-width:min(78%,520px);padding:8px 12px;border-radius:12px;background:var(--surface2);border:1px dashed var(--line)}
.chat-saludo p{margin:2px 0 0;white-space:pre-line}
.precio-acordado{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}

/* "Precio a convenir" ocupa el mismo alto que una cifra, para que la tarjeta no quede más corta que las demás. */
.price.a-convenir{line-height:1.52}
.price.grande.a-convenir{line-height:1.56}

/* ===== la página de un auto: sin pestañas, todo a la vista y en orden ===== */
.indice-auto{display:flex;flex-wrap:wrap;gap:4px;margin:14px -4px -6px;border-top:1px solid var(--line);padding-top:8px}
.indice-auto a{padding:6px 11px;border-radius:999px;font:600 13.5px var(--f);color:var(--muted);text-decoration:none;background:var(--surface2);display:inline-flex;align-items:center;gap:6px}
.indice-auto a:hover,.indice-auto a:focus-visible{background:var(--accent-soft);color:var(--accent)}
.indice-auto .cuenta{font-size:12px;background:var(--surface);border-radius:999px;padding:0 7px}
html{scroll-padding-top:70px}
.pasos-publicar{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;counter-reset:paso}
.pasos-publicar li{position:relative;padding:8px 10px 8px 38px;border-radius:9px;background:var(--surface2);counter-increment:paso}
.pasos-publicar li::before{content:counter(paso);position:absolute;left:10px;top:8px;width:20px;height:20px;border-radius:50%;background:var(--line);color:var(--ink);font:700 12px/20px var(--f);text-align:center}
.pasos-publicar li.listo::before{content:"✓";background:var(--accent);color:#fff}
.pasos-publicar li.pendiente{background:var(--aviso-soft)}
.pasos-publicar li.pendiente::before{background:#e8a317;color:#fff}
.pasos-publicar li.ahora::before{background:var(--ink);color:#fff}
.pasos-publicar li b{margin-right:6px}
.plegable>summary{cursor:pointer;list-style:none;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.plegable>summary::-webkit-details-marker{display:none}
.plegable>summary h2{display:inline}
.plegable>summary::after{content:"Ver";margin-left:auto;font:600 13px var(--f);color:var(--accent)}
.plegable[open]>summary::after{content:"Ocultar"}
.plegable[open]>summary{margin-bottom:10px}
.plegable.suelto{margin-top:14px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.contrato-acceso{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.contrato-acceso h3{font:700 15px var(--f)}
.papeles{border-top:0;margin-top:0}

/* ===== mi stock: buscar, filtrar y pasar de página ===== */
.stock-buscar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.stock-buscar .grow{flex:1;min-width:220px}
.stock-buscar select{max-width:220px}
.stock-estados{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.stock-estados a{padding:5px 11px;border-radius:999px;font:600 13px var(--f);color:var(--muted);text-decoration:none;background:var(--surface2);display:inline-flex;align-items:center;gap:6px}
.stock-estados a.activa{background:var(--accent-soft);color:var(--accent)}
.stock-estados .cuenta{font-size:12px;background:var(--surface);border-radius:999px;padding:0 7px}
.le-falta{display:block;margin-top:3px;font-size:12.5px;color:#8a5a00}
.paginas{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px}
.auto-vecinos{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px;font-size:13.5px}
.auto-vecinos .lados{display:flex;gap:6px}
/* ===== visitas y contactos de la automotora: barras por día ===== */
.actividad-dias{display:flex;align-items:flex-end;gap:3px;height:150px;margin-top:8px;padding-bottom:18px;position:relative}
.actividad-dias .dia{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative}
.actividad-dias .barras{display:flex;align-items:flex-end;gap:1px;width:100%;height:100%;border-bottom:1px solid var(--line)}
.actividad-dias .barras span{flex:1;min-height:0;border-radius:2px 2px 0 0}
.actividad-dias .b-v{background:var(--line)}
.actividad-dias .b-c{background:var(--accent)}
.actividad-dias .f{position:absolute;bottom:-17px;font-size:10.5px;color:var(--muted);white-space:nowrap}
.leyenda{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.leyenda span{display:inline-block;width:10px;height:10px;border-radius:2px}
.leyenda .l-v{background:var(--line)}
.leyenda .l-c{background:var(--accent);margin-left:8px}

.oferta-alcance{display:flex;align-items:baseline;gap:10px;margin:8px 0 4px}
.oferta-alcance b{font:700 34px/1 var(--fc);color:var(--accent)}

/* ===== el candado: una función que el nivel no incluye. Se ve, se explica y lleva a los niveles ===== */
.candado{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px;padding:12px 14px;border:1px dashed var(--accent);border-radius:12px;background:var(--accent-soft)}
.candado>.i{flex:none;width:22px;height:22px;color:var(--accent)}
.candado-t{flex:1;min-width:220px}
.candado-t b{margin-right:6px}
.candado-t p{margin:3px 0 0}
.candado.compacto{padding:8px 12px;gap:10px}
.candado.compacto>.i{width:18px;height:18px}
.candado{margin-bottom:10px}

/* Mi stock: el precio en su columna y las acciones en la suya, para que todas las filas se lean igual. */
.stock-antes{display:block;margin-top:3px}
table.stock th.acc,table.stock td.acc{text-align:right;white-space:nowrap}
.stock-acciones{display:inline-flex;gap:6px;justify-content:flex-end}
/* ===== la administración, como un panel de configuración ===== */
.menu-admin{display:flex;flex-direction:column;gap:2px;font-size:14.5px}
.menu-admin-volver{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-size:13px;margin-bottom:6px}
.menu-admin-volver .i{transform:rotate(180deg)}
.menu-admin-volver:hover{color:var(--accent)}
.menu-admin-t{font:700 18px var(--fc);margin:2px 0 8px}
.menu-admin-buscar{margin-bottom:8px}
.menu-admin-g{margin-top:10px}
.menu-admin-gt{font:700 11.5px var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 4px 8px}
.menu-admin-i{display:flex;align-items:center;gap:10px;padding:7px 9px;border-radius:9px;color:var(--ink);text-decoration:none}
.menu-admin-i .i{flex:none;width:18px;height:18px;color:var(--muted)}
.menu-admin-i span:not(.menu-admin-n){flex:1;min-width:0}
.menu-admin-i:hover{background:var(--surface2)}
.menu-admin-i.activa{background:var(--accent-soft);color:var(--accent);font-weight:600}
.menu-admin-i.activa .i{color:var(--accent)}
.menu-admin-n{flex:none;min-width:20px;padding:0 6px;border-radius:999px;background:#d93636;color:#fff;font:700 11.5px/20px var(--f);text-align:center}
.menu-admin-i[hidden],.menu-admin-g[hidden]{display:none}
.para-hoy{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.para-hoy-i{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);background:var(--surface)}
.para-hoy-i:hover{border-color:var(--accent)}
.para-hoy-i>b{flex:none;min-width:42px;font:700 26px/1 var(--fc);color:#d93636;text-align:center}
.para-hoy-i>span:nth-child(2){flex:1;display:flex;flex-direction:column}
.para-hoy-i .t{font-weight:700}
.admin-secciones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.admin-secciones .opcion b{display:flex;align-items:center;gap:6px}
@media (max-width:900px){.admin-secciones{grid-template-columns:minmax(0,1fr)}}
/* Una ficha que se despliega dentro de una lista de la administración. */
.ficha-admin{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin-top:8px}
.ficha-admin>summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr)) auto;align-items:center;gap:12px;padding:11px 14px}
.ficha-admin>summary::-webkit-details-marker{display:none}
.ficha-admin>summary::after{content:"Abrir";font:600 13px var(--f);color:var(--accent);text-align:right}
.ficha-admin[open]>summary::after{content:"Cerrar"}
.ficha-admin[open]>summary{border-bottom:1px solid var(--line)}
.ficha-admin .fa-n{display:flex;align-items:center;gap:10px;min-width:0}
.ficha-admin .fa-n b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ficha-admin .fa-c{min-width:0;font-size:13.5px}
.ficha-admin .fa-c small{display:block;color:var(--muted);font-size:12px}
.ficha-admin>.fa-cuerpo{padding:12px 14px 16px}
.ficha-admin.atencion{border-color:#e8a317;box-shadow:inset 3px 0 0 #e8a317}
.pestanas-admin{display:flex;gap:4px;flex-wrap:wrap;margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.pestanas-admin a{padding:6px 12px;border-radius:999px;font:600 13.5px var(--f);color:var(--muted);text-decoration:none;background:var(--surface2)}
.pestanas-admin a.activa{background:var(--accent-soft);color:var(--accent)}
.lista-admin-barra{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.lista-admin-barra .grow{flex:1;min-width:220px}
@media (max-width:900px){.ficha-admin>summary{grid-template-columns:minmax(0,1fr) auto}.ficha-admin .fa-c{display:none}.ficha-admin .fa-c.fa-estado{display:block}}
/* ===== equipo: perfiles y zonas a cargo ===== */
.perfiles-que-hacen{margin:12px 0 0 18px;font-size:13.5px;color:var(--muted)}
.perfiles-que-hacen li{margin:3px 0}
.zonas-encargado{display:flex;flex-direction:column;gap:8px}
.zonas-region{border:1px solid var(--line);border-radius:10px;padding:8px 12px;display:flex;flex-wrap:wrap;gap:6px 16px}
.zonas-region legend{font-weight:700;font-size:13.5px;padding:0 4px}
.zona-opcion{display:inline-flex;align-items:center;gap:6px;font-size:14px}

.otra-zona{margin:6px 0 4px;width:100%;box-sizing:border-box;max-width:100%}

.nota-referencia{margin-top:10px;padding:10px 12px;border-radius:10px;background:var(--surface2);font-size:13px;color:var(--muted)}
.nota-referencia b{color:var(--ink)}

/* ===== el inicio para quien no ha ingresado ===== */
.portada-visita h2{font:700 22px/1.25 var(--fc)}
.portada-visita>p.mut{margin-top:4px}
.portada-buscar{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.portada-buscar select{max-width:230px}
.portada-buscar .grow{flex:1;min-width:200px}
.razones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}
.razones>div{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:10px;background:var(--surface2)}
@media (max-width:900px){.razones{grid-template-columns:minmax(0,1fr)}}
.portada-muro-t{font:700 17px var(--fc);margin:6px 2px 8px}

/* ===== buscar hablando ===== */
.buscar{position:relative}
.buscar-voz{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:0;background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center}
.buscar-voz:hover{background:var(--surface2);color:var(--accent)}
.buscar-voz.escuchando{background:#d93636;color:#fff;animation:latido 1.2s ease-in-out infinite}
@keyframes latido{50%{box-shadow:0 0 0 6px rgba(217,54,54,.18)}}
.buscar input{padding-right:40px}
.entendido{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px;font-size:13.5px}
.entendido .chip-x{display:inline-flex;align-items:center;gap:4px;padding:4px 6px 4px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-weight:600;text-decoration:none}
.entendido .chip-x span{font-weight:700;opacity:.7}
.portada-q{position:relative;display:flex;min-width:200px}
.portada-q .inp{width:100%;padding-right:40px}
.buscar-frase{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.buscar-frase .grow{flex:1}

/* ===== video propio ===== */
.video-propio{display:flex;flex-direction:column;gap:6px;max-width:420px}
.video-propio video,.video-aviso video{width:100%;max-height:520px;border-radius:12px;background:#000}
.video-aviso{margin-top:12px}
.subir-video{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.subir-video-avance{display:flex;flex-direction:column;gap:4px;max-width:420px}
.subir-video-avance .barra{height:8px;border-radius:999px;background:var(--surface2);overflow:hidden}
.subir-video-avance .barra span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.video-muro video{display:block;width:100%;max-height:640px;background:#000;object-fit:contain}
.dz-lamina .video-muro,.dz-lamina .video-muro video{height:100%;max-height:none}

/* El navegador no corre la pantalla por su cuenta cuando una zona cambia de alto al guardar: lo hace el sitio, a propósito. */
[data-zona]{overflow-anchor:none}

/* ===== páginas de error ===== */
.pagina-error{max-width:720px}
.pagina-error-codigo{font:800 56px/1 var(--fc);color:var(--accent);margin-bottom:6px}

/* ===== autos robados ===== */
.estampa-robado{position:absolute;top:10px;left:-6px;padding:4px 14px;background:var(--urgente);color:#fff;font:800 13px/1.2 var(--fc);letter-spacing:.08em;transform:rotate(-4deg);box-shadow:0 2px 6px rgba(0,0,0,.25);border-radius:3px}
.robado-tarjeta .art,.robado-foto{position:relative;overflow:visible}
.placa-patente{display:inline-block;padding:2px 10px;border:2px solid #222;border-radius:5px;background:#fff;color:#111;font:800 15px/1.3 ui-monospace,Consolas,monospace;letter-spacing:.06em}
.placa-patente.grande{font-size:26px;padding:4px 16px;margin-bottom:6px}
.robado-ficha{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.robado-foto img{width:100%;border-radius:12px}
@media (max-width:760px){.robado-ficha{grid-template-columns:minmax(0,1fr)}}
.post-robado{border:2px solid var(--urgente)}
.franja-robado{display:flex;flex-direction:column;gap:2px;margin:-14px -14px 12px;padding:10px 14px;background:var(--urgente);color:#fff;text-decoration:none;border-radius:12px 12px 0 0}
.franja-robado span{font-size:13px;opacity:.95}
.robados-urgentes{border:2px solid var(--urgente)}
.robados-fila{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:10px;overflow-x:auto;padding-bottom:4px}
.menu-robados svg{color:var(--urgente)}
.robado-acceso{margin:0 0 10px}
.robado-en-muro{display:block;position:relative;margin:0 0 10px;border-radius:12px;overflow:hidden}
.robado-en-muro img{display:block;width:100%;max-height:480px;object-fit:cover}
.robado-en-muro .estampa-robado{left:8px}
.placa-sobre-foto{position:absolute;right:10px;bottom:10px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.post-recuperado{border:2px solid var(--ok)}
.franja-robado.recuperado{background:var(--ok)}
.robado-en-muro:has(+ *) .estampa-robado{}
.post-recuperado .estampa-robado{background:var(--ok)}

/* ===== la barra de filtros de Buscar ===== */
.barra-filtros{position:sticky;top:calc(64px + env(safe-area-inset-top,0px));z-index:12}
.barra-filtros .ph{margin-bottom:8px}
.barra-filtros h1{font-size:20px}
.fb-fila{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fb{position:relative}
.fb>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-weight:600;font-size:14px;white-space:nowrap;user-select:none}
.fb>summary::-webkit-details-marker{display:none}
.fb[open]>summary{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.fb-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:20;min-width:280px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 12px 32px rgba(0,0,0,.14);display:flex;flex-direction:column;gap:10px}
.fb-dos{flex-direction:row;gap:10px}
.fb-dos .fld{min-width:130px}
.fb-grande{width:min(640px,92vw)}
.fb-mas .fb-panel{left:auto;right:0}
.fb-orden{margin-left:auto}
.fb-orden label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.fb-orden .inp{border-radius:999px;padding-top:6px;padding-bottom:6px}
.fb-activos{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.fb-activos:empty{display:none}
.fb-ver{display:none}
@media (max-width:760px){
  .barra-filtros{top:calc(54px + env(safe-area-inset-top,0px));border-radius:0;margin-left:-12px;margin-right:-12px}
  .barra-filtros .ph{display:none}
  .fb-fila{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .fb-fila::-webkit-scrollbar{display:none}
  .fb-orden{margin-left:0}
  /* En el celular cada filtro se abre como un panel desde abajo, con el botón grande para ver los resultados. */
  .fb-panel,.fb-mas .fb-panel{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-height:78vh;overflow:auto;border-radius:18px 18px 0 0;padding:18px 16px calc(16px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 40px rgba(0,0,0,.25)}
  .fb-dos{flex-direction:column}
  .fb-ver{display:block;position:sticky;bottom:0;padding-top:8px;background:var(--surface)}
}
@media (max-width:760px){
  /* La fila de filtros se desliza dentro de su ancho: no empuja la página hacia el costado. */
  .barra-filtros,.filtros-barra{min-width:0;max-width:100vw}
  .barra-filtros{overflow:hidden}
  .fb-fila{width:100%;min-width:0}
  .fb-orden .fld{margin:0}
}
@media (max-width:760px){
  /* En el celular "Más filtros" va primero: es el que abre todo, y queda a mano sin deslizar. */
  .fb-mas{order:-1}
  .fb-mas>summary{background:var(--accent);color:#fff;border-color:var(--accent)}
}
@media (max-width:760px){
  /* Con un filtro abierto, su panel va por encima de la barra de abajo del celular. */
  .barra-filtros:has(details[data-fb][open]){z-index:80}
  .fb-panel{z-index:81}
}
.fb-panel .fld.fin{align-items:flex-start;justify-content:flex-start;display:flex;flex-direction:column;gap:6px}
.fb-panel .fld.fin label{justify-content:flex-start;width:100%}
.fb-activos .chip-x{display:inline-flex;align-items:center;gap:4px;padding:4px 6px 4px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-weight:600;font-size:13.5px;text-decoration:none}
.fb-activos .chip-x span{font-weight:700;opacity:.7}

/* ===== el menú de la izquierda, en el color oscuro del tema ===== */
.lado.izq .menu-principal{background:var(--lado-fondo);color:var(--lado-ink);border-radius:16px;padding:10px}
.lado.izq .menu-principal a{color:var(--lado-ink)}
.lado.izq .menu-principal a:hover{background:var(--lado-activo)}
.lado.izq .menu-principal a.activa{background:var(--lado-activo);color:#fff;box-shadow:inset 3px 0 0 var(--sel)}
.lado.izq .menu-principal .menu-titulo,.lado.izq .menu-principal summary,.lado.izq .menu-principal .mut{color:var(--lado-mut)}
.lado.izq .menu-principal hr,.lado.izq .menu-principal .sep{border-color:var(--lado-linea)}
.lado.izq .menu-principal .menu-rubro-n,.lado.izq .menu-principal .num{color:var(--lado-mut)}
.lado.izq .menu-principal svg{color:var(--lado-mut)}
.lado.izq .menu-principal a.activa svg,.lado.izq .menu-principal a:hover svg{color:var(--sel)}
.menu-robados svg{color:var(--urgente)!important}
/* ===== el logo ===== */
.logo-pin{width:30px;height:34px;flex:none;display:block}
.logo-pin .pin{fill:var(--accent)} .logo-pin .t1,.logo-pin .t2{fill:#fff} .logo-pin .t2{fill:var(--sel)}
/* ===== elegir tema ===== */
.temas{display:flex;flex-wrap:wrap;gap:10px}
.tema-op{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 12px;border:2px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer;min-width:96px}
.tema-op[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.tema-muestra{display:flex;gap:3px}
.tema-muestra i{width:18px;height:18px;border-radius:50%;display:block;border:1px solid rgba(0,0,0,.08)}
.lado.izq .menu-principal .menu-sep{border:0;border-top:1px solid var(--lado-linea)}
.lado.izq .menu-principal .menu-t a{color:var(--lado-mut)}
.lado.izq .menu-principal .menu-mas summary{color:var(--lado-ink)}
.lado.izq .menu-principal .menu-mas-i{background:transparent;color:var(--lado-mut)}
.lado.izq .menu-principal a.menu-rubro{color:var(--lado-ink)}
.lado.izq .menu-principal a.menu-rubro svg{color:var(--lado-mut)}

/* =====================================================================
   El aspecto nuevo (zip 116): portada, secciones de autos, franja de
   confianza, tarjetas y módulos del panel derecho. Solo colores del tema.
   ===================================================================== */
/* el menú de la izquierda, oscuro de arriba a abajo */
.tres>.lado.izq{background:var(--lado-fondo);border-radius:18px;padding:8px;max-height:calc(100vh - 78px)}
.tres>.lado.izq .menu-principal{background:transparent;padding:4px;border-radius:0}
.tres>.lado.izq>.mut,.tres>.lado.izq>p{color:var(--lado-mut)}
/* la portada con su buscador */
.portada{position:relative;overflow:hidden;border-radius:18px;padding:30px 28px 24px;color:#fff;background:linear-gradient(135deg,var(--lado-fondo) 0%,var(--accent) 62%,var(--sel) 140%)}
.portada::after{content:"";position:absolute;right:-80px;top:-60px;width:360px;height:360px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.14),transparent);pointer-events:none}
.portada-texto{position:relative;max-width:560px}
.portada h2{font:700 34px/1.08 var(--fc);color:#fff;letter-spacing:-.2px}
.portada-texto p{margin-top:10px;font-size:15.5px;color:rgba(255,255,255,.86)}
.portada-buscador{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:0;margin-top:22px;background:var(--surface);border-radius:14px;padding:8px;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.pb-campo{display:flex;flex-direction:column;gap:2px;padding:6px 12px;border-right:1px solid var(--line);color:var(--ink)}
.pb-campo span{font-size:11.5px;color:var(--muted)}
.pb-campo select,.pb-campo input{border:0;background:transparent;font-weight:600;font-size:14px;padding:2px 0;color:var(--ink);outline:none;min-width:0}
.pb-boton{margin-left:8px;align-self:stretch;display:inline-flex;align-items:center;gap:8px;padding:0 22px;border-radius:10px}
.portada-cuenta{position:relative;display:flex;gap:8px;margin-top:14px}
.portada-cuenta .btn.sec{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.35)}
/* las secciones de autos */
.seccion-autos{margin-top:22px}
.seccion-t{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 2px 12px}
.seccion-t h2{font:700 20px/1.2 var(--fc)}
.grid.cuatro{grid-template-columns:repeat(4,minmax(0,1fr))}
/* las tarjetas: la foto manda, y lo importante a la vista */
.car{border-radius:14px;overflow:hidden;background:var(--surface);border:1px solid var(--line);transition:box-shadow .15s,transform .15s}
.car:hover{box-shadow:0 10px 26px rgba(15,61,74,.14);transform:translateY(-2px)}
.car .art img{aspect-ratio:4/3;object-fit:cover}
.car .price{font:700 21px/1.15 var(--fc);color:var(--accent)}
.car-ver{display:block;margin:10px 12px 12px;padding:7px;border-radius:9px;background:var(--surface2);color:var(--accent);font-weight:600;font-size:13px;text-align:center}
.car:hover .car-ver{background:var(--accent);color:var(--accent-ink)}
.pill.dest,.etiqueta.destacado{background:var(--accent)!important;color:var(--accent-ink)!important;border-color:var(--accent)!important}
/* la franja de lo que el sitio cumple */
.franja-confianza{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px;padding:16px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.franja-confianza>div{display:flex;gap:10px;align-items:flex-start}
.franja-confianza svg{color:var(--accent);flex:none;margin-top:2px}
.franja-confianza b{display:block;font-size:13.5px}
.franja-confianza span span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
/* el título del muro, con su zona */
.muro-t{margin-top:26px}
.fb-zona .fb-panel{left:auto;right:0;min-width:240px;max-height:360px;overflow:auto}
.fb-lista a{display:flex;justify-content:space-between;gap:10px;padding:7px 10px;border-radius:8px;text-decoration:none}
.fb-lista a:hover,.fb-lista a.activa{background:var(--accent-soft);color:var(--accent)}
/* los módulos del panel derecho */
.modulo{padding:16px;border-radius:16px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.modulo h2{font:700 17px/1.2 var(--fc)}
.modulo-oscuro{background:linear-gradient(160deg,var(--lado-fondo),var(--accent));color:#fff;border:0}
.modulo-oscuro h2{color:#fff} .modulo-oscuro p{color:rgba(255,255,255,.85);font-size:13.5px}
.modulo-oscuro .btn.sec{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.35);align-self:flex-start}
.modulo-buscar{display:flex;gap:6px}
.modulo-buscar .inp{background:var(--surface);color:var(--ink)}
.modulo .btn.pri.small{align-self:flex-start}
.actividad-fila{display:flex;align-items:center;gap:10px;padding:8px 2px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink)}
.actividad-fila span{flex:1;font-size:13.5px} .actividad-fila b{font:700 17px var(--fc);color:var(--accent)}
.actividad-fila svg{color:var(--muted)}
.actividad-fila:hover span{color:var(--accent)}
/* tamaños */
@media (max-width:1280px){.grid.cuatro{grid-template-columns:repeat(3,minmax(0,1fr))}.portada-buscador{grid-template-columns:repeat(2,minmax(0,1fr))}.pb-campo{border-right:0;border-bottom:1px solid var(--line)}.pb-boton{grid-column:1/-1;margin:8px 0 0;justify-content:center;padding:12px}}
@media (max-width:900px){.grid.cuatro{grid-template-columns:repeat(2,minmax(0,1fr))}.franja-confianza{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.portada{border-radius:0;margin:0 -12px;padding:22px 16px}.portada h2{font-size:26px}.portada-buscador{grid-template-columns:minmax(0,1fr)}.grid.cuatro{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.franja-confianza{grid-template-columns:minmax(0,1fr)}}
/* el inicio usa todo el ancho: la portada y las tarjetas lucen; el muro queda a un ancho cómodo para leer */
.tres.inicio-ancho{grid-template-columns:250px minmax(0,1fr) 320px;max-width:none;margin:0;padding:0 16px;justify-content:stretch}
.inicio-ancho [data-zona="muro"],.inicio-ancho .muro-t{width:100%;max-width:760px;margin-left:auto;margin-right:auto}
@media (max-width:1100px){.tres.inicio-ancho{grid-template-columns:minmax(0,1fr) 300px}}
@media (max-width:820px){.tres.inicio-ancho{grid-template-columns:minmax(0,1fr);padding:0 12px}}
.portada-auto{position:absolute;right:-10px;top:8px;width:min(46%,500px);height:auto;fill:none;stroke:rgba(255,255,255,.22);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.portada{min-height:250px}
.car-t{font:700 16px/1.2 var(--fc)}
.car-v{display:block;margin-top:1px}
.car-datos{display:flex;flex-wrap:wrap;gap:4px 12px;margin:6px 0}
.car-datos span{display:inline-flex;align-items:center;gap:4px}
.car-datos svg{color:var(--muted)}
@media (max-width:760px){.portada-auto{width:70%;top:auto;bottom:-20px;opacity:.6}}
.fb-lista .zona-fila .num{color:var(--muted);font-size:12px}
.portada-n{margin-top:8px!important;font-weight:600;font-size:13.5px;color:#fff!important;opacity:.95}
@media (max-width:760px){
  .portada{margin:0;border-radius:16px}
  .franja-confianza{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;padding:12px}
  .franja-confianza span span{display:none}
}
.solo-movil{display:none}
@media (max-width:820px){.solo-movil{display:flex}.solo-pc{display:none}}

/* ===== el carrusel de autos ===== */
.carrusel-autos{gap:8px}
.ca-t{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ca-flechas{display:flex;gap:6px}
.ca-flechas .btn{width:30px;height:30px;padding:0;font-size:18px;line-height:1;display:grid;place-items:center}
.ca-pista{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;outline:none}
.ca-pista::-webkit-scrollbar{display:none}
.ca-item{scroll-snap-align:start;min-width:0}
.ca-item .car-env{height:100%}
@media (max-width:820px){.ca-pista{grid-auto-columns:78%}}
/* ===== con cuenta: una barra de búsqueda delgada en vez de la portada grande ===== */
.portada.portada-compacta{min-height:0;padding:10px;border-radius:16px}
.portada-compacta .portada-buscador{margin-top:0;box-shadow:none}
/* la franja de un robo o recuperado, con su margen */
.post .franja-robado{margin:0;border-radius:0;padding:10px 14px}
.tres>.lado>*{flex-shrink:0}

/* ===== el mismo aspecto en las demás páginas (zip 118) ===== */
/* el título "Servicios para tu auto" del menú oscuro, marcado como los demás */
.lado.izq .menu-principal .menu-t a.activa{background:var(--lado-activo);color:#fff;box-shadow:inset 3px 0 0 var(--sel);border-radius:10px}
/* los bloques de la columna derecha, con la forma de los módulos del inicio */
.lado.der>.panel,.lado.der>section.panel,.lado.der>div>.panel{border-radius:16px;padding:16px}
.lado.der .panel h2{font:700 17px/1.2 var(--fc)}
/* la zona de Servicios y Automotoras, como botón redondo igual al de Buscar */
#zona,#zona-automotoras{border-radius:999px;font-weight:600;padding:7px 34px 7px 14px;width:auto;max-width:280px;background-color:var(--surface);border:1px solid var(--line)}
#zona:focus,#zona-automotoras:focus{border-color:var(--accent)}
/* los rubros: los chips con el color del tema */
.chips .chip{border-radius:999px;font-weight:600}
.chips .chip.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
@media (max-width:760px){.chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}.chips::-webkit-scrollbar{display:none}.chips .chip{white-space:nowrap}}
/* el aviso: el precio en el color del tema, como en las tarjetas */
#precio.price.grande{color:var(--accent)}

/* ===== el menú oscuro: todos sus estados con buen contraste, en los cuatro temas (zip 119) ===== */
.lado.izq .menu-principal a:hover,
.lado.izq .menu-principal .menu-mas>summary:hover,
.lado.izq .menu-principal .menu-t a:hover{background:var(--lado-activo);color:#fff}
.lado.izq .menu-principal .menu-mas>summary:hover svg,.lado.izq .menu-principal a:hover svg{color:var(--sel)}
.lado.izq .menu-principal .menu-mas[open]>summary{color:var(--lado-ink)}
.lado.izq .menu-principal a:focus-visible,
.lado.izq .menu-principal .menu-mas>summary:focus-visible{outline:2px solid var(--sel);outline-offset:1px;background:var(--lado-activo);color:#fff}
.lado.izq .menu-principal a.menu-rubro:hover{color:#fff}
.lado.izq .menu-principal .menu-mas-i{color:inherit}

/* las tarjetas de autos robados: de tamaño fijo, aunque haya una sola */
.robados-fila{grid-auto-columns:220px;justify-content:start}
.robado-tarjeta .art img{aspect-ratio:4/3;object-fit:cover;width:100%}
.robado-recuperado{display:block;padding:10px 12px;background:var(--ok-soft);color:var(--ok-ink);font-weight:700;border-radius:12px 12px 0 0}
.niveles-plegable>summary{padding:12px 14px}
.niveles-plegable>.panel{margin-top:8px}
/* los niveles en Mi automotora: el tuyo marcado, los demás con su botón */
.niveles-cortos{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:10px}
.nivel-corto{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.nivel-corto.actual{border:2px solid var(--accent);background:var(--accent-soft)}
.nivel-corto .btn,.nivel-corto .pill{align-self:flex-start}
/* las tarjetas de robo: el texto con su margen */
.robado-tarjeta .body{display:flex;flex-direction:column;gap:4px;padding:10px 12px}
.robados-calmos{border:1px solid var(--line)!important}
.nivel.actual{border:2px solid var(--accent);background:var(--accent-soft)}
.nivel .pill,.nivel .btn{align-self:flex-start;margin-top:6px}

/* ===== el menú de la administración, sobre la columna oscura (zip 122) ===== */
.lado.izq .menu-admin{color:var(--lado-ink)}
.lado.izq .menu-admin-volver{color:var(--lado-mut)}
.lado.izq .menu-admin-volver:hover,.lado.izq .menu-admin-volver:focus-visible{color:#fff}
.lado.izq .menu-admin-t{color:#fff}
.lado.izq .menu-admin-gt{color:var(--lado-mut)}
.lado.izq .menu-admin-i{color:var(--lado-ink)}
.lado.izq .menu-admin-i .i{color:var(--lado-mut)}
.lado.izq .menu-admin-i:hover,.lado.izq .menu-admin-i:focus-visible{background:var(--lado-activo);color:#fff}
.lado.izq .menu-admin-i:hover .i,.lado.izq .menu-admin-i:focus-visible .i{color:var(--sel)}
.lado.izq .menu-admin-i.activa,.lado.izq .menu-admin-i[aria-current="page"]{background:var(--lado-activo);color:#fff;box-shadow:inset 3px 0 0 var(--sel)}
.lado.izq .menu-admin-i.activa .i,.lado.izq .menu-admin-i[aria-current="page"] .i{color:var(--sel)}
.lado.izq .menu-admin-i:focus-visible{outline:2px solid var(--sel);outline-offset:1px}
.lado.izq .menu-admin-n{background:var(--urgente);color:#fff}
.lado.izq .menu-admin-nada{color:var(--lado-mut)}
.lado.izq .menu-admin-buscar{background:var(--lado-activo);border-color:var(--lado-linea);color:#fff}
.lado.izq .menu-admin-buscar::placeholder{color:var(--lado-mut)}

/* ===== los círculos de colores, en el menú de la foto y al pie ===== */
.temas-mini{display:flex;align-items:center;gap:8px;padding:8px 10px}
.temas-menu{border-top:1px solid var(--line);margin-top:4px;padding-top:10px}
.temas-mini-t{font-size:12.5px;color:var(--muted);margin-right:2px}
.tema-circulo{width:22px;height:22px;border-radius:50%;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line);background:linear-gradient(135deg,var(--c1) 50%,var(--c2) 50%);cursor:pointer;padding:0}
.tema-circulo:hover{transform:scale(1.12)}
.tema-circulo[aria-pressed="true"]{box-shadow:0 0 0 2px var(--accent)}
.tema-circulo:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pie .temas-pie{padding:0;margin-left:auto}
.lado.izq .menu-principal .menu-rubro-n{color:var(--lado-ink)}
/* "Marcar", sobre la foto: siempre fondo claro con letra oscura, en cualquier tema */
.elegir{color:#1B1F24;border-color:rgba(0,0,0,.12)}
.elegir span,.elegir b{color:#1B1F24}
/* los círculos de colores dentro del menú de la foto: el estilo de los botones del menú no los toca */
.menu-usuario .menu .temas-mini{display:flex}
.menu-usuario .menu .tema-circulo{display:inline-block;flex:none;width:24px;height:24px;padding:0;border-radius:50%;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line);background:linear-gradient(135deg,var(--c1) 50%,var(--c2) 50%)}
.menu-usuario .menu .tema-circulo:hover{background:linear-gradient(135deg,var(--c1) 50%,var(--c2) 50%);transform:scale(1.12)}
.menu-usuario .menu .tema-circulo[aria-pressed="true"]{box-shadow:0 0 0 2px var(--accent)}

/* ===== la carga masiva del stock ===== */
.pasos-carga{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;counter-reset:paso}
.pasos-carga li{counter-increment:paso;padding:10px 12px;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--muted)}
.pasos-carga li b{color:var(--ink);font-size:14px}
.pasos-carga li b::before{content:counter(paso) ". "}
.pasos-carga li.actual{border:2px solid var(--accent);background:var(--accent-soft)}
.pasos-carga li.hecho b::before{content:"✓ "}
.fila-mala td{background:var(--danger-soft)}
.errores-carga{margin:0;padding-left:16px;color:var(--danger);font-size:13px}
.txt-peligro{color:var(--danger)}
.tabla-envoltura{overflow-x:auto}
@media (max-width:760px){.pasos-carga{grid-template-columns:minmax(0,1fr)}}

/* ===== el menú de la izquierda, a todo el alto de la ventana (zip 133) =====
   La columna queda quieta y del mismo alto en todas las páginas: al cambiar de página no crece ni se achica, y no se ve cortada
   al lado de una página larga. Si las opciones no caben, el menú se desplaza por dentro. El aviso para negocios queda al pie.
   En pantallas angostas no cambia nada: ahí el menú es la barra de abajo. */
@media (min-width:901px){
  .tres.marco>.lado.izq{height:calc(100vh - 86px);height:calc(100dvh - 86px);max-height:none;overflow:hidden}
}
@media (min-width:1101px){
  .tres:not(.marco)>.lado.izq{height:calc(100vh - 86px);height:calc(100dvh - 86px);max-height:none;overflow:hidden}
}
.tres>.lado.izq>.menu-principal,.tres>.lado.izq>.menu-admin{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--lado-linea) transparent}
.tres>.lado.izq>.menu-principal>.menu-anunciar:last-child{margin-top:auto}

/* ===== el menú de la izquierda, del mismo ancho y en el mismo lugar en todas las páginas (zip 135) =====
   Antes cada diseño tenía su medida (el inicio 250 px con un margen extra; las demás entre 220 y 280 px según la ventana), y al
   pasar de una página a otra el menú se angostaba o se corría. Ahora es una sola medida para todas. */
:root{--ancho-menu:260px}
@media (min-width:901px){
  .tres.marco,.tres.marco.dos{grid-template-columns:var(--ancho-menu) minmax(0,1fr);gap:24px}
}
@media (min-width:1101px){
  .tres:not(.marco){grid-template-columns:var(--ancho-menu) minmax(0,680px) minmax(280px,340px);gap:24px}
  .tres.inicio-ancho{grid-template-columns:var(--ancho-menu) minmax(0,1fr) 320px;gap:24px;padding:0}
}
@media (min-width:1321px){
  .tres.marco{grid-template-columns:var(--ancho-menu) minmax(0,1fr) minmax(270px,330px)}
  .tres.marco.dos{grid-template-columns:var(--ancho-menu) minmax(0,1fr)}
}

/* ===== el muro del inicio, más ancho (zip 136) =====
   Iba a 760 px y dejaba franjas vacías a los lados, bajo un buscador que ocupa todo el ancho. Ahora llega a 900 px, la misma medida
   que el centro de las demás páginas: las fotos se ven más grandes y el muro queda alineado con el resto del sitio. */
.inicio-ancho [data-zona="muro"],.inicio-ancho .muro-t{max-width:900px}

/* ===== el buscador de Buscar, vestido como el del inicio (zip 138) =====
   La misma franja con degradado del tema y una caja blanca con los filtros encima: al pasar del inicio a Buscar se ve que es el
   mismo buscador, ahora con todos sus filtros. Los paneles que se abren desde cada filtro no cambian. */
.barra-filtros{background:linear-gradient(135deg,var(--lado-fondo) 0%,var(--accent) 62%,var(--sel) 140%);border:0;border-radius:16px;padding:10px;color:#fff}
.barra-filtros>.ph{padding:2px 6px 0}
.barra-filtros>.ph h1{color:#fff}
.barra-filtros>.ph .btn.sec{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35);color:#fff}
.barra-filtros>.ph .btn.sec:hover{background:rgba(255,255,255,.24)}
.barra-filtros .fb-fila{background:var(--surface);color:var(--ink);border-radius:14px;padding:8px}
.barra-filtros .fb-panel{color:var(--ink)}
.barra-filtros .fb-activos{padding:0 4px}
.barra-filtros .fb-activos .chip-x{background:var(--surface);color:var(--accent)}
.barra-filtros .fb-activos .lnk{color:#fff}
@media (max-width:760px){
  .barra-filtros{border-radius:0;padding:8px 12px}
}

/* ===== buscar hablando: el micrófono, más grande y a la vista (zip 139) ===== */
.buscar-voz{width:36px;height:36px;right:4px;color:var(--accent);background:var(--accent-soft)}
.buscar-voz .i{width:20px;height:20px}
.buscar-voz:hover{background:var(--accent);color:#fff}
form[data-buscar-voz] input[name="q"]{padding-right:46px}
.buscar .buscar-voz{width:32px;height:32px;right:3px}

/* ===== buscar hablando: los pasos cuando el micrófono no se puede usar (zip 140) ===== */
.voz-ayuda{margin-top:10px;padding:12px 14px;border-radius:12px;background:var(--surface);color:var(--ink);border:1px solid var(--line);box-shadow:0 6px 20px rgba(0,0,0,.12);font-size:14px}
.voz-ayuda b{display:block;margin-bottom:6px}
.voz-ayuda ol{margin:0 0 10px;padding-left:20px}
.voz-ayuda li+li{margin-top:4px}
/* en la barra de arriba, el recuadro flota bajo el buscador sin mover la barra */
.top>.voz-ayuda{position:absolute;top:calc(100% + 6px);left:110px;z-index:60;width:min(380px,calc(100vw - 32px))}

/* ===== perfil: los datos se editan en el mismo recuadro (zip 143) ===== */
.perfil-editar{margin-top:12px}
.perfil-editar>summary{list-style:none;cursor:pointer}
.perfil-editar>summary::-webkit-details-marker{display:none}
.perfil-editar-f{display:flex;flex-direction:column;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.perfil-editar-f .btn{align-self:flex-start}
.perfil-editar .alerta{margin-top:10px}

/* ===== confirmar: el recuadro del sitio en vez de la ventanita del navegador (zip 144) ===== */
dialog.confirmar{border:0;border-radius:16px;padding:20px;max-width:min(420px,calc(100vw - 32px));background:var(--surface);color:var(--ink);box-shadow:0 18px 48px rgba(0,0,0,.28)}
dialog.confirmar::backdrop{background:rgba(0,0,0,.45)}
.confirmar-texto{margin:0 0 16px;font-size:15.5px;line-height:1.45}
.confirmar-botones{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}

/* ===== perfil: destacados y fotos (zip 147) ===== */
.destacados-elegir{position:relative}
.destacados-elegir>summary{list-style:none;cursor:pointer}
.destacados-elegir>summary::-webkit-details-marker{display:none}
.destacados-lista{position:absolute;right:0;top:calc(100% + 6px);z-index:20;width:min(360px,86vw);max-height:360px;overflow:auto;display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 12px 32px rgba(0,0,0,.14)}
.destacados-fila{display:flex;align-items:center;gap:8px;font-size:14px}
.destacado-auto{display:flex;flex-direction:column;gap:4px}
.destacada{position:relative}
.destacada-marca{display:inline-block;margin:0 0 4px 4px;font:600 12.5px var(--f);color:var(--accent)}
.destacada-quitar{position:absolute;right:6px;top:0}
.perfil-fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px}
.perfil-fotos a{display:block;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--surface2)}
.perfil-fotos img{width:100%;height:100%;object-fit:cover;display:block}

/* ===== Buscar: automotoras y negocios que calzan con lo escrito (zip 148) ===== */
.calzan{margin:10px 0 4px}
.calzan-fila{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.calzan-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);text-decoration:none;min-width:200px}
.calzan-item:hover{border-color:var(--accent)}
.calzan-item img,.calzan-i{width:34px;height:34px;border-radius:8px;object-fit:cover;flex:none}
.calzan-i{display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.calzan-item>span:last-child{display:flex;flex-direction:column}

/* ===== Comparador: auto base, tabla con diferencias y parecidos para marcar (zip 150) ===== */
.comparar-base-form{margin-top:12px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}
.comparar-base-form>summary{cursor:pointer;font-weight:700}
.comparar-escrito{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:10px;align-items:end;margin-top:10px}
.comparar-escrito label{display:block;font-size:13px;font-weight:600;margin-bottom:4px}
@media (max-width:760px){.comparar-escrito{grid-template-columns:1fr 1fr}.comparar-escrito-b{grid-column:1/-1}.comparar-escrito-b .btn{width:100%}}
.comparar-t{font-size:18px;margin:18px 0 8px}
table.comparar thead th.es-base{background:var(--accent-soft)}
.comparar-pill{margin-top:6px;display:inline-block}
.comparar-acc{display:flex;gap:12px;margin-top:6px}
.comparar-auto .art-vacio{display:grid;place-items:center;color:var(--muted)}
.comparar-auto .art-vacio .i{width:40px;height:40px}
.dif{display:block;margin-top:3px;font-size:12px;font-weight:600;color:var(--muted)}
.dif.a-favor{color:var(--accent)}
.fila-auto-m .dif{display:inline-block;margin:0 8px 0 0}
.comparar-similares .similar{display:flex;align-items:center;gap:10px}
.similar-marcar{flex:none;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;font:600 12px var(--f);cursor:pointer;background:var(--surface)}
.similar-marcar input{width:16px;height:16px;margin:0;accent-color:var(--accent)}
.similar.marcado .fila-auto{outline:2px solid var(--accent);outline-offset:1px}
.similar.lleno .similar-marcar{opacity:.45;cursor:not-allowed}
@media (max-width:560px){.comparar-similares .similar{flex-direction:column;align-items:stretch}.similar-marcar{align-self:flex-start}}

/* ===== Admin: visitas al sitio (zip 151) ===== */
.visitas-cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap,14px)}
@media (max-width:900px){.visitas-cols{grid-template-columns:1fr}}
.parte{display:grid;grid-template-columns:minmax(120px,1.2fr) 2fr auto;align-items:center;gap:10px;padding:5px 0;font-size:14px}
.parte-n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.parte-b{height:10px;border-radius:999px;background:var(--surface2);overflow:hidden}
.parte-b span{display:block;height:100%;background:var(--accent);border-radius:999px}
.parte-c{font-variant-numeric:tabular-nums;font-size:13px;color:var(--muted);white-space:nowrap}
@media (max-width:560px){.parte{grid-template-columns:1fr auto}.parte-b{grid-column:1/-1;grid-row:2}}

/* ===== Mapas (zip 156) ===== */
.mapa-lienzo{height:280px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface2);z-index:0}
.mapa-elegir .mapa-lienzo{cursor:crosshair}
.leaflet-container{font:inherit}
.robado-fotos .previa{width:110px;height:82px}
.robado-visto-foto{width:120px;height:90px;object-fit:cover;border-radius:8px;margin-top:6px}

/* ===== Cupones con código propio y QR (zip 157) ===== */
.cupon-beneficio{display:inline-block;align-self:flex-start;font:700 13px var(--fc);color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:2px 10px}
.cupon-mio .cupon-pie{align-items:center;gap:12px}
.cupon-qr{flex:none;width:120px;height:120px;background:#fff;border-radius:8px;padding:4px}
.cupon-qr svg{width:100%;height:100%;display:block}
.sello-canjeado{display:inline-block;transform:rotate(-6deg);border:3px solid #b42318;color:#b42318;font:800 15px var(--fc);letter-spacing:.08em;padding:2px 10px;border-radius:6px}
.canje-caja{max-width:520px}
.canje-video{width:100%;max-width:360px;aspect-ratio:1;object-fit:cover;border-radius:12px;background:#000}

/* ---- revisión precompra ---- */
.horario-revision .inp{min-width:92px;padding-left:6px;padding-right:6px}
.horario-revision .inp.corto{width:56px;min-width:0}
.horario-revision th[scope=row]{text-align:left;white-space:nowrap}
.fuente.elegida{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.dia-revision{border-top:1px solid var(--line);padding:8px 0}
.dia-revision>summary{cursor:pointer;display:flex;gap:10px;align-items:baseline;text-transform:capitalize}
.horas{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.hora-chip,.segmento{position:relative;display:inline-flex}
.hora-chip input,.segmento input{position:absolute;opacity:0;width:1px;height:1px}
.hora-chip span,.segmento span{border:1px solid var(--line);border-radius:999px;padding:5px 12px;cursor:pointer;font-weight:600;font-size:13px;background:var(--surface)}
.hora-chip input:checked+span,.segmento input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.segmento.warn input:checked+span{background:var(--mark-soft);border-color:var(--mark-ink);color:var(--mark-ink)}
.segmento.dan input:checked+span{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}
.hora-chip input:focus-visible+span,.segmento input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.segmentos{display:flex;flex-wrap:wrap;gap:6px}
.items-informe{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.items-informe li{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:1px solid var(--line)}
.datos-revision{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:12px 0 0}
.datos-revision dt{color:var(--muted);font-size:13px}
.datos-revision dd{margin:0}
.pasos-revision{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:14px 0 0;padding:0;counter-reset:paso}
.pasos-revision li{counter-increment:paso;font-size:13px;color:var(--muted);padding:4px 10px;border-radius:999px;background:var(--surface2)}
.pasos-revision li::before{content:counter(paso) ". "}
.pasos-revision li.hecho{color:var(--accent);background:var(--accent-soft)}
.pasos-revision li.hecho::before{content:"✓ "}
.pasos-revision li.actual{color:var(--mark-ink);background:var(--mark-soft);font-weight:600}
.revision-chat .chat-hilo{max-height:420px;min-height:140px;border-top:1px solid var(--line)}
.globo-quien{display:block;font-size:11px;font-weight:700;opacity:.75}
.informe-revision{display:flex;flex-direction:column;gap:8px}
.informe-cab{display:flex;flex-direction:column;gap:2px;border-radius:9px;padding:10px 12px}
.informe-cab.ok{background:var(--accent-soft);color:var(--accent)}
.informe-cab.warn{background:var(--mark-soft);color:var(--mark-ink)}
.informe-cab.bad{background:var(--danger-soft);color:var(--danger)}
.informe-items{list-style:none;margin:0;padding:0}
.informe-items li{display:flex;gap:10px;align-items:baseline;padding:6px 0;border-top:1px solid var(--line)}
.informe-items .pill{flex:none;min-width:72px;text-align:center}
.fila-revision{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);color:inherit;text-decoration:none}
.fila-revision:hover b{text-decoration:underline}
.fila-revision.apagada{opacity:.65}
.fila-revision .art{width:64px;height:48px;border-radius:7px;overflow:hidden;background:var(--surface2);flex:none}
.fila-revision .art img{width:100%;height:100%;object-fit:cover;display:block}
.fila-revision .grow{display:flex;flex-direction:column;min-width:0}
.fila-revision .toca{color:var(--mark-ink);font-weight:600}

/* ---- servicios en el momento justo ---- */
.momento{margin-top:12px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--surface2)}
.momento-cab{display:flex;flex-direction:column;gap:2px;margin-bottom:6px}
.momento-lista{list-style:none;margin:0 0 6px;padding:0}
.momento-lista li{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;padding:6px 0;border-top:1px solid var(--line)}
.momento-lista li:first-child{border-top:0}
.momento-lista li>.sm:last-child{flex-basis:100%}
.relampagos{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.panel.relampago{display:flex;align-items:center;gap:12px;border:2px solid var(--mark-ink);background:var(--mark-soft)}
.relampago-c{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.relampago-et{font:800 11px var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--mark-ink)}
.relampago-t{font-size:17px}
.relampago-reloj{flex:none;font-weight:700;font-variant-numeric:tabular-nums;color:var(--mark-ink);white-space:nowrap}
.relampago-reloj.poco{color:var(--danger)}
.antes-despues{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.ad-par{margin:0;display:flex;flex-direction:column;gap:6px}
.ad-fotos{display:grid;grid-template-columns:1fr 1fr;gap:4px;border-radius:10px;overflow:hidden}
.ad-foto{position:relative;display:block;aspect-ratio:4/3;background:var(--surface2)}
.ad-foto img{width:100%;height:100%;object-fit:cover;display:block}
.ad-et{position:absolute;left:6px;bottom:6px;background:rgba(0,0,0,.65);color:#fff;font:700 11px var(--f);padding:2px 7px;border-radius:999px}
.previas-campo .previa[data-campo]::after{content:attr(data-campo);position:absolute;left:4px;bottom:4px;background:rgba(0,0,0,.65);color:#fff;font:700 10px var(--f);padding:1px 6px;border-radius:999px}
.opiniones-negocio{list-style:none;margin:0;padding:0}
.opiniones-negocio li{display:flex;flex-direction:column;gap:3px;padding:10px 0;border-top:1px solid var(--line)}
.opiniones-negocio li:first-child{border-top:0}
.opinion-respuesta{margin:4px 0 0 14px;padding:8px 12px;border-left:3px solid var(--line);background:var(--bg2,rgba(0,0,0,.03));border-radius:0 8px 8px 0}
.opinion-respuesta b{font-size:13px}
.opinion-respuesta p{margin:2px 0 0}
.ficha-nota{margin:2px 0 4px;font-size:15px}
.ficha-nota a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.ficha-rubros{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.resp-form{margin-top:6px}
.resp-form textarea{min-height:60px}
.origenes{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
@media (max-width:560px){.panel.relampago{flex-direction:column;align-items:flex-start}}
.incluye-anuncio{margin-top:10px;border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.incluye-anuncio>summary{cursor:pointer;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.incluye-lista{list-style:none;margin:8px 0;padding:0}
.incluye-lista li{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.incluye-lista li .grow{display:flex;flex-direction:column;gap:2px;min-width:0}
.incluye-lista li.sin b{color:var(--muted)}
.pasos-negocio{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 14px;padding:0}
.pasos-negocio li{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);padding:5px 12px 5px 5px;border-radius:999px;background:var(--surface2)}
.pasos-negocio .pasos-n{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;background:var(--line);color:var(--text, inherit);font-weight:700;font-size:12px}
.pasos-negocio li.hecho{color:var(--accent);background:var(--accent-soft)}
.pasos-negocio li.hecho .pasos-n{background:var(--accent);color:var(--accent-ink)}
.pasos-negocio li.actual{color:var(--mark-ink);background:var(--mark-soft);font-weight:700}
.pasos-negocio li.actual .pasos-n{background:var(--mark-ink);color:#fff}
.panel.paso-actual{border:2px solid var(--accent)}
.previa-anuncio{display:flex;flex-direction:column;gap:2px;border:1px dashed var(--line);border-radius:10px;padding:10px 12px;background:var(--surface2);max-width:520px}
.panel.pestanas-seccion{display:flex;flex-direction:column;gap:4px;padding-top:10px;padding-bottom:8px}

/* Promoción de lanzamiento: el regalo de un nivel de pago y el precio fundador. Con los colores del tema y los íconos del sitio. */
.regalo{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;padding:12px 14px;margin-bottom:12px}
.regalo .regalo-i{width:36px;height:36px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.regalo .regalo-i .i{width:19px;height:19px}
.regalo .regalo-c{flex:1;min-width:0}
.regalo .regalo-t{display:block;font-size:15px;margin-bottom:2px}
.regalo p{margin:4px 0 0}
.regalo form{margin-top:10px}
.precio-fundador{display:inline-block;font-size:12px;font-weight:700;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:1px 8px}
.i-candado{width:14px;height:14px;vertical-align:-2px}
.kpi .i-candado{width:22px;height:22px;color:var(--muted)}
.estado-nivel{margin:6px 0 12px;font-size:14px}

/* ===== Mi publicidad: la tarjeta de cada anuncio, por bloques ===== */
.anuncio-admin-img{display:grid;place-items:center}
.anuncio-sin-foto{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--muted);text-decoration:none;width:100%;height:100%;justify-content:center}
.anuncio-sin-foto .i{width:26px;height:26px}
.anuncio-sin-foto:hover{color:var(--accent)}
.anuncio-bloque{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.anuncio-bloque>h3.sm{margin:0 0 6px}
.pill>.i{width:12px;height:12px;vertical-align:-1px;margin-right:2px}
/* Los íconos del sitio en lugar de emojis: alineados con el texto que acompañan. */
:is(b,a,span,summary,h1,h2,p)>.i{vertical-align:-3px}
.i-titulo{width:.9em;height:.9em;vertical-align:-.1em!important;color:var(--accent)}
.i-titulo.peligro{color:var(--danger)}
.franja-robado b>.i{margin-right:6px}
.pagina-error-codigo .i{width:56px;height:56px}
.relampago-et>.i{width:13px;height:13px;vertical-align:-2px}
.embed-acciones{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 2px}
.embed-acciones .btn .i{width:15px;height:15px}
.nivel.bloqueado{opacity:.6;cursor:not-allowed}
.nivel.bloqueado input{cursor:not-allowed}
.subir-video .h{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.anuncio-admin-img img{object-fit:contain}
.sellos-marca{margin-top:6px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sello-marca{margin-left:4px}
/* ===== Datos del negocio: secciones claras y campos alineados ===== */
.form-seccion{grid-column:1/-1;font:700 13px var(--f);color:var(--ink);margin:10px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.form-seccion:first-child{margin-top:0;padding-top:0;border-top:0}
.plegable label.check-linea{flex-direction:row;align-items:center;gap:8px;font-weight:400;cursor:pointer;justify-content:flex-start}
.check-linea input{width:auto;margin:0}
.contacto-fila{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:700px){.contacto-fila{grid-template-columns:minmax(0,1fr)}}
.form-acciones{display:flex;justify-content:flex-end;padding-top:12px;border-top:1px solid var(--line);margin-top:4px}
.datos-negocio .inp::placeholder{color:var(--muted);opacity:.7}
.sello-pedir{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-top:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}
.sello-pedir .fld{min-width:220px;flex:0 1 260px}
.sello-ayuda{flex-basis:100%}
.sellos-lista .sello-nombre{min-width:110px}
.sellos-lista li{align-items:center}
.incluye-lista.sellos-lista li .grow{display:flex;flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap}
.incluye-lista.sellos-lista li .grow>.pill{width:auto;flex:none}

/* Ficha técnica y equipamiento del auto */
.equipamiento-elegir{display:flex;flex-direction:column;gap:6px}
.equip-grupo{border:1px solid var(--line);border-radius:8px;padding:8px 12px}
.equip-grupo summary{cursor:pointer}
.equip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 16px;margin-top:8px}
.equip-ver{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px 20px}
.equip-ver h3{font-size:14px;margin:0 0 4px}
.equip-ver ul{list-style:none;margin:0;padding:0}
.equip-ver li{display:flex;gap:6px;align-items:flex-start;padding:2px 0}
.equip-ver li svg{flex:none;color:var(--ok,#0B6B4F);margin-top:3px}
.equip-grid label.check-linea{display:flex;flex-direction:row;align-items:center;gap:8px;font-weight:400;cursor:pointer}

/* Edición en el lugar: un cuadro con lápiz que se convierte en su campo */
.spec.editable{padding:0;position:relative}
.spec.editable .spec-ver{all:unset;box-sizing:border-box;display:block;width:100%;height:100%;padding:8px 30px 8px 8px;border-radius:7px;cursor:pointer}
.spec.editable .spec-ver:hover,.spec.editable .spec-ver:focus-visible{background:var(--accent-soft);outline:2px solid var(--accent);outline-offset:-2px}
.spec.editable .spec-ver b{display:block;font-weight:600}
.spec.editable .spec-ver span{font-size:12px;color:var(--muted)}
.spec .lapiz{position:absolute;top:8px;right:8px;color:var(--accent);opacity:.75}
@media (hover:hover){.spec .lapiz{opacity:0}.spec.editable:hover .lapiz,.spec.editable .spec-ver:focus-visible .lapiz{opacity:.9}}
.spec.editable.editando{background:var(--surface);outline:2px solid var(--accent);padding:8px}
.spec.ancho{grid-column:1/-1}
.spec-editor{display:flex;flex-direction:column;gap:4px}
.spec-etiqueta{font-size:12px;color:var(--muted);font-weight:600}
.spec-pista{font-size:11px}
.spec-editor.con-error .inp{border-color:var(--dan,#B42318)}
.spec-editor[aria-busy="true"]{opacity:.6}
.editor-grupo{margin-top:12px;padding:12px;border:2px solid var(--accent);border-radius:10px;background:var(--surface)}
.editor-grupo h3{margin:0 0 8px}
.equip-cabecera{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 0 6px}
.equip-cabecera h3{margin:0}
button.lnk{background:none;border:0;padding:0;font:inherit;cursor:pointer;text-decoration:underline}
.confirmar-botones{flex-wrap:wrap}
/* display de arriba le gana a [hidden]: se repite aquí para que el atributo siga ocultando */
.spec.editable .spec-ver[hidden],.spec-editor[hidden],.editor-grupo[hidden]{display:none}
.editor-grupo[data-identidad]{margin:4px 0 12px}

/* Ventanita para editar un dato: al centro en el computador, desde abajo en el celular */
dialog.hoja{border:0;border-radius:14px;padding:18px 20px;width:calc(100% - 32px);max-width:440px;max-height:85vh;overflow:auto;background:var(--surface);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.25)}
dialog.hoja.ancha{max-width:760px}
dialog.hoja::backdrop{background:rgba(10,24,18,.45)}
dialog.hoja h3{margin:0 0 10px;font-size:17px}
dialog.hoja h3 label{font:inherit;color:inherit}
dialog.hoja form{display:flex;flex-direction:column;gap:6px}
dialog.hoja .e:empty{display:none}
dialog.hoja form.con-error .inp{border-color:var(--dan,#B42318)}
.hoja-botones{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;flex-wrap:wrap}
@media (max-width:640px){
  dialog.hoja,dialog.hoja.ancha{width:100%;max-width:100%;margin:auto 0 0;border-radius:16px 16px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom))}
  .hoja-botones .btn{flex:1}
}

dialog.hoja .e{color:var(--dan,#B42318);font-size:13px}

/* Revisión del catálogo de marcas y modelos */
.catalogo-lista{list-style:none;margin:0;padding:0}
.catalogo-lista>li{display:flex;flex-direction:column;gap:8px;padding:12px 0;border-top:1px solid var(--line)}
.catalogo-lista>li:first-child{border-top:0}
.catalogo-dato{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.catalogo-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px}
.catalogo-form label{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--muted);min-width:180px}
.en-redes{margin-top:10px;padding:10px 12px;border-radius:8px;background:var(--accent-soft);display:flex;flex-direction:column;gap:2px}

/* Redes sociales: la cola de publicaciones */
.red-pub-cuerpo{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px}
.red-pub-imagen{display:flex;flex-direction:column;gap:6px}
.red-pub-imagen canvas{width:100%;height:auto;border-radius:8px;background:var(--surface2)}
.red-pub-datos h2{margin:0 0 2px}
.red-destino{border-top:1px solid var(--line);padding:8px 0}
.red-destino summary{cursor:pointer}
.red-destino textarea{margin-top:6px;font-size:13px}
@media (max-width:640px){.red-pub-cuerpo{grid-template-columns:1fr}.red-pub-imagen{max-width:260px}}
.red-resumen{margin:0 0 12px;padding:10px 14px;border-radius:10px;background:var(--accent-soft)}
.red-pasos{margin:10px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:12px}
.red-pasos>li>b{display:block;margin-bottom:6px}
.red-filas{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.red-fila{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;border:1px solid var(--line);border-radius:8px}
.red-nombre{min-width:84px}
.red-enlace{display:flex;gap:6px;flex:1;min-width:240px}
.red-enlace .inp{flex:1}
.red-ver-texto{margin-top:10px}
.red-ver-texto pre{white-space:pre-wrap;font:inherit;font-size:13px;background:var(--surface2);padding:10px;border-radius:8px}



/* ===== marca 2026-10: el letrero de ruta con la flecha (zip 196) =====
   El letrero toma el color del tema (--sign); la T y su borde, blancos. El nombre va en minúscula, como en el manual de marca. */
.logo{gap:9px;font:800 24px/1 var(--fc);letter-spacing:-.3px}
.logo .wm{text-transform:lowercase}
.logo .wm b{font-weight:inherit;color:inherit}
.logo-letrero{width:34px;height:34px;flex:none;display:block}
.logo-letrero .f{fill:var(--sign)} .logo-letrero .l{fill:#fff}

/* ===== Buscar: el mismo buscador del inicio, y lo secundario en una línea debajo (zip 196) ===== */
.barra-filtros .pb-comprar{margin-top:0;box-shadow:0 6px 18px rgba(0,0,0,.12);color:var(--ink)}
.barra-filtros .pb-comprar+.fb-fila{background:transparent;padding:10px 0 0}
.fb-check{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font-weight:600;font-size:14px;white-space:nowrap;cursor:pointer}
.fb-check input{accent-color:var(--accent);margin:0}
.frase-movil{display:none}
@media (max-width:820px){
  .frase-movil{display:flex;margin:0 0 8px}
  .frase-movil .portada-q{min-width:0}
}
@media (max-width:760px){
  /* En el celular la barra no queda fija: con los cuatro campos taparía los resultados. */
  .barra-filtros{position:static}
  .barra-filtros .pb-comprar{grid-template-columns:repeat(2,minmax(0,1fr));padding:4px}
  .barra-filtros .pb-comprar .pb-campo{border-right:0;border-bottom:1px solid var(--line)}
  .barra-filtros .pb-comprar .pb-campo:nth-child(odd){border-right:1px solid var(--line)}
  .barra-filtros .pb-comprar .pb-campo:nth-child(n+3){border-bottom:0}
  .barra-filtros .pb-comprar .pb-boton{display:none}
}
