/* SATRIA REFERENCE UI v4.2.100.183
   Presentation-only theme based on supplied six-role reference.
   No business logic, route, print engine, or data contract is defined here.
*/
:root{
  --sr-blue:#1769e8;
  --sr-blue-2:#0d5bd8;
  --sr-blue-3:#eaf4ff;
  --sr-sky:#f4f9ff;
  --sr-navy:#102a56;
  --sr-ink:#14233f;
  --sr-muted:#63728a;
  --sr-border:#dce8f7;
  --sr-surface:#fff;
  --sr-canvas:#eef6ff;
  --sr-green:#14b87a;
  --sr-amber:#f6a623;
  --sr-red:#ef5964;
  --sr-purple:#7558e8;
  --sr-shadow:0 8px 26px rgba(33,91,157,.08);
  --sr-radius:14px;
  --sr-radius-sm:10px;
  --sr-font:"Segoe UI Variable","Segoe UI",Inter,system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
}
html{font-family:var(--sr-font);background:var(--sr-canvas);color:var(--sr-ink)}
body{font-family:var(--sr-font);background:linear-gradient(180deg,#edf6ff 0,#f7fbff 48%,#eef6ff 100%);color:var(--sr-ink)}
button,input,select,textarea{font:inherit}
a{color:inherit}

/* Generic surfaces used by all existing workspaces */
.sr-theme, .satria-admin, .teacher-workspace, .homeroom-workspace, .principal-page{
  font-family:var(--sr-font);
}
.sr-theme .btn,.satria-admin .btn,.teacher-workspace button,.homeroom-workspace button,.principal-page button{
  border-radius:9px;
}

/* ADMIN SHELL */
.satria-admin{background:var(--sr-canvas)!important}
.satria-admin .app-shell{background:transparent}
.satria-admin .app-sidebar{
  background:#fff!important;
  border-right:1px solid var(--sr-border)!important;
  box-shadow:4px 0 18px rgba(27,84,145,.04)!important;
}
.satria-admin .sidebar-brand-area{padding:18px 18px 14px!important;border-bottom:1px solid #edf2f8}
.satria-admin .satria-brand{gap:10px!important}
.satria-admin .brand-mark{background:var(--sr-blue)!important;border-radius:10px!important;box-shadow:none!important}
.satria-admin .brand-copy strong{font-size:22px!important;color:#0f4da5!important;letter-spacing:-.4px}
.satria-admin .brand-copy small{font-size:9px!important;color:#657691!important}
.satria-admin .brand-copy em{font-size:9px!important;color:#71809a!important}
.satria-admin .sidebar-nav{padding:12px 12px 90px!important}
.satria-admin .sidebar-home,
.satria-admin .nav-group>summary{
  min-height:39px!important;border-radius:9px!important;color:#36547c!important;
  padding:8px 10px!important;
}
.satria-admin .sidebar-home.active,
.satria-admin .nav-group[open]>summary{
  background:#1769e8!important;color:#fff!important;box-shadow:0 4px 12px rgba(23,105,232,.18)!important;
}
.satria-admin .nav-group>summary:hover,.satria-admin .sidebar-home:hover{background:#edf5ff!important;color:#155bbf!important}
.satria-admin .nav-group[open]>summary:hover{background:#1769e8!important;color:#fff!important}
.satria-admin .nav-children{padding:4px 0 5px 12px!important}
.satria-admin .nav-child{border-radius:7px!important;color:#4d6280!important;min-height:34px!important}
.satria-admin .nav-child.active{background:#e9f3ff!important;color:#075dcc!important;font-weight:700!important}
.satria-admin .nav-child:hover{background:#f1f7ff!important}
.satria-admin .sidebar-bottom{background:#fff!important;border-top:1px solid #edf2f8!important}
.satria-admin .operator-card{background:#f3f8ff!important;border:1px solid #e0ecfa!important;border-radius:10px!important}
.satria-admin .operator-avatar{background:#dcebff!important;color:#0c5fcf!important}
.satria-admin .logout-button{border-radius:9px!important;color:#48617f!important}
.satria-admin .app-main{background:transparent!important}
.satria-admin .app-topbar{
  height:70px!important;background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid var(--sr-border)!important;box-shadow:none!important;
}
.satria-admin .topbar-left{gap:16px!important}
.satria-admin .menu-toggle{border:1px solid #dce8f7!important;background:#fff!important;border-radius:9px!important}
.satria-admin .topbar-context-year{background:#f5f9ff!important;border:1px solid #dce8f7!important;border-radius:10px!important;color:#526a8a!important}
.satria-admin .topbar-user{border-left:1px solid #e6eef8!important}
.satria-admin .topbar-avatar{background:#dcecff!important;color:#0a60d0!important}
.satria-admin .workspace{padding:24px 26px 42px!important;max-width:1600px;margin:0 auto}
.satria-admin .dashboard-redesign-hero{
  position:relative!important;overflow:hidden!important;
  display:flex!important;justify-content:space-between!important;gap:22px!important;
  padding:26px 28px!important;min-height:148px!important;
  border-radius:15px!important;border:0!important;
  background:linear-gradient(120deg,#075bd3 0%,#1679ee 52%,#65b6ff 100%)!important;
  box-shadow:0 10px 26px rgba(18,96,207,.16)!important;color:#fff!important;
}
.satria-admin .dashboard-redesign-hero:after{
  content:"";position:absolute;width:330px;height:330px;border-radius:50%;
  right:-120px;top:-160px;background:rgba(255,255,255,.08);
}
.satria-admin .dashboard-overline{color:#6f87a7!important;font-size:10px!important;font-weight:800!important;letter-spacing:.08em!important}
.satria-admin .dashboard-redesign-hero .dashboard-overline{color:#d9ebff!important}
.satria-admin .dashboard-redesign-hero h1{font-size:27px!important;line-height:1.12!important;color:#fff!important;margin:7px 0 8px!important}
.satria-admin .dashboard-redesign-hero p{color:#edf7ff!important;max-width:690px!important;font-size:14px!important}
.satria-admin .dashboard-active-context{
  position:relative;z-index:1;min-width:215px;background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(255,255,255,.75)!important;border-radius:12px!important;color:var(--sr-navy)!important;
  padding:15px 17px!important;box-shadow:0 7px 20px rgba(4,57,125,.13)!important
}
.satria-admin .dashboard-stat-grid{gap:10px!important}
.satria-admin .dashboard-stat-card{
  border:1px solid var(--sr-border)!important;border-radius:12px!important;background:#fff!important;
  box-shadow:0 4px 16px rgba(27,84,145,.05)!important;min-height:102px!important
}
.satria-admin .dashboard-stat-card:hover{border-color:#b9d6f8!important;transform:translateY(-1px)}
.satria-admin .dashboard-stat-icon{border-radius:10px!important;background:#eaf4ff!important;color:#1670e8!important}
.satria-admin .dashboard-stat-card:nth-child(2) .dashboard-stat-icon{background:#e8faf4!important;color:#10ad74!important}
.satria-admin .dashboard-stat-card:nth-child(3) .dashboard-stat-icon{background:#f0ecff!important;color:#7254e8!important}
.satria-admin .dashboard-stat-card:nth-child(4) .dashboard-stat-icon{background:#fff4dc!important;color:#ef9d17!important}
.satria-admin .dashboard-stat-text strong{color:#102b56!important;font-size:24px!important}
.satria-admin .dashboard-block,.satria-admin .dashboard-context-card{
  background:#fff!important;border:1px solid var(--sr-border)!important;border-radius:12px!important;
  box-shadow:var(--sr-shadow)!important
}
.satria-admin .dashboard-quick-item{border:1px solid #e2ecf8!important;border-radius:10px!important;background:#fff!important}
.satria-admin .dashboard-quick-item:hover{background:#f6faff!important;border-color:#bcd8f6!important}
.satria-admin .quick-item-icon{background:#eaf4ff!important;color:#0f68df!important;border-radius:9px!important}
.satria-admin .dashboard-block-head h2,.satria-admin .dashboard-context-card h2{color:#132c52!important}
.satria-admin .dashboard-head-note{color:#71829b!important}

/* Generic admin page internals */
.satria-admin .page-header,.satria-admin .page-heading,.satria-admin .section-header,.satria-admin .surface,.satria-admin .card{
  border-radius:12px!important
}
.satria-admin table{border-color:#dfeaf6!important}
.satria-admin th{background:#f1f7ff!important;color:#294b76!important}
.satria-admin td{background:#fff!important}
.satria-admin input,.satria-admin select,.satria-admin textarea{
  border-color:#d6e4f3!important;border-radius:9px!important;background:#fff!important;color:#1d3557!important
}
.satria-admin input:focus,.satria-admin select:focus,.satria-admin textarea:focus{border-color:#62a6f5!important;box-shadow:0 0 0 3px rgba(23,105,232,.10)!important}
.satria-admin .btn.primary,.satria-admin button.primary{background:#1769e8!important;border-color:#1769e8!important;color:#fff!important}
.satria-admin .btn.secondary{background:#fff!important;border-color:#cfe0f3!important;color:#315477!important}

/* ROLE DESKTOP SHELLS: reference proportions, but keep each role's menu */
.teacher-workspace,.homeroom-workspace{background:var(--sr-canvas)!important}
.teacher-shell-header,.homeroom-shell-header{
  background:#fff!important;border-bottom:1px solid var(--sr-border)!important;box-shadow:0 2px 12px rgba(27,84,145,.04)!important;
  min-height:68px!important;padding:0 24px!important
}
.teacher-brand-mark,.homeroom-brand-mark{background:#1769e8!important;border-radius:9px!important}
.teacher-brand-word strong,.homeroom-brand-word strong{color:#0f4da5!important;font-size:21px!important}
.teacher-brand-word small,.homeroom-brand-word small{color:#71809a!important}
.teacher-header-rule,.homeroom-header-rule{background:#e2ebf5!important}
.teacher-context strong,.homeroom-context strong{color:#17345d!important}
.teacher-context span,.homeroom-context span{color:#74839a!important}
.teacher-avatar,.homeroom-avatar{background:#e2efff!important;color:#0e60c8!important}
.teacher-main-nav,.homeroom-main-nav{background:#fff!important;border-bottom:1px solid #dce8f7!important}
.teacher-nav-inner,.homeroom-nav-inner{max-width:1500px!important;margin:auto!important;padding:8px 22px!important;gap:6px!important}
.teacher-nav-item,.homeroom-nav-item{
  border-radius:8px!important;color:#42607f!important;padding:9px 13px!important
}
.teacher-nav-item.is-active,.homeroom-nav-item.is-active{background:#1769e8!important;color:#fff!important;box-shadow:0 3px 9px rgba(23,105,232,.16)!important}
.teacher-nav-item:hover,.homeroom-nav-item:hover{background:#edf5ff!important;color:#145dbb!important}
.teacher-nav-item.is-active:hover,.homeroom-nav-item.is-active:hover{background:#1769e8!important;color:#fff!important}
.teacher-workspace-main,.homeroom-workspace-main{max-width:1500px!important;margin:0 auto!important;padding:22px 24px 80px!important}
.teacher-welcome,.homeroom-welcome{
  border:0!important;border-radius:14px!important;
  background:linear-gradient(120deg,#075bd3 0%,#1479ee 52%,#69baff 100%)!important;
  box-shadow:0 10px 25px rgba(18,96,207,.15)!important;color:#fff!important
}
.teacher-welcome-copy h1,.homeroom-welcome-copy h1{color:#fff!important;font-size:27px!important}
.teacher-welcome-copy p,.homeroom-welcome-copy p{color:#eef8ff!important}
.teacher-kicker,.homeroom-kicker{color:#6c83a1!important}
.teacher-welcome .teacher-kicker,.homeroom-welcome .homeroom-kicker{color:#d8ecff!important}
.teacher-welcome-side,.homeroom-welcome-side{
  background:rgba(255,255,255,.94)!important;color:#17355d!important;border:1px solid rgba(255,255,255,.75)!important;
  border-radius:11px!important
}
.teacher-welcome-side span,.homeroom-welcome-side span,.teacher-welcome-side small,.homeroom-welcome-side small{color:#627692!important}
.teacher-welcome-side strong,.homeroom-welcome-side strong{color:#102b56!important}
.teacher-task,.homeroom-task,.teacher-data-panel,.homeroom-print-panel,.homeroom-report-work-card,.homeroom-class-card{
  border:1px solid var(--sr-border)!important;background:#fff!important;border-radius:12px!important;box-shadow:var(--sr-shadow)!important
}
.teacher-task-primary,.homeroom-task-primary{background:#fff!important;border-top:3px solid #1769e8!important}
.teacher-task-icon,.homeroom-task-icon{background:#eaf4ff!important;color:#1769e8!important;border-radius:9px!important}
.teacher-task-secondary{border-top:3px solid #7558e8!important}
.homeroom-task-amber{border-top:3px solid #f2a31b!important}
.teacher-progress,.homeroom-section-head,.teacher-section-head{margin-top:20px!important}
.teacher-progress-step{background:#fff!important;border:1px solid var(--sr-border)!important;border-radius:10px!important}
.teacher-progress-dot{background:#eaf4ff!important;color:#1769e8!important}
.teacher-progress-step.is-primary .teacher-progress-dot{background:#1769e8!important;color:#fff!important}
.teacher-assignment{border-bottom-color:#e5edf7!important}
.teacher-assignment-mark{background:#eaf4ff!important;color:#1769e8!important;border-radius:8px!important}
.homeroom-class-card-info{border-top:3px solid #1769e8!important}
.homeroom-class-info-state{background:#eef8f5!important;color:#0e9f6a!important;border-radius:8px!important}
.homeroom-print-link{background:#f6faff!important;border-color:#e0ebf7!important;border-radius:9px!important}
.homeroom-report-work-card:hover,.teacher-task:hover,.homeroom-task:hover{border-color:#b8d6f6!important;transform:translateY(-1px)}
.teacher-mobile-nav,.homeroom-mobile-nav{background:#fff!important;border-top:1px solid #dce8f7!important;box-shadow:0 -4px 16px rgba(30,87,145,.08)!important}
.teacher-mobile-nav a.is-active,.homeroom-mobile-nav a.is-active{color:#1769e8!important}

/* Principal: keep its rich monitoring data, shift to reference visual language */
.principal-page{background:var(--sr-canvas)!important}
.principal-topbar{
  background:#fff!important;border-bottom:1px solid var(--sr-border)!important;box-shadow:0 2px 12px rgba(27,84,145,.04)!important
}
.principal-topbar-brand strong{color:#0f4da5!important}
.principal-brand-mark{background:#1769e8!important;border-radius:9px!important}
.principal-context strong{color:#17345d!important}
.principal-context span{color:#71809a!important}
.principal-user-avatar{background:#e2efff!important;color:#0e60c8!important}
.principal-layout{background:var(--sr-canvas)!important;max-width:1500px!important}
.principal-executive-hero{
  background:linear-gradient(120deg,#075bd3 0%,#1479ee 52%,#69baff 100%)!important;
  border-radius:14px!important;box-shadow:0 10px 25px rgba(18,96,207,.15)!important
}
.principal-overview .principal-stat,.principal-panel,.principal-readiness-section{
  background:#fff!important;border:1px solid var(--sr-border)!important;border-radius:12px!important;box-shadow:var(--sr-shadow)!important
}
.principal-stat-dark{background:#1769e8!important;border-color:#1769e8!important}
.principal-stat-dark span,.principal-stat-dark strong,.principal-stat-dark small{color:#fff!important}
.principal-stat-accent{border-top:3px solid #14b87a!important}
.principal-period-form,.principal-scope-filter{background:#f6faff!important;border:1px solid #dfeaf7!important;border-radius:10px!important}
.principal-scope-field select,.principal-period-form select{background:#fff!important;border-color:#cfdfef!important;border-radius:8px!important}
.principal-primary{background:#1769e8!important;border-color:#1769e8!important}
.principal-data-table th{background:#f1f7ff!important;color:#2b4c75!important}
.principal-data-table td{background:#fff!important;border-bottom-color:#e7eef7!important}
.principal-status-badge{border-radius:7px!important}
.principal-bottom-nav{background:#fff!important;border-top:1px solid #dce8f7!important}

/* Auth / login / chooser */
.login-page,.principal-login-page{background:linear-gradient(180deg,#eef7ff,#f7fbff)!important}
.login-chooser,.login-app,.principal-login-shell{max-width:1200px!important}
.login-showcase,.principal-login-info{
  background:linear-gradient(120deg,#075bd3,#1679ee,#68b8ff)!important
}
.role-card{border:1px solid #dbe8f6!important;background:#fff!important;border-radius:12px!important}
.role-card:hover{border-color:#8dbdf3!important;box-shadow:0 8px 20px rgba(23,105,232,.10)!important}
.role-icon{background:#eaf4ff!important;color:#1769e8!important;border-radius:9px!important}
.login-panel,.principal-login-form{background:#fff!important}
.login-submit,.principal-login-submit{background:#1769e8!important;border-color:#1769e8!important;border-radius:9px!important}
.login-field input,.principal-input-wrap input{border-color:#d4e3f2!important;border-radius:9px!important}
.login-field input:focus,.principal-input-wrap input:focus{border-color:#5aa1ef!important;box-shadow:0 0 0 3px rgba(23,105,232,.10)!important}

/* Mobile role portals */
.satria-portal{
  min-height:100dvh;background:linear-gradient(180deg,#edf7ff 0,#f8fbff 38%,#eef6ff 100%);
  color:var(--sr-ink);padding-bottom:78px;
}
.satria-portal .portal-top{
  background:#fff;border-bottom:1px solid #dce8f7;position:sticky;top:0;z-index:10;
  height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;
}
.satria-portal .portal-brand{display:flex;align-items:center;gap:8px;color:#0f4da5;font-weight:800}
.satria-portal .portal-brand-mark{width:30px;height:30px;border-radius:8px;background:#1769e8;color:#fff;display:grid;place-items:center;font-weight:800}
.satria-portal .portal-top-avatar{width:32px;height:32px;border-radius:50%;background:#e2efff;color:#0e60c8;display:grid;place-items:center;font-size:12px;font-weight:800}
.satria-portal .portal-main{padding:14px 14px 24px;max-width:560px;margin:0 auto}
.satria-portal .portal-profile{
  background:linear-gradient(120deg,#075bd3,#1479ee,#69baff);color:#fff;border-radius:14px;padding:17px 16px;
  box-shadow:0 10px 24px rgba(18,96,207,.14)
}
.satria-portal .portal-profile-kicker{font-size:10px;font-weight:800;letter-spacing:.06em;color:#d8ecff}
.satria-portal .portal-profile h1{font-size:21px;line-height:1.15;margin:5px 0 3px;color:#fff}
.satria-portal .portal-profile p{font-size:12px;color:#edf8ff;margin:0}
.satria-portal .portal-profile-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.satria-portal .portal-chip{background:rgba(255,255,255,.92);color:#17345d;border-radius:8px;padding:7px 9px;font-size:10px;font-weight:700}
.satria-portal .portal-tabs{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid #dce8f7;border-radius:10px;margin-top:12px;padding:3px;position:sticky;top:62px;z-index:8}
.satria-portal .portal-tabs a{padding:9px;text-align:center;text-decoration:none;border-radius:8px;color:#71809a;font-size:12px;font-weight:700}
.satria-portal .portal-tabs a.active{background:#eaf4ff;color:#1769e8}
.satria-portal .portal-section{margin-top:15px}
.satria-portal .portal-section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:8px}
.satria-portal .portal-section-head h2{font-size:15px;margin:0;color:#132c52}
.satria-portal .portal-section-head span{font-size:10px;color:#71809a}
.satria-portal .portal-summary{
  display:grid;grid-template-columns:repeat(3,1fr);gap:7px
}
.satria-portal .portal-summary-card{
  background:#fff;border:1px solid #dce8f7;border-radius:10px;padding:10px 8px;min-height:64px
}
.satria-portal .portal-summary-card small{display:block;font-size:9px;color:#71809a}
.satria-portal .portal-summary-card strong{display:block;font-size:20px;line-height:1.05;margin-top:4px;color:#102b56}
.satria-portal .portal-summary-card em{font-size:9px;font-style:normal;font-weight:800;color:#13a66e}
.satria-portal .portal-score-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.satria-portal .portal-score-card{background:#fff;border:1px solid #dce8f7;border-radius:10px;padding:11px}
.satria-portal .portal-score-card-top{display:flex;gap:8px;align-items:center}
.satria-portal .portal-subject-icon{width:28px;height:28px;border-radius:8px;background:#eaf4ff;color:#1769e8;display:grid;place-items:center;font-size:11px;font-weight:800;flex:0 0 auto}
.satria-portal .portal-score-card:nth-child(3n+2) .portal-subject-icon{background:#f1edff;color:#7658e8}
.satria-portal .portal-score-card:nth-child(3n+3) .portal-subject-icon{background:#e8faf4;color:#10a971}
.satria-portal .portal-score-card strong{font-size:11px;color:#203a60;line-height:1.2}
.satria-portal .portal-score-value{display:flex;align-items:end;gap:5px;margin-top:10px}
.satria-portal .portal-score-value b{font-size:21px;color:#102b56}
.satria-portal .portal-score-value span{font-size:10px;color:#0fa66e;font-weight:800;padding-bottom:3px}
.satria-portal .portal-all-link{display:block;text-align:center;background:#edf6ff;color:#1266d9;padding:10px;border-radius:9px;margin-top:9px;text-decoration:none;font-size:11px;font-weight:800}
.satria-portal .portal-assessment{
  background:#fff;border:1px solid #dce8f7;border-radius:10px;padding:11px;margin-bottom:7px
}
.satria-portal .portal-assessment-head{display:flex;justify-content:space-between;gap:10px}
.satria-portal .portal-assessment-title{font-size:12px;font-weight:800;color:#17345d}
.satria-portal .portal-assessment-type{font-size:9px;background:#edf6ff;color:#1266d9;border-radius:7px;padding:5px 7px;font-weight:800;white-space:nowrap}
.satria-portal .portal-assessment-meta{font-size:9px;color:#71809a;margin-top:3px}
.satria-portal .portal-component-list{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.satria-portal .portal-component{background:#f5f9fe;border:1px solid #e2ecf7;border-radius:7px;padding:5px 7px;font-size:9px;color:#516986}
.satria-portal .portal-component b{color:#102b56;margin-left:3px}
.satria-portal .portal-empty{background:#fff;border:1px dashed #cbdced;border-radius:10px;padding:18px;text-align:center;color:#71809a;font-size:11px}
.satria-portal .portal-note{background:#fff8e8;border:1px solid #f8dfad;color:#8a641e;border-radius:10px;padding:10px;font-size:10px;line-height:1.45}
.satria-portal .portal-bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:20;background:#fff;border-top:1px solid #dce8f7;
  display:grid;grid-template-columns:repeat(3,1fr);height:68px;box-shadow:0 -5px 18px rgba(30,87,145,.08)
}
.satria-portal .portal-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:#7a8aa0;font-size:9px;font-weight:700}
.satria-portal .portal-bottom-nav a.active{color:#1769e8}
.satria-portal .portal-bottom-icon{font-size:17px}
@media(max-width:900px){
  .satria-admin .workspace{padding:16px 14px 76px!important}
  .satria-admin .dashboard-redesign-hero{flex-direction:column!important}
  .satria-admin .dashboard-active-context{min-width:0;width:100%}
  .teacher-shell-header,.homeroom-shell-header{padding:0 14px!important}
  .teacher-main-nav,.homeroom-main-nav{display:none}
  .teacher-workspace-main,.homeroom-workspace-main{padding:14px 14px 82px!important}
}
@media(max-width:640px){
  .satria-admin .dashboard-redesign-hero,.teacher-welcome,.homeroom-welcome,.principal-executive-hero{padding:18px!important;border-radius:12px!important}
  .satria-admin .dashboard-redesign-hero h1,.teacher-welcome-copy h1,.homeroom-welcome-copy h1{font-size:23px!important}
  .satria-admin .dashboard-stat-grid{grid-template-columns:repeat(2,1fr)!important}
  .satria-admin .dashboard-work-grid{grid-template-columns:1fr!important}
  .principal-overview{grid-template-columns:repeat(2,1fr)!important}
  .principal-layout{padding:14px!important}
}
@media(min-width:901px){
  .satria-portal{background:#eef6ff}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
@media print{
  .satria-portal .portal-top,.satria-portal .portal-bottom-nav,.satria-portal .portal-tabs{display:none!important}
}

.satria-portal .portal-bottom-nav{grid-template-columns:repeat(4,1fr)}
.satria-portal .portal-bottom-nav form{display:flex;align-items:center;justify-content:center}
.satria-portal .portal-bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}

.principal-sidebar{position:fixed;left:0;top:68px;bottom:0;width:228px;background:#fff;border-right:1px solid #dce8f7;z-index:9;padding:16px 12px;display:flex;flex-direction:column}
.principal-sidebar-brand{display:flex;align-items:center;gap:9px;padding:8px 8px 16px;border-bottom:1px solid #edf2f8}
.principal-sidebar-brand .principal-brand-mark{width:32px;height:32px;display:grid;place-items:center;color:#fff;background:#1769e8;border-radius:8px;font-weight:800}
.principal-sidebar-brand strong{display:block;font-size:18px;color:#0f4da5}
.principal-sidebar-brand small{display:block;font-size:9px;color:#71809a;margin-top:1px}
.principal-sidebar nav{padding-top:12px;display:grid;gap:4px}
.principal-sidebar nav a,.principal-sidebar-footer button{display:flex;align-items:center;gap:10px;min-height:40px;padding:9px 11px;border:0;border-radius:9px;text-decoration:none;background:transparent;color:#47607f;font-size:12px;font-weight:650;text-align:left}
.principal-sidebar nav a:hover{background:#edf5ff;color:#145dbb}
.principal-sidebar nav a.is-active{background:#1769e8;color:#fff;box-shadow:0 4px 11px rgba(23,105,232,.16)}
.principal-sidebar-footer{margin-top:auto;border-top:1px solid #edf2f8;padding-top:10px}
.principal-sidebar-footer button{width:100%;cursor:pointer}
.principal-sidebar-footer button:hover{background:#f1f6fc}
.principal-page .principal-layout{margin-left:228px!important;padding-top:22px!important}
@media(max-width:900px){
 .principal-sidebar{display:none}
 .principal-page .principal-layout{margin-left:0!important;padding-top:14px!important}
}