:root{
  --navy:#071829;--navy2:#0b2740;--blue:#123a5d;--gold:#c9a35f;--gold2:#e0c58d;
  --ink:#142433;--muted:#667482;--bg:#f4f7f9;--card:#fff;--line:#e2e8ed;--green:#197a57;
  --green-bg:#eaf7f1;--amber:#a66b12;--amber-bg:#fff5df;--red:#a43c3c;--red-bg:#fff0f0;
  --shadow:0 14px 40px rgba(17,40,62,.09)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:'Lato',sans-serif;color:var(--ink);background:var(--bg)}
button,input,select,textarea{font:inherit}button,a{transition:.18s ease}.demo-strip{height:30px;display:flex;align-items:center;justify-content:center;background:#c9a35f;color:#071829;font:800 11px/1 'Montserrat',sans-serif;letter-spacing:.08em;text-transform:uppercase}
.portal-header{height:76px;background:var(--navy);display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:20}
.portal-brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}.portal-brand img{width:48px;height:48px;object-fit:contain}.portal-brand span{display:flex;flex-direction:column;align-items:center}.portal-brand strong{font:800 14px/1 'Montserrat',sans-serif}.portal-brand small{margin-top:5px;color:var(--gold);font:800 8px/1 'Montserrat',sans-serif;letter-spacing:.15em;text-transform:uppercase}
.header-actions{display:flex;align-items:center;gap:18px}.back-site{color:rgba(255,255,255,.75);text-decoration:none;font:600 12px 'Montserrat',sans-serif}.back-site:hover{color:#fff}.avatar-button{border:1px solid rgba(255,255,255,.25);width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font:800 11px 'Montserrat',sans-serif;cursor:pointer}
.portal-shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:calc(100vh - 106px)}.sidebar{background:#fff;border-right:1px solid var(--line);padding:24px 16px;display:flex;flex-direction:column;position:sticky;top:76px;height:calc(100vh - 76px)}
.role-box{padding:0 8px 18px;border-bottom:1px solid var(--line);margin-bottom:16px}.role-box label{display:block;font:800 10px 'Montserrat',sans-serif;color:var(--muted);letter-spacing:.09em;text-transform:uppercase;margin-bottom:8px}.role-box select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-weight:700}
#sideNav{display:flex;flex-direction:column;gap:4px}.nav-item{border:0;background:transparent;text-align:left;width:100%;padding:11px 12px;border-radius:8px;color:#53616d;font:700 13px 'Montserrat',sans-serif;cursor:pointer;display:flex;align-items:center;gap:10px}.nav-item:hover{background:#f4f7f9;color:var(--navy)}.nav-item.active{background:#edf3f7;color:var(--navy)}.nav-count{margin-left:auto;background:var(--gold);color:var(--navy);padding:2px 7px;border-radius:99px;font-size:10px}
.sidebar-bottom{margin-top:auto}.privacy-note{display:flex;gap:9px;background:#f7f9fa;border:1px solid var(--line);padding:12px;border-radius:10px;color:var(--muted);font-size:11px;line-height:1.45}.privacy-note p{margin:0}.privacy-note strong{color:var(--ink)}.text-button{margin:12px auto 0;display:block;border:0;background:none;color:#7b8790;text-decoration:underline;font-size:11px;cursor:pointer}
.main{padding:34px;max-width:1440px;width:100%;margin:0 auto}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:26px}.eyebrow{font:800 10px 'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);margin-bottom:8px}.page-head h1{font:800 clamp(25px,3vw,36px)/1.12 'Montserrat',sans-serif;color:var(--navy);margin:0}.page-head p{margin:7px 0 0;color:var(--muted);font-size:15px}.head-actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{border:0;border-radius:8px;padding:11px 16px;font:800 12px 'Montserrat',sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none}.btn-primary{background:var(--gold);color:var(--navy)}.btn-primary:hover{background:var(--gold2);transform:translateY(-1px)}.btn-dark{background:var(--navy);color:#fff}.btn-light{background:#fff;color:var(--navy);border:1px solid var(--line)}.btn-danger{background:var(--red-bg);color:var(--red)}.btn-small{padding:8px 11px;font-size:10px}
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:24px}.kpi{background:#fff;border:1px solid var(--line);border-radius:13px;padding:19px;box-shadow:0 8px 25px rgba(17,40,62,.04)}.kpi-top{display:flex;justify-content:space-between;align-items:center}.kpi-label{font:800 10px 'Montserrat',sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.kpi-icon{width:32px;height:32px;border-radius:8px;background:#f1f5f7;display:grid;place-items:center}.kpi-value{font:800 29px/1 'Montserrat',sans-serif;color:var(--navy);margin-top:15px}.kpi-foot{font-size:12px;color:var(--muted);margin-top:8px}.kpi-foot.good{color:var(--green)}
.grid-2{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);gap:20px}.card{background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 8px 25px rgba(17,40,62,.04);overflow:hidden}.card-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}.card-head h2,.card-head h3{margin:0;font:800 15px 'Montserrat',sans-serif;color:var(--navy)}.card-body{padding:20px}.card-link{border:0;background:none;color:var(--blue);font-weight:700;font-size:12px;cursor:pointer}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:680px}th{text-align:left;font:800 9px 'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#82909c;background:#fafbfc;padding:11px 14px;border-bottom:1px solid var(--line)}td{padding:13px 14px;border-bottom:1px solid #edf1f4;font-size:13px;vertical-align:middle}tr:last-child td{border-bottom:0}.person{display:flex;align-items:center;gap:10px}.person-avatar{width:34px;height:34px;border-radius:50%;background:#e8eef3;color:var(--navy);display:grid;place-items:center;font:800 10px 'Montserrat',sans-serif;flex:none}.person strong{display:block;color:var(--ink)}.person small{display:block;color:var(--muted);margin-top:2px}.pill{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font:800 9px 'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:.05em}.pill.green{color:var(--green);background:var(--green-bg)}.pill.amber{color:var(--amber);background:var(--amber-bg)}.pill.red{color:var(--red);background:var(--red-bg)}.pill.gray{color:#687684;background:#eef2f5}.dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.progress{height:7px;border-radius:99px;background:#edf1f4;overflow:hidden}.progress span{display:block;height:100%;background:var(--gold);border-radius:99px}.progress-meta{display:flex;justify-content:space-between;margin-top:6px;color:var(--muted);font-size:10px}.empty{padding:34px 20px;text-align:center;color:var(--muted)}
.activity-list{display:flex;flex-direction:column}.activity{display:flex;gap:11px;padding:13px 0;border-bottom:1px solid #edf1f4}.activity:last-child{border-bottom:0}.activity-icon{width:31px;height:31px;border-radius:8px;background:#f0f4f7;display:grid;place-items:center;flex:none}.activity p{margin:0;font-size:12px;line-height:1.4}.activity time{display:block;color:var(--muted);font-size:10px;margin-top:4px}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap}.search{flex:1;min-width:220px;position:relative}.search input,.filter-select{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;padding:10px 12px;color:var(--ink);outline:none}.filter-select{width:auto;min-width:150px}.search input:focus,.filter-select:focus{border-color:#b9c7d2;box-shadow:0 0 0 3px rgba(18,58,93,.07)}
.student-hero{background:linear-gradient(135deg,var(--navy),#113c5e);color:#fff;border-radius:16px;padding:26px;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;margin-bottom:20px;box-shadow:var(--shadow)}.student-hero h1{margin:3px 0 7px;font:800 28px 'Montserrat',sans-serif}.student-hero p{margin:0;color:rgba(255,255,255,.72)}.hero-stat{text-align:right}.hero-stat strong{display:block;font:800 34px 'Montserrat',sans-serif;color:var(--gold)}.hero-stat span{font-size:12px;color:rgba(255,255,255,.75)}
.clock-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:22px}.clock-status{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.live-badge{display:inline-flex;align-items:center;gap:7px;color:var(--green);font-weight:700;font-size:12px}.live-badge i{width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 0 4px rgba(25,122,87,.12)}.clock-time{font:800 32px 'Montserrat',sans-serif;color:var(--navy);margin:6px 0}.clock-meta{color:var(--muted);font-size:12px}.clock-card .btn{width:100%;margin-top:18px;padding:14px}.location-box{margin-top:12px;padding:10px;border:1px dashed #cfd8df;border-radius:8px;color:var(--muted);font-size:11px;text-align:center}
.hours-block{padding:20px}.hours-big{display:flex;align-items:end;gap:7px;margin-bottom:12px}.hours-big strong{font:800 31px 'Montserrat',sans-serif;color:var(--navy)}.hours-big span{color:var(--muted);font-size:13px;padding-bottom:4px}.hours-row{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-top:9px}.hours-row strong{color:var(--ink)}
.schedule-list{display:flex;flex-direction:column;gap:10px}.schedule-item{border:1px solid var(--line);border-radius:10px;padding:13px;display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:12px}.schedule-date{text-align:center;border-right:1px solid var(--line);padding-right:12px}.schedule-date strong{display:block;font:800 20px 'Montserrat',sans-serif;color:var(--navy)}.schedule-date span{font:800 9px 'Montserrat',sans-serif;text-transform:uppercase;color:var(--muted)}.schedule-info strong{display:block;font-size:13px}.schedule-info span{font-size:11px;color:var(--muted)}
.approval-card{padding:16px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center}.approval-card:last-child{border-bottom:0}.approval-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px;color:var(--muted);font-size:11px}.approval-actions{display:flex;gap:7px}.approval-hours{font:800 20px 'Montserrat',sans-serif;color:var(--navy);text-align:right}.approval-hours small{display:block;font:400 10px 'Lato',sans-serif;color:var(--muted);margin-top:2px}
.report-box{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.report-option{border:1px solid var(--line);border-radius:12px;padding:18px;background:#fff}.report-option h3{font:800 14px 'Montserrat',sans-serif;color:var(--navy);margin:8px 0}.report-option p{font-size:12px;line-height:1.5;color:var(--muted);min-height:54px}.report-icon{font-size:24px}
.modal-backdrop{position:fixed;inset:0;background:rgba(2,15,26,.6);display:grid;place-items:center;padding:22px;z-index:100}.modal-backdrop[hidden]{display:none}.modal{position:relative;background:#fff;border-radius:15px;width:min(580px,100%);max-height:90vh;overflow:auto;box-shadow:0 24px 70px rgba(0,0,0,.25)}.modal-close{position:absolute;right:14px;top:12px;border:0;background:#f0f3f5;width:32px;height:32px;border-radius:50%;font-size:20px;cursor:pointer;color:var(--muted)}.modal-content{padding:27px}.modal-content h2{font:800 21px 'Montserrat',sans-serif;color:var(--navy);margin:0 0 6px}.modal-content>p{margin:0 0 20px;color:var(--muted);font-size:13px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font:800 9px 'Montserrat',sans-serif;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:8px;padding:11px 12px;outline:none}.field textarea{min-height:90px;resize:vertical}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.toast{position:fixed;right:24px;bottom:24px;background:var(--navy);color:#fff;padding:13px 17px;border-radius:10px;box-shadow:var(--shadow);font-size:12px;transform:translateY(120px);opacity:0;z-index:200}.toast.show{transform:translateY(0);opacity:1}.toast strong{color:var(--gold)}
.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.detail{background:#f7f9fa;border:1px solid var(--line);padding:12px;border-radius:9px}.detail span{display:block;font:800 8px 'Montserrat',sans-serif;text-transform:uppercase;color:var(--muted);letter-spacing:.06em}.detail strong{display:block;margin-top:5px;font-size:13px}

.alert-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 17px;border-radius:11px;margin-bottom:18px;border:1px solid var(--line);background:#fff}.alert-banner>div{display:flex;flex-direction:column;gap:4px}.alert-banner strong{font:800 12px 'Montserrat',sans-serif;color:var(--navy)}.alert-banner span{font-size:12px;line-height:1.45;color:var(--muted)}.alert-banner.warning{background:var(--amber-bg);border-color:#efd9aa}.alert-banner.warning strong{color:#7a4e0d}.alert-banner.info{background:#eef5fa;border-color:#cfdeea}.alert-banner.compact{margin:14px 0 0;padding:10px 12px}.exception-note{margin-top:9px;padding:8px 10px;border-radius:7px;background:var(--amber-bg);color:#79521a;font-size:11px;line-height:1.45}.clock-card .alert-banner{margin-bottom:0}.clock-card .alert-banner+ .btn{margin-top:12px}

.mobile-nav{display:none}
@media(max-width:1050px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.report-box{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.alert-banner{align-items:flex-start;flex-direction:column}.alert-banner .btn{width:100%}.demo-strip{font-size:8px;height:26px}.portal-header{height:66px;padding:0 14px}.portal-brand img{width:42px;height:42px}.portal-brand strong{font-size:12px}.portal-brand small{font-size:7px}.back-site{display:none}.portal-shell{display:block;min-height:auto}.sidebar{position:fixed;bottom:0;top:auto;left:0;right:0;height:68px;z-index:50;padding:0;background:#fff;border-right:0;border-top:1px solid var(--line)}.role-box,.sidebar-bottom{display:none}#sideNav{height:100%;display:flex;flex-direction:row;justify-content:space-around}.nav-item{flex:1;flex-direction:column;justify-content:center;gap:3px;padding:7px 3px;border-radius:0;text-align:center;font-size:9px}.nav-item span:first-child{font-size:18px}.nav-count{position:absolute;margin-left:28px;margin-top:-22px}.main{padding:22px 14px 88px}.page-head{flex-direction:column}.page-head h1{font-size:26px}.head-actions{width:100%}.head-actions .btn{flex:1}.kpi-grid{grid-template-columns:1fr 1fr;gap:9px}.kpi{padding:14px}.kpi-value{font-size:24px}.student-hero{grid-template-columns:1fr;padding:20px}.hero-stat{text-align:left;display:flex;align-items:baseline;gap:8px}.student-hero h1{font-size:24px}.grid-2{gap:14px}.report-box{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.approval-card{grid-template-columns:1fr}.approval-actions{justify-content:flex-start}.approval-hours{text-align:left}.detail-grid{grid-template-columns:1fr 1fr}.schedule-item{grid-template-columns:55px 1fr}.schedule-item .pill{display:none}}
@media(max-width:420px){.kpi-grid{grid-template-columns:1fr}.detail-grid{grid-template-columns:1fr}.portal-brand span{align-items:flex-start}.header-actions{gap:6px}.student-hero h1{font-size:21px}}
@media print{.demo-strip,.portal-header,.sidebar,.head-actions,.toolbar,.btn,.card-link{display:none!important}.portal-shell{display:block}.main{padding:0;max-width:none}.card{box-shadow:none;border-color:#bbb}.page-head{margin-bottom:15px}}
