:root{--brand:#2563eb;--violet:#7c3aed;--green:#10b981;--sky:#0ea5e9;--orange:#f97316;--purple:#7c3aed;--cyan:#06b6d4;--danger:#ef4444;--shadow:0 22px 55px rgba(15,23,42,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth;min-height:100%}body{font-feature-settings:"cv02","cv03","cv04","cv11";min-height:100%;background:#f0f9ff;color:#0f172a}img{max-width:100%;display:block}table{border-collapse:collapse}a{text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}
.glass{background:rgba(255,255,255,.86);backdrop-filter:blur(18px)}.w-76{width:19rem}.shadow-blue{box-shadow:0 18px 40px rgba(37,99,235,.32)}
body>div.min-h-screen{min-height:100vh}.fade-in{animation:fade .35s ease both}@keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#sidebarOverlay{transition:.2s}.mobile-hidden{display:inline}

/* Sidebar - mengikuti template lampiran */
#sidebar{flex:0 0 19rem;background:linear-gradient(180deg,#e0f2fe 0%,#dbeafe 48%,#e0f7ff 100%)!important;border-right:1px solid #bae6fd!important;box-shadow:inset -1px 0 0 rgba(14,165,233,.10)!important;display:flex!important;flex-direction:column!important;min-height:100vh!important;height:100vh!important;max-height:100vh!important;max-width:88vw;will-change:transform}
@supports(height:100dvh){#sidebar{min-height:100dvh!important;height:100dvh!important;max-height:100dvh!important}}
.sidebar-profile{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:0!important;text-align:center!important;padding:1.1rem .9rem!important;border-radius:1.35rem;background:rgba(255,255,255,.62)!important;border:1px solid rgba(125,211,252,.75)!important;box-shadow:0 16px 34px rgba(14,165,233,.16)!important}.sidebar-profile .relative{margin-left:auto!important;margin-right:auto!important}.sidebar-profile .min-w-0{width:100%!important;text-align:center!important;margin-top:.75rem!important}
#sidebar nav{flex:1 1 auto!important;overflow-y:auto!important;padding-right:.15rem}.sidebar-logout{margin-top:auto!important;flex:0 0 auto!important;background:linear-gradient(180deg,rgba(224,242,254,.74),rgba(219,234,254,.96))!important;border-top:1px solid rgba(14,165,233,.20)!important}.sidebar-link{display:flex;align-items:center;gap:.75rem;padding:.78rem 1rem;border-radius:1.1rem;color:#075985;font-weight:800;transition:.22s;background:transparent;min-height:46px}.sidebar-link:hover,.sidebar-link.active{background:linear-gradient(135deg,#38bdf8,#2563eb 60%,#4f46e5)!important;color:#fff!important;box-shadow:0 14px 30px rgba(37,99,235,.25);transform:translateX(2px)}.logout-link{background:#fff1f2!important;color:#be123c!important;border:1px solid #fecdd3!important}.logout-link:hover{background:linear-gradient(135deg,#ef4444,#be123c)!important;color:white!important;box-shadow:0 14px 30px rgba(225,29,72,.22)!important}
body.sidebar-collapsed #sidebar{transform:translateX(-100%)!important}
@media(min-width:1024px){body.sidebar-collapsed #sidebar{margin-left:-19rem}body.sidebar-collapsed main{width:100%}#sidebarOverlay{display:none!important}#sidebar{position:sticky!important;top:0!important;align-self:stretch!important;overflow-y:auto!important}}
@media(max-width:1023px){#sidebar{position:fixed!important;min-height:100dvh!important;height:100dvh!important;max-height:100dvh!important;overflow-y:auto!important}.sidebar-logout{position:sticky;bottom:0;padding-bottom:.25rem}.mobile-hidden{display:none!important}}

/* Topbar + footer */
main.flex-1{min-height:100vh;display:flex;flex-direction:column}main>section{flex:1 0 auto}.footer-static{flex-shrink:0;margin-top:auto;position:static;background:linear-gradient(135deg,#075985,#0f766e)!important;color:#ecfeff!important;border-top:1px solid rgba(125,211,252,.40)!important;box-shadow:0 -12px 34px rgba(14,116,144,.14)!important}header.sticky{box-shadow:0 10px 28px rgba(14,165,233,.08)}

/* Komponen template */
.card,.surface-card,.soft-panel,.glass-card{background:white;border-radius:1.65rem;box-shadow:var(--shadow);border:1px solid rgba(226,232,240,.82)}.glass-card{background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,255,255,.78));backdrop-filter:blur(18px)}.metric-tile{background:white;border-radius:1.4rem;padding:1.1rem;box-shadow:0 16px 36px rgba(15,23,42,.07);border:1px solid rgba(226,232,240,.85)}.metric-tile .progress,.progress{height:.55rem;border-radius:999px;background:#e2e8f0;overflow:hidden}.metric-tile .progress>span,.progress>span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0ea5e9,#2563eb,#7c3aed)}
.input,.input-shell,.select-shell,.textarea-shell{width:100%;border:1px solid #dbe3ef!important;border-radius:1rem!important;padding:.78rem 1rem!important;outline:none;background:white!important;transition:.2s;color:#0f172a!important}.input:focus,.input-shell:focus,.select-shell:focus,.textarea-shell:focus,input:focus,select:focus,textarea:focus{border-color:#38bdf8!important;box-shadow:0 0 0 4px rgba(14,165,233,.14)!important;outline:none!important}.input-mini{border:1px solid #dbe3ef;border-radius:.85rem;padding:.58rem .7rem;outline:none;background:white;transition:.2s}.input-mini:focus{border-color:#38bdf8;box-shadow:0 0 0 4px rgba(14,165,233,.14)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.72rem 1rem;border-radius:1rem;font-weight:800;transition:.2s;border:0;text-decoration:none}.btn:hover{filter:brightness(1.05);transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,#0ea5e9,#2563eb 60%,#7c3aed)!important;color:white!important;box-shadow:0 14px 28px rgba(37,99,235,.23)!important}.btn-secondary{background:linear-gradient(135deg,#38bdf8,#2563eb)!important;color:white!important;box-shadow:0 14px 28px rgba(37,99,235,.18)!important}.btn-success{background:linear-gradient(135deg,#34d399,#10b981)!important;color:white!important}.btn-danger{background:linear-gradient(135deg,#fb7185,#ef4444)!important;color:white!important}.btn-soft,.btn-light{background:#eef6ff!important;color:#1d4ed8!important;border:1px solid #dbeafe!important}.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.25rem .65rem;border-radius:999px;font-size:.75rem;font-weight:800}.badge.orange{background:#fff7ed;color:#c2410c}.badge.purple{background:#f5f3ff;color:#6d28d9}.badge.cyan{background:#ecfeff;color:#0e7490}.badge.emerald{background:#ecfdf5;color:#047857}.badge.slate{background:#f1f5f9;color:#475569}
.table-shell{border-radius:1.35rem;overflow:hidden;background:white}.table-modern th,.table-shell table thead th{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:#64748b;background:#f8fafc}.table-modern td,.table-modern th,.table-shell td,.table-shell th{padding:.88rem;border-bottom:1px solid #edf2f7}.table-modern tbody tr:hover,.table-shell tbody tr:hover{background:#f8fafc}.empty-state{text-align:center;padding:2rem;border-radius:1.35rem;border:1px dashed #cbd5e1;background:linear-gradient(180deg,#fff,#f8fafc)}

/* KPI dan dashboard cards */
.kpi-card{position:relative;overflow:hidden;border-radius:1.65rem;padding:1.35rem;min-height:145px;box-shadow:0 22px 55px rgba(15,23,42,.11)}.kpi-card::before{content:"";position:absolute;inset:auto -26px -34px auto;width:108px;height:108px;border-radius:999px;background:rgba(255,255,255,.18)}.kpi-card .icon-chip{width:3rem;height:3rem;border-radius:1rem;display:grid;place-items:center;background:rgba(255,255,255,.18);font-size:1.35rem;font-weight:800}.kpi-orange{background:linear-gradient(135deg,#0ea5e9,#2563eb 60%,#7c3aed)}.kpi-purple{background:linear-gradient(135deg,#38bdf8,#2563eb 60%,#4f46e5)}.kpi-cyan{background:linear-gradient(135deg,#67e8f9,#06b6d4 45%,#0891b2)}.kpi-emerald{background:linear-gradient(135deg,#6ee7b7,#10b981 45%,#059669)}.kpi-slate{background:linear-gradient(135deg,#60a5fa,#3b82f6 45%,#1d4ed8)}.kpi-card,.kpi-card *{color:#fff}
.avatar-ring{padding:2px;border-radius:999px;background:linear-gradient(135deg,#38bdf8,#2563eb,#7c3aed)}.gradient-border{border-radius:1.5rem;background:linear-gradient(180deg,#fff,#fff) padding-box,linear-gradient(135deg,#38bdf8,#2563eb,#7c3aed) border-box;border:1px solid transparent}.topbar-pill{display:flex;align-items:center;gap:.75rem;padding:.8rem 1rem;border-radius:1rem;background:rgba(255,255,255,.82);border:1px solid rgba(226,232,240,.9);box-shadow:0 10px 25px rgba(15,23,42,.06)}

/* Login SIMASKU tetap didukung */
.mobile-screen{position:relative;width:132px;min-height:270px;border-radius:1.9rem;padding:.75rem;box-shadow:0 22px 40px rgba(15,23,42,.18);border:6px solid rgba(255,255,255,.75);overflow:hidden}.mobile-screen::before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:44px;height:6px;border-radius:999px;background:rgba(255,255,255,.8)}.mobile-screen.orange{background:linear-gradient(180deg,#fff7ed,#ffffff 44%,#fff1f2)}.mobile-screen.purple{background:linear-gradient(180deg,#f5f3ff,#ffffff 44%,#ecfeff)}.mobile-screen.cyan{background:linear-gradient(180deg,#ecfeff,#ffffff 44%,#eff6ff)}.mini-block{border-radius:1rem;background:#fff;box-shadow:0 10px 20px rgba(15,23,42,.08)}.mini-chip{border-radius:999px;padding:.2rem .55rem;font-size:.58rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.mini-line{height:8px;border-radius:999px;background:#e2e8f0}.mini-line.sm{height:6px}.mini-line.orange{background:linear-gradient(90deg,#fdba74,#f97316)}.mini-line.purple{background:linear-gradient(90deg,#c4b5fd,#8b5cf6)}.mini-line.cyan{background:linear-gradient(90deg,#a5f3fc,#06b6d4)}.mini-stat{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#fff;font-size:.75rem;font-weight:800}.float-card{animation:floaty 5s ease-in-out infinite}.float-card.delay{animation-delay:1.2s}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

@media(max-width:768px){.mobile-stack{display:block}.card,.surface-card,.soft-panel,.glass-card{border-radius:1.25rem}.table-modern td,.table-modern th,.table-shell td,.table-shell th{padding:.75rem}.btn{padding:.65rem .85rem}main>section{padding:1rem!important}.kpi-card{border-radius:1.35rem;min-height:128px}.metric-tile{border-radius:1.25rem}.footer-static{font-size:.72rem;padding:1rem .75rem!important}}
@media print{#sidebar,header,footer,.no-print{display:none!important}main,section{padding:0!important}.card,.surface-card,.soft-panel{box-shadow:none!important;border:1px solid #ddd!important}}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#38bdf8,#2563eb);border-radius:999px}::-webkit-scrollbar-track{background:transparent}


/* Final sidebar/topbar fix: sidebar full viewport height, topbar without app title */
#sidebar{
  position:fixed!important;
  top:0!important;
  bottom:0!important;
  left:0!important;
  min-height:100vh!important;
  height:100vh!important;
  max-height:100vh!important;
  overflow-y:auto!important;
  z-index:40!important;
}
@supports(height:100dvh){
  #sidebar{min-height:100dvh!important;height:100dvh!important;max-height:100dvh!important;}
}
#sidebar > nav{min-height:0!important;}
#sidebar .sidebar-logout{margin-top:auto!important;}
@media(min-width:1024px){
  body:not(.sidebar-collapsed) main.flex-1{margin-left:19rem!important;transition:margin-left .3s ease;width:calc(100% - 19rem)!important;}
  body.sidebar-collapsed main.flex-1{margin-left:0!important;width:100%!important;transition:margin-left .3s ease;}
  body.sidebar-collapsed #sidebar{transform:translateX(-100%)!important;margin-left:0!important;}
  #sidebar{transform:translateX(0);}
}
@media(max-width:1023px){
  main.flex-1{margin-left:0!important;width:100%!important;}
  #sidebar{max-width:86vw!important;}
}
header.sticky .flex-1{min-width:0;}

/* Final clean data page, hamburger, full-height sidebar */
#sidebar{
  width:19rem!important;
  min-height:100vh!important;
  height:100vh!important;
  max-height:100vh!important;
  display:flex!important;
  flex-direction:column!important;
}
@supports(height:100dvh){#sidebar{min-height:100dvh!important;height:100dvh!important;max-height:100dvh!important;}}
#sidebar nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;padding-bottom:.75rem!important;}
#sidebar .sidebar-logout{flex:0 0 auto!important;margin-top:auto!important;}
#sidebarToggle{display:inline-flex!important;visibility:visible!important;opacity:1!important;min-width:44px;min-height:44px;border-radius:14px!important;}
.clean-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.page-actions{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;}
.clean-card{box-shadow:0 16px 45px rgba(15,23,42,.07)!important;border:1px solid rgba(219,234,254,.85)!important;background:rgba(255,255,255,.94)!important;}
.clean-filter-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(160px,.8fr) minmax(160px,.9fr) minmax(130px,.55fr) auto;gap:.85rem;align-items:end;}
.filter-label{display:block;font-size:.76rem;font-weight:900;color:#475569;margin-bottom:.42rem;text-transform:uppercase;letter-spacing:.06em;}
.filter-buttons{display:flex;gap:.55rem;align-items:center;}
.table-header-clean{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:linear-gradient(180deg,#ffffff,#f8fafc);}
.clean-table{background:white;border-collapse:separate;border-spacing:0;}
.clean-table th{padding:.9rem 1rem;text-align:left;background:#f8fafc;color:#64748b;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;border-bottom:1px solid #e2e8f0;white-space:nowrap;}
.clean-table td{padding:.9rem 1rem;border-bottom:1px solid #eef2f7;color:#334155;vertical-align:middle;}
.clean-table tbody tr:hover{background:#f8fafc;}
.cell-ellipsis{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pagination-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem 1.25rem;background:#fff;border-top:1px solid #eef2f7;}
.pagination-links{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;}
.page-link{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 .75rem;border-radius:.85rem;border:1px solid #dbeafe;background:#fff;color:#1d4ed8;font-weight:800;font-size:.85rem;text-decoration:none;}
.page-link.active{background:linear-gradient(135deg,#0ea5e9,#2563eb);color:#fff;border-color:#2563eb;}
.page-link.disabled{opacity:.45;pointer-events:none;color:#64748b;}
.modal-backdrop{position:fixed;inset:0;z-index:80;background:rgba(15,23,42,.52);backdrop-filter:blur(8px);display:flex;align-items:flex-end;justify-content:center;padding:1rem;}
.modal-backdrop.hidden{display:none!important;}
.modal-card{width:min(760px,100%);max-height:92vh;overflow:hidden;background:#fff;border-radius:1.5rem;box-shadow:0 28px 80px rgba(15,23,42,.25);border:1px solid #e2e8f0;display:flex;flex-direction:column;}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem 1.25rem;border-bottom:1px solid #eef2f7;background:linear-gradient(180deg,#ffffff,#f8fafc);}
.modal-close{width:42px;height:42px;border-radius:14px;border:1px solid #dbeafe;background:#eef6ff;color:#1d4ed8;font-weight:900;}
.modal-form{display:flex;flex-direction:column;min-height:0;}
.modal-fields{padding:1.25rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;overflow-y:auto;}
.modal-actions{padding:1rem 1.25rem;border-top:1px solid #eef2f7;background:#fff;display:flex;justify-content:flex-end;gap:.75rem;}
@media(max-width:1023px){
  #sidebar{width:min(19rem,86vw)!important;}
  .clean-filter-grid{grid-template-columns:1fr;}
  .filter-buttons{display:grid;grid-template-columns:1fr 1fr;width:100%;}
  .page-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;}
  .page-actions .btn:first-child{grid-column:1/-1;}
  .pagination-bar{align-items:stretch;}
  .pagination-links{width:100%;justify-content:center;}
  .clean-table th,.clean-table td{padding:.75rem .85rem;}
  .cell-ellipsis{max-width:170px;}
  .modal-backdrop{align-items:flex-end;padding:.75rem;}
  .modal-card{border-radius:1.35rem;max-height:94vh;}
  .modal-fields{grid-template-columns:1fr;padding:1rem;}
  .modal-actions{display:grid;grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  .page-actions{grid-template-columns:1fr;}
  .filter-buttons{grid-template-columns:1fr;}
  .pagination-links .page-link:not(.active):not(:first-child):not(:last-child){display:none;}
  .modal-actions{grid-template-columns:1fr;}
}


/* Modul Google Drive style + jurnal referensi */
.drive-filter-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(150px,.7fr) minmax(130px,.55fr) minmax(140px,.65fr) auto;gap:.85rem;align-items:end}.drive-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem}.drive-icon{width:52px;height:52px;border-radius:18px;background:linear-gradient(135deg,#38bdf8,#2563eb);color:#fff;display:grid;place-items:center;font-size:1.35rem;box-shadow:0 16px 32px rgba(37,99,235,.23)}.drive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:1rem}.drive-card{background:#fff;border:1px solid rgba(219,234,254,.9);border-radius:1.5rem;box-shadow:0 16px 42px rgba(15,23,42,.07);overflow:hidden;transition:.22s;cursor:pointer}.drive-card:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(37,99,235,.14);border-color:#93c5fd}.drive-thumb{height:150px;background:linear-gradient(135deg,#eff6ff,#e0f2fe 45%,#dbeafe);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.6rem;color:#2563eb}.drive-thumb i{font-size:3rem}.drive-thumb span{font-size:.75rem;font-weight:900;letter-spacing:.16em;background:rgba(255,255,255,.8);border:1px solid #bfdbfe;border-radius:999px;padding:.25rem .7rem}.drive-preview-card{width:min(1180px,100%);height:min(92vh,820px);background:#fff;border-radius:1.5rem;box-shadow:0 28px 80px rgba(15,23,42,.26);border:1px solid #e2e8f0;display:flex;flex-direction:column;overflow:hidden}.drive-preview-body{flex:1;min-height:0;background:#f8fafc}.drive-frame{width:100%;height:100%;border:0;background:#fff}.preview-fallback{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:2rem;color:#475569}.preview-fallback i{font-size:4rem;color:#2563eb;margin-bottom:1rem}.preview-fallback h3{font-size:1.3rem;font-weight:900;color:#0f172a}.dropzone{position:relative;border:2px dashed #93c5fd;border-radius:1.3rem;background:linear-gradient(180deg,#eff6ff,#fff);padding:1.5rem;text-align:center;color:#1d4ed8;display:flex;flex-direction:column;gap:.35rem;align-items:center;justify-content:center;min-height:145px}.dropzone i{font-size:2rem}.dropzone span{font-size:.85rem;color:#64748b}.dropzone input{position:absolute;inset:0;opacity:0;cursor:pointer}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jurnal-hero{background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(236,253,245,.85))!important}.jurnal-stat{background:#fff;border:1px solid #d1fae5;border-radius:1.25rem;padding:1rem;box-shadow:0 14px 32px rgba(16,185,129,.10)}.jurnal-stat strong{display:block;font-size:1.6rem;font-weight:950;color:#047857}.jurnal-stat span{font-size:.78rem;font-weight:900;color:#64748b;text-transform:uppercase;letter-spacing:.06em}.jurnal-filter-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(150px,.65fr) minmax(150px,.65fr) auto;gap:.85rem;align-items:end}.jurnal-timeline{display:grid;gap:1rem}.jurnal-card{display:grid;grid-template-columns:92px 1fr;padding:1rem;gap:1rem}.jurnal-date{border-radius:1.25rem;background:linear-gradient(135deg,#10b981,#0ea5e9);color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:92px;box-shadow:0 16px 32px rgba(16,185,129,.20)}.jurnal-date span{font-size:2rem;font-weight:950;line-height:1}.jurnal-date small{font-weight:900;opacity:.92}.jurnal-content h3{font-size:1.1rem;font-weight:950;color:#0f172a}.jurnal-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:1.15rem;padding:1rem}.jurnal-box b{display:block;color:#0f172a;margin-bottom:.35rem}.jurnal-box p{color:#475569;font-size:.94rem;line-height:1.55}
@media(max-width:1023px){.drive-filter-grid,.jurnal-filter-grid{grid-template-columns:1fr}.drive-toolbar{align-items:flex-start;flex-direction:column}.drive-grid{grid-template-columns:1fr}.jurnal-card{grid-template-columns:1fr}.jurnal-date{min-height:72px;flex-direction:row;gap:.55rem}.drive-preview-card{height:94vh;border-radius:1.25rem}}
.alert-success{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46;border-radius:1rem;padding:.85rem 1rem;font-weight:700}
.alert-error{background:#fff1f2;border:1px solid #fecdd3;color:#9f1239;border-radius:1rem;padding:.85rem 1rem;font-weight:700}


/* Login visual cards: dibuat lebih proporsional agar tidak terlalu tirus */
.login-visual-cards .mobile-screen{width:clamp(170px,28%,210px)!important;min-height:260px!important;border-radius:1.6rem!important;flex:1 1 170px!important;}
@media(max-width:768px){.login-visual-cards .mobile-screen{width:100%!important;min-height:210px!important;}.login-visual-cards{display:grid!important;grid-template-columns:1fr!important;}}
.profile-photo-preview{width:116px;height:116px;border-radius:999px;object-fit:cover;border:5px solid #fff;box-shadow:0 16px 36px rgba(15,23,42,.16);background:#fff;}


/* Fixing final: profil lebih rapi, foto kecil, list informasi */
.profile-page-grid{align-items:start;}
.profile-compact-head{display:flex;align-items:center;gap:1rem;border-bottom:1px solid #eef2f7;padding-bottom:1.1rem;}
.profile-photo-small{width:76px;height:76px;border-radius:999px;object-fit:cover;border:4px solid #fff;box-shadow:0 12px 26px rgba(15,23,42,.14);background:#fff;}
.profile-upload-btn{padding:.62rem .9rem!important;font-size:.85rem!important;}
.profile-section-title{display:flex;align-items:center;gap:.55rem;font-size:1rem;font-weight:950;color:#0f172a;}
.profile-section-title i{color:#2563eb;}
.profile-info-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;}
.profile-info-item{border:1px solid #e2e8f0;background:#f8fafc;border-radius:1.05rem;padding:.85rem 1rem;min-width:0;}
.profile-info-item span{display:block;font-size:.72rem;font-weight:950;text-transform:uppercase;letter-spacing:.06em;color:#64748b;margin-bottom:.35rem;}
.profile-info-item strong{display:block;font-size:.94rem;font-weight:850;color:#0f172a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.profile-info-item.editable{background:#fff;}
.profile-info-item.editable .input-shell{border-radius:.85rem!important;}
.profile-info-full{grid-column:1/-1;}
@media(max-width:768px){.profile-compact-head{align-items:flex-start}.profile-info-list{grid-template-columns:1fr}.profile-photo-small{width:68px;height:68px}.profile-page-grid{grid-template-columns:1fr!important}}

/* Fixing final: tabel input nilai rapi dan bisa digeser horizontal */
.nilai-scroll-guide{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:#eff6ff;border-bottom:1px solid #dbeafe;color:#1e40af;font-size:.86rem;font-weight:850;}
.nilai-scroll-guide i{margin-right:.35rem;}
.nilai-scroll-mini{font-size:.74rem;color:#64748b;font-weight:700;}
.nilai-table-scroll{width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;scrollbar-width:thin;background:#fff;}
.nilai-table-scroll:focus{outline:3px solid rgba(14,165,233,.25);outline-offset:-3px;}
.nilai-wide-table{min-width:max-content;width:max-content;}
.nilai-wide-table th,.nilai-wide-table td{min-width:150px;}
.nilai-wide-table .nilai-dpl-head{min-width:180px;max-width:240px;white-space:normal;line-height:1.3;vertical-align:top;}
.nilai-sticky{position:sticky;z-index:3;background:#fff;box-shadow:1px 0 0 #e2e8f0;}
thead .nilai-sticky{z-index:5;background:#f8fafc;}
.nilai-sticky-name{left:0;min-width:220px!important;max-width:260px;}
.nilai-sticky-nisn{left:220px;min-width:135px!important;max-width:145px;}
.nilai-wide-table tbody tr:hover .nilai-sticky{background:#f8fafc;}
.nilai-bottom-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
@media(max-width:768px){.nilai-scroll-guide{align-items:flex-start;flex-direction:column;gap:.25rem}.nilai-sticky-name{min-width:180px!important;left:0}.nilai-sticky-nisn{min-width:120px!important;left:180px}.nilai-wide-table th,.nilai-wide-table td{min-width:135px}.nilai-wide-table .nilai-dpl-head{min-width:165px}.nilai-bottom-actions{display:grid;grid-template-columns:1fr}.nilai-bottom-actions .btn{width:100%;}}

/* Mobile final polish: jurnal, nilai, login, dan layout umum */
[data-modal-open]{position:relative;z-index:2;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}
.modal-backdrop{overscroll-behavior:contain;}
.modal-card{width:min(760px,calc(100vw - 1.5rem));}
.modal-fields{min-height:0;}
@media(max-width:768px){
  body{background:#eef8ff;}
  main>section{padding:1rem!important;padding-bottom:6rem!important;}
  .clean-page-head{display:grid;grid-template-columns:1fr;gap:.85rem;margin-bottom:1rem!important;}
  .clean-page-head .btn,.page-head .btn{width:100%;min-height:48px;border-radius:1rem;font-size:.95rem;}
  .surface-card,.clean-card,.glass-card{border-radius:1.25rem!important;box-shadow:0 14px 34px rgba(15,23,42,.08)!important;}
  .jurnal-hero{padding:1rem!important;}
  .jurnal-hero .grid{grid-template-columns:1fr!important;}
  .jurnal-hero .grid.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.55rem!important;}
  .jurnal-stat{padding:.72rem .45rem;border-radius:1rem;}
  .jurnal-stat strong{font-size:1.2rem;}
  .jurnal-stat span{font-size:.62rem;letter-spacing:.03em;}
  .jurnal-card{padding:.85rem;border-radius:1.25rem!important;}
  .jurnal-date{justify-content:flex-start;padding:.75rem 1rem;min-height:60px;}
  .jurnal-content .flex.items-start{align-items:flex-start!important;}
  .jurnal-box{padding:.85rem;border-radius:1rem;}
  .modal-backdrop{align-items:flex-end!important;padding:.5rem!important;z-index:9999!important;}
  .modal-card{width:100%!important;max-height:calc(100dvh - 1rem)!important;border-radius:1.35rem 1.35rem .85rem .85rem!important;}
  .modal-head{padding:1rem;position:sticky;top:0;z-index:2;}
  .modal-fields{padding:1rem;gap:.85rem;max-height:calc(100dvh - 190px);overflow-y:auto;-webkit-overflow-scrolling:touch;}
  .modal-actions{position:sticky;bottom:0;z-index:2;display:grid!important;grid-template-columns:1fr;gap:.65rem;padding:.85rem 1rem calc(.85rem + env(safe-area-inset-bottom));}
  .modal-actions .btn{width:100%;min-height:48px;}
  .dropzone{min-height:118px;padding:1rem;}
  .input-shell,select.input-shell,textarea.input-shell{min-height:46px;font-size:16px!important;border-radius:.95rem!important;}
}

/* Halaman nilai mobile: filter ringkas, tabel horizontal kuat, tombol simpan di kanan */
.nilai-table-scroll{overscroll-behavior-x:contain;}
.nilai-bottom-actions .btn{margin-left:auto;}
@media(max-width:768px){
  #nilaiForm{margin-left:-.25rem;margin-right:-.25rem;overflow:visible!important;}
  #nilaiForm .table-header-clean{display:grid!important;grid-template-columns:1fr;gap:.75rem;padding:1rem!important;}
  #nilaiForm .table-header-clean .btn{justify-self:end;width:auto;min-width:150px;}
  #nilaiForm>.p-4.md\:p-6{padding:1rem!important;}
  #nilaiForm .grid.sm\:grid-cols-2{display:flex!important;overflow-x:auto;gap:.75rem;padding-bottom:.45rem;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;}
  #nilaiForm .grid.sm\:grid-cols-2>label{min-width:230px;scroll-snap-align:start;background:#fff;border:1px solid #dbeafe;border-radius:1rem;padding:.75rem;box-shadow:0 10px 24px rgba(15,23,42,.06);}
  .nilai-scroll-guide{position:sticky;top:0;z-index:8;padding:.75rem 1rem!important;background:linear-gradient(135deg,#e0f2fe,#eff6ff);}
  .nilai-table-scroll{max-width:100vw;overflow-x:auto!important;overflow-y:visible;border-top:1px solid #dbeafe;border-bottom:1px solid #dbeafe;}
  .nilai-wide-table{min-width:max-content!important;width:max-content!important;font-size:.82rem;}
  .nilai-wide-table th,.nilai-wide-table td{padding:.65rem .7rem!important;min-width:132px;}
  .nilai-wide-table .nilai-dpl-head{min-width:172px!important;max-width:210px;font-size:.68rem;}
  .nilai-sticky-name{left:0!important;min-width:164px!important;max-width:164px!important;white-space:normal;line-height:1.25;}
  .nilai-sticky-nisn{left:164px!important;min-width:112px!important;max-width:112px!important;}
  .nilai-wide-table select.input-shell{min-width:146px!important;padding:.64rem .75rem!important;}
  .nilai-bottom-actions{position:sticky;bottom:0;z-index:9;display:flex!important;align-items:center;justify-content:flex-end!important;gap:.75rem;padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom))!important;box-shadow:0 -14px 28px rgba(15,23,42,.08);}
  .nilai-bottom-actions>div{display:none;}
  .nilai-bottom-actions .btn{width:auto!important;min-width:158px;margin-left:auto;justify-self:end;}
}
@media(max-width:430px){
  .nilai-sticky-name{min-width:148px!important;max-width:148px!important;}
  .nilai-sticky-nisn{left:148px!important;min-width:96px!important;max-width:96px!important;}
  .nilai-wide-table th,.nilai-wide-table td{min-width:124px;}
  .nilai-wide-table .nilai-dpl-head{min-width:160px!important;}
}

/* Login mobile dibuat sederhana dan fit di layar HP */
@media(max-width:768px){
  body:has(.login-mobile-card), body.min-h-screen.p-4{padding:.75rem!important;align-items:flex-start!important;background:linear-gradient(180deg,#e0f2fe,#f8fafc)!important;}
  .login-shell,.glass-card{width:100%!important;border-radius:1.35rem!important;overflow:hidden;}
  .login-shell>.grid,.glass-card>.grid{display:block!important;min-height:auto!important;}
  .login-shell section:first-child,.glass-card section:first-child{display:none!important;}
  .login-shell section:last-child,.glass-card section:last-child{min-height:calc(100dvh - 1.5rem);display:flex!important;align-items:center!important;padding:1.25rem!important;background:rgba(255,255,255,.96)!important;}
  .login-shell h2,.glass-card h2{font-size:1.9rem!important;line-height:1.12!important;margin-top:1rem!important;}
  .login-shell form,.glass-card form{margin-top:1.25rem!important;}
  .login-shell .input-shell,.glass-card .input-shell{font-size:16px!important;min-height:50px;}
  .login-shell .btn,.glass-card .btn{min-height:52px;}
}

@media(max-width:480px){
  .btn{padding:.7rem .9rem;}
  .badge{font-size:.68rem;}
  .clean-table th,.clean-table td{padding:.65rem .7rem;}
}

/* Final responsive guard: desktop tetap stabil, mobile menyesuaikan tanpa merombak layout desktop */
.progres{height:.55rem;border-radius:999px;background:#e2e8f0;overflow:hidden;display:block;}
.progres>span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0ea5e9,#2563eb,#7c3aed);}
.chart-wrap{min-height:260px;}
.chart-wrap canvas{width:100%!important;min-height:240px;}
@media(min-width:1024px){
  .dashboard-head,.dashboard-kpi-grid,.dashboard-main-grid,.dashboard-secondary-grid{max-width:100%;}
  .surface-card,.soft-panel,.metric-tile,.kpi-card{transition:box-shadow .2s ease,transform .2s ease;}
  main>section{overflow-x:hidden;}
}
@media(max-width:1023px){
  .dashboard-head{display:grid!important;grid-template-columns:1fr!important;gap:1rem!important;}
  .dashboard-head h1{font-size:clamp(1.65rem,6vw,2.25rem)!important;line-height:1.12;}
  .dashboard-actions,.dashboard-head>.flex,.dashboard-head>a.btn{width:100%;}
  .dashboard-actions .btn,.dashboard-head>a.btn{flex:1 1 180px;min-height:46px;}
  .dashboard-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .dashboard-main-grid,.dashboard-secondary-grid{grid-template-columns:1fr!important;}
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .chart-wrap{min-height:230px;padding:.75rem!important;}
}
@media(max-width:640px){
  .dashboard-kpi-grid{grid-template-columns:1fr!important;}
  .quick-grid{grid-template-columns:1fr!important;}
  .kpi-card{min-height:auto!important;padding:1rem!important;}
  .kpi-card .text-4xl{font-size:2rem!important;}
  .icon-chip{width:42px;height:42px;font-size:1.2rem;}
  .activity-card .w-11,.activity-card .w-12{width:2.5rem!important;height:2.5rem!important;border-radius:1rem!important;}
  .insight-card{border-radius:1.25rem!important;}
  .chart-wrap{min-height:220px;overflow:hidden;}
  .chart-wrap canvas{min-height:210px;}
  table{max-width:100%;}
  .table-shell,.table-scroll,.clean-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
}

/* FINAL FIX MOBILE GURU: jurnal clickable + input penilaian ramah HP */
@media(max-width:768px){
  .page-head.clean-page-head{position:relative;z-index:12;isolation:isolate;}
  .page-head.clean-page-head [data-modal-open="jurnalModal"]{position:relative!important;z-index:50!important;pointer-events:auto!important;display:flex!important;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:52px;box-shadow:0 14px 30px rgba(37,99,235,.22);}
  #sidebarOverlay.hidden{display:none!important;pointer-events:none!important;}
  #sidebarOverlay:not(.hidden){pointer-events:auto;}
  #jurnalModal.modal-backdrop{z-index:10000!important;}
  #jurnalModal .modal-card{height:auto;max-height:calc(100dvh - .75rem)!important;}
  #jurnalModal .modal-form{min-height:0;max-height:calc(100dvh - .75rem);}
  #jurnalModal .modal-fields{max-height:calc(100dvh - 180px)!important;}
  #jurnalModal select,#jurnalModal input,#jurnalModal textarea{font-size:16px!important;}

  #nilaiForm{overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;}
  #nilaiForm .table-header-clean{position:sticky;top:.5rem;z-index:18;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border:1px solid #dbeafe!important;border-radius:1.25rem!important;margin-bottom:.75rem;box-shadow:0 14px 34px rgba(15,23,42,.08);}
  #nilaiForm .table-header-clean .btn{min-height:48px;}
  #nilaiForm .nilai-table-scroll{overflow:visible!important;border:0!important;background:transparent!important;}
  #nilaiForm .nilai-wide-table{display:block!important;width:100%!important;min-width:0!important;font-size:.92rem!important;border-spacing:0!important;}
  #nilaiForm .nilai-wide-table thead{display:none!important;}
  #nilaiForm .nilai-wide-table tbody{display:grid!important;gap:1rem!important;width:100%;}
  #nilaiForm .nilai-wide-table tr{display:block!important;background:#fff;border:1px solid #dbeafe;border-radius:1.35rem;box-shadow:0 14px 34px rgba(15,23,42,.07);overflow:hidden;padding:.85rem;}
  #nilaiForm .nilai-wide-table td{display:flex!important;align-items:center;justify-content:space-between;gap:1rem;width:100%!important;min-width:0!important;max-width:none!important;padding:.75rem .35rem!important;border-bottom:1px solid #eef2ff!important;white-space:normal!important;}
  #nilaiForm .nilai-wide-table td:last-child{border-bottom:0!important;}
  #nilaiForm .nilai-wide-table td::before{content:attr(data-label);flex:0 0 42%;max-width:42%;font-size:.72rem;line-height:1.2;font-weight:950;text-transform:uppercase;letter-spacing:.04em;color:#2563eb;}
  #nilaiForm .nilai-wide-table td.nilai-sticky{position:static!important;left:auto!important;z-index:auto!important;box-shadow:none!important;background:transparent!important;}
  #nilaiForm .nilai-wide-table td.nilai-sticky-name{display:block!important;padding:.35rem .35rem .2rem!important;font-size:1rem;font-weight:950;color:#0f172a;border-bottom:0!important;}
  #nilaiForm .nilai-wide-table td.nilai-sticky-name::before{content:'Siswa';display:block;max-width:none;margin-bottom:.15rem;color:#64748b;font-size:.68rem;}
  #nilaiForm .nilai-wide-table td.nilai-sticky-nisn{justify-content:flex-start!important;gap:.5rem;color:#64748b;padding:.15rem .35rem .75rem!important;border-bottom:1px solid #dbeafe!important;}
  #nilaiForm .nilai-wide-table td.nilai-sticky-nisn::before{content:'NISN';flex:0 0 auto;max-width:none;background:#eff6ff;color:#2563eb;border-radius:999px;padding:.18rem .55rem;font-size:.65rem;}
  #nilaiForm .nilai-wide-table select.input-shell{width:58%!important;min-width:0!important;min-height:46px;font-size:16px!important;border-radius:1rem!important;background:#f8fbff!important;}
  #nilaiForm .nilai-wide-table .badge{margin-left:auto;}
  #nilaiForm .nilai-scroll-guide{position:relative!important;top:auto!important;border:1px solid #bfdbfe;border-radius:1.15rem;margin-bottom:.75rem;color:#1e3a8a;}
  #nilaiForm .nilai-scroll-guide .nilai-scroll-mini{font-size:.72rem;color:#475569;margin-top:.25rem;}
  #nilaiForm .nilai-bottom-actions{position:sticky!important;bottom:0!important;z-index:20!important;border:1px solid #dbeafe!important;border-radius:1.2rem 1.2rem 0 0!important;background:rgba(255,255,255,.98)!important;backdrop-filter:blur(10px);}
  #nilaiForm .nilai-bottom-actions .btn{min-height:50px;min-width:170px!important;box-shadow:0 14px 30px rgba(37,99,235,.22);}
  #nilaiForm .grid.sm\:grid-cols-2>label{min-width:210px;}
}
@media(max-width:390px){
  #nilaiForm .nilai-wide-table td{display:block!important;}
  #nilaiForm .nilai-wide-table td::before{display:block;max-width:none;margin-bottom:.45rem;}
  #nilaiForm .nilai-wide-table select.input-shell{width:100%!important;}
}

/* FINAL FIX 2: tombol jurnal mobile wajib bisa ditap + UI form nilai mengikuti SET DPL admin */
.btn-isi-jurnal-mobile{touch-action:manipulation;-webkit-tap-highlight-color:rgba(37,99,235,.16);cursor:pointer;}
@media(max-width:768px){
  .btn-isi-jurnal-mobile,[data-modal-open="jurnalModal"]{pointer-events:auto!important;position:relative!important;z-index:10001!important;user-select:none!important;}
  .page-head.clean-page-head{overflow:visible!important;}
  #jurnalModal.modal-backdrop{display:flex;align-items:flex-end;justify-content:center;padding:.5rem;}
  #jurnalModal.modal-backdrop.hidden{display:none!important;}
  #jurnalModal .modal-card{width:100%!important;max-width:100%!important;border-radius:1.35rem 1.35rem .75rem .75rem!important;max-height:96dvh!important;}
  #jurnalModal .modal-head{padding:1rem!important;position:sticky;top:0;z-index:3;}
  #jurnalModal .modal-fields{padding:1rem!important;gap:.85rem!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;max-height:calc(96dvh - 158px)!important;}
  #jurnalModal .modal-actions{position:sticky;bottom:0;z-index:3;padding:.85rem!important;gap:.65rem!important;background:rgba(255,255,255,.98)!important;box-shadow:0 -12px 28px rgba(15,23,42,.08);}
  #jurnalModal .modal-actions .btn{min-height:50px;}

  #nilaiForm .nilai-admin-set{border:1px solid #dbeafe!important;border-radius:1.25rem!important;margin:0 .75rem .75rem!important;box-shadow:0 12px 28px rgba(15,23,42,.06);}
  #nilaiForm .nilai-dpl-chipgrid{display:flex;gap:.6rem;overflow-x:auto;padding-bottom:.25rem;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;}
  #nilaiForm .nilai-dpl-chip{flex:0 0 78%;scroll-snap-align:start;display:flex;gap:.6rem;align-items:flex-start;border:1px solid #bfdbfe;background:#eff6ff;color:#1e3a8a;border-radius:1rem;padding:.75rem;font-size:.8rem;font-weight:800;line-height:1.25;}
  #nilaiForm .nilai-dpl-chip b{display:grid;place-items:center;flex:0 0 1.7rem;width:1.7rem;height:1.7rem;border-radius:.7rem;background:#2563eb;color:#fff;font-size:.75rem;}
  #nilaiForm .p-4.md\:p-6.border-b.border-slate-100.bg-slate-50\/70{margin:.75rem;border:1px solid #e2e8f0!important;border-radius:1.25rem!important;background:#f8fafc!important;}
  #nilaiForm .p-4.md\:p-6.border-b.border-slate-100.bg-slate-50\/70 .grid{display:flex!important;gap:.75rem;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:.2rem;}
  #nilaiForm .p-4.md\:p-6.border-b.border-slate-100.bg-slate-50\/70 label{flex:0 0 82%;min-width:250px!important;background:#fff;border:1px solid #e2e8f0;border-radius:1rem;padding:.75rem;}
  #nilaiForm .nilai-scroll-guide{display:none!important;}
  #nilaiForm .nilai-siswa-card{position:relative;}
  #nilaiForm .nilai-siswa-card::before{content:'Form Nilai';display:inline-flex;margin:.1rem .35rem .5rem;padding:.25rem .65rem;border-radius:999px;background:#ecfeff;color:#0e7490;font-size:.68rem;font-weight:950;text-transform:uppercase;letter-spacing:.08em;}
  #nilaiForm .nilai-wide-table td[data-label]:not(.nilai-sticky)::before{content:attr(data-label);}
  #nilaiForm .nilai-wide-table td[data-label]:not(.nilai-sticky){background:linear-gradient(180deg,#ffffff,#f8fbff);border:1px solid #eef2ff!important;border-radius:1rem;margin:.55rem 0;padding:.75rem!important;}
  #nilaiForm .nilai-select{width:100%!important;min-height:52px!important;margin-top:.45rem;background:#fff!important;border-color:#bfdbfe!important;font-weight:800;color:#0f172a;}
  #nilaiForm .nilai-wide-table td[data-label]:not(.nilai-sticky)::before{display:block!important;max-width:none!important;flex:initial!important;margin-bottom:.5rem;color:#1d4ed8;}
  #nilaiForm .nilai-wide-table td[data-label]:not(.nilai-sticky){display:block!important;}
  #nilaiForm .nilai-bottom-actions{display:flex!important;align-items:center;justify-content:flex-end!important;padding:.75rem .85rem calc(.85rem + env(safe-area-inset-bottom))!important;}
  #nilaiForm .nilai-bottom-actions .btn{width:100%!important;min-width:0!important;}
  #nilaiForm .table-header-clean{margin:.75rem!important;top:.25rem!important;}
  #nilaiForm .table-header-clean .btn{display:none!important;}
}

/* FINAL MOBILE POPUP JURNAL: popup tengah responsif, bukan bottom sheet */
body.jurnal-popup-open{overflow:hidden!important;overscroll-behavior:contain;}
#jurnalModal.jurnal-popup-modal{position:fixed!important;inset:0!important;z-index:2147483000!important;background:rgba(15,23,42,.55)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);align-items:center!important;justify-content:center!important;padding:1rem!important;pointer-events:auto!important;touch-action:auto!important;}
#jurnalModal.jurnal-popup-modal.hidden{display:none!important;}
#jurnalModal.jurnal-popup-modal:not(.hidden){display:flex!important;}
#jurnalModal.jurnal-popup-modal .modal-card{pointer-events:auto!important;background:#fff!important;width:min(720px,96vw)!important;max-height:calc(100dvh - 2rem)!important;border-radius:1.5rem!important;overflow:hidden!important;box-shadow:0 28px 80px rgba(15,23,42,.35)!important;border:1px solid rgba(226,232,240,.9)!important;display:flex!important;flex-direction:column!important;}
#jurnalModal.jurnal-popup-modal .modal-head{flex:0 0 auto!important;background:linear-gradient(135deg,#ffffff,#ecfdf5)!important;border-bottom:1px solid #d1fae5!important;}
#jurnalModal.jurnal-popup-modal .modal-form{min-height:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;}
#jurnalModal.jurnal-popup-modal .modal-fields{min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-y!important;}
#jurnalModal.jurnal-popup-modal select,#jurnalModal.jurnal-popup-modal input,#jurnalModal.jurnal-popup-modal textarea,#jurnalModal.jurnal-popup-modal button,#jurnalModal.jurnal-popup-modal .dropzone{touch-action:manipulation!important;pointer-events:auto!important;}
#jurnalModal.jurnal-popup-modal .dropzone input[type="file"]{touch-action:manipulation!important;}
#jurnalModal.jurnal-popup-modal .modal-actions{flex:0 0 auto!important;background:#fff!important;border-top:1px solid #e2e8f0!important;}
#jurnalModal.jurnal-popup-modal .modal-close{min-width:44px!important;min-height:44px!important;display:grid!important;place-items:center!important;border-radius:999px!important;background:#f8fafc!important;border:1px solid #e2e8f0!important;color:#0f172a!important;}
@media(max-width:768px){
  .btn-isi-jurnal-mobile,[data-modal-open="jurnalModal"]{z-index:30!important;}
  #jurnalModal.jurnal-popup-modal{padding:.85rem!important;align-items:center!important;justify-content:center!important;}
  #jurnalModal.jurnal-popup-modal .modal-card{width:100%!important;max-width:440px!important;max-height:calc(100dvh - 1.7rem)!important;border-radius:1.35rem!important;animation:jurnalPopupIn .18s ease-out;}
  #jurnalModal.jurnal-popup-modal .modal-head{position:relative!important;top:auto!important;padding:1rem!important;gap:.75rem!important;}
  #jurnalModal.jurnal-popup-modal .modal-head h2{font-size:1.05rem!important;line-height:1.2!important;}
  #jurnalModal.jurnal-popup-modal .modal-fields{display:grid!important;grid-template-columns:1fr!important;padding:1rem!important;gap:.78rem!important;max-height:calc(100dvh - 190px)!important;}
  #jurnalModal.jurnal-popup-modal .modal-fields label,#jurnalModal.jurnal-popup-modal .modal-fields .md\:col-span-2{grid-column:1/-1!important;}
  #jurnalModal.jurnal-popup-modal select,#jurnalModal.jurnal-popup-modal input,#jurnalModal.jurnal-popup-modal textarea{font-size:16px!important;min-height:48px!important;border-radius:1rem!important;}
  #jurnalModal.jurnal-popup-modal textarea{min-height:96px!important;}
  #jurnalModal.jurnal-popup-modal .dropzone{border-radius:1rem!important;padding:.9rem!important;min-height:96px!important;}
  #jurnalModal.jurnal-popup-modal .modal-actions{position:relative!important;bottom:auto!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:.65rem!important;padding:.8rem .9rem calc(.9rem + env(safe-area-inset-bottom))!important;box-shadow:0 -10px 28px rgba(15,23,42,.08)!important;}
  #jurnalModal.jurnal-popup-modal .modal-actions .btn{width:100%!important;min-height:48px!important;justify-content:center!important;border-radius:1rem!important;}
}
@media(max-width:380px){
  #jurnalModal.jurnal-popup-modal{padding:.55rem!important;}
  #jurnalModal.jurnal-popup-modal .modal-card{max-height:calc(100dvh - 1.1rem)!important;border-radius:1.15rem!important;}
  #jurnalModal.jurnal-popup-modal .modal-fields{padding:.8rem!important;max-height:calc(100dvh - 178px)!important;}
  #jurnalModal.jurnal-popup-modal .modal-actions{grid-template-columns:1fr!important;}
}
@keyframes jurnalPopupIn{from{opacity:.75;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}