:root {
  --admin-blue: #2f6fed;
  --admin-ink: #16181d;
  --admin-muted: #6e7480;
  --admin-line: #e1e6ef;
  --admin-canvas: #f3f4f6;
  --admin-surface: #fff;
  --admin-font-xs: 12px;
  --admin-font-sm: 13px;
  --admin-font-base: 14px;
  --admin-font-md: 16px;
}

.body--admin-portal {
  overflow-x: hidden;
  background: var(--admin-canvas);
  color: var(--admin-ink);
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: var(--admin-font-base);
  line-height: 1.5;
}

.page.page--admin-portal {
  max-width: none;
  min-height: 100vh;
  margin: 0;
  padding: 0 0 72px;
}

.page--admin-portal > .flash {
  position: fixed;
  z-index: 100;
  top: 76px;
  left: 50%;
  width: auto;
  max-width: calc(100vw - 32px);
  margin: 0;
  padding: 12px 18px;
  border: 1px solid #c9d8ff;
  border-radius: 12px;
  background: #eff4ff;
  box-shadow: 0 10px 30px rgba(23, 32, 52, 0.15);
  color: #204dba;
  font-weight: 700;
  transform: translateX(-50%);
}

.admin-portal-topbar .community-brand {
  flex-basis: 232px;
}

.admin-portal-topbar .community-account {
  flex-basis: 150px;
}

.admin-portal-nav {
  gap: 22px;
}

.admin-portal-logout {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #d9dee8;
  border-radius: 999px;
  background: #fff;
  color: #646a74;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.admin-portal-logout:hover {
  border-color: #b9c9ea;
  color: #2458bd;
}

.admin-portal-mobile-tabs {
  display: none;
}

.admin-portal__content {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding-top: 36px;
}

