/* =========================================================
   V33 CRITICAL LOCK - Dashboard tidak boleh sempit/vertikal
   Mengunci layout internal setelah semua CSS lama agar tidak hancur.
   ========================================================= */
html,body{min-width:0!important;overflow-x:hidden!important}
body.app-body{margin:0!important;background:linear-gradient(135deg,#eaf5ff 0%,#f7fbff 50%,#eefdf8 100%)!important;color:#08213f!important}
body.app-body *{box-sizing:border-box!important;writing-mode:horizontal-tb!important;text-orientation:mixed!important;word-break:normal!important;overflow-wrap:normal!important}
body.app-body p,body.app-body small,body.app-body span,body.app-body b,body.app-body strong,body.app-body h1,body.app-body h2,body.app-body h3,body.app-body h4,body.app-body a{white-space:normal!important;line-height:1.25!important}
body.app-body .app-shell:not(.public-shell){display:flex!important;align-items:stretch!important;justify-content:flex-start!important;width:100vw!important;max-width:100vw!important;min-height:100vh!important;margin:0!important;padding:0!important;overflow:hidden!important;background:transparent!important}
body.app-body aside.sidebar{position:sticky!important;left:0!important;top:0!important;flex:0 0 304px!important;width:304px!important;min-width:304px!important;max-width:304px!important;height:100vh!important;min-height:100vh!important;overflow-y:auto!important;overflow-x:hidden!important;margin:0!important;z-index:70!important}
body.app-body main.main:not(.public-main){display:block!important;flex:1 1 auto!important;width:calc(100vw - 304px)!important;min-width:0!important;max-width:calc(100vw - 304px)!important;min-height:100vh!important;margin:0!important;padding:26px 28px 30px!important;overflow-y:auto!important;overflow-x:hidden!important;background:linear-gradient(180deg,#f7fbff 0%,#eef7ff 100%)!important}
body.app-body main.main:not(.public-main)>*:not(style):not(script){width:100%!important;max-width:1380px!important;margin-left:auto!important;margin-right:auto!important;min-width:0!important}
body.app-body .topbar.commercial-topbar{width:100%!important;max-width:1380px!important;min-height:88px!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;margin:0 auto 24px!important;padding:18px 22px!important;border-radius:26px!important;background:rgba(255,255,255,.96)!important;border:1px solid #d8e8f7!important;box-shadow:0 16px 40px rgba(8,33,63,.08)!important;overflow:visible!important}
body.app-body .topbar-brand{display:flex!important;flex-direction:row!important;align-items:center!important;gap:14px!important;min-width:0!important;flex:1 1 auto!important;width:auto!important;max-width:none!important}
body.app-body .topbar-brand img{display:block!important;flex:0 0 52px!important;width:52px!important;height:52px!important;border-radius:16px!important;object-fit:cover!important}
body.app-body .topbar-brand div{display:block!important;min-width:0!important;width:auto!important;max-width:100%!important}
body.app-body .topbar-brand h1{display:block!important;margin:0!important;font-size:clamp(22px,2vw,30px)!important;line-height:1.08!important;font-weight:1000!important;letter-spacing:-.035em!important;color:#08213f!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;max-width:100%!important}
body.app-body .topbar-brand p{display:block!important;margin:4px 0 0!important;font-size:13px!important;line-height:1.35!important;font-weight:800!important;color:#5f738d!important;white-space:normal!important;overflow-wrap:anywhere!important;max-width:100%!important}
body.app-body .user-pill{display:grid!important;place-items:center!important;text-align:center!important;flex:0 0 auto!important;min-width:190px!important;max-width:280px!important;padding:12px 16px!important;border-radius:18px!important;background:#f7fbff!important;border:1px solid #cfe3f8!important;color:#08213f!important}
body.app-body .user-pill b,body.app-body .user-pill span{display:block!important;white-space:normal!important;line-height:1.2!important;overflow-wrap:anywhere!important}

/* Dashboard superadmin/guru/siswa - card aman */
body.app-body .superadmin-control-hero,
body.app-body .teacher-lab-hero,
body.app-body .buyer-hero,
body.app-body .ota-flight-hero,
body.app-body .buyer-order-hero,
body.app-body .checkin-hero,
body.app-body .mailapp-topbar{width:100%!important;max-width:1380px!important;min-width:0!important;margin-left:auto!important;margin-right:auto!important;overflow:hidden!important}
body.app-body .superadmin-control-hero{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(220px,260px)!important;gap:24px!important;align-items:center!important;padding:30px!important;border-radius:30px!important;background:linear-gradient(135deg,#0b74f0 0%,#0b63ce 55%,#06b6d4 100%)!important;color:#fff!important;box-shadow:0 24px 64px rgba(11,99,206,.18)!important;border:1px solid rgba(255,255,255,.25)!important}
body.app-body .superadmin-control-hero h2{display:block!important;margin:10px 0 10px!important;color:#fff!important;font-size:clamp(30px,3vw,46px)!important;line-height:1.05!important;font-weight:1000!important;letter-spacing:-.04em!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;max-width:100%!important}
body.app-body .superadmin-control-hero p{display:block!important;margin:0!important;max-width:900px!important;color:rgba(255,255,255,.92)!important;font-weight:760!important;line-height:1.6!important;white-space:normal!important;overflow-wrap:normal!important}
body.app-body .superadmin-control-hero .eyebrow{display:inline-flex!important;width:auto!important;max-width:100%!important;white-space:normal!important;color:#fff!important;background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.26)!important}
body.app-body .control-user-card{display:grid!important;align-content:center!important;gap:6px!important;text-align:center!important;min-height:118px!important;border-radius:22px!important;padding:18px!important;background:rgba(255,255,255,.15)!important;border:1px solid rgba(255,255,255,.28)!important;color:#fff!important;backdrop-filter:blur(10px)!important}
body.app-body .control-user-card small,body.app-body .control-user-card strong,body.app-body .control-user-card span{display:block!important;color:#fff!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.25!important}
body.app-body .pro-hero-pills{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:16px!important}
body.app-body .pro-hero-pills span{display:inline-flex!important;align-items:center!important;width:auto!important;max-width:100%!important;min-height:34px!important;padding:8px 12px!important;border-radius:999px!important;background:rgba(255,255,255,.16)!important;color:#fff!important;font-weight:900!important;white-space:normal!important;line-height:1.2!important}
body.app-body .control-stat-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important;margin:0 auto 22px!important;width:100%!important;max-width:1380px!important}
body.app-body .control-stat-grid article{display:grid!important;gap:8px!important;min-width:0!important;min-height:124px!important;align-content:start!important;padding:18px!important;border-radius:22px!important;background:#fff!important;border:1px solid #d8e8f7!important;box-shadow:0 12px 32px rgba(8,33,63,.07)!important;overflow:hidden!important}
body.app-body .control-stat-grid article small,body.app-body .control-stat-grid article strong,body.app-body .control-stat-grid article span{display:block!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;line-height:1.2!important}
body.app-body .control-stat-grid article small{font-size:11.5px!important;text-transform:uppercase!important;color:#667d98!important;font-weight:1000!important;letter-spacing:.035em!important}
body.app-body .control-stat-grid article strong{font-size:32px!important;color:#08213f!important;font-weight:1000!important;line-height:1!important}
body.app-body .control-stat-grid article span{display:inline-flex!important;width:max-content!important;max-width:100%!important;font-size:11.5px!important;background:#ecfdf5!important;color:#047857!important;border-radius:999px!important;padding:6px 10px!important;font-weight:950!important}
body.app-body .control-grid{display:grid!important;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr)!important;gap:18px!important;width:100%!important;max-width:1380px!important;margin:0 auto 22px!important}
body.app-body .control-panel{min-width:0!important;padding:24px!important;border-radius:26px!important;background:#fff!important;border:1px solid #d8e8f7!important;box-shadow:0 14px 36px rgba(8,33,63,.075)!important;overflow:hidden!important}
body.app-body .control-panel h3{display:block!important;font-size:24px!important;line-height:1.15!important;margin:0 0 12px!important;color:#08213f!important;white-space:normal!important}
body.app-body .control-panel p{display:block!important;margin:0!important;color:#415a77!important;line-height:1.55!important;font-weight:740!important;white-space:normal!important;overflow-wrap:normal!important}
body.app-body .practice-roadmap{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin-top:18px!important}
body.app-body .practice-roadmap div{min-width:0!important;background:#f8fbff!important;border:1px solid #e4effb!important;border-radius:18px!important;padding:16px!important}
body.app-body .practice-roadmap b,body.app-body .practice-roadmap span,body.app-body .practice-roadmap small{display:block!important;white-space:normal!important;line-height:1.25!important;overflow-wrap:normal!important}
body.app-body .pro-action-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
body.app-body .pro-action-list a{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;min-height:66px!important;padding:12px!important;border-radius:16px!important;background:#f8fbff!important;border:1px solid #e4effb!important;color:#08213f!important;text-decoration:none!important}
body.app-body .pro-action-list a span{display:grid!important;place-items:center!important;width:42px!important;height:42px!important;border-radius:14px!important;background:#e8f4ff!important;font-size:20px!important}
body.app-body .pro-action-list a b,body.app-body .pro-action-list a small{display:block!important;white-space:normal!important;line-height:1.25!important;overflow-wrap:normal!important}
body.app-body .pro-product-grid.media-practice-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;width:100%!important;max-width:1380px!important;margin-left:auto!important;margin-right:auto!important}
body.app-body .pro-product-grid.media-practice-grid article{min-width:0!important;background:#fff!important;border:1px solid #d8e8f7!important;border-radius:24px!important;padding:20px!important;box-shadow:0 12px 32px rgba(8,33,63,.06)!important}
body.app-body .pro-product-grid.media-practice-grid h3,body.app-body .pro-product-grid.media-practice-grid p{display:block!important;white-space:normal!important;line-height:1.35!important;overflow-wrap:normal!important}

/* Sidebar tetap struktur rapi */
body.app-body .structured-side-nav{display:grid!important;gap:14px!important}
body.app-body .menu-group{display:grid!important;gap:7px!important}
body.app-body .side-nav a{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:1px 10px!important;min-width:0!important;min-height:58px!important;align-items:center!important}
body.app-body .side-nav a>span{grid-row:1/3!important;width:42px!important;height:42px!important;display:grid!important;place-items:center!important;flex:none!important;line-height:1!important}
body.app-body .side-nav a b,body.app-body .side-nav a small{display:block!important;min-width:0!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.22!important}

@media(max-width:1280px){
  body.app-body aside.sidebar{flex-basis:286px!important;width:286px!important;min-width:286px!important;max-width:286px!important}
  body.app-body main.main:not(.public-main){width:calc(100vw - 286px)!important;max-width:calc(100vw - 286px)!important;padding:22px!important}
  body.app-body .control-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  body.app-body .control-grid{grid-template-columns:1fr!important}
  body.app-body .pro-product-grid.media-practice-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:992px){
  body.app-body .app-shell:not(.public-shell){display:block!important;width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  body.app-body aside.sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;transform:translateX(-106%)!important;transition:.22s ease!important;width:min(86vw,330px)!important;min-width:0!important;max-width:min(86vw,330px)!important;height:100dvh!important;z-index:7001!important;border-radius:0 24px 24px 0!important}
  body.app-body.sidebar-open aside.sidebar,body.app-body.internal-sidebar-open aside.sidebar{transform:translateX(0)!important}
  body.app-body main.main:not(.public-main){width:100%!important;max-width:100%!important;padding:78px 14px 18px!important;overflow-x:hidden!important}
  body.app-body .mobile-menu-btn{display:grid!important;position:fixed!important;left:14px!important;top:14px!important;z-index:7100!important;width:46px!important;height:46px!important;border:0!important;border-radius:15px!important;background:#0b63ce!important;color:#fff!important;place-items:center!important;font-size:23px!important;box-shadow:0 16px 34px rgba(11,99,206,.24)!important}
  body.app-body .topbar.commercial-topbar{padding-left:68px!important;display:grid!important;grid-template-columns:1fr!important;align-items:start!important;gap:12px!important}
  body.app-body .user-pill{width:100%!important;max-width:100%!important;min-width:0!important}
  body.app-body .superadmin-control-hero{grid-template-columns:1fr!important;padding:24px!important}
  body.app-body .practice-roadmap{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:680px){
  body.app-body main.main:not(.public-main){padding-left:10px!important;padding-right:10px!important}
  body.app-body .topbar.commercial-topbar{border-radius:22px!important;padding:15px 15px 15px 66px!important}
  body.app-body .topbar-brand img{display:none!important}
  body.app-body .topbar-brand h1{font-size:22px!important}
  body.app-body .superadmin-control-hero{padding:20px!important;border-radius:24px!important}
  body.app-body .superadmin-control-hero h2{font-size:30px!important;letter-spacing:-.025em!important}
  body.app-body .control-stat-grid,
  body.app-body .practice-roadmap,
  body.app-body .pro-action-list,
  body.app-body .pro-product-grid.media-practice-grid{grid-template-columns:1fr!important}
  body.app-body .control-panel{padding:18px!important;border-radius:22px!important}
}
@media print{
  body.app-body .app-shell:not(.public-shell){display:block!important;width:100%!important;max-width:none!important}
  body.app-body aside.sidebar,body.app-body .topbar.commercial-topbar{display:none!important}
  body.app-body main.main:not(.public-main){display:block!important;width:100%!important;max-width:none!important;padding:0!important;background:#fff!important;overflow:visible!important}
}