:root{--ink:#1f2937;--muted:#6b7280;--accent:#004237;--accent2:#0a6b58;--bg:#f4f7f5;--card:#fff;--line:#e0e8e4;--ok:#16a34a;--warn:#d97706;--bad:#dc2626;--soft:#e7f0ec}
*{box-sizing:border-box}html{min-height:100%}
body{margin:0;font-family:'Segoe UI',system-ui,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.5;min-height:100vh;display:flex;flex-direction:column}
.wrap{flex:1 0 auto}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header.top{background:#fff;border-bottom:1px solid var(--line);padding:12px 22px;display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:5}
header.top .brand{font-weight:700;font-size:18px;color:var(--accent)}
header.top nav{margin-left:auto;display:flex;gap:16px;font-size:14px}
.wrap{max-width:1280px;margin:22px auto;padding:0 18px}
.wrap.wide{max-width:none;margin:22px 0;padding:0 32px}
@media(max-width:640px){.wrap.wide{padding:0 14px}}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:16px}
h1{font-size:22px;margin:.2em 0}h2{font-size:17px;margin:.2em 0}.sub{color:var(--muted);font-size:14px;margin:.2em 0 1em}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.acard{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;transition:.15s}
.acard:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(0,66,55,.12);text-decoration:none}
.acard .code{font-size:12px;font-weight:700;color:var(--accent);letter-spacing:.5px}
.acard .name{font-weight:600;color:var(--ink);margin:4px 0}
.pills{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.pill{font-size:12px;background:var(--soft);color:var(--accent);border-radius:20px;padding:3px 10px}
.pill.warn{background:#fff3e0;color:var(--warn)}
.tabs{display:flex;gap:6px;margin:12px 0}
.tabs a{padding:7px 14px;border-radius:8px;font-size:14px;font-weight:600;border:1px solid var(--line);background:#fff;color:var(--muted)}
.tabs a.on{background:var(--accent);color:#fff;border-color:transparent}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#fafbff;color:var(--muted);font-weight:600}
.badge{font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px}
.badge.rec{background:#fef3c7;color:#92400e}.badge.eva{background:#dcfce7;color:#166534}.badge.env{background:#dbeafe;color:#1e40af}
input,textarea,select{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:8px;font:inherit;background:#fff}
textarea{min-height:120px;resize:vertical}
label{display:block;font-size:13px;font-weight:600;margin:10px 0 4px;color:var(--ink)}
.btn{display:inline-block;background:var(--accent);color:#fff;border:none;border-radius:8px;padding:10px 18px;font:inherit;font-weight:600;cursor:pointer}
.btn:hover{background:var(--accent2);text-decoration:none}
.btn.sec{background:#fff;color:var(--accent);border:1px solid var(--accent)}
.btn.ok{background:var(--ok)}.btn.small{padding:6px 12px;font-size:13px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.note{background:var(--soft);border:1px solid #cfe1da;border-radius:8px;padding:10px 14px;font-size:13px;color:#0a4a3d}
.ok-msg{background:#dcfce7;border:1px solid #86efac;color:#166534;border-radius:8px;padding:10px 14px;margin-bottom:14px}
.link-box{font-family:ui-monospace,Consolas,monospace;background:#f3f4f8;border:1px dashed var(--line);border-radius:8px;padding:8px 12px;font-size:13px;word-break:break-all}
.muted{color:var(--muted)}.mono{font-family:ui-monospace,Consolas,monospace}
.card .hd{font-weight:700;font-size:15px;margin:-2px 0 12px;color:var(--ink)}
.tablewrap{overflow-x:auto}
details summary{cursor:pointer;display:inline-block;list-style:none}
details summary::-webkit-details-marker{display:none}

/* ---------- Zona del estudiante / equipo ---------- */
.stwrap{max-width:760px;margin:0 auto;padding:0 18px}
/* Banner ancho completo (full-bleed) */
.hero-band{background:linear-gradient(120deg,rgba(1,48,39,.92) 0%,rgba(0,66,55,.84) 52%,rgba(10,107,88,.66) 100%),url('/static/hero-bg.jpg') center/cover no-repeat;color:#fff;padding:34px 18px;box-shadow:0 8px 24px rgba(0,66,55,.20)}
.hero-band .inner{max-width:1280px;margin:0 auto}
.hero{color:#fff}
.hero .eyebrow{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;opacity:.82}
.hero .team-label{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;opacity:.82;margin-bottom:2px}
.hero h1{font-size:28px;margin:2px 0;color:#fff;letter-spacing:-.4px}
.hero .lead{opacity:.9;font-size:15px;margin:2px 0 0;max-width:60ch}
.hero .team-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.chip{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);color:#fff;border-radius:20px;padding:5px 13px;font-size:13px;font-weight:600}
.hero .chip{backdrop-filter:blur(2px)}
.chip.code{background:#fff;color:var(--accent)}
.member-row{display:flex;gap:8px;align-items:flex-start;margin-bottom:8px}
.member-row input{margin:0}
.member-row .del{flex:0 0 auto;background:#fff;color:var(--bad);border:1px solid #f0c2c2;border-radius:8px;padding:9px 12px;cursor:pointer;font:inherit;font-weight:700}
.member-head{display:flex;gap:8px;font-size:12px;font-weight:700;color:var(--muted);margin:2px 0 6px;text-transform:uppercase;letter-spacing:.5px}
.member-head span:nth-child(1){flex:1}.member-head span:nth-child(2){flex:1}.member-head span:nth-child(3){flex:1.4}.member-head span:nth-child(4){flex:0 0 44px}
.act-item{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px;background:#fff;transition:.15s}
.act-item.done{border-color:#86efac;background:#f6fef9}
.act-item .t{font-weight:600}
.err-msg{background:#fee2e2;border:1px solid #fca5a5;color:#991b1b;border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:14px}
.stepnum{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:700;align-items:center;justify-content:center;margin-right:8px}
hr.soft{border:none;border-top:1px solid var(--line);margin:18px 0}

/* ---------- Footer ---------- */
.site-foot{border-top:1px solid var(--line);background:#fff;margin-top:36px;padding:22px 18px}
.site-foot .fwrap{max-width:1280px;margin:0 auto;text-align:center}
.site-foot .fname{font-weight:700;color:var(--ink);font-size:15px}
.site-foot .frole{color:var(--muted);font-size:13px;margin:2px 0 6px}
.site-foot .fmail{font-size:14px;font-weight:600}
.site-foot .fcredit{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}

/* ---------- Fondo compartido zona estudiante ---------- */
.bg-page{background:linear-gradient(rgba(244,247,245,.80),rgba(244,247,245,.90)),url(/static/login-bg.jpg) center top/cover fixed;}
.bg-page header.top{background:rgba(255,255,255,.92);backdrop-filter:blur(6px)}
.bg-page .site-foot{background:rgba(255,255,255,.92);backdrop-filter:blur(6px)}

/* ---------- Página de acceso (login) ---------- */
.login-page{background:linear-gradient(120deg,rgba(1,48,39,.72),rgba(10,107,88,.34)),url(/static/login-bg.jpg) center/cover fixed;}
.login-page header.top{background:rgba(255,255,255,.9);backdrop-filter:blur(6px)}
.login-page .site-foot{background:rgba(255,255,255,.92);backdrop-filter:blur(6px)}
.login-page .wrap{display:flex}
.login-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:6vh 18px}
.login-card{background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.6);
  border-radius:18px;padding:34px 30px;max-width:400px;width:100%;text-align:center;
  box-shadow:0 24px 60px rgba(1,48,39,.35)}
.login-card h1{font-size:23px;margin:6px 0 2px}
.login-card .login-badge{width:60px;height:60px;border-radius:16px;margin:0 auto 8px;display:flex;
  align-items:center;justify-content:center;font-size:30px;background:var(--soft)}
.login-card label{text-align:left}

/* ---------- Panel de equipo: progreso, layout, sidebar ---------- */
.progress-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:18px 0}
.progress-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.progress-top .pct{font-size:26px;font-weight:800;color:var(--accent);line-height:1}
.progress-bar{height:12px;background:#e7f0ec;border:1px solid var(--line);border-radius:20px;overflow:hidden;margin:12px 0 8px}
.progress-bar > span{display:block;height:100%;background:linear-gradient(90deg,#0a6b58,#004237);border-radius:20px;transition:width .4s}
.progress-stats{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.progress-stats b{color:var(--ink)}
.team-grid{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}
@media(max-width:820px){.team-grid{grid-template-columns:1fr}.aside-sticky{position:static;max-height:none;overflow:visible}}
.aside-sticky{position:sticky;top:80px;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 96px);overflow-y:auto;padding-right:4px;scrollbar-width:thin}
.aside-sticky::-webkit-scrollbar{width:7px}
.aside-sticky::-webkit-scrollbar-thumb{background:#c7d6cf;border-radius:8px}
.side-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.side-card h3{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:0 0 10px}
.task{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.task:last-child{border-bottom:none}
.task .dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%;margin-top:6px;background:var(--accent)}
.task.over .dot{background:var(--bad)}.task.soon .dot{background:var(--warn)}.task.done .dot{background:var(--ok)}
.task .tt{font-size:13px;font-weight:600;color:var(--ink);line-height:1.3}
.task .td{font-size:12px;color:var(--muted);margin-top:2px}
.task .td.over{color:var(--bad);font-weight:600}.task .td.soon{color:var(--warn);font-weight:600}
.act-item .meta{display:flex;gap:12px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--muted);margin-top:4px}
.date-pill{display:inline-flex;align-items:center;gap:5px;background:var(--soft);color:var(--accent);border-radius:20px;padding:2px 10px;font-size:12px;font-weight:600}
.date-pill.over{background:#fee2e2;color:var(--bad)}.date-pill.soon{background:#fff7ed;color:var(--warn)}
.wa-card{display:flex;align-items:center;gap:12px;background:#25D366;color:#fff;border-radius:12px;padding:14px 16px;text-decoration:none;box-shadow:0 4px 14px rgba(37,211,102,.28)}
.wa-card:hover{background:#1fbe5b;text-decoration:none}
.wa-card .wa-ico{flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center}
.wa-card b{display:block;font-size:15px}
.wa-card .wa-sub{display:block;font-size:12px;opacity:.92;margin-top:1px}
.grp-head,.grp-row{display:grid;grid-template-columns:1.2fr 1.4fr 1fr;gap:12px;align-items:center}
.grp-head{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:0 0 8px;border-bottom:1px solid var(--line)}
.grp-row{padding:10px 0;border-bottom:1px solid var(--line)}
.grp-row:last-of-type{border-bottom:none}
.grp-row input[name=rol]{margin:0}
.grp-name{font-weight:600}
.grp-mail{font-size:13px;word-break:break-all}
@media(max-width:560px){.grp-head{display:none}.grp-row{grid-template-columns:1fr;gap:4px;padding:12px 0}}