:root{
  --ecv-cocoa:#24150f;
  --ecv-chocolate:#3a241b;
  --ecv-brown:#6c442e;
  --ecv-gold:#c9944d;
  --ecv-gold-2:#e0b76f;
  --ecv-cream:#fff8ee;
  --ecv-paper:#fffdf8;
  --ecv-soft:#f5e7d2;
  --ecv-line:#ead7ba;
  --ecv-muted:#7a5b47;
  --ecv-green:#2f7a4f;
  --ecv-red:#8b2020;
  --ecv-shadow:0 22px 70px rgba(57,34,21,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;font-size:17px}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  background:
    radial-gradient(circle at 8% 0%, rgba(224,183,111,.28), transparent 32%),
    radial-gradient(circle at 92% 4%, rgba(108,68,46,.18), transparent 30%),
    linear-gradient(135deg,#fff8ee 0%,#f7ead7 48%,#fffdf8 100%);
  color:var(--ecv-cocoa);
  min-height:100vh;
  line-height:1.65;
}
a{color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%}
.ecv-app{display:grid;grid-template-columns:284px minmax(0,1fr);min-height:100vh}
.ecv-sidebar{
  position:sticky;top:0;height:100vh;overflow:auto;
  background:linear-gradient(180deg,#2a1711,#3e2418 54%,#20120d);
  color:#fff8ee;padding:24px 18px;border-right:1px solid rgba(255,255,255,.08);
}
.ecv-brand{display:flex;align-items:center;gap:12px;margin-bottom:26px;padding:10px 8px}
.ecv-brand img{width:46px;height:46px;border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.28)}
.ecv-brand strong{font-family:Georgia,serif;font-size:22px;line-height:1.06;display:block}
.ecv-brand span{display:block;color:#dfc18a;font-size:15px;text-transform:uppercase;letter-spacing:.13em;margin-top:4px;font-weight:900}
.ecv-nav{display:grid;gap:6px;margin:20px 0}
.ecv-nav a{
  display:flex;align-items:center;gap:10px;text-decoration:none;
  padding:14px 14px;border-radius:14px;color:#f9ead3;font-weight:800;font-size:17px;
}
.ecv-nav a:hover,.ecv-nav a[aria-current="true"]{background:rgba(255,255,255,.1);color:#fff}
.ecv-side-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:16px;margin-top:18px;color:#f8ead4}
.ecv-side-card b{display:block;color:#fff;margin-bottom:8px}
.ecv-side-card small{color:#dfc18a;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.ecv-main{min-width:0;padding:26px clamp(18px,4vw,46px) 56px}
.ecv-topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:22px}
.ecv-mobile-brand{display:none;align-items:center;gap:10px}
.ecv-mobile-brand img{width:42px;height:42px;border-radius:12px}
.ecv-user{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.ecv-pill{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ecv-line);background:rgba(255,253,248,.9);border-radius:999px;padding:9px 13px;font-size:15px;font-weight:900;color:var(--ecv-chocolate)}
.ecv-btn,.ecv-btn-secondary,.ecv-btn-ghost,.ecv-btn-danger{
  border:0;text-decoration:none;border-radius:999px;padding:12px 16px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.15;
}
.ecv-btn{background:linear-gradient(135deg,var(--ecv-gold-2),#8b5426);color:#fff;box-shadow:0 8px 26px rgba(139,84,38,.22)}
.ecv-btn:hover{transform:translateY(-1px)}
.ecv-btn-secondary{background:#fffaf2;color:var(--ecv-chocolate);border:1px solid var(--ecv-gold)}
.ecv-btn-ghost{background:transparent;color:var(--ecv-muted);border:1px solid var(--ecv-line)}
.ecv-btn-danger{background:#fff0f0;color:var(--ecv-red);border:1px solid #e8b4b4}
.ecv-btn[disabled],.ecv-btn-secondary[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.ecv-hero{background:linear-gradient(135deg,#fffdf8,#fff7e8);border:1px solid var(--ecv-line);border-radius:34px;box-shadow:var(--ecv-shadow);padding:clamp(26px,5vw,46px);position:relative;overflow:hidden}
.ecv-hero:after{content:"";position:absolute;width:320px;height:320px;border-radius:999px;right:-90px;top:-120px;background:radial-gradient(circle,rgba(201,148,77,.2),transparent 70%);pointer-events:none}
.ecv-eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:16px;font-weight:950;color:#8b612f;margin:0 0 10px}
.ecv-h1{font-family:Georgia,serif;color:var(--ecv-chocolate);font-size:clamp(2.15rem,5.8vw,4.8rem);line-height:.98;margin:0 0 14px;letter-spacing:-.035em}
.ecv-lead{font-size:clamp(1rem,1.8vw,1.2rem);line-height:1.68;color:var(--ecv-muted);max-width:820px;margin:0 0 24px}
.ecv-hero-actions{display:flex;gap:12px;flex-wrap:wrap;position:relative;z-index:1}
.ecv-section{margin-top:26px;background:rgba(255,253,248,.78);border:1px solid var(--ecv-line);border-radius:28px;padding:clamp(20px,3vw,30px);box-shadow:0 12px 38px rgba(57,34,21,.08)}
.ecv-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.ecv-section h2{font-family:Georgia,serif;color:var(--ecv-chocolate);font-size:clamp(1.65rem,3vw,2.35rem);margin:0 0 6px;letter-spacing:-.02em}
.ecv-section p.ecv-sub{margin:0;color:var(--ecv-muted);line-height:1.58;max-width:760px}
.ecv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.ecv-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.ecv-grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.ecv-card{background:#fffaf2;border:1px solid var(--ecv-line);border-radius:22px;padding:18px;box-shadow:0 10px 30px rgba(57,34,21,.06)}
.ecv-card h3{font-size:18px;color:var(--ecv-chocolate);margin:0 0 8px}
.ecv-card p{color:var(--ecv-muted);line-height:1.55;margin:0 0 12px}
.ecv-stat{background:#fffdf8;border:1px solid var(--ecv-line);border-radius:22px;padding:18px}
.ecv-stat strong{display:block;font-family:Georgia,serif;font-size:34px;color:var(--ecv-chocolate);line-height:1}
.ecv-stat span{display:block;color:var(--ecv-muted);font-size:15px;margin-top:8px;font-weight:800}
.ecv-progress{height:13px;background:#f0dfc3;border-radius:999px;overflow:hidden;border:1px solid #e6cfaa}
.ecv-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#c9944d,#6f9f65);border-radius:999px;transition:width .35s ease}
.ecv-level{margin-top:18px;border:1px solid var(--ecv-line);background:#fffdf8;border-radius:26px;overflow:hidden}
.ecv-level-head{padding:22px;background:linear-gradient(135deg,#3a241b,#6c442e);color:#fff8ee;display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap}
.ecv-level-head h3{font-family:Georgia,serif;font-size:28px;margin:0 0 8px;color:#fff}
.ecv-level-head p{color:#f2dcb9;line-height:1.55;margin:0;max-width:760px}
.ecv-level-body{padding:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px}
.ecv-module{background:#fffaf2;border:1px solid var(--ecv-line);border-radius:22px;padding:18px;position:relative;display:flex;flex-direction:column;gap:12px;min-height:360px;scroll-margin-top:18px}
.ecv-module[data-complete="true"]{border-color:#8ab77d;background:linear-gradient(180deg,#f7fff4,#fffaf2)}
.ecv-module-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.ecv-module-num{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,#2a1711,#6c442e);color:#f0ce8a;font-weight:950;display:grid;place-items:center;flex-shrink:0}
.ecv-module h4{font-family:Georgia,serif;color:var(--ecv-chocolate);font-size:22px;line-height:1.15;margin:0}
.ecv-module small{color:#8b612f;font-weight:950;text-transform:uppercase;letter-spacing:.08em}
.ecv-module .obj{font-size:16px;color:var(--ecv-muted);line-height:1.52;margin:0}
.ecv-checks{display:grid;gap:8px;margin-top:auto}
.ecv-check{display:flex;gap:9px;align-items:flex-start;background:#fffdf8;border:1px solid #eddcc1;border-radius:13px;padding:9px 10px;color:#4d3325;font-size:16px;font-weight:750;line-height:1.3}
.ecv-check input{accent-color:var(--ecv-gold);margin-top:2px;flex-shrink:0}
.ecv-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.ecv-link{font-size:16px;font-weight:950;text-decoration:none;border:1px solid #e4c895;background:#fffdf8;border-radius:999px;padding:7px 9px;color:var(--ecv-chocolate)}
.ecv-link:hover{background:#fff2d7}
.ecv-module-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.ecv-search{width:min(100%,390px);padding:13px 16px;border:1px solid var(--ecv-line);border-radius:999px;background:#fffdf8;color:var(--ecv-chocolate);outline:none}
.ecv-form{display:grid;gap:12px}
.ecv-form label{font-size:15px;font-weight:950;color:var(--ecv-chocolate);display:grid;gap:6px}
.ecv-form input,.ecv-form select,.ecv-form textarea{width:100%;border:1px solid var(--ecv-line);border-radius:16px;background:#fffdf8;padding:12px 14px;color:var(--ecv-chocolate);outline:none}
.ecv-form textarea{min-height:126px;resize:vertical;line-height:1.55}
.ecv-note{background:#fff4df;border:1px solid #e4c895;border-radius:18px;padding:14px;color:#6b4435;line-height:1.55}
.ecv-success{background:#f0fff4;border:1px solid #b4e8c4;color:#1a6b3a;border-radius:18px;padding:14px;line-height:1.55}
.ecv-alert{background:#fff0f0;border:1px solid #e8b4b4;color:#8b2020;border-radius:18px;padding:14px;line-height:1.55}
.ecv-table{width:100%;border-collapse:separate;border-spacing:0 10px}
.ecv-table th{text-align:left;color:#8b612f;font-size:16px;text-transform:uppercase;letter-spacing:.1em}
.ecv-table td{background:#fffdf8;border-top:1px solid var(--ecv-line);border-bottom:1px solid var(--ecv-line);padding:12px;color:#4d3325;vertical-align:top}
.ecv-table td:first-child{border-left:1px solid var(--ecv-line);border-radius:14px 0 0 14px;font-weight:900;color:var(--ecv-chocolate)}
.ecv-table td:last-child{border-right:1px solid var(--ecv-line);border-radius:0 14px 14px 0}
.ecv-timeline{display:grid;gap:12px}
.ecv-timeline-item{display:grid;grid-template-columns:90px 1fr;gap:14px;background:#fffdf8;border:1px solid var(--ecv-line);border-radius:18px;padding:14px}
.ecv-timeline-item b{color:var(--ecv-chocolate)}
.ecv-timeline-item span{font-size:16px;font-weight:950;color:#8b612f;text-transform:uppercase;letter-spacing:.08em}
.ecv-cert-card{background:#fffdf8;border:1px solid var(--ecv-line);border-radius:22px;padding:20px;display:grid;gap:12px}
.ecv-lock{opacity:.58;filter:grayscale(.18)}
.ecv-entry{border:1px solid var(--ecv-line);background:#fffdf8;border-radius:18px;padding:14px;margin-bottom:10px}
.ecv-entry h4{margin:0 0 5px;color:var(--ecv-chocolate)}
.ecv-entry small{display:block;color:#8b612f;font-weight:900;margin-bottom:8px}
.ecv-entry p{white-space:pre-wrap;margin:0;color:#5d4030;line-height:1.55}
.ecv-empty{color:var(--ecv-muted);font-style:italic;background:#fffdf8;border:1px dashed #d9bd91;border-radius:16px;padding:18px;text-align:center}
.ecv-modal{position:fixed;inset:0;background:rgba(20,12,8,.62);display:none;align-items:center;justify-content:center;padding:18px;z-index:30}
.ecv-modal:not([open]){display:none !important;pointer-events:none !important;visibility:hidden !important}
.ecv-modal[open]{display:flex}
.ecv-modal-card{background:#fffdf8;border:1px solid var(--ecv-line);border-radius:28px;max-width:620px;width:100%;padding:24px;box-shadow:0 40px 110px rgba(0,0,0,.38);max-height:88vh;overflow:auto}
.ecv-modal-card h2{font-family:Georgia,serif;color:var(--ecv-chocolate);margin:0 0 8px;font-size:30px}
.ecv-legal{font-size:15px;color:#73533f;line-height:1.55}
.ecv-print-only{display:none}
@media(max-width:980px){
  .ecv-app{grid-template-columns:1fr}
  .ecv-sidebar{position:relative;height:auto;border-right:0;padding:14px;display:block}
  .ecv-brand{margin-bottom:10px}.ecv-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:10px 0}.ecv-side-card{display:none}
  .ecv-main{padding:18px 14px 40px}.ecv-topbar{align-items:flex-start}.ecv-mobile-brand{display:flex}.ecv-user{justify-content:flex-start}.ecv-hero{border-radius:26px}.ecv-level-body{grid-template-columns:1fr}.ecv-timeline-item{grid-template-columns:1fr}
}
@media(max-width:600px){
  .ecv-nav{grid-template-columns:1fr}.ecv-topbar{display:grid}.ecv-user{display:grid;grid-template-columns:1fr;width:100%}.ecv-pill,.ecv-btn,.ecv-btn-secondary,.ecv-btn-ghost,.ecv-btn-danger{width:100%}.ecv-hero-actions{display:grid}.ecv-level-head{padding:18px}.ecv-module{min-height:auto}.ecv-table{font-size:15px}
}
@media print{
  body{background:#fff}.ecv-sidebar,.ecv-topbar,.ecv-hero-actions,.ecv-btn,.ecv-btn-secondary,.ecv-btn-ghost,.ecv-btn-danger,.ecv-links,.ecv-module-actions{display:none!important}.ecv-app{display:block}.ecv-main{padding:0}.ecv-section,.ecv-hero,.ecv-card,.ecv-module,.ecv-level{box-shadow:none;break-inside:avoid}.ecv-print-only{display:block}
}

/* ===== MODO CELULAR: PANTALLA COMPLETA POR SECCIÓN ===== */
@media(max-width:600px){
  /* El aula principal se convierte en scroll vertical de pantalla completa */
  .ecv-main{
    padding:0;
    height:100vh;
    overflow-y:scroll;
    scroll-snap-type:y mandatory;
    -webkit-overflow-scrolling:touch;
  }

  /* Cada sección ocupa toda la pantalla */
  .ecv-hero,
  .ecv-section{
    scroll-snap-align:start;
    min-height:100svh;
    border-radius:0;
    border-left:0;
    border-right:0;
    margin:0;
    padding:22px 18px 80px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    overflow-y:auto;
  }

  /* Topbar fijo arriba en móvil */
  .ecv-topbar{
    position:sticky;
    top:0;
    z-index:20;
    background:rgba(255,253,248,.97);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--ecv-line);
    padding:12px 16px;
    margin:0;
    display:flex;
    flex-wrap:nowrap;
    gap:8px;
    align-items:center;
  }

  /* Sidebar en móvil: barra de nav horizontal abajo */
  .ecv-sidebar{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    top:auto;
    height:auto;
    z-index:30;
    padding:8px 10px 10px;
    background:linear-gradient(180deg,#2a1711,#20120d);
    border-top:1px solid rgba(255,255,255,.12);
    border-radius:20px 20px 0 0;
    box-shadow:0 -8px 30px rgba(0,0,0,.22);
  }

  .ecv-brand{ display:none; }
  .ecv-side-card{ display:none; }

  .ecv-nav{
    display:flex;
    flex-direction:row;
    overflow-x:auto;
    gap:6px;
    margin:0;
    padding-bottom:2px;
    scrollbar-width:none;
  }
  .ecv-nav::-webkit-scrollbar{ display:none; }
  .ecv-nav a{
    flex-shrink:0;
    padding:10px 14px;
    font-size:13px;
    border-radius:12px;
    white-space:nowrap;
  }

  /* El app grid: sidebar abajo, main arriba */
  .ecv-app{
    display:flex;
    flex-direction:column-reverse;
    height:100vh;
    overflow:hidden;
  }

  /* Módulos en móvil: cada uno más grande */
  .ecv-module{
    min-height:auto;
    padding:20px;
  }
  .ecv-module h4{
    font-size:22px;
  }
  .ecv-h1{
    font-size:2.4rem;
    line-height:1.05;
  }

  /* Pills de usuario más compactos */
  .ecv-pill{ width:auto; font-size:14px; }
  .ecv-btn,.ecv-btn-secondary,.ecv-btn-ghost,.ecv-btn-danger{ width:100%; font-size:17px; padding:15px; }
  
  /* Stats más grandes */
  .ecv-stat strong{ font-size:42px; }
  .ecv-stat span{ font-size:15px; }
}
