:root {
  color-scheme: light;
  --green: #153f38;
  --green-strong: #17483f;
  --green-soft: #e8f0eb;
  --paper: #f7f8f3;
  --surface: #fff;
  --ink: #182c28;
  --muted: #6e7c76;
  --line: #e3e9e3;
  --gold: #d5b967;
  font-family: "Cairo", "Segoe UI", Tahoma, sans-serif;
}

* { box-sizing: border-box; }
body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background-color: var(--paper);
  background-image: radial-gradient(#dce4dc 0.7px, transparent 0.7px);
  background-size: 18px 18px;
}
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.brand-mark {
  display: inline-grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 25%);
  border-radius: 12px;
  color: #d5b967;
}
.dashboard-header {
  position: relative;
  overflow: hidden;
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px max(24px, calc((100% - 1120px) / 2));
  color: #f5f7f1;
  background: linear-gradient(118deg, #12372f, #17483f 58%, #22594a);
}
.dashboard-header::after {
  position: absolute;
  inset-inline-end: -34px;
  bottom: -86px;
  width: 190px;
  height: 190px;
  border: 1px solid rgb(255 255 255 / 10%);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}
.admin-brand, .header-actions { display: flex; align-items: center; gap: 12px; }
.admin-brand { position: relative; z-index: 1; color: inherit; font-weight: 700; text-decoration: none; }
.back-link { color: inherit; }
.header-actions { position: relative; z-index: 1; }
.dashboard { width: min(1120px, calc(100% - 32px)); margin: 28px auto 56px; }
.page-title, .panel-heading, .file-list-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.page-title { margin-bottom: 22px; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: clamp(1.7rem, 4vw, 2.2rem); }
h2 { margin-bottom: 5px; font-size: 1.1rem; }
.eyebrow { margin-bottom: 4px; color: #527d6f; font-size: .85rem; }
.muted { color: var(--muted); font-size: .9rem; }
.panel {
  margin-block: 16px;
  padding: 23px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: 0 14px 34px rgb(24 50 42 / 6%);
}
.panel-heading { margin-bottom: 17px; }
.panel-heading p { margin-bottom: 0; }
.inline-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
input:not([type="checkbox"]):not([type="file"]), textarea, select {
  width: 100%;
  min-height: 42px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  outline: none;
  color: var(--ink);
  background: var(--surface);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
input:focus, textarea:focus, select:focus {
  border-color: #6c9585;
  box-shadow: 0 0 0 3px rgb(75 124 103 / 12%);
}
.inline-form > input:not([type="file"]) { width: min(240px, 100%); }
.check-label { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.primary-button, .secondary-button, .danger-button {
  min-height: 38px;
  padding: 7px 15px;
  border: 1px solid transparent;
  border-radius: 11px;
  font-weight: 600;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease, border-color 160ms ease;
}
.primary-button {
  color: #fff;
  background: linear-gradient(135deg, #1d5548, #153f38);
  box-shadow: 0 5px 12px rgb(21 63 56 / 15%);
}
.primary-button:hover { background: linear-gradient(135deg, #246653, #17483f); box-shadow: 0 8px 18px rgb(21 63 56 / 21%); }
.secondary-button { border-color: #dfe8e1; color: #264c40; background: #f7faf7; }
.secondary-button:hover { border-color: #bfd1c5; background: var(--green-soft); }
.danger-button { border-color: #efd4d0; color: #963b33; background: #fff8f7; }
.danger-button:hover { border-color: #e6b7b0; background: #fff0ed; }
.primary-button:hover, .secondary-button:hover, .danger-button:hover { transform: translateY(-1px); }
button:disabled { cursor: wait; opacity: .6; }
.small-button { min-height: 35px; padding: 5px 10px; font-size: .8rem; }
.order-button { min-width: 36px; padding-inline: 6px; font-size: 1rem; font-weight: 800; }
.order-button:disabled { cursor: not-allowed; opacity: .38; }
.category-panel-heading { align-items: center; }
.category-heading-copy { display: flex; align-items: center; gap: 14px; }
.category-heading-icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #dce9df;
  border-radius: 15px;
  color: #1f5b4a;
  background: linear-gradient(145deg, #f0f7f1, #e5f0e8);
  font-size: 1.35rem;
}
.category-heading-copy .eyebrow { margin-bottom: 0; color: #578070; }
.category-heading-copy h2 { margin-block: 1px 3px; }
.category-heading-copy .muted { margin-bottom: 0; }
.category-total {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border: 1px solid #e5ebe5;
  border-radius: 999px;
  color: var(--muted);
  background: #f8faf8;
  font-size: .82rem;
  white-space: nowrap;
}
.category-total strong { color: var(--green); font-size: 1rem; }
.category-create-form {
  padding: 19px;
  border: 1px solid #dce9df;
  border-radius: 17px;
  background:
    radial-gradient(ellipse at 100% 0, rgb(213 185 103 / 12%), transparent 34%),
    linear-gradient(135deg, #f7fbf7, #f1f7f2);
}
.category-form-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 15px;
}
.category-form-heading h3 { margin: 0 0 3px; font-size: 1rem; }
.category-form-heading .muted { margin: 0; font-size: .84rem; }
.category-form-spark {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(145deg, #286451, #153f38);
  box-shadow: 0 6px 14px rgb(21 63 56 / 18%);
  font-size: 1.25rem;
}
.category-form-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: 13px;
}
.category-input { display: grid; gap: 7px; }
.category-input > span:first-child {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: .84rem;
  font-weight: 700;
}
.field-icon {
  display: inline-grid;
  width: 23px;
  height: 23px;
  place-items: center;
  border: 1px solid #dae8dc;
  border-radius: 7px;
  color: #2c604e;
  background: #fff;
  font-size: .78rem;
}
.field-icon-en { font-size: .62rem; }
.optional-label { color: var(--muted); font-size: .75rem; font-weight: 500; }
.coming-soon-option {
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 10px;
  padding: 7px 11px;
  border: 1px solid #e1e9e2;
  border-radius: 11px;
  background: rgb(255 255 255 / 78%);
  cursor: pointer;
}
.coming-soon-option > input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.coming-soon-toggle {
  position: relative;
  width: 37px;
  height: 21px;
  flex: 0 0 auto;
  border-radius: 99px;
  background: #dce3dc;
  transition: background-color 160ms ease;
}
.coming-soon-toggle::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgb(0 0 0 / 18%);
  content: "";
  transition: transform 160ms ease;
}
.coming-soon-option > input:checked + .coming-soon-toggle { background: #3a8066; }
.coming-soon-option > input:checked + .coming-soon-toggle::after { transform: translateX(16px); }
.coming-soon-option > input:focus-visible + .coming-soon-toggle { outline: 3px solid rgb(75 124 103 / 25%); }
.coming-soon-option > span:last-child { display: grid; gap: 1px; }
.coming-soon-option strong { font-size: .8rem; }
.coming-soon-option small { color: var(--muted); font-size: .7rem; }
.category-submit { min-height: 48px; }
.category-submit span { margin-inline-end: 4px; font-size: 1.1rem; }
.category-admin-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  margin-top: 17px;
}
.category-row {
  display: grid;
  min-width: 0;
  gap: 10px;
  padding: 14px;
  border: 1px solid #e5ece5;
  border-radius: 14px;
  background: linear-gradient(130deg, #fff, #fafcf9);
  box-shadow: 0 5px 15px rgb(24 50 42 / 3%);
}
.category-info { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; }
.category-row .category-name { overflow: hidden; min-width: 0; font-size: .92rem; text-overflow: ellipsis; }
.category-status {
  flex: 0 0 auto;
  padding: 3px 9px;
  border-radius: 999px;
  color: #276048;
  background: #eaf4ed;
  font-size: .71rem;
}
.category-status.is-coming-soon { color: #816a30; background: #f5efd9; }
.category-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.category-actions .small-button { flex: 1 1 auto; }
.file-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.file-form > label:not(.check-label) { display: grid; align-content: start; gap: 6px; font-size: .9rem; }
.upload-field { display: grid; gap: 9px; }
.upload-label { font-size: .9rem; font-weight: 700; }
.upload-dropzone {
  display: flex;
  min-height: 104px;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px dashed #9ab6a4;
  border-radius: 15px;
  background: linear-gradient(135deg, #f7fbf7, #eef5ef);
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.upload-dropzone:hover, .upload-dropzone:focus-within {
  border-color: #487e66;
  background: #f0f7f1;
  box-shadow: 0 0 0 3px rgb(75 124 103 / 10%);
}
.upload-symbol {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #dce9df;
  border-radius: 14px;
  color: #276048;
  background: #fff;
}
.upload-symbol svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.upload-copy { display: grid; gap: 3px; }
.upload-copy strong { color: #244c3e; font-size: .94rem; }
.upload-copy small { color: var(--muted); font-size: .78rem; line-height: 1.6; }
.upload-dropzone input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  clip-path: inset(50%);
}
.file-selection { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.file-selection:empty { display: none; }
.upload-editors { display: grid; gap: 11px; }
.upload-editor {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  min-width: 0;
  margin: 0;
  padding: 14px;
  border: 1px solid #dfe9e1;
  border-radius: 13px;
  background: #fbfdfb;
}
.upload-editor legend { padding-inline: 6px; color: #315b4a; font-size: .83rem; font-weight: 700; }
.upload-editor > label:not(.check-label) { display: grid; align-content: start; gap: 6px; font-size: .82rem; }
.upload-editor-cover {
  position: relative;
  min-height: 42px;
  align-content: center !important;
  padding: 7px 10px;
  border: 1px dashed #9ab6a4;
  border-radius: 10px;
  color: #315b4a;
  cursor: pointer;
}
.upload-editor-cover input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.file-selection li {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #e5ece5;
  border-radius: 11px;
  background: #fbfdfb;
}
.file-selection-detail { display: grid; min-width: 0; gap: 1px; }
.file-selection-detail strong { overflow: hidden; font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.file-selection-detail small { color: var(--muted); font-size: .72rem; }
.remove-selected-file {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #f0d8d4;
  border-radius: 10px;
  color: #963b33;
  background: #fff8f7;
  font-size: 1.25rem;
}
.cover-picker {
  position: relative;
  display: flex !important;
  min-height: 62px;
  align-items: center;
  gap: 10px !important;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fcfdfb;
  cursor: pointer;
}
.cover-picker-icon { color: #547867; font-size: 1.35rem; }
.cover-picker-copy { display: grid; flex: 1; gap: 1px; }
.cover-picker-copy strong { font-size: .83rem; }
.cover-picker-copy small { color: var(--muted); font-size: .73rem; font-weight: 400; }
.cover-picker-button { padding: 6px 9px; border: 1px solid #dfe8e1; border-radius: 9px; color: #264c40; background: #f7faf7; font-size: .77rem; white-space: nowrap; }
.cover-picker input[type="file"] { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.cover-picker:focus-within { outline: 3px solid rgb(75 124 103 / 15%); }
.upload-progress { margin-top: 0; }
.upload-status { margin: -5px 0 0; color: var(--muted); font-size: .82rem; }
.upload-file-statuses { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.upload-file-statuses:empty { display: none; }
.upload-file-status { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 12px; min-width: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; }
.upload-file-status-name { overflow-wrap: anywhere; font-size: .82rem; font-weight: 700; }
.upload-file-status-state { color: var(--muted); font-size: .78rem; white-space: nowrap; }
.upload-file-status progress { grid-column: 1 / -1; margin: 0; }
.upload-file-status-error { grid-column: 1 / -1; margin: 0; color: #963b33; font-size: .78rem; overflow-wrap: anywhere; }
.upload-file-status[data-state="completed"] .upload-file-status-state { color: #276747; }
.wide { grid-column: 1 / -1; }
.form-actions { display: flex; gap: 9px; }
.setup-steps { margin-block: 0 14px; color: var(--muted); }
.setup-steps li { margin-block: 4px; }
progress { width: 100%; height: 12px; margin-top: 12px; accent-color: var(--green); }
.file-list-heading input { max-width: 300px; }
.notification-form { display: grid; gap: 14px; }
.notification-form label { display: grid; gap: 6px; color: #42564e; font-size: .9rem; font-weight: 600; }
.notification-image-picker {
  position: relative;
  padding: 12px 14px;
  border: 1px dashed #9ab6a4;
  border-radius: 12px;
  background: #fbfdfb;
  cursor: pointer;
}
.notification-image-picker > span { display: grid; gap: 2px; }
.notification-image-picker small { color: var(--muted); font-size: .78rem; font-weight: 400; }
.notification-image-picker input { width: 100%; margin-top: 4px; font-size: .82rem; }
.notification-image-preview-wrap { display: grid; justify-items: start; gap: 6px; }
.notification-image-preview-wrap img { max-width: min(100%, 360px); max-height: 220px; border: 1px solid var(--line); border-radius: 12px; object-fit: contain; }
.notification-image-preview-wrap span { color: var(--muted); font-size: .8rem; }
.notification-form .primary-button { justify-self: start; }
.notification-image-picker + .notification-remove-image { justify-self: start; }
.notification-attachments { display: grid; gap: 8px; }
.notification-attachments .upload-label { display: grid; gap: 3px; }
.notification-attachments .upload-label small { color: var(--muted); font-size: .78rem; font-weight: 400; }
.notification-attachments input[type="file"] { width: 100%; padding: 10px; border: 1px dashed #9ab6a4; border-radius: 12px; background: #fbfdfb; }
.notification-existing-attachments { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.notification-existing-attachments:empty { display: none; }
.notification-existing-attachments li { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid #e5ece5; border-radius: 11px; background: #fbfdfb; font-size: .82rem; overflow-wrap: anywhere; }
.notification-upload-progress { margin-top: 0; }
.admin-notification-history { margin-top: 24px; }
.admin-notification-history h3 { margin: 0 0 10px; font-size: .95rem; }
.admin-notification-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.admin-notification-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfa; }
.admin-notification-list strong { display: block; }
.admin-notification-list p { margin: 4px 0; color: var(--muted); white-space: pre-wrap; }
.admin-notification-list img { display: block; max-width: min(100%, 360px); max-height: 200px; margin-block: 8px; border-radius: 10px; object-fit: contain; }
.admin-notification-list time { color: var(--muted); font-size: .78rem; }
.admin-notification-attachments { margin: 7px 0; padding-inline-start: 20px; color: var(--muted); font-size: .8rem; }
.calendar-import-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.calendar-import-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, #5f997b 24%, var(--line));
  border-radius: 13px;
  background: linear-gradient(135deg, #f5f9f5, #f4f8fa);
}
.calendar-import-file { display: grid; min-width: 0; gap: 7px; font-size: .83rem; font-weight: 700; }
.calendar-import-form input[type="file"] { max-width: 100%; font-size: .82rem; }
.calendar-import-form .upload-status { grid-column: 1 / -1; margin: 0; }
.calendar-import-form .upload-status.error { color: #963b33; }
.calendar-events-count { margin: 17px 0 8px; font-size: .82rem; }
.calendar-event-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.calendar-admin-event {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.calendar-admin-event-details { display: grid; min-width: 0; gap: 3px; }
.calendar-admin-event-details strong { overflow-wrap: anywhere; }
.calendar-admin-event-details small { color: var(--muted); line-height: 1.6; }
.calendar-admin-event-type {
  width: fit-content;
  padding: 2px 8px;
  border-radius: 999px;
  color: #245f4a;
  background: #e6f2e9;
  font-size: .72rem;
  font-weight: 700;
}
.calendar-admin-event-type.is-section { color: #325c7a; background: #e7f0f6; }
.calendar-admin-event-type.is-exam { color: #855b1e; background: #f6efd9; }
.calendar-events-panel .panel-heading { align-items: center; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 13px; }
#files-panel { border-color: color-mix(in srgb, #5f997b 28%, var(--line)); border-radius: 15px; }
#files-panel .file-list-heading { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
#files-panel .file-list-heading h2 { margin-bottom: 0; }
table { width: 100%; border-collapse: collapse; text-align: start; }
th, td { padding: 11px 9px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
th { color: var(--muted); font-size: .83rem; font-weight: 600; white-space: nowrap; }
td { font-size: .88rem; }
.file-category-heading td { padding: 0; border: 0; background: transparent; }
.file-category-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, #5f997b 25%, var(--line));
  border-radius: 11px;
  color: var(--green-strong);
  background: linear-gradient(110deg, var(--green-soft), color-mix(in srgb, var(--surface) 90%, #d8eaf0));
  font-size: .88rem;
}
.file-category-summary strong { overflow-wrap: anywhere; }
.file-category-count {
  flex: 0 0 auto;
  padding: 3px 9px;
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  font-size: .75rem;
  font-weight: 600;
}
.table-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.notice, .form-message { padding: 11px 13px; border-radius: 8px; color: #843c25; background: #fff0e7; }
.auth-card {
  width: min(430px, calc(100% - 32px));
  margin: min(12vh, 110px) auto;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--surface);
  box-shadow: 0 18px 48px rgb(24 50 42 / 9%);
}
.auth-card .back-link { display: inline-block; margin-bottom: 23px; color: var(--green); text-decoration: none; }
.auth-card .brand-mark { display: grid; background: var(--green); }
.auth-card .eyebrow { margin-top: 20px; }
.auth-card form, .auth-card label { display: grid; gap: 8px; }
.auth-card form { gap: 14px; margin-top: 22px; }
.form-message { margin-bottom: 0; }
.admin-toast {
  position: fixed;
  z-index: 10;
  inset-inline-start: auto;
  left: 50%;
  bottom: max(22px, env(safe-area-inset-bottom));
  width: max-content;
  max-width: min(460px, calc(100% - 32px));
  padding: 13px 18px;
  transform: translate(-50%, 14px);
  border: 1px solid rgb(255 255 255 / 12%);
  border-radius: 14px;
  color: white;
  background: linear-gradient(135deg, #21483c, #142f29);
  box-shadow: 0 14px 38px rgb(0 0 0 / 24%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease, transform 180ms ease;
  text-align: center;
  text-wrap: pretty;
}
.admin-toast.visible { transform: translate(-50%, 0); opacity: 1; }
.admin-toast.error { background: #8a342d; }
[hidden] { display: none !important; }
@media (max-width: 650px) {
  .admin-notification-list li { align-items: flex-start; }
  .calendar-import-form { grid-template-columns: 1fr; }
  .calendar-import-form .primary-button { width: 100%; }
  .calendar-import-actions { width: 100%; }
  .calendar-import-actions .secondary-button { flex: 1 1 0; }
  .calendar-admin-event { align-items: flex-start; }
  .calendar-admin-event .danger-button { flex: 0 0 auto; }
  .dashboard-header { align-items: stretch; flex-direction: column; gap: 12px; padding: 14px 16px; }
  .header-actions { flex-wrap: wrap; justify-content: space-between; }
  .dashboard { width: min(100% - 24px, 520px); margin-top: 18px; }
  .page-title { gap: 6px; }
  .panel { padding: 16px; border-radius: 15px; }
  .panel-heading, .page-title { align-items: flex-start; flex-direction: column; }
  .inline-form { align-items: stretch; }
  .inline-form > input:not([type="file"]) { width: 100%; }
  .inline-form > .primary-button { width: 100%; }
  .inline-form input[type="file"] { max-width: 100%; }
  .category-panel-heading { align-items: flex-start; }
  .category-heading-copy { align-items: flex-start; gap: 10px; }
  .category-heading-icon { width: 42px; height: 42px; border-radius: 13px; }
  .category-heading-copy .muted { font-size: .82rem; line-height: 1.7; }
  .category-total { align-self: flex-end; margin-top: -2px; }
  .category-create-form { padding: 15px; border-radius: 14px; }
  .category-form-heading { align-items: flex-start; }
  .category-form-fields { grid-template-columns: 1fr; gap: 12px; }
  .category-submit { width: 100%; }
  .category-admin-list { grid-template-columns: 1fr; gap: 9px; }
  .category-row { gap: 9px; padding: 12px; }
  .category-actions .small-button { min-height: 42px; flex: 1 1 auto; }
  .file-form { grid-template-columns: 1fr; }
  .wide { grid-column: auto; }
  .upload-editor { grid-template-columns: 1fr; }
  .upload-dropzone { min-height: 92px; padding: 12px; }
  .upload-symbol { width: 42px; height: 42px; }
  .cover-picker { flex-wrap: wrap; }
  .file-list-heading input { max-width: none; }
  .table-wrap { overflow: visible; border: 0; }
  table, tbody { display: block; width: 100%; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; clip-path: inset(50%); }
  tbody { display: grid; gap: 10px; }
  tbody tr {
    display: block;
    padding: 8px 13px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
    box-shadow: 0 7px 18px rgb(24 50 42 / 5%);
  }

  tbody tr.file-category-heading {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  tbody tr.file-category-heading td {
    display: block;
    padding: 0;
    border: 0;
  }
  tbody tr.file-category-heading td::before { display: none; }
  tbody tr:not(.file-category-heading) .file-category-value { display: none; }
  .file-category-summary { min-height: 42px; padding: 8px 11px; }
  body.dark tbody tr.file-category-heading { background: transparent; box-shadow: none; }
  td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid #edf1ed;
    text-align: end;
    overflow-wrap: anywhere;
  }
  td::before { flex: 0 0 auto; color: var(--muted); content: attr(data-label); font-size: .78rem; }
  td.table-actions { justify-content: flex-start; flex-wrap: wrap; gap: 6px; border-bottom: 0; }
  td.table-actions::before { margin-inline-end: auto; }
  .table-actions .small-button { min-height: 42px; flex: 0 0 auto; }
  #file-count { margin-top: 2px; }
  .form-actions { flex-wrap: wrap; }
  .form-actions .primary-button, .form-actions .secondary-button { flex: 1 1 auto; }
  .admin-toast {
    bottom: max(12px, env(safe-area-inset-bottom));
    max-width: calc(100% - 24px);
    padding: 12px 15px;
    border-radius: 13px;
    font-size: .9rem;
  }
}

:root {
  --green: #153f38;
  --green-strong: #17483f;
  --green-soft: #e8f0eb;
  --paper: #f7f8f3;
  --surface: #fff;
  --ink: #182c28;
  --muted: #6e7c76;
  --line: #e3e9e3;
  --gold: #d5b967;
}

.dashboard-header {
  background: linear-gradient(118deg, #12372f, #17483f 58%, #22594a);
}

.eyebrow,
.category-heading-copy .eyebrow {
  color: #527d6f;
}

.primary-button {
  background: linear-gradient(135deg, #1d5548, #153f38);
  box-shadow: 0 5px 12px rgb(21 63 56 / 15%);
}

.primary-button:hover {
  background: linear-gradient(135deg, #246653, #17483f);
  box-shadow: 0 8px 18px rgb(21 63 56 / 21%);
}

.category-form-spark {
  background: linear-gradient(145deg, #286451, #153f38);
}

body.dark {
  color-scheme: dark;
  --green: #102e29;
  --green-strong: #28594d;
  --green-soft: #263e37;
  --paper: #151d1a;
  --surface: #1e2925;
  --ink: #e6ede8;
  --muted: #a1b0a8;
  --line: #35443d;
  --gold: #d5b967;
  background-image: radial-gradient(#293630 0.7px, transparent 0.7px);
}

body.dark .dashboard-header {
  background: linear-gradient(118deg, #102e29, #17483f 58%, #22594a);
}

body.dark .admin-overview article,
body.dark .dashboard-sidebar,
body.dark .panel {
  background: var(--surface);
}

body.dark .admin-toast {
  background: linear-gradient(135deg, #21483c, #142f29);
}

.admin-notification-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: end;
  gap: 6px;
}

body.dark .danger-button {
  border-color: #70454a;
  color: #ffd3d1;
  background: #432b30;
}

body.dark .danger-button:hover {
  border-color: #a85a60;
  background: #553238;
}

.dashboard {
  width: min(1320px, calc(100% - 40px));
}

.dashboard-layout {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  align-items: start;
  gap: 18px;
}

.dashboard-sidebar-wrap {
  position: sticky;
  top: 18px;
  min-width: 0;
  align-self: start;
}

.dashboard-sidebar {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 8px 24px rgb(25 37 75 / 6%);
}

.dashboard-sidebar-arrow {
  display: none;
}

.dashboard-sidebar a {
  display: flex;
  min-height: 42px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 7px;
  color: var(--muted);
  font-size: .82rem;
  text-decoration: none;
  white-space: nowrap;
}

.dashboard-sidebar a:hover,
.dashboard-sidebar a[aria-current="location"] {
  color: var(--green-strong);
  background: var(--green-soft);
}

.dashboard-content {
  min-width: 0;
}

.dashboard-content > .panel {
  margin-block: 0 14px;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgb(25 37 75 / 5%);
}

.admin-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.admin-overview article {
  display: grid;
  min-width: 0;
  min-height: 92px;
  align-content: center;
  gap: 6px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
}

.admin-overview article span {
  color: var(--muted);
  font-size: .75rem;
}

.admin-overview article strong {
  color: var(--green-strong);
  font-size: 1.55rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}

.category-heading-icon,
.field-icon {
  border-color: #dce9df;
  color: var(--green-strong);
  background: var(--green-soft);
}

.category-form-spark {
  background: linear-gradient(145deg, #286451, #153f38);
}

.dashboard-content [id] {
  scroll-margin-top: 24px;
}

body.dark {
  color-scheme: dark;
  --green: #102e29;
  --green-strong: #28594d;
  --green-soft: #263e37;
  --paper: #151d1a;
  --surface: #1e2925;
  --ink: #e6ede8;
  --muted: #a1b0a8;
  --line: #35443d;
  background-image: radial-gradient(#293630 0.7px, transparent 0.7px);
}

body.dark .dashboard-sidebar,
body.dark .admin-overview article,
body.dark .panel {
  border-color: var(--line);
  background: var(--surface);
}

body.dark .dashboard-sidebar-wrap {
  border-color: var(--line);
  background: var(--surface);
}

body.dark .category-create-form,
body.dark .category-row,
body.dark .upload-dropzone,
body.dark .upload-editor,
body.dark .file-selection li,
body.dark .cover-picker,
body.dark .notification-image-picker,
body.dark .notification-attachments li,
body.dark .admin-notification-list li,
body.dark tbody tr {
  border-color: var(--line);
  color: var(--ink);
  background: #121a30;
}

body.dark .file-category-summary {
  border-color: color-mix(in srgb, #78c29c 30%, var(--line));
  color: var(--ink);
  background: linear-gradient(110deg, #263f36, var(--surface));
}

body.dark .file-category-count {
  color: var(--muted);
  background: #121a30;
}

body.dark .calendar-import-form {
  border-color: var(--line);
  background: linear-gradient(135deg, #1d3029, var(--surface));
}

body.dark .calendar-admin-event {
  border-color: var(--line);
  background: #121a30;
}

body.dark .calendar-admin-event-type { color: #bde3c7; background: #263f36; }
body.dark .calendar-admin-event-type.is-section { color: #c1dcee; background: #263c4c; }
body.dark .calendar-admin-event-type.is-exam { color: #f0d48c; background: #403621; }

body.dark .secondary-button {
  border-color: var(--line);
  color: var(--ink);
  background: #202945;
}

body.dark .secondary-button:hover,
body.dark .dashboard-sidebar a:hover,
body.dark .dashboard-sidebar a[aria-current="location"] {
  background: var(--green-soft);
}

body.dark .dashboard-sidebar-arrow {
  border-color: var(--line);
  color: var(--ink);
  background: #202945;
}

body.dark td {
  border-color: var(--line);
}

body.dark .notice,
body.dark .form-message {
  color: #ffd2c2;
  background: #432b35;
}

body.dark .dashboard-header {
  background: linear-gradient(118deg, #111a36, #1b2b56 58%, #282453);
}

body.dark .admin-toast {
  background: #121a30;
}

@media (max-width: 900px) {
  .dashboard-layout {
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 12px;
  }

  .admin-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 650px) {
  .dashboard {
    width: min(100% - 24px, 560px);
  }

  .dashboard-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .dashboard-sidebar {
    display: flex;
    min-width: 0;
    overflow-x: auto;
    gap: 3px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
  }

  .dashboard-sidebar-wrap {
    top: 8px;
    z-index: 6;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 36px;
    align-items: center;
    gap: 4px;
    padding: 5px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
    box-shadow: 0 8px 24px rgb(25 37 75 / 8%);
    direction: ltr;
  }

  .dashboard-sidebar::-webkit-scrollbar {
    display: none;
  }

  .dashboard-sidebar-arrow {
    display: grid;
    width: 36px;
    min-height: 40px;
    place-items: center;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    color: var(--green-strong);
    background: var(--green-soft);
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1;
    transition: background-color 150ms ease, border-color 150ms ease, opacity 150ms ease;
  }

  .dashboard-sidebar-arrow:hover:not(:disabled) {
    border-color: #a7c3b1;
    background: color-mix(in srgb, var(--green-soft) 72%, var(--surface));
  }

  .dashboard-sidebar-arrow:disabled {
    cursor: default;
    opacity: .38;
  }

  body.dark .dashboard-sidebar-wrap {
    box-shadow: 0 8px 24px rgb(0 0 0 / 22%);
  }

  body.dark .dashboard-sidebar {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
  }

  html[dir="rtl"] .dashboard-sidebar {
    direction: rtl;
  }

  html[dir="ltr"] .dashboard-sidebar {
    direction: ltr;
  }

  .dashboard-sidebar a {
    flex: 0 0 auto;
    scroll-snap-align: center;
  }

  .dashboard-sidebar a[aria-current="location"] {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--green-strong) 20%, transparent);
  }

  .dashboard-sidebar a {
    min-height: 40px;
    padding-inline: 10px;
    font-size: .75rem;
  }

  .dashboard-content > .panel {
    padding: 15px;
  }

  .admin-overview article {
    min-height: 78px;
  }

  .header-actions {
    justify-content: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}

.homepage-section-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.homepage-section-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
}

.homepage-section-details {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

.homepage-section-details strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.homepage-section-details small {
  display: grid;
  width: 25px;
  height: 25px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 6px;
  color: var(--green-strong);
  background: var(--green-soft);
}

.homepage-section-visibility {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: .8rem;
}

.homepage-section-visibility input {
  width: 17px;
  height: 17px;
  accent-color: var(--green-strong);
}

.homepage-section-actions {
  display: flex;
  gap: 5px;
}

body.dark .homepage-section-row {
  border-color: var(--line);
  background: #121a30;
}

@media (max-width: 650px) {
  .homepage-section-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
  }

  .homepage-section-visibility {
    grid-column: 1;
    grid-row: 2;
  }

  .homepage-section-actions {
    grid-column: 2;
    grid-row: 1 / span 2;
  }
}

.semester-admin-list { display: grid; gap: 13px; }
.semester-admin-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--surface);
}
.semester-admin-row > label { display: grid; gap: 6px; font-size: .84rem; font-weight: 700; }
.semester-admin-heading {
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.semester-admin-heading > span, .category-admin-file-count { color: var(--muted); font-size: .8rem; }
.semester-admin-actions { display: flex; flex-wrap: wrap; grid-column: 1 / -1; justify-content: flex-end; gap: 7px; }
.category-info { flex-wrap: wrap; }
.category-admin-file-count { width: 100%; }
.category-cancel-edit { min-height: 48px; }
body.dark .semester-admin-row { border-color: var(--line); background: var(--surface); }

@media (max-width: 650px) {
  .semester-admin-row { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 13px; }
  .semester-admin-heading, .semester-admin-actions { grid-column: 1; }
  .semester-admin-heading { align-items: flex-start; flex-direction: column; }
}