.admin-layout, .campus-layout { display: grid; grid-template-columns: 262px minmax(0, 1fr); min-height: 100svh; background: var(--paper); }
.app-sidebar { position: sticky; top: 0; display: grid; grid-template-rows: auto 1fr auto; align-self: start; height: 100svh; overflow: hidden; color: oklch(0.83 0.01 258); background: var(--surface-dark); }
.sidebar-brand { display: flex; align-items: center; gap: 10px; padding: 23px 20px; border-bottom: 1px solid oklch(1 0 0 / 0.1); }
.sidebar-brand img { width: 34px; height: 34px; }
.sidebar-brand strong { display: block; color: var(--surface); font-size: var(--text-base); }
.sidebar-brand small { display: block; margin-top: 2px; color: oklch(0.68 0.01 258); font-size: 0.67rem; }
.sidebar-scroll { min-height: 0; overflow-y: auto; padding: 18px 12px; }
.nav-group { display: grid; gap: 4px; margin-bottom: 21px; }
.nav-group-title { margin: 0 8px 7px; color: oklch(0.56 0.01 258); font-size: 0.67rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; }
.app-sidebar a { display: flex; align-items: center; gap: 10px; min-height: 39px; padding: 8px 10px; border-radius: var(--radius-sm); color: inherit; font-size: var(--text-sm); font-weight: 650; }
.app-sidebar a:hover { color: var(--surface); background: oklch(1 0 0 / 0.08); }
.app-sidebar a.is-active { color: var(--ink); background: var(--yellow); }
.nav-count { display: inline-grid; min-width: 20px; height: 20px; place-items: center; padding: 0 5px; margin-left: auto; border-radius: 999px; color: var(--ink); background: var(--yellow); font-size: 0.66rem; font-weight: 800; }
.app-sidebar a.is-active .nav-count { color: var(--surface); background: var(--ink); }
.sidebar-footer { display: grid; gap: 12px; padding: 14px 12px; border-top: 1px solid oklch(1 0 0 / 0.1); }
.sidebar-user { display: flex; align-items: center; gap: 9px; padding: 8px; }
.sidebar-user span { min-width: 0; }
.sidebar-user strong, .sidebar-user small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user strong { color: var(--surface); font-size: var(--text-sm); }
.sidebar-user small { color: oklch(0.65 0.01 258); font-size: var(--text-xs); }
.sidebar-tools { display: flex; align-items: center; gap: 4px; }
.sidebar-tools a, .sidebar-tools button { display: inline-grid; width: 35px; height: 35px; place-items: center; padding: 0; color: oklch(0.73 0.01 258); border-radius: var(--radius-sm); background: transparent; }
.sidebar-tools a:hover, .sidebar-tools button:hover { color: var(--surface); background: oklch(1 0 0 / 0.08); }
.sidebar-tools form { margin: 0; }

.workspace { min-width: 0; }
.workspace-topbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 72px; padding: 12px clamp(20px, 4vw, 52px); border-bottom: 1px solid var(--line); background: oklch(0.985 0.004 90 / 0.96); backdrop-filter: blur(12px); }
.workspace-context { min-width: 0; }
.breadcrumb { display: flex; align-items: center; gap: 7px; margin-bottom: 3px; color: var(--muted); font-size: var(--text-xs); }
.breadcrumb .icon { width: 13px; height: 13px; }
.workspace-context h1 { overflow: hidden; margin: 0; font-size: var(--text-xl); text-overflow: ellipsis; white-space: nowrap; }
.workspace-actions { display: flex; align-items: center; gap: 8px; }
.topbar-date { color: var(--muted); font-size: var(--text-sm); }
.app-drawer-toggle { display: none; }
.workspace-main { min-width: 0; padding: clamp(22px, 4vw, 50px); }
.workspace-main > * + * { margin-top: 24px; }

.dashboard-welcome { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.dashboard-welcome h2 { margin-bottom: 7px; font-size: clamp(1.8rem, 3vw, 2.7rem); }
.dashboard-welcome p { margin-bottom: 0; }
.metric-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.metric-card { display: grid; gap: 12px; min-width: 0; padding: 16px; border-top: 3px solid var(--line-strong); background: var(--surface); }
.metric-card.is-primary { border-top-color: var(--blue); }
.metric-card.is-action { border-top-color: var(--yellow-strong); background: var(--yellow-soft); }
.metric-card.is-success { border-top-color: var(--green); }
.metric-card.is-warning { border-top-color: var(--orange); }
.metric-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: var(--text-xs); font-weight: 750; }
.metric-card-top .icon { color: var(--blue); }
.metric-card.is-action .metric-card-top .icon { color: oklch(0.48 0.11 82); }
.metric-card strong { overflow: hidden; color: var(--ink); font-size: var(--text-2xl); line-height: 1; text-overflow: ellipsis; }
.metric-card small { color: var(--muted); font-size: var(--text-xs); }
.metric-card-link { display: block; transition: transform 180ms var(--ease-out), box-shadow 180ms var(--ease-out); }
.metric-card-link:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }

.dashboard-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(290px, 0.65fr); gap: 18px; }
.dashboard-main-stack, .dashboard-side-stack { display: grid; gap: 18px; align-content: start; }
.agenda-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.agenda-list li { display: grid; grid-template-columns: 62px 1fr auto; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
.agenda-list li:last-child { border-bottom: 0; }
.agenda-time { color: var(--blue-strong); font-size: var(--text-sm); font-weight: 800; }
.agenda-title { margin: 0; color: var(--ink); font-size: var(--text-sm); font-weight: 750; }
.agenda-detail { margin: 3px 0 0; color: var(--muted); font-size: var(--text-xs); }
.action-list { display: grid; gap: 7px; padding: 0; margin: 0; list-style: none; }
.action-list a { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
.action-list a:last-child { border-bottom: 0; }
.action-list .icon { color: var(--blue); }
.action-list strong { font-size: var(--text-sm); }
.action-list small { color: var(--muted); font-size: var(--text-xs); }
.next-class { position: relative; overflow: hidden; }
.next-class::after { content: ""; position: absolute; right: -38px; bottom: -48px; width: 130px; height: 130px; border-radius: 50%; background: var(--yellow); }
.next-class > * { position: relative; z-index: 1; }
.next-class .badge { color: var(--ink); background: var(--yellow); }
.next-class h3 { margin: 26px 0 7px; font-size: var(--text-2xl); }
.next-class p { color: oklch(0.82 0.01 258); }
.quick-panel { background: var(--surface-alt); }

.page-intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.page-intro h2 { margin-bottom: 7px; }
.page-intro p { max-width: 62ch; margin-bottom: 0; }
.split-workspace { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr); gap: 18px; }
.side-form { align-self: start; }
.student-summary { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; }
.student-summary p { margin: 3px 0 0; font-size: var(--text-xs); }
.student-summary strong { font-size: var(--text-sm); }
.student-insight { display: flex; align-items: center; justify-content: space-between; gap: 10px; }

.calendar-timeline { display: grid; gap: 0; border-top: 1px solid var(--line); }
.calendar-slot { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.calendar-slot time { color: var(--blue-strong); font-size: var(--text-sm); font-weight: 800; }
.calendar-slot h3 { margin: 0 0 4px; font-size: var(--text-base); }
.calendar-slot p { margin: 0; font-size: var(--text-sm); }
.timeline-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }

.level-board { display: grid; grid-template-columns: repeat(4, minmax(210px, 1fr)); gap: 12px; overflow-x: auto; }
.level-column { min-width: 210px; padding: 16px; border-top: 4px solid var(--blue); background: var(--surface); }
.level-column:nth-child(2) { border-top-color: oklch(0.58 0.12 255); }
.level-column:nth-child(3) { border-top-color: var(--yellow-strong); }
.level-column:nth-child(4) { border-top-color: var(--ink); }
.level-column h3 { margin-bottom: 4px; }
.level-column > p { min-height: 64px; font-size: var(--text-sm); }
.classroom-chip { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 0; border-top: 1px solid var(--line); font-size: var(--text-sm); }

.campus-main { padding: clamp(22px, 4vw, 50px); }
.campus-hero { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.campus-hero h1 { margin-bottom: 8px; font-size: clamp(1.8rem, 3vw, 2.7rem); }
.campus-hero p { margin-bottom: 0; }
.student-switcher { display: grid; min-width: min(100%, 290px); gap: 6px; }
.campus-overview { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr); gap: 18px; }
.campus-primary { display: grid; gap: 18px; }
.campus-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.campus-stat { padding: 15px; border-top: 3px solid var(--blue); background: var(--surface); }
.campus-stat:nth-child(2) { border-top-color: var(--yellow-strong); }
.campus-stat:nth-child(3) { border-top-color: var(--green); }
.campus-stat span { display: block; color: var(--muted); font-size: var(--text-xs); font-weight: 750; }
.campus-stat strong { display: block; margin-top: 8px; font-size: var(--text-lg); }
.campus-message { padding: 22px; color: var(--surface); background: var(--blue); }
.campus-message h2, .campus-message p { color: inherit; }
.campus-message p { opacity: 0.85; }
.campus-nav-mobile { display: none; }
