:root{
  --iae:#1E22AA; --iae-900:#141873; --iae-700:#2a2fbf; --iae-100:#ecedf9; --iae-50:#f5f6fc;
  --ink:#1a1c2e; --muted:#5b5f74; --line:#e2e3ef; --bg:#f7f8fc; --card:#ffffff;
  --ok:#1f9d67; --ok-bg:#e6f6ee; --warn:#b8860b; --warn-bg:#fdf3dd; --danger:#c0392b; --danger-bg:#fbeceb;
  --radius:14px; --shadow:0 1px 2px rgba(20,24,115,.05),0 8px 30px rgba(20,24,115,.07);
  --serif:'Lora',Georgia,serif; --sans:'Libre Franklin',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--iae);text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2;letter-spacing:-.01em;margin:0}
button{font-family:inherit;cursor:pointer}
input,textarea,select{font-family:inherit;font-size:15px}
.hidden{display:none!important}

/* Header */
.topbar{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.topbar-in{max-width:1080px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:12px;cursor:pointer}
.brand img{height:40px;width:auto;display:block}
.brand .sep{width:1px;height:30px;background:var(--line)}
.brand .app-name{font-family:var(--serif);font-weight:600;font-size:19px;color:var(--iae);line-height:1}
.brand .app-name small{display:block;font-family:var(--sans);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.topbar .spacer{flex:1}
.nav-user{display:flex;align-items:center;gap:10px}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--iae);color:#fff;display:grid;place-items:center;font-weight:600;font-size:14px}
.nav-links{display:flex;gap:4px}
.nav-links button{background:none;border:0;color:var(--muted);font-weight:500;font-size:14px;padding:8px 12px;border-radius:8px}
.nav-links button:hover{background:var(--iae-50);color:var(--iae)}
.nav-links button.active{background:var(--iae-100);color:var(--iae)}

/* Layout */
.wrap{max-width:1080px;margin:0 auto;padding:26px 20px 80px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.page-head h1{font-size:28px;color:var(--iae-900)}
.page-head p{margin:6px 0 0;color:var(--muted)}
.tabs{display:flex;gap:6px;margin-bottom:20px;border-bottom:1px solid var(--line)}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:10px 4px;margin-right:16px;color:var(--muted);font-weight:600;font-size:15px}
.tabs button.active{color:var(--iae);border-color:var(--iae)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:10px;padding:11px 18px;font-weight:600;font-size:15px;transition:.15s}
.btn-primary{background:var(--iae);color:#fff}
.btn-primary:hover{background:var(--iae-900)}
.btn-ghost{background:#fff;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--iae);color:var(--iae)}
.btn-danger{background:#fff;border-color:var(--danger);color:var(--danger)}
.btn-danger:hover{background:var(--danger-bg)}
.btn-sm{padding:7px 12px;font-size:13px;border-radius:8px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-block{width:100%}

/* Cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.rcard{padding:20px;display:flex;flex-direction:column;gap:12px;cursor:pointer;transition:.15s;border-top:3px solid var(--iae)}
.rcard:hover{transform:translateY(-2px);box-shadow:0 10px 34px rgba(20,24,115,.13)}
.rcard.cancelada{opacity:.6;border-top-color:var(--muted)}
.rcard h3{font-size:19px;color:var(--iae-900)}
.rcard .empresa{font-weight:600;color:var(--iae);font-size:14px}
.rcard .temas{color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.meta{display:flex;flex-direction:column;gap:7px;font-size:14px;color:var(--ink)}
.meta .row{display:flex;align-items:center;gap:9px}
.meta .ic{width:17px;text-align:center;color:var(--iae);flex-shrink:0}
.rcard-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:12px;margin-top:2px}

/* Cupo bar */
.cupo{display:flex;flex-direction:column;gap:5px;flex:1}
.cupo-top{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted)}
.cupo-bar{height:7px;border-radius:99px;background:var(--iae-100);overflow:hidden}
.cupo-fill{height:100%;background:var(--iae);border-radius:99px}
.cupo-fill.full{background:var(--warn)}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:4px 10px;border-radius:99px;white-space:nowrap}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.espera{background:var(--warn-bg);color:var(--warn)}
.badge.libre{background:var(--iae-50);color:var(--iae)}
.badge.gris{background:#eef0f4;color:var(--muted)}
.badge.creador{background:var(--iae);color:#fff}

/* Forms */
.field{margin-bottom:16px}
.field label{display:block;font-weight:600;font-size:14px;margin-bottom:6px;color:var(--ink)}
.field .hint{font-weight:400;color:var(--muted);font-size:12.5px}
.field input,.field textarea,.field select{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);transition:.15s}
.field input:focus,.field textarea:focus,.field select:focus{outline:0;border-color:var(--iae);box-shadow:0 0 0 3px var(--iae-100)}
.field textarea{resize:vertical;min-height:90px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:8px}

/* Auth */
.auth-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}
.auth-hero{background:var(--iae);color:#fff;padding:56px 52px;display:flex;flex-direction:column;justify-content:space-between}
.auth-hero .logo-white{background:#fff;border-radius:12px;padding:14px;width:fit-content}
.auth-hero .logo-white img{height:74px;display:block}
.auth-hero h1{color:#fff;font-size:34px;line-height:1.15;margin-top:30px}
.auth-hero p{color:#c8caf2;font-size:16px;margin-top:14px;max-width:30ch}
.auth-hero .steps{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.auth-hero .steps .st{display:flex;gap:12px;align-items:flex-start}
.auth-hero .steps .n{background:rgba(255,255,255,.16);width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;flex-shrink:0}
.auth-hero .steps .tx b{display:block;font-size:14.5px}
.auth-hero .steps .tx span{color:#c8caf2;font-size:13px}
.auth-form-side{display:flex;align-items:center;justify-content:center;padding:40px 24px;background:var(--bg)}
.auth-box{width:100%;max-width:400px}
.auth-box .mob-logo{display:none}
.auth-box h2{font-size:26px;color:var(--iae-900);margin-bottom:6px}
.auth-box .sub{color:var(--muted);margin-bottom:24px}
.auth-switch{text-align:center;margin-top:18px;color:var(--muted);font-size:14px}
.auth-switch button{background:none;border:0;color:var(--iae);font-weight:600;cursor:pointer;font-size:14px}
.link-btn{background:none;border:0;color:var(--iae);font-weight:600;cursor:pointer;font-size:13.5px;padding:0}

/* Alerts */
.alert{padding:11px 14px;border-radius:10px;font-size:14px;margin-bottom:16px}
.alert.err{background:var(--danger-bg);color:var(--danger)}
.alert.ok{background:var(--ok-bg);color:var(--ok)}
.alert.info{background:var(--iae-50);color:var(--iae-900);border:1px solid var(--iae-100)}

/* Modal */
.modal-bg{position:fixed;inset:0;background:rgba(20,24,58,.55);display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:50;overflow-y:auto;backdrop-filter:blur(2px)}
.modal{background:#fff;border-radius:16px;width:100%;max-width:600px;box-shadow:0 24px 70px rgba(0,0,0,.3);animation:pop .18s ease}
@keyframes pop{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.modal-head{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.modal-head h2{font-size:21px;color:var(--iae-900)}
.modal-head .x{background:none;border:0;font-size:22px;color:var(--muted);cursor:pointer;line-height:1}
.modal-body{padding:22px 24px}
.modal-wide{max-width:860px}

/* Detail */
.detail-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-start}
.detail-head .empresa{color:var(--iae);font-weight:600}
.detail-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:24px;margin-top:8px}
.panel{border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:16px;background:#fff}
.panel h3{font-size:16px;color:var(--iae-900);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.kv{display:flex;flex-direction:column;gap:11px}
.kv .k{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
.kv .v{font-size:15px}
.people{display:flex;flex-direction:column;gap:2px}
.person{display:flex;align-items:center;gap:11px;padding:9px 4px;border-bottom:1px solid var(--iae-50)}
.person:last-child{border-bottom:0}
.person .av{width:34px;height:34px;border-radius:50%;background:var(--iae-100);color:var(--iae);display:grid;place-items:center;font-weight:600;font-size:13px;flex-shrink:0}
.person .nm{font-weight:600;font-size:14px}
.person .role{font-size:12.5px;color:var(--muted)}
.person .spacer{flex:1}
.divider-esp{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--warn);font-weight:700;margin:12px 0 4px;padding-top:10px;border-top:1px dashed var(--line)}

/* Método (etapas) */
.metodo-steps{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.mstep{flex:1;min-width:120px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:12.5px;position:relative}
.mstep .no{font-weight:700;color:var(--muted)}
.mstep .ti{font-weight:600;display:block;margin-top:2px}
.mstep .ti small{display:block;font-weight:400;color:var(--muted);margin-top:2px}
.mstep.on{border-color:var(--iae);background:var(--iae-50);box-shadow:0 0 0 2px var(--iae-100)}
.mstep.done{opacity:.65}
.mstep.on .no{color:var(--iae)}

.aporte{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:9px;background:#fff}
.aporte .who{font-size:12.5px;color:var(--muted);margin-bottom:4px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.aporte .tx{font-size:14.5px}
.aporte.elegida{border-color:var(--ok);background:var(--ok-bg)}
.presentacion-fmt{display:flex;flex-direction:column;gap:13px}
.presentacion-fmt .blk .lab{font-family:var(--serif);font-style:italic;color:var(--iae);font-size:14px;margin-bottom:3px}
.presentacion-fmt .blk .val{font-size:15px;white-space:pre-wrap}

/* Empty / loading */
.empty{text-align:center;padding:70px 20px;color:var(--muted)}
.empty .ic{font-size:44px;margin-bottom:14px;opacity:.5}
.empty h3{color:var(--ink);margin-bottom:6px}
.spinner{width:34px;height:34px;border:3px solid var(--iae-100);border-top-color:var(--iae);border-radius:50%;animation:spin .7s linear infinite;margin:60px auto}
@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--iae-900);color:#fff;padding:12px 22px;border-radius:99px;font-size:14px;font-weight:500;box-shadow:0 10px 30px rgba(0,0,0,.25);z-index:100;animation:pop .2s}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:12.5px;background:var(--iae-50);color:var(--iae-900);padding:5px 11px;border-radius:99px;font-weight:500}

@media (max-width:820px){
  .auth-shell{grid-template-columns:1fr}
  .auth-hero{display:none}
  .auth-box .mob-logo{display:block;text-align:center;margin-bottom:22px}
  .auth-box .mob-logo img{height:76px}
  .detail-grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .brand .app-name{font-size:16px}
  .brand img{height:34px}
  .nav-links{display:none}
}

/* ===== Chair, etiquetas, reseñas, notificaciones ===== */
.chair-box{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px dashed var(--iae);border-radius:10px;background:var(--iae-50)}
.chair-box .av{width:34px;height:34px;border-radius:50%;background:var(--iae);color:#fff;display:grid;place-items:center;font-weight:600;font-size:13px;flex-shrink:0}
.chair-box.vacante{border-color:var(--line);background:#fff;color:var(--muted)}
.badge.chair{background:#0f766e;color:#fff}
.badge.chair-cand{background:#e6f6ee;color:var(--ok)}
.tag{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.02em;padding:4px 9px;border-radius:6px;background:var(--iae-100);color:var(--iae-900)}
.tags{display:flex;gap:6px;flex-wrap:wrap}
.tag-pick{cursor:pointer;border:1px solid var(--line);background:#fff;color:var(--muted);font-size:12.5px;padding:6px 11px;border-radius:99px;font-weight:500;transition:.15s}
.tag-pick:hover{border-color:var(--iae)}
.tag-pick.on{background:var(--iae);border-color:var(--iae);color:#fff}
.filtros{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}

.stars{display:inline-flex;gap:2px;color:#e0a800;font-size:15px;letter-spacing:1px}
.stars.big{font-size:26px;gap:4px}
.stars .off{color:#d8dae5}
.star-pick{cursor:pointer;background:none;border:0;font-size:30px;color:#d8dae5;padding:0 2px;line-height:1;transition:.12s}
.star-pick.on{color:#e0a800}
.star-pick:hover{transform:scale(1.12)}
.rating-inline{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.resena{border-left:3px solid var(--iae-100);padding:10px 0 10px 14px;margin-bottom:14px}
.resena .top{display:flex;align-items:center;gap:9px;margin-bottom:5px;flex-wrap:wrap}
.resena .nm{font-weight:600;font-size:14px}
.resena .role{font-size:12px;color:var(--muted)}
.resena .tx{font-size:14.5px;font-style:italic;color:#33364a}

.bell{position:relative;background:none;border:0;cursor:pointer;font-size:19px;padding:6px 8px;border-radius:8px;line-height:1}
.bell:hover{background:var(--iae-50)}
.bell .dot{position:absolute;top:2px;right:2px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:99px;display:grid;place-items:center;padding:0 4px}
.notif{display:flex;gap:10px;padding:11px 4px;border-bottom:1px solid var(--iae-50);font-size:14px}
.notif:last-child{border-bottom:0}
.notif.nueva{background:var(--iae-50);border-radius:8px;padding-left:10px}
.notif .ic{font-size:16px;flex-shrink:0}
.notif .fecha{font-size:11.5px;color:var(--muted);margin-top:2px}

.compromiso-row{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}
.compromiso-row:last-child{border-bottom:0}
.compromiso-row .body{flex:1}
.compromiso-row .tit{font-weight:600;font-size:14px;margin-bottom:3px}
.compromiso-row .txt{font-size:14px;color:#33364a}
.est-sel{border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;background:#fff}
.badge.cumplido{background:var(--ok-bg);color:var(--ok)}
.badge.en_curso{background:var(--warn-bg);color:var(--warn)}
.badge.pendiente{background:#eef0f4;color:var(--muted)}
.hero-exp{background:var(--iae);color:#fff;border-radius:14px;padding:22px 24px;margin-bottom:22px}
.hero-exp h3{color:#fff;font-size:17px;margin-bottom:4px}
.hero-exp p{color:#c8caf2;font-size:13.5px;margin:0 0 14px}
.exp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.exp-card{background:rgba(255,255,255,.1);border-radius:10px;padding:14px}
.exp-card .tx{font-size:13.5px;font-style:italic;line-height:1.5}
.exp-card .who{font-size:12px;color:#c8caf2;margin-top:8px}
.chk{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:400;cursor:pointer;color:var(--ink)}
.chk input{width:auto;margin:0}