/* SHOP-V · panel administrativo. Los colores de marca llegan de /theme.css (según el nicho). */
:root{
  --brand:#15803d;--brand-2:#22c55e;--brand-d:#14532d;--brand-l:#dcfce7;--brand-ll:#f0fdf4;
  --accent:#e11d48;--ink:#0f172a;--ink-2:#334155;--muted:#64748b;--line:#e5e9f0;--bg:#f3f6fa;--card:#fff;
  --warn:#f59e0b;--warn-l:#fef3c7;--err:#dc2626;--err-l:#fee2e2;--blue:#2563eb;--blue-l:#dbeafe;--violet:#7c3aed;--violet-l:#ede9fe;
  --side:#0b1324;--side-2:#121d36;--r:16px;--r-s:10px;
  --sh:0 1px 2px rgba(15,23,42,.05),0 4px 16px rgba(15,23,42,.06);--sh-l:0 10px 40px rgba(15,23,42,.14);
  --font:"Inter","Segoe UI",system-ui,-apple-system,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--brand)}
img{max-width:100%}
code,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.84em}
code{background:#f1f5f9;padding:1px 6px;border-radius:6px}
h1,h2,h3,h4{line-height:1.2;letter-spacing:-.01em}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.gs1{stop-color:var(--brand-2)}.gs2{stop-color:var(--brand)}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.ic .fill,.ic.fill{fill:currentColor;stroke:none}
.ic.sm{width:16px;height:16px}.ic.lg{width:26px;height:26px}
.muted{color:var(--muted)}.small{font-size:.85em}.nowrap{white-space:nowrap}.wrap{word-break:break-all;max-width:280px}
.right{text-align:right}.center{text-align:center}.hide-m{}
.banner-maint{background:repeating-linear-gradient(45deg,#fbbf24,#fbbf24 12px,#f59e0b 12px,#f59e0b 24px);color:#111;text-align:center;padding:7px;font-weight:700;position:relative;z-index:60}

/* ===== Marca del cliente ===== */
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:800;color:inherit;text-decoration:none;min-width:0}
.brand-logo{max-height:42px;max-width:180px;width:auto;object-fit:contain;display:block}
.brand-ini{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;font-size:1.15rem;box-shadow:0 6px 14px -6px var(--brand)}
.brand-name{font-size:1.12rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.brand.xl .brand-logo{max-height:84px;max-width:280px}.brand.xl .brand-ini{width:64px;height:64px;border-radius:20px;font-size:2rem}.brand.xl .brand-name{font-size:2rem;max-width:none;white-space:normal}
.side .brand-logo{background:#fff;padding:6px 10px;border-radius:12px;max-height:48px}
/* Crédito del desarrollador: cruz que gira + punto rojo que rebota */
.credit{display:inline-flex;align-items:center;gap:8px;font-size:.76rem;color:inherit;opacity:.75;text-decoration:none}
.credit:hover{opacity:1}
.credit b{letter-spacing:.3px}
.credit-mark{position:relative;width:16px;height:16px;display:inline-block}
.credit-cross{width:16px;height:16px;fill:currentColor;animation:spin 7s linear infinite}
.credit-dot{position:absolute;right:-3px;top:-3px;width:6px;height:6px;border-radius:50%;background:#e11d48;animation:bounce 1.4s ease-in-out infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bounce{0%,100%{transform:translateY(0)}45%{transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.credit-cross,.credit-dot{animation:none}}

/* ===== Estructura del panel ===== */
.shell{display:grid;grid-template-columns:268px 1fr;min-height:100vh}
.side{background:linear-gradient(180deg,var(--side) 0%,var(--side-2) 100%);color:#cbd5e1;padding:18px 14px 24px;position:sticky;top:0;height:100vh;overflow-y:auto;z-index:50;scrollbar-width:thin;scrollbar-color:#24314f transparent}
.side-head{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 14px}
.side .brand{color:#fff}
.side-company{margin:0 8px 14px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);font-size:.85rem;color:#e2e8f0;display:flex;gap:10px;align-items:center}
.side-company .dot{width:8px;height:8px;border-radius:50%;background:var(--brand-2);box-shadow:0 0 0 4px rgba(34,197,94,.15)}
.side nav a{display:flex;align-items:center;gap:12px;color:#c3cde0;text-decoration:none;padding:9px 12px;border-radius:11px;margin:2px 0;font-weight:500;font-size:.94rem;transition:background .15s,color .15s,transform .15s}
.side nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.side nav a.on{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;box-shadow:0 6px 18px -6px var(--brand)}
.side nav a .ic{opacity:.9}
.nav-h{font-size:.68rem;text-transform:uppercase;letter-spacing:1.4px;color:#64748b;margin:18px 12px 6px;font-weight:700}
.side-foot{margin:22px 8px 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);font-size:.78rem;color:#64748b}
.side-close{display:none;background:none;border:0;color:#cbd5e1;padding:6px;border-radius:8px;cursor:pointer}
.main{min-width:0;display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;padding:12px 28px;background:rgba(255,255,255,.82);backdrop-filter:saturate(1.6) blur(12px);-webkit-backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--line)}
.hamb{display:none;background:#fff;border:1px solid var(--line);border-radius:12px;width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer;color:var(--ink)}
.top-title{flex:1;min-width:0}
.top-title h1{margin:0;font-size:1.28rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crumb{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.8px;font-weight:600}
.top-user{display:flex;gap:10px;align-items:center}
.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;font-weight:800;font-size:.9rem;box-shadow:0 4px 12px -4px var(--brand)}
.user-meta{line-height:1.15;text-align:right}.user-meta b{display:block;font-size:.9rem}.user-meta span{font-size:.75rem;color:var(--muted)}
.content{padding:24px 28px 40px;max-width:1400px;width:100%}
.scrim{display:none}

/* ===== Tarjetas, KPIs y grillas ===== */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px;box-shadow:var(--sh)}
.card h3{margin:0 0 12px;font-size:1.05rem;display:flex;align-items:center;gap:8px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.card-head h3{margin:0}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:20px}
.kpi{position:relative;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--sh);display:flex;gap:14px;align-items:center}
.kpi::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:currentColor;opacity:.06}
.kpi-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--brand-l);color:var(--brand)}
.kpi.blue{color:var(--blue)}.kpi.blue .kpi-ic{background:var(--blue-l);color:var(--blue)}
.kpi.warn{color:#b45309}.kpi.warn .kpi-ic{background:var(--warn-l);color:#b45309}
.kpi.violet{color:var(--violet)}.kpi.violet .kpi-ic{background:var(--violet-l);color:var(--violet)}
.kpi.good{color:var(--brand)}
.kpi-l{color:var(--muted);font-size:.74rem;text-transform:uppercase;letter-spacing:.7px;font-weight:700}
.kpi-v{font-size:1.25rem;font-weight:800;color:var(--ink);margin-top:2px}
.hero-card{background:linear-gradient(120deg,var(--brand-d),var(--brand) 55%,var(--brand-2));color:#fff;border:0;position:relative;overflow:hidden}
.hero-card::before{content:"";position:absolute;inset:auto -60px -80px auto;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.08)}
.hero-card h2{margin:0 0 6px;font-size:1.5rem}.hero-card p{margin:0;opacity:.9}
.hero-card .btn{background:#fff;color:var(--brand-d)}
.progress{height:10px;background:rgba(255,255,255,.25);border-radius:99px;overflow:hidden;margin:14px 0 6px}
.progress > i{display:block;height:100%;background:#fff;border-radius:99px}
.progress.light{background:#e2e8f0}.progress.light > i{background:linear-gradient(90deg,var(--brand),var(--brand-2))}
.w0{width:0}.w10{width:10%}.w20{width:20%}.w25{width:25%}.w30{width:30%}.w40{width:40%}.w50{width:50%}.w60{width:60%}.w70{width:70%}.w75{width:75%}.w80{width:80%}.w90{width:90%}.w100{width:100%}

/* ===== Formularios ===== */
label{display:block;font-weight:600;font-size:.86rem;margin-bottom:14px;color:var(--ink-2)}
input,select,textarea{display:block;width:100%;margin-top:6px;padding:11px 13px;border:1.5px solid var(--line);border-radius:12px;font:inherit;font-weight:400;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-l)}
input[disabled],textarea[disabled]{background:#f8fafc;color:var(--muted)}
input[type=checkbox],input[type=radio]{display:inline-block;width:18px;height:18px;margin:0 8px 0 0;accent-color:var(--brand);vertical-align:-3px}
input[type=file]{padding:9px;border-style:dashed;background:var(--brand-ll)}
.chk{font-weight:500;display:flex;align-items:center;margin-bottom:8px;color:var(--ink)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}
.form-grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.span2{grid-column:1/-1}
.stack{display:flex;flex-direction:column;gap:4px;margin:8px 0}
.chips{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:12px}
.inline{display:inline}.inline input{display:inline-block;width:auto;margin:0 6px 0 0}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.toolbar input,.toolbar select{width:auto;flex:1 1 220px;max-width:380px;margin:0}
.hint{font-size:.8rem;color:var(--muted);font-weight:400;display:block;margin-top:4px}
.section-t{grid-column:1/-1;font-size:.78rem;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:800;margin:6px 0 12px;padding-bottom:8px;border-bottom:1px dashed var(--line)}

/* ===== Botones ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;border:0;border-radius:12px;padding:11px 18px;font:inherit;font-weight:700;cursor:pointer;text-decoration:none;box-shadow:0 6px 16px -8px var(--brand);transition:transform .12s,box-shadow .12s,filter .12s;white-space:nowrap}
.btn:hover{filter:brightness(1.05);transform:translateY(-1px);box-shadow:0 10px 22px -10px var(--brand)}
.btn:active{transform:translateY(0)}
.btn.ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line);box-shadow:none}
.btn.ghost:hover{background:#f8fafc;border-color:#cbd5e1}
.btn.danger{background:linear-gradient(135deg,#f43f5e,#dc2626);box-shadow:0 6px 16px -8px #dc2626}
.btn.sm{padding:7px 12px;font-size:.84rem;border-radius:10px}
.btn.full{width:100%}
.btn.icon{padding:9px}
.top .btn.ghost{padding:9px 12px}

/* ===== Tablas ===== */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r);border:1px solid var(--line);background:#fff;box-shadow:var(--sh);margin-bottom:18px}
.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem}
.tbl th{background:linear-gradient(180deg,var(--brand),var(--brand-d));color:#fff;text-align:left;font-size:.74rem;text-transform:uppercase;letter-spacing:.6px;padding:12px 14px;white-space:nowrap;font-weight:700}
.tbl td{padding:11px 14px;border-top:1px solid var(--line);vertical-align:middle}
.tbl tbody tr:hover td{background:var(--brand-ll)}
.tbl tr:nth-child(even) td{background:#fafbfd}
.tbl tbody tr:nth-child(even):hover td{background:var(--brand-ll)}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.matrix td.c{text-align:center;color:var(--brand);font-size:1.1rem}.matrix th.rot{font-size:.66rem}
.thumb{width:44px;height:44px;border-radius:10px;object-fit:cover;background:#f1f5f9;border:1px solid var(--line);display:block}
.empty{padding:36px;text-align:center;color:var(--muted)}
.empty .ic{width:40px;height:40px;color:#cbd5e1;margin-bottom:6px}
details.drop summary{list-style:none;cursor:pointer}details.drop summary::-webkit-details-marker{display:none}
details.drop[open]{background:#f8fafc;padding:10px;border-radius:12px;border:1px solid var(--line)}

/* ===== Etiquetas, avisos ===== */
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;font-size:.74rem;font-weight:700;background:#f1f5f9;color:var(--muted);white-space:nowrap}
.pill.green{background:var(--brand-l);color:var(--brand-d)}.pill.gray{background:#e2e8f0;color:#475569}
.pill.blue{background:var(--blue-l);color:var(--blue)}.pill.warn{background:var(--warn-l);color:#92400e}.pill.red{background:var(--err-l);color:var(--err)}
.pill.violet{background:var(--violet-l);color:var(--violet)}
.flash{display:flex;gap:10px;align-items:flex-start;padding:13px 16px;border-radius:14px;margin-bottom:18px;border:1px solid;font-weight:500}
.flash .ic{margin-top:1px}
.flash.ok{background:var(--brand-ll);border-color:#86efac;color:#14532d}.flash.error{background:#fff1f2;border-color:#fda4af;color:#9f1239}.flash.warn{background:#fffbeb;border-color:#fcd34d;color:#78350f}
.checklist{list-style:none;padding:0;margin:0}
.checklist li{display:flex;gap:12px;align-items:center;padding:11px 0;border-bottom:1px dashed var(--line)}
.checklist li:last-child{border-bottom:0}
.checklist .st{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--warn-l);color:#b45309;flex:0 0 auto}
.checklist li.done .st{background:var(--brand-l);color:var(--brand)}
.qr{text-align:center}.qr img{border:1px solid var(--line);border-radius:16px;padding:8px;background:#fff}

/* ===== Módulos y nichos ===== */
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.mod{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:8px}
.mod.on{border-color:#86efac;background:linear-gradient(180deg,#fff,var(--brand-ll))}
.mod-top{display:flex;justify-content:space-between;align-items:center}
.mod-code{font-weight:800;color:var(--muted);font-size:.8rem}
.mod h4{margin:0;font-size:1rem}
.niche{position:relative;border:2px solid var(--line);transition:border-color .15s,transform .15s}
.niche:hover{transform:translateY(-2px)}
.niche.cur{border-color:var(--brand)}
.niche-sw{display:flex;gap:6px;margin:6px 0 10px}
.sw{width:26px;height:26px;border-radius:8px;border:1px solid rgba(0,0,0,.08)}
.sw.n1a{background:#c2416b}.sw.n1b{background:#f4b6c2}.sw.n2a{background:#111827}.sw.n2b{background:#e5e7eb}
.sw.n3a{background:#15803d}.sw.n3b{background:#fde68a}.sw.n4a{background:#1d4ed8}.sw.n4b{background:#dbeafe}

/* ===== Login ===== */
.auth{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;background:#fff}
.auth-brand{position:relative;overflow:hidden;color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(1200px 600px at -10% -10%,var(--brand-2) 0%,transparent 55%),radial-gradient(900px 500px at 110% 110%,#0ea5e9 0%,transparent 50%),linear-gradient(140deg,var(--brand-d),var(--brand) 60%,#0f766e)}
.auth-brand::before,.auth-brand::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.07)}
.auth-brand::before{width:420px;height:420px;right:-120px;top:-120px}
.auth-brand::after{width:260px;height:260px;left:-80px;bottom:-60px}
.auth-brand .brand{color:#fff;position:relative;z-index:1}
.auth-brand .brand-logo{background:#fff;padding:10px 16px;border-radius:18px}
.auth-brand .brand-ini{background:rgba(255,255,255,.18);box-shadow:none;border:1px solid rgba(255,255,255,.3)}
.auth-pitch{position:relative;z-index:1;max-width:460px}
.auth-pitch h2{font-size:2.3rem;margin:0 0 12px;line-height:1.1}
.auth-pitch p{opacity:.9;font-size:1.05rem;margin:0 0 26px}
.feats{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.feats li{display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);padding:12px 14px;border-radius:14px;backdrop-filter:blur(4px)}
.feats .ic{width:22px;height:22px}
.auth-legal{position:relative;z-index:1;font-size:.8rem;opacity:.75}
.auth-form{display:flex;align-items:center;justify-content:center;padding:40px 24px;background:linear-gradient(180deg,#fff,#f8fafc)}
.auth-card{width:100%;max-width:410px}
.auth-card h1{font-size:1.9rem;margin:0 0 6px}
.auth-card .sub{color:var(--muted);margin:0 0 26px}
.field{position:relative}
.field .ic{position:absolute;left:14px;top:41px;color:#94a3b8}
.field input{padding-left:44px;height:50px}
.auth-card .btn{height:52px;font-size:1rem;margin-top:6px}
.auth-mobile-logo{display:none;margin-bottom:22px}
.secure-note{display:flex;gap:8px;align-items:center;justify-content:center;color:var(--muted);font-size:.8rem;margin-top:22px}
.center-card{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(800px 400px at 50% -10%,var(--brand-l),transparent),var(--bg)}
.narrow{width:100%;max-width:440px}

/* ===== Responsive ===== */
@media (max-width:1100px){
  .shell{grid-template-columns:1fr}
  .side{position:fixed;left:0;top:0;bottom:0;width:286px;max-width:86vw;transform:translateX(-105%);transition:transform .25s cubic-bezier(.4,0,.2,1);box-shadow:var(--sh-l)}
  .nav-open .side{transform:translateX(0)}
  .side-close{display:inline-flex}
  .hamb{display:inline-flex}
  .scrim{display:block;position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s;z-index:45}
  .nav-open .scrim{opacity:1;pointer-events:auto}
  .nav-open{overflow:hidden}
}
@media (max-width:860px){
  .auth{grid-template-columns:1fr}
  .auth-brand{display:none}
  .auth-mobile-logo{display:block}
  .auth-form{min-height:100vh;align-items:flex-start;padding-top:12vh;background:radial-gradient(700px 360px at 50% -5%,var(--brand-l),transparent),#fff}
}
@media (max-width:720px){
  .top{padding:10px 14px}
  .content{padding:16px 14px 32px}
  .form-grid,.form-grid.g3{grid-template-columns:1fr}
  .user-meta,.hide-m{display:none}
  .top-title h1{font-size:1.08rem}
  .card{padding:16px}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:12px;flex-direction:column;align-items:flex-start;gap:8px}
  .kpi-v{font-size:1.02rem}
  .toolbar input,.toolbar select{max-width:none}
  .tbl{font-size:.86rem}
}
@media print{.side,.top,.btn,.scrim{display:none!important}.shell{display:block}.content{padding:0}}
.logo-prev{min-height:110px;display:flex;align-items:center;justify-content:center;border:1.5px dashed var(--line);border-radius:14px;margin-bottom:14px;padding:12px;background:repeating-conic-gradient(#f8fafc 0 25%,#fff 0 50%) 50%/20px 20px}
.logo-prev img{max-height:100px;max-width:100%}
input[type=color]{height:48px;padding:4px;cursor:pointer}
.img-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;margin-bottom:14px}
.img-cell{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#f8fafc;aspect-ratio:1}
.img-cell img{width:100%;height:100%;object-fit:cover}
.img-cell form{position:absolute;top:6px;right:6px}.img-cell .pill{position:absolute;left:6px;bottom:6px}
.inline-form{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.inline-form input:not([type=checkbox]){width:120px;margin:0;padding:7px 10px}
.inline-form .chk{margin:0}
.tbl-title{display:flex;gap:8px;align-items:center;font-size:1.02rem;margin:22px 0 10px}
.tbl tfoot td{background:#f1f5f9;border-top:2px solid var(--line)}
.blind-item{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--line)}
/* ---- tablero ---- */
.vbars{display:grid;grid-template-columns:repeat(14,1fr);gap:6px;align-items:end;height:180px;padding-top:8px}
.vbar{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.vbar i{display:block;width:100%;max-width:28px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--brand-2,#22c55e),var(--brand));min-height:3px}
.vbar span{font-size:.65rem;color:var(--muted);white-space:nowrap}
.hbars{display:grid;gap:12px}.hbar-t{display:flex;justify-content:space-between;gap:10px;font-size:.88rem}.hbar-t span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar-b{height:10px;border-radius:99px;background:var(--brand-l);overflow:hidden;margin:4px 0 2px}.hbar-b i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),var(--blue,#2563eb))}
.hbar small{color:var(--muted);font-size:.72rem}
.vbar i.h0{height:2%}.hbar-b i.p0{width:1%}
.vbar i.h5{height:5%}.hbar-b i.p5{width:5%}
.vbar i.h10{height:10%}.hbar-b i.p10{width:10%}
.vbar i.h15{height:15%}.hbar-b i.p15{width:15%}
.vbar i.h20{height:20%}.hbar-b i.p20{width:20%}
.vbar i.h25{height:25%}.hbar-b i.p25{width:25%}
.vbar i.h30{height:30%}.hbar-b i.p30{width:30%}
.vbar i.h35{height:35%}.hbar-b i.p35{width:35%}
.vbar i.h40{height:40%}.hbar-b i.p40{width:40%}
.vbar i.h45{height:45%}.hbar-b i.p45{width:45%}
.vbar i.h50{height:50%}.hbar-b i.p50{width:50%}
.vbar i.h55{height:55%}.hbar-b i.p55{width:55%}
.vbar i.h60{height:60%}.hbar-b i.p60{width:60%}
.vbar i.h65{height:65%}.hbar-b i.p65{width:65%}
.vbar i.h70{height:70%}.hbar-b i.p70{width:70%}
.vbar i.h75{height:75%}.hbar-b i.p75{width:75%}
.vbar i.h80{height:80%}.hbar-b i.p80{width:80%}
.vbar i.h85{height:85%}.hbar-b i.p85{width:85%}
.vbar i.h90{height:90%}.hbar-b i.p90{width:90%}
.vbar i.h95{height:95%}.hbar-b i.p95{width:95%}
.vbar i.h100{height:100%}.hbar-b i.p100{width:100%}
/* ---- conversaciones ---- */
.chat{display:flex;flex-direction:column;gap:8px;max-height:65vh;overflow-y:auto;padding:8px;background:#f0fdf4;border-radius:14px}
.bubble{max-width:78%;padding:9px 12px;border-radius:14px;box-shadow:0 1px 2px rgba(15,23,42,.08);white-space:pre-wrap;word-break:break-word}
.bubble.in{align-self:flex-start;background:#fff;border-top-left-radius:4px}
.bubble.out{align-self:flex-end;background:#dcfce7;border-top-right-radius:4px}
.bubble-m{font-size:.7rem;color:var(--muted);margin-top:4px;text-align:right}
.sec-h{display:flex;align-items:center;gap:8px;margin:22px 0 10px;font-size:1rem;color:var(--ink)}
.icards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:8px}
.icard{display:flex;flex-direction:column;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--sh);color:inherit;text-decoration:none;transition:transform .12s,border-color .12s}
.icard:hover{transform:translateY(-2px);border-color:var(--brand)}
.icard-h{display:flex;align-items:center;gap:10px}.icard-h b{flex:1}
.icard-ic{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--brand-l);color:var(--brand)}
.icard p{margin:0}.icard-go{margin-top:auto;font-weight:700;color:var(--brand);font-size:.85rem}
.thumb-b{display:block;width:180px;max-width:40vw;height:auto;border-radius:10px;border:1px solid var(--line);background:#f8fafc}.anchor{display:block;position:relative;top:-80px;visibility:hidden}