/* Portal de clientes — basado en el bosquejo v2 aprobado */
:root{--navy:#0B1628;--navy2:#13243d;--navy3:#1c3354;--gold:#B08D57;--gold2:#c9a86f;--goldl:#f3ead9;--cream:#F7F4EE;--line:#e9e3d7;--txt:#1F1F1F;--mut:#5B6475;--mut2:#8a92a1;--ok:#1f8a5b;--okl:#e3f4ec;--warn:#b7791f;--warnl:#fdf1dc;--bad:#c2410c;--badl:#fde8df;--info:#2f5d9e;--infol:#e6eef9}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,Arial,sans-serif;color:var(--txt);background:var(--cream);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
.serif{font-family:"Cormorant Garamond",Georgia,serif}
svg.i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
svg.i.sm{width:15px;height:15px}svg.i.lg{width:22px;height:22px}
/* app layout */
.app{display:grid;grid-template-columns:264px 1fr;min-height:100vh}
.side{background:linear-gradient(180deg,#0B1628 0%,#0f1e36 60%,#0B1628 100%);color:#c9d1dd;padding:26px 18px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.side:after{content:"";position:absolute;right:-120px;bottom:-120px;width:300px;height:300px;border:1px solid rgba(176,141,87,.18);border-radius:50%;box-shadow:0 0 0 40px rgba(176,141,87,.04),0 0 0 80px rgba(176,141,87,.03)}
.side .logo{padding:4px 8px 22px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:18px}
.side .logo img{width:210px;display:block}
.side .area{font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold2);font-weight:700;margin-top:12px}
.side .sec{font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:#6f7d92;font-weight:700;padding:14px 12px 8px}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:#c9d1dd;text-decoration:none;font-weight:500;margin-bottom:2px;position:relative}
.nav a.act{background:linear-gradient(90deg,rgba(176,141,87,.22),rgba(176,141,87,.06));color:#fff}
.nav a.act:before{content:"";position:absolute;left:-18px;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--gold)}
.nav a.act svg{color:var(--gold2)}
.nav .cnt{margin-left:auto;background:var(--gold);color:var(--navy);font-size:11px;font-weight:800;border-radius:20px;padding:1px 8px}
.side .help{margin-top:auto;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px;position:relative;z-index:1}
.side .help b{color:#fff;display:block;margin-bottom:4px}.side .help p{font-size:12.5px;color:#9aa6b8;margin-bottom:12px}
.top{height:72px;background:rgba(255,255,255,.85);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 34px;gap:18px;position:relative}
.search{flex:1;max-width:460px;display:flex;align-items:center;gap:10px;background:#f6f3ec;border:1px solid var(--line);border-radius:12px;padding:10px 14px;color:var(--mut2)}
.search kbd{margin-left:auto;font-family:Inter;font-size:11px;background:#fff;border:1px solid var(--line);border-radius:6px;padding:1px 6px;color:var(--mut)}
.top .r{margin-left:auto;display:flex;align-items:center;gap:14px}
.ib{width:42px;height:42px;border-radius:12px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy);position:relative}
.ib .b{position:absolute;top:-5px;right:-5px;background:var(--bad);color:#fff;font-size:10.5px;font-weight:800;border-radius:20px;min-width:19px;height:19px;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
.me{display:flex;align-items:center;gap:10px;padding-left:14px;border-left:1px solid var(--line)}
.me b{display:block;font-size:13.5px}.me small{color:var(--mut);font-size:12px}
.av{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--navy3),var(--navy));color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:13.5px;flex:none}
.av.g{background:linear-gradient(135deg,var(--gold2),var(--gold));color:var(--navy)}
.av.s{width:32px;height:32px;border-radius:10px;font-size:12px}
.av.r{border-radius:50%}
.av.c1{background:linear-gradient(135deg,#3b5b8a,#22385c)}.av.c2{background:linear-gradient(135deg,#7a6a9e,#4d3f75)}.av.c3{background:linear-gradient(135deg,#3f8a73,#1f5b4a)}.av.c4{background:linear-gradient(135deg,#a0714a,#6e4a2c)}.av.c5{background:linear-gradient(135deg,#5b6475,#3a4150)}
.main{padding:30px 34px 20px;position:relative}
.ph{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}
.ph h1{font-family:"Cormorant Garamond",serif;font-size:38px;line-height:1.1;color:var(--navy);font-weight:700}
.ph p{color:var(--mut);margin-top:6px;font-size:14.5px}
.crumb{font-size:12px;color:var(--mut2);margin-bottom:6px;display:flex;gap:6px;align-items:center}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 24px;box-shadow:0 1px 2px rgba(11,22,40,.04),0 8px 24px rgba(11,22,40,.05)}
.ch{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.ch h3{font-size:16px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:10px}
.ch h3 .ic{width:34px;height:34px;border-radius:10px;background:var(--goldl);color:var(--gold);display:flex;align-items:center;justify-content:center}
.link{color:var(--gold);font-weight:600;font-size:13px;text-decoration:none;display:flex;align-items:center;gap:4px}
.btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#1c3354,#0B1628);color:#fff;border:none;border-radius:11px;padding:11px 18px;font-weight:600;font-size:13.5px;text-decoration:none;box-shadow:0 6px 16px rgba(11,22,40,.18);white-space:nowrap;font-family:Inter}
.btn.gold{background:linear-gradient(135deg,#c9a86f,#a7834c);color:#fff;box-shadow:0 6px 16px rgba(176,141,87,.3)}
.btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--line);box-shadow:none}
.btn.wa{background:linear-gradient(135deg,#25a565,#1a7f4c);box-shadow:0 6px 16px rgba(31,138,91,.25)}
.btn.sm{padding:7px 12px;font-size:12.5px;border-radius:9px}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:30px;white-space:nowrap}
.chip:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.chip.ok{background:var(--okl);color:var(--ok)}.chip.rev{background:var(--warnl);color:var(--warn)}.chip.bad{background:var(--badl);color:var(--bad)}.chip.inf{background:var(--infol);color:var(--info)}.chip.gld{background:var(--goldl);color:#8a6a35}.chip.neu{background:#eef0f3;color:#4a5363}
.chip.nodot:before{display:none}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:22px}
.kpi{padding:18px 20px}
.kpi .t{display:flex;align-items:center;justify-content:space-between;color:var(--mut);font-size:13px;font-weight:500}
.kpi .ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:var(--goldl);color:var(--gold)}
.kpi .v{font-size:28px;font-weight:800;color:var(--navy);margin-top:8px;letter-spacing:-.5px}
.kpi .d{font-size:12.5px;color:var(--mut);margin-top:2px}.kpi .d b{color:var(--ok)}
.kpi .row{display:flex;align-items:flex-end;justify-content:space-between}
.foot{text-align:center;color:var(--mut2);font-size:12px;padding:22px 0 8px;border-top:1px solid var(--line);margin-top:26px}
.foot b{color:var(--mut)}
table{width:100%;border-collapse:collapse}
th{font-size:11.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--mut2);font-weight:700;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:13px 12px;border-bottom:1px solid #f1ede5;vertical-align:middle;white-space:nowrap}
tr.sel td{background:#fbf7ef}
.who{display:flex;align-items:center;gap:11px}.who b{display:block;font-size:13.5px}.who small{color:var(--mut2);font-size:12px}
.pb{height:7px;background:#efeae0;border-radius:10px;overflow:hidden;width:110px}.pb i{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,var(--gold2),var(--gold))}
.pbw{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--mut);font-weight:600}
.tabs{display:flex;gap:4px;background:#f4f0e8;border-radius:12px;padding:4px}
.tabs a{padding:7px 14px;border-radius:9px;font-weight:600;font-size:13px;color:var(--mut);text-decoration:none;display:flex;gap:6px;align-items:center}
.tabs a.act{background:#fff;color:var(--navy);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.tabs a span{font-size:11px;background:#e7e0d2;border-radius:20px;padding:0 7px}
.tabs a.act span{background:var(--navy);color:#fff}
.inp{display:flex;align-items:center;gap:10px;border:1px solid #ddd6c8;border-radius:11px;padding:10px 13px;background:#fff;color:var(--mut2);font-size:13.5px}
.inp span{color:var(--txt)}
label.l{display:block;font-size:12.5px;font-weight:600;color:#3a4150;margin:0 0 6px}
.fld{margin-bottom:14px}
.tg{width:38px;height:22px;border-radius:20px;background:#d8d2c6;position:relative;flex:none}.tg:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.tg.on{background:var(--ok)}.tg.on:after{left:19px}
.cb{width:18px;height:18px;border-radius:5px;border:1.5px solid #c9c1b2;display:flex;align-items:center;justify-content:center;flex:none;background:#fff}
.cb.on{background:var(--navy);border-color:var(--navy);color:#fff}.cb.on svg{width:12px;height:12px;stroke-width:3}
.info{display:flex;gap:12px;background:linear-gradient(135deg,#f6efe2,#fbf8f1);border:1px solid #e8dcc3;border-radius:14px;padding:14px 16px;color:#5a4a2e;font-size:13px}
.info svg{color:var(--gold)}
.g1>*,.g2>*,.g3>*,.kpis>*{min-width:0}

/* cliente */
.g1{display:grid;grid-template-columns:1fr 340px;gap:22px;margin-bottom:22px}
.hero{background:radial-gradient(600px 300px at 100% 0,rgba(176,141,87,.25),transparent 60%),linear-gradient(135deg,#1a2f4f 0%,#0B1628 70%);color:#cfd7e3;border:none;padding:28px 30px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-60px;top:-60px;width:260px;height:260px;border-radius:50%;border:1px solid rgba(201,168,111,.25);box-shadow:0 0 0 30px rgba(201,168,111,.05)}
.hero .hd{display:flex;gap:26px;align-items:center;position:relative;z-index:1}
.ring{position:relative;width:132px;height:132px;flex:none}
.ring svg{width:132px;height:132px;transform:rotate(-90deg)}
.ring .c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ring .c b{font-size:32px;color:#fff;font-weight:800;letter-spacing:-1px}.ring .c span{font-size:11.5px;color:#aab5c6}
.hero .lbl{font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold2);font-weight:700}
.hero h2{white-space:nowrap;font-family:"Cormorant Garamond",serif;color:#fff;font-size:34px;font-weight:600;line-height:1.1;margin:6px 0 8px}
.hero .meta{display:flex;gap:18px;font-size:13px;flex-wrap:wrap}.hero .meta span{display:flex;gap:6px;align-items:center}.hero .meta b{color:#fff}
.hero .now{margin-left:auto;align-self:flex-start;background:rgba(176,141,87,.18);border:1px solid rgba(201,168,111,.4);color:#f0e3c8;border-radius:30px;padding:6px 14px;font-weight:600;font-size:12.5px;display:flex;gap:6px;align-items:center;white-space:nowrap}
.steps{display:grid;grid-template-columns:repeat(5,1fr);margin-top:28px;position:relative;z-index:1}
.stp{text-align:center;position:relative}
.stp:before{content:"";position:absolute;top:23px;left:-50%;width:100%;height:3px;background:rgba(255,255,255,.12)}
.stp:first-child:before{display:none}
.stp.ok:before,.stp.cur:before{background:linear-gradient(90deg,var(--gold),var(--gold2))}
.stp .o{width:48px;height:48px;border-radius:15px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#7f8ca1;position:relative;z-index:1}
.stp.ok .o{background:linear-gradient(135deg,var(--gold2),var(--gold));border:none;color:var(--navy)}
.stp.cur .o{background:#fff;color:var(--navy);border:2px solid var(--gold2);box-shadow:0 0 0 6px rgba(201,168,111,.22)}
.stp b{display:block;color:#fff;font-size:13.5px}.stp.pend b{color:#8c98ab}
.stp small{font-size:12px;color:#93a0b4}
.stp.cur small{color:var(--gold2);font-weight:600}
.nextc .big{display:flex;gap:16px;align-items:center;margin-bottom:16px}
.calb{width:68px;border-radius:14px;overflow:hidden;text-align:center;border:1px solid var(--line);box-shadow:0 6px 14px rgba(11,22,40,.08);flex:none}
.calb .m{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#fff;font-size:11.5px;font-weight:800;letter-spacing:1px;padding:4px 0}
.calb .d{font-size:28px;font-weight:800;color:var(--navy);padding:4px 0 2px}.calb .w{font-size:11px;color:var(--mut);padding-bottom:6px}
.nextc h4{font-size:16px;color:var(--navy)}.nextc p{color:var(--mut);font-size:13px;display:flex;gap:6px;align-items:center;margin-top:3px}
.nextc .acts{display:flex;gap:8px}
.cdown{display:flex;gap:8px;margin:14px 0 16px}.cdown div{flex:1;background:#faf7f0;border:1px solid #efe6d4;border-radius:12px;text-align:center;padding:8px 0}.cdown b{display:block;font-size:20px;color:var(--navy)}.cdown span{font-size:11px;color:var(--mut)}
.g2{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;margin-bottom:22px}
.g3{display:grid;grid-template-columns:1fr 1fr 340px;gap:22px}
.dz{border:2px dashed #d9ccb2;background:linear-gradient(135deg,#fdfbf6,#f8f3e8);border-radius:16px;padding:20px;display:flex;align-items:center;gap:16px;margin-bottom:16px}
.dz .ic{width:52px;height:52px;border-radius:14px;background:#fff;color:var(--gold);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 14px rgba(176,141,87,.18);flex:none}
.dz b{color:var(--navy);font-size:14.5px}.dz p{color:var(--mut);font-size:12.5px}
.dz .btn{margin-left:auto}
.dl{display:flex;align-items:center;gap:13px;padding:12px 0;border-top:1px solid #f1ede5}
.dl .fi{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex:none}
.fi.ok{background:var(--okl);color:var(--ok)}.fi.rev{background:var(--warnl);color:var(--warn)}.fi.bad{background:var(--badl);color:var(--bad)}
.dl .nm{flex:1;min-width:0}.dl .nm b{display:block;font-size:13.5px}.dl .nm small{color:var(--mut2);font-size:12px}
.dl .a{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy)}
.tl{position:relative;padding-left:26px}
.tl:before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:2px;background:linear-gradient(var(--gold),#eee6d6)}
.ti{position:relative;padding-bottom:18px}
.ti:before{content:"";position:absolute;left:-24px;top:4px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--gold)}
.ti.old:before{border-color:#d6ccb8}
.ti .when{font-size:12px;color:var(--mut2);display:flex;gap:8px;align-items:center}
.ti b{display:block;color:var(--navy);font-size:14px;margin:3px 0 4px}.ti p{color:#46505f;font-size:13px}
.msg{display:flex;gap:12px;padding:12px 0;border-top:1px solid #f1ede5}.msg:first-of-type{border:none;padding-top:0}
.msg .tx{flex:1;min-width:0}.msg .tx b{font-size:13.5px}.msg .tx p{color:var(--mut);font-size:12.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg .tm{font-size:11.5px;color:var(--mut2);white-space:nowrap}
.unread{width:8px;height:8px;border-radius:50%;background:var(--gold);display:inline-block;margin-left:6px}
.compose{display:flex;gap:8px;margin-top:14px}.compose .inp{flex:1}
.tm2{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px solid #f1ede5}.tm2:first-of-type{border:none;padding-top:0}
.tm2 b{display:block;font-size:13.5px}.tm2 small{color:var(--mut);font-size:12px}
.tm2 .on{margin-left:auto;font-size:11.5px;color:var(--ok);font-weight:600;display:flex;gap:5px;align-items:center}.tm2 .on:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok)}
.wab{width:100%;justify-content:center;padding:13px;margin-top:14px;font-size:14px}
.wan{text-align:center;font-size:12px;color:var(--mut);margin-top:8px}
.kpis .kpi .ic.ok{background:var(--okl);color:var(--ok)}.kpis .kpi .ic.inf{background:var(--infol);color:var(--info)}.kpis .kpi .ic.bad{background:var(--badl);color:var(--bad)}
.mtop,.bnav{display:none}
@media (max-width:600px){
 .app{display:block}.side,.top{display:none}
 .main{padding:84px 16px 96px}
 .mtop{display:flex;position:absolute;top:0;left:0;right:0;height:64px;background:var(--navy);align-items:center;padding:0 16px;gap:10px}
 .mtop img{height:34px}.mtop .r{margin-left:auto;display:flex;gap:8px}.mtop .ib{width:38px;height:38px;background:rgba(255,255,255,.08);border:none;color:#fff}
 .ph{display:block}.ph h1{font-size:30px}.ph .btn{display:none}
 .mtag{display:flex!important;justify-content:center;margin-bottom:14px}
 .g1,.g2,.g3{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr;gap:12px}
 .kpi{padding:14px}.kpi .v{font-size:22px}
 .hero{padding:22px 18px}.hero .hd{flex-direction:column;align-items:flex-start;gap:16px}.hero .now{margin-left:0;order:-1}
 .steps{grid-template-columns:1fr;gap:0;margin-top:18px}
 .stp{display:flex;align-items:center;gap:14px;text-align:left;padding:6px 0}
 .stp:before{left:23px;top:-50%;width:3px;height:100%}
 .stp .o{margin:0;width:44px;height:44px}
 .stp b{display:inline}.stp small{display:block}
 .dz{flex-wrap:wrap}.dz .btn{margin-left:0;width:100%;justify-content:center}
 .card{padding:18px}
 .app>div{position:relative}
 .bnav{display:flex;position:absolute;bottom:0;left:0;right:0;height:70px;background:#fff;border-top:1px solid var(--line);justify-content:space-around;align-items:center;box-shadow:0 -6px 20px rgba(11,22,40,.06);z-index:40}
 .bnav a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;color:var(--mut);text-decoration:none;font-weight:600}
 .bnav a.act{color:var(--navy)}.bnav a.act svg{color:var(--gold)}
 .foot{padding-bottom:20px}
 .ch h3{font-size:15px}.link{white-space:nowrap;font-size:12px}.ch h3 .ic{width:30px;height:30px}
}

/* admin */
.stg{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.stg div{border:1px solid var(--line);border-radius:11px;padding:10px 4px;text-align:center;font-size:11px;font-weight:600;color:var(--mut);line-height:1.25}
.stg div svg{display:block;margin:0 auto 5px;color:var(--mut2)}
.stg div.done{background:#faf6ee;color:#8a6a35;border-color:#eadcc0}.stg div.done svg{color:var(--gold)}
.stg div.on{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 6px 14px rgba(11,22,40,.25)}.stg div.on svg{color:var(--gold2)}
.ed{border:1px solid #ddd6c8;border-radius:12px;overflow:hidden}
.ed .tb{display:flex;gap:4px;padding:7px 10px;border-bottom:1px solid var(--line);background:#faf8f3;color:var(--mut)}
.ed .tb span{width:30px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center}
.ed .tb span.a{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.ed .tx{padding:12px 14px;font-size:13.5px;color:#2b323d;min-height:92px}
.ed .ft{padding:8px 14px;border-top:1px solid #f1ede5;font-size:11.5px;color:var(--mut2);display:flex;justify-content:space-between}
.dr{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid #f1ede5}
.dr .fi{width:36px;height:36px;border-radius:10px;background:#f4f0e8;color:var(--navy);display:flex;align-items:center;justify-content:center;flex:none}
.dr .nm{flex:1;min-width:0}.dr .nm b{display:block;font-size:13px}.dr .nm small{font-size:11.5px;color:var(--mut2)}
.ab{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line)}
.ab.y{background:var(--okl);color:var(--ok);border-color:#bfe3d0}.ab.n{background:var(--badl);color:var(--bad);border-color:#f5c9b6}
.nt{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
.nt .ic{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#f4f0e8;color:var(--navy)}
.nt b{font-size:13.5px;display:block}.nt small{font-size:12px;color:var(--mut)}.nt .tg{margin-left:auto}
.kpi .spk{width:110px;height:40px}
.tblc{padding:0;overflow:hidden}
.tblc .hd{display:flex;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--line)}
.tblc table th:first-child,.tblc table td:first-child{padding-left:22px}
.tblc table th:last-child,.tblc table td:last-child{padding-right:22px}
.pg{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;color:var(--mut);font-size:12.5px}
.pg .ps{display:flex;gap:4px}.pg .ps span{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);font-weight:600}.pg .ps span.a{background:var(--navy);color:#fff;border-color:var(--navy)}
.g4{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.mini{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid #f1ede5}.mini:first-of-type{border:none}
.mini .tx{flex:1}.mini b{font-size:13.5px;display:block}.mini small{color:var(--mut);font-size:12px}
.vlbl{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#c9a86f,#a7834c);color:#fff;border-radius:30px;padding:6px 14px;font-weight:700;font-size:12.5px;margin-bottom:10px}
/* usuarios */
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}
.role{padding:20px 22px;position:relative;overflow:hidden}
.role .hd{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.role .ri{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center}
.role h3{font-size:16px;color:var(--navy)}.role .n{font-size:12.5px;color:var(--mut)}
.role ul{list-style:none;display:grid;gap:7px;margin-top:4px}
.role li{display:flex;gap:8px;align-items:center;font-size:13px;color:#39404c}
.role li svg{width:15px;height:15px;flex:none}
.role li.y svg{color:var(--ok)}.role li.no{color:var(--mut2)}.role li.no svg{color:#d0a493}
.role.a{background:linear-gradient(150deg,#0B1628,#1c3354);color:#fff;border:none}
.role.a h3{color:#fff}.role.a .n{color:#b9c2d3}.role.a li{color:#dfe5ef}.role.a li.y svg{color:var(--gold2)}
.role.a .ri{background:rgba(201,168,111,.18);color:var(--gold2)}
.grid5>*{min-width:0}
.grid5{display:grid;grid-template-columns:1fr 400px;gap:22px;align-items:start}
.st{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600}.st i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--okl)}
.st.off{color:var(--mut2)}.st.off i{background:#b9bfc9;box-shadow:0 0 0 3px #eef0f3}
.stack{display:flex}.stack .av{width:26px;height:26px;font-size:9.5px;border:2px solid #fff;margin-left:-7px;border-radius:50%}.stack .av:first-child{margin-left:0}
.stack .more{width:26px;height:26px;border-radius:50%;background:#f1ece2;color:var(--mut);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-left:-7px;border:2px solid #fff}
.form h3{font-family:"Cormorant Garamond",serif;font-size:26px;color:var(--navy);font-weight:700}
.form .fld{margin-top:14px}
.perm{display:flex;gap:11px;align-items:flex-start;padding:11px 12px;border:1px solid var(--line);border-radius:12px;margin-top:8px}
.perm b{font-size:13.5px;display:block}.perm small{font-size:12px;color:var(--mut)}
.perm.on{border-color:#e3d3b2;background:#fcf9f3}
.seg{display:grid;grid-template-columns:repeat(3,1fr);background:#f4f0e8;border-radius:12px;padding:4px;gap:4px}
.seg span{text-align:center;padding:8px;border-radius:9px;font-size:13px;font-weight:600;color:var(--mut)}
.seg span.a{background:#fff;color:var(--navy);box-shadow:0 2px 6px rgba(11,22,40,.1)}
.asg{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-top:8px}
.asg .chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.asg .pc{display:inline-flex;align-items:center;gap:6px;background:var(--navy);color:#fff;border-radius:30px;padding:4px 6px 4px 4px;font-size:12px;font-weight:600}
.asg .pc .av{width:20px;height:20px;font-size:8.5px;border-radius:50%}
.asg .pc svg{width:13px;height:13px;opacity:.7}
.asg .opt{display:flex;align-items:center;gap:10px;padding:7px 2px;font-size:13px;border-top:1px solid #f3efe7}
.asg .opt small{margin-left:auto;color:var(--mut2);font-size:11.5px}
.log{margin-top:22px}
.lgr{display:flex;gap:12px;padding:12px 0;border-top:1px solid #f1ede5;align-items:center}.lgr:first-of-type{border:none}
.lgr .li{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:none}
.lgr .tx{flex:1;font-size:13.5px}.lgr .tx small{display:block;color:var(--mut);font-size:12px}
.lgr .tm{font-size:12px;color:var(--mut2);white-space:nowrap}

