/* MTsN 1 Tana Toraja — V2.33.3
   Final responsive, mobile-safe-area, public/admin compaction and editor fixes.
   Loaded after the historical stylesheets so older components remain intact. */

*,*::before,*::after{box-sizing:border-box}
html{max-width:100%;overflow-x:clip}
body{max-width:100%;overflow-x:clip}
img,video,picture,canvas,iframe{max-width:100%}
img,video{height:auto}
:where(.grid,.content-grid,.institution-grid,.institution-promo-grid,.program-grid,.service-grid,.digital-service-grid,.gallery-grid,.external-news-grid,.article-layout,.split-layout,.welcome-grid,.student-preview-card,.premium-hero-shell,.premium-service-grid,.premium-stat-strip,.form-grid,.admin-grid-2,.settings-grid)>*{min-width:0}
:where(h1,h2,h3,h4,p,a,strong,small,span,dd,dt,td,th){overflow-wrap:break-word}

.page-home .program-section .heading-light h2{color:#fff!important}
.page-home .program-section .heading-light .section-kicker{color:#a9f3ea!important}

/* Stop long public content from creating an invisible horizontal page. */
.public-site-body main,
.public-site-body .section,
.public-site-body .page-hero,
.public-site-body .article-section,
.public-site-body .module-content,
.public-site-body .portal-content{min-width:0;max-width:100%;overflow-x:clip}
.public-site-body .prose img,
.public-site-body .article-prose img,
.public-site-body .facility-public-card img,
.public-site-body .gallery-card img{display:block;max-width:100%;height:auto}

/* Stable drawers/sidebars at the scroll boundary. */
.drawer-panel,.drawer-nav,.admin-sidebar,.tinta-drawer__panel{overscroll-behavior:contain}
.drawer-panel,.admin-sidebar,.tinta-drawer__panel{-webkit-overflow-scrolling:touch}


/* PPID/Humas share a portal layout rather than public-site-body. */
.portal-shell main{min-width:0;max-width:100%;overflow-x:clip}
.portal-shell img,.portal-shell video,.portal-shell iframe{max-width:100%;height:auto}
.portal-shell :is(.module-card-grid,.module-stats,.split-panel,.form-layout,.tracking-layout,.external-news-grid,.social-portal-grid)>*{min-width:0}

/* News article: compact home return control. */
.tinta-article-home-back{display:inline-flex;align-items:center;gap:6px;min-height:34px;margin:0 0 12px;padding:6px 10px;border:1px solid #dce6e4;border-radius:10px;background:#fff;color:#315451;text-decoration:none;font-size:.78rem;font-weight:850;box-shadow:0 2px 8px rgba(20,55,50,.06)}
.tinta-article-home-back .icon{width:15px;height:15px}

/* Editor modal replacing browser prompt(). */
.editor-dialog-backdrop{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:18px;background:rgba(8,31,29,.46)}
.editor-dialog{width:min(100%,460px);display:grid;gap:14px;padding:20px;border:1px solid #d7e5e1;border-radius:18px;background:#fff;box-shadow:0 24px 70px rgba(7,36,33,.28)}
.editor-dialog h2{margin:0;font-size:1.15rem;color:#193c38}
.editor-dialog p{margin:-6px 0 0;color:#667c78;font-size:.8rem;line-height:1.55}
.editor-dialog label{display:grid;gap:6px;font-size:.78rem;font-weight:800;color:#385753}
.editor-dialog :is(input,textarea){width:100%;min-height:44px;padding:10px 12px;border:1px solid #cddedb;border-radius:11px;background:#fff;color:#172f2d;font:inherit}
.editor-dialog textarea{min-height:110px;resize:vertical}
.editor-dialog__actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.editor-dialog__actions button{min-height:42px}
body.editor-dialog-open{overflow:hidden}

/* Running-text rows now carry item status and order without a schema migration. */
.ticker-edit-row{display:grid!important;grid-template-columns:minmax(0,1fr) 92px auto auto;align-items:end;gap:8px!important;padding:10px;border:1px solid #e0e9e7;border-radius:12px;background:#fafcfc}
.ticker-edit-row>label{display:grid;gap:5px;min-width:0;font-size:.72rem;font-weight:800}
.ticker-edit-row>label:first-child{grid-column:1}
.ticker-edit-row .ticker-active-toggle{align-self:center;display:flex;align-items:center;gap:6px;min-height:44px;padding-top:18px;white-space:nowrap}
.ticker-edit-row .ticker-order-input{width:100%}
.ticker-edit-row [data-ticker-remove]{align-self:end}

/* Admin tables/forms: long text must wrap and controls must stay inside cards. */
.admin-body :is(.admin-card,.content-panel,.public-form,.tracking-form,.notification-card,.inbox-message){min-width:0;max-width:100%}
.admin-body table{max-width:100%}
.admin-body :is(td,th){white-space:normal;overflow-wrap:anywhere;word-break:normal}
.admin-body :is(input,select,textarea,button,.button){max-width:100%}
.admin-body .inbox-message-body{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65}
.admin-body .inbox-message .status.status-replied{background:#e7f7ef;color:#126547}

/* PTK must never reserve a tall empty animated box. */
.staff-ordered-directory,.ordered-appointment-sections,.staff-profile-group,.staff-appointment-group,.staff-subgroup{min-height:0!important;height:auto!important}
.staff-ordered-directory :is(.staff-profile-group,.staff-appointment-group,.professional-staff-card,.appointment-card){opacity:1!important;visibility:visible!important;transform:none!important;animation:none!important}

/* Facilities cards: proportional media and compact body. */
.facility-public-grid{align-items:start}
.facility-public-card{min-height:0!important;height:auto!important;overflow:hidden;padding:0!important}
.facility-public-card>img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:0!important;margin:0!important}
.facility-public-card>h2{margin:14px 16px 7px;font-size:1.08rem;line-height:1.3}
.facility-public-card>p{margin:0 16px 16px;text-align:left!important;word-spacing:normal;line-height:1.62}

@media(max-width:820px){
  :root{--mobile-screen-gutter:16px;--mobile-bottom-nav-space:92px}
  .public-site-body{padding-bottom:calc(var(--mobile-bottom-nav-space) + env(safe-area-inset-bottom,0px))!important}
  .public-site-body .container,
  .public-site-body .tinta-container,
  .public-site-body .tinta-article-container,
  .public-site-body .module-container{width:min(calc(100% - (var(--mobile-screen-gutter) * 2)),var(--container,1180px))!important;max-width:calc(100% - (var(--mobile-screen-gutter) * 2))!important;margin-inline:auto!important}
  .public-site-body :is(.container,.tinta-container,.tinta-article-container,.module-container) :is(.container,.tinta-container,.module-container){width:100%!important;max-width:100%!important;margin-inline:0!important}


  /* PPID and Humas public portals use the same 14–16 px mobile safety gutter. */
  .portal-shell .container{width:min(calc(100% - (var(--mobile-screen-gutter) * 2)),var(--container,1200px))!important;max-width:calc(100% - (var(--mobile-screen-gutter) * 2))!important;margin-inline:auto!important}
  .portal-shell :is(.container) .container{width:100%!important;max-width:100%!important;margin-inline:0!important}
  .portal-shell .portal-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .portal-shell .portal-header-row{min-height:66px!important;gap:8px!important}
  .portal-shell .portal-brand{gap:8px!important;min-width:0}
  .portal-shell .portal-brand img{width:38px!important;height:48px!important}
  .portal-shell .portal-brand span{min-width:0}
  .portal-shell .portal-brand strong{font-size:1rem!important;line-height:1.15}
  .portal-shell .portal-brand small{display:block;max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem}
  .portal-shell .portal-header-actions{gap:6px!important;flex:0 0 auto}
  .portal-shell .portal-header-actions .button{min-height:40px!important;padding:7px 9px!important;font-size:.7rem!important}
  .portal-shell .portal-header-actions .portal-menu-toggle{width:40px!important;height:40px!important;min-height:40px!important}
  .portal-shell .portal-nav{overscroll-behavior:contain}
  .portal-shell .portal-nav-inner{padding:10px 0!important;gap:4px!important}
  .portal-shell .portal-nav-group>summary{white-space:normal!important;overflow-wrap:anywhere;padding:11px 12px!important}
  .portal-shell .portal-nav-group>div{min-width:0!important;width:100%!important}
  .portal-shell :is(.module-hero,.module-content,.article-section){overflow-x:clip}
  .portal-shell .module-hero{padding-block:34px!important}
  .portal-shell .module-hero-grid{grid-template-columns:1fr!important;gap:16px!important}
  .portal-shell .module-hero h1{font-size:clamp(1.8rem,8vw,2.55rem)!important;line-height:1.12!important}
  .portal-shell .module-hero p{font-size:.94rem!important;line-height:1.62!important;text-align:left!important;word-spacing:normal!important}
  .portal-shell .module-hero-card{padding:18px!important;border-radius:18px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .portal-shell :is(.module-card-grid.two,.module-card-grid.three,.module-stats.large,.split-panel,.form-layout,.tracking-layout,.external-news-grid,.social-portal-grid){grid-template-columns:1fr!important}
  .portal-shell :is(.module-action-card,.prose-card,.content-panel,.program-card,.public-form,.tracking-form,.tracking-result,.declaration-card,.portal-card,.module-card){padding:18px!important;min-width:0}
  .portal-shell :is(.prose-card,.content-panel,.program-card,.portal-card,.module-card,.external-news-card) p{text-align:left!important;text-align-last:auto!important;word-spacing:normal!important;line-height:1.65!important}
  .portal-shell :is(.button,button,input,select,textarea){max-width:100%}
  .portal-shell .portal-footer{margin-top:32px!important;padding:24px 0!important}
  .portal-shell .portal-footer>.container{gap:14px!important}

  /* Mobile typography: left alignment prevents extreme inter-word spacing. */
  .public-site-body :is(.prose,.article-prose,.page-copy,.section-copy,.hero-copy,.portal-hero,.module-hero,.external-news-card,.facility-public-card,.program-card,.student-character-copy) p{max-width:100%;text-align:left!important;text-align-last:auto!important;text-justify:auto!important;word-spacing:normal!important;letter-spacing:normal}

  /* Header: one compact horizontal row. */
  .public-site-body .site-header{height:auto!important;min-height:68px!important}
  .public-site-body .site-header .header-inner{width:100%!important;max-width:100%!important;min-height:68px!important;height:68px!important;padding:6px 14px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important}
  .public-site-body .site-header .brand{flex:0 0 auto;min-width:0;gap:0}
  .public-site-body .site-header .brand>img{width:42px!important;height:54px!important;object-fit:contain!important}
  .public-site-body .site-header .brand>span{display:none!important}
  .public-site-body .site-header .header-actions{margin-left:auto;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;min-width:0;flex-wrap:nowrap!important}
  .public-site-body .site-header .header-actions :is(.icon-button,.mobile-menu-toggle,.header-login,.header-tinta){flex:0 0 42px!important;width:42px!important;min-width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;border-radius:14px!important;display:grid!important;place-items:center!important}
  .public-site-body .site-header .header-actions .header-login span{display:none!important}
  .public-site-body .site-header .header-actions .header-contact{display:none!important}
  .public-site-body .site-header .header-tinta .tinta-wordmark{font-size:0!important}
  .public-site-body .site-header .header-tinta .tinta-wordmark::before{content:"T.";font:italic 900 1.55rem/1 Georgia,serif;color:#c82136}

  /* Drawer hierarchy and long labels. */
  .drawer-panel{width:min(92vw,390px)!important;max-width:92vw!important}
  .drawer-nav>details>summary,.drawer-nav li>a,.drawer-subgroup summary>a{min-width:0}
  .drawer-nav :is(a,span,strong){white-space:normal;overflow-wrap:anywhere}
  .drawer-nav .drawer-subgroup ul{padding-left:18px!important}

  /* Bottom navigation: stable, safe and never covers final content. */
  .mobile-bottom-nav{left:12px!important;right:12px!important;bottom:max(8px,env(safe-area-inset-bottom,0px))!important;width:auto!important;min-height:66px!important;height:auto!important;padding:7px 7px calc(7px + env(safe-area-inset-bottom,0px))!important;border-radius:22px!important;overscroll-behavior:contain;transform:translateZ(0)}
  .mobile-bottom-nav__item{min-width:0!important;min-height:52px!important;padding:4px 3px!important;gap:3px!important;transform:none!important}
  .mobile-bottom-nav__item>span{width:37px!important;height:37px!important;border-radius:12px!important}
  .mobile-bottom-nav__item small{max-width:100%;font-size:.62rem!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis}
  .mobile-bottom-nav__item:active{transform:none!important}
  .site-footer{padding-bottom:18px}
  .whatsapp-float,.accessibility-toggle,.back-to-top{bottom:calc(var(--mobile-bottom-nav-space) + env(safe-area-inset-bottom,0px) + 12px)!important}

  /* Common mobile cards and controls. */
  .public-site-body :is(.prose-card,.content-panel,.school-profile-card,.welcome-grid,.student-preview-card,.cta-card,.public-form,.tracking-form,.tracking-result,.declaration-card,.principal-letter-card,.portal-card,.module-card){min-width:0;padding:18px!important}
  .public-site-body :is(.button,.premium-action){max-width:100%;min-height:44px;line-height:1.2;text-align:center;white-space:normal}
  .public-site-body :is(h1,h2,h3){max-width:100%;overflow-wrap:anywhere}

  /* General public grids become one column when one-column reading is clearer. */
  .public-site-body :is(.institution-grid,.content-grid,.announcement-grid,.event-list,.external-news-grid,.gallery-grid,.management-cards,.facility-public-grid){grid-template-columns:1fr!important}
  .public-site-body :is(.institution-grid,.content-grid,.external-news-grid,.facility-public-grid){gap:14px!important}

  /* Home hero: compact, padded and no giant empty image placeholder. */
  .page-home .premium-home-hero{padding:12px 0 22px!important;overflow:visible}
  .page-home .premium-home-container{width:calc(100% - 32px)!important;max-width:calc(100% - 32px)!important}
  .page-home .premium-hero-shell{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;min-height:0!important;border-radius:24px!important;overflow:hidden!important}
  .page-home .premium-hero-copy{padding:20px 18px 8px!important;min-width:0}
  .page-home .premium-hero-kicker{margin:0 0 12px!important;font-size:.72rem!important;line-height:1.3;letter-spacing:.13em}
  .page-home .premium-hero-copy h1{gap:5px!important;margin:0 0 14px!important;line-height:1.05!important}
  .page-home .premium-hero-copy h1 span{font-size:clamp(30px,8.7vw,36px)!important;line-height:1.02!important;letter-spacing:-.04em!important}
  .page-home .premium-hero-copy h1 strong{font-size:clamp(22px,6.7vw,28px)!important;line-height:1.15!important;letter-spacing:-.035em!important}
  .page-home .premium-hero-lead{margin:0 0 11px!important;font-size:15px!important;line-height:1.62!important;color:#526966}
  .page-home .premium-hero-motto{display:block!important;width:100%;max-width:100%;margin:0 0 14px!important;padding:8px 10px!important;border-radius:13px!important;font-size:11.5px!important;line-height:1.45!important;text-align:left;white-space:normal}
  .page-home .premium-hero-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:0!important}
  .page-home .premium-action{width:100%!important;height:46px!important;min-height:46px!important;max-height:46px!important;padding:8px 9px!important;border-radius:14px!important;gap:6px!important;font-size:12.5px!important;white-space:nowrap!important}
  .page-home .premium-action .action-label-desktop{display:none!important}
  .page-home .premium-action .action-label-mobile{display:inline!important}
  .page-home .premium-hero-microstats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin:12px 0 0!important}
  .page-home .premium-hero-microstats span{min-width:0!important;padding:8px 5px!important;border-radius:11px!important;text-align:center}
  .page-home .premium-hero-microstats b{font-size:.76rem!important;line-height:1.15;overflow-wrap:anywhere}
  .page-home .premium-hero-microstats small{font-size:.58rem!important;line-height:1.2}
  .page-home .premium-hero-visual{padding:0 12px 14px!important;min-width:0}
  .page-home .premium-hero-image-wrap{width:100%!important;min-height:0!important;aspect-ratio:16/10!important;border:4px solid #fff!important;border-radius:18px!important}
  .page-home .premium-hero-image-wrap>img{width:100%!important;height:100%!important;object-fit:cover!important;display:block}
  .page-home .premium-hero-meta{margin-top:8px!important;gap:7px!important}
  .page-home .premium-hero-identity-card{padding:8px 10px!important;border-radius:13px!important}
  .page-home .premium-hero-identity-card img{width:30px!important;height:38px!important}
  .page-home .premium-hero-chip-row{gap:6px!important}
  .page-home .premium-hero-floating-chip{padding:7px 6px!important;font-size:.6rem!important}
  .page-home .premium-value-bar{margin-top:12px!important}

  /* Generasi Madrasah — V2.33.3 mobile redesign.
     The mascot no longer owns a separate grid row. It is anchored in the
     lower-right corner beside the CTA area, removing the large empty block
     that was still visible in V2.33.1. */
  .page-home .student-character-section{padding-block:14px!important}
  .page-home .student-character-card{position:relative!important;display:block!important;min-height:0!important;padding:16px 16px 14px!important;border-radius:22px!important;overflow:hidden!important}
  .page-home .student-character-copy{position:relative!important;z-index:3!important;padding:0!important;min-width:0!important}
  .page-home .student-character-copy .section-kicker{font-size:11px!important;line-height:1.2!important;letter-spacing:.12em!important}
  .page-home .student-character-copy h2{margin:8px 0 8px!important;font-size:clamp(21px,5.8vw,24px)!important;line-height:1.18!important;letter-spacing:-.025em!important}
  .page-home .student-character-copy p{margin:0!important;font-size:13.5px!important;line-height:1.52!important}
  .page-home .student-character-values{display:flex!important;flex-wrap:wrap!important;gap:6px!important;margin-top:9px!important;padding-right:0!important}
  .page-home .student-character-values span{flex:0 1 auto!important;padding:6px 9px!important;font-size:10.75px!important;line-height:1.1!important}
  .page-home .student-character-actions{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:7px!important;margin-top:10px!important;min-height:112px!important;padding-right:128px!important;min-width:0!important}
  .page-home .student-character-actions .button{width:auto!important;min-height:38px!important;height:38px!important;padding:6px 10px!important;border-radius:12px!important;font-size:11.5px!important;white-space:nowrap!important}
  .page-home .student-character-actions .text-link{justify-self:auto!important;min-width:0!important;max-width:100%!important;font-size:11px!important;line-height:1.2!important;white-space:normal!important;gap:4px!important}
  .page-home .student-character-actions :is(.button,.text-link) .icon{flex:0 0 auto!important;width:14px!important;height:14px!important}
  .page-home .student-character-figure{position:absolute!important;z-index:2!important;right:4px!important;bottom:0!important;width:124px!important;height:136px!important;min-height:0!important;max-height:none!important;margin:0!important;padding:0!important;overflow:visible!important;display:block!important;pointer-events:none!important}
  .page-home .student-character-figure picture{display:block!important;width:124px!important;height:136px!important;max-height:none!important;overflow:visible!important}
  .page-home .student-character-figure img{position:absolute!important;right:2px!important;bottom:0!important;display:block!important;width:auto!important;max-width:none!important;max-height:none!important;height:148px!important;margin:0!important;object-fit:contain!important;object-position:center bottom!important;animation:none!important;transform:none!important;filter:drop-shadow(0 12px 14px rgba(6,47,44,.17))!important}
  .page-home .student-character-figure figcaption{display:none!important}
  .page-home .student-mascot-halo{width:132px!important;height:42px!important;left:50%!important;bottom:-10px!important;opacity:.38!important;animation:none!important}
  .page-home .student-mascot-spark{transform:scale(.72)!important;animation:none!important}

  /* Program strategic cards should not consume an entire viewport each. */
  .page-home .program-section{padding-block:34px!important}
  .page-home .program-section .heading-light h2{color:#fff!important}
  .page-home .program-section .heading-light .section-kicker{color:#a9f3ea!important}
  .page-home .program-grid{grid-template-columns:1fr!important;gap:12px!important}
  .page-home .program-card{min-height:0!important;padding:18px!important;border-radius:18px!important;gap:10px!important}
  .page-home .program-card>span:first-child{width:48px!important;height:48px!important}
  .page-home .program-card h3{margin:2px 0 0!important;font-size:1.18rem!important;line-height:1.3!important}
  .page-home .program-card p{margin:0!important;font-size:14.5px!important;line-height:1.62!important}

  /* Facilities and PTK. */
  .facilities-content .prose-card{padding:10px!important}
  .facility-public-grid{gap:12px!important}
  .staff-directory-section{padding-block:32px!important}
  .staff-ordered-directory,.ordered-appointment-sections{gap:14px!important}
  .staff-profile-group,.staff-appointment-group{padding:14px!important;border-radius:18px!important;gap:13px!important}
  .appointment-grid{grid-template-columns:1fr!important;gap:9px!important}

  /* Tinta/article on phones. */
  .tinta-article-header{padding-block:20px!important}
  .tinta-article-header h1{font-size:clamp(1.65rem,7.2vw,2.25rem)!important;line-height:1.14!important}
  .tinta-article-deck{font-size:.94rem!important;line-height:1.58!important}
  .tinta-share-bar{padding:10px 0!important}
  .tinta-share-bar>div{gap:6px!important}
  .share-chip{min-height:40px!important;padding:8px 10px!important}
  .article-prose p{text-align:left!important;word-spacing:normal!important;line-height:1.72!important}

  /* Admin mobile. */
  .admin-body .admin-content{padding-left:14px!important;padding-right:14px!important;min-width:0!important;overflow-x:clip}
  .admin-body :is(.admin-card,.content-panel,.public-form,.tracking-form){padding:14px!important}
  .admin-body .form-grid{grid-template-columns:1fr!important}
  .admin-body .form-grid>*{grid-column:1!important;min-width:0}
  .admin-body .form-actions{display:flex;flex-wrap:wrap;gap:8px}
  .admin-body .form-actions>*{max-width:100%}
  .admin-body .inbox-message header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .admin-body .inbox-message .form-actions :is(form,a){flex:1 1 145px}
  .admin-body .inbox-message .form-actions :is(button,a){width:100%;justify-content:center}
  .ticker-edit-row{grid-template-columns:1fr 84px!important}
  .ticker-edit-row>label:first-child{grid-column:1/-1!important}
  .ticker-edit-row .ticker-active-toggle{grid-column:1!important;padding-top:0!important}
  .ticker-edit-row [data-ticker-remove]{grid-column:2!important;align-self:end}
}

@media(max-width:430px){
  :root{--mobile-screen-gutter:14px;--mobile-bottom-nav-space:88px}
  .public-site-body .site-header .header-inner{padding-inline:12px!important}
  .public-site-body .site-header .header-actions{gap:5px!important}
  .public-site-body .site-header .header-actions :is(.icon-button,.mobile-menu-toggle,.header-login,.header-tinta){width:40px!important;min-width:40px!important;height:40px!important;min-height:40px!important;border-radius:13px!important}
  .page-home .premium-home-container{width:calc(100% - 28px)!important;max-width:calc(100% - 28px)!important}
  .page-home .premium-hero-copy{padding:18px 16px 8px!important}
  .page-home .premium-hero-visual{padding-inline:10px!important}
  .page-home .student-character-card{padding:15px 14px 13px!important}
  .page-home .student-character-copy h2{font-size:clamp(20.5px,5.8vw,23px)!important}
  .page-home .student-character-copy p{font-size:13.25px!important}
  .page-home .student-character-actions{min-height:104px!important;padding-right:116px!important}
  .page-home .student-character-figure{right:1px!important;width:112px!important;height:126px!important}
  .page-home .student-character-figure picture{width:112px!important;height:126px!important}
  .page-home .student-character-figure img{height:138px!important}
  .mobile-bottom-nav{left:8px!important;right:8px!important;padding-inline:5px!important}
  .mobile-bottom-nav__item small{font-size:.58rem!important}
  .admin-body .admin-content{padding-left:12px!important;padding-right:12px!important}
}

@media(max-width:360px){
  .page-home .premium-hero-actions{grid-template-columns:1fr!important}
  .page-home .premium-action{height:44px!important;min-height:44px!important;max-height:44px!important}
  .page-home .premium-hero-microstats b{font-size:.7rem!important}
  .page-home .student-character-actions{min-height:96px!important;padding-right:102px!important}
  .page-home .student-character-actions .text-link{justify-self:auto!important}
  .page-home .student-character-figure{width:98px!important;height:116px!important}
  .page-home .student-character-figure picture{width:98px!important;height:116px!important}
  .page-home .student-character-figure img{height:128px!important}
  .public-site-body .site-header .header-tinta{display:none!important}
}

/* Coarse/touch hardware: no expensive glass/hover motion. */
@media(pointer:coarse){
  .public-site-body :is(.site-header,.mobile-bottom-nav,.premium-hero-identity-card,.home-video-card,.home-slider-controls,.portal-header){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .public-site-body :is(.reveal,[data-reveal],.content-card,.professional-staff-card,.external-news-card,.stat-card){opacity:1!important;visibility:visible!important;transform:none!important;animation:none!important;transition:none!important}
  .public-site-body :is(.depth-ripple,.ambient-blob,.premium-home-aura){animation:none!important}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}


/* V2.33.3 — final compact mobile fix for Generasi Madrasah.
   Previous attempts resized the mascot, but the cleanest solution on phones is
   to remove the decorative mascot from this section entirely so the card can
   collapse naturally without empty space or overlap. Desktop/tablet remain unchanged. */
@media(max-width:560px){
  .page-home .student-character-card{
    display:block!important;
    min-height:0!important;
    padding:14px 14px 13px!important;
    border-radius:20px!important;
  }
  .page-home .student-character-copy h2{
    margin:8px 0 10px!important;
    font-size:clamp(19px,5.9vw,22px)!important;
    line-height:1.18!important;
  }
  .page-home .student-character-copy p{
    margin:0!important;
    max-width:none!important;
    font-size:13px!important;
    line-height:1.56!important;
  }
  .page-home .student-character-values{
    gap:6px!important;
    margin-top:10px!important;
    padding-right:0!important;
  }
  .page-home .student-character-values span{
    padding:6px 8px!important;
    font-size:10.5px!important;
    line-height:1.1!important;
  }
  .page-home .student-character-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    margin-top:10px!important;
    min-height:0!important;
    padding-right:0!important;
    align-items:start!important;
    justify-content:start!important;
  }
  .page-home .student-character-actions .button{
    width:auto!important;
    max-width:100%!important;
    min-height:40px!important;
    height:40px!important;
    padding:6px 11px!important;
    border-radius:12px!important;
    font-size:11.5px!important;
  }
  .page-home .student-character-actions .text-link{
    max-width:100%!important;
    font-size:11.5px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }
  .page-home .student-character-figure,
  .page-home .student-mascot-halo,
  .page-home .student-mascot-spark{
    display:none!important;
  }
}
@media(max-width:390px){
  .page-home .student-character-card{padding:13px 13px 12px!important}
  .page-home .student-character-copy h2{font-size:clamp(18.5px,6vw,21px)!important}
  .page-home .student-character-copy p{font-size:12.8px!important}
}

/* V2.33.4: containers control outer gutters; cards own inner spacing.
   Include body and container so historical !important resets cannot win. */
body.public-site-body .container.student-character-card,
body.public-site-body .container.student-preview-card,
body.public-site-body .container.cta-card{padding-inline:clamp(24px,4vw,50px)!important}
@media(max-width:820px){
  body.public-site-body .container.student-character-card,
  body.public-site-body .container.student-preview-card,
  body.public-site-body .container.cta-card{padding-inline:20px!important}
}
@media(max-width:560px){
  body.public-site-body .container.student-character-card{padding:20px!important}
  .page-home .student-character-copy h2{line-height:1.3!important}
  .page-home .student-character-copy p{font-size:14px!important;line-height:1.65!important}
  .page-home .student-character-values{gap:7px!important;margin-top:14px!important}
  .page-home .student-character-actions{gap:10px!important;margin-top:16px!important;justify-items:start!important}
  .page-home .student-character-actions .button{height:auto!important;min-height:44px!important;padding:10px 14px!important;font-size:13px!important;line-height:1.4!important;white-space:normal!important}
  .page-home .student-character-actions .text-link{min-height:44px!important;display:inline-flex!important;align-items:center!important;font-size:13px!important;line-height:1.5!important}
}

/* V2.33.5 — sidebar children must retain their intrinsic height.
   The sidebar itself scrolls; grid tracks must not collapse closed details. */
@media screen {
  body.admin-body .admin-sidebar{height:100dvh;overflow-y:auto;overflow-x:hidden}
  body.admin-body .admin-sidebar>.admin-brand,
  body.admin-body .admin-sidebar>.admin-nav,
  body.admin-body .admin-sidebar>.admin-sidebar-footer{flex:0 0 auto}
  body.admin-body .admin-nav{display:flex;flex-direction:column;gap:8px;min-height:auto;padding:14px 12px}
  body.admin-body .admin-nav>*{flex:0 0 auto;min-width:0}
  body.admin-body .admin-nav-group{margin:0;overflow:visible}
  body.admin-body .admin-nav-group>summary{min-height:48px;padding:10px 12px;line-height:1.45;color:#e5f1ef;border-radius:12px}
  body.admin-body .admin-nav-group:not([open])>div{display:none}
  body.admin-body .admin-nav a{height:auto;min-height:46px;line-height:1.45;white-space:normal}
  body.admin-body .admin-sidebar-footer{display:grid;gap:10px;padding:14px 16px calc(18px + env(safe-area-inset-bottom,0px));position:static}
  body.admin-body .admin-sidebar-footer>*{margin:0;max-width:100%}
  body.admin-body .admin-close{color:#173d38;background:#edf6f3;font-size:24px}
  body.public-site-body .drawer-panel{height:100dvh;overflow-y:auto;overflow-x:hidden}
  body.public-site-body .drawer-panel>.drawer-header,
  body.public-site-body .drawer-panel>.drawer-nav,
  body.public-site-body .drawer-panel>.drawer-footer{flex:0 0 auto}
  body.public-site-body .drawer-header{padding:14px 16px}
  body.public-site-body .drawer-nav>details{margin-bottom:8px}
  body.public-site-body .drawer-nav>details>summary{min-height:50px;padding:10px 12px;line-height:1.45}
  body.public-site-body .drawer-footer{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:16px 18px calc(20px + env(safe-area-inset-bottom,0px))}
  body.public-site-body .drawer-footer>.button{margin:0!important;width:100%;height:auto;min-height:46px;padding:11px 14px;line-height:1.45;font-size:14px;white-space:normal;border-radius:12px;box-shadow:none}
  body.public-site-body .drawer-footer>.button .icon-3d{flex:0 0 auto;width:26px;height:26px}
  body.public-site-body .accessibility-toggle{display:grid!important;left:14px;right:auto;bottom:24px;width:44px;height:44px;z-index:910}
  body.public-site-body .accessibility-toggle:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
  body.public-site-body .accessibility-panel{max-height:calc(100dvh - 120px);overflow-y:auto;z-index:1700}
}
@media screen and (max-width:820px){
  body.public-site-body .accessibility-toggle{bottom:calc(var(--mobile-bottom-nav-space,92px) + 12px + env(safe-area-inset-bottom,0px))}
}
@media screen and (min-width:1200px){
  body.admin-body .admin-shell.is-collapsed .admin-sidebar-footer{display:none}
}

/* V2.33.6 — one field surface, including browser autofill. */
.auth-body .auth-login-form .input-icon{background:var(--surface,#fff);overflow:hidden;isolation:isolate}
.auth-body .auth-login-form .input-icon input{background:transparent!important;border-radius:0!important;min-width:0;outline:none;color:var(--ink,#172f2d);caret-color:var(--ink,#172f2d)}
.auth-body .auth-login-form .input-icon input:-webkit-autofill,
.auth-body .auth-login-form .input-icon input:-webkit-autofill:hover,
.auth-body .auth-login-form .input-icon input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px var(--surface,#fff) inset!important;
  box-shadow:0 0 0 1000px var(--surface,#fff) inset!important;
  -webkit-text-fill-color:var(--ink,#172f2d)!important;
  caret-color:var(--ink,#172f2d);
}
.auth-body .auth-login-form .input-icon input:autofill{box-shadow:0 0 0 1000px var(--surface,#fff) inset!important;color:var(--ink,#172f2d)}
/* Accessibility belongs to the header flow, never over page content. */
body.public-site-body .site-header .header-accessibility{position:static!important;inset:auto!important;display:inline-grid!important;place-items:center;flex:0 0 40px;width:40px;min-width:40px;height:40px;padding:0;margin:0 0 0 6px;border-radius:12px;z-index:auto}
body.public-site-body .site-header .header-accessibility>.icon-3d{width:26px;height:26px}
@media(max-width:560px){
  body.public-site-body .site-header .header-inner{gap:5px!important}
  body.public-site-body .site-header .header-accessibility{margin:0;flex-basis:36px;width:36px;min-width:36px}
  body.public-site-body .site-header .brand{flex:0 1 auto;min-width:0}
  body.public-site-body .site-header .header-actions{gap:4px!important}
}