:root{--sidebar:250px;--primary:#0d6efd;--bg:#f4f7fb}*{box-sizing:border-box}body{background:var(--bg);color:#24324a}.brand-logo{width:32px;height:32px;object-fit:contain;background:#fff;border-radius:8px;padding:2px}.app-shell{display:flex;min-height:calc(100vh - 56px)}.sidebar{position:fixed;top:56px;bottom:0;width:var(--sidebar);background:linear-gradient(180deg,#173b75,#102a54);overflow-y:auto;z-index:1020}.sidebar .nav-link{color:#dce7f8;border-radius:9px;margin:2px 0;padding:.65rem .75rem}.sidebar .nav-link:hover{background:rgba(255,255,255,.12);color:#fff}.sidebar .nav-link i{width:25px}.nav-label{font-size:.68rem;text-transform:uppercase;color:#91a8ca;padding:1rem .75rem .35rem;letter-spacing:.08em}.app-main{margin-left:var(--sidebar);width:calc(100% - var(--sidebar))}.student-main{margin-left:0;width:100%;padding-bottom:78px}.card{border:0;border-radius:16px;box-shadow:0 6px 22px rgba(31,52,90,.08)}.stat-card{overflow:hidden}.stat-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:1.35rem}.table-responsive{border-radius:14px}.table>thead th{white-space:nowrap;background:#eef3fb;color:#38517a}.avatar{width:44px;height:44px;object-fit:cover;border-radius:50%;background:#e6edf7}.camera-frame{position:relative;background:#101820;border-radius:18px;overflow:hidden;aspect-ratio:3/4;max-height:610px}.camera-frame video,.camera-frame canvas,.camera-frame img{width:100%;height:100%;object-fit:cover}.camera-overlay{position:absolute;inset:0;pointer-events:none;border:3px solid rgba(255,255,255,.28);border-radius:18px}.map{height:330px;border-radius:16px;overflow:hidden}.student-bottom-nav{display:none}.status-pill{font-size:.78rem}.print-only{display:none}.login-page{min-height:100vh;background:linear-gradient(135deg,#0d6efd,#163b70);display:grid;place-items:center;padding:20px}.login-card{width:min(430px,100%);border-radius:22px}.hero-clock{font-size:2rem;font-weight:700}.sticky-actions{position:sticky;bottom:12px;z-index:5}.required:after{content:' *';color:#dc3545}.photo-thumb{width:70px;height:70px;object-fit:cover;border-radius:10px}.modal-map{height:450px}.dark-mode{filter:invert(.92) hue-rotate(180deg)}.dark-mode img,.dark-mode video,.dark-mode canvas,.dark-mode .leaflet-container{filter:invert(1) hue-rotate(180deg)}
@media(max-width:991.98px){.sidebar{transform:translateX(-100%)}.app-main{margin-left:0;width:100%}.student-bottom-nav{position:fixed;display:flex;left:8px;right:8px;bottom:8px;background:#fff;border-radius:18px;box-shadow:0 7px 28px rgba(0,0,0,.17);z-index:1050;justify-content:space-around;padding:8px 4px}.student-bottom-nav a{color:#62728d;text-decoration:none;text-align:center;font-size:.72rem;min-width:55px}.student-bottom-nav a i{display:block;font-size:1.25rem}.student-bottom-nav a:hover{color:var(--primary)}}
@media print{.navbar,.sidebar,.student-bottom-nav,.no-print,.btn,.pagination{display:none!important}.app-main{margin:0;width:100%}.container-fluid{padding:0!important}.card{box-shadow:none;border:1px solid #ddd}.print-only{display:block}.table{font-size:10px}body{background:#fff}}

/* Multi-login Administrator, Guru Pembimbing, dan Siswa */
.multi-login-page{padding:24px;background:radial-gradient(circle at top right,rgba(255,255,255,.17),transparent 32%),linear-gradient(135deg,#0b5ed7 0%,#173b75 52%,#0b2447 100%)}
.multi-login-card{width:min(920px,100%);border-radius:26px;box-shadow:0 25px 70px rgba(4,25,61,.32)}
.login-brand-panel{min-height:620px;padding:52px 42px;color:#fff;align-items:center;background:linear-gradient(155deg,rgba(13,110,253,.96),rgba(12,45,94,.98)),url('../img/izin-placeholder.svg') center/cover}
.login-brand-icon{width:72px;height:72px;border-radius:22px;display:grid;place-items:center;font-size:2.25rem;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.login-feature{display:flex;align-items:center;gap:12px;margin-top:17px;color:rgba(255,255,255,.9)}
.login-feature i{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:rgba(255,255,255,.13)}
.role-login-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.role-login-option{min-height:104px;padding:12px 7px;border:2px solid #e5eaf2;border-radius:16px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;font-size:.82rem;font-weight:700;color:#52617a;cursor:pointer;transition:all .18s ease;user-select:none}
.role-login-option:hover{border-color:#9fc3ff;transform:translateY(-2px);box-shadow:0 8px 22px rgba(13,110,253,.1)}
.btn-check:focus+.role-login-option{box-shadow:0 0 0 .25rem rgba(13,110,253,.2)}
.btn-check:checked+.role-login-option{border-color:#0d6efd;color:#0b5ed7;background:#f3f7ff;box-shadow:0 8px 22px rgba(13,110,253,.13)}
.role-login-icon{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;font-size:1.25rem}
.role-login-icon.role-admin{background:#fff0f0;color:#dc3545}
.role-login-icon.role-guru{background:#fff7df;color:#b77900}
.role-login-icon.role-siswa{background:#eaf8f0;color:#198754}
.btn-check:checked+.role-login-option .role-login-icon{box-shadow:0 0 0 4px rgba(13,110,253,.08)}
.login-input-group .input-group-text{background:#f6f8fc;border-color:#dce3ef;color:#60708b}
.login-input-group .form-control,.login-input-group .btn{border-color:#dce3ef}
.login-input-group:focus-within .input-group-text,.login-input-group:focus-within .form-control,.login-input-group:focus-within .btn{border-color:#86b7fe}
.login-submit-btn{border-radius:13px;padding:.82rem 1rem;font-weight:700;box-shadow:0 9px 20px rgba(13,110,253,.24)}
@media(max-width:575.98px){.multi-login-page{padding:12px}.multi-login-card{border-radius:20px}.role-login-grid{gap:7px}.role-login-option{min-height:94px;padding:10px 5px;font-size:.72rem}.role-login-icon{width:38px;height:38px;font-size:1.08rem}}

/* =========================================================
   Tema Hijau SKARISA v1.3
   ========================================================= */
:root{
  --primary:#168553;
  --primary-dark:#0b5d3b;
  --primary-soft:#e5f6ed;
  --bs-primary:#168553;
  --bs-primary-rgb:22,133,83;
  --bg:#f3f8f5;
}
body{background:var(--bg);color:#243b31}
a{color:#137347}.text-primary{color:#168553!important}.bg-primary{background-color:#168553!important}.border-primary{border-color:#168553!important}.bg-primary-subtle{background-color:#dff4e8!important}.text-bg-primary{background-color:#168553!important;color:#fff!important}
.btn-primary{--bs-btn-color:#fff;--bs-btn-bg:#168553;--bs-btn-border-color:#168553;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0f7045;--bs-btn-hover-border-color:#0d663f;--bs-btn-focus-shadow-rgb:22,133,83;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0d663f;--bs-btn-active-border-color:#0b5d3b;--bs-btn-disabled-bg:#168553;--bs-btn-disabled-border-color:#168553}
.btn-outline-primary{--bs-btn-color:#168553;--bs-btn-border-color:#168553;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#168553;--bs-btn-hover-border-color:#168553;--bs-btn-focus-shadow-rgb:22,133,83;--bs-btn-active-color:#fff;--bs-btn-active-bg:#168553;--bs-btn-active-border-color:#168553}
.form-control:focus,.form-select:focus{border-color:#75c89e;box-shadow:0 0 0 .25rem rgba(22,133,83,.16)}
.form-check-input:checked{background-color:#168553;border-color:#168553}.page-link{color:#168553}.active>.page-link,.page-link.active{background-color:#168553;border-color:#168553}
.navbar.bg-primary{background:linear-gradient(90deg,#0b5d3b,#168553)!important}
.sidebar{background:linear-gradient(180deg,#0b5d3b,#073d28)}
.sidebar .nav-link{color:#dcf4e6}.sidebar .nav-link:hover{background:rgba(255,255,255,.13);color:#fff}.nav-label{color:#8fd0ad}
.table>thead th{background:#e6f4ec;color:#24543d}
.card{box-shadow:0 6px 22px rgba(26,78,52,.08)}
.brand-logo{width:38px;height:38px;border-radius:50%;padding:1px;background:#fff;box-shadow:0 2px 9px rgba(0,0,0,.15)}
.navbar-brand{display:flex;align-items:center;gap:8px}
.student-hero{background:radial-gradient(circle at top right,rgba(255,255,255,.22),transparent 34%),linear-gradient(135deg,#1ca56a,#0b5d3b);overflow:hidden}
.journal-today-card{background:linear-gradient(145deg,#168553,#0b5d3b);color:#fff}
.journal-preview-text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.journal-feedback-mini{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.14);font-size:.86rem}.journal-feedback-mini span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dashboard-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.dashboard-actions .btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:92px;border-radius:16px;font-weight:700}.dashboard-actions .btn i{font-size:1.45rem}.btn-journal{color:#fff;background:#7754b8;border-color:#7754b8}.btn-journal:hover{color:#fff;background:#6543a5;border-color:#60409d}
.activity-photo-card{position:relative;display:block;height:210px;overflow:hidden;border-radius:16px;color:#fff;text-decoration:none}.activity-photo-card img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease}.activity-photo-card:hover img{transform:scale(1.035)}.activity-photo-overlay{position:absolute;inset:auto 0 0;padding:48px 15px 14px;background:linear-gradient(transparent,rgba(3,31,19,.92));display:flex;flex-direction:column}.activity-photo-overlay span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.85rem;opacity:.9}.activity-photo-overlay small{color:#bdf1d2;margin-top:5px}
.journal-form-card{overflow:hidden}.journal-current-photo{width:100%;max-height:390px;object-fit:cover;border-radius:16px}.feedback-avatar{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:#dff4e8;color:#168553;font-size:1.3rem}.feedback-text{white-space:normal;line-height:1.65}.journal-history-list,.teacher-journal-list{max-height:820px;overflow-y:auto}.journal-history-item,.teacher-journal-item,.teacher-dashboard-journal{display:flex;gap:12px;padding:11px;border:1px solid transparent;border-radius:14px;text-decoration:none;color:inherit;margin-bottom:7px;transition:.16s ease}.journal-history-item:hover,.teacher-journal-item:hover,.teacher-dashboard-journal:hover{background:#f0f8f4;border-color:#ccebd9}.journal-history-item.active,.teacher-journal-item.active{background:#e3f5eb;border-color:#75c89e}.journal-history-item img,.teacher-journal-item img,.teacher-dashboard-journal img{width:76px;height:70px;border-radius:12px;object-fit:cover;flex:0 0 auto}.min-w-0{min-width:0}
.teacher-journal-photo{width:100%;height:min(460px,48vh);object-fit:cover;background:#e7efe9}.attendance-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.attendance-summary>div{padding:13px;border-radius:13px;background:#eff7f2}.attendance-summary span{display:block;color:#6c7d73;font-size:.76rem;text-transform:uppercase}.attendance-summary strong{display:block;margin-top:3px}.journal-detail-section{padding:16px;border-radius:14px;background:#f5faf7}.journal-detail-section h6{color:#0b5d3b;font-weight:700}.journal-detail-section p{margin-bottom:0;line-height:1.65}.teacher-dashboard-journals{max-height:530px;overflow-y:auto}.teacher-dashboard-journal img{width:70px;height:66px}
.login-page,.multi-login-page{background:radial-gradient(circle at top right,rgba(255,255,255,.15),transparent 32%),linear-gradient(135deg,#168553 0%,#0b5d3b 58%,#063821 100%)}
.login-brand-panel{background:linear-gradient(155deg,rgba(22,133,83,.94),rgba(6,56,33,.98)),url('../img/izin-placeholder.svg') center/cover}.login-brand-icon{width:86px;height:86px;background:#fff;padding:5px;border-radius:50%}.login-brand-icon img{width:100%;height:100%;object-fit:contain}.mobile-login-logo img{width:78px;height:78px}.role-login-option:hover{border-color:#75c89e;box-shadow:0 8px 22px rgba(22,133,83,.12)}.btn-check:focus+.role-login-option{box-shadow:0 0 0 .25rem rgba(22,133,83,.16)}.btn-check:checked+.role-login-option{border-color:#168553;color:#0b6a42;background:#f0faf4;box-shadow:0 8px 22px rgba(22,133,83,.13)}.btn-check:checked+.role-login-option .role-login-icon{box-shadow:0 0 0 4px rgba(22,133,83,.09)}.login-submit-btn{box-shadow:0 9px 20px rgba(22,133,83,.24)}
.student-bottom-nav a:hover,.student-bottom-nav a:focus{color:#168553}
@media(max-width:991.98px){.dashboard-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.student-bottom-nav{overflow-x:auto;justify-content:flex-start;padding-left:8px;padding-right:8px}.student-bottom-nav a{flex:1 0 58px;min-width:58px}.attendance-summary{grid-template-columns:1fr}}
@media(max-width:575.98px){.activity-photo-card{height:180px}.dashboard-actions .btn{min-height:82px;font-size:.85rem}.teacher-journal-photo{height:280px}.journal-history-item img,.teacher-journal-item img{width:68px;height:66px}}


/* =========================================================
   Login responsif SKARISA v1.5
   Memperbaiki logo terlalu besar/menutupi teks dan cache CSS.
   ========================================================= */
.multi-login-page{
  min-height:100vh;
  padding:clamp(14px,3vw,34px);
  background:
    radial-gradient(circle at 12% 12%,rgba(255,255,255,.13),transparent 25%),
    radial-gradient(circle at 88% 88%,rgba(113,221,166,.18),transparent 28%),
    linear-gradient(135deg,#0b5d3b 0%,#168553 48%,#063821 100%);
}
.multi-login-card{
  width:min(1020px,100%);
  min-height:640px;
  overflow:hidden;
  border-radius:28px;
  background:#fff;
  box-shadow:0 28px 80px rgba(2,42,24,.34);
}
.multi-login-card>.row{min-height:640px}
.login-brand-panel{
  position:relative;
  isolation:isolate;
  min-height:640px;
  padding:44px 42px;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 85% 12%,rgba(255,255,255,.18),transparent 22%),
    linear-gradient(155deg,#1aa568 0%,#0c7147 52%,#06452c 100%)!important;
}
.login-brand-panel::before,
.login-brand-panel::after{
  content:"";
  position:absolute;
  z-index:-1;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
}
.login-brand-panel::before{width:360px;height:360px;right:-210px;top:-170px}
.login-brand-panel::after{width:260px;height:260px;left:-155px;bottom:-130px}
.login-brand-content{position:relative;width:100%;max-width:360px;margin-inline:auto;color:#fff}
.login-logo-card{
  width:150px;
  height:138px;
  margin-bottom:25px;
  padding:10px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:24px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 18px 38px rgba(0,45,25,.24);
}
.login-logo-card img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}
.login-kicker{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  margin-bottom:14px;
  padding:6px 13px;
  border-radius:999px;
  color:#0b5d3b;
  background:#fff;
  font-size:.72rem;
  line-height:1;
  font-weight:800;
  letter-spacing:.045em;
}
.login-brand-title{
  margin:0 0 14px;
  max-width:330px;
  color:#fff;
  font-size:clamp(2rem,3.2vw,2.7rem);
  line-height:1.08;
  font-weight:800;
  letter-spacing:-.035em;
}
.login-brand-title span{display:block;color:#c8f7dc}
.login-brand-description{
  max-width:350px;
  margin:0 0 25px;
  color:rgba(255,255,255,.8);
  font-size:.96rem;
  line-height:1.65;
}
.login-feature-list{display:grid;gap:11px}
.login-feature{
  margin:0;
  gap:12px;
  color:rgba(255,255,255,.94);
  font-size:.91rem;
}
.login-feature i{
  flex:0 0 38px;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.14);
}
.login-form-panel{display:flex;align-items:center;background:#fff}
.login-form-body{width:100%;max-width:590px;margin-inline:auto}
.role-login-option{min-height:104px;border-color:#dce6e1;color:#52675d}
.role-login-option:hover{transform:translateY(-2px)}
.btn-check:checked+.role-login-option{border-color:#168553;color:#0b6a42;background:#effaf4}
.login-input-group .input-group-text{background:#f4f8f6;border-color:#d9e5df;color:#587064}
.login-input-group .form-control,.login-input-group .btn{border-color:#d9e5df}
.login-input-group:focus-within .input-group-text,
.login-input-group:focus-within .form-control,
.login-input-group:focus-within .btn{border-color:#75c89e}
.mobile-login-logo{
  width:105px;
  height:96px;
  margin:0 auto 12px;
  padding:7px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 25px rgba(15,91,57,.14);
}
.mobile-login-logo img{
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}
@media(max-width:991.98px){
  .multi-login-card,.multi-login-card>.row{min-height:auto}
  .login-form-panel{min-height:calc(100vh - 28px)}
  .login-form-body{max-width:650px}
}
@media(max-width:575.98px){
  .multi-login-page{padding:8px}
  .multi-login-card{border-radius:20px}
  .login-form-panel{min-height:calc(100vh - 16px)}
  .login-form-body{padding:24px 18px!important}
  .role-login-grid{gap:7px}
  .role-login-option{min-height:88px;padding:9px 4px;font-size:.7rem;border-radius:13px}
  .role-login-icon{width:37px;height:37px;font-size:1rem}
  .login-submit-btn{font-size:1rem}
}


/* =========================================================
   SKARISA GPS Camera v1.8
   Watermark foto absensi dan bukti lokasi pada dashboard siswa.
   ========================================================= */
.camera-frame{position:relative;overflow:hidden;background:#101714}
.gps-camera-live-overlay{
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  bottom:0;
  display:grid;
  grid-template-columns:minmax(115px,29%) 1fr;
  gap:clamp(10px,2vw,18px);
  min-height:31%;
  padding:clamp(10px,2vw,18px);
  color:#fff;
  background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.67));
  pointer-events:none;
}
.gps-camera-map-thumb{
  position:relative;
  min-height:115px;
  overflow:hidden;
  border-radius:12px;
  background:
    linear-gradient(31deg,transparent 45%,rgba(234,239,235,.75) 46%,rgba(234,239,235,.75) 50%,transparent 51%),
    linear-gradient(92deg,transparent 38%,rgba(234,239,235,.7) 39%,rgba(234,239,235,.7) 43%,transparent 44%),
    repeating-linear-gradient(0deg,#355646 0 26px,#416454 27px 46px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
.gps-camera-map-thumb::before,.gps-camera-map-thumb::after{content:"";position:absolute;background:rgba(223,231,225,.75);transform:rotate(-17deg)}
.gps-camera-map-thumb::before{width:140%;height:6px;left:-20%;top:35%}.gps-camera-map-thumb::after{width:7px;height:140%;left:62%;top:-20%;transform:rotate(11deg)}
.gps-camera-map-thumb>span{position:absolute;left:7px;bottom:6px;font-size:.58rem;font-weight:800;letter-spacing:.08em;text-shadow:0 1px 4px #000}
.gps-camera-pin{position:absolute;z-index:3;left:52%;top:42%;transform:translate(-50%,-50%);font-size:2rem;color:#ee3d3d;filter:drop-shadow(0 3px 3px rgba(0,0,0,.65))}
.gps-camera-information{align-self:end;min-width:0;text-shadow:0 1px 3px rgba(0,0,0,.85);line-height:1.3}
.gps-camera-information strong{display:block;margin:.2rem 0;font-size:clamp(.95rem,2.2vw,1.45rem);line-height:1.15}
.gps-camera-information>div:not(.gps-camera-brand){font-size:clamp(.62rem,1.25vw,.82rem);white-space:normal;overflow-wrap:anywhere}
.gps-camera-brand{display:flex;align-items:center;justify-content:flex-end;gap:5px;color:#a7f1c5;font-size:clamp(.58rem,1.15vw,.76rem);font-weight:800;letter-spacing:.03em}
.attendance-proof-card{height:100%;overflow:hidden;border:1px solid #dcebe2;border-radius:17px;background:#fff;box-shadow:0 8px 24px rgba(10,83,48,.08)}
.attendance-proof-card>a{display:block;background:#0b1b13}
.attendance-proof-card img{display:block;width:100%;height:285px;object-fit:cover}
.attendance-proof-meta{padding:14px 15px;color:#2b4235}
@media(max-width:575.98px){
  .gps-camera-live-overlay{grid-template-columns:94px 1fr;padding:8px;gap:9px;min-height:36%}
  .gps-camera-map-thumb{min-height:92px;border-radius:9px}
  .gps-camera-information>div:not(.gps-camera-brand){font-size:.58rem}
  .gps-camera-information strong{font-size:.86rem}
  .gps-camera-brand{font-size:.53rem}
  .attendance-proof-card img{height:240px}
}


/* =========================================================
   SKARISA v1.11 - Footer modal master data selalu terlihat
   ========================================================= */
#formModal .modal-content{
  overflow:hidden;
}
#formModal .master-modal-form{
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  max-height:calc(100vh - 1rem);
  min-height:0;
}
#formModal .modal-header,
#formModal .master-modal-footer{
  flex:0 0 auto;
  background:#fff;
  position:relative;
  z-index:4;
}
#formModal .modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding-bottom:1.5rem;
}
#formModal .master-modal-footer{
  position:sticky;
  bottom:0;
  box-shadow:0 -8px 22px rgba(18,65,43,.09);
}
#formModal .modal-save-btn{
  min-width:170px;
  font-weight:700;
}
@media(min-width:576px){
  #formModal .master-modal-form{
    max-height:calc(100vh - 3.5rem);
  }
}
@media(max-width:575.98px){
  #formModal .modal-dialog{
    margin:.4rem;
    width:auto;
  }
  #formModal .master-modal-footer{
    display:grid;
    grid-template-columns:1fr 1.6fr;
    gap:.55rem;
    padding:.75rem;
  }
  #formModal .master-modal-footer .btn{
    width:100%;
    margin:0;
  }
  #formModal .modal-save-btn{
    min-width:0;
  }
}

/* =========================================================
   SKARISA v1.14 - Tabel Master Data Administrator
   Siswa, kelas, guru pembimbing, dan pembimbing industri.
   ========================================================= */
.master-view-switch{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  padding:.55rem;
  border:1px solid #dbeae2;
  border-radius:18px;
  background:rgba(255,255,255,.78);
  box-shadow:0 8px 26px rgba(14,87,52,.06);
}
.master-view-link{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  min-height:44px;
  padding:.65rem .95rem;
  border-radius:13px;
  color:#496257;
  text-decoration:none;
  font-weight:700;
  font-size:.88rem;
  transition:all .18s ease;
}
.master-view-link i{font-size:1rem}.master-view-link:hover{color:#0b6a42;background:#edf8f2;transform:translateY(-1px)}
.master-view-link.active{color:#fff;background:linear-gradient(135deg,#1aa568,#0b6a42);box-shadow:0 8px 18px rgba(22,133,83,.22)}
.master-summary-card{
  height:100%;
  min-height:96px;
  display:flex;
  align-items:center;
  gap:.9rem;
  padding:1rem 1.05rem;
  border:1px solid #dfebe5;
  border-radius:17px;
  background:#fff;
  box-shadow:0 7px 22px rgba(23,88,55,.065);
}
.master-summary-icon{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:15px;font-size:1.25rem}
.master-summary-icon.green{color:#0b6a42;background:#ddf5e8}.master-summary-icon.teal{color:#087f73;background:#dff6f2}.master-summary-icon.gray{color:#68776f;background:#edf1ef}.master-summary-icon.amber{color:#9b6500;background:#fff1cf}
.master-summary-card strong{display:block;color:#183d2c;font-size:1.55rem;line-height:1}.master-summary-card small{display:block;margin-top:.38rem;color:#718077;font-size:.78rem;font-weight:600}
.master-toolbar-card{border:1px solid #dce9e2;box-shadow:0 7px 24px rgba(23,88,55,.06)}
.master-search-group .input-group-text{color:#168553;background:#f3faf6;border-color:#d5e8dd}.master-search-group .form-control{border-left:0}.master-search-group:focus-within .input-group-text{border-color:#75c89e}
.master-table-card{overflow:hidden;border:1px solid #d9e8e0;box-shadow:0 12px 34px rgba(18,78,47,.08)}
.master-table-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.15rem 1.3rem;border:0;background:linear-gradient(135deg,#0b5d3b,#198b58);color:#fff}
.master-table-header h5{font-weight:800}.master-table-header p{color:rgba(255,255,255,.72);font-size:.82rem}
.master-result-badge{display:inline-flex;align-items:center;gap:.42rem;white-space:nowrap;padding:.48rem .7rem;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.13);font-size:.76rem;font-weight:700}
.master-table-wrap{border-radius:0}.master-table{--bs-table-bg:transparent;min-width:920px}
.master-table>thead th{position:sticky;top:0;z-index:2;padding:.85rem .85rem;border-bottom:1px solid #d8e7df;background:#eef8f2;color:#355d49;font-size:.73rem;text-transform:uppercase;letter-spacing:.04em}
.master-table>tbody td{padding:.82rem .85rem;border-color:#e8f0ec;color:#344b40;font-size:.86rem;vertical-align:middle}
.master-table>tbody tr{transition:background-color .15s ease,box-shadow .15s ease}.master-table>tbody tr:hover{background:#f5fbf7;box-shadow:inset 4px 0 #20a666}
.master-number{color:#829087!important;font-weight:800}
.master-person{display:flex;align-items:center;gap:.72rem;min-width:205px}.master-person strong{display:block;color:#183d2c;line-height:1.24}.master-person small{display:block;margin-top:.25rem;color:#7a8980;font-size:.74rem}
.master-avatar{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;overflow:hidden;border-radius:14px;color:#0b6a42;background:linear-gradient(145deg,#dff5e9,#c9ebd8);font-weight:800;box-shadow:inset 0 0 0 1px rgba(22,133,83,.08)}
.master-avatar img{width:100%;height:100%;object-fit:cover}.master-avatar.icon{font-size:1.2rem}.master-avatar.teacher{color:#7b5200;background:linear-gradient(145deg,#fff0c7,#ffe0a0)}.master-avatar.industry{color:#155f8a;background:linear-gradient(145deg,#dff1ff,#c6e5fb)}
.identity-line,.contact-line{display:flex;align-items:center;gap:.42rem;margin:.17rem 0;color:#52665b;font-size:.78rem}.identity-line b{min-width:35px;color:#7c8982;font-size:.67rem;letter-spacing:.03em}.contact-line i{width:17px;color:#168553}
.master-main-value{display:block;color:#274b39;font-weight:700;line-height:1.35}.master-sub-value{display:block;margin-top:.2rem;color:#7a8981;font-size:.73rem}
.master-status{display:inline-flex;align-items:center;gap:.35rem;padding:.38rem .62rem;border-radius:999px;font-size:.72rem;font-weight:800;white-space:nowrap}.master-status.active{color:#087044;background:#ddf5e8}.master-status.inactive{color:#69756e;background:#edf0ee}
.master-count-pill{display:inline-flex;align-items:center;justify-content:center;gap:.38rem;min-width:92px;padding:.42rem .62rem;border-radius:11px;color:#0b7047;background:#e2f6eb;font-size:.75rem;font-weight:800}.master-count-pill.blue{color:#176388;background:#e4f3fb}
.master-actions{display:flex;align-items:center;justify-content:flex-end;gap:.35rem;white-space:nowrap}.master-actions .btn{display:inline-flex;align-items:center;gap:.35rem;border:0;border-radius:9px;padding:.42rem .58rem;font-size:.72rem;font-weight:800}.btn-action-edit{color:#0b7047!important;background:#e1f5ea!important}.btn-action-edit:hover{color:#fff!important;background:#168553!important}.btn-action-delete{color:#b02c3b!important;background:#fbe7ea!important}.btn-action-delete:hover{color:#fff!important;background:#dc3545!important}.btn-action-key{color:#8a6200!important;background:#fff0c9!important}.btn-action-key:hover{color:#fff!important;background:#c58a00!important}
.master-empty-state{display:flex;min-height:240px;flex-direction:column;align-items:center;justify-content:center;color:#87948d;text-align:center}.master-empty-state i{font-size:2.7rem;color:#b7c9bf}.master-empty-state strong{margin-top:.7rem;color:#476052}.master-empty-state span{margin-top:.3rem;font-size:.82rem}
.master-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.master-quick-card{display:flex;align-items:center;gap:.8rem;min-height:84px;padding:1rem;border:1px solid #dce9e2;border-radius:16px;background:#fff;color:#294a3a;text-decoration:none;box-shadow:0 7px 22px rgba(23,88,55,.055);transition:all .18s ease}.master-quick-card:hover{color:#0b6a42;border-color:#acd8c0;transform:translateY(-2px);box-shadow:0 12px 28px rgba(23,88,55,.11)}.master-quick-card .icon{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:13px;color:#0b6a42;background:#e2f6eb;font-size:1.1rem}.master-quick-card strong{display:block;font-size:1.25rem}.master-quick-card small{display:block;color:#75847c;font-size:.74rem}
@media(max-width:1199.98px){.master-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767.98px){
  .master-view-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.master-view-link{justify-content:center;padding:.6rem .45rem;font-size:.76rem}.master-summary-card{min-height:86px;padding:.8rem}.master-summary-icon{width:41px;height:41px;flex-basis:41px;border-radius:12px}.master-summary-card strong{font-size:1.28rem}.master-table-header{align-items:flex-start;padding:1rem}.master-result-badge{font-size:.68rem}.master-quick-grid{gap:.7rem}.master-quick-card{min-height:76px;padding:.78rem}.master-quick-card .icon{width:39px;height:39px;flex-basis:39px}
}
@media(max-width:575.98px){
  .master-table-wrap{overflow:visible}.master-table{min-width:0}.master-table thead{display:none}.master-table,.master-table tbody,.master-table tr,.master-table td{display:block;width:100%}.master-table>tbody tr{margin:0;padding:.55rem .8rem;border-bottom:8px solid #f2f7f4;background:#fff;box-shadow:none}.master-table>tbody tr:hover{background:#fff;box-shadow:none}.master-table>tbody td{display:grid;grid-template-columns:110px minmax(0,1fr);gap:.7rem;padding:.52rem .1rem;border:0;text-align:left!important}.master-table>tbody td::before{content:attr(data-label);color:#7a8980;font-size:.67rem;font-weight:800;text-transform:uppercase;letter-spacing:.035em}.master-table>tbody td.master-number{display:none}.master-person{min-width:0}.master-actions{justify-content:flex-start;flex-wrap:wrap}.master-actions .btn span{display:inline}.master-table-header h5{font-size:1rem}.master-table-header p{font-size:.74rem}.master-result-badge{display:none}.master-quick-grid{grid-template-columns:1fr 1fr}.master-quick-card strong{font-size:1.05rem}.master-quick-card small{font-size:.68rem}
}

/* =========================================================
   SKARISA v1.15 - Navigasi profesional dan responsif
   ========================================================= */
:root{
  --sidebar:286px;
  --sidebar-collapsed:88px;
  --topbar-height:68px;
  --primary:#0f7a4a;
  --primary-dark:#075d37;
  --primary-soft:#eaf7f0;
  --menu-text:#dff5e9;
  --menu-muted:#95c8aa;
  --bg:#f3f7f5;
}
body{background:var(--bg);color:#263a31}
.app-topbar{
  min-height:var(--topbar-height);
  padding:.55rem 0;
  color:#fff;
  background:linear-gradient(105deg,#075d37 0%,#0f7a4a 52%,#119a5b 100%);
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 8px 28px rgba(4,78,44,.15);
  z-index:1035;
}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-inline:clamp(12px,2.3vw,28px)}
.topbar-start{display:flex;align-items:center;min-width:0;gap:10px}
.topbar-icon-button{
  width:42px;height:42px;display:inline-grid;place-items:center;flex:0 0 auto;
  border:1px solid rgba(255,255,255,.16);border-radius:13px;color:#fff;
  background:rgba(255,255,255,.1);font-size:1.45rem;transition:.2s ease;
}
.topbar-icon-button:hover{background:#fff;color:var(--primary);transform:translateY(-1px)}
.app-brand{display:flex;align-items:center;gap:10px;margin:0;color:#fff!important;min-width:0}
.brand-logo-wrap{width:43px;height:43px;display:grid;place-items:center;flex:0 0 auto;padding:3px;background:#fff;border-radius:13px;box-shadow:0 5px 14px rgba(0,0,0,.13)}
.brand-logo{width:100%;height:100%;padding:0;border-radius:10px;background:#fff;object-fit:contain}
.brand-copy{display:flex;flex-direction:column;line-height:1.13;min-width:0}
.brand-copy strong{font-size:1rem;letter-spacing:.02em}
.brand-copy small{max-width:270px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(255,255,255,.72);font-size:.68rem;font-weight:500}
.topbar-user-dropdown{flex:0 0 auto}
.topbar-user-button{display:flex;align-items:center;gap:9px;min-height:46px;padding:5px 9px 5px 6px;border:1px solid rgba(255,255,255,.16);border-radius:15px;color:#fff;background:rgba(255,255,255,.1);text-align:left;transition:.2s ease}
.topbar-user-button::after{display:none}.topbar-user-button:hover,.topbar-user-button[aria-expanded="true"]{background:#fff;color:#17452f}
.topbar-avatar{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:11px;color:#0c6b40;background:#fff;font-weight:800;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.topbar-avatar.large{width:44px;height:44px;border-radius:14px;background:var(--primary-soft);box-shadow:none}
.topbar-user-copy{flex-direction:column;max-width:155px;line-height:1.08}
.topbar-user-copy strong{font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-user-copy small{margin-top:4px;font-size:.65rem;color:currentColor;opacity:.72}
.topbar-chevron{font-size:.7rem}.topbar-dropdown-menu{min-width:245px;padding:9px;border:0;border-radius:17px;box-shadow:0 18px 48px rgba(17,57,36,.2)}
.topbar-dropdown-menu .dropdown-item{padding:.65rem .75rem;border-radius:10px;color:#334b3f}.topbar-dropdown-menu .dropdown-item:hover{background:var(--primary-soft);color:var(--primary-dark)}
.dropdown-user-summary{display:flex;align-items:center;gap:11px;padding:7px}.dropdown-user-summary>span:last-child{display:flex;flex-direction:column;line-height:1.2}.dropdown-user-summary strong{font-size:.86rem}.dropdown-user-summary small{margin-top:3px;color:#7a8c83;font-size:.7rem}

.app-shell{min-height:calc(100vh - var(--topbar-height))}
.sidebar{
  top:var(--topbar-height);bottom:0;width:var(--sidebar);display:flex;flex-direction:column;
  overflow:hidden;background:
  radial-gradient(circle at 85% 3%,rgba(80,208,139,.18),transparent 25%),
  linear-gradient(180deg,#083d27 0%,#075332 55%,#052f20 100%);
  border-right:1px solid rgba(255,255,255,.08);box-shadow:12px 0 32px rgba(6,50,31,.11);
  transition:width .25s ease,transform .25s ease;
}
.sidebar-identity{display:flex;align-items:center;gap:12px;min-height:108px;padding:18px 15px 16px;border-bottom:1px solid rgba(255,255,255,.09)}
.sidebar-logo-wrap{width:52px;height:52px;display:grid;place-items:center;flex:0 0 auto;padding:4px;border-radius:16px;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.sidebar-logo{width:100%;height:100%;object-fit:contain;border-radius:12px}
.sidebar-school-copy{display:flex;flex-direction:column;min-width:0;color:#fff;line-height:1.2}.sidebar-app-name{margin-bottom:3px;color:#8fe0b3;font-size:.65rem;font-weight:800;letter-spacing:.11em}.sidebar-school-copy strong{display:-webkit-box;overflow:hidden;font-size:.79rem;line-height:1.27;-webkit-line-clamp:2;-webkit-box-orient:vertical}.sidebar-role{display:flex;align-items:center;gap:5px;margin-top:7px;color:rgba(255,255,255,.65);font-size:.67rem}
.sidebar-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:9px 10px 18px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}.sidebar-scroll::-webkit-scrollbar{width:5px}.sidebar-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.17);border-radius:10px}
.sidebar-nav{display:flex;flex-direction:column;gap:2px}.nav-section+.nav-section{margin-top:7px}
.sidebar .nav-label{display:flex;align-items:center;gap:9px;padding:13px 10px 6px;color:var(--menu-muted);font-size:.62rem;font-weight:800;letter-spacing:.12em;white-space:nowrap}.sidebar .nav-label::after{content:"";height:1px;flex:1;background:rgba(255,255,255,.08)}
.sidebar .nav-link{position:relative;display:flex;align-items:center;gap:10px;min-height:54px;margin:2px 0;padding:7px 9px;border:1px solid transparent;border-radius:15px;color:var(--menu-text);transition:.18s ease}
.sidebar .nav-link:hover{color:#fff;background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.08);transform:translateX(2px)}
.sidebar .nav-link.active{color:#064b2d;background:linear-gradient(110deg,#fff 0%,#e9fff2 100%);border-color:#fff;box-shadow:0 9px 22px rgba(0,0,0,.16)}
.sidebar .nav-link.active::before{content:"";position:absolute;left:-10px;top:15px;bottom:15px;width:4px;border-radius:0 5px 5px 0;background:#71e4a4}
.sidebar .nav-icon{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;color:#bce7cf;background:rgba(255,255,255,.08);font-size:1.06rem;transition:.18s ease}
.sidebar .nav-link:hover .nav-icon{background:rgba(255,255,255,.14);color:#fff}.sidebar .nav-link.active .nav-icon{color:#fff;background:linear-gradient(145deg,#0e8d52,#08683d);box-shadow:0 5px 12px rgba(9,112,64,.24)}
.sidebar .nav-copy{display:flex;flex:1;min-width:0;flex-direction:column;line-height:1.16}.sidebar .nav-title{font-size:.79rem;font-weight:700}.sidebar .nav-copy small{margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:currentColor;opacity:.58;font-size:.62rem}.sidebar .nav-arrow{flex:0 0 auto;color:currentColor;font-size:.65rem;opacity:.42}
.sidebar-user-card{display:flex;align-items:center;gap:10px;margin:0 10px 13px;padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.075);color:#fff}
.sidebar-user-avatar{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;color:#075332;background:#dff8e9;font-weight:800}.sidebar-user-copy{display:flex;flex:1;min-width:0;flex-direction:column;line-height:1.15}.sidebar-user-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem}.sidebar-user-copy span{margin-top:4px;color:rgba(255,255,255,.6);font-size:.62rem}.sidebar-logout{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;color:#fff;background:rgba(255,255,255,.09);text-decoration:none}.sidebar-logout:hover{color:#fff;background:#dc3545}
.sidebar-backdrop{display:none}
.has-sidebar .app-main{margin-left:var(--sidebar);width:calc(100% - var(--sidebar));transition:margin-left .25s ease,width .25s ease}
.app-content{padding-inline:clamp(13px,2vw,28px)!important}

body.sidebar-collapsed .sidebar{width:var(--sidebar-collapsed)}
body.sidebar-collapsed .has-sidebar .app-main,body.sidebar-collapsed .app-main{margin-left:var(--sidebar-collapsed);width:calc(100% - var(--sidebar-collapsed))}
body.sidebar-collapsed .sidebar-identity{justify-content:center;padding-inline:10px;min-height:83px}
body.sidebar-collapsed .sidebar-logo-wrap{width:48px;height:48px}
body.sidebar-collapsed .sidebar-school-copy,body.sidebar-collapsed .sidebar .nav-copy,body.sidebar-collapsed .sidebar .nav-arrow,body.sidebar-collapsed .sidebar .nav-label span,body.sidebar-collapsed .sidebar-user-copy,body.sidebar-collapsed .sidebar-logout{display:none}
body.sidebar-collapsed .sidebar .nav-label{padding:8px 0}body.sidebar-collapsed .sidebar .nav-label::after{width:34px;flex:none;margin:auto}
body.sidebar-collapsed .sidebar .nav-link{justify-content:center;padding:6px}body.sidebar-collapsed .sidebar .nav-link:hover{transform:none}body.sidebar-collapsed .sidebar .nav-link.active::before{left:-10px}
body.sidebar-collapsed .sidebar-user-card{justify-content:center;padding:8px;margin-inline:10px}

.student-desktop-menu{align-items:center;gap:5px;margin-inline:auto;padding:4px;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:rgba(0,0,0,.08)}
.student-desktop-menu a{display:flex;align-items:center;gap:7px;padding:9px 11px;border-radius:12px;color:rgba(255,255,255,.78);font-size:.74rem;font-weight:700;text-decoration:none;transition:.18s ease}.student-desktop-menu a:hover{color:#fff;background:rgba(255,255,255,.11)}.student-desktop-menu a.active{color:#075d37;background:#fff;box-shadow:0 5px 14px rgba(0,0,0,.12)}
.student-bottom-nav{display:none}

@media(max-width:1199.98px){.brand-copy small{max-width:190px}.student-desktop-menu a{padding-inline:8px}.student-desktop-menu a span{display:none}}
@media(max-width:991.98px){
  :root{--topbar-height:64px}
  .brand-copy small{display:none}.brand-copy strong{font-size:.9rem}.brand-logo-wrap{width:40px;height:40px}.topbar-icon-button{width:40px;height:40px}
  .sidebar{top:0;z-index:1060;width:min(315px,88vw);transform:translateX(-105%);box-shadow:18px 0 45px rgba(0,0,0,.25)}
  body.sidebar-open .sidebar{transform:translateX(0)}
  .sidebar-backdrop{position:fixed;inset:0;z-index:1055;background:rgba(3,31,18,.52);backdrop-filter:blur(2px)}
  body.sidebar-open .sidebar-backdrop{display:block}
  body.sidebar-open{overflow:hidden}
  .has-sidebar .app-main,.app-main{margin-left:0!important;width:100%!important}
  .student-main{padding-bottom:94px}
  .student-bottom-nav{
    position:fixed;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
    left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:1050;
    padding:7px 5px calc(7px + env(safe-area-inset-bottom));border:1px solid rgba(14,115,68,.1);
    border-radius:22px;background:rgba(255,255,255,.96);box-shadow:0 14px 38px rgba(8,66,39,.2);backdrop-filter:blur(14px);
    overflow:visible;
  }
  .student-bottom-nav a{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;min-width:0;padding:4px 1px;color:#718077;text-decoration:none;font-size:.58rem;font-weight:700;transition:.18s ease}
  .student-nav-icon{width:31px;height:31px;display:grid;place-items:center;border-radius:11px;font-size:1.05rem;transition:.18s ease}
  .student-bottom-nav a.active{color:var(--primary)}.student-bottom-nav a.active .student-nav-icon{color:#fff;background:linear-gradient(145deg,#14945a,#087342);box-shadow:0 5px 13px rgba(11,122,70,.25)}
  .student-bottom-nav a.student-nav-primary .student-nav-icon{width:47px;height:47px;margin-top:-22px;border:4px solid #fff;border-radius:16px;color:#fff;background:linear-gradient(145deg,#18a562,#087342);box-shadow:0 7px 18px rgba(8,109,61,.31);font-size:1.25rem}
  .student-bottom-nav a.student-nav-primary span:last-child{margin-top:1px}
}
@media(max-width:575.98px){
  .topbar-inner{padding-inline:9px;gap:7px}.topbar-start{gap:6px}.brand-copy strong{font-size:.8rem}.topbar-user-button{padding-right:6px}.topbar-chevron{display:none}
  .student-bottom-nav{left:6px;right:6px;border-radius:19px;grid-template-columns:repeat(6,1fr)}
  .student-bottom-nav a{font-size:.53rem}.student-nav-icon{width:28px;height:28px;font-size:.98rem}
  .sidebar .nav-copy small{display:none}.sidebar .nav-link{min-height:50px}
}
@media print{.app-topbar,.sidebar,.sidebar-backdrop,.student-bottom-nav{display:none!important}.has-sidebar .app-main,.app-main{margin:0!important;width:100%!important}}


/* =========================================================
   SKARISA v1.17 — Tabel Master Data Profesional Lengkap
   Siswa, kelas, jurusan, pembimbing, dan lokasi tempat PKL.
   ========================================================= */
.master-view-switch{grid-template-columns:repeat(6,minmax(0,1fr));}
.master-view-link{min-width:0;text-align:center;justify-content:center;}
.master-avatar.major{color:#6b4d00;background:linear-gradient(145deg,#fff4ce,#ffe3a2);}
.master-avatar.location{color:#8a4212;background:linear-gradient(145deg,#ffebda,#ffd3b3);}
.master-code-badge{display:inline-flex;align-items:center;margin-top:.2rem;padding:.2rem .48rem;border-radius:999px;color:#5f4a00;background:#fff1bd;font-size:.65rem;font-weight:900;letter-spacing:.045em;text-transform:uppercase;}
.master-address{display:flex;align-items:flex-start;gap:.48rem;max-width:360px;color:#40574b;line-height:1.45;}
.master-address i{flex:0 0 auto;margin-top:.1rem;color:#e45c31;}
.master-address span{display:-webkit-box;overflow:hidden;-webkit-line-clamp:3;-webkit-box-orient:vertical;}
.master-radius-pill{display:inline-flex;align-items:center;gap:.38rem;padding:.4rem .62rem;border-radius:10px;color:#734600;background:#fff0d2;font-size:.75rem;font-weight:850;white-space:nowrap;}
.master-coordinate{display:flex;align-items:center;gap:.32rem;margin-top:.42rem;font-size:.69rem;font-weight:750;}
.master-coordinate.valid{color:#13804e}.master-coordinate.invalid{color:#b04734}
.master-table tbody tr td:first-child{border-left:3px solid transparent}.master-table tbody tr:hover td:first-child{border-left-color:#20a666}
@media(max-width:1199.98px){.master-view-switch{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:767.98px){.master-view-switch{grid-template-columns:repeat(2,minmax(0,1fr));}.master-address{max-width:none}.master-table>tbody tr{border:1px solid #dceae2;border-radius:16px;margin-bottom:.75rem;overflow:hidden}.master-table>tbody td:first-child{border-left:0}.master-table>tbody tr:hover td:first-child{border-left:0}}

/* Peta pemilih titik lokasi tempat PKL pada Data Master */
.master-map{height:360px;border-radius:14px;overflow:hidden;border:1px solid #dbe4f0}
@media (max-width:575.98px){.master-map{height:280px}}
#hasilCariTitik .list-group{max-height:230px;overflow-y:auto}
#hasilCariTitik .list-group-item.active{background:#198754;border-color:#198754}
#hasilCariTitik .list-group-item.active .badge{color:#198754!important}

/* Pemandu arah menuju titik PKL dan kendali cermin kamera */
.guidance-panel{background:#eef6ff;border:1px solid #bcd8f7;border-radius:14px;padding:13px;margin-bottom:12px}
.guidance-main{display:flex;align-items:center;gap:13px}
.guidance-arrow{width:52px;height:52px;flex:0 0 52px;border-radius:50%;background:#0d6efd;color:#fff;display:grid;place-items:center;font-size:1.6rem;transition:transform .45s ease}
.guidance-text{line-height:1.25}
.guidance-text strong{display:block;font-size:1.5rem;color:#0b3d80}
.guidance-text span{font-size:.86rem;color:#4a6485}
.guidance-bar{height:7px;border-radius:6px;background:#d7e6f8;overflow:hidden;margin:11px 0 9px}
.guidance-bar>div{height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,#0d6efd,#20c997);transition:width .5s ease}
.guidance-hint{font-size:.8rem;color:#4a6485}
.guidance-panel.is-near{background:#e9f9f0;border-color:#a7e3c4}
.guidance-panel.is-near .guidance-arrow{background:#198754}
.guidance-panel.is-near .guidance-text strong{color:#12603d}
/* Kamera depan ditampilkan apa adanya. Kelas is-mirrored hanya dipasang
   bila siswa menekan tombol cermin secara sadar. */
.camera-frame video{transform:none}
.camera-frame video.is-mirrored{transform:scaleX(-1)}
.guidance-report{border-top:1px solid #cddff2;margin-top:11px;padding-top:11px;font-size:.8rem;color:#4a6485}