/* SMART TASK — Final Soft Light Glass Design System v10
   Presentation layer only. Backend, routes, API, database and business logic are untouched. */
:root{
  --st-bg:#eef6ff;
  --st-bg-2:#f7fbff;
  --st-card:#ffffff;
  --st-card-soft:rgba(255,255,255,.94);
  --st-border:#d8e6f4;
  --st-border-soft:#e5eef7;
  --st-navy:#16345a;
  --st-navy-2:#214a79;
  --st-muted:#68819d;
  --st-muted-2:#7f95ad;
  --st-brand:#2f80ed;
  --st-brand-dark:#1f68ca;
  --st-brand-soft:#eaf4ff;
  --st-green:#159c68;
  --st-violet:#7258d8;
  --st-orange:#e68a22;
  --st-red:#dc5c68;
  --st-shadow:0 10px 28px rgba(53,91,129,.08);
  --st-shadow-soft:0 5px 16px rgba(53,91,129,.06);
}

html{min-width:0;overflow-x:hidden;scroll-behavior:smooth}
body{
  min-height:100vh;
  min-width:0;
  overflow-x:hidden;
  color:var(--st-navy);
  background:
    radial-gradient(900px 500px at 100% 0%, rgba(152,222,255,.24), transparent 65%),
    radial-gradient(760px 520px at 0% 40%, rgba(142,197,255,.17), transparent 62%),
    linear-gradient(180deg,#eef7ff 0%,#f7fbff 48%,#eef6ff 100%);
  background-attachment:fixed;
}
body::before,body::after{display:none!important}

/* Base typography: dark enough to read, soft enough to avoid eye strain. */
main{min-width:0;position:relative;overflow:visible}
main::before{display:none!important}
main h1,main h2,main h3,main h4,
main .text-slate-900{color:var(--st-navy)!important}
main .text-slate-800{color:#25466d!important}
main .text-slate-700{color:#385c84!important}
main .text-slate-600{color:#547292!important}
main .text-slate-500{color:#67819d!important}
main .text-slate-400{color:#7f95ad!important}
.page-kicker,.section-heading,.di-atas-latar{color:#396a9c!important;text-shadow:none!important;-webkit-text-stroke:0!important;paint-order:normal!important}

/* Clean white glass: the card itself is readable; blur is the subtle effect, not the content carrier. */
.glass-panel,.glass-panel-sm,.glass-panel-strong,.stat-card,
main .rounded-2xl.border,main .rounded-3xl.border{
  border-color:var(--st-border)!important;
  background:var(--st-card-soft)!important;
  box-shadow:var(--st-shadow)!important;
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.glass-panel:hover,.glass-panel-sm:hover,.stat-card:hover{
  border-color:#cbdced!important;
  box-shadow:0 14px 32px rgba(53,91,129,.10)!important;
}
.glass-panel-strong{background:#fff!important}
.empty-state{border-color:#d8e6f4!important;background:rgba(255,255,255,.92)!important;box-shadow:var(--st-shadow-soft)!important}
.notice-info{background:#eef6ff!important;border-color:#c9def4!important}
.notice-success{background:#eefaf5!important;border-color:#c9eadb!important}
.notice-warning{background:#fff8e8!important;border-color:#f2ddad!important}

/* Form controls */
.glass-input{
  border:1px solid #cadbeb!important;
  background:#fff!important;
  color:var(--st-navy)!important;
  box-shadow:0 2px 8px rgba(44,83,126,.04)!important;
}
.glass-input::placeholder{color:#8aa0b7!important}
.glass-input:focus{border-color:#76a9eb!important;box-shadow:0 0 0 4px rgba(47,128,237,.10)!important}
.btn-primary{
  background:linear-gradient(180deg,#3a8ff2,#2e7cde)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(47,128,237,.17)!important;
}
.btn-primary:hover{background:linear-gradient(180deg,#2f84e8,#286fc9)!important}
.btn-secondary{background:#fff!important;color:#2a64a3!important;border-color:#c7dbef!important;box-shadow:none!important}
.btn-secondary:hover{background:#f3f8fe!important}
.btn-ghost{color:#4d6886!important}
.btn-ghost:hover{background:#edf4fb!important;color:#234c79!important}

/* Desktop sidebar — one solid blue anchor, no translucent white overlay. */
aside.fixed.inset-y-0.left-0.hidden.w-64{
  position:fixed!important;
  z-index:50!important;
  width:16rem!important;
  border-right:1px solid rgba(255,255,255,.18)!important;
  background:linear-gradient(180deg,#2f83ea 0%,#2674d2 48%,#2166bd 100%)!important;
  box-shadow:8px 0 24px rgba(38,94,156,.10)!important;
  overflow:hidden!important;
}
aside.fixed.inset-y-0.left-0.hidden.w-64::before,
aside.fixed.inset-y-0.left-0.hidden.w-64::after{display:none!important}
aside.fixed.inset-y-0.left-0.hidden.w-64 > *{position:relative;z-index:2}
aside.fixed.inset-y-0.left-0.hidden.w-64 .nav-item{
  color:rgba(255,255,255,.92)!important;
  border:1px solid transparent!important;
  background:transparent!important;
}
aside.fixed.inset-y-0.left-0.hidden.w-64 .nav-item:hover{
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
}
aside.fixed.inset-y-0.left-0.hidden.w-64 a[class*="bg-"],
aside.fixed.inset-y-0.left-0.hidden.w-64 .nav-item[class*="bg-"]{
  background:rgba(255,255,255,.18)!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:none!important;
  color:#fff!important;
}
aside.fixed.inset-y-0.left-0.hidden.w-64 .text-slate-700,
aside.fixed.inset-y-0.left-0.hidden.w-64 .text-slate-900,
aside.fixed.inset-y-0.left-0.hidden.w-64 .text-brand-700{color:#fff!important}
aside.fixed.inset-y-0.left-0.hidden.w-64 .text-slate-500{color:rgba(235,246,255,.78)!important}
aside.fixed.inset-y-0.left-0.hidden.w-64 .m-3{border-color:rgba(255,255,255,.18)!important;background:rgba(255,255,255,.08)!important;box-shadow:none!important}
aside.fixed.inset-y-0.left-0.hidden.w-64 .m-3 .btn-ghost{color:#fff!important}
aside.fixed.inset-y-0.left-0.hidden.w-64 img{filter:none!important}

.st-sidebar-logo{display:flex!important;align-items:center!important;gap:.65rem!important;min-width:0}
.st-sidebar-logo img{width:2.7rem!important;height:2.7rem!important;object-fit:contain!important;flex:0 0 auto}
.st-sidebar-logo strong{display:block;color:#fff!important;font-size:.95rem!important;line-height:1.15}
.st-sidebar-logo small{display:block;margin-top:.12rem;color:rgba(238,248,255,.82)!important;font-size:.58rem!important;line-height:1.2}

/* Top header: white/light, not blue. */
.glass-nav{
  position:sticky!important;
  top:0!important;
  z-index:40!important;
  border-bottom:1px solid #dbe8f4!important;
  background:rgba(249,253,255,.90)!important;
  box-shadow:0 4px 14px rgba(55,91,126,.04)!important;
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}
.glass-nav .text-slate-400{color:#7890aa!important}
.glass-nav .text-slate-700{color:var(--st-navy)!important}
.glass-nav .btn-ghost{color:#355a82!important}

/* Ordinary white surfaces inside modules. */
main .bg-white{background:rgba(255,255,255,.96)!important}
main .bg-slate-50{background:#f5f9fd!important}
main .border-slate-200,main .border-slate-300{border-color:#d8e5f1!important}
main .shadow-lg,main .shadow-xl,main .shadow-2xl{box-shadow:var(--st-shadow)!important}
main table{min-width:640px;color:#294d75;border-collapse:separate;border-spacing:0}
main thead{background:#f5f9fd!important}
main thead th{color:#2a527d!important}
main tbody tr:hover{background:#f8fbff!important}
main .overflow-x-auto{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
main .grid,main .flex{min-width:0}
main img,main svg{max-width:100%}

/* Module/dashboard-specific panels: soft and quiet. */
.st-dashboard{display:flex;flex-direction:column;gap:1rem;min-width:0}
.st-dashboard-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;min-width:0}
.st-eyebrow{display:inline-flex;align-items:center;font-size:.66rem;font-weight:800;letter-spacing:.14em;color:#4d83ba}
.st-dashboard-head h1{margin-top:.35rem!important;color:var(--st-navy)!important;font-size:clamp(1.7rem,2.4vw,2.35rem)!important;letter-spacing:-.03em!important}
.st-dashboard-head p{margin-top:.35rem;color:#67819d!important;font-size:.84rem;max-width:48rem;line-height:1.6}
.st-head-tools{display:flex;align-items:center;gap:.55rem;flex-shrink:0}
.st-year-chip{display:flex;align-items:center;gap:.6rem;padding:.58rem .72rem;border:1px solid #d7e5f2;border-radius:1rem;background:#fff;box-shadow:var(--st-shadow-soft)}
.st-year-chip img{width:1.9rem;height:1.9rem;object-fit:contain}
.st-year-chip span{display:flex;flex-direction:column}.st-year-chip b{font-size:.62rem;color:#6b829c}.st-year-chip small{margin-top:.1rem;font-size:.74rem;font-weight:700;color:var(--st-navy)}
.st-chevron{color:#7b91a9!important}.st-icon-btn{position:relative;width:2.45rem;height:2.45rem;display:grid;place-items:center;border:1px solid #d7e5f2;border-radius:50%;background:#fff;color:#466887;box-shadow:var(--st-shadow-soft)}
.st-icon-btn span{position:absolute;right:-2px;top:-4px;width:1.05rem;height:1.05rem;display:grid;place-items:center;border-radius:999px;background:#e86674;color:#fff;font-size:.58rem;font-weight:800}
.st-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}
.st-metric{padding:1rem 1.05rem;border:1px solid var(--st-border);border-radius:1.35rem;background:#fff;box-shadow:var(--st-shadow-soft);min-width:0}
.st-metric-label{display:flex;align-items:center;justify-content:space-between;font-size:.68rem;font-weight:700;color:#607997}
.st-metric-label i{width:2.25rem;height:2.25rem;display:grid;place-items:center;border-radius:.8rem;background:#eff6ff;color:#2f83e8}
.st-metric strong{display:block;margin-top:.35rem;font-size:1.95rem;line-height:1;color:var(--st-navy)}
.st-metric small{display:block;margin-top:.35rem;font-size:.67rem;color:#7088a2}
.st-tone-green .st-metric-label i,.st-tone-green .st-quick>span,.st-accent-green{color:var(--st-green)!important}
.st-tone-violet .st-metric-label i,.st-tone-violet .st-quick>span,.st-accent-violet{color:var(--st-violet)!important}
.st-tone-orange .st-metric-label i,.st-tone-orange .st-quick>span,.st-accent-orange{color:var(--st-orange)!important}
.st-main-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr);gap:.95rem;align-items:stretch;min-width:0}
.st-card{position:relative;min-width:0;border:1px solid var(--st-border);border-radius:1.45rem;background:#fff;box-shadow:var(--st-shadow);overflow:hidden}
.st-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.05rem .7rem;min-width:0}
.st-card-kicker{font-size:.60rem;font-weight:800;letter-spacing:.11em;color:#4f82b2}.st-card h2{margin:.16rem 0 0!important;font-size:1rem!important;color:var(--st-navy)!important}.st-card-head p{margin-top:.22rem;font-size:.68rem;color:#6e87a2!important}.st-link{font-size:.67rem;font-weight:700;color:#2875c9;white-space:nowrap}
.st-class-list,.st-activity-list,.st-schedule-list{padding:0 1rem 1rem}.st-class-row{display:grid;grid-template-columns:2.2rem minmax(0,1fr) 3rem auto;gap:.7rem;align-items:center;padding:.74rem .15rem;border-top:1px solid #e4edf6;min-width:0}.st-class-icon{display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:.78rem;background:#edf5ff;font-size:.72rem;font-weight:800}.st-class-info{min-width:0}.st-class-info b{display:block;font-size:.73rem;color:var(--st-navy)}.st-class-info span{display:block;margin-top:.1rem;font-size:.62rem;color:#748ca5}.st-progress{height:.28rem;margin:.35rem 0 .1rem;border-radius:999px;background:#e5eef7;overflow:hidden}.st-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#3b8ee7,#64c4ea)}.st-class-row>strong{font-size:.72rem;color:var(--st-green)}.st-row-actions{display:flex;gap:.3rem}.st-row-actions a{width:1.9rem;height:1.9rem;display:grid;place-items:center;border:1px solid #d7e5f2;border-radius:.65rem;background:#fff;color:#3b7dc4;font-size:.72rem}
.st-activity-row{display:flex;align-items:center;gap:.7rem;padding:.7rem .1rem;border-top:1px solid #e4edf6;min-width:0}.st-activity-icon{width:2rem;height:2rem;flex:0 0 auto;display:grid;place-items:center;border-radius:.72rem;background:#f0f6fd;font-size:.78rem}.st-activity-row>div{min-width:0}.st-activity-row b,.st-activity-row small{display:block}.st-activity-row b{font-size:.68rem;color:var(--st-navy);overflow-wrap:anywhere}.st-activity-row small{margin-top:.14rem;font-size:.59rem;color:#778ea6}
.st-hero-card{min-height:100%;background:linear-gradient(145deg,#3c8fe9 0%,#5eabef 70%,#86c4f0 100%)!important;color:#fff!important}.st-hero-art{position:absolute;inset:0;background:radial-gradient(circle at 85% 12%,rgba(255,255,255,.22),transparent 34%);opacity:.85}.st-hero-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;min-height:18rem;padding:1.4rem}.st-hero-content img{width:3.6rem;height:3.6rem;object-fit:contain;filter:drop-shadow(0 7px 15px rgba(0,43,105,.12))}.st-hero-content>span{margin-top:.55rem;font-size:.65rem;font-weight:800;letter-spacing:.12em;color:rgba(255,255,255,.90)}.st-hero-content strong{margin-top:.1rem;font-size:1.75rem;letter-spacing:.035em}.st-hero-content small{margin-top:.1rem;font-size:.73rem;color:rgba(255,255,255,.92)}.st-hero-content p{margin-top:.55rem;max-width:20rem;font-size:.71rem;line-height:1.6;color:rgba(255,255,255,.94)!important}.st-hero-actions{display:flex;gap:.55rem;margin-top:.8rem}.st-hero-primary,.st-hero-secondary{padding:.58rem .78rem;border:1px solid rgba(255,255,255,.52);border-radius:.8rem;font-size:.66rem;font-weight:800}.st-hero-primary{background:#2a79dc;color:#fff}.st-hero-secondary{background:rgba(255,255,255,.12);color:#fff}
.st-schedule-row{display:grid;grid-template-columns:3.45rem minmax(0,1fr) auto;gap:.65rem;align-items:center;padding:.62rem .05rem;border-top:1px solid #e4edf6;min-width:0}.st-time{display:grid;place-items:center;min-height:2.25rem;border-radius:.75rem;background:#eff5fb;font-size:.65rem;font-weight:800}.st-schedule-row b{display:block;font-size:.69rem;color:var(--st-navy)}.st-schedule-row small{display:block;margin-top:.12rem;font-size:.59rem;color:#758ca5}.st-status{padding:.35rem .5rem;border-radius:.6rem;background:#edf9f4;color:var(--st-green);font-size:.58rem;font-weight:700}
.st-quick-card{padding-bottom:.85rem}.st-quick-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.55rem;padding:0 1rem}.st-quick{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.75rem .35rem;border:1px solid #dde9f4;border-radius:1rem;background:#fbfdff;text-align:center;transition:.18s ease;min-width:0}.st-quick:hover{transform:translateY(-1px);box-shadow:var(--st-shadow-soft)}.st-quick>span{width:2rem;height:2rem;display:grid;place-items:center;border-radius:.7rem;background:#eef5fc}.st-quick b{font-size:.64rem;color:var(--st-navy)}.st-quick small{font-size:.54rem;color:#758ca4;line-height:1.3}.st-lower-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.7fr);gap:.95rem;min-width:0}.st-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 1rem 1rem;gap:.45rem}.st-flow-item{position:relative;display:flex;align-items:center;gap:.5rem;padding:.6rem;border:1px solid #dce8f3;border-radius:.85rem;background:#fbfdff;min-width:0}.st-flow-item span{width:1.65rem;height:1.65rem;display:grid;place-items:center;border-radius:.55rem;background:#eff5fd;color:#3479bd;font-size:.6rem;font-weight:800;flex:0 0 auto}.st-flow-item b{font-size:.61rem;color:var(--st-navy);overflow-wrap:anywhere}.st-flow-item em{position:absolute;right:-.36rem;font-style:normal;color:#7aa6d2;font-size:.8rem}.st-donut{width:6.6rem;height:6.6rem;margin:.2rem auto .4rem;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#39c796 0 72%,#8edeb6 72% 86%,#ffd39a 86% 94%,#e7eef6 94% 100%);position:relative}.st-donut:after{content:"";position:absolute;inset:.68rem;border-radius:50%;background:#fff}.st-donut>div{position:relative;z-index:1;text-align:center}.st-donut strong,.st-donut small{display:block}.st-donut strong{font-size:.86rem;color:var(--st-navy)}.st-donut small{margin-top:.1rem;font-size:.56rem;color:#7590aa}.st-donut-note{padding:0 1rem;text-align:center;font-size:.63rem;color:#66809b}.st-attendance-card>.st-link{display:block;text-align:center;padding:0 0 .9rem;margin-top:.35rem}
.st-brand-foot{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.55rem;min-width:0}.st-feature{display:flex;gap:.55rem;align-items:flex-start;padding:.78rem;border:1px solid #dce8f3;border-radius:1rem;background:#fff;box-shadow:var(--st-shadow-soft);min-width:0}.st-feature>span{width:2rem;height:2rem;display:grid;place-items:center;border-radius:.68rem;background:#eef5fc;color:#3381cf;font-size:.85rem;flex:0 0 auto}.st-feature b{display:block;font-size:.64rem;color:var(--st-navy)}.st-feature p{margin-top:.13rem;font-size:.53rem;line-height:1.4;color:#7188a1}.st-empty{padding:1.5rem;text-align:center;font-size:.68rem;color:#7188a1}.st-empty a{color:#2875c9;font-weight:700}

/* Login / register: same visual language, with real MAN 1 Majalengka identity. */
body [class*="bg-slate-950"]{background:linear-gradient(180deg,#edf7ff 0%,#f7fbff 100%)!important}
body [class*="bg-slate-950"] > div{backdrop-filter:none!important}
body [class*="bg-slate-950"] .max-w-4xl{border:1px solid #d7e5f2!important;background:#fff!important;box-shadow:0 18px 48px rgba(52,88,124,.12)!important}
body [class*="bg-slate-950"] aside{background:linear-gradient(160deg,#2f83ea 0%,#2671d0 55%,#245fb0 100%)!important}
body [class*="bg-slate-950"] aside h2{color:#fff!important}
body [class*="bg-slate-950"] aside p{color:rgba(238,248,255,.88)!important}
.login-brand{display:flex;align-items:center;gap:.85rem}
.login-brand img{width:3.7rem;height:3.7rem;object-fit:contain}
.login-brand strong{display:block;font-size:1rem;letter-spacing:.02em;color:#fff}
.login-brand small{display:block;margin-top:.12rem;font-size:.65rem;color:rgba(238,248,255,.84)}
.login-school{margin-top:.9rem;font-size:.8rem;font-weight:700;letter-spacing:.08em;color:rgba(238,248,255,.92)}
.login-panel-title{color:var(--st-navy)!important}

/* Mobile nav and responsive behavior — no hidden overlay, no horizontal page growth. */
.fixed.inset-x-0.bottom-0.z-30{z-index:60!important;background:rgba(249,253,255,.96)!important;border-top-color:#d9e6f2!important;box-shadow:0 -6px 18px rgba(47,82,118,.08)!important;backdrop-filter:blur(12px)!important}
.fixed.inset-x-0.bottom-0.z-30 a{color:#55718f!important}.fixed.inset-x-0.bottom-0.z-30 a[class*="text-brand"]{color:#2f78d3!important}
.fixed.inset-0.z-40{z-index:70!important;background:rgba(28,48,72,.30)!important;backdrop-filter:blur(4px)!important}
.fixed.inset-0.z-40 > div{background:#fff!important;border-color:#d8e5f1!important;backdrop-filter:none!important}

@media(max-width:1180px){
  .st-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-main-grid,.st-lower-grid{grid-template-columns:1fr}
  .st-hero-card{min-height:16rem}
  .st-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .st-brand-foot{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1023px){
  aside.fixed.inset-y-0.left-0.hidden.w-64{display:none!important}
  .lg\:pl-64{padding-left:0!important}
  .glass-nav{position:sticky!important}
  main.mx-auto{max-width:100%!important;width:100%!important;padding-left:1rem!important;padding-right:1rem!important}
}
@media(max-width:880px){
  .st-dashboard-head{align-items:flex-start;flex-direction:column}
  .st-head-tools{width:100%}
  .st-year-chip{flex:1}
  .st-flow{grid-template-columns:1fr 1fr}
  .st-flow-item em{display:none}
}
@media(max-width:720px){
  main{overflow-x:hidden}
  main.mx-auto{padding-left:.85rem!important;padding-right:.85rem!important}
  .st-dashboard-head h1{font-size:1.48rem!important;line-height:1.2}
  .st-dashboard-head p{font-size:.75rem}
  .st-head-tools{overflow:visible;flex-wrap:wrap}
  .st-year-chip{min-width:0;flex:1 1 100%}
  .st-metrics{grid-template-columns:1fr 1fr;gap:.65rem}
  .st-metric{padding:.85rem}
  .st-card-head{padding:.85rem .9rem .6rem}
  .st-class-row{grid-template-columns:2rem minmax(0,1fr);gap:.5rem}
  .st-class-row>strong{grid-column:2;justify-self:start}
  .st-row-actions{grid-column:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-row-actions a{width:100%;height:2.15rem}
  .st-hero-content{min-height:15rem;padding:1.05rem}
  .st-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 .8rem}
  .st-flow{padding:0 .8rem .8rem;grid-template-columns:1fr}
  .st-brand-foot{grid-template-columns:1fr}
  .st-schedule-row{grid-template-columns:3.2rem minmax(0,1fr)}
  .st-status{grid-column:2;justify-self:start}
  .login-brand img{width:3rem;height:3rem}
}
@media(max-width:480px){
  .st-metrics{grid-template-columns:1fr}
  .st-quick-grid{grid-template-columns:1fr 1fr}
  .st-hero-actions{flex-direction:column;width:100%}
  .st-hero-primary,.st-hero-secondary{text-align:center}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation:none!important}}

/* Final responsive guardrails for real-world module pages. */
@media(max-width:720px){
  main .flex.items-start.justify-between,
  main .flex.items-center.justify-between,
  main .flex.justify-between{flex-wrap:wrap}
  main .flex.items-start.justify-between > *,
  main .flex.items-center.justify-between > *{min-width:0;max-width:100%}
  main form .flex.items-center,
  main .flex.gap-2,
  main .flex.gap-3{flex-wrap:wrap}
  main input,main select,main textarea{min-width:0!important;max-width:100%!important}
  main button{max-width:100%}
  main .overflow-x-auto{width:100%;max-width:100%}
}


/* ===== SMART TASK V11 — MADRASAH SOFT LEAF ===== */
:root{
  --st-bg:#edf7f2 !important;
  --st-bg-deep:#e5f2eb !important;
  --st-surface:#ffffff !important;
  --st-border:#cfe6da !important;
  --st-border-strong:#afd5c1 !important;
  --st-navy:#173d31 !important;
  --st-text:#234d40 !important;
  --st-muted:#648276 !important;
  --st-brand:#2f8d62 !important;
  --st-green:#16835b !important;
  --st-violet:#7b66d9 !important;
  --st-orange:#d98b19 !important;
  --st-shadow-soft:0 6px 18px rgba(34,91,68,.07) !important;
  --st-shadow:0 12px 28px rgba(34,91,68,.09) !important;
}
html,body,#root{max-width:100%!important;overflow-x:hidden!important}
body{background:#edf7f2!important;color:#234d40!important}
body::before{z-index:-2!important;background:
  radial-gradient(42rem 28rem at -5% 0%,rgba(74,170,117,.12),transparent 62%),
  radial-gradient(36rem 25rem at 105% 8%,rgba(125,194,164,.13),transparent 62%),
  radial-gradient(46rem 30rem at 50% 110%,rgba(181,223,202,.14),transparent 68%),
  linear-gradient(180deg,#edf7f2 0%,#f7fbf8 52%,#edf7f2 100%) !important;}

/* Sidebar — solid leaf-green anchor, no decorative layer over nav. */
aside.fixed{background:linear-gradient(180deg,#287b56 0%,#2f8d62 54%,#5aad83 100%)!important;border-right:1px solid rgba(255,255,255,.28)!important;box-shadow:10px 0 28px rgba(26,89,61,.10)!important;}
aside.fixed::before,aside.fixed::after,aside.fixed nav::before,aside.fixed nav::after{display:none!important;content:none!important}
aside.fixed .nav-item{color:rgba(255,255,255,.92)!important}
aside.fixed .nav-item:hover{background:rgba(255,255,255,.10)!important;color:#fff!important}
aside.fixed .nav-item[class*="bg-"]{background:rgba(255,255,255,.17)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.20)!important}
aside.fixed .m-3{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.16)!important}

/* Header/content — calm, readable, no blue wash. */
.glass-nav{background:rgba(249,253,251,.94)!important;border-bottom-color:#d4e9de!important}
main.mx-auto{max-width:82rem!important}
main .text-slate-900{color:#173d31!important}main .text-slate-800{color:#234d40!important}main .text-slate-700{color:#365c4e!important}main .text-slate-600{color:#547568!important}main .text-slate-500{color:#668378!important}main .text-slate-400{color:#829b91!important}

.glass-panel,.glass-panel-sm,.stat-card,.st-card,.st-metric,.st-feature{background:rgba(255,255,255,.94)!important;border-color:#d4e8de!important;box-shadow:0 6px 20px rgba(36,93,67,.06)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important}
.glass-panel:hover,.glass-panel-sm:hover,.stat-card:hover,.st-card:hover,.st-feature:hover{border-color:#bddbc9!important;box-shadow:0 10px 24px rgba(36,93,67,.08)!important}

.btn-primary{background:linear-gradient(180deg,#3fa36f,#2f8d62)!important;box-shadow:0 8px 16px rgba(47,141,98,.18)!important}.btn-primary:hover{background:linear-gradient(180deg,#348f61,#287a53)!important}
.btn-secondary{color:#2d7758!important;border-color:#b9dcca!important;background:#fff!important}.btn-secondary:hover{background:#f1faf5!important}
.btn-ghost{color:#56776a!important}.btn-ghost:hover{background:#edf8f2!important;color:#245b45!important}
.glass-input{border-color:#cfe3d9!important;background:#fff!important;color:#173d31!important}.glass-input::placeholder{color:#8ca399!important}.glass-input:focus{border-color:#65b48d!important;box-shadow:0 0 0 4px rgba(60,156,108,.12)!important}

/* Dashboard — larger, less cramped, more legible. */
.st-dashboard{gap:1.15rem!important}.st-dashboard-head{padding-top:.15rem!important}.st-eyebrow{color:#2d7e5a!important;font-size:.72rem!important}.st-dashboard-head h1{font-size:clamp(2.15rem,3vw,3.1rem)!important;color:#173d31!important;line-height:1.15!important}.st-dashboard-head p{font-size:.94rem!important;color:#5e7c6e!important}.st-metrics{gap:1rem!important}.st-metric{padding:1.2rem 1.25rem!important;border-radius:1.35rem!important}.st-metric-label{font-size:.76rem!important;color:#5c7b6c!important}.st-metric-label i{width:2.65rem!important;height:2.65rem!important;background:#edf8f2!important;color:#258456!important}.st-metric strong{font-size:2.2rem!important;color:#173d31!important}.st-metric small{font-size:.76rem!important;color:#698479!important}.st-main-grid{gap:1rem!important}.st-card-head{padding:1.2rem 1.25rem .85rem!important}.st-card-kicker{font-size:.67rem!important;color:#2f8d62!important}.st-card h2{font-size:1.18rem!important;color:#173d31!important}.st-card-head p{font-size:.76rem!important;color:#668175!important}.st-link{font-size:.76rem!important;color:#2f8d62!important}.st-class-list,.st-activity-list,.st-schedule-list{padding:0 1.2rem 1.15rem!important}.st-class-row{padding:.9rem .15rem!important;gap:.85rem!important}.st-class-icon{width:2.45rem!important;height:2.45rem!important;background:#edf8f2!important;color:#2f8d62!important}.st-class-info b{font-size:.86rem!important;color:#173d31!important}.st-class-info span{font-size:.72rem!important;color:#6d867a!important}.st-progress{height:.34rem!important;background:#e6f0eb!important}.st-progress span{background:linear-gradient(90deg,#2f8d62,#63b987)!important}.st-class-row>strong{font-size:.82rem!important;color:#16835b!important}.st-row-actions a{width:2.1rem!important;height:2.1rem!important;border-color:#cfe3d9!important;color:#2e8a5e!important}.st-activity-row{padding:.82rem .1rem!important}.st-activity-row b{font-size:.79rem!important;color:#173d31!important}.st-activity-row small{font-size:.67rem!important;color:#6e877b!important}.st-activity-icon{width:2.2rem!important;height:2.2rem!important;background:#eef8f3!important}.st-hero-card{background:linear-gradient(145deg,#2e8c61 0%,#55a877 72%,#8fcaa9 100%)!important}.st-hero-content{min-height:20rem!important}.st-hero-content strong{font-size:1.9rem!important}.st-hero-content small,.st-hero-content p{font-size:.78rem!important}.st-hero-primary{background:#247a51!important}.st-hero-secondary{background:rgba(255,255,255,.18)!important}.st-schedule-row{padding:.74rem .05rem!important}.st-schedule-row b{font-size:.77rem!important;color:#173d31!important}.st-schedule-row small{font-size:.66rem!important;color:#6f867b!important}.st-status{background:#edf8f2!important;color:#1b815b!important;font-size:.64rem!important}.st-quick-grid{gap:.7rem!important;padding:0 1.15rem!important}.st-quick{padding:.95rem .5rem!important;border-color:#d6e8df!important;background:#fbfefc!important}.st-quick>span{width:2.3rem!important;height:2.3rem!important;background:#edf8f2!important}.st-quick b{font-size:.72rem!important;color:#173d31!important}.st-quick small{font-size:.6rem!important;color:#6f877b!important}.st-flow{gap:.55rem!important;padding:0 1.15rem 1.15rem!important}.st-flow-item{padding:.75rem!important;border-color:#d7e8df!important;background:#fbfefc!important}.st-flow-item span{background:#edf8f2!important;color:#2f8d62!important}.st-flow-item b{font-size:.69rem!important;color:#173d31!important}.st-brand-foot{gap:.7rem!important}.st-feature{padding:.95rem!important}.st-feature>span{background:#edf8f2!important;color:#2f8d62!important}.st-feature b{font-size:.72rem!important;color:#173d31!important}.st-feature p{font-size:.6rem!important;color:#6c857a!important}

/* Functional dashboard controls */
.st-notification-wrap{position:relative}.st-notification-popover{position:absolute;right:0;top:calc(100% + .6rem);width:18rem;padding:.75rem;border:1px solid #d4e8de;border-radius:1rem;background:#fff;box-shadow:0 16px 35px rgba(31,83,61,.15);z-index:80}.st-popover-head{display:flex;align-items:center;justify-content:space-between;padding:.25rem .25rem .55rem;border-bottom:1px solid #e3efe8}.st-popover-head b{font-size:.8rem;color:#173d31}.st-popover-head button{font-size:.65rem;color:#6b857a}.st-popover-item{display:flex;gap:.55rem;align-items:center;padding:.62rem .25rem;font-size:.7rem;color:#49675b}.st-popover-dot{width:.45rem;height:.45rem;border-radius:50%;flex:0 0 auto}.st-dot-green{background:#2f8d62}.st-dot-blue{background:#4b8ed8}.st-popover-link{display:block;margin-top:.35rem;padding-top:.55rem;border-top:1px solid #e3efe8;font-size:.68rem;font-weight:700;color:#2f8d62}

/* Login — real school identity, green madrasah atmosphere. */
body [class*="bg-slate-950"] aside{background:linear-gradient(160deg,#2c8259 0%,#2f8d62 55%,#4fa173 100%)!important}.login-school{color:#edf8f2!important}.login-panel-title{color:#173d31!important}.login-brand strong{color:#fff!important}.login-brand small{color:#e7f5ee!important}
body [class*="bg-slate-950"] .max-w-4xl{border-color:#cfe5da!important}
body [class*="bg-slate-950"] .grid-cols-2{background:#edf7f2!important}

/* Student area gets the same madrasah identity. */
.siswa-nav{background:linear-gradient(90deg,#2b8159,#358e63)!important;border-bottom-color:#236d4b!important}.siswa-hero{background:linear-gradient(135deg,#2f8d62,#4ea778)!important}.siswa-nav img{filter:drop-shadow(0 3px 8px rgba(0,0,0,.12))}

/* Responsive — no forced three-column grids on small screens. */
@media(max-width:1180px){.st-dashboard-head h1{font-size:2.3rem!important}.st-main-grid,.st-lower-grid{grid-template-columns:1fr!important}.st-hero-card{min-height:18rem!important}.st-brand-foot{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:820px){.st-dashboard-head{flex-direction:column!important;align-items:flex-start!important}.st-head-tools{width:100%!important;flex-wrap:wrap!important}.st-year-chip{flex:1 1 100%!important}.st-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}.st-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.st-flow{grid-template-columns:1fr 1fr!important}.st-flow-item em{display:none!important}}
@media(max-width:640px){.st-dashboard{gap:.85rem!important}.st-dashboard-head h1{font-size:1.82rem!important}.st-dashboard-head p{font-size:.82rem!important}.st-metrics{grid-template-columns:1fr 1fr!important;gap:.65rem!important}.st-metric{padding:.95rem!important}.st-metric strong{font-size:1.75rem!important}.st-main-grid,.st-lower-grid{grid-template-columns:1fr!important}.st-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.st-brand-foot{grid-template-columns:1fr!important}.st-notification-popover{position:fixed;top:4.5rem;right:.8rem;left:.8rem;width:auto}.st-card-head{padding:1rem!important}.st-class-list,.st-activity-list,.st-schedule-list{padding:0 .95rem .95rem!important}.st-class-row{grid-template-columns:2.2rem minmax(0,1fr) auto!important}.st-row-actions{display:none!important}.siswa-nav .max-w-5xl,.siswa-nav .max-w-3xl{max-width:none!important}.siswa-hero{border-radius:1.35rem!important}}

/* Optional dark mode is intentionally muted, not neon. */
html.st-dark body{background:#10231c!important;color:#e8f5ef!important}html.st-dark body::before{background:linear-gradient(180deg,#10231c 0%,#153026 50%,#10231c 100%)!important}html.st-dark .glass-nav{background:rgba(18,42,32,.94)!important;border-bottom-color:#254c3c!important}html.st-dark .st-card,html.st-dark .st-metric,html.st-dark .st-feature,html.st-dark .glass-panel,html.st-dark .glass-panel-sm,html.st-dark .stat-card{background:#173127!important;border-color:#2d5444!important}html.st-dark main .text-slate-900,html.st-dark main .text-slate-800{color:#e8f5ef!important}html.st-dark main .text-slate-700,html.st-dark main .text-slate-600,html.st-dark main .text-slate-500{color:#b6cec3!important}html.st-dark .st-dashboard-head h1,html.st-dark .st-card h2,html.st-dark .st-metric strong,html.st-dark .st-class-info b,html.st-dark .st-activity-row b,html.st-dark .st-quick b,html.st-dark .st-feature b{color:#eef8f3!important}

/* ================================================================
   SMART TASK V16 — PROFIL, TABEL DATA, SWEETALERT & READABILITY
   ================================================================ */
.st-data-table{width:100%!important;border-collapse:separate!important;border-spacing:0!important;border:1px solid #cbddeb!important;border-radius:1rem!important;overflow:hidden!important;background:rgba(255,255,255,.97)!important;color:#173b63!important;box-shadow:0 10px 26px rgba(22,77,113,.06)!important}.st-data-table thead th{background:linear-gradient(180deg,#e8f3ff 0%,#dcecff 100%)!important;color:#174579!important;border-bottom:1px solid #b9cfe2!important;font-weight:900!important;white-space:nowrap!important}.st-data-table thead th+th{border-left:1px solid #c8d8e7!important}.st-data-table tbody tr{background:#fff!important;transition:background .15s ease!important}.st-data-table tbody tr:nth-child(even){background:#f8fbfe!important}.st-data-table tbody tr:hover{background:#eef6ff!important}.st-data-table tbody td{border-bottom:1px solid #e0eaf3!important;border-right:1px solid #edf2f6!important;color:#294f73!important;vertical-align:middle!important}.st-data-table tbody td:last-child{border-right:0!important}.st-data-table tbody tr:last-child td{border-bottom:0!important}.st-data-table .sticky{background:inherit!important}.st-table-pagination{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:.75rem!important;flex-wrap:wrap!important;padding:.75rem .1rem 0!important;font-size:.72rem!important;color:#607e99!important}.st-table-pagination-actions{display:flex!important;align-items:center!important;gap:.3rem!important}.st-table-pagination-actions button{min-width:2rem!important;height:2rem!important;padding:0 .55rem!important;border:1px solid #cbddeb!important;border-radius:.7rem!important;background:#fff!important;color:#315b80!important;font-weight:800!important}.st-table-pagination-actions button:hover:not(:disabled){background:#eaf4ff!important;border-color:#86b9e4!important}.st-table-pagination-actions button.is-active{background:linear-gradient(135deg,#0b66c3,#1788df)!important;border-color:#0b66c3!important;color:#fff!important}.st-table-pagination-actions button:disabled{opacity:.4!important;cursor:not-allowed!important}

.st-profile-grid{display:grid!important;grid-template-columns:minmax(260px,.42fr) minmax(0,1fr)!important;gap:1rem!important;align-items:start!important}.st-profile-card{padding:1.4rem!important;border-radius:1.5rem!important;border:1px solid rgba(172,205,227,.72)!important;background:rgba(255,255,255,.95)!important;box-shadow:0 16px 40px rgba(24,73,109,.08)!important}.st-profile-identity{text-align:center!important;background:linear-gradient(155deg,rgba(233,246,255,.96),rgba(247,252,255,.96))!important}.st-profile-avatar-lg{width:7rem!important;height:7rem!important;margin:0 auto 1rem!important;border-radius:1.8rem!important;display:grid!important;place-items:center!important;overflow:hidden!important;background:linear-gradient(135deg,#0d63b8,#087f5b)!important;color:#fff!important;font-size:2.25rem!important;font-weight:950!important;box-shadow:0 18px 30px rgba(13,99,184,.22)!important;border:4px solid rgba(255,255,255,.84)!important}.st-profile-avatar-lg img{width:100%!important;height:100%!important;object-fit:cover!important}.st-profile-identity h2{margin:0!important;color:#123a67!important;font-size:1.28rem!important;font-weight:950!important}.st-profile-identity p{margin:.25rem 0 0!important;color:#66829c!important;font-size:.78rem!important}.st-profile-role{display:inline-block!important;margin-top:.55rem!important;padding:.35rem .65rem!important;border-radius:999px!important;background:#e8f6f0!important;color:#0b7659!important;font-size:.68rem!important;font-weight:850!important}.st-profile-photo-actions{display:flex!important;justify-content:center!important;gap:.55rem!important;flex-wrap:wrap!important;margin-top:1rem!important}.st-profile-photo-actions label{cursor:pointer!important}.st-profile-identity>small{display:block!important;margin-top:.7rem!important;color:#7f97aa!important;font-size:.64rem!important}.st-profile-section-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:1rem!important;margin-bottom:1.1rem!important}.st-profile-kicker{display:block!important;color:#087f5b!important;font-size:.64rem!important;font-weight:950!important;letter-spacing:.15em!important}.st-profile-section-head h2{margin:.25rem 0 0!important;color:#173e67!important;font-size:1.35rem!important;font-weight:950!important}.st-profile-section-head p{margin-top:.25rem!important;color:#6d88a2!important;font-size:.75rem!important}.st-profile-card label{display:block!important;color:#244c70!important;font-size:.76rem!important;font-weight:850!important}.st-profile-card .glass-input{margin-top:.4rem!important}.st-student-profile-link{color:#fff!important;font-size:.78rem!important;font-weight:850!important;text-decoration:none!important;padding:.45rem .7rem!important;border-radius:.7rem!important;background:rgba(255,255,255,.12)!important;border:1px solid rgba(255,255,255,.16)!important}.st-profile-page{max-width:1100px!important;margin:0 auto!important}.siswa-profile-grid{grid-template-columns:minmax(240px,.38fr) minmax(0,1fr)!important}

.st-sidebar .st-profile-avatar{overflow:hidden!important;padding:0!important}.st-sidebar .st-profile-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:inherit!important}.st-mobile-sheet .st-nav-icon{overflow:hidden!important}

.swal2-popup{border-radius:1.35rem!important;border:1px solid rgba(135,188,220,.35)!important;box-shadow:0 24px 60px rgba(10,63,110,.18)!important;font-family:inherit!important}.swal2-title{color:#143e67!important;font-weight:950!important}.swal2-html-container{color:#5b7692!important;font-size:.9rem!important}.swal2-confirm{border-radius:.85rem!important;font-weight:850!important}.swal2-cancel{border-radius:.85rem!important;font-weight:800!important}.swal2-actions{gap:.55rem!important}

@media(max-width:920px){.st-profile-grid,.siswa-profile-grid{grid-template-columns:1fr!important}.st-profile-identity{max-width:none!important}.st-table-pagination{align-items:flex-start!important;flex-direction:column!important}.st-data-table{font-size:.78rem!important}}
@media(max-width:640px){.st-profile-card{padding:1rem!important}.st-profile-avatar-lg{width:5.8rem!important;height:5.8rem!important;border-radius:1.45rem!important;font-size:1.8rem!important}.st-profile-section-head h2{font-size:1.12rem!important}.st-data-table{border-radius:.8rem!important}.st-table-pagination-actions{width:100%!important;justify-content:flex-end!important}.st-table-pagination-actions button{min-width:1.9rem!important}}

/* ================================================================
   SMART TASK V18 — PELENGKAP BERANDA SISWA
   Paket v18 menulis ulang lagi blok "FINAL POLISH" di index.css (kali
   ini jadi "V18 — STABILITY / VISUAL CLEANUP"), dengan penyesuaian baru
   yang bagus (topbar guru, kartu identitas login desktop, kotak status
   kehadiran jadi grid 2 kolom di HP). Blok itu dipertahankan apa
   adanya. TAPI seperti v17, paket ini tetap tidak pernah mengisi
   sebagian aturan tata letak dasar Beranda Siswa yang dari awal cuma
   ada di berkas ini (redesign-glass.css) — jadi bagian yang sama
   kembali rusak kalau tidak dilengkapi lagi di sini:
   1) Bar atas (.st-student-topbar-inner) tanpa display:flex.
   2) Cincin persentase kehadiran (.st-student-ring-*) tanpa fill/stroke.
   3) Kotak tugas (.st-student-task-row) & ikonnya tanpa padding/bingkai.
   4) Banner MAN 1 MAJALENGKA bawah tanpa display:block pada isinya.
   Blok di bawah HANYA mengembalikan bagian yang hilang itu. Sengaja
   TIDAK menyentuh `display`/grid-template-columns punya
   .st-student-task-row (diatur index.css v18) maupun kotak status
   kehadiran di lebar HP (v18 sengaja membuatnya grid 2 kolom lewat
   @media max-width:760px — makanya kotak status di bawah juga diberi
   override senada pada lebar yang sama, supaya tidak tertimpa balik
   oleh aturan flex tak-berkondisi di atasnya). */
.st-student-topbar-inner{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:.6rem!important;min-height:4rem!important;flex-wrap:nowrap!important}
.st-student-brand{display:flex!important;align-items:center!important;gap:.65rem!important;text-decoration:none!important;min-width:0!important}
.st-student-brand img{width:2.5rem!important;height:2.5rem!important;object-fit:contain!important;flex:none!important}
.st-student-brand span{display:block!important;min-width:0!important}
.st-student-brand strong,.st-student-brand small{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.st-student-top-actions{display:flex!important;align-items:center!important;gap:.5rem!important;flex:none!important}
.st-student-profile-link{white-space:nowrap!important}
@media(max-width:480px){
  .st-student-topbar-inner{padding:0 .75rem!important}
  .st-student-brand img{width:2.1rem!important;height:2.1rem!important}
  .st-student-brand strong{font-size:.86rem!important}
  .st-student-brand small{font-size:.62rem!important}
  .st-student-status-dot{display:none!important}
  .st-student-profile-link{padding:.4rem .55rem!important;font-size:.68rem!important}
  .st-student-top-actions button{padding:.4rem .6rem!important;font-size:.72rem!important}
}
.st-student-ring-wrap{position:relative!important;width:7rem!important;height:7rem!important;flex:none!important}
.st-student-ring-svg{width:100%!important;height:100%!important;transform:rotate(-90deg)!important}
.st-student-ring-track{fill:none!important;stroke:#e4eef2!important;stroke-width:9!important}
.st-student-ring-value{fill:none!important;stroke:#0e946d!important;stroke-width:9!important;stroke-linecap:round!important;transition:stroke-dashoffset .6s ease!important}
.st-student-ring-center{position:absolute!important;inset:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
.st-student-ring-center strong{color:#12355f!important;font-size:1.35rem!important;line-height:1!important}
.st-student-ring-center span{margin-top:.2rem!important;color:#6b879f!important;font-size:.62rem!important;font-weight:800!important}
.st-student-attendance-body{display:flex!important;align-items:center!important;gap:1.3rem!important;flex-wrap:wrap!important}
.st-student-attendance-copy strong{display:block!important}
.st-student-attendance-copy span{display:block!important;margin-top:.2rem!important}
.st-student-status-grid{display:flex!important;flex-wrap:wrap!important;gap:.45rem!important;margin-top:.8rem!important}
.st-student-status-grid span{display:inline-flex!important;align-items:center!important;gap:.3rem!important;padding:.35rem .6rem!important;border-radius:999px!important;background:#eef4f8!important;font-size:.68rem!important}
.st-student-status-grid span b{color:#12355f!important;font-weight:900!important}
/* Ikuti tata letak grid 2 kolom buatan v18 di lebar HP — jangan sampai
   aturan flex tak-berkondisi di atas menimpanya balik jadi 1 baris. */
@media(max-width:760px){
  .st-student-status-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.4rem!important}
}
.st-student-task-list{display:flex!important;flex-direction:column!important;gap:.6rem!important;margin-top:.9rem!important}
/* Bukan display/grid-template-columns — cuma pelengkap kotak visual di atas tata letak grid v18. */
.st-student-task-row{padding:.8rem .9rem!important;border-width:1px!important;border-style:solid!important;border-radius:1rem!important;text-decoration:none!important;transition:.15s ease!important}
.st-student-task-icon{width:2.1rem!important;height:2.1rem!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:.7rem!important;background:#eaf2f7!important;color:#1474dd!important}
.st-student-pill{white-space:nowrap!important}
.st-student-alert{margin-top:1rem!important;padding:.75rem .9rem!important;border-radius:.9rem!important;background:#fff4e6!important;border:1px solid #f2ddad!important;color:#8a5a10!important;font-size:.8rem!important}
.st-student-footer-banner span,.st-student-footer-banner strong,.st-student-footer-banner p{display:block!important}
.st-student-footer-banner strong{margin-top:.15rem!important}
.st-student-footer-banner p{margin-top:.3rem!important;opacity:.88!important;font-size:.8rem!important}

/* v18 juga mengubah .st-login-v15-card .st-login-mobile-brand di index.css dari
   display:none jadi display:flex khusus di lebar HP (max-width:760px) — identitas
   "SMART TASK / MAN 1 Majalengka" jadi tampil DUA KALI lagi persis seperti yang
   dilaporkan guru lewat tangkapan layar sebelumnya: sekali di panel kiri/atas
   (.st-login-v15-brand-panel, yang tidak pernah disembunyikan di ukuran layar
   manapun), sekali lagi di dalam kartu formulir. Di desktop pola dua identitas ini
   memang sudah ada sejak awal dan wajar (panel kiri itu panel sambutan terpisah,
   bukan pengulangan) — jadi HANYA disembunyikan lagi di lebar HP, sesuai laporan. */
@media(max-width:760px){
  .st-login-v15-card .st-login-mobile-brand{display:none!important}
}

/* Dilaporkan guru: tulisan di Beranda Siswa "terpotong di bagian kiri" — paling
   kentara di label kecil TUGAS/KEHADIRAN/NILAI (kadang tampak seperti "rUGAS").
   Sebabnya BUKAN regresi paket, tapi cacat lama yang baru kelihatan sekarang:
   .st-student-panel (kartu Tugas Saya/Presensi/Nilai) TIDAK PERNAH diberi padding
   di berkas manapun (index.css maupun sini) — isinya duduk pas rapat di tepi
   kotak. Selama .st-student-panel belum diberi overflow:hidden, sedikit "bocoran"
   render huruf besar berjarak-antar-huruf lebar (letter-spacing) di label kecil
   itu masih terlihat penuh karena tidak ada yang memotongnya. Begitu v18
   menambahkan overflow:hidden pada .st-student-panel (supaya isi kartu lain tidak
   keluar dari sudut membulat), potongan huruf itu ikut terpotong tegas sampai
   terlihat seperti huruf hilang. Perbaikannya menambah padding kartu supaya semua
   isi (termasuk label kecil di pojok kiri atas) punya jarak aman dari tepi. */
.st-student-panel{padding:1.4rem 1.5rem!important}
@media(max-width:760px){
  .st-student-panel{padding:1.1rem 1.15rem!important}
}

/* ================================================================
   PENYESUAIAN KETERBACAAN — dilaporkan guru: "kurang soft di mata,
   tulisannya tidak kontras sehingga bikin sakit mata, kurang responsif".

   Ini BUKAN desain ulang. Warna, tata letak, dan susunan halaman buatan
   guru dibiarkan apa adanya. Yang disesuaikan hanya tiga hal yang
   memang kurang, dan semuanya ditulis di akhir berkas supaya tidak ada
   satu baris pun di atas yang tersentuh.

   Angka-angka di bawah bukan kira-kira. Tiap warna dihitung rasio
   kontrasnya terhadap kartu putih memakai rumus WCAG; yang di bawah
   4,5:1 dinaikkan ke sekitar 4,6:1 dengan CORAK YANG SAMA — hanya
   digelapkan seperlunya, tidak diganti warna lain.
   ================================================================ */

/* --- 1. KONTRAS: teks abu-abu kebiruan (Beranda v14) ------------------
   Sebelumnya 3,3:1 — di bawah ambang keterbacaan 4,5:1. Inilah tulisan
   pucat yang membuat mata cepat lelah. */
.st-v14-metric small,
.st-v14-class-main small,
.st-v14-activity-row small,
.st-v14-schedule-row small,
.st-v14-quick-card small,
.st-v14-quick-card b,
.st-v14-features p,
.st-v14-empty,
.st-v14-panel-head p{color:#5f7790!important}

/* Aksen hijau & emas: dipakai untuk label kecil dan angka persen, jadi
   harus ikut terbaca. Corak tetap hijau/emas yang sama. */
.st-v14-panel-head span,
.st-v14-class-main b,
.st-v14-schedule-row b,
.st-v14-metric.tone-green .st-v14-metric-icon,
.st-v14-quick-card.accent-green>span{color:#0d8562!important}
.st-v14-metric.tone-gold .st-v14-metric-icon,
.st-v14-quick-card.accent-gold>span{color:#a76507!important}

/* --- 1b. KONTRAS: halaman-halaman lain (Absensi, Nilai, Jurnal, dst.) --- */
main .text-slate-400,.glass-input::placeholder{color:#627a70!important}
main .text-slate-500{color:#5f7a70!important}
.st-quick small,.st-activity-row small,.st-schedule-row small,
.st-class-info span,.st-feature p,.st-metric small,
.st-card-head p,.st-popover-head button{color:#637a6f!important}
.st-empty,.st-chevron,.st-donut small,.st-donut-note,.st-year-chip b,
.st-profile-identity>small,.st-profile-identity p,.st-profile-section-head p,
.st-student-ring-center span,.st-table-pagination,
.glass-nav .text-slate-400{color:#5f7790!important}
.st-card-kicker,.st-link,.st-flow-item span,.st-feature>span,
.st-class-icon,.st-popover-link,.st-row-actions a{color:#2c845c!important}
.st-flow-item em{color:#3d78b3!important}

/* --- 2. UKURAN HURUF: naikkan yang di bawah batas nyaman baca ---------
   Sebagian keterangan tadinya 9–10 px. Di layar HP itu terlalu kecil,
   apalagi warnanya pucat — dua-duanya sekaligus yang bikin perih.
   Batas bawah dinaikkan ke ±11,8 px, dan di HP ke ±12,8 px.
   Ukuran judul, angka besar, dan tata letak tidak diubah. */
.st-v14-metric small,
.st-v14-class-main small,
.st-v14-activity-row small,
.st-v14-schedule-row small,
.st-v14-schedule-row b,
.st-v14-quick-card small,
.st-v14-features p,
.st-v14-story-copy>span,
.st-v14-school-badge small,
.st-v14-year-card small{font-size:.74rem!important;line-height:1.45!important}
.st-v14-panel-head span,
.st-v14-panel-head a,
.st-v14-metric span,
.st-v14-kicker,
.st-v14-schedule-no,
.st-v14-story-tags span{font-size:.75rem!important}

/* --- 3. RESPONSIF DI HP ----------------------------------------------
   Satu hal yang memang kurang pas di layar HP:

   Sapaan atas (hero) dipatok tinggi minimal 26 rem = sekitar 416 px.
   Di HP itu hampir satu layar penuh sebelum ada isi apa pun, jadi guru
   harus menggulir dulu setiap kali membuka Beranda. Patokan itu
   dilepas supaya tingginya mengikuti isinya sendiri.

   Jumlah kolom TIDAK diubah — satu kolom di HP dan dua kolom di tablet
   memang pilihan tata letak Bapak, bukan cacat. */
@media (max-width:640px){
  .st-v14-hero-inner{min-height:0!important;padding:1.35rem 1.15rem 1.5rem!important}
  .st-v14-hero h1{font-size:clamp(1.85rem,7vw,2.5rem)!important}
}
@media (max-width:760px){
  /* Di HP semua keterangan kecil dinaikkan sedikit lagi. */
  .st-v14-metric small,.st-v14-class-main small,.st-v14-activity-row small,
  .st-v14-schedule-row small,.st-v14-quick-card small,.st-v14-features p,
  .st-v14-panel-head p{font-size:.8rem!important}
  .st-quick small,.st-activity-row small,.st-schedule-row small,
  .st-class-info span,.st-feature p,.st-metric small,.st-card-head p,
  .st-empty,.st-donut small,.st-donut-note{font-size:.78rem!important}
}

/* --- 4. SILAU: bayangan besar dilembutkan -----------------------------
   Bayangan tebal di bawah sapaan atas membuat batasnya terasa keras.
   Warnanya tidak diubah, hanya kepekatannya diturunkan. */
.st-v14-hero{box-shadow:0 18px 44px rgba(10,74,139,.14)!important}
.st-v14-panel{box-shadow:0 12px 30px rgba(37,89,133,.06)!important}
.st-v14-metric{box-shadow:0 12px 28px rgba(35,91,136,.07)!important}