:root{
  --navy:#7b3510;
  --navy-2:#a84d14;
  --orange:#e96b18;
  --orange-soft:#fff1e7;
  --blue:#3299c7;
  --green:#e96b18;
  --bg:#fff9f3;
}
.brand-panel{background:linear-gradient(145deg,#ffd19f 0%,#f7ae62 58%,#f39742 100%);color:#642b0d}
.brand-panel:after{border-color:rgba(255,255,255,.28)}
.official-logo{position:relative;z-index:1;background:#fff;border-radius:18px;padding:10px 16px;width:min(390px,75%);box-shadow:0 15px 40px rgba(0,0,0,.16)}
.official-logo img{display:block;width:100%;height:auto}
.brand-copy .eyebrow{color:#8b3a0d}.brand-copy p{color:#713814}.trust-row{color:#713814;font-weight:600}
.login-panel{background:linear-gradient(155deg,#fff 70%,#fff5df)}
.google-btn{border-color:#f0c49e}.google-btn:hover{border-color:#ed7c24;box-shadow:0 8px 24px rgba(233,107,24,.12)}
.demo-btn{background:linear-gradient(110deg,#d95c11,#f18a2d)!important}
.primary-btn{background:linear-gradient(110deg,#e96b18,#f28622)}
.primary-btn:hover{filter:brightness(.96)}
.info-box{background:#fff4df;border-left-color:#ffb81c}.info-box p{color:#6e6043}
.sidebar{background:linear-gradient(180deg,#071d36 0%,#0b294b 100%);color:#fff}
.sidebar-brand{padding:0 4px 20px;border-bottom-color:rgba(255,255,255,.14)}.sidebar-brand>img{width:76px;height:46px;object-fit:contain;background:white;border-radius:9px;padding:4px}.sidebar-brand strong{color:#fff}.sidebar-brand small{color:#d1deeb}
nav button{color:#fff}nav button:hover,nav button.active{background:#ffd7b2;color:#3c1d0c;border-left:3px solid #f47c20}
.user-mini{border-top-color:rgba(255,255,255,.14)}.user-mini strong{color:#fff}.user-mini small{color:#d1deeb}.user-mini .icon-btn{color:#fff}
.welcome-strip{background:linear-gradient(110deg,#f3a052,#f7bd78);color:#552307}.welcome-strip p{color:#743711}.welcome-strip:after{border-color:rgba(255,255,255,.28)}.date-pill{background:rgba(255,255,255,.4)}
.stat-icon{background:#fff3d8;color:#e96b18}.stat-card:nth-child(2) .stat-icon{background:#fff0df;color:#e96b18}.stat-card:nth-child(3) .stat-icon{background:#fff4e8;color:#cf5a13}.stat-card:nth-child(4) .stat-icon{background:#ffe9d8;color:#e96b18}
.memo{border-left-color:#f18a2d}.activity-dot{background:#ed7c24}.notification-btn span{background:#e96b18}
.badge{background:#ffead8;color:#a7430e}.badge.pending{background:#fff2d3;color:#9d6810}
.center-view{background:linear-gradient(145deg,#fff1df,#fff9ef)}
.mobile-logo img{width:210px;height:auto}
@media(max-width:760px){.official-logo{display:none}.sidebar-brand>img{width:70px}.mobile-logo{margin-bottom:40px}}

/* 2026 workspace redesign — inspired by a clean learning dashboard */
:root{
  --navy:#13213d;
  --navy-2:#243b68;
  --orange:#f47c20;
  --orange-soft:#fff3e7;
  --blue:#4f7cff;
  --blue-soft:#edf2ff;
  --ink:#17233c;
  --muted:#7d879d;
  --line:#edf0f6;
  --bg:#f3f5f9;
  --white:#fff;
  --shadow:0 18px 45px rgba(36,55,91,.08);
}

body{background:linear-gradient(145deg,#eef1f6 0%,#f8f9fc 48%,#edf1f8 100%);color:var(--ink)}
.app-layout{grid-template-columns:286px 1fr;min-height:100vh;padding:24px;gap:0}
.sidebar{inset:24px auto 24px 24px;width:286px;border-radius:20px 0 0 20px;background:#fff;color:var(--ink);padding:0;box-shadow:0 18px 55px rgba(38,55,88,.1);overflow:hidden}
.workspace{grid-column:2;background:#f8f9fc;min-height:calc(100vh - 48px);border-radius:0 20px 20px 0;overflow:hidden;box-shadow:18px 18px 55px rgba(38,55,88,.06)}

.sidebar-brand{height:78px;padding:14px 22px;border-bottom:1px solid var(--line);gap:11px}
.sidebar-brand>img{width:68px;height:44px;border:0;border-radius:8px;padding:3px;box-shadow:none}
.sidebar-brand strong{color:var(--ink);font-size:.98rem}
.sidebar-brand small{color:var(--muted);font-size:.68rem}
.user-mini{order:0;margin:0;padding:25px 22px 22px;border:0;border-bottom:1px solid var(--line);grid-template-columns:54px 1fr;gap:13px}
.user-mini img{width:54px;height:54px;border-radius:50%;border:4px solid #fff;outline:2px solid #ffb16f;box-shadow:0 8px 20px rgba(32,48,80,.12)}
.user-mini strong{color:var(--ink);font-size:.92rem}
.user-mini small{color:var(--muted);font-size:.72rem;margin-top:4px}
.user-mini .icon-btn{display:none}
.nav-label{padding:18px 22px 6px;color:#a4adbe;font-size:.66rem;font-weight:800;letter-spacing:.16em}
nav{padding:8px 14px 14px;display:grid;grid-template-columns:1fr 1fr;gap:8px;overflow:auto}
nav button{min-height:72px;padding:10px 6px;border:1px solid transparent;border-radius:12px;color:#657087;text-align:center;justify-content:center;flex-direction:column;gap:6px;font-size:.69rem;line-height:1.18;background:#fff}
nav button:hover{background:#f6f8fd;color:var(--navy);border-color:#e8ecf4}
nav button.active{background:linear-gradient(145deg,#527fff,#426fe8);color:#fff;border:0;box-shadow:0 10px 22px rgba(79,124,255,.24)}
.nav-icon{width:auto;font-size:1.05rem;line-height:1}
.sidebar-signout{margin:auto 14px 14px;width:calc(100% - 28px);min-height:42px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#657087;font-weight:700;cursor:pointer}
.sidebar-signout:hover{color:#d4514d;background:#fff6f5;border-color:#ffd9d6}
.sidebar-signout span{margin-right:8px}

.topbar{height:78px;padding:0 28px;background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.topbar h2{font-size:1.25rem;color:var(--ink)}
.topbar .eyebrow{font-size:.66rem;color:#9aa4b6;margin-bottom:4px}
.top-actions{gap:10px}
.top-actions .secondary-btn{border-color:#e5e9f1;color:#516078;box-shadow:none}
.notification-btn{border-color:#e5e9f1;box-shadow:none}
.content{padding:26px;max-width:1600px}

.welcome-strip{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:22px 25px;box-shadow:0 8px 25px rgba(30,47,78,.04)}
.welcome-strip:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(#4f7cff,#72a3ff)}
.welcome-strip:after{width:210px;height:210px;right:-65px;border:48px solid rgba(79,124,255,.06)}
.welcome-strip h3{font-size:1.45rem;color:var(--ink)}
.welcome-strip p{color:var(--muted)}
.date-pill{background:var(--blue-soft);color:#4668c9;border-radius:10px;font-weight:700}

.stats-grid{gap:16px;margin:18px 0}
.stat-card,.panel{border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 24px rgba(31,49,82,.04)}
.stat-card{padding:18px;position:relative;overflow:hidden}
.stat-card:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:#4f7cff;opacity:.75}
.stat-card:nth-child(2):after{background:#28c7bc}.stat-card:nth-child(3):after{background:#ffb343}.stat-card:nth-child(4):after{background:#ff7676}
.stat-icon{background:var(--blue-soft)!important;color:#4f7cff!important;border-radius:10px}
.stat-card:nth-child(2) .stat-icon{background:#e9fbf8!important;color:#19a99f!important}
.stat-card:nth-child(3) .stat-icon{background:#fff6df!important;color:#d89316!important}
.stat-card:nth-child(4) .stat-icon{background:#fff0ef!important;color:#e45f5b!important}
.stat-card strong{color:var(--ink);font-size:1.65rem}
.dashboard-grid{grid-template-columns:1.55fr 1fr;gap:16px}
.panel{padding:20px}
.panel h3,.section-head h3{color:var(--ink)}
.memo{background:#f8faff;border-left-color:#4f7cff}
.activity-dot{background:#4f7cff}

.table-wrap{border-color:var(--line);border-radius:14px;box-shadow:0 8px 24px rgba(31,49,82,.04)}
th{background:#f8faff;color:#778299}
th,td{border-bottom-color:#eef1f6}
.search-input{border-color:#e5e9f1;border-radius:12px;box-shadow:0 5px 15px rgba(31,49,82,.03)}
.primary-btn{background:linear-gradient(135deg,#527fff,#416de5);box-shadow:0 8px 18px rgba(79,124,255,.2)}
.primary-btn:hover{filter:brightness(.98);transform:translateY(-1px)}
.secondary-btn{border-color:#e3e8f1;color:#536078}
.badge{background:#eef3ff;color:#4f6fd0}
.badge.pending{background:#fff4e4;color:#c47a18}
.notification-btn span{background:var(--orange)}
.toast{background:#17233c}
dialog{border-radius:16px;box-shadow:0 28px 80px rgba(22,35,61,.22)}
.field input,.field select,.field textarea{border-color:#dfe4ed;border-radius:10px;background:#fbfcff}
.field input:focus,.field select:focus,.field textarea:focus,.search-input:focus{outline:3px solid rgba(79,124,255,.14);border-color:#6c8cff}

@media(max-width:1000px){
  .app-layout{padding:0;display:block}.workspace{min-height:100vh;border-radius:0}.sidebar{inset:0 auto 0 0;border-radius:0;width:286px}
}
@media(max-width:760px){
  .topbar{height:78px}.content{padding:16px}.welcome-strip{padding:20px}.stats-grid{gap:10px}.sidebar-brand>img{width:68px}
}

/* Full learning-workspace model */
.top-search{margin-left:clamp(24px,5vw,80px);width:min(330px,26vw);height:42px;padding:0 14px;border-radius:22px;background:#f6f7fa;display:flex;align-items:center;gap:9px;color:#9aa4b6}
.top-search input{border:0;outline:0;background:transparent;width:100%;color:var(--ink);font-size:.85rem}
.top-search input::placeholder{color:#b1b8c5}
.portal-chip{margin-left:auto;display:flex;align-items:center;gap:9px;padding:6px 12px;border-radius:22px;background:#f8f9fc;color:#657087}
.portal-chip div{display:grid;line-height:1.15}.portal-chip small{font-size:.63rem;color:#9aa4b6}.portal-chip strong{font-size:.72rem}
.portal-dot{width:24px;height:24px;border-radius:50%;background:conic-gradient(#ef3340 0 25%,#111 0 50%,#21a179 0 75%,#fff 0);border:2px solid #fff;box-shadow:0 0 0 1px #e5e9f1}
.top-actions{margin-left:12px}
nav button.search-match{outline:3px solid rgba(79,124,255,.22);border-color:#4f7cff}

.workspace-intro{display:flex;align-items:end;justify-content:space-between;padding:2px 2px 18px}
.workspace-intro small{color:#9aa4b6;font-size:.72rem}.workspace-intro h3{font:800 1.55rem 'Manrope';margin:5px 0 2px;color:var(--ink)}.workspace-intro p{margin:0;color:var(--muted);font-size:.87rem}
.workspace-role{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 13px;font-size:.72rem;font-weight:800;color:#52617a;box-shadow:0 6px 15px rgba(31,49,82,.04)}
.action-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px}
.action-strip button{height:58px;border:0;border-radius:6px;background:linear-gradient(135deg,#527fff,#4a75ed);color:#fff;padding:0 16px;display:grid;grid-template-columns:28px 1fr 18px;align-items:center;text-align:left;cursor:pointer;box-shadow:0 9px 19px rgba(79,124,255,.18);transition:.2s}
.action-strip button:hover{transform:translateY(-2px);box-shadow:0 13px 25px rgba(79,124,255,.25)}
.action-strip button>span{font-size:1rem}.action-strip button strong{font-size:.78rem}.action-strip button b{text-align:right;font-size:1rem;font-weight:700}

.learning-board{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;align-items:start}
.board-column{display:grid;gap:20px}
.board-card{background:#fff;border:1px solid #eef1f6;border-radius:6px;min-height:198px;padding:20px;display:flex;flex-direction:column;box-shadow:0 10px 28px rgba(33,52,85,.045);position:relative;overflow:hidden;transition:.2s}
.board-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(33,52,85,.09)}
.board-card.tall{min-height:416px}.board-card.mini{min-height:146px}
.board-card small{display:block;color:#9da6b6;font-size:.62rem;font-weight:800;letter-spacing:.14em;margin-top:auto}
.board-card h4{font:750 1.03rem 'Manrope';margin:6px 0 3px;color:#29364e}.board-card p{font-size:.75rem;line-height:1.5;color:#939caf;margin:0;min-height:34px}
.board-card>button{align-self:flex-start;margin-top:12px;border:0;background:transparent;color:#4f75df;padding:0;font-size:.72rem;font-weight:800;cursor:pointer}
.board-card>button:hover{text-decoration:underline}
.visual-checks{height:72px;display:flex;gap:18px;align-items:center}.visual-checks i{width:34px;height:34px;background:#f5f7fa;border-radius:3px;display:grid;place-items:center;color:#4f7cff;font-style:normal;font-weight:900}.visual-checks i:first-child{background:#fff0ef;color:#ff7272}.visual-checks i:nth-child(2){background:#eaf0ff}
.students-symbol{height:72px;display:flex;align-items:end;gap:12px}.students-symbol i{width:32px;background:#f4f6fa;border-radius:3px 3px 0 0}.students-symbol i:nth-child(1){height:38px;background:#eaf0ff}.students-symbol i:nth-child(2){height:58px;background:#4f7cff}.students-symbol i:nth-child(3){height:46px;background:#fff0df}
.letter-grid{height:238px;display:grid;grid-template-columns:repeat(7,1fr);gap:7px;align-items:center;padding:8px 0 24px;color:#c0c6d2}
.letter-grid span,.letter-grid em{font-style:normal;text-align:center;font-size:.72rem}.letter-grid em{height:104px;border-radius:18px;background:#edf2ff;color:#527fff;display:grid;place-items:center}.letter-grid em:nth-of-type(3),.letter-grid em:nth-of-type(4){background:#fff0dd;color:#f39a30}
.drop-icon{width:52px;height:52px;margin:2px auto 18px;border-radius:4px;background:#edf2ff;color:#4f7cff;display:grid;place-items:center;font-size:1.35rem}
.office-icon{width:64px;height:55px;border-radius:4px;display:grid;place-items:center;font:800 1.5rem 'Manrope';margin-bottom:18px}.office-icon.blue{color:#4f7cff;background:#edf2ff}.office-icon.mint{color:#20b7ad;background:#e7faf7}.office-icon.coral{color:#f26b68;background:#fff0ef}

/* Every module keeps the same model language */
.section-head{background:#fff;border:1px solid var(--line);border-radius:8px;padding:16px 18px;margin-bottom:14px;box-shadow:0 8px 20px rgba(31,49,82,.035)}
.section-actions{display:flex;gap:8px;flex-wrap:wrap}.filters{background:#fff;padding:12px;border:1px solid var(--line);border-radius:8px}.table-wrap{border-radius:7px}.empty{border-radius:7px}.panel{border-radius:7px}.assessment-card,.fee-summary-card,.fee-progress-panel{border-radius:7px!important}

@media(max-width:1220px){.top-search{width:230px;margin-left:25px}.portal-chip{display:none}.learning-board{grid-template-columns:1fr 1fr}.board-column:last-child{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.board-column:last-child .board-card{min-height:180px}}
@media(max-width:900px){.top-search{display:none}.action-strip{gap:10px}.learning-board{grid-template-columns:1fr}.board-column:last-child{grid-column:auto;grid-template-columns:1fr}.board-card.tall{min-height:330px}.letter-grid{height:165px}.workspace-intro{align-items:center}}
@media(max-width:760px){.action-strip{grid-template-columns:1fr}.action-strip button{height:54px}.workspace-intro{padding-top:4px}.workspace-intro h3{font-size:1.3rem}.workspace-role{display:none}.learning-board,.board-column{gap:12px}.board-card{min-height:170px}.board-card.tall{min-height:310px}.section-head{padding:14px;display:flex;flex-direction:column;align-items:stretch}.section-actions>*{flex:1}}