.admin-portal .admin-head,
.admin-portal-head {
  margin: 0 0 24px;
  padding: 30px 32px;
  border: 1px solid var(--admin-line);
  border-radius: 22px;
  background: linear-gradient(135deg, #fff 0%, #f7f9ff 100%);
  box-shadow: 0 14px 34px rgba(31, 48, 79, 0.07);
}

.admin-portal .admin-head p,
.admin-portal-head > p:first-child,
.admin-portal .reviews-eyebrow {
  margin: 0 0 7px;
  color: var(--admin-blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.13em;
}

.admin-portal .admin-head h1,
.admin-portal-head h1 {
  margin: 0;
  color: var(--admin-ink);
  font-size: clamp(27px, 3vw, 38px);
  letter-spacing: -0.045em;
}

.admin-portal .admin-head span,
.admin-portal-head > p:last-child {
  display: block;
  margin-top: 10px;
  color: var(--admin-muted);
  font-size: 14px;
  line-height: 1.65;
}

.admin-portal .admin-stat-grid {
  gap: 14px;
  margin-bottom: 20px;
}

.admin-recommendation-periods {
  display: flex;
  width: fit-content;
  margin: 0 0 18px;
  padding: 5px;
  align-items: center;
  gap: 5px;
  border-radius: 12px;
  background: #eef1f6;
}

.admin-recommendation-periods > span {
  padding: 0 9px;
  color: var(--admin-muted);
  font-size: 13px;
  font-weight: 850;
}

.admin-portal .admin-recommendation-periods a {
  display: inline-flex;
  min-height: 38px;
  margin: 0;
  padding: 0 13px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 9px;
  color: var(--admin-muted);
  font-size: 14px;
  font-weight: 850;
  text-decoration: none;
}

.admin-portal .admin-recommendation-periods a.is-active {
  border-color: #dbe2ed;
  color: var(--admin-blue);
  background: #fff;
  box-shadow: 0 3px 10px rgba(31, 48, 79, 0.07);
}

.admin-recommendation-date-form {
  display: flex;
  padding-left: 5px;
  align-items: center;
  gap: 6px;
  border-left: 1px solid #d8dee8;
}

.admin-recommendation-date-form input[type="date"] {
  min-height: 38px;
  padding: 0 9px;
  border: 1px solid #d8dee8;
  border-radius: 9px;
  color: var(--admin-ink);
  background: #fff;
  font: inherit;
}

.admin-recommendation-date-form input[type="submit"] {
  min-height: 38px;
  padding: 0 13px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: var(--admin-blue);
  cursor: pointer;
  font-weight: 850;
}

.admin-recommendation-date-error {
  margin: -9px 0 18px;
  color: #b42318;
  font-size: 13px;
  font-weight: 750;
}

.admin-portal .admin-stat-grid--recommendation {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.admin-portal .admin-stat-grid article,
.admin-portal .admin-panel,
.admin-portal .admin-review-panel,
.admin-portal .admin-review-list,
.admin-portal .admin-form-panel,
.admin-portal .table-wrap.admin-portal-table {
  border: 1px solid var(--admin-line);
  border-radius: 18px;
  background: var(--admin-surface);
  box-shadow: 0 8px 26px rgba(31, 48, 79, 0.055);
}

.admin-portal .admin-stat-grid article {
  padding: 21px;
}

.admin-portal .admin-stat-grid strong {
  color: var(--admin-ink);
  font-size: 30px;
  letter-spacing: -0.04em;
}

.admin-portal .admin-panel,
.admin-portal .admin-form-panel {
  padding: 24px;
}

.admin-portal .admin-panel__head h2,
.admin-portal .admin-form-panel h2 {
  color: var(--admin-ink);
  font-size: 20px;
}

.admin-portal .admin-table th {
  padding: 13px 12px;
  border-bottom-color: #dfe5ee;
  color: #657084;
  background: #f5f7fb;
  font-size: 12px;
  font-weight: 900;
}

.admin-portal .admin-table td {
  padding: 15px 12px;
  border-bottom-color: #edf0f4;
  color: #333a45;
}

.admin-portal .admin-table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-portal .admin-table tbody tr:hover {
  background: #fafbfe;
}

.admin-portal a:not(.community-brand):not(.learning-action-link):not(.admin-review-row) {
  text-underline-offset: 3px;
}

.admin-portal .btn--primary,
.admin-portal input[type="submit"].btn--primary {
  width: auto;
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 12px;
  background: var(--admin-blue);
  box-shadow: 0 7px 16px rgba(47, 111, 237, 0.2);
}

.admin-portal .btn--secondary,
.admin-portal input[type="submit"].btn--secondary {
  width: auto;
  min-height: 44px;
  margin-top: 0;
  padding: 11px 18px;
  border-radius: 12px;
}

.admin-portal-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 0 18px;
}

.admin-portal-action-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.admin-portal-action-buttons form {
  margin: 0;
}

.admin-course-management-nav {
  display: flex;
  gap: 8px;
  margin: 0 0 18px;
  padding: 5px;
  border: 1px solid #dfe5ee;
  border-radius: 14px;
  background: #f5f7fb;
}

.admin-course-management-nav a {
  padding: 9px 14px;
  border-radius: 10px;
  color: #526078;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.admin-course-management-nav a:hover,
.admin-course-management-nav a:focus-visible {
  color: var(--admin-blue);
  background: #fff;
}

.admin-course-management-section {
  scroll-margin-top: 96px;
}

.admin-course-management-section + .admin-course-management-section {
  margin-top: 18px;
}

.admin-portal-back {
  color: #526078;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.admin-form-panel .field {
  display: grid;
  gap: 8px;
  margin: 0 0 20px;
}

.admin-form-panel .field > label,
.admin-form-panel .field > span,
.admin-form-panel legend {
  color: #242a33;
  font-size: 14px;
  font-weight: 800;
}

.admin-form-panel .field input[type="text"],
.admin-form-panel .field input[type="number"],
.admin-form-panel .field select,
.admin-form-panel .field textarea {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid #d8dee8;
  border-radius: 11px;
  background: #fff;
  font: inherit;
}

.admin-form-panel fieldset.field {
  padding: 18px;
  border: 1px solid #e0e5ed;
  border-radius: 14px;
  background: #fafbfc;
}

.admin-form-panel .field small {
  color: var(--admin-muted);
  line-height: 1.55;
}

.admin-review-list {
  overflow: hidden;
}

.admin-attendance-panel {
  overflow: hidden;
}

.admin-attendance-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px;
  padding: 14px;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  background: #f8f9fc;
}

.attendance-state {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
}

.attendance-state--submitted {
  border-color: #bfe3ce;
  color: #14733d;
  background: #eefaf3;
}

.attendance-state--historical-import {
  border-color: #cabce7;
  color: #66439a;
  background: #f6f0ff;
}

.attendance-state--late {
  border-color: #f3d49b;
  color: #8a5911;
  background: #fff8e9;
}

.attendance-state--missed {
  border-color: #f0bdbd;
  color: #b22828;
  background: #fff1f1;
}

.attendance-state--not-started {
  border-color: #dfe3e9;
  color: #777e89;
  background: #f5f6f8;
}

.attendance-state--expired {
  border-color: #dfd2c1;
  color: #766652;
  background: #f6f0e8;
}

.attendance-state--unregistered {
  border-color: #d8dce3;
  color: #8a9099;
  background: repeating-linear-gradient(135deg, #f7f8fa, #f7f8fa 4px, #eceff3 4px, #eceff3 8px);
}

.attendance-state--duplicate {
  border-color: #d6c1f4;
  color: #7043a9;
  background: #f8f1ff;
}

.attendance-state--attended {
  border-color: #9fcede;
  color: #14677d;
  background: #eaf8fb;
}

.admin-attendance-list,
.admin-attendance-courses {
  display: grid;
  gap: 16px;
}

.admin-attendance-member {
  min-width: 0;
  padding: 20px;
  border: 1px solid #e0e5ed;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(31, 48, 79, 0.045);
}

.admin-attendance-member.is-attention {
  border-color: #efc1a8;
  box-shadow: inset 4px 0 #ed7f43, 0 7px 22px rgba(119, 63, 32, 0.07);
}

.admin-attendance-member__head,
.admin-attendance-course > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.admin-attendance-member__identity {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
}

.admin-attendance-member__identity > div {
  min-width: 0;
}

.admin-attendance-member__identity h3,
.admin-attendance-course h4 {
  margin: 0;
  color: #20242b;
  letter-spacing: -0.025em;
}

.admin-attendance-member__identity h3 {
  font-size: 19px;
}

.admin-attendance-member__identity p {
  overflow: hidden;
  margin: 5px 0 0;
  color: #737b87;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-attendance-member__alerts {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.admin-channel-conversation {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 15px;
}

.admin-channel-conversation form {
  flex: 0 0 auto;
}

.admin-channel-conversation span {
  color: #77818e;
  font-size: 12px;
}

.admin-channel-conversation__button {
  padding: 10px 15px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #315f91;
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.admin-attendance-member .badge--danger {
  color: #aa2727;
  background: #fff0f0;
}

.admin-attendance-member .badge--warning {
  color: #855210;
  background: #fff5df;
}

.admin-attendance-member__meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 17px;
}

.admin-attendance-member__meta > div {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid #e7eaf0;
  border-radius: 12px;
  background: #fafbfc;
}

.admin-attendance-member__meta span,
.admin-attendance-member__meta strong,
.admin-attendance-member__meta small {
  display: block;
}

.admin-attendance-member__meta span {
  margin-bottom: 6px;
  color: #7a828f;
  font-size: 11px;
  font-weight: 850;
}

.admin-attendance-member__meta strong {
  overflow-wrap: anywhere;
  color: #252a32;
  font-size: 13px;
}

.admin-attendance-member__meta small {
  margin-top: 5px;
  color: #858c96;
  font-size: 11px;
  line-height: 1.45;
}

.admin-attendance-courses {
  margin-top: 18px;
}

.admin-attendance-course {
  min-width: 0;
  padding: 16px;
  border: 1px solid #e3e7ed;
  border-radius: 14px;
  background: #fbfcfe;
}

.admin-attendance-course h4 {
  font-size: 15px;
}

.admin-attendance-course header > div > span {
  display: block;
  margin-top: 4px;
  color: #7a828f;
  font-size: 11px;
}

.admin-attendance-week-scroll {
  overflow-x: auto;
  max-width: 100%;
  margin-top: 13px;
  padding-bottom: 6px;
  overscroll-behavior-x: contain;
  scrollbar-color: #c7cfdb transparent;
}

.admin-attendance-week-scroll:focus-visible {
  border-radius: 9px;
  outline: 2px solid #7ea3ef;
  outline-offset: 3px;
}

.admin-attendance-mobile-progress {
  display: none;
}

.admin-attendance-matrix {
  display: grid;
  gap: 7px;
  width: max-content;
  min-width: 100%;
}

.admin-attendance-matrix__row {
  display: grid;
  grid-template-columns: 72px max-content;
  align-items: stretch;
  gap: 7px;
}

.admin-attendance-row-label {
  position: sticky;
  left: 0;
  z-index: 1;
  display: grid;
  min-height: 58px;
  padding: 7px;
  border: 1px solid #d7dde6;
  border-radius: 9px;
  color: #424b58;
  background: #f6f8fb;
  box-shadow: 5px 0 9px rgba(40, 53, 75, 0.08);
  font-size: 11px;
  text-align: center;
  place-content: center;
}

.admin-attendance-week-grid {
  display: grid;
  grid-template-columns: repeat(24, 52px);
  gap: 5px;
  width: max-content;
}

.attendance-week {
  display: grid;
  min-height: 58px;
  padding: 7px 4px;
  border: 1px solid #dde2e9;
  border-radius: 9px;
  background: #fff;
  text-align: center;
  place-content: center;
}

.attendance-week span {
  color: #757d89;
  font-size: 10px;
  font-weight: 800;
}

.attendance-week strong {
  margin-top: 4px;
  color: #626a76;
  font-size: 18px;
}

.attendance-week--submitted {
  border-color: #acd9bd;
  background: #edf9f1;
}

.attendance-week--attended {
  border-color: #9fcede;
  background: #eaf8fb;
}

.attendance-week--attended strong {
  color: #14677d;
}

.attendance-week--unrecorded {
  border-color: #e2e5ea;
  background: #f7f8fa;
}

.attendance-week--unrecorded strong {
  color: #a0a6af;
}

.attendance-week--submitted strong {
  color: #178047;
}

.attendance-week--historical-import {
  border-color: #c9b7e7;
  background: #f6efff;
}

.attendance-week--historical-import strong {
  color: #6e47a3;
}

.attendance-week--late {
  border-color: #efcd8e;
  background: #fff7e6;
}

.attendance-week--late strong {
  color: #9a620e;
}

.attendance-week--missed {
  border-color: #ecb0b0;
  background: #fff0f0;
}

.attendance-week--missed strong {
  color: #bd2f2f;
}

.attendance-week--available {
  border-color: #b2c9ef;
  background: #eef4ff;
}

.attendance-week--available strong {
  color: #2e67c5;
}

.attendance-week--not-started {
  background: #f3f4f6;
}

.attendance-week--duplicate {
  border-color: #cfb3f0;
  background: #f7efff;
}

.attendance-week--duplicate strong {
  color: #7747ad;
}

.admin-attendance-no-course {
  margin: 17px 0 0;
  padding: 15px;
  border-radius: 12px;
  color: #777f8a;
  background: #f5f6f8;
  font-size: 13px;
  text-align: center;
}

.admin-attendance-import-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 32px;
  margin-left: auto;
  padding: 6px 10px;
  border: 1px solid #cbd4e2;
  border-radius: 9px;
  color: #304c76;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.admin-head--with-action {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}

.admin-primary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 11px;
  color: #fff;
  background: #243a5a;
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}

.admin-historical-import-list {
  display: grid;
  gap: 10px;
}

.admin-historical-import-row {
  display: grid;
  grid-template-columns: minmax(260px, 1.5fr) minmax(160px, .7fr) minmax(160px, .7fr) auto;
  align-items: center;
  gap: 18px;
  padding: 16px;
  border: 1px solid #e0e5ed;
  border-radius: 14px;
  background: #fff;
}

.admin-historical-import-row.is-canceled {
  opacity: .72;
  background: #f7f8fa;
}

.admin-historical-import-row > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-historical-import-row > div:first-child {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: 9px;
}

.admin-historical-import-row > div:first-child small {
  grid-column: 1 / -1;
}

.admin-historical-import-row span,
.admin-historical-import-row small {
  color: #727b88;
  font-size: 12px;
}

.admin-historical-import-row b,
.admin-historical-import-row strong {
  overflow-wrap: anywhere;
  color: #29384d;
  font-size: 13px;
}

.admin-historical-import-form {
  width: 100%;
  min-width: 0;
  max-width: 900px;
}

.admin-historical-import-form .learning-field {
  display: grid;
  gap: 8px;
}

.admin-historical-import-form .learning-field > label {
  color: #252931;
  font-size: 14px;
  font-weight: 850;
}

.admin-historical-import-form .learning-field > small {
  color: #798391;
  font-size: 12px;
  line-height: 1.55;
}

.admin-historical-import-form select,
.admin-historical-import-form input[type="datetime-local"],
.admin-historical-import-form input[type="file"] {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.admin-historical-import-form select,
.admin-historical-import-form input[type="datetime-local"] {
  min-height: 46px;
  padding: 9px 11px;
  border: 1px solid #d8dee8;
  border-radius: 11px;
  background: #fff;
  font: inherit;
}

.admin-historical-import-form input[type="file"] {
  overflow: hidden;
  padding: 9px;
  border: 1px dashed #cbd4e2;
  border-radius: 10px;
  background: #fff;
  font-size: 12px;
}

.admin-historical-import-files,
.admin-historical-import-reply {
  display: grid;
  gap: 14px;
  margin: 4px 0;
  padding: 18px;
  border: 1px solid #dfe5ee;
  border-radius: 14px;
  background: #f8fafc;
}

.admin-historical-import-files legend,
.admin-historical-import-reply legend {
  padding: 0 7px;
  color: #2d405e;
  font-size: 14px;
  font-weight: 850;
}

.admin-historical-import-files legend small,
.admin-historical-import-reply legend small,
.admin-historical-import-files > p {
  color: #798391;
  font-size: 11px;
  font-weight: 600;
}

.admin-historical-import-detail-head {
  margin-bottom: 24px;
}

.feedback-admin-reply hr {
  width: 100%;
  margin: 24px 0;
  border: 0;
  border-top: 1px solid #e0e5ed;
}

.admin-danger-button {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d88e8e;
  border-radius: 10px;
  color: #a12828;
  background: #fff5f5;
  font-weight: 850;
  cursor: pointer;
}

.admin-login-shell {
  display: grid;
  min-height: calc(100vh - 64px);
  padding: 56px 20px;
  place-items: start center;
}

.admin-login-shell .admin-login {
  width: min(100%, 500px);
  padding: 38px;
  border: 1px solid var(--admin-line);
  border-radius: 24px;
  box-shadow: 0 20px 55px rgba(27, 43, 70, 0.1);
}

.admin-login-shell .admin-login__head span {
  letter-spacing: 0.14em;
}

.admin-login-portal__scope {
  color: #747b87;
  font-size: 12px;
  font-weight: 800;
}

.admin-login-shell .admin-login__form input[type="text"],
.admin-login-shell .admin-login__form input[type="password"] {
  min-height: 52px;
  border-color: #d8dee8;
  border-radius: 12px;
}

.admin-login-shell .admin-login__form input[type="submit"] {
  min-height: 52px;
  border-radius: 12px;
  background: var(--admin-blue);
  box-shadow: 0 9px 20px rgba(47, 111, 237, 0.22);
}

.admin-login__secondary-link {
  display: block;
  margin-top: 20px;
  color: #53627a;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  text-underline-offset: 3px;
}

.admin-login__form label small {
  color: var(--admin-muted);
  font-size: 12px;
  line-height: 1.5;
}

.admin-registration-table td strong,
.admin-registration-history td strong {
  display: block;
}

.admin-registration-table td small,
.admin-registration-history td small {
  display: block;
  margin-top: 4px;
  color: var(--admin-muted);
}

.admin-registration-actions,
.admin-registration-actions form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-registration-actions select {
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid #d8dee8;
  border-radius: 10px;
  background: #fff;
}

.admin-registration-reject {
  min-height: 42px;
  padding: 8px 13px;
  border: 1px solid #e2b8b8;
  border-radius: 10px;
  color: #a33a3a;
  background: #fff;
  cursor: pointer;
  font-weight: 800;
}

.admin-registration-history {
  margin-top: 20px;
}

.admin-dashboard-grid--recommendation {
  margin-top: 18px;
}

.admin-recommendation-records {
  display: grid;
  gap: 14px;
}

.admin-recommendation-record {
  overflow: hidden;
  border: 1px solid var(--admin-line);
  border-radius: 16px;
  background: #fbfcfe;
}

.admin-recommendation-record__head {
  display: flex;
  padding: 18px 20px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid #e9edf3;
  background: #fff;
}

.admin-recommendation-record__head h3 {
  margin: 5px 0 0;
  color: var(--admin-ink);
  font-size: 19px;
  letter-spacing: -0.025em;
}

.admin-recommendation-record__head span,
.admin-recommendation-record__member span {
  color: var(--admin-muted);
  font-size: 12px;
}

.admin-recommendation-record__member {
  display: grid;
  min-width: 190px;
  justify-items: end;
  gap: 4px;
  text-align: right;
}

.admin-recommendation-record__answers {
  display: grid;
  padding: 18px 20px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-recommendation-record__answers > div {
  display: grid;
  padding: 12px 14px;
  border: 1px solid #e5eaf1;
  border-radius: 12px;
  background: #fff;
  gap: 6px;
}

.admin-recommendation-record__answers strong {
  color: #667085;
  font-size: 12px;
}

.admin-recommendation-record__answers span {
  color: #252b35;
  font-size: 14px;
  line-height: 1.55;
}

.admin-recommendation-copy {
  margin: 0 20px 20px;
  border: 1px solid #cfdbf4;
  border-radius: 13px;
  background: #fff;
}

.admin-recommendation-copy > summary {
  display: flex;
  padding: 14px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #234a9f;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
}

.admin-recommendation-copy > summary strong {
  color: #64748b;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
}

.admin-recommendation-copy__keys {
  display: flex;
  padding: 14px 16px;
  flex-wrap: wrap;
  gap: 7px;
  border-top: 1px solid #e7edf8;
  background: #f7f9fe;
}

.admin-recommendation-copy code,
.admin-recommendation-copy__keys code {
  border-radius: 6px;
  color: #315aaf;
  background: #edf3ff;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
}

.admin-recommendation-copy__keys code {
  padding: 5px 7px;
}

.admin-recommendation-copy__sections {
  display: grid;
  padding: 16px;
  gap: 12px;
}

.admin-recommendation-copy__sections section {
  padding: 15px;
  border: 1px solid #e7eaf0;
  border-radius: 11px;
}

.admin-recommendation-copy__sections section > span {
  color: #758096;
  font-size: 11px;
  font-weight: 800;
}

.admin-recommendation-copy__sections h4 {
  margin: 8px 0 0;
  color: #242a34;
  font-size: 15px;
  line-height: 1.55;
}

.admin-recommendation-copy__sections p {
  margin: 7px 0 0;
  color: #4b5565;
  font-size: 14px;
  line-height: 1.75;
}

.admin-recommendation-record__unavailable,
.admin-panel-note {
  margin: 0;
  color: var(--admin-muted);
  font-size: 13px;
  line-height: 1.65;
}

.admin-recommendation-record__unavailable {
  margin: 0 20px 20px;
}

.admin-panel-note {
  margin-top: 14px;
}

.admin-seat-capacity-form {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 0;
}

.admin-seat-capacity-form input[type="number"] {
  width: 92px;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid #d8dee8;
  border-radius: 10px;
  background: #fff;
  font: inherit;
}

.admin-seat-capacity-form input[type="submit"] {
  min-height: 40px;
  padding: 8px 13px;
}

.admin-integrity-warning {
  margin: 16px 0;
  padding: 14px 16px;
  border: 1px solid #f1cf8b;
  border-radius: 12px;
  color: #75500c;
  background: #fff9ea;
  font-size: 13px;
}

.admin-integrity-warning ul {
  margin: 8px 0 0;
  padding-left: 20px;
}

.admin-recommendation-archive {
  margin-top: 18px;
  border: 1px solid #d8dde6;
  border-radius: 18px;
  background: #eceff4;
}

.admin-recommendation-archive > summary {
  display: flex;
  padding: 20px 24px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #3d4655;
  cursor: pointer;
  font-size: 16px;
  font-weight: 900;
}

.admin-recommendation-archive > summary strong {
  color: #747d8c;
  font-size: 13px;
}

.admin-recommendation-archive__body {
  display: grid;
  padding: 0 18px 18px;
  gap: 16px;
}

.admin-recommendation-archive__body > .admin-panel-note {
  margin: 0;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.72);
}

.admin-recommendation-archive__body .admin-panel {
  box-shadow: none;
}

.admin-member-board-panel {
  overflow: hidden;
}

.admin-member-board {
  overflow: hidden;
  border: 1px solid #e1e6ee;
  border-radius: 14px;
  background: #fff;
}

.admin-member-board__header,
.admin-member-board__row {
  display: grid;
  grid-template-columns: minmax(230px, 1.4fr) repeat(3, minmax(125px, 0.72fr)) minmax(175px, auto) 112px;
  align-items: center;
  gap: 12px;
}

.admin-member-board__header {
  min-height: 44px;
  padding: 0 16px;
  border-bottom: 1px solid #e3e7ee;
  color: #747d89;
  background: #f6f8fb;
  font-size: 11px;
  font-weight: 850;
}

.admin-member-board__row {
  min-width: 0;
  padding: 14px 16px;
  border-bottom: 1px solid #e8ebf0;
}

.admin-member-board__row:last-child {
  border-bottom: 0;
}

.admin-member-board__row:hover {
  background: #fafbfc;
}

.admin-member-board__identity {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  gap: 10px;
}

.admin-member-board__identity > div {
  min-width: 0;
}

.admin-member-board__identity strong,
.admin-member-board__identity small {
  display: block;
}

.admin-member-board__identity strong {
  color: #252a32;
  font-size: 14px;
}

.admin-member-board__identity small {
  overflow: hidden;
  margin-top: 3px;
  color: #7a828e;
  font-size: 11px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-member-board__alerts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}

.admin-member-board__alerts .badge {
  min-height: 23px;
  padding: 3px 7px;
  font-size: 10px;
  font-style: normal;
}

.admin-member-board__alerts .badge--danger {
  color: #aa2727;
  background: #fff0f0;
}

.admin-member-board__alerts .badge--warning {
  color: #855210;
  background: #fff5df;
}

.admin-member-board__time {
  min-width: 0;
}

.admin-member-board__time strong {
  color: #444b56;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.admin-member-board__detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-member-board__detail-button {
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid #cad4e2;
  border-radius: 9px;
  color: #304c76;
  background: #fff;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}

.admin-member-board__detail-button:hover {
  border-color: #9eb2ce;
  background: #f5f8fc;
}

.admin-member-board__channel form {
  margin: 0;
}

.admin-member-board__channel .admin-channel-conversation__button {
  width: 100%;
  min-height: 36px;
  padding: 8px 10px;
  white-space: nowrap;
}

.admin-member-dialog {
  width: min(1120px, calc(100vw - 36px));
  max-width: none;
  max-height: calc(100dvh - 36px);
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(20, 31, 50, 0.28);
}

.admin-member-dialog::backdrop {
  background: rgba(24, 31, 43, 0.52);
  backdrop-filter: blur(3px);
}

.admin-member-dialog__surface {
  display: grid;
  max-height: calc(100dvh - 36px);
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.admin-member-dialog__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px 16px;
}

.admin-member-dialog__head span {
  color: #70809a;
  font-size: 11px;
  font-weight: 850;
}

.admin-member-dialog__head h2 {
  margin: 4px 0 0;
  color: #20252d;
  font-size: 22px;
}

.admin-member-dialog__head p {
  margin: 6px 0 0;
  color: #747d89;
  font-size: 13px;
}

.admin-member-dialog__close {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid #dfe4eb;
  border-radius: 999px;
  color: #626b77;
  background: #fff;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
  place-items: center;
}

.admin-member-dialog > .admin-member-dialog__surface > .admin-attendance-legend {
  margin: 0 24px 14px;
  padding: 10px 12px;
}

.admin-member-dialog__courses {
  display: grid;
  overflow-y: auto;
  padding: 0 24px 22px;
  gap: 12px;
}

.admin-member-dialog__course {
  min-width: 0;
  padding: 15px;
  border: 1px solid #e2e7ef;
  border-radius: 13px;
  background: #fbfcfe;
}

.admin-member-dialog__course > header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-member-dialog__course > header > div {
  min-width: 0;
}

.admin-member-dialog__course h3 {
  margin: 0;
  color: #252b34;
  font-size: 15px;
}

.admin-member-dialog__course header div > span {
  display: block;
  margin-top: 4px;
  color: #7a828f;
  font-size: 11px;
}

.admin-member-dialog__course .admin-attendance-import-link {
  margin-left: auto;
}

.admin-member-dialog__footer {
  display: flex;
  justify-content: flex-end;
  padding: 13px 24px;
  border-top: 1px solid #e6e9ee;
  background: #fafbfc;
}

.admin-member-dialog__footer button {
  min-width: 80px;
  min-height: 38px;
  padding: 8px 14px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #33445f;
  font-weight: 850;
  cursor: pointer;
}

@media (max-width: 1040px) {
  .admin-portal-topbar .community-brand,
  .admin-portal-topbar .community-account {
    flex-basis: auto;
  }

  .admin-portal-nav {
    gap: 14px;
  }

  .admin-portal-nav a {
    font-size: 12px;
  }
}

.admin-live-attendance-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}

.admin-live-attendance-refresh {
  display: inline-flex;
  min-height: 42px;
  padding: 10px 15px;
  border: 0;
  border-radius: 10px;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: #275d88;
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
}

.admin-live-attendance-refresh:disabled {
  opacity: 0.58;
  cursor: wait;
}

.admin-live-attendance-head > form {
  margin: 0;
}

.admin-live-attendance-source {
  display: flex;
  margin-bottom: 18px;
  padding: 15px 17px;
  border: 1px solid #c9dfeb;
  border-radius: 14px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: #23566b;
  background: #eff9fc;
}

.admin-live-attendance-source strong,
.admin-live-attendance-source span {
  display: block;
}

.admin-live-attendance-source strong {
  font-size: 14px;
}

.admin-live-attendance-source span,
.admin-live-attendance-source p {
  margin: 3px 0 0;
  font-size: 12px;
}

.admin-live-attendance-source.has-error {
  border-color: #efd1ae;
  color: #805324;
  background: #fff8ed;
}

.admin-live-attendance-sync-failure {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

.admin-live-attendance-sync-failure .admin-live-attendance-refresh {
  min-height: 36px;
  padding: 7px 12px;
  white-space: nowrap;
}

.admin-attendance-scope-tabs {
  display: flex;
  margin: 0 0 18px;
  gap: 8px;
}

.admin-attendance-scope-tabs a {
  display: inline-flex;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid #d8dee7;
  border-radius: 11px;
  align-items: center;
  gap: 9px;
  color: #596575;
  background: #fff;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
}

.admin-attendance-scope-tabs a strong {
  min-width: 25px;
  padding: 3px 6px;
  border-radius: 999px;
  color: #6b7785;
  background: #edf1f5;
  font-size: 10px;
  text-align: center;
}

.admin-attendance-scope-tabs a.is-active {
  border-color: #2d6d8a;
  color: #1e5973;
  background: #eef8fc;
}

.admin-attendance-scope-tabs a.is-active strong {
  color: #fff;
  background: #2d6d8a;
}

.admin-live-course-summary {
  display: grid;
  margin: 18px 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-live-course-summary article {
  padding: 16px;
  border: 1px solid #e1e6ed;
  border-radius: 14px;
  background: #fff;
}

.admin-live-course-summary span,
.admin-live-course-summary small {
  display: block;
}

.admin-live-course-summary span {
  min-height: 34px;
  color: #68717e;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
}

.admin-live-course-summary strong {
  display: block;
  margin: 8px 0 5px;
  color: #1f5e76;
  font-size: 28px;
}

.admin-live-course-summary small {
  color: #848c97;
  font-size: 11px;
}

.admin-live-attendance-panel {
  overflow: hidden;
}

.admin-live-attendance-toolbar {
  align-items: end;
}

.admin-live-attendance-toolbar__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}

.admin-historical-record-mode {
  display: inline-flex;
  min-height: 39px;
  padding: 7px 10px;
  border: 1px solid #cfd7e1;
  border-radius: 9px;
  align-items: center;
  gap: 7px;
  color: #5d6875;
  background: #f7f9fb;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}

.admin-historical-record-mode strong {
  min-width: 31px;
  padding: 3px 5px;
  border-radius: 5px;
  color: #fff;
  background: #778391;
  font-size: 10px;
  text-align: center;
}

.admin-historical-record-mode.is-active {
  border-color: #d89239;
  color: #794b13;
  background: #fff4df;
  box-shadow: 0 0 0 2px rgb(216 146 57 / 14%);
}

.admin-historical-record-mode.is-active strong {
  background: #c97512;
}

.admin-live-attendance-filter {
  display: flex;
  align-items: center;
  gap: 7px;
}

.admin-live-attendance-filter select,
.admin-live-attendance-filter input[type="search"] {
  min-height: 39px;
  padding: 8px 10px;
  border: 1px solid #d6dce5;
  border-radius: 9px;
  background: #fff;
  font: inherit;
  font-size: 12px;
}

.admin-live-attendance-filter input[type="submit"],
.admin-live-attendance-filter button[type="submit"] {
  min-height: 39px;
  padding: 8px 13px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #344f75;
  font-weight: 850;
  cursor: pointer;
}

.admin-live-attendance-filter a {
  color: #68788f;
  font-size: 12px;
}

.admin-live-attendance-course + .admin-live-attendance-course {
  margin-top: 25px;
  padding-top: 25px;
  border-top: 1px solid #e5e9ef;
}

.admin-live-attendance-course > header {
  display: flex;
  margin-bottom: 11px;
  align-items: center;
  justify-content: space-between;
}

.admin-live-attendance-course h3 {
  margin: 0;
  color: #252b34;
  font-size: 16px;
}

.admin-live-attendance-course header span {
  display: block;
  margin-top: 4px;
  color: #7b8490;
  font-size: 11px;
}

.admin-attendance-course-toggle {
  flex: 0 0 auto;
  margin-left: 16px;
  padding: 8px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.admin-attendance-course-toggle:hover,
.admin-attendance-course-toggle:focus-visible {
  background: #f1f5f9;
  outline: 2px solid #94a3b8;
  outline-offset: 2px;
}

.admin-attendance-course-body[hidden] {
  display: none;
}

.admin-live-attendance-table-wrap {
  overflow: auto;
  max-height: 560px;
  border: 1px solid #dfe4eb;
  border-radius: 12px;
}

.admin-live-attendance-table {
  width: 100%;
  min-width: 980px;
  border-spacing: 0;
  border-collapse: separate;
  color: #303742;
  font-size: 12px;
}

.admin-live-attendance-table th,
.admin-live-attendance-table td {
  padding: 9px 8px;
  border-right: 1px solid #e8ebf0;
  border-bottom: 1px solid #e8ebf0;
  background: #fff;
  text-align: center;
  white-space: nowrap;
}

.admin-live-attendance-table thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  color: #596473;
  background: #f5f7fa;
  font-size: 11px;
}

.secret-lesson-mark {
  display: flex;
  min-height: 76px;
  padding: 8px 5px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.secret-lesson-count {
  display: block;
  margin-top: 4px;
  color: var(--admin-muted);
}

.secret-lesson-coupon small,
.secret-lesson-cta-clicks small {
  display: block;
  margin-top: 4px;
  color: var(--admin-muted);
  font-size: 11px;
}

.secret-lesson-coupon-status {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 6px;
  color: var(--admin-muted);
  background: #f1f3f6;
}

.secret-lesson-coupon-status.is-available {
  color: #1d4ed8;
  background: #eff6ff;
}

.secret-lesson-coupon-status.is-used {
  color: #166534;
  background: #f0fdf4;
}

.secret-lesson-coupon-status.is-expired {
  color: #b91c1c;
}

.admin-live-attendance-sort {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
  padding: 2px 3px;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}

.admin-live-attendance-sort:hover,
.admin-live-attendance-sort:focus-visible {
  color: #28647e;
}

.admin-live-attendance-sort__indicator {
  color: #7a8796;
  font-size: 12px;
}

.admin-live-attendance-table th[aria-sort="ascending"] .admin-live-attendance-sort,
.admin-live-attendance-table th[aria-sort="descending"] .admin-live-attendance-sort,
.admin-attendance-members-table th[aria-sort="ascending"] .admin-live-attendance-sort,
.admin-attendance-members-table th[aria-sort="descending"] .admin-live-attendance-sort {
  color: #165e75;
}

.admin-live-attendance-table th:first-child {
  position: sticky;
  z-index: 1;
  left: 0;
  min-width: 220px;
  text-align: left;
}

.admin-live-attendance-table thead th:first-child {
  z-index: 3;
  background: #f5f7fa;
}

.admin-live-attendance-table tbody th:first-child {
  box-shadow: 5px 0 10px rgba(38, 52, 73, 0.06);
}

.admin-live-attendance-table tbody th strong,
.admin-live-attendance-table tbody th span,
.admin-live-attendance-table tbody th small {
  display: block;
}

.admin-live-attendance-table tbody th span,
.admin-live-attendance-table tbody th small {
  overflow: hidden;
  max-width: 220px;
  margin-top: 2px;
  color: #7a838f;
  font-size: 10px;
  text-overflow: ellipsis;
}

.admin-live-attendance-table tbody th strong .attendance-member-inline-nickname {
  display: inline;
  max-width: none;
  margin: 0;
  color: #28647e;
  font-size: inherit;
  font-weight: 850;
}

.admin-live-attendance-table tbody th .attendance-member-name-line {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  max-width: 220px;
}

.attendance-member-channel-talk-form {
  display: inline-flex;
  flex: 0 0 auto;
  margin: 0;
}

.admin-live-attendance-table tbody th .attendance-member-channel-talk-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 6px;
  color: #fff;
  background: #202124;
  box-shadow: 0 1px 2px rgba(25, 30, 36, 0.22);
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.admin-live-attendance-table tbody th .attendance-member-channel-talk-icon:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 7px rgba(25, 30, 36, 0.28);
}

.admin-live-attendance-table tbody th .attendance-member-channel-talk-icon:focus-visible {
  outline: 2px solid #7ea3ef;
  outline-offset: 2px;
}

.admin-live-attendance-table tbody th .attendance-member-channel-talk-icon svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
}

.admin-live-attendance-table tbody th .attendance-enrollment-status {
  display: inline-flex;
  width: fit-content;
  margin-top: 5px;
  padding: 2px 6px;
  border-radius: 999px;
  color: #765c36;
  background: #f3eadc;
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
}

.admin-attendance-members-panel {
  overflow: hidden;
}

.admin-attendance-members-table td:first-child {
  min-width: 220px;
}

.attendance-member-course-list {
  display: flex;
  max-width: 420px;
  flex-wrap: wrap;
  gap: 5px;
}

.attendance-member-course-list span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #526071;
  background: #eef2f7;
  font-size: 10px;
  font-weight: 800;
}

.attendance-member-course em {
  padding: 2px 5px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  font-size: 9px;
  font-style: normal;
}

.admin-live-attendance-table tbody th .attendance-member-memberships span {
  display: inline-flex;
  max-width: 220px;
  margin: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  color: #526071;
}

.attendance-member-course--expired {
  color: #6d737d !important;
  background: #eceef1 !important;
}

.attendance-member-course--canceled,
.attendance-member-course--cancel_scheduled {
  color: #8a5315 !important;
  background: #fff0dc !important;
}

.attendance-member-course--refunded {
  color: #9b3030 !important;
  background: #fde8e8 !important;
}

.attendance-member-course--needs_review {
  color: #67428e !important;
  background: #f2e9fb !important;
}

.attendance-member-course--unknown {
  color: #7a838f !important;
  background: #f1f3f6 !important;
}

.attendance-member-nickname-form {
  display: grid;
  width: 190px;
  min-width: 190px;
  grid-template-columns: minmax(100px, 1fr) auto;
  gap: 6px;
}

.attendance-member-nickname-form input[type="text"] {
  min-width: 0;
  height: 38px;
  padding: 7px 10px;
  border: 1px solid #d3d9e2;
  border-radius: 9px;
  background: #fff;
  font: inherit;
  font-size: 12px;
}

.attendance-member-nickname-form input[type="text"]:focus {
  border-color: #32739f;
  outline: 2px solid rgba(50, 115, 159, 0.15);
}

.attendance-member-nickname-form input[type="submit"] {
  height: 38px;
  padding: 7px 13px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #52677f;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}

.attendance-member-nickname-form input[type="submit"]:disabled {
  cursor: wait;
  opacity: 0.65;
}

.attendance-member-save-toast {
  position: fixed;
  z-index: 110;
  bottom: 28px;
  left: 50%;
  width: max-content;
  max-width: calc(100vw - 32px);
  margin: 0;
  padding: 12px 18px;
  border: 1px solid #bcd8c6;
  border-radius: 12px;
  color: #1e6a38;
  background: #edf8f1;
  box-shadow: 0 10px 30px rgba(23, 32, 52, 0.18);
  font-size: 13px;
  font-weight: 800;
  transform: translateX(-50%);
  transition: opacity 0.2s ease;
}

.attendance-member-save-toast.is-error {
  border-color: #efc2c2;
  color: #a52b2b;
  background: #fff0f0;
}

.attendance-member-save-toast.is-dismissing {
  opacity: 0;
}

.attendance-member-channel form {
  margin: 0;
}

.attendance-member-channel__button {
  min-width: 68px;
  height: 36px;
  padding: 7px 12px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #315f91;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
  cursor: pointer;
}

.attendance-member-channel__button.is-disabled {
  color: #858d98;
  background: #e8ebef;
  cursor: default;
}

.live-attendance-cell {
  min-width: 88px;
  padding: 0 !important;
}

.live-attendance-cell__button {
  display: flex;
  width: 100%;
  min-width: 88px;
  min-height: 92px;
  padding: 7px 5px;
  align-items: center;
  border: 0;
  color: inherit;
  background: transparent;
  flex-direction: column;
  font: inherit;
  justify-content: center;
  cursor: pointer;
}

.live-attendance-cell__button:hover,
.live-attendance-cell__button:focus-visible {
  outline: 2px solid #32739f;
  outline-offset: -2px;
  background: rgba(255, 255, 255, 0.6);
}

.live-attendance-cell strong,
.live-attendance-cell small {
  display: block;
}

.live-attendance-cell strong {
  font-size: 16px;
}

.live-attendance-cell small {
  margin-top: 2px;
  font-size: 9px;
}

.live-attendance-timing {
  display: grid;
  width: 78px;
  margin-top: 3px;
  gap: 1px;
}

.live-attendance-timing .live-attendance-date {
  display: grid;
  margin: 0;
  align-items: center;
  gap: 4px;
  grid-template-columns: minmax(0, 1fr) auto;
  font-size: 8px;
  line-height: 1.3;
  white-space: nowrap;
}

.live-attendance-date > span:first-child {
  overflow: hidden;
  opacity: 0.78;
  text-align: left;
  text-overflow: ellipsis;
}

.live-attendance-date time,
.live-attendance-date__empty {
  font-variant-numeric: tabular-nums;
  font-weight: 850;
  text-align: right;
}

.live-attendance-opened-date.is-empty {
  opacity: 0.72;
}

.live-attendance-cell--attended {
  color: #126c47;
  background: #ebf8f1 !important;
}

.live-attendance-cell--absent {
  color: #b33232;
  background: #fff1f1 !important;
}

.live-attendance-cell--not_started {
  color: #9ba2ac;
  background: #f7f8fa !important;
}

.live-attendance-cell--expired {
  color: #8a7b69;
  background: #f6f2ec !important;
}

.live-attendance-cell--unregistered {
  color: #8f96a0;
  background: repeating-linear-gradient(135deg, #f8f9fa, #f8f9fa 5px, #eceff2 5px, #eceff2 10px) !important;
}

.live-attendance-cell--unknown,
.live-attendance-cell--needs_review,
.admin-live-attendance-table tr.has-error th:first-child {
  color: #7650a1;
  background: #f8f1ff !important;
}

.live-attendance-record-badges {
  display: flex;
  width: 82px;
  margin-top: 4px;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 2px;
}

.live-attendance-record-badge {
  padding: 2px 3px;
  border-radius: 3px;
  color: #fff;
  font-size: 8px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.live-attendance-record-badge[hidden] {
  display: none;
}

.live-attendance-record-badge--assignment {
  background: #397aa5;
}

.live-attendance-record-badge--feedback {
  background: #7957a6;
}

.live-record-dialog {
  width: min(920px, calc(100vw - 36px));
  max-width: none;
  max-height: calc(100dvh - 36px);
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(20, 31, 50, 0.28);
}

.live-record-dialog::backdrop {
  background: rgba(24, 31, 43, 0.52);
  backdrop-filter: blur(3px);
}

.live-record-dialog__surface {
  overflow-y: auto;
  max-height: calc(100dvh - 36px);
}

.live-record-dialog__head {
  display: flex;
  padding: 22px 24px 16px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.live-record-dialog__head span {
  color: #70809a;
  font-size: 11px;
  font-weight: 850;
}

.live-record-dialog__head h2 {
  margin: 4px 0 0;
  color: #20252d;
  font-size: 22px;
}

.live-record-dialog__head p {
  margin: 6px 0 0;
  color: #747d89;
  font-size: 13px;
}

.live-record-dialog__close {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid #dfe4eb;
  border-radius: 999px;
  color: #626b77;
  background: #fff;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
  place-items: center;
}

.live-record-dialog__notice {
  margin: 0 24px 14px;
  padding: 10px 12px;
  border: 1px solid #c9dfeb;
  border-radius: 10px;
  color: #23566b;
  background: #eff9fc;
  font-size: 12px;
}

.live-record-dialog__forms {
  display: grid;
  padding: 0 24px 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.live-record-form {
  min-width: 0;
  padding: 16px;
  border: 1px solid #e0e5ec;
  border-radius: 13px;
  background: #fbfcfe;
}

.live-record-form__head {
  display: flex;
  margin-bottom: 15px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.live-record-form__head h3,
.live-record-form__head p {
  margin: 0;
}

.live-record-form__head h3 {
  color: #28313d;
  font-size: 15px;
}

.live-record-form__head p {
  margin-top: 4px;
  color: #7a8491;
  font-size: 11px;
  line-height: 1.45;
}

.live-record-form__kind {
  flex: 0 0 auto;
  padding: 4px 6px;
  border-radius: 5px;
  color: #fff;
  font-size: 9px;
  font-weight: 850;
}

.live-record-form__kind--assignment {
  background: #397aa5;
}

.live-record-form__kind--feedback {
  background: #7957a6;
}

.live-record-board {
  overflow-y: auto;
  min-height: 84px;
  max-height: 230px;
  margin-bottom: 10px;
  border: 1px solid #e2e7ed;
  border-radius: 9px;
  background: #fff;
}

.live-record-board__empty {
  margin: 0;
  padding: 28px 12px;
  color: #8a929d;
  font-size: 11px;
  text-align: center;
}

.live-record-board__item {
  display: flex;
  padding: 10px;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
}

.live-record-board__item + .live-record-board__item {
  border-top: 1px solid #edf0f3;
}

.live-record-board__item > div:first-child {
  overflow: hidden;
  min-width: 0;
}

.live-record-board__item a,
.live-record-board__item small {
  display: block;
}

.live-record-board__historical {
  display: inline-block;
  margin-top: 4px;
  padding: 2px 5px;
  border-radius: 4px;
  color: #885716;
  background: #fff0d5;
  font-size: 9px;
  font-weight: 850;
}

.live-record-board__allocation {
  display: inline-block;
  margin-top: 4px;
  padding: 2px 5px;
  border-radius: 4px;
  color: #256447;
  background: #e7f7ed;
  font-size: 9px;
  font-weight: 850;
}

.live-record-board__allocation.is-deferred {
  color: #8a5510;
  background: #fff0d5;
}

.live-record-board__item a {
  overflow: hidden;
  color: #2f6f99;
  font-size: 12px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.live-record-board__item small {
  margin-top: 3px;
  color: #8a929d;
  font-size: 9px;
}

.live-record-board__actions {
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
}

.live-record-board__actions button {
  min-height: 28px;
  padding: 5px 7px;
  border: 1px solid #d8dee6;
  border-radius: 6px;
  color: #5d6672;
  background: #f7f8fa;
  font: inherit;
  font-size: 9px;
  font-weight: 800;
  cursor: pointer;
}

.live-record-form__quota {
  min-height: 31px;
  margin: 0 0 10px;
  padding: 7px 9px;
  border-radius: 7px;
  color: #376879;
  background: #edf7fa;
  font-size: 10px;
  line-height: 1.5;
}

.live-record-form__quota.is-exhausted {
  color: #9a4d38;
  background: #fff0eb;
}

.live-record-form__historical-mode {
  margin: -3px 0 10px;
  color: #6d7783;
  font-size: 10px;
  line-height: 1.45;
}

.live-record-form__historical-mode.is-active {
  color: #8a5510;
  font-weight: 800;
}

.live-record-form > label {
  display: block;
  margin-bottom: 6px;
  color: #4c5664;
  font-size: 11px;
  font-weight: 850;
}

.live-record-form input[type="url"] {
  width: 100%;
  min-height: 42px;
  padding: 9px 10px;
  border: 1px solid #ccd4df;
  border-radius: 8px;
  background: #fff;
  font: inherit;
  font-size: 12px;
}

.live-record-form select {
  width: 100%;
  min-height: 42px;
  margin-bottom: 10px;
  padding: 9px 10px;
  border: 1px solid #ccd4df;
  border-radius: 8px;
  background: #fff;
  font: inherit;
  font-size: 12px;
}

.live-record-form input[type="url"]:focus {
  border-color: #32739f;
  outline: 2px solid rgba(50, 115, 159, 0.17);
}

.live-record-form__current {
  display: flex;
  min-height: 32px;
  padding: 7px 0;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
}

.live-record-form__current a {
  color: #2f6f99;
  font-weight: 800;
}

.live-record-form__current span {
  margin-left: auto;
  color: #28704f;
  text-align: right;
}

.live-record-form__current span.is-error {
  color: #b33232;
}

.live-record-form__actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
}

.live-record-form__actions button {
  min-height: 36px;
  padding: 7px 11px;
  border: 0;
  border-radius: 8px;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
}

.live-record-form__actions button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.live-record-form__cancel {
  color: #6f7782;
  background: #e9ecf0;
}

.live-record-form__save {
  color: #fff;
  background: #334f74;
}

.admin-live-attendance-error {
  padding: 25px;
}

.admin-live-attendance-error h2 {
  margin: 0 0 8px;
}

.admin-guide {
  max-width: 980px;
}

.admin-audit-log-head,
.admin-audit-log-filter,
.admin-audit-log-head > div {
  display: flex;
  align-items: center;
}

.admin-audit-log-head {
  justify-content: space-between;
  gap: 18px;
}

.admin-audit-log-head > div {
  gap: 8px;
}

.admin-audit-log-head span,
.admin-audit-log-filter label {
  color: #788391;
  font-size: 11px;
  font-weight: 800;
}

.admin-audit-log-filter {
  gap: 8px;
}

.admin-audit-log-filter select {
  max-width: 330px;
  min-height: 38px;
  padding: 7px 32px 7px 10px;
  border: 1px solid #d8dee6;
  border-radius: 8px;
  background: #fff;
  font: inherit;
  font-size: 11px;
}

.admin-audit-log-table th:first-child {
  width: 145px;
}

.admin-audit-log-table td strong,
.admin-audit-log-table td small {
  display: block;
}

.admin-audit-log-table td small {
  margin-top: 4px;
  color: #7b8592;
  font-size: 10px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.admin-audit-result {
  color: #28704f;
}

.admin-audit-result--denied,
.admin-audit-result--rejected,
.admin-audit-result--failed {
  color: #a24334;
}

.admin-guide__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.admin-guide__dashboard-link {
  display: inline-flex;
  min-height: 44px;
  flex: 0 0 auto;
  padding: 0 18px;
  border-radius: 11px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #fff;
  background: #2f6fed;
  box-shadow: 0 8px 18px rgba(47, 111, 237, 0.2);
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}

.admin-guide__dashboard-link:hover {
  color: #fff;
  background: #275fcf;
}

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

.admin-guide__toc a {
  display: flex;
  min-height: 58px;
  padding: 12px 15px;
  border: 1px solid var(--admin-line);
  border-radius: 13px;
  align-items: center;
  gap: 10px;
  color: #3f4b5c;
  background: #fff;
  box-shadow: 0 6px 18px rgba(31, 48, 79, 0.045);
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}

.admin-guide__toc a:hover {
  border-color: #b9c9ea;
  color: #2458bd;
}

.admin-guide__toc span {
  display: grid;
  width: 29px;
  height: 29px;
  flex: 0 0 auto;
  border-radius: 999px;
  color: #2f5cac;
  background: #edf3ff;
  font-size: 10px;
  place-items: center;
}

.admin-guide__summary,
.admin-guide__note {
  padding: 17px 19px;
  border: 1px solid #cbdcf4;
  border-radius: 14px;
  color: #355173;
  background: #f1f7ff;
}

.admin-guide__summary {
  margin-bottom: 18px;
}

.admin-guide__summary strong,
.admin-guide__note strong {
  display: block;
  margin-bottom: 4px;
  color: #244a7c;
  font-size: 13px;
}

.admin-guide__summary p,
.admin-guide__note p {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
}

.admin-guide__section {
  padding: 28px;
  border: 1px solid var(--admin-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 26px rgba(31, 48, 79, 0.055);
  scroll-margin-top: 86px;
}

.admin-guide__section + .admin-guide__section {
  margin-top: 18px;
}

.admin-guide__section-head {
  display: flex;
  align-items: center;
  gap: 13px;
}

.admin-guide__section-head > span {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 999px;
  color: #fff;
  background: #2f6fed;
  font-size: 12px;
  font-weight: 900;
  place-items: center;
}

.admin-guide__section-head p,
.admin-guide__section-head h2 {
  margin: 0;
}

.admin-guide__section-head p {
  color: #66758a;
  font-size: 11px;
  font-weight: 850;
}

.admin-guide__section-head h2 {
  margin-top: 2px;
  color: #202630;
  font-size: 22px;
  letter-spacing: -0.035em;
}

.admin-guide__steps {
  display: grid;
  margin: 24px 0 0;
  padding: 0;
  gap: 12px;
  counter-reset: admin-guide-step;
  list-style: none;
}

.admin-guide__steps li {
  position: relative;
  min-height: 45px;
  padding-left: 52px;
  counter-increment: admin-guide-step;
}

.admin-guide__steps li::before {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: #315b9b;
  background: #edf3ff;
  content: counter(admin-guide-step);
  font-size: 11px;
  font-weight: 900;
  place-items: center;
}

.admin-guide__steps strong {
  display: block;
  color: #303844;
  font-size: 14px;
}

.admin-guide__steps p {
  margin: 4px 0 0;
  color: #687281;
  font-size: 13px;
  line-height: 1.7;
}

.admin-guide__shot {
  margin: 24px 0 0;
}

.admin-guide__shot img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #d8e0eb;
  border-radius: 13px;
  background: #f5f7fa;
  box-shadow: 0 8px 24px rgba(31, 52, 90, 0.08);
}

.admin-guide__shot figcaption {
  margin-top: 9px;
  color: #798391;
  font-size: 11px;
  line-height: 1.6;
  text-align: center;
}

.admin-guide__note {
  margin-top: 20px;
}

.admin-guide__note--warning {
  border-color: #ecd4ad;
  color: #725225;
  background: #fff8eb;
}

.admin-guide__note--warning strong {
  color: #825516;
}

.admin-guide__quota-table-wrap {
  overflow-x: auto;
  margin-top: 24px;
  border: 1px solid #dce3ed;
  border-radius: 13px;
}

.admin-guide__quota-table {
  width: 100%;
  min-width: 620px;
  border-spacing: 0;
  border-collapse: separate;
  color: #3f4855;
  background: #fff;
  font-size: 12px;
}

.admin-guide__quota-table caption {
  padding: 13px 15px;
  border-bottom: 1px solid #dce3ed;
  color: #315b9b;
  background: #f4f8ff;
  font-size: 13px;
  font-weight: 900;
  text-align: left;
}

.admin-guide__quota-table th,
.admin-guide__quota-table td {
  padding: 12px 14px;
  border-right: 1px solid #e7ebf1;
  border-bottom: 1px solid #e7ebf1;
  text-align: left;
}

.admin-guide__quota-table tr:last-child th,
.admin-guide__quota-table tr:last-child td {
  border-bottom: 0;
}

.admin-guide__quota-table th:last-child,
.admin-guide__quota-table td:last-child {
  border-right: 0;
}

.admin-guide__quota-table thead th {
  color: #657084;
  background: #f7f9fc;
  font-size: 11px;
}

.admin-guide__quota-table tbody th {
  color: #2f5cac;
  font-weight: 850;
}

.admin-guide__footer-action {
  display: flex;
  padding: 22px 0 0;
  justify-content: center;
}

@media (max-width: 760px) {
  .admin-audit-log-head,
  .admin-audit-log-filter {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-audit-log-filter select {
    width: 100%;
    max-width: none;
  }

  .admin-attendance-scope-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .admin-attendance-scope-tabs a {
    justify-content: center;
  }

  .admin-live-attendance-head,
  .admin-live-attendance-source,
  .admin-live-attendance-toolbar,
  .admin-live-attendance-toolbar__actions,
  .admin-live-attendance-filter {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-live-course-summary {
    grid-template-columns: 1fr;
  }

  .live-record-dialog__head {
    padding: 18px 18px 14px;
  }

  .live-record-dialog__notice {
    margin: 0 18px 12px;
  }

  .live-record-dialog__forms {
    padding: 0 18px 18px;
    grid-template-columns: 1fr;
  }

  .admin-live-attendance-filter select,
  .admin-live-attendance-filter input,
  .admin-live-attendance-filter button,
  .admin-live-attendance-filter a,
  .admin-historical-record-mode,
  .admin-live-attendance-refresh {
    width: 100%;
  }

  .admin-live-attendance-filter a {
    padding: 8px 0;
    text-align: center;
  }

  .attendance-member-nickname-form {
    width: 100%;
    min-width: 0;
  }

  .admin-guide__head {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-guide__head .admin-guide__dashboard-link,
  .admin-guide__footer-action .admin-guide__dashboard-link {
    width: 100%;
  }

  .admin-guide__toc {
    grid-template-columns: 1fr;
  }

  .admin-guide__section {
    padding: 21px 18px;
  }

  .admin-guide__section-head h2 {
    font-size: 19px;
  }

  .admin-guide__steps li {
    padding-left: 44px;
  }
}

@media (max-width: 760px) {
  .admin-recommendation-record__head,
  .admin-recommendation-copy > summary,
  .admin-recommendation-archive > summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-recommendation-record__member {
    min-width: 0;
    justify-items: start;
    text-align: left;
  }

  .admin-recommendation-record__answers {
    grid-template-columns: 1fr;
  }

  .admin-recommendation-copy > summary strong {
    overflow-wrap: anywhere;
  }

  .admin-recommendation-archive__body {
    padding: 0 10px 10px;
  }

  .admin-head--with-action,
  .admin-historical-import-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .admin-primary-link,
  .admin-historical-import-row .learning-action-link {
    width: 100%;
  }

  .admin-attendance-import-link {
    width: 100%;
    margin: 8px 0 0;
  }

  .admin-portal-topbar .community-global-nav {
    display: none;
  }

  .body--admin-portal .admin-portal-topbar .community-account {
    display: flex;
    margin-left: auto;
  }

  .admin-portal-topbar .community-avatar {
    display: none;
  }

  .admin-portal-topbar .admin-portal-logout {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
  }

  .body--admin-portal .community-mobile-tabs.admin-portal-mobile-tabs {
    display: flex;
    overflow-x: auto;
    justify-content: flex-start;
    padding: 0 12px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .body--admin-portal .community-mobile-tabs.admin-portal-mobile-tabs::-webkit-scrollbar {
    display: none;
  }

  .body--admin-portal .community-mobile-tabs.admin-portal-mobile-tabs a {
    flex: 0 0 auto;
    min-height: 48px;
    padding: 0 16px;
    scroll-snap-align: start;
  }

  .admin-portal__content {
    width: min(100% - 28px, 1180px);
    padding-top: 24px;
  }

  .admin-portal .admin-head,
  .admin-portal-head {
    padding: 24px 21px;
    border-radius: 18px;
  }

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

  .admin-recommendation-periods {
    width: 100%;
    overflow-x: auto;
  }

  .admin-recommendation-periods > span,
  .admin-portal .admin-recommendation-periods a {
    flex: 0 0 auto;
  }

  .admin-recommendation-date-form {
    flex: 0 0 auto;
  }

  .admin-portal .admin-panel,
  .admin-portal .admin-form-panel,
  .admin-login-shell .admin-login {
    padding: 20px;
  }

  .admin-portal .admin-attendance-panel {
    padding: 12px;
  }

  .admin-portal .admin-panel__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .admin-portal-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-portal-actions > span {
    line-height: 1.55;
  }

  .admin-portal-actions form,
  .admin-portal-actions .btn,
  .admin-portal-actions form .btn {
    width: 100%;
  }

  .admin-portal-action-buttons {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
  }

  .admin-portal-action-buttons form,
  .admin-portal-action-buttons .btn,
  .admin-portal-action-buttons form .btn {
    width: 100%;
  }

  .admin-course-management-nav {
    overflow-x: auto;
  }

  .admin-course-management-nav a {
    flex: 1 0 auto;
    text-align: center;
  }

  .admin-mobile-card-table-wrap {
    overflow: visible;
  }

  .admin-portal .admin-mobile-card-table,
  .admin-portal .admin-mobile-card-table tbody,
  .admin-portal .admin-mobile-card-table tr {
    display: block;
    width: 100%;
  }

  .admin-portal .admin-mobile-card-table thead {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .admin-portal .admin-mobile-card-table tbody {
    display: grid;
    gap: 12px;
  }

  .admin-portal .admin-mobile-card-table tr {
    padding: 13px 14px;
    border: 1px solid #e2e7ef;
    border-radius: 13px;
    background: #fff;
  }

  .admin-portal .admin-mobile-card-table tbody tr:hover {
    background: #fff;
  }

  .admin-portal .admin-mobile-card-table td,
  .admin-portal .admin-mobile-card-table td.admin-table__actions {
    position: relative;
    display: block;
    width: auto;
    min-width: 0;
    max-width: none;
    min-height: 36px;
    padding: 8px 0 8px 108px;
    border: 0;
    line-height: 1.5;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .admin-portal .admin-mobile-card-table td + td {
    border-top: 1px solid #eef1f5;
  }

  .admin-portal .admin-mobile-card-table td::before {
    content: attr(data-label);
    position: absolute;
    top: 9px;
    left: 0;
    width: 94px;
    color: #778091;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: -0.01em;
  }

  .admin-portal .admin-mobile-card-table td > form,
  .admin-portal .admin-mobile-card-table td > .admin-registration-actions {
    min-width: 0;
  }

  .admin-result-list > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .admin-result-list b {
    white-space: normal;
  }

  .admin-attendance-member {
    padding: 14px;
    border-radius: 16px;
  }

  .admin-attendance-member__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .admin-attendance-member__identity {
    width: 100%;
    align-items: flex-start;
  }

  .admin-attendance-member__identity p {
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .admin-attendance-course > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 6px 10px;
  }

  .admin-attendance-course > header > .badge {
    align-self: start;
  }

  .admin-attendance-import-link {
    min-height: 40px;
    margin: 0;
    grid-column: 1 / -1;
  }

  .admin-attendance-week-scroll {
    display: none;
  }

  .admin-attendance-mobile-progress {
    display: grid;
    margin-top: 14px;
    gap: 9px;
  }

  .admin-attendance-mobile-progress > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .admin-attendance-mobile-progress > header b {
    color: #303846;
    font-size: 13px;
  }

  .admin-attendance-mobile-progress > header small {
    color: #7d8693;
    font-size: 10px;
  }

  .admin-attendance-mobile-week-scroll {
    overflow-x: auto;
    max-width: 100%;
    padding: 1px 1px 7px;
    scroll-padding-inline: 1px;
    scroll-snap-type: x proximity;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    touch-action: pan-x;
  }

  .admin-attendance-mobile-week-scroll::-webkit-scrollbar {
    display: none;
  }

  .admin-attendance-mobile-week-scroll:focus-visible {
    border-radius: 10px;
    outline: 2px solid #7ea3ef;
    outline-offset: 2px;
  }

  .admin-attendance-mobile-week-list {
    display: grid;
    width: max-content;
    grid-auto-columns: 132px;
    grid-auto-flow: column;
    gap: 8px;
  }

  .admin-attendance-mobile-week {
    min-height: 138px;
    padding: 11px;
    border: 1px solid #dfe4ec;
    border-radius: 12px;
    background: #fff;
    scroll-snap-align: start;
  }

  .admin-attendance-mobile-week.is-current {
    border-color: #82a6ed;
    box-shadow: inset 0 0 0 1px rgba(47, 111, 237, 0.12);
    background: #f7f9ff;
  }

  .admin-attendance-mobile-week > strong {
    display: block;
    margin-bottom: 9px;
    color: #2c3441;
    font-size: 13px;
  }

  .admin-attendance-mobile-week dl {
    display: grid;
    margin: 0;
    gap: 7px;
  }

  .admin-attendance-mobile-week dl > div {
    display: grid;
    gap: 3px;
  }

  .admin-attendance-mobile-week dt {
    color: #818a98;
    font-size: 10px;
    font-weight: 800;
  }

  .admin-attendance-mobile-week dd {
    display: flex;
    min-width: 0;
    margin: 0;
    align-items: center;
    gap: 5px;
    color: #68717e;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.25;
  }

  .admin-attendance-mobile-week dd b {
    flex: 0 0 auto;
    font-size: 13px;
  }

  .admin-attendance-mobile-week dd span {
    overflow-wrap: anywhere;
  }

  .admin-attendance-mobile-week dd.is-attended,
  .admin-attendance-mobile-week dd.is-submitted {
    color: #187449;
  }

  .admin-attendance-mobile-week dd.is-historical-import,
  .admin-attendance-mobile-week dd.is-duplicate {
    color: #7043a9;
  }

  .admin-attendance-mobile-week dd.is-late {
    color: #96600f;
  }

  .admin-attendance-mobile-week dd.is-missed {
    color: #b52f2f;
  }

  .admin-attendance-mobile-week dd.is-available {
    color: #2c64c5;
  }

  .admin-attendance-member__alerts {
    justify-content: flex-start;
  }

  .admin-attendance-member__meta {
    margin-top: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .admin-attendance-member__meta > div {
    padding: 10px;
  }

  .admin-channel-conversation {
    margin-top: 12px;
  }

  .admin-channel-conversation form,
  .admin-channel-conversation__button {
    width: 100%;
  }

  .admin-channel-conversation span {
    display: none;
  }

  .admin-attendance-legend {
    display: none;
  }

  .admin-attendance-course {
    padding: 13px;
  }

  .admin-registration-actions,
  .admin-registration-actions form {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .admin-registration-actions select,
  .admin-registration-actions .btn,
  .admin-registration-reject,
  .admin-registration-actions form {
    width: 100%;
  }
}

@media (max-width: 430px) {
  .admin-portal .admin-stat-grid {
    grid-template-columns: 1fr 1fr;
  }

  .admin-portal .admin-stat-grid article {
    padding: 16px;
  }

  .admin-portal .admin-stat-grid strong {
    font-size: 25px;
  }

  .admin-login-shell {
    padding: 32px 14px;
  }

  .admin-attendance-member__identity p {
    white-space: normal;
  }

  .admin-channel-conversation {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-portal .admin-mobile-card-table td,
  .admin-portal .admin-mobile-card-table td.admin-table__actions {
    padding-left: 94px;
  }

  .admin-portal .admin-mobile-card-table td::before {
    width: 80px;
  }
}

@media (max-width: 1040px) {
  .admin-member-board__header {
    display: none;
  }

  .admin-member-board__row {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 14px;
  }

  .admin-member-board__identity {
    padding-bottom: 12px;
  }

  .admin-member-board__identity small {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .admin-member-board__time,
  .admin-member-board__detail-actions,
  .admin-member-board__channel {
    display: grid;
    min-width: 0;
    min-height: 43px;
    padding: 9px 0 9px 105px;
    border-top: 1px solid #edf0f4;
    align-items: center;
    gap: 6px;
  }

  .admin-member-board__time,
  .admin-member-board__detail-actions,
  .admin-member-board__channel {
    position: relative;
  }

  .admin-member-board__time::before,
  .admin-member-board__detail-actions::before,
  .admin-member-board__channel::before {
    content: attr(data-label);
    position: absolute;
    left: 0;
    color: #7a8390;
    font-size: 11px;
    font-weight: 850;
  }

  .admin-member-board__detail-actions {
    grid-template-columns: 1fr 1fr;
  }

  .admin-member-board__detail-button,
  .admin-member-board__channel .admin-channel-conversation__button {
    width: 100%;
    min-height: 40px;
  }

  .admin-member-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
    border-radius: 15px;
  }

  .admin-member-dialog__surface {
    max-height: calc(100dvh - 20px);
  }

  .admin-member-dialog__head {
    padding: 17px 16px 13px;
  }

  .admin-member-dialog__head h2 {
    font-size: 19px;
  }

  .admin-member-dialog__head p {
    font-size: 12px;
    line-height: 1.5;
  }

  .admin-member-dialog > .admin-member-dialog__surface > .admin-attendance-legend {
    display: flex;
    overflow-x: auto;
    margin: 0 16px 11px;
    flex-wrap: nowrap;
  }

  .admin-member-dialog .attendance-state {
    flex: 0 0 auto;
  }

  .admin-member-dialog__courses {
    padding: 0 16px 17px;
  }

  .admin-member-dialog__course {
    padding: 12px;
  }

  .admin-member-dialog__course > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .admin-member-dialog__course .admin-attendance-import-link {
    margin: 5px 0 0;
    grid-column: 1 / -1;
  }

  .admin-member-dialog .admin-attendance-week-scroll {
    display: block;
  }

  .admin-member-dialog__footer {
    padding: 11px 16px;
  }
}

/* Shared admin typography scale: readable defaults without widening fixed layouts. */
.admin-portal,
.admin-portal button,
.admin-portal input,
.admin-portal select,
.admin-portal textarea {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.admin-portal-topbar .admin-portal-nav a,
.admin-portal-topbar .admin-portal-logout,
.admin-portal-mobile-tabs a {
  font-size: var(--admin-font-base);
  line-height: 1.4;
}

.admin-portal .admin-table {
  font-size: var(--admin-font-base);
  line-height: 1.5;
}

.admin-portal .admin-table th {
  font-size: var(--admin-font-sm);
}

.admin-portal .admin-table td {
  overflow-wrap: anywhere;
}

.admin-live-attendance-table {
  font-size: var(--admin-font-sm);
  line-height: 1.45;
}

.admin-live-attendance-table thead th {
  font-size: var(--admin-font-xs);
}

.admin-live-attendance-table tbody th strong {
  font-size: var(--admin-font-sm);
}

.admin-live-attendance-table tbody th span,
.admin-live-attendance-table tbody th small,
.admin-live-attendance-course header span {
  font-size: 11px;
}

.admin-live-attendance-table tbody th .attendance-enrollment-status,
.live-attendance-cell small,
.live-attendance-record-badge {
  font-size: 10px;
}

.attendance-member-course-list span,
.admin-member-board__time strong,
.admin-member-board__alerts .badge {
  font-size: var(--admin-font-xs);
}

.attendance-member-course em,
.admin-member-board__identity small {
  font-size: 11px;
}

.admin-member-board__header,
.admin-member-board__detail-button,
.admin-member-board__channel .admin-channel-conversation__button {
  font-size: var(--admin-font-sm);
}

.admin-member-board__identity strong {
  font-size: var(--admin-font-base);
}

.admin-audit-log-head span,
.admin-audit-log-filter label,
.admin-audit-log-table td small {
  font-size: var(--admin-font-xs);
}

.admin-audit-log-filter select {
  font-size: var(--admin-font-base);
}

.live-record-dialog__head span,
.live-record-form__kind,
.live-record-board__historical,
.live-record-board__allocation {
  font-size: var(--admin-font-xs);
}

.live-record-dialog__notice,
.live-record-form__head p,
.live-record-board__empty,
.live-record-board__item small,
.live-record-form__quota,
.live-record-form__historical-mode,
.live-record-form__current,
.live-record-board__actions button {
  font-size: var(--admin-font-xs);
}

.live-record-form__head h3 {
  font-size: var(--admin-font-md);
}

.live-record-form > label,
.live-record-board__item a,
.live-record-form__actions button {
  font-size: var(--admin-font-sm);
}

.live-record-form input[type="url"],
.live-record-form select {
  font-size: var(--admin-font-base);
  line-height: 1.45;
}

.admin-guide__section-head p,
.admin-guide__shot figcaption,
.admin-guide__quota-table thead th {
  font-size: var(--admin-font-xs);
}

.admin-guide__steps strong,
.admin-guide__summary strong,
.admin-guide__note strong,
.admin-guide__quota-table caption,
.admin-guide__dashboard-link,
.admin-guide__toc a {
  font-size: var(--admin-font-base);
}

.admin-guide__steps p,
.admin-guide__summary p,
.admin-guide__note p,
.admin-guide__quota-table {
  font-size: var(--admin-font-base);
}

@media (max-width: 1040px) {
  .admin-portal-topbar .admin-portal-nav a {
    font-size: var(--admin-font-sm);
  }
}

@media (max-width: 760px) {
  .admin-portal input,
  .admin-portal select,
  .admin-portal textarea,
  .live-record-form input[type="url"] {
    font-size: 16px;
  }
}