@font-face{font-family:'Material Symbols Rounded';font-style:normal;font-weight:400;font-display:block;src:url('/fonts/MaterialSymbolsRounded.ttf') format('truetype')}
* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background: var(--paper);
  font-family: "Readex Pro", system-ui, sans-serif;
}

.site-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--space-4);
  align-items: center;
  padding: 14px clamp(16px, 5vw, 48px);
  border-bottom: 1px solid var(--border);
  background: rgb(251 250 246 / 96%);
}

.brand-link img { display: block; width: 164px; height: auto; }

.site-header nav,
.site-footer nav,
.language-toggle { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; }

.site-header nav { justify-content: center; }

.site-header a,
.site-footer a { color: var(--primary); font-weight: 600; text-decoration: none; }

.language-toggle { justify-content: end; gap: var(--space-2); }
.language-toggle a { border: 1px solid var(--border); border-radius: 999px; padding: 8px 12px; color: var(--muted); }
.language-toggle a.active { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }

main { min-height: calc(100vh - 168px); padding: clamp(24px, 6vw, 64px) clamp(16px, 5vw, 48px); }

.hero-card,
.content-card {
  width: min(860px, 100%);
  margin: 0 auto;
  padding: clamp(24px, 6vw, 56px);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--surface);
  box-shadow: 0 8px 24px rgb(38 65 94 / 10%);
}

.brand-logo { width: min(326px, 100%); height: auto; margin-bottom: var(--space-6); }

