:root {
  color-scheme: dark;
  --ink: #121216;
  --paper: #f5f1e9;
  --cream: #e7dfd2;
  --muted: #aaa59f;
  --red: #b61e2c;
  --gold: #c9a15b;
  --line: rgba(245, 241, 233, 0.16);
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--ink); }
body { min-width: 320px; min-height: 100vh; margin: 0; color: var(--paper); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(circle at 88% 8%, rgba(182, 30, 44, 0.23), transparent 27rem), linear-gradient(135deg, #121216 0%, #171116 55%, #100f13 100%); }
.portal-shell { min-height: 100vh; display: grid; place-items: center; padding: clamp(1.25rem, 4vw, 3.5rem); }
.portal-card { width: min(1000px, 100%); overflow: hidden; border: 1px solid rgba(245, 241, 233, 0.19); border-radius: 1.5rem; background: rgba(18, 18, 22, 0.91); box-shadow: 0 32px 100px rgba(0, 0, 0, 0.38); }
.portal-header { padding: 1.35rem clamp(1.5rem, 4vw, 3.4rem); border-bottom: 1px solid var(--line); }
.brand-lockup { display: flex; align-items: center; gap: 1rem; }
.logo-disc { width: 4rem; height: 4rem; flex: 0 0 auto; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(201, 161, 91, 0.6); border-radius: 50%; background: var(--paper); box-shadow: 0 0 0 0.35rem rgba(182, 30, 44, 0.1); }
.logo-disc img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.eyebrow, .portal-footer, .status-label { margin: 0; color: var(--gold); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.67rem; line-height: 1.45; letter-spacing: 0.14em; text-transform: uppercase; }
h1, h2, h3 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -0.045em; }
h1 { margin-top: 0.12rem; font-size: clamp(1.28rem, 2.3vw, 1.7rem); }
.welcome-panel { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, 0.75fr); gap: clamp(2rem, 7vw, 6rem); align-items: center; padding: clamp(2.6rem, 6vw, 5rem) clamp(1.5rem, 5vw, 4.8rem) clamp(2.3rem, 5vw, 4.4rem); }
.welcome-copy { max-width: 600px; }
h2 { margin: 0.75rem 0 1.35rem; font-size: clamp(2.45rem, 5vw, 4.6rem); line-height: 0.95; }
h2 em { color: var(--red); font-style: italic; }
.welcome-copy > p:last-child { max-width: 560px; margin: 0; color: var(--cream); font-size: 1rem; line-height: 1.72; }
.logo-showcase { width: min(100%, 15rem); justify-self: end; display: grid; place-items: center; border: 1px solid rgba(201, 161, 91, 0.45); border-radius: 50%; aspect-ratio: 1; background: var(--paper); box-shadow: 0 0 0 1.05rem rgba(182, 30, 44, 0.15), 1.25rem 1.25rem 0 rgba(182, 30, 44, 0.25); }
.logo-showcase img { width: 89%; height: 89%; object-fit: contain; mix-blend-mode: multiply; }
.setup-grid { display: grid; grid-template-columns: 1.06fr 0.94fr; margin: 0 clamp(1.5rem, 5vw, 4.8rem); border: 1px solid var(--line); }
.setup-card { min-height: 202px; padding: clamp(1.45rem, 3vw, 2.2rem); background: rgba(255, 255, 255, 0.025); }
.setup-card--primary { border-right: 1px solid var(--line); }
h3 { margin: 0.5rem 0 0.7rem; font-size: clamp(1.6rem, 2.8vw, 2.25rem); }
.setup-card p:not(.eyebrow) { max-width: 360px; margin: 0; color: var(--cream); line-height: 1.55; }
.progress-line { height: 2px; max-width: 250px; margin: 1.45rem 0 0.55rem; overflow: hidden; background: rgba(245, 241, 233, 0.15); }
.progress-line span { display: block; width: 27%; height: 100%; background: var(--gold); }
.microcopy { color: var(--muted) !important; font-size: 0.78rem; }
.capability-list { display: grid; gap: 1rem; margin: 1.15rem 0 0; padding: 0; list-style: none; color: var(--cream); font-size: 0.94rem; }
.capability-list li { display: flex; align-items: center; gap: 0.8rem; }
.capability-list span { color: var(--gold); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.7rem; }
.status-strip { display: grid; grid-template-columns: 165px 1fr; align-items: center; gap: 2rem; margin: 0 clamp(1.5rem, 5vw, 4.8rem); padding: 1.5rem 0; border-bottom: 1px solid var(--line); }
dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 0; }
dl div { min-width: 0; }
dt { color: var(--muted); font-size: 0.78rem; }
dd { margin: 0.32rem 0 0; color: var(--paper); font-size: 0.82rem; font-weight: 650; line-height: 1.35; }
dd::before { content: ""; display: inline-block; width: 0.4rem; height: 0.4rem; margin-right: 0.4rem; border-radius: 50%; background: var(--red); vertical-align: 0.05em; }
.portal-footer { display: flex; justify-content: space-between; gap: 1rem; padding: 1.4rem clamp(1.5rem, 5vw, 4.8rem) 1.65rem; color: var(--muted); letter-spacing: 0.1em; }
.sign-in-action, .login-form button, .dashboard-account button { min-height: 2.85rem; border: 1px solid rgba(201, 161, 91, 0.65); border-radius: 0.45rem; padding: 0.65rem 1rem; color: #1b1414; background: var(--gold); font-weight: 750; cursor: pointer; transition: transform 150ms cubic-bezier(0.23, 1, 0.32, 1), filter 150ms cubic-bezier(0.23, 1, 0.32, 1); }
.sign-in-action { margin-top: 1.25rem; }
.sign-in-action:active, .login-form button:active, .dashboard-account button:active { transform: scale(0.97); }
.login-form { display: grid; max-width: 360px; gap: 0.45rem; margin-top: 1.25rem; }
.login-form label { margin-top: 0.35rem; color: var(--cream); font-size: 0.78rem; font-weight: 700; }
.login-form input { min-height: 2.7rem; border: 1px solid rgba(245, 241, 233, 0.23); border-radius: 0.4rem; padding: 0.55rem 0.7rem; color: var(--paper); background: rgba(255, 255, 255, 0.045); }
.login-form button { margin-top: 0.55rem; }
.login-form button:disabled { cursor: wait; opacity: 0.68; }
.login-message { min-height: 1.3rem; margin: 0.5rem 0 0; color: var(--cream); font-size: 0.8rem; }
.dashboard-body { min-height: 100vh; margin: 0; color: var(--paper); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(circle at 90% 5%, rgba(182, 30, 44, 0.24), transparent 28rem), #121216; }
.dashboard-shell { width: min(1180px, 100%); min-height: 100vh; margin: 0 auto; padding: clamp(1.1rem, 3vw, 2.5rem); }
.dashboard-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line); }
.dashboard-brand { display: flex; align-items: center; gap: 0.7rem; color: inherit; text-decoration: none; }
.dashboard-logo { width: 2.7rem; height: 2.7rem; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: var(--paper); }
.dashboard-logo img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.dashboard-brand small { display: block; color: var(--gold); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.63rem; letter-spacing: 0.12em; text-transform: uppercase; }
.dashboard-brand strong { display: block; margin-top: 0.2rem; font-family: Georgia, "Times New Roman", serif; font-weight: 500; }
.quick-teacher-card { border-top: 3px solid var(--gold); }.one-time-password { display: block; margin: 8px 0 5px; padding: 9px 10px; overflow-wrap: anywhere; color: #273b52; border: 1px dashed #c69b42; border-radius: 6px; background: #fff8df; font-size: .86rem; font-weight: 700; }.login-message small { display: block; margin-top: 4px; color: #657589; font-size: .72rem; }.advanced-staff-details { max-width: 680px; margin: 0 auto 45px; padding: 14px 17px; color: #4d6279; border: 1px solid #dbe4ed; border-radius: 8px; background: #fff; font-size: .82rem; }.advanced-staff-details summary { cursor: pointer; color: #263f5c; font-weight: 700; }.advanced-staff-details p { margin: 10px 0 0; line-height: 1.5; }
.dashboard-account { display: flex; align-items: center; gap: 0.8rem; color: var(--cream); font-size: 0.86rem; }
.dashboard-account button { min-height: 2.3rem; padding: 0.45rem 0.7rem; background: transparent; color: var(--gold); }
.dashboard-hero { max-width: 720px; padding: clamp(3rem, 8vw, 7rem) 0 clamp(2rem, 5vw, 4rem); }
.dashboard-hero h1 { margin: 0.7rem 0 1rem; font-size: clamp(2.5rem, 6vw, 5rem); line-height: 0.95; }
.dashboard-hero > p:last-child { max-width: 600px; color: var(--cream); line-height: 1.7; }
.module-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; border: 1px solid var(--line); background: var(--line); }
.module-card { min-height: 205px; padding: 1.55rem; background: #15151a; }
.module-grid a { color: inherit; text-decoration: none; }
.module-card--available { background: linear-gradient(135deg, rgba(182, 30, 44, 0.25), #18141a); }
.module-index { color: var(--gold); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.68rem; }
.module-card h2 { margin: 1rem 0 0.7rem; font-size: 1.6rem; }
.module-card p { min-height: 3.2rem; color: var(--cream); font-size: 0.9rem; line-height: 1.55; }
.module-state { color: var(--muted); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.67rem; text-transform: uppercase; letter-spacing: 0.1em; }
.module-nav { display: flex; gap: 1rem; margin-left: auto; }
.module-nav a { color: var(--muted); font-size: 0.86rem; text-decoration: none; }
.module-nav a[aria-current="page"] { color: var(--gold); }
.page-title { max-width: 680px; padding: 3.2rem 0 2.25rem; }
.page-title h1 { margin: 0.65rem 0 0.8rem; font-size: clamp(2.6rem, 5vw, 4.6rem); line-height: 0.95; }
.page-title > p:last-child, .panel-copy { color: var(--cream); line-height: 1.65; }
.operations-grid { display: grid; grid-template-columns: 1.12fr 0.88fr; gap: 1.2rem; }
.operations-card, .directory-section { border: 1px solid var(--line); padding: clamp(1.35rem, 3vw, 2rem); background: rgba(255,255,255,0.025); }
.operations-card h2, .directory-section h2 { font-size: 1.7rem; }
.field-form { display: grid; gap: 0.75rem; margin-top: 1.2rem; }
.field-form label { display: grid; gap: 0.35rem; color: var(--cream); font-size: 0.82rem; }
.field-form input, .inline-form input, .directory-heading input, .kiosk-field input, .kiosk-field select { width: 100%; min-height: 2.75rem; border: 1px solid rgba(245,241,233,0.24); border-radius: 0.38rem; padding: 0.6rem 0.7rem; color: var(--paper); background: rgba(255,255,255,0.04); }
.two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
.field-note { color: var(--muted); font-weight: 400; }
.field-form button, .inline-form button { min-height: 2.8rem; border: 0; border-radius: 0.38rem; color: #1b1414; background: var(--gold); font-weight: 750; cursor: pointer; }
.inline-form { display: flex; gap: 0.55rem; margin-top: 1rem; }
.inline-form button { min-width: 4rem; }
.simple-list { display: grid; gap: 0.7rem; margin: 1.2rem 0 0; padding: 0; list-style: none; color: var(--cream); }
.simple-list li { border-bottom: 1px solid var(--line); padding-bottom: 0.7rem; }
.directory-section { margin-top: 1.2rem; }
.directory-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; }
.directory-heading input { max-width: 300px; }
.student-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 1.5rem; background: var(--line); border: 1px solid var(--line); }
.student-row { min-height: 82px; padding: 1rem; background: #17171c; }
.student-row strong, .student-row span { display: block; }
.student-row span, .empty-note { margin: 0.35rem 0 0; color: var(--muted); font-size: 0.8rem; line-height: 1.5; }
.kiosk-body { min-height: 100vh; margin: 0; color: var(--paper); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(circle at 50% -10%, rgba(182,30,44,0.3), transparent 34rem), #121216; }
.kiosk-shell { width: min(850px, 100%); min-height: 100vh; margin: 0 auto; padding: clamp(1.2rem, 4vw, 3rem); }
.kiosk-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--line); }
.kiosk-label { color: var(--gold); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.67rem; letter-spacing: 0.12em; text-transform: uppercase; }
.kiosk-panel { max-width: 680px; margin: clamp(2rem, 7vw, 5rem) auto; text-align: center; }
.kiosk-symbol { display: grid; place-items: center; width: 4rem; height: 4rem; margin: 0 auto 1rem; border: 1px solid rgba(201,161,91,0.6); border-radius: 50%; color: var(--gold); font-size: 1.6rem; }
.kiosk-panel h1 { margin: 0.7rem 0 1rem; font-size: clamp(2.5rem, 7vw, 4.8rem); line-height: 0.95; }
.kiosk-panel > p { max-width: 460px; margin: 0 auto; color: var(--cream); line-height: 1.6; }
#unlock-form { display: grid; grid-template-columns: 1fr auto; max-width: 390px; gap: 0.65rem; margin: 2rem auto 0; }
#unlock-form input { text-align: center; letter-spacing: 0.25em; font-size: 1.25rem; }
#unlock-form button, .kiosk-student { min-height: 2.75rem; border: 0; border-radius: 0.4rem; padding: 0.6rem 1rem; color: #1b1414; background: var(--gold); font-weight: 750; cursor: pointer; }
.kiosk-field { display: grid; max-width: 520px; gap: 0.5rem; margin: 1.3rem auto 0; text-align: left; color: var(--cream); font-size: 0.85rem; font-weight: 650; }
.kiosk-results { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.65rem; max-width: 650px; margin: 1.1rem auto 0; }
.kiosk-student { display: grid; min-height: 5.5rem; align-content: center; gap: 0.3rem; color: var(--paper); text-align: left; background: #1b1b20; border: 1px solid rgba(245,241,233,0.14); }
.kiosk-student span { color: var(--gold); font-size: 0.75rem; }
.kiosk-message { min-height: 2rem; margin: 1.5rem auto; color: var(--cream); line-height: 1.5; }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-bottom: 1.2rem; overflow: hidden; border: 1px solid var(--line); background: var(--line); }
.stat-grid article { padding: 1.35rem; background: #17171c; }
.stat-grid span, .stat-grid small { display: block; color: var(--muted); font-size: 0.75rem; line-height: 1.45; }
.stat-grid strong { display: block; margin: 0.4rem 0; color: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 2.25rem; font-weight: 500; }
.report-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.report-list { display: grid; gap: 0.1rem; max-height: 430px; margin-top: 1rem; overflow: auto; border-top: 1px solid var(--line); }
.report-row { display: grid; gap: 0.2rem; padding: 0.95rem 0.1rem; border-bottom: 1px solid var(--line); }
.report-row span, .simple-list span { color: var(--muted); font-size: 0.78rem; line-height: 1.45; }
.catalog-section { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-top: 3.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--line); }
.catalog-section h2 { margin: 0.55rem 0; font-size: clamp(2rem, 4vw, 3.2rem); }
.catalog-section p { max-width: 720px; color: var(--cream); line-height: 1.6; }
.payments-off { flex: none; border: 1px solid rgba(201,161,91,0.55); border-radius: 999px; padding: 0.5rem 0.8rem; color: var(--gold); font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; margin: 1.2rem 0 3rem; }
.catalog-form { display: grid; gap: 0.65rem; margin-top: 1rem; }
.catalog-form input { width: 100%; min-height: 2.7rem; border: 1px solid rgba(245,241,233,0.24); border-radius: 0.38rem; padding: 0.6rem 0.7rem; color: var(--paper); background: rgba(255,255,255,0.04); }
.catalog-form button { min-height: 2.8rem; border: 0; border-radius: 0.38rem; color: #1b1414; background: var(--gold); font-weight: 750; cursor: pointer; }

@media (max-width: 720px) {
  .portal-shell { display: block; padding: 0; }
  .portal-card { min-height: 100vh; border: 0; border-radius: 0; }
  .portal-header { padding: 1.35rem 1.45rem; }
  .logo-disc { width: 3.55rem; height: 3.55rem; }
  .welcome-panel { grid-template-columns: 1fr; gap: 1.7rem; padding: 2.5rem 1.45rem 2.2rem; }
  .logo-showcase { width: 10rem; justify-self: start; order: -1; box-shadow: 0 0 0 0.65rem rgba(182, 30, 44, 0.15), 0.8rem 0.8rem 0 rgba(182, 30, 44, 0.25); }
  h2 { font-size: clamp(2.35rem, 11vw, 3.25rem); }
  .welcome-copy > p:last-child { font-size: 1rem; }
  .setup-grid { grid-template-columns: 1fr; margin: 0 1.45rem; }
  .setup-card { min-height: auto; padding: 1.5rem; }
  .setup-card--primary { border-right: 0; border-bottom: 1px solid var(--line); }
  .status-strip { grid-template-columns: 1fr; gap: 0.9rem; margin: 0 1.45rem; padding: 1.6rem 0; }
  dl { grid-template-columns: 1fr; gap: 0.9rem; }
  dl div { display: flex; justify-content: space-between; gap: 1rem; }
  dd { margin: 0; text-align: right; max-width: 66%; }
  .portal-footer { flex-direction: column; align-items: flex-start; padding: 1.4rem 1.45rem 2rem; }
  .dashboard-header { align-items: flex-start; }
  .dashboard-account { align-items: flex-end; flex-direction: column; }
  .module-grid { grid-template-columns: 1fr; }
  .module-card { min-height: 170px; }
  .module-nav { display: none; }
  .operations-grid { grid-template-columns: 1fr; }
  .two-fields, .student-list { grid-template-columns: 1fr; }
  .stat-grid, .report-grid, .catalog-grid { grid-template-columns: 1fr; }
  .catalog-section { align-items: flex-start; flex-direction: column; gap: 0.8rem; }
  .directory-heading { align-items: stretch; flex-direction: column; }
  .directory-heading input { max-width: none; }
  #unlock-form { grid-template-columns: 1fr; }
  .kiosk-results { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: no-preference) {
  .portal-card { animation: appear 380ms cubic-bezier(0.23, 1, 0.32, 1) both; }
}
@keyframes appear { from { opacity: 0; transform: translateY(12px) scale(0.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* White Tiger’s independently implemented Class Management shell follows the familiar Gables staff layout. */
.academy-app-body { min-width: 320px; min-height: 100vh; margin: 0; color: #f7f9ff; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #f7f8fb; }
.academy-app { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: 100vh; }
.academy-sidebar { display: flex; flex-direction: column; min-height: 100vh; padding: 22px 16px; color: #d7e1ef; background: #04131f; }
.sidebar-wordmark { display: flex; align-items: center; gap: 10px; padding: 0 8px 24px; color: #9facbd; font-size: 0.78rem; letter-spacing: 0.12em; }.sidebar-wordmark > span { min-width: 0; }.sidebar-wordmark small,.sidebar-wordmark strong { display: block; }.sidebar-wordmark small { color: #b99445; font-size: .55rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }.sidebar-wordmark strong { overflow: hidden; color: #f0f4f8; font-family: Georgia,"Times New Roman",serif; font-size: .93rem; font-weight: 500; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }.sidebar-academy-logo { width: 2.55rem; height: 2.55rem; flex: none; border-radius: 50%; background: #fff; object-fit: contain; padding: 2px; }
.academy-identity-lock { margin: -15px 8px 16px; padding: 8px 9px; color: #f8dfa0; border: 1px solid rgba(208,165,75,.45); border-radius: 5px; background: rgba(208,165,75,.08); font-size: .56rem; font-weight: 700; letter-spacing: .08em; line-height: 1.35; }.academy-workspace-badge { margin-left: auto; padding: 6px 9px; color: #f8dfa0; border: 1px solid rgba(208,165,75,.5); border-radius: 999px; background: rgba(208,165,75,.1); font-size: .65rem; font-weight: 700; letter-spacing: .05em; white-space: nowrap; }
.sidebar-mark { color: #8397ae; font-size: 1.15rem; }.sidebar-label { margin: 0 0 8px; padding: 0 8px; color: #53677d; font-size: 0.67rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.sidebar-link { display: flex; align-items: center; width: 100%; gap: 11px; margin: 1px 0; border: 0; border-radius: 6px; padding: 9px 10px; color: #d8e3f0; background: transparent; font: inherit; font-size: 0.89rem; text-align: left; text-decoration: none; cursor: pointer; }.sidebar-link span { width: 15px; color: #aec0d3; text-align: center; }.sidebar-link:hover { background: #0e2a3e; color: #fff; }.sidebar-link.active { color: #fff; background: #083049; box-shadow: inset 3px 0 0 #1591b7; }.sidebar-link-button { appearance: none; }
.sidebar-rule { height: 1px; margin: 10px -16px 22px; background: #173044; }.sidebar-account { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 18px 0 0; border-top: 1px solid #173044; }.account-avatar { display: grid; width: 34px; height: 34px; place-items: center; overflow: hidden; border: 1px solid #e3c56d; border-radius: 50%; color: #162a3c; background: #f4f5f6; font-size: 0.72rem; font-weight: 800; }.sidebar-account strong, .sidebar-account small { display: block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.sidebar-account strong { color: #dfe9f6; font-size: 0.85rem; }.sidebar-account small { margin-top: 3px; color: #74889d; font-size: 0.68rem; }
.academy-workspace { min-width: 0; background: #0d2346; }.academy-topbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px 14px; border-bottom: 1px solid #20436c; color: #fff; }.academy-topbar h1 { font-family: Georgia, "Times New Roman", serif; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.025em; }.academy-topbar p { margin: 5px 0 0; color: #98acc5; font-size: 0.88rem; }.intelligence-button { border: 1px solid rgba(214,184,70,0.44); border-radius: 8px; padding: 10px 14px; color: #e2c55b; background: rgba(210,182,72,0.09); font-size: 0.86rem; font-weight: 700; cursor: pointer; }
.class-tabs { display: flex; gap: 5px; overflow-x: auto; padding: 12px 24px 0; background: #0d2346; scrollbar-width: thin; }.class-tab { flex: none; border: 0; border-radius: 7px 7px 0 0; padding: 10px 13px; color: #9bb0ca; background: transparent; font: inherit; font-size: 0.85rem; text-decoration: none; cursor: pointer; }.class-tab:hover { color: #fff; background: #173b67; }.class-tab.active { color: #fff; background: #bd9709; font-weight: 700; }
.calendar-workspace { min-height: calc(100vh - 143px); padding: 12px 24px 32px; background: #fff; color: #25324a; }.calendar-date-row { display: flex; align-items: center; gap: 13px; min-height: 43px; }.calendar-date-row h2 { margin: 0 0 0 8px; color: #162845; font-family: Georgia, "Times New Roman", serif; font-size: 1rem; font-weight: 700; letter-spacing: 0; }.gold-button, .date-arrow { border: 0; cursor: pointer; }.gold-button { border-radius: 7px; padding: 10px 16px; color: #312506; background: #d0aa08; font-size: 0.9rem; font-weight: 750; }.date-arrow { width: 28px; height: 30px; color: #526277; background: transparent; font-size: 1.8rem; line-height: 1; }.calendar-tools { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; padding: 12px 0; }.tool-group { display: flex; overflow: hidden; border: 1px solid #e2e6eb; border-radius: 7px; }.segment { border: 0; border-right: 1px solid #e2e6eb; padding: 8px 12px; color: #68758a; background: #fbfbfc; font: inherit; font-size: 0.78rem; cursor: pointer; }.segment:last-child { border-right: 0; }.segment.active { color: #fff; background: #c79f09; font-weight: 700; }.segment-blue.active { background: #2156d5; }.tool-spacer { flex: 1; min-width: 5px; }.calendar-action { border: 0; border-radius: 7px; padding: 9px 12px; color: #fff; font: inherit; font-size: 0.82rem; font-weight: 700; text-decoration: none; cursor: pointer; }.action-gold { background: #c79f09; }.action-purple { background: #833ce8; }.action-green { background: #17ad7b; }.action-blue { background: #5c5eea; }
.calendar-grid { display: grid; grid-template-columns: 60px repeat(2, minmax(230px, 1fr)); min-height: 510px; overflow: auto; border: 1px solid #d7dde6; background: #d7dde6; }.time-axis { display: grid; grid-template-rows: 80px repeat(6, 82px); gap: 1px; background: #e9edf3; }.time-axis span { align-self: start; padding: 9px 6px; color: #68758a; background: #f8fafc; font-size: 0.7rem; font-weight: 600; white-space: nowrap; }.time-axis span:first-child { color: transparent; }.calendar-column { display: grid; grid-template-rows: 80px 1fr; min-width: 250px; background: #fff; }.calendar-column header { padding: 18px 14px 10px; color: #23304a; text-align: center; background: #fff; }.calendar-column header strong, .calendar-column header small { display: block; }.calendar-column header strong { font-size: 0.88rem; }.calendar-column header small { margin-top: 3px; color: #9ba8b7; font-size: 0.72rem; }.dot { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 50%; }.dot-gold { background: #efb600; }.dot-blue { background: #5289e7; }.calendar-empty { display: grid; min-height: 430px; place-items: center; border-top: 1px solid #d7dde6; color: #6b7891; background: repeating-linear-gradient(to bottom, #f7f9fc 0, #f7f9fc 81px, #d8dfe7 82px); font-size: 0.85rem; line-height: 1.5; text-align: center; }.toast-message { position: fixed; right: 22px; bottom: 22px; z-index: 20; max-width: 360px; border: 1px solid #365780; border-radius: 8px; padding: 13px 15px; color: #eef7ff; background: #092747; box-shadow: 0 14px 34px rgba(0,0,0,.25); font-size: 0.84rem; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity 160ms ease-out, transform 160ms ease-out; }.toast-message.show { opacity: 1; transform: translateY(0); }
@media (max-width: 900px) { .academy-app { grid-template-columns: 1fr; }.academy-sidebar { position: sticky; top: 0; z-index: 10; min-height: auto; padding: 9px 13px; flex-direction: row; align-items: center; gap: 8px; overflow-x: auto; border-bottom: 1px solid #173044; }.sidebar-wordmark { flex: none; padding: 0 6px 0 0; }.sidebar-wordmark strong,.sidebar-wordmark small, .academy-identity-lock, .sidebar-label, .sidebar-rule, .sidebar-account { display: none; }.sidebar-academy-logo { width: 2.25rem; height: 2.25rem; }.sidebar-link { flex: none; width: auto; padding: 8px 9px; font-size: 0.77rem; }.sidebar-link span { display: none; }.academy-topbar { padding: 16px; }.academy-topbar h1 { font-size: 1.35rem; }.academy-topbar p { font-size: 0.75rem; }.intelligence-button { display: none; }.class-tabs { padding: 10px 12px 0; }.calendar-workspace { padding: 10px 12px 24px; }.tool-spacer { display: none; }.calendar-grid { grid-template-columns: 50px repeat(2, 270px); }.calendar-tools { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 10px; }.calendar-action, .segment { white-space: nowrap; }.academy-workspace-badge { display: none; }.toast-message { right: 12px; bottom: 12px; left: 12px; max-width: none; } }

.staff-time-page { min-height: calc(100vh - 140px); padding: 24px; color: #eef4ff; background: #f6f8fb; }.employee-panel, .payroll-panel { margin-bottom: 24px; border: 1px solid #1e3a5f; border-radius: 14px; padding: 20px; color: #f4f7ff; background: #0d2346; }.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }.mini-label { margin: 0 0 5px; color: #bea22e; font-size: 0.7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.panel-heading h2 { color: #fff; font-family: system-ui, sans-serif; font-size: 1.03rem; font-weight: 750; letter-spacing: 0; }.soft-button, .outline-button { border: 1px solid #31547d; border-radius: 7px; padding: 9px 12px; color: #c6d6e8; background: #17385f; font: inherit; font-size: .82rem; font-weight: 650; cursor: pointer; }.soft-button:hover { color: #fff; background: #24507c; }.hidden-form { display: none; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; padding-top: 18px; border-top: 1px solid #274b76; }.hidden-form.is-open { display: grid; }.hidden-form label, .filter-row label { display: grid; gap: 5px; color: #a7bad0; font-size: .72rem; font-weight: 750; letter-spacing: .03em; text-transform: uppercase; }.hidden-form label span { color: #7890aa; font-weight: 500; text-transform: none; }.hidden-form input, .hidden-form select, .filter-row input, .filter-row select { min-width: 0; min-height: 38px; border: 1px solid #34567d; border-radius: 6px; padding: 8px; color: #fff; background: #112d55; font: inherit; font-size: .86rem; }.form-actions { display: flex; align-items: end; gap: 8px; }.employee-list { display: grid; gap: 9px; margin-top: 18px; }.employee-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid #29496d; border-radius: 10px; padding: 14px; background: rgba(24,57,97,.55); }.employee-row.is-clocked-in { border-color: #238a63; background: rgba(12,110,70,.2); }.employee-name { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }.employee-name i { width: 8px; height: 8px; border-radius: 50%; background: #7e96b1; }.is-clocked-in .employee-name i { background: #45d58e; }.employee-name strong { color: #fff; font-size: .91rem; }.employee-name span, .employee-row p { color: #a1b4cb; font-size: .78rem; }.employee-row p { margin: 5px 0 0 17px; }.employee-row p b { margin-left: 8px; color: #52d996; font-weight: 600; }.clock-in, .clock-out { flex: none; border: 0; border-radius: 7px; padding: 10px 14px; color: #fff; font: inherit; font-size: .82rem; font-weight: 750; cursor: pointer; }.clock-in { background: #21895f; }.clock-out { background: #bd4545; }.clock-in:disabled, .clock-out:disabled { cursor: wait; opacity: .65; }.compact-actions { display: flex; gap: 8px; }.filter-row { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 12px; margin: 18px 0; padding: 14px; border-radius: 8px; background: #122e55; }.filter-row .gold-button { align-self: end; min-height: 38px; }.payroll-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }.payroll-stats article { border-radius: 10px; padding: 14px; background: #132f57; }.payroll-stats span { display: block; color: #a4b7ce; font-size: .77rem; }.payroll-stats strong { display: block; margin-top: 6px; color: #fff; font-size: 1.45rem; }.employee-report-list { margin-top: 18px; }.payroll-row { display: grid; grid-template-columns: minmax(0, 1fr) 120px 130px; gap: 12px; align-items: center; border-radius: 10px; padding: 14px; color: #fff; background: #132f57; }.payroll-row div:nth-child(n+2) { text-align: right; }.payroll-row strong, .payroll-row span { display: block; }.payroll-row span { color: #a4b7ce; font-size: .75rem; }.payroll-row strong { margin-top: 3px; font-size: .9rem; }.payroll-row .earnings, .grand-total b { color: #43d98e; }.grand-total { display: grid; grid-template-columns: minmax(0, 1fr) 120px 130px; gap: 12px; align-items: center; margin-top: 10px; border: 1px solid rgba(199,159,9,.5); border-radius: 10px; padding: 14px; color: #c9a63d; background: #fffdf5; }.grand-total span, .grand-total b { text-align: right; }.grand-total b { font-size: 1.1rem; }
@media (max-width: 720px) { .staff-time-page { padding: 12px; }.employee-panel, .payroll-panel { padding: 15px; }.hidden-form, .filter-row { grid-template-columns: 1fr; }.form-actions { min-height: 42px; }.payroll-stats { grid-template-columns: 1fr; }.payroll-row, .grand-total { grid-template-columns: 1fr; gap: 4px; }.payroll-row div:nth-child(n+2), .grand-total span, .grand-total b { text-align: left; }.compact-actions { display: none; }.employee-row { align-items: flex-start; flex-direction: column; }.clock-in, .clock-out { width: 100%; } }

.student-manager { display: grid; grid-template-columns: minmax(285px, .76fr) minmax(420px, 1.24fr); min-height: calc(100vh - 143px); color: #26364d; background: #f5f7fb; }.student-directory-pane { padding: 20px; border-right: 1px solid #d7dee8; background: #fff; }.student-pane-heading, .profile-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.student-pane-heading h2, .profile-heading h2 { margin: 0; color: #102749; font-family: Georgia, "Times New Roman", serif; font-size: 1.46rem; letter-spacing: -.03em; }.student-search-field { display: flex; align-items: center; gap: 8px; margin: 17px 0 12px; border: 1px solid #d3dce8; border-radius: 7px; padding: 0 11px; color: #778aa1; background: #f8fafc; }.student-search-field input { width: 100%; min-height: 40px; border: 0; outline: 0; color: #193251; background: transparent; font: inherit; font-size: .84rem; }.student-list-gables { display: grid; max-height: calc(100vh - 270px); overflow: auto; border-top: 1px solid #edf1f5; }.student-list-item { display: grid; grid-template-columns: 36px minmax(0, 1fr) 12px; align-items: center; gap: 10px; width: 100%; border: 0; border-bottom: 1px solid #edf1f5; padding: 12px 5px; color: #273954; background: transparent; text-align: left; cursor: pointer; }.student-list-item:hover, .student-list-item.selected { background: #edf4fa; }.student-list-item strong, .student-list-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.student-list-item strong { color: #18355a; font-size: .86rem; }.student-list-item small { margin-top: 3px; color: #8190a1; font-size: .72rem; }.student-list-item i { color: #96a4b5; font-size: 1.25rem; font-style: normal; }.student-initials { display: grid; width: 33px; height: 33px; place-items: center; border-radius: 50%; color: #1d385a; background: #e6eef7; font-size: .7rem; font-weight: 800; }.student-profile-pane { padding: 30px; background: #f5f7fb; }.student-profile-empty { display: grid; min-height: 400px; place-content: center; justify-items: center; color: #708098; text-align: center; }.student-profile-empty span { display: grid; width: 56px; height: 56px; place-items: center; border-radius: 50%; color: #c79f09; background: #fff6d6; font-size: 1.4rem; }.student-profile-empty h2 { margin: 18px 0 8px; color: #2e4160; font-size: 1.4rem; }.student-profile-empty p { max-width: 330px; margin: 0; line-height: 1.55; }.profile-heading { padding-bottom: 19px; border-bottom: 1px solid #dbe2eb; }.profile-heading h2 { font-size: 2rem; }.status-pill { display: inline-block; margin-top: 7px; border-radius: 99px; padding: 4px 8px; color: #20794f; background: #dff5e9; font-size: .68rem; font-weight: 750; text-transform: capitalize; }.profile-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 22px 0; }.profile-contact article { border: 1px solid #dbe3ed; border-radius: 8px; padding: 12px; background: #fff; }.profile-contact span, .profile-contact strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.profile-contact span { color: #8190a1; font-size: .69rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }.profile-contact strong { margin-top: 6px; color: #1c3557; font-size: .81rem; }.profile-section { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 0; border-top: 1px solid #dbe2eb; }.profile-section h3 { margin: 0; color: #1c3557; font-family: system-ui,sans-serif; font-size: .94rem; font-weight: 750; letter-spacing: 0; }.profile-section p { margin: 5px 0 0; color: #8190a1; font-size: .78rem; }.link-button { display: inline-block; text-decoration: none; }.modal-backdrop { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 16px; background: rgba(2,14,28,.64); }.academy-modal { position: relative; width: min(580px,100%); max-height: calc(100vh - 32px); overflow: auto; border: 1px solid #304f75; border-radius: 13px; padding: 25px; color: #eef5ff; background: #0d2346; box-shadow: 0 22px 60px rgba(0,0,0,.36); }.academy-modal h2 { margin: 4px 0 8px; color: #fff; font-family: Georgia, "Times New Roman",serif; font-size: 2rem; }.academy-modal > p:not(.mini-label) { margin: 0; color: #aabbd0; line-height: 1.55; }.modal-close { position: absolute; top: 12px; right: 14px; border: 0; color: #9fb4cd; background: transparent; font-size: 1.6rem; cursor: pointer; }.student-form { display: grid; gap: 11px; margin-top: 20px; }.student-form label { display: grid; gap: 5px; color: #b1c4d9; font-size: .72rem; font-weight: 750; letter-spacing: .03em; text-transform: uppercase; }.student-form input { min-height: 39px; border: 1px solid #34567d; border-radius: 6px; padding: 8px; color: #fff; background: #112d55; font: inherit; }.form-two { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.form-feedback { min-height: 17px; margin: 0; color: #d9c45d; font-size: .8rem; }.academy-modal .outline-button { color: #d8e5f4; background: transparent; }.academy-modal .gold-button { border: 0; }
@media (max-width: 820px) { .student-manager { grid-template-columns: 1fr; }.student-directory-pane { border-right: 0; border-bottom: 1px solid #d7dee8; }.student-list-gables { max-height: 280px; }.student-profile-pane { padding: 20px 14px; }.profile-heading { align-items: flex-start; flex-direction: column; }.profile-contact, .form-two { grid-template-columns: 1fr; }.profile-section { align-items: flex-start; flex-direction: column; }.profile-section .soft-button { width: 100%; text-align: center; } }

.modal-backdrop[hidden] { display: none !important; }

.profile-section-wide { align-items: flex-start; }
.profile-section > div { min-width: 0; flex: 1; }
.profile-section-title { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.profile-section-title h3 { margin: 0; }
.profile-section-description { margin: 7px 0 10px; color: #718199; font-size: .76rem; line-height: 1.45; }
.profile-history-list { display: grid; gap: 7px; margin-top: 8px; }
.history-row { display: grid; gap: 2px; border: 1px solid #e0e7ef; border-radius: 7px; padding: 8px 10px; background: #fff; }
.history-row strong { color: #244365; font-size: .76rem; text-transform: capitalize; }
.history-row span, .profile-empty-note { color: #788aa0; font-size: .69rem; line-height: 1.4; }
.profile-empty-note { margin: 8px 0 0; }
.rank-badge, .attendance-count, .payment-disabled-badge { border: 1px solid #dcc366; border-radius: 99px; padding: 3px 7px; color: #6f5500; background: #fff5c9; font-size: .63rem; text-transform: capitalize; }
.payment-disabled-badge { border-color: #e3bd8a; color: #87571b; background: #fff0df; letter-spacing: .05em; text-transform: uppercase; }
.profile-action-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
@media (max-width: 820px) { .profile-action-row { width: 100%; } .profile-action-row .soft-button { flex: 1; } }

.calendar-date-input { max-width: 145px; border: 1px solid #d9e0e9; border-radius: 6px; padding: 7px; color: #43556e; background: #fff; font: inherit; font-size: .76rem; }.calendar-events { min-height: 430px; border-top: 1px solid #d7dde6; background: repeating-linear-gradient(to bottom, #f7f9fc 0, #f7f9fc 81px, #d8dfe7 82px); }.calendar-events .calendar-empty { min-height: 430px; border: 0; background: transparent; }.calendar-event { position: relative; z-index: 1; margin: 12px 10px; border-radius: 7px; padding: 9px 10px; color: #152d4d; box-shadow: 0 2px 6px rgba(20,41,72,.1); }.calendar-event time, .calendar-event strong, .calendar-event small { display: block; }.calendar-event time { margin-bottom: 3px; font-size: .68rem; font-weight: 800; }.calendar-event strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }.calendar-event small { margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .7rem; }.calendar-event-group { border-left: 4px solid #568be6; background: #e3eeff; }.calendar-event-private { border-left: 4px solid #d0aa08; background: #fff3c4; }.calendar-event-note { border-left: 4px solid #9d62e8; background: #efe4ff; }.calendar-modal { max-width: 660px; }.calendar-modal #calendar-form-fields { display: grid; gap: 11px; }.calendar-modal select { min-height: 39px; border: 1px solid #34567d; border-radius: 6px; padding: 8px; color: #fff; background: #112d55; font: inherit; }

.inventory-workspace { min-height: 100vh; background: #f5f7fb; color: #1b3557; }.header-actions { display: flex; align-items: center; gap: 10px; }.header-actions .intelligence-button { text-decoration: none; }.inventory-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 20px 24px; background: #0d2346; }.inventory-summary article { border: 1px solid #284c79; border-radius: 10px; padding: 14px; color: #fff; background: #12325c; }.inventory-summary span, .inventory-summary strong, .inventory-summary small { display: block; }.inventory-summary span, .inventory-summary small { color: #aabbd0; font-size: .74rem; }.inventory-summary strong { margin: 5px 0 3px; font-size: 1.5rem; }.inventory-manager { padding: 26px 24px 44px; }.inventory-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }.inventory-heading h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.7rem; }.inventory-heading > p { max-width: 560px; margin: 0; color: #718099; font-size: .83rem; line-height: 1.5; text-align: right; }.inventory-groups { display: grid; gap: 20px; }.inventory-category { overflow: hidden; border: 1px solid #d5dfea; border-radius: 10px; background: #fff; }.inventory-category h3 { margin: 0; padding: 13px 16px; border-bottom: 1px solid #dde5ee; color: #263f60; font-family: system-ui,sans-serif; font-size: .87rem; font-weight: 800; }.inventory-category h3 span { display: inline-grid; min-width: 19px; min-height: 19px; place-items: center; margin-left: 6px; border-radius: 50%; color: #fff; background: #5f7591; font-size: .65rem; }.inventory-table-head, .inventory-table-row { display: grid; grid-template-columns: minmax(160px, 1.8fr) .7fr 1.1fr 110px; gap: 14px; align-items: center; padding: 12px 16px; }.inventory-table-head { color: #8291a4; background: #f7f9fc; font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }.inventory-table-row { border-top: 1px solid #edf1f5; color: #39506e; font-size: .85rem; }.inventory-table-row strong, .inventory-table-row small { display: block; }.inventory-table-row strong { color: #18385d; }.inventory-table-row small { margin-top: 3px; color: #8794a7; font-size: .69rem; }.stock-number { margin-right: 7px; font-weight: 800; }.stock-badge { display: inline-block; border-radius: 99px; padding: 3px 6px; font-size: .65rem; font-weight: 750; }.stock-good { color: #1e7950; background: #dcf4e7; }.stock-low { color: #996b00; background: #fff0c7; }.stock-out { color: #a33d3d; background: #fee3e3; }.stock-adjust, .icon-action { border: 1px solid #d3dfe9; border-radius: 5px; color: #55708f; background: #fff; font: inherit; font-weight: 800; cursor: pointer; }.stock-adjust { width: 24px; height: 23px; margin-left: 5px; }.icon-action { width: 29px; height: 28px; margin-right: 5px; }.remove-action { color: #bd4e4e; }.product-modal { max-width: 620px; }.product-modal select { min-height: 39px; border: 1px solid #34567d; border-radius: 6px; padding: 8px; color: #fff; background: #112d55; font: inherit; }.inventory-empty { min-height: 150px; display: grid; place-items: center; border: 1px dashed #bdcad8; border-radius: 10px; color: #70819a; background: #fff; }
@media (max-width: 800px) { .inventory-summary { grid-template-columns: 1fr 1fr; padding: 14px; }.inventory-manager { padding: 20px 14px; }.inventory-heading { align-items: flex-start; flex-direction: column; }.inventory-heading > p { text-align: left; }.inventory-table-head { display: none; }.inventory-table-row { grid-template-columns: 1fr auto; }.inventory-table-row > div:nth-child(2) { display: none; }.inventory-table-row > div:nth-child(3) { grid-column: 1 / -1; }.inventory-table-row > div:nth-child(4) { grid-column: 2; grid-row: 1; }.header-actions .intelligence-button { display: none; } }

.pos-workspace { min-height: 100vh; background: #f3f6fa; color: #1c3557; }.pos-safety-strip { display: flex; align-items: center; gap: 12px; padding: 11px 24px; color: #485d78; background: #fff9e5; border-bottom: 1px solid #edd88e; font-size: .8rem; }.pos-safety-strip p { margin: 0; }.payments-off { display: inline-block; flex: none; border-radius: 99px; padding: 4px 8px; color: #805d00; background: #ffe5a0; font-size: .66rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }.pos-layout { display: grid; grid-template-columns: minmax(0, 1fr) 350px; gap: 20px; padding: 22px 24px 40px; }.pos-catalog { min-width: 0; }.service-section, .pos-products-section { border: 1px solid #d5dfea; border-radius: 11px; padding: 18px; background: #fff; }.pos-products-section { margin-top: 18px; }.section-title { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-bottom: 14px; }.section-title h2 { margin: 0; font-family: Georgia,"Times New Roman",serif; font-size: 1.35rem; }.section-title > span { color: #946d00; font-size: .72rem; font-weight: 700; }.service-grid, .pos-product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }.service-tile, .pos-product { min-height: 130px; border: 1px solid #d6e1ed; border-radius: 9px; padding: 14px; color: #274566; background: #fbfcfe; text-align: left; cursor: pointer; transition: transform 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out; }.service-tile:hover, .pos-product:hover:not(:disabled) { border-color: #c59d0b; box-shadow: 0 5px 14px rgba(18,49,89,.09); transform: translateY(-1px); }.service-tile i { display: grid; width: 30px; height: 30px; place-items: center; margin-bottom: 13px; border-radius: 7px; color: #ad8c08; background: #fff4c9; font-style: normal; }.service-tile strong, .service-tile small, .pos-product span, .pos-product strong, .pos-product small, .pos-product b { display: block; }.service-tile strong, .pos-product strong { color: #203d60; font-size: .86rem; }.service-tile small, .pos-product small { margin-top: 4px; color: #7f8fa2; font-size: .7rem; }.pos-product { position: relative; min-height: 115px; }.pos-product span { margin-bottom: 9px; color: #a27b00; font-size: .66rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }.pos-product b { position: absolute; right: 13px; bottom: 12px; color: #17734e; font-size: .88rem; }.pos-product.sold-out { opacity: .52; cursor: not-allowed; }.pos-products-empty { grid-column: 1/-1; display: grid; min-height: 125px; place-items: center; border: 1px dashed #bdcad8; border-radius: 8px; color: #74849a; }.pos-cart { align-self: start; position: sticky; top: 18px; min-height: 470px; border: 1px solid #294b76; border-radius: 12px; padding: 18px; color: #eef5ff; background: #0d2346; box-shadow: 0 12px 27px rgba(17,46,83,.13); }.cart-header { display: flex; align-items: center; justify-content: space-between; }.cart-header h2 { margin: 0; color: #fff; font-family: Georgia,"Times New Roman",serif; font-size: 1.4rem; }.text-button { border: 0; color: #afc2d9; background: transparent; font: inherit; font-size: .78rem; cursor: pointer; }.cart-student-label { display: grid; gap: 5px; margin: 18px 0 12px; color: #b5c7db; font-size: .7rem; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }.cart-student-label span { color: #7f98b3; text-transform: none; }.cart-student-label select { min-height: 37px; border: 1px solid #36577f; border-radius: 6px; padding: 7px; color: #fff; background: #112f58; font: inherit; font-size: .8rem; }.cart-items { min-height: 150px; border-top: 1px solid #294c75; border-bottom: 1px solid #294c75; }.cart-empty { display: grid; min-height: 150px; place-items: center; color: #91a8c0; text-align: center; font-size: .82rem; }.cart-empty span { font-size: 1.35rem; }.cart-empty p { max-width: 170px; margin: 0; }.cart-line { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 8px; align-items: center; padding: 12px 0; border-bottom: 1px solid #203f66; }.cart-line:last-child { border-bottom: 0; }.cart-line strong, .cart-line small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.cart-line strong { color: #fff; font-size: .82rem; }.cart-line small { margin-top: 3px; color: #99aec5; font-size: .68rem; }.cart-line-controls { display: flex; align-items: center; gap: 5px; }.cart-line-controls button { width: 22px; height: 22px; border: 1px solid #46688f; border-radius: 4px; color: #dce8f6; background: #15375f; cursor: pointer; }.cart-line-controls span { min-width: 13px; color: #fff; text-align: center; font-size: .76rem; }.cart-line > b { color: #dfc964; font-size: .82rem; }.cart-total { display: flex; justify-content: space-between; align-items: center; padding: 16px 0; }.cart-total span { color: #b7c8da; font-size: .85rem; }.cart-total strong { color: #fff; font-size: 1.45rem; }.pos-draft-button { width: 100%; border: 0; border-radius: 7px; padding: 12px; color: #342708; background: #d4af16; font: inherit; font-size: .88rem; font-weight: 800; cursor: pointer; }.pos-draft-button:disabled { cursor: not-allowed; opacity: .45; }.cart-safety { margin: 12px 0 0; color: #8ea7c1; font-size: .68rem; line-height: 1.5; }.pos-cart .form-feedback { margin: 8px 0 0; }
@media (max-width: 960px) { .pos-layout { grid-template-columns: 1fr; }.pos-cart { position: static; }.service-grid, .pos-product-grid { grid-template-columns: repeat(2,1fr); } }@media (max-width: 560px) { .pos-safety-strip { align-items: flex-start; flex-direction: column; padding: 11px 14px; }.pos-layout { padding: 14px; }.service-grid, .pos-product-grid { grid-template-columns: 1fr; } }

.memberships-workspace { min-height: 100vh; color: #203c5e; background: #f5f7fb; }.membership-safety-strip { display: flex; align-items: center; gap: 12px; padding: 11px 24px; border-bottom: 1px solid #edd88e; color: #485d78; background: #fff9e5; font-size: .8rem; }.membership-safety-strip p { margin: 0; }.membership-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; padding: 20px 24px; color: #fff; background: #0d2346; }.membership-summary article { border: 1px solid #284c79; border-radius: 10px; padding: 14px; background: #12325c; }.membership-summary span, .membership-summary strong, .membership-summary small { display: block; }.membership-summary span, .membership-summary small { color: #aabbd0; font-size: .74rem; }.membership-summary strong { margin: 5px 0 3px; color: #fff; font-size: 1.5rem; }.membership-content { padding: 26px 24px 48px; }.membership-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; }.membership-section-heading h2 { margin: 0; color: #1c385b; font-family: Georgia,"Times New Roman",serif; font-size: 1.6rem; }.enrollment-heading { margin-top: 32px; }.membership-plans { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 16px; }.membership-plan-card { display: flex; flex-direction: column; justify-content: space-between; min-height: 210px; border: 1px solid #d6e0ea; border-top: 4px solid #d0aa08; border-radius: 10px; padding: 18px; background: #fff; box-shadow: 0 3px 8px rgba(23,52,88,.04); }.plan-mark { display: inline-grid; width: 31px; height: 31px; place-items: center; margin-bottom: 8px; border-radius: 7px; color: #947400; background: #fff3c4; }.membership-plan-card h3 { margin: 3px 0 4px; color: #1b395d; font-size: 1.05rem; }.membership-plan-card > div > p:not(.mini-label) { margin: 0; color: #198057; font-size: 1.1rem; font-weight: 800; }.plan-details { padding-top: 12px; border-top: 1px solid #e5ebf1; }.plan-details span, .plan-details strong, .plan-details small { display: block; }.plan-details span { color: #8593a7; font-size: .7rem; }.plan-details strong { margin: 3px 0; color: #2b4669; font-size: .86rem; }.plan-details small { color: #8291a3; font-size: .69rem; line-height: 1.35; }.membership-drafts { overflow: hidden; margin-top: 16px; border: 1px solid #d7e0ea; border-radius: 10px; background: #fff; }.membership-draft-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto minmax(230px, .9fr); align-items: center; gap: 13px; padding: 15px 16px; border-bottom: 1px solid #e8edf3; }.membership-draft-row:last-child { border-bottom: 0; }.draft-avatar { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #284766; background: #e7eff8; font-size: .72rem; font-weight: 800; }.membership-draft-row strong, .membership-draft-row small { display: block; }.membership-draft-row strong { color: #213f62; font-size: .85rem; }.membership-draft-row small { margin-top: 3px; color: #8291a3; font-size: .72rem; }.draft-pill { border-radius: 99px; padding: 4px 8px; color: #946b00; background: #fff1c4; font-size: .67rem; font-weight: 800; text-transform: capitalize; }.membership-draft-row p { margin: 0; color: #7e8ea2; font-size: .73rem; line-height: 1.4; }.membership-empty { grid-column: 1/-1; display: grid; min-height: 145px; place-items: center; border: 1px dashed #bccbda; border-radius: 9px; color: #72839a; background: #fff; }.membership-modal { max-width: 610px; }.membership-modal select { min-height: 39px; border: 1px solid #34567d; border-radius: 6px; padding: 8px; color: #fff; background: #112d55; font: inherit; }
@media (max-width: 900px) { .membership-summary { grid-template-columns: 1fr 1fr; padding: 14px; }.membership-content { padding: 20px 14px 38px; }.membership-plans { grid-template-columns: 1fr; }.membership-draft-row { grid-template-columns: 40px minmax(0,1fr) auto; }.membership-draft-row p { grid-column: 2/-1; }.membership-safety-strip { align-items: flex-start; flex-direction: column; padding: 11px 14px; } }@media (max-width: 520px) { .membership-section-heading { align-items: flex-start; flex-direction: column; }.membership-section-heading .soft-button { width: 100%; }.membership-summary { grid-template-columns: 1fr 1fr; }.header-actions .intelligence-button { display: none; } }

.reports-workspace { min-height: 100vh; color: #203c5e; background: #f4f7fb; }.report-warning { display: flex; align-items: center; gap: 12px; padding: 11px 24px; border-bottom: 1px solid #edd88e; color: #4c607a; background: #fff9e5; font-size: .79rem; }.report-warning p { margin: 0; }.reports-kpis { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; padding: 20px 24px; background: #0d2346; }.reports-kpis article { border: 1px solid #284c79; border-radius: 10px; padding: 14px; color: #fff; background: #12325c; }.reports-kpis span, .reports-kpis strong, .reports-kpis small { display: block; }.reports-kpis span, .reports-kpis small { color: #aabbd0; font-size: .74rem; }.reports-kpis strong { margin: 5px 0 3px; color: #fff; font-size: 1.46rem; }.reports-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 18px; padding: 26px 24px 0; }.report-card { border: 1px solid #d5dfe9; border-radius: 10px; padding: 20px; background: #fff; }.report-card-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; padding-bottom: 15px; border-bottom: 1px solid #e5ebf1; }.report-card-heading h2 { margin: 0; color: #1c385b; font-family: Georgia,"Times New Roman",serif; font-size: 1.3rem; }.report-card-heading > span { color: #7c8ca1; font-size: .72rem; }.metrics-list { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 16px 0 0; border: 1px solid #e1e8ef; background: #e1e8ef; }.metrics-list div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px; background: #fbfcfe; }.metrics-list dt { color: #72839a; font-size: .73rem; }.metrics-list dd { margin: 0; color: #254569; font-size: 1.02rem; font-weight: 800; }.report-explainer { margin: 18px 0; color: #77899f; font-size: .81rem; line-height: 1.55; }.report-explainer a { color: #2365bc; font-weight: 700; }.report-progress { padding: 14px; border-radius: 8px; background: #f1f5f9; }.report-progress > span, .report-progress > strong { display: block; }.report-progress > span { color: #7a899d; font-size: .72rem; }.report-progress > strong { margin: 5px 0 10px; color: #27476b; font-size: .91rem; }.report-progress div { height: 8px; overflow: hidden; border-radius: 99px; background: #dce6ef; }.report-progress i { display: block; height: 100%; border-radius: inherit; background: #cba407; transition: width 200ms ease-out; }.report-ledger { margin: 18px 24px 44px; }.ledger-row { display: grid; grid-template-columns: minmax(0,1fr) 110px 110px; gap: 12px; align-items: center; padding: 15px 0; border-bottom: 1px solid #e7edf3; }.ledger-row:last-child { border-bottom: 0; }.ledger-row strong, .ledger-row small { display: block; }.ledger-row strong { color: #284667; font-size: .85rem; }.ledger-row small { margin-top: 3px; color: #8090a3; font-size: .71rem; }.ledger-row b { color: #18835a; text-align: right; }.ledger-row > span { color: #7e8fa3; font-size: .75rem; text-align: right; }.draft-ledger b { color: #9c7200; }
@media (max-width: 850px) { .reports-kpis { grid-template-columns: 1fr 1fr; padding: 14px; }.reports-grid { grid-template-columns: 1fr; padding: 18px 14px 0; }.report-ledger { margin: 18px 14px 38px; }.report-warning { align-items: flex-start; flex-direction: column; padding: 11px 14px; } }@media (max-width: 500px) { .metrics-list { grid-template-columns: 1fr; }.ledger-row { grid-template-columns: 1fr auto; }.ledger-row > span { grid-column: 1/-1; text-align: left; }.header-actions .intelligence-button { display: none; } }

.packages-workspace { min-height: 100vh; color: #203c5e; background: #f5f7fb; }.package-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; padding: 20px 24px; color: #fff; background: #0d2346; }.package-summary article { border: 1px solid #284c79; border-radius: 10px; padding: 14px; background: #12325c; }.package-summary span, .package-summary strong, .package-summary small { display: block; }.package-summary span, .package-summary small { color: #aabbd0; font-size: .74rem; }.package-summary strong { margin: 5px 0 3px; color: #fff; font-size: 1.5rem; }.packages-content { padding: 26px 24px 46px; }.package-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 16px; }.package-card { position: relative; min-height: 190px; border: 1px solid #d6e0ea; border-top: 4px solid #d0aa08; border-radius: 10px; padding: 18px; background: #fff; box-shadow: 0 3px 8px rgba(23,52,88,.04); }.package-card h3 { margin: 3px 0 11px; color: #1b395d; font-size: 1.05rem; }.package-card > strong { color: #2e516f; font-size: .86rem; }.package-card > b { position: absolute; right: 17px; top: 60px; color: #197d56; font-size: 1.02rem; }.package-card > small { position: absolute; right: 17px; bottom: 16px; left: 17px; color: #8291a3; font-size: .69rem; line-height: 1.35; }.package-guidance { display: flex; gap: 15px; margin-top: 28px; border: 1px solid #d9e4ef; border-radius: 10px; padding: 18px; color: #486380; background: #eef5fb; }.package-guidance > span { display: grid; flex: none; width: 34px; height: 34px; place-items: center; border-radius: 8px; color: #946d00; background: #fff2c2; }.package-guidance h3 { margin: 0 0 5px; color: #294a6d; font-size: .91rem; }.package-guidance p { max-width: 860px; margin: 0; font-size: .78rem; line-height: 1.55; }.package-modal { max-width: 600px; }
@media (max-width: 900px) { .package-summary { grid-template-columns: 1fr 1fr; padding: 14px; }.packages-content { padding: 20px 14px 38px; }.package-cards { grid-template-columns: 1fr; } }@media (max-width: 540px) { .package-guidance { align-items: flex-start; flex-direction: column; }.header-actions .intelligence-button { display: none; } }

.inquiries-workspace { min-height: 100vh; color: #203c5e; background: #f5f7fb; }.inquiry-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; padding: 20px 24px; color: #fff; background: #0d2346; }.inquiry-summary article { border: 1px solid #284c79; border-radius: 10px; padding: 14px; background: #12325c; }.inquiry-summary span, .inquiry-summary strong { display: block; }.inquiry-summary span { color: #aabbd0; font-size: .74rem; }.inquiry-summary strong { margin-top: 6px; color: #fff; font-size: 1.5rem; }.inquiry-note { display: flex; align-items: center; gap: 12px; padding: 11px 24px; border-bottom: 1px solid #dce6ef; color: #596d84; background: #eef5fb; font-size: .79rem; }.inquiry-note span { flex: none; border-radius: 99px; padding: 5px 8px; color: #3c6691; background: #dcebf8; font-size: .66rem; font-weight: 800; text-transform: uppercase; }.inquiry-note p { margin: 0; }.inquiries-content { padding: 26px 24px 45px; }.inquiries-list { overflow: hidden; margin-top: 16px; border: 1px solid #d7e0ea; border-radius: 10px; background: #fff; }.inquiry-row { display: grid; grid-template-columns: 40px minmax(0,1.25fr) minmax(130px,.7fr) 120px; gap: 14px; align-items: center; padding: 15px 16px; border-bottom: 1px solid #e8edf3; }.inquiry-row:last-child { border-bottom: 0; }.inquiry-person strong, .inquiry-person small, .inquiry-contact small { display: block; }.inquiry-person strong { color: #213f62; font-size: .88rem; }.inquiry-person small, .inquiry-contact small { margin-top: 3px; color: #8190a2; font-size: .71rem; }.inquiry-person p { margin: 7px 0 0; color: #63758b; font-size: .74rem; line-height: 1.4; }.inquiry-row select { border: 1px solid #d4dfe9; border-radius: 6px; padding: 8px; color: #315173; background: #f9fbfd; font: inherit; font-size: .75rem; }.inquiry-modal { max-width: 650px; }.inquiry-modal textarea { min-height: 90px; resize: vertical; }
@media (max-width: 820px) { .inquiry-summary { grid-template-columns: 1fr 1fr; padding: 14px; }.inquiry-note { align-items: flex-start; flex-direction: column; padding: 11px 14px; }.inquiries-content { padding: 20px 14px 38px; }.inquiry-row { grid-template-columns: 40px minmax(0,1fr) 110px; }.inquiry-contact { grid-column: 2/3; }.inquiry-row select { grid-row: 1/3; grid-column: 3/4; } }@media (max-width: 480px) { .inquiry-row { grid-template-columns: 34px minmax(0,1fr); }.inquiry-row select { grid-row: auto; grid-column: 2/3; }.inquiry-contact { grid-column: 2/3; }.inquiry-summary { grid-template-columns: 1fr 1fr; } }

.retention-workspace { min-height: 100vh; color: #203c5e; background: #f5f7fb; }.retention-hero { display: flex; justify-content: space-between; gap: 25px; padding: 30px 26px; color: #fff; background: linear-gradient(115deg,#102f57,#0a2040); }.retention-hero h2 { max-width: 720px; margin: 6px 0 10px; color: #fff; font: 600 1.55rem/1.2 Georgia,serif; }.retention-hero p:not(.mini-label) { max-width: 710px; margin: 0; color: #c5d6e8; font-size: .83rem; line-height: 1.55; }.retention-count { flex: none; align-self: center; min-width: 140px; padding: 16px; border: 1px solid #537396; border-radius: 9px; background: rgba(2,18,39,.25); text-align: center; }.retention-count span,.retention-count strong,.retention-count small { display: block; }.retention-count span,.retention-count small { color: #bbcee2; font-size: .68rem; }.retention-count strong { margin: 3px 0; color: #f4c856; font-size: 2rem; }.retention-section { padding: 26px 24px 45px; }.retention-table-wrap { overflow-x: auto; margin-top: 16px; border: 1px solid #d7e0ea; border-radius: 10px; background: #fff; }.retention-table { width: 100%; border-collapse: collapse; min-width: 640px; }.retention-table th { padding: 11px 16px; color: #607891; background: #f2f6fa; font-size: .68rem; letter-spacing: .06em; text-align: left; text-transform: uppercase; }.retention-table td { padding: 14px 16px; border-top: 1px solid #e8edf3; color: #314f6d; font-size: .78rem; }.retention-table td strong,.retention-table td small,.retention-table td span { display: block; }.retention-table td small { margin-top: 3px; color: #8293a6; font-size: .68rem; }.visit-count { color: #aa632e!important; font-size: 1.1rem; }.row-action { display: inline-block; border: 1px solid #d3dfeb; border-radius: 6px; padding: 7px 9px; color: #254b74; background: #f9fbfd; font-size: .72rem; font-weight: 700; text-decoration: none; }@media (max-width: 720px) { .retention-hero { align-items: flex-start; flex-direction: column; padding: 23px 15px; }.retention-count { align-self: stretch; }.retention-section { padding: 20px 14px 38px; } }