:root{
 --green:#08752f;--green-dark:#045d27;--green-soft:#e8f6ee;
 --yellow:#ffcc3d;--navy:#071b3a;--text:#111827;--muted:#667085;
 --line:#dfe5e2;--bg:#f4f7f5;--white:#fff;--orange:#ff7a16;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}
a{text-decoration:none;color:inherit}
input,select,textarea{width:100%;padding:12px 13px;border:1px solid #d5ddd8;border-radius:10px;margin:7px 0 16px;font-size:15px;outline:none;background:#fff}
input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(8,117,47,.1)}
label{font-size:14px;font-weight:700}
.btn{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:10px;padding:12px 18px;font-weight:800;cursor:pointer}
.btn.primary{background:var(--green);color:#fff}
.btn.secondary{background:#fff;color:var(--green);border:1px solid #cbd8cf}
.full{width:100%}
.muted{color:var(--muted);line-height:1.5}
.alert{padding:11px 13px;border-radius:10px;margin:14px 0;font-size:14px}
.alert.error{background:#fff0f0;color:#a21c1c;border:1px solid #ffcaca}
.alert.success{background:#ebfaef;color:#176b2d;border:1px solid #b9e9c5}

.brand-badge{width:64px;height:64px;border-radius:16px;background:#fff;color:var(--green);display:grid;place-items:center;font-weight:1000;box-shadow:inset 0 0 0 4px var(--yellow)}
.brand-badge.small{width:46px;height:46px;border-radius:12px}

.app-page{min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:296px;background:linear-gradient(180deg,#08752f,#045f28);color:#fff;padding:20px 16px;overflow:auto}
.sidebar-brand{display:flex;gap:12px;align-items:center}
.sidebar-brand strong{display:block;font-size:25px}
.sidebar-brand span{display:block;color:var(--yellow);font-weight:800;font-size:13px}
.sidebar-caption{font-size:12px;line-height:1.55;color:#dceee3;margin:14px 6px 20px}
.nav-link{display:flex;align-items:center;gap:14px;padding:13px 14px;border-radius:12px;margin:4px 0;font-weight:750}
.nav-link.active{background:var(--yellow);color:#064f25}
.nav-link.disabled{opacity:.92}
.nav-link.disabled:hover{background:rgba(255,255,255,.08)}
.nav-heading{font-size:12px;font-weight:900;letter-spacing:.08em;color:#9fd1ae;margin:22px 8px 8px}

.main{margin-left:296px;min-height:100vh}
.topbar{height:96px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 38px;position:sticky;top:0;z-index:5}
.topbar h1{margin:0;font-size:29px;color:var(--navy)}
.topbar h1 span{color:var(--green)}
.topbar p{margin:3px 0 0;color:#536176}
.profile{display:flex;align-items:center;gap:11px}
.profile strong,.profile span{display:block}
.profile span{font-size:12px;color:var(--muted)}
.avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:900}
.logout{font-size:13px;font-weight:800;color:var(--green);margin-left:6px}

.content{padding:34px}
.content>h2{margin:0;color:var(--navy);font-size:25px}
.section-subtitle{color:var(--muted);margin:4px 0 18px}

.quick-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.quick-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;min-height:190px;box-shadow:0 5px 16px rgba(26,61,42,.04)}
.quick-card.clickable{transition:.15s}
.quick-card.clickable:hover{transform:translateY(-2px);border-color:#b7d5c1;box-shadow:0 10px 28px rgba(26,61,42,.08)}
.quick-card h3{color:#152033;font-size:17px;margin:15px 0 8px}
.quick-card p{color:var(--muted);font-size:13px;line-height:1.55}
.quick-card span{font-size:11px;color:var(--green);font-weight:800}
.quick-icon{width:50px;height:50px;border-radius:14px;background:#e7f6ed;color:var(--green);display:grid;place-items:center;font-size:24px;font-weight:900}
.quick-icon.warn{background:#fff3d3;color:#e59600}
.quick-icon.good{background:#e7f6ed}
.quick-icon.info{background:#e8f3ff;color:#1769aa}
.quick-icon.award{background:#fff3d3;color:#d38c00}

.dashboard-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;margin-top:18px}
.panel{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden}
.panel-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid #e8ecea}
.panel-head h2{font-size:18px;color:var(--navy);margin:0}
.panel-head span{font-size:12px;color:var(--muted)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px}
.stat{padding:18px;border:1px solid #e8ecea;border-radius:14px;background:#fff}
.stat strong{display:block;color:var(--navy);font-size:27px}
.stat span{font-size:12px;color:var(--muted)}
.case-list{padding:14px 20px}
.case-list div{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid #eef1ef}
.case-list div:last-child{border:0}
.empty-panel{margin-top:16px}
.empty-panel>p{padding:18px 20px;color:var(--muted)}

.page-title{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}
.page-title h2{margin:0;color:var(--navy);font-size:26px}
.page-title p{margin:4px 0 0;color:var(--muted)}
.page-actions{display:flex;gap:10px;flex-wrap:wrap}

.filters{display:flex;gap:12px;align-items:flex-end;padding:16px}
.filters .grow{flex:1}
.filters>div:not(.grow){min-width:150px}
.filter-btn{margin-bottom:16px}

.table-wrap{overflow:auto}
.data-table{width:100%;border-collapse:collapse;min-width:760px}
.data-table th,.data-table td{padding:14px 18px;border-bottom:1px solid #edf0ee;text-align:left;font-size:14px}
.data-table th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#657181;background:#fbfcfb}
.data-table td small{display:block;color:var(--muted);margin-top:3px}
.empty-cell{text-align:center!important;color:var(--muted);padding:30px!important}
.badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800}
.badge.green{background:#e7f6ed;color:#08752f}
.badge.gray{background:#edf0ef;color:#59635e}
.table-link{color:var(--green);font-weight:800;margin-right:12px}
.muted-link{color:#667085}
.actions-cell{white-space:nowrap}

.form-body{padding:22px}
.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0 14px}
.span2{grid-column:span 2}
.span3{grid-column:span 3}
.span4{grid-column:span 4}
.form-section-title{font-weight:900;color:var(--navy);border-top:1px solid var(--line);padding-top:20px;margin:8px 0 10px}
.form-actions{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:20px;margin-top:8px}
.two-col{display:grid;grid-template-columns:1fr 1.35fr;gap:16px}
.link-button{border:0;background:none;color:var(--green);font-weight:800;cursor:pointer;padding:0}

/* FICHA DEL ESTUDIANTE */
.student-hero{
 display:flex;
 align-items:center;
 gap:20px;
 background:#fff;
 border:1px solid var(--line);
 border-radius:20px;
 padding:24px 26px;
 box-shadow:0 5px 18px rgba(20,55,37,.04)
}
.student-avatar{
 flex:0 0 78px;
 width:78px;
 height:78px;
 border-radius:22px;
 background:var(--green-soft);
 border:1px solid #d4ecdc;
 color:var(--green);
 display:grid;
 place-items:center;
 font-size:25px;
 font-weight:900;
 letter-spacing:.02em
}
.student-main{flex:1;min-width:0}
.student-main h2{font-size:28px;line-height:1.15;color:var(--navy);margin:5px 0 8px}
.student-main p{margin:0;color:var(--muted);font-size:14px}
.eyebrow-dark{
 display:inline-flex;
 padding:5px 9px;
 border-radius:999px;
 background:var(--green-soft);
 color:var(--green);
 font-size:12px;
 font-weight:900
}
.points-box{
 min-width:110px;
 text-align:center;
 padding:7px 22px;
 border-left:1px solid var(--line);
 border-right:1px solid var(--line)
}
.points-box strong{display:block;font-size:32px;line-height:1;color:var(--navy)}
.points-box span{display:block;margin-top:5px;font-size:12px;color:var(--muted)}

.student-stats{padding:0;margin:16px 0}
.student-stats .stat{min-height:92px}
.student-details{grid-template-columns:1fr 1fr}

.detail-list{padding:8px 20px 12px}
.detail-list div{
 display:grid;
 grid-template-columns:minmax(130px,40%) 1fr;
 align-items:start;
 gap:20px;
 padding:13px 0;
 border-bottom:1px solid #edf0ee
}
.detail-list div:last-child{border-bottom:0}
.detail-list span{color:var(--muted);font-size:13px}
.detail-list strong{color:var(--text);font-size:13px;text-align:right;overflow-wrap:anywhere}

@media(max-width:1100px){
 .quick-grid{grid-template-columns:repeat(2,1fr)}
 .dashboard-grid,.two-col,.student-details{grid-template-columns:1fr}
 .stat-grid{grid-template-columns:repeat(2,1fr)}
 .form-grid{grid-template-columns:repeat(2,1fr)}
 .span3,.span4{grid-column:span 2}
 .student-hero{flex-wrap:wrap}
}
@media(max-width:760px){
 .sidebar{width:76px;padding:16px 10px}
 .sidebar-brand>div:last-child,.sidebar-caption,.nav-link span,.nav-heading{display:none}
 .nav-link{justify-content:center;font-size:22px}
 .main{margin-left:76px}
 .topbar{height:auto;min-height:82px;padding:14px 18px}
 .profile>div:not(.avatar),.logout{display:none}
 .content{padding:20px}
 .quick-grid{grid-template-columns:1fr}
 .page-title{align-items:flex-start;flex-direction:column}
 .filters{flex-direction:column;align-items:stretch}
 .filters>div:not(.grow){min-width:0}
 .filter-btn{margin-bottom:0}
 .form-grid{grid-template-columns:1fr}
 .span2,.span3,.span4{grid-column:span 1}
 .student-hero{align-items:flex-start}
 .student-avatar{flex-basis:64px;width:64px;height:64px;border-radius:18px}
 .student-main{flex-basis:calc(100% - 90px)}
 .points-box{border:0;padding:4px 0;min-width:auto}
 .student-stats{grid-template-columns:repeat(2,1fr)}
 .detail-list div{grid-template-columns:1fr;gap:4px}
 .detail-list strong{text-align:left}
}