.eyebrow { color: var(--accent); font-size: .9rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
[dir="rtl"] .eyebrow { letter-spacing: 0; }

h1 { margin: var(--space-4) 0; color: var(--ink); font-size: clamp(2rem, 5vw, 3.75rem); line-height: 1.05; }
h2 { margin: var(--space-8) 0 var(--space-2); color: var(--primary); font-size: 1.25rem; }
p, li { color: var(--muted); font-size: 1rem; line-height: 1.7; }
a { color: var(--primary); }

.primary-link { display: inline-flex; min-height: 52px; align-items: center; margin-top: var(--space-4); padding: 0 22px; border-radius: 14px; background: var(--primary); color: var(--on-primary); font-weight: 700; text-decoration: none; }

.legal-page { max-width: 920px; }
.contact-list { padding-inline-start: var(--space-6); }

.site-footer { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; justify-content: space-between; padding: 24px clamp(16px, 5vw, 48px); border-top: 1px solid var(--border); background: var(--surface); }
.site-footer p { margin: 0; font-size: .9rem; }

@media (max-width: 820px) {
  .site-header { grid-template-columns: 1fr; }
  .site-header nav { justify-content: flex-start; }
  [dir="rtl"] .site-header nav { justify-content: flex-end; }
  .language-toggle { justify-content: flex-start; }
  [dir="rtl"] .language-toggle { justify-content: flex-end; }
  .brand-link img { width: 146px; }
  main { padding: var(--space-4); }
  .site-footer { align-items: flex-start; flex-direction: column; }
}

.admin-card {
  max-width: 560px;
}

.admin-form {
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.admin-form label {
  font-weight: 700;
  color: var(--color-text-primary);
}

.admin-form input {
  width: 100%;
  box-sizing: border-box;
  padding: .9rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: var(--color-surface-alt);
  color: var(--color-text-primary);
  font: inherit;
}

.admin-form button,
.secondary-button {
  margin-top: var(--space-3);
  padding: .9rem 1.25rem;
  border: 0;
  border-radius: 999px;
  background: var(--color-primary);
  color: var(--color-surface);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.validation-summary,
.field-validation-error {
  color: var(--color-error);
}

.dashboard-shell {
  text-align: start;
}

.admin-body {
  background: var(--paper);
}

.admin-login-page {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: clamp(20px, 6vw, 56px);
}

.admin-login-card {
  max-width: 560px;
}

.admin-login-topbar {
  display: flex;
  gap: var(--space-4);
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-6);
}

.admin-login-topbar img,
.admin-sidebar img {
  width: 168px;
  height: auto;
}

.admin-form {
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.admin-form label {
  color: var(--ink);
  font-weight: 700;
}

.admin-form input {
  width: 100%;
  min-height: 52px;
  padding: .9rem 1rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  outline: none;
  background: var(--surface-2);
  color: var(--ink);
  font: inherit;
}

.admin-form input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgb(38 65 94 / 12%);
}

.admin-form button,
.secondary-button {
  min-height: 52px;
  margin-top: var(--space-3);
  padding: 0 1.25rem;
  border: 0;
  border-radius: 14px;
  background: var(--primary);
  color: var(--on-primary);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.secondary-button {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--primary);
}

.validation-summary,
.field-validation-error {
  color: var(--error);
  font-size: .9rem;
}

.admin-shell {
  display: grid;
  grid-template-columns: 280px 1fr;
  min-height: 100vh;
}

.admin-sidebar {
  padding: var(--space-6);
  border-inline-end: 1px solid var(--border);
  background: var(--surface);
}

.admin-sidebar nav {
  display: grid;
  gap: var(--space-2);
  margin-top: var(--space-8);
}

.admin-sidebar a {
  padding: 12px 14px;
  border-radius: 14px;
  color: var(--primary);
  font-weight: 600;
  text-decoration: none;
}

.admin-sidebar a:first-child,
.admin-sidebar a:hover {
  background: var(--primary-soft);
}

.admin-main {
  padding: clamp(20px, 5vw, 48px);
}

.admin-main-header {
  display: flex;
  gap: var(--space-4);
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-6);
}

.admin-main-header h1 {
  margin: 0;
}

.dashboard-empty-card {
  margin: 0;
  box-shadow: none;
}

@media (max-width: 860px) {
  .admin-shell {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    border-inline-end: 0;
    border-bottom: 1px solid var(--border);
  }

  .admin-sidebar nav {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }

  .admin-main-header,
  .admin-login-topbar {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* M4 admin shell and activity reports */
.admin-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.admin-sidebar{position:sticky;top:0;height:100vh;padding:22px 18px;border-inline-end:1px solid var(--border);background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(10px);overflow:auto}.admin-brand{display:grid;gap:6px;margin-bottom:22px}.admin-brand img{width:168px;height:auto}.admin-brand span{font-size:12px;color:var(--muted)}.admin-sidebar nav{display:grid;gap:6px;margin-top:0}.admin-sidebar a{display:grid;gap:1px;min-height:44px;padding:10px 12px;border-radius:14px;text-decoration:none;color:var(--primary);font-weight:750;font-size:14px}.admin-sidebar a small{color:var(--muted);font-weight:600}.admin-sidebar a:hover,.admin-sidebar a.active{background:var(--primary-soft)}.admin-sidebar a.disabled{opacity:.55;cursor:not-allowed}.admin-main{min-width:0;padding:0}.admin-topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 26px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(10px)}.admin-topbar h1{font-size:22px;margin:0;color:var(--primary)}.admin-top-actions,.top-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.admin-chip{display:flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:8px 12px;color:var(--muted);font-size:13px}.admin-main>.page{margin:26px}.page{border:1px solid var(--border);border-radius:28px;background:var(--surface);box-shadow:0 12px 34px rgba(38,65,94,.08);overflow:hidden}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:24px 24px 18px;border-bottom:1px solid var(--border);background:linear-gradient(135deg,var(--surface),var(--surface-2))}.kicker{margin:0 0 6px;color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}[dir=rtl] .kicker{letter-spacing:0}.page h2{margin:0;color:var(--primary);font-size:26px}.sub{margin:6px 0 0;color:var(--muted);font-size:14px}.section{padding:22px 24px;display:grid;gap:18px}.grid{display:grid;gap:16px}.three{grid-template-columns:repeat(3,minmax(0,1fr))}.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{border:1px solid var(--border);background:var(--surface);border-radius:20px;padding:18px}.metric{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.metric b{display:block;font-size:28px;color:var(--primary)}.metric span{font-size:13px;color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 14px;border-radius:13px;border:1px solid var(--primary);background:var(--primary);color:var(--on-primary,#F6F3EC);font-weight:750;text-decoration:none;white-space:nowrap}.btn.secondary{background:transparent;color:var(--primary);border-color:var(--border)}.filterbar{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:10px}.field{display:grid;gap:6px}.field label{font-size:12px;font-weight:750;color:var(--primary)}.input,.select{min-height:42px;border:1px solid var(--border);background:var(--surface-2);border-radius:13px;padding:9px 11px;color:var(--ink);font:inherit;font-size:13px}.search{grid-column:span 2}.filter-actions{align-content:end}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:18px;background:var(--surface)}table{width:100%;border-collapse:collapse;min-width:920px}th,td{padding:13px 14px;border-bottom:1px solid var(--border);text-align:start;vertical-align:middle;font-size:13px}th{color:var(--primary);background:var(--surface-2);font-weight:800;white-space:nowrap}td{color:var(--ink)}tr:last-child td{border-bottom:0}.muted{color:var(--muted)}.num{direction:ltr;unicode-bidi:isolate;white-space:nowrap}.badge{display:inline-flex;align-items:center;gap:5px;min-height:26px;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:800;background:var(--primary-soft);color:var(--primary);white-space:nowrap}.badge.success{background:#E6F0E9;color:#2E6745}.badge.warn{background:#F5E7D3;color:#8A5A1D}.badge.error{background:#F2DEDB;color:#8A312B}.badge.muted{background:var(--surface-2);color:var(--muted)}.pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.pages{display:flex;gap:6px}.pages a,.pages span{min-width:34px;height:34px;border:1px solid var(--border);border-radius:10px;display:grid;place-items:center;color:var(--primary);font-weight:700;text-decoration:none}.pages .active{background:var(--primary);color:#F6F3EC;border-color:var(--primary)}.split{display:grid;grid-template-columns:1fr 360px;gap:16px}.drawer{border:1px solid var(--border);border-radius:20px;background:var(--surface);padding:18px}.timeline{display:grid;gap:12px}.event{display:grid;grid-template-columns:28px 1fr;gap:10px}.event .dot{width:28px;height:28px;border-radius:10px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center}.event p{margin:0}.empty,.error-state{display:grid;place-items:center;text-align:center;gap:8px;min-height:160px;border:1px dashed var(--border);border-radius:18px;background:var(--surface)}.wire{background:repeating-linear-gradient(135deg,var(--surface),var(--surface) 10px,var(--surface-2) 10px,var(--surface-2) 20px)}
@media(max-width:1180px){.admin-shell{grid-template-columns:1fr}.admin-sidebar{position:relative;height:auto;border-inline-end:0;border-bottom:1px solid var(--border)}.admin-sidebar nav{grid-template-columns:repeat(3,minmax(0,1fr))}.filterbar{grid-template-columns:repeat(3,minmax(0,1fr))}.search{grid-column:span 1}.four{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.admin-main>.page{margin:18px}}@media(max-width:760px){.admin-topbar,.page-head{flex-direction:column}.three,.four{grid-template-columns:1fr}.filterbar{grid-template-columns:1fr}.admin-sidebar nav{grid-template-columns:1fr}}

/* EDU-317 admin activity polish */
.admin-sidebar a:first-child:not(.active){background:transparent}.admin-sidebar{min-height:100vh}.admin-sidebar a span{overflow:hidden;text-overflow:ellipsis}.metric-icon{width:42px;height:42px;border-radius:14px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center;flex:0 0 auto}.activity-split{grid-template-columns:minmax(0,1fr) minmax(340px,420px);align-items:start}.activity-table{min-height:0}.activity-table table{min-width:760px}.progress-cell{display:grid;gap:5px;min-width:110px}.progress-bar{display:block;width:100%;height:7px;border-radius:999px;background:var(--surface-2);overflow:hidden}.progress-bar i{display:block;height:100%;border-radius:999px;background:var(--primary)}.timeline-drawer{max-height:720px;overflow:auto;min-width:0}.timeline-page .timeline-drawer{max-height:none}.timeline-head{display:grid;gap:10px;margin-bottom:14px}.timeline-head h3{margin:0;color:var(--primary)}.timeline-filters{display:flex;gap:6px;flex-wrap:wrap}.timeline-filters a,.timeline-toggle{border:1px solid var(--border);border-radius:999px;padding:6px 9px;color:var(--primary);font-size:12px;font-weight:800;text-decoration:none;background:var(--surface)}.timeline-filters a.active{background:var(--primary);border-color:var(--primary);color:var(--on-primary,#F6F3EC)}.timeline-toggle{justify-self:start}.timeline-day{margin:6px 0 0;color:var(--accent);font-size:12px;font-weight:900;text-transform:uppercase}.event{grid-template-columns:32px minmax(0,1fr);align-items:start}.event .dot{font-size:18px;flex:0 0 auto}.event-body{min-width:0;display:grid;gap:4px}.event-title{font-weight:850;color:var(--primary);overflow-wrap:anywhere;word-break:break-word}.event-meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:12px;min-width:0}.event-meta span:first-child,.event-meta span:nth-child(2){overflow:hidden;text-overflow:ellipsis;max-width:100%;white-space:nowrap}.timeline-more{margin-top:12px;width:100%}.badge[title]{cursor:help}
@media(max-width:1180px){.activity-split{grid-template-columns:1fr}.timeline-drawer{max-height:520px}}

/* EDU-317 follow-up polish */
.ms{font-family:'Material Symbols Rounded';font-weight:400;font-style:normal;font-size:21px;line-height:1;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}.activity-split{grid-template-columns:minmax(0,1fr) 340px}.activity-table table{min-width:0}.activity-table th,.activity-table td{padding:10px 9px}.activity-table td:nth-child(6){min-width:138px}.activity-table td:nth-child(6) .badge{white-space:normal;margin:2px 0}.metric-pair{display:grid;gap:2px;font-size:14px}.metric-pair strong{font-size:22px;color:var(--primary)}.timeline-drawer{width:340px;max-width:340px}.timeline-drawer .badge.muted:empty{display:none}.metric-icon.ms,.event .dot.ms{font-family:'Material Symbols Rounded'}
@media(max-width:1180px){.activity-split{grid-template-columns:1fr}.timeline-drawer{width:auto;max-width:none}}
.metric-pair span{display:flex;gap:4px;align-items:baseline}.metric-pair{line-height:1.4}.activity-table td:nth-child(6) .badge{display:inline-flex;max-width:100%}@media(max-width:1300px){.activity-split{grid-template-columns:1fr}.timeline-drawer{width:auto;max-width:none}.activity-table table{min-width:760px}}

/* EDU-320 instructors management */
.page-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.btn.danger{border-color:var(--error);background:var(--error);color:#fff}.narrow-page{max-width:760px}.admin-main>.narrow-page{margin-inline:auto}.validation{color:var(--error);font-weight:700}.confirm-card{text-align:center;place-items:center}.danger-icon{font-size:44px;color:var(--error)}.impact-line{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;margin:4px 0 10px;padding:10px 12px;border-radius:14px;background:var(--primary-soft);color:var(--primary);font-weight:850}.reset-confirm-form{width:min(420px,100%);text-align:start}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:18px 24px;border-bottom:1px solid var(--border)}.metric-grid .metric{display:grid;gap:6px;justify-content:stretch;border:1px solid var(--border);border-radius:18px;background:var(--surface);padding:16px}.metric-grid .metric .ms{width:36px;height:36px;border-radius:12px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center}.metric-grid .metric bdi{font-size:28px;font-weight:900;color:var(--primary)}.activity-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;padding:22px 24px}.instructor-filterbar{padding:18px 24px;border-bottom:1px solid var(--border)}
@media(max-width:1180px){.activity-layout{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.metric-grid{grid-template-columns:1fr}.page-actions{width:100%}.page-actions .btn{flex:1 1 auto}}

/* M5 public account deletion and store release helpers */
.delete-flow { display: grid; gap: var(--space-4); }
.notice-card { border: 1px solid var(--border); border-radius: 18px; background: var(--surface-2); padding: var(--space-4); }
.notice-card h2 { margin-top: 0; }
.notice-card.warning { border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); }
.public-form select,
.public-form input[type="tel"],
.public-form input[type="text"] { width: 100%; min-height: 52px; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); color: var(--ink); font: inherit; }
.phone-row { display: grid; grid-template-columns: minmax(160px, .45fr) 1fr; gap: var(--space-3); }
.checkbox-row { display: grid; grid-template-columns: auto 1fr; gap: var(--space-2); align-items: start; }
.checkbox-row input { width: auto; min-height: auto; margin-top: .35rem; }
.success-state { text-align: center; }
.store-badges { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-4) 0; }
.store-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; border-radius: 12px; background: var(--ink); color: white; font-weight: 700; text-decoration: none; }
@media (max-width: 640px) { .phone-row { grid-template-columns: 1fr; } }

body.app-mode main { min-height: 100vh; padding: 20px 20px 40px; }
body.app-mode .content-card { width: 100%; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }