:root{--navy:#0b244c;--navy2:#133c78;--blue:#1670d9;--ink:#122e56;--muted:#657997;--line:#dce6f5;--bg:#f0f4fb;--shadow:0 12px 32px rgba(22,54,102,.09)}
*{box-sizing:border-box}html{font-family:'Segoe UI',Inter,Arial,sans-serif}body{margin:0;color:var(--ink);background:var(--bg)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.shell{min-height:100vh;display:grid;grid-template-columns:245px minmax(0,1fr)}.sidebar{background:linear-gradient(180deg,#0a2146,#123b73 84%,#174e90);color:#fff;display:flex;flex-direction:column;min-height:100vh;padding:26px 15px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;padding:4px 7px 26px;border-bottom:1px solid #ffffff20}.logo{font:700 32px Georgia,serif;white-space:nowrap}.logo span{color:#97cbff}.brand strong{display:block;font-size:16px}.brand small{font-size:10px;color:#d0e4ff}.side-label,.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#3a87e3}.side-label{color:#91b7e9;padding:28px 11px 14px}.nav-item{display:flex;align-items:center;gap:12px;border-radius:12px;padding:13px 11px;font-size:13px;font-weight:700;margin:2px 0;color:#e7f2ff;transition:background .15s}.nav-item:hover{background:#ffffff16}.nav-item.active{background:linear-gradient(90deg,#0d85ee,#1261c9);color:white;box-shadow:0 7px 17px #061c4180}.nav-item span{font-size:20px;min-width:22px;text-align:center}.sidebar-bottom{margin-top:auto;padding:18px 9px 0;border-top:1px solid #ffffff28;display:grid;gap:7px;font-size:10px;color:#d4e6ff}.main{min-width:0}.topbar{background:linear-gradient(112deg,#fff,#edf5ff 72%,#d7e9ff);border-bottom:1px solid var(--line);padding:25px 36px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.top-heading h1{margin:5px 0 4px;font-size:30px;color:#08234f}.top-heading p{margin:0;color:#506986;font-size:13px}.top-actions{display:flex;align-items:center;gap:12px}.user-pill,.pill{padding:10px 13px;border:1px solid #d8e8fb;background:#f5faff;border-radius:13px;font-size:12px;font-weight:750;color:#245385}.user-pill{color:#154b90}.logout{border:1px solid #c9dcfb;background:#fff;color:#1255ae;padding:11px 15px;font-weight:750;border-radius:12px;cursor:pointer}.content{max-width:1540px;padding:28px 36px 40px;margin:auto}.content>footer{padding:28px 0 0;color:#6b81a2;font-size:11px}.welcome-box,.surface,.module-card,.stat{border-radius:22px;box-shadow:var(--shadow);border:1px solid #ffffff;background:#fff}.welcome-box{display:flex;justify-content:space-between;gap:18px;padding:32px;background:linear-gradient(112deg,#edf8ff,#fff 60%,#f5efff);margin-bottom:18px;overflow:hidden}.welcome-box h2{font-size:29px;color:#14345c;margin:12px 0}.welcome-box p{color:#607692;line-height:1.6;max-width:710px;margin:0}.welcome-art{width:130px;height:130px;display:grid;place-items:center;background:linear-gradient(135deg,#bde0ff,#e8d8ff);font-size:70px;opacity:.75;border-radius:28px;transform:rotate(-8deg)}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.stat{padding:22px;display:grid;gap:8px;background:linear-gradient(125deg,#fff,#f0f7ff)}.stat:nth-child(2){background:linear-gradient(125deg,#fff,#f4f0ff)}.stat:nth-child(3){background:linear-gradient(125deg,#fff,#fffaec)}.stat span{font-size:12px;color:#617b9b;font-weight:700}.stat strong{font-size:32px;color:#143e7d}.stat small{color:#7185a2;font-size:11px}.section-title,.surface-head{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;flex-wrap:wrap;margin:26px 0 16px}.section-title h2{font-size:24px;margin:7px 0 0}.section-title p{font-size:12px;color:#6c819c;margin:8px 0}.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.module-card{position:relative;isolation:isolate;padding:26px;display:flex;align-items:flex-start;flex-direction:column;min-height:238px;transition:transform .16s,box-shadow .16s;overflow:hidden}.module-card:hover{transform:translateY(-3px);box-shadow:0 19px 36px #143e7d25}.module-card:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(120deg,#ffffff88,transparent)}.module-card.cyan{background:linear-gradient(130deg,#e5f9ff,#fff 55%,#dbf3ff)}.module-card.violet{background:linear-gradient(130deg,#f5edff,#fff 55%,#e9e4ff)}.module-card.amber{background:linear-gradient(130deg,#fff2d9,#fff 55%,#ffe6e0)}.module-icon{width:55px;height:55px;border-radius:15px;display:grid;place-items:center;font-size:33px;background:linear-gradient(145deg,#19b0d9,#1776c1);color:white;box-shadow:0 6px 14px #065d9425}.violet .module-icon{background:linear-gradient(145deg,#a973ef,#6351cb)}.amber .module-icon{background:linear-gradient(145deg,#f9b63f,#db7c1c)}.module-card h3{margin:18px 0 8px;font-size:20px}.module-card p{margin:0;color:#59718e;font-size:13px;line-height:1.5}.module-link{margin-top:auto;padding-top:20px;font-size:13px;font-weight:800;color:#135ab4}.two-col{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;margin-top:20px}.surface{padding:24px;min-width:0}.surface h2,.surface h3{margin:0 0 8px}.surface h2{font-size:20px}.surface h3{font-size:19px}.muted{color:#7386a0;font-size:12px;line-height:1.5}.recent-list{margin-top:14px}.recent-list>div{display:flex;justify-content:space-between;padding:11px 0;gap:14px;border-bottom:1px solid #e9eff9;font-size:12px}.recent-list span{color:#68809d}.gradient-surface{background:linear-gradient(145deg,#edfaff,#fff,#f5edff)}.neutral{background:#f2f4fa}.notice,.success{border-radius:13px;padding:16px 18px;background:#fff8e8;border:1px solid #f3dfaa;color:#735d27;font-size:13px;margin:12px 0 18px}.success{background:#ecfff6;border-color:#bee8cf;color:#176445}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.field{display:flex;flex-direction:column;gap:7px}.field span,.login-card label{font-size:12px;color:#536b89;font-weight:700}.field.wide{grid-column:1/-1}input,textarea,select{width:100%;background:#f9fbff;border:1px solid #d3e0f3;color:#163a6e;padding:12px;border-radius:12px;outline:none}input:focus,textarea:focus,select:focus{border-color:#3189f1;box-shadow:0 0 0 3px #3189f122}.form-actions{margin-top:18px;display:flex;gap:10px}.btn{border-radius:11px;border:0;padding:11px 17px;font-weight:800;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.primary{background:linear-gradient(90deg,#0c75e2,#1464c3);color:#fff}.secondary{background:#e9f2ff;color:#1359ac}.surface-head{margin:0 0 16px;align-items:center}.surface-head p{margin:0}.filter{display:flex;gap:10px}.filter input{min-width:190px}.table-scroll{overflow-x:auto;max-height:61vh;border:1px solid #e6edf7;border-radius:14px}table{border-collapse:collapse;width:100%;min-width:870px;font-size:12px}th{position:sticky;top:0;background:#edf6ff;color:#24466f;text-align:left;padding:13px 12px;white-space:nowrap}td{padding:12px;border-top:1px solid #ecf0f6;max-width:340px;overflow-wrap:anywhere}tbody tr:hover{background:#f7faff}.empty{text-align:center;color:#8394ad;padding:32px}.action-link{font-weight:800;color:#1262c3}.pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;color:#6e829e;font-size:12px}.pagination>div{display:flex;gap:10px;align-items:center}.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 15% 15%,#b7ddff,transparent 35%),radial-gradient(circle at 90% 90%,#dac7ff,transparent 40%),#edf3ff;padding:20px}.login-card{width:100%;max-width:445px;border-radius:26px;background:#fff;border:1px solid #fff;box-shadow:0 20px 65px #1b407d1b;padding:35px}.login-card h1{font-size:27px;color:#123a7a;margin:12px 0 8px}.login-card form{display:flex;flex-direction:column;gap:11px;margin-top:24px}.login-card .full{margin-top:10px;width:100%;font-size:14px}.login-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:17px;background:linear-gradient(145deg,#146dc9,#7956da);color:white;font-size:32px}.small{font-size:11px}.error{padding:12px;border-radius:11px;background:#ffe8eb;color:#ac2238;font-size:12px}.nav-item:focus-visible,.btn:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #52b8ff;outline-offset:3px}@media(max-width:1200px){.module-grid{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr 1fr}}@media(max-width:850px){.shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;min-height:auto;padding:12px}.sidebar nav{display:flex;flex-wrap:wrap;gap:6px}.nav-item{font-size:12px}.brand{padding-bottom:10px}.sidebar-bottom,.side-label{display:none}.topbar,.content{padding:20px}.module-grid,.stats,.two-col{grid-template-columns:1fr}.welcome-art{display:none}.form-grid{grid-template-columns:1fr}}
.promociones{max-width:780px;margin-bottom:16px}
.promociones-form{display:grid;gap:10px;margin-top:16px}
.promociones-form label{font-weight:700}
.promociones-form input[type=file]{max-width:100%;width:100%;padding:12px;border:1px solid #b8c6d8;border-radius:8px;background:#f5f8fc;font:inherit}
.promociones-form button{justify-self:start}
.promociones-form button:disabled{opacity:.65;cursor:default}
.promociones-form p{margin:0}
.promociones code{overflow-wrap:anywhere}

/* Tarjetas del panel de Sistemas · Neón pastel de Publicidad L&H */
@property --giro-tarjeta {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
.module-grid--neon {
  padding: clamp(12px, 2vw, 22px);
  border-radius: 28px;
  background: linear-gradient(135deg,#032267,#072178 56%,#173ca8);
}
.module-grid--neon .module-card {
  --brillo: #10ffef;
  --pastel: #e5f9ff;
  border: 2px solid transparent;
  border-radius: 28px;
  background:
    linear-gradient(140deg,var(--pastel),#fff 64%,#f0e9ff) padding-box,
    conic-gradient(from var(--giro-tarjeta),#8d85e7 0deg,#b0a2eb 52deg,var(--brillo) 84deg,#fff 94deg,#aaa1e6 120deg,#8d85e7 218deg,var(--brillo) 250deg,#fff 260deg,#8d85e7 296deg) border-box;
  box-shadow: 0 8px 20px #020e4345, 0 0 10px #d1a6ff45;
  animation: sistemas-borde 9s linear infinite;
}
.module-grid--neon .violet { --brillo:#a76cff; --pastel:#f0e9ff; }
.module-grid--neon .amber { --brillo:#ffce63; --pastel:#fff2d9; }
.module-grid--neon .rosa { --brillo:#ff61ef; --pastel:#ffedf8; }
.module-grid--neon .module-card:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@keyframes sistemas-borde { to { --giro-tarjeta: 360deg; } }
@media (prefers-reduced-motion: reduce) {
  .module-grid--neon .module-card { animation: none; transition: none; transform: none; }
}