:root {
  color-scheme: light;
  --ink: #172925;
  --muted: #657873;
  --teal: #0a8f7d;
  --teal-dark: #09695e;
  --paper: rgba(255, 253, 248, .76);
  --line: rgba(255, 255, 255, .58);
  --danger: #bc503e;
  font-family: "Microsoft YaHei UI", "PingFang SC", "Noto Sans CJK SC", sans-serif;
  color: var(--ink);
  background: #e9eee9;
}

* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; overflow-x: hidden; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible {
  outline: 3px solid rgba(10, 143, 125, .32);
  outline-offset: 3px;
}
[hidden] { display: none !important; }

.account-backdrop {
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 8% 15%, rgba(245, 184, 104, .24), transparent 31%),
    radial-gradient(circle at 87% 8%, rgba(55, 174, 153, .3), transparent 35%),
    radial-gradient(circle at 72% 88%, rgba(121, 103, 244, .15), transparent 38%),
    linear-gradient(145deg, #f7f3ea, #e5eee9 55%, #d9e6e2);
}

.account-backdrop::after {
  content: "Aa";
  position: absolute;
  right: -3vw;
  bottom: -13vh;
  color: rgba(255, 255, 255, .28);
  font: italic 700 min(38vw, 540px)/1 Georgia, serif;
  pointer-events: none;
}

.account-header {
  width: min(1180px, calc(100% - 40px));
  min-height: 108px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.account-brand { display: inline-flex; align-items: center; gap: 13px; color: var(--ink); text-decoration: none; }
.account-brand > span {
  width: 54px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 17px;
  color: white;
  background: linear-gradient(145deg, #22b49f, #08796c);
  box-shadow: inset 0 1px rgba(255,255,255,.6), 0 13px 34px rgba(8,121,108,.23);
  font: 34px Georgia, serif;
}
.account-brand strong { font-size: 24px; }
.account-header-actions { display: flex; align-items: center; gap: 10px; }
.candidate-admin-link {
  padding: 11px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--teal-dark);
  background: rgba(255,255,255,.48);
  box-shadow: inset 0 1px rgba(255,255,255,.82);
  backdrop-filter: blur(24px) saturate(180%);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}
.candidate-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 11px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .4);
  box-shadow: inset 0 1px rgba(255,255,255,.82), 0 10px 30px rgba(34, 54, 49, .08);
  backdrop-filter: blur(24px) saturate(180%);
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.candidate-badge i { width: 8px; height: 8px; border-radius: 50%; background: #d6a545; box-shadow: 0 0 0 5px rgba(214,165,69,.13); }

.account-shell {
  width: min(1180px, calc(100% - 40px));
  margin: 18px auto 64px;
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(400px, .96fr);
  gap: 38px;
  align-items: center;
}

.account-intro { padding: clamp(16px, 4vw, 54px) 8px; }
.account-kicker { margin: 0 0 17px; color: var(--teal); font-size: 12px; font-weight: 900; letter-spacing: .16em; }
.account-intro h1 { margin: 0; font-size: clamp(48px, 6.2vw, 82px); line-height: 1.04; letter-spacing: -.055em; }
.account-intro h1 em { color: var(--teal); font: italic 400 1em Georgia, "Times New Roman", serif; }
.account-lead { max-width: 650px; margin: 28px 0; color: var(--muted); font-size: 18px; line-height: 1.8; }
.account-facts { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.account-facts div {
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.34);
  backdrop-filter: blur(18px) saturate(170%);
  box-shadow: inset 0 1px rgba(255,255,255,.72);
}
.account-facts dt { color: var(--muted); font-size: 11px; }
.account-facts dd { margin: 7px 0 0; font-size: 13px; font-weight: 800; line-height: 1.5; }
.account-warning { margin: 21px 0 0; padding-left: 14px; border-left: 3px solid #d6a545; color: var(--muted); font-size: 13px; line-height: 1.7; }

.account-panel {
  min-height: 590px;
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 34px;
  background: var(--paper);
  box-shadow: inset 0 1px rgba(255,255,255,.95), inset 0 -1px rgba(32,75,65,.06), 0 32px 90px rgba(39,62,55,.16);
  backdrop-filter: blur(30px) saturate(190%);
}
.account-loading, .account-unavailable { min-height: 500px; display: grid; place-content: center; justify-items: center; gap: 18px; text-align: center; }
.account-loading strong, .account-unavailable p { color: var(--muted); }
.account-spinner { width: 34px; height: 34px; border: 3px solid rgba(10,143,125,.15); border-top-color: var(--teal); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(1turn); } }
.status-orb { width: 62px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 20px; color: white; background: var(--teal); box-shadow: 0 15px 35px rgba(10,143,125,.23); font-size: 28px; font-weight: 900; }
.status-orb-error { background: var(--danger); box-shadow: 0 15px 35px rgba(188,80,62,.2); }

.account-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; padding: 5px; border: 1px solid rgba(30,45,42,.08); border-radius: 16px; background: rgba(223,234,229,.72); }
.account-tabs button { border: 0; border-radius: 12px; padding: 12px; color: var(--muted); background: transparent; cursor: pointer; transition: transform .18s ease, background .18s ease, color .18s ease; }
.account-tabs button[aria-selected="true"] { color: var(--teal-dark); background: rgba(255,255,255,.88); box-shadow: 0 7px 18px rgba(42,69,61,.09); font-weight: 900; }
.account-tabs button:active, button:active { transform: scale(.97); }
.panel-heading { margin: 28px 0 21px; }
.panel-heading span { color: #c08e31; font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.panel-heading h2, .account-session h2 { margin: 6px 0 8px; font-size: 30px; }
.panel-heading p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
form { display: grid; gap: 16px; }
label { display: grid; gap: 7px; font-size: 13px; font-weight: 800; }
label small { color: var(--muted); font-size: 11px; font-weight: 400; }
.human-verification { padding: 14px; display: grid; gap: 9px; border: 1px solid rgba(30,45,42,.1); border-radius: 14px; background: rgba(255,255,255,.42); }
.human-verification > span { font-size: 13px; font-weight: 800; }
.human-verification small { color: var(--muted); font-size: 11px; line-height: 1.5; }
#registerTurnstileWidget,#resetTurnstileWidget { min-height: 65px; }
input {
  width: 100%;
  min-height: 50px;
  padding: 11px 14px;
  border: 1px solid rgba(30,45,42,.14);
  border-radius: 14px;
  color: var(--ink);
  background: rgba(255,255,255,.64);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
input:focus { border-color: rgba(10,143,125,.62); background: rgba(255,255,255,.9); box-shadow: 0 0 0 4px rgba(10,143,125,.09); outline: 0; }
.primary-action, .secondary-action { min-height: 48px; border-radius: 14px; padding: 11px 18px; cursor: pointer; font-weight: 900; transition: transform .18s ease, box-shadow .18s ease; }
.primary-action { margin-top: 4px; border: 1px solid rgba(255,255,255,.36); color: white; background: linear-gradient(145deg, #14a38f, #08776a); box-shadow: inset 0 1px rgba(255,255,255,.35), 0 13px 30px rgba(8,119,106,.2); }
.secondary-action { border: 1px solid rgba(30,45,42,.13); color: var(--teal-dark); background: rgba(255,255,255,.65); }
button:disabled { cursor: wait; opacity: .62; }

.candidate-invitation { margin-bottom: 18px; padding: 15px; display: grid; grid-template-columns: 1fr auto; gap: 11px; align-items: center; border: 1px solid rgba(214,165,69,.28); border-radius: 16px; background: rgba(255,243,211,.48); }
.candidate-invitation div { display: grid; gap: 3px; }
.candidate-invitation small { color: var(--muted); }
.candidate-invitation output { grid-column: 1 / -1; min-width: 0; color: var(--teal-dark); overflow-wrap: anywhere; font: 700 12px/1.6 Consolas, monospace; }

.account-session { min-height: 500px; display: grid; grid-template-columns: 252px minmax(0,1fr); gap: 24px; align-items: start; }
.learner-account-sidebar { position: sticky; top: 18px; min-width: 0; padding: 18px; border: 1px solid rgba(30,45,42,.1); border-radius: 22px; background: rgba(255,255,255,.58); box-shadow: inset 0 1px rgba(255,255,255,.9), 0 16px 40px rgba(39,62,55,.08); }
.learner-account-content { min-width: 0; }
.learner-account-content > [data-account-panel]:not(.is-active-account-panel) { display: none !important; }
.learner-account-overview { min-height: 430px; padding: clamp(24px,5vw,58px); display: flex; flex-direction: column; justify-content: center; border: 1px solid rgba(10,143,125,.18); border-radius: 24px; background: linear-gradient(145deg,rgba(255,253,248,.88),rgba(230,247,241,.7)); box-shadow: inset 0 1px rgba(255,255,255,.94); }
.learner-account-overview h2 { margin: 0; font-size: clamp(36px,5vw,62px); letter-spacing: -.05em; }
.learner-account-overview > p:not(.account-kicker):not(.account-learning-entry-note) { max-width: 560px; color: var(--muted); font-size: 16px; line-height: 1.7; }
.learner-profile-overview { width: 100%; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 12px 16px; align-items: center; }
.learner-profile-overview .status-orb { grid-row: 1 / span 2; }
.learner-profile-copy h2 { margin: 4px 0; }
.learner-profile-copy > p:last-child { margin: 0; color: var(--muted); }
.learner-profile-overview .session-identity { grid-column: 1 / -1; }
.learner-profile-overview dl { grid-column: 1 / -1; grid-template-columns: repeat(2,minmax(0,1fr)); }
.learner-profile-nav { width: 100%; margin-top: 14px; display: grid; gap: 6px; }
.learner-profile-nav a { min-width: 0; padding: 12px 13px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid rgba(30,45,42,.1); border-radius: 14px; color: var(--ink); background: rgba(255,255,255,.64); text-decoration: none; transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.learner-profile-nav a:hover { transform: translateY(-2px); border-color: rgba(10,143,125,.3); box-shadow: 0 10px 24px rgba(31,65,58,.08); }
.learner-profile-nav a[aria-current="page"] { color: #fff; border-color: var(--teal); background: linear-gradient(135deg,#14a992,var(--teal-dark)); box-shadow: 0 12px 26px rgba(8,121,108,.2); }
.learner-profile-nav a[aria-current="page"] > small { color: rgba(255,255,255,.76); }
.learner-profile-nav a > span { font-weight: 900; }
.learner-profile-nav a > small { color: var(--muted); white-space: nowrap; }
.learner-profile-nav a > strong { min-width: 24px; height: 24px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; color: #fff; background: #c64e3d; font-size: 11px; }
.learner-profile-nav a > strong[data-empty="true"] { color: var(--teal); background: rgba(10,143,125,.12); }
.learner-sidebar-logout { width: 100%; margin-top: 14px !important; }
.account-session .account-kicker { margin-top: 22px; margin-bottom: 3px; }
.session-identity { width: 100%; margin: 20px 0; padding: 20px; border-radius: 18px; background: rgba(222,239,233,.68); }
.session-identity span, .account-session dt { color: var(--muted); font-size: 11px; }
.session-identity strong { display: block; margin-top: 6px; font-size: 27px; overflow-wrap: anywhere; }
.account-session dl { width: 100%; display: grid; grid-template-columns: 1fr; gap: 12px; }
.account-session dl div { padding: 15px; border: 1px solid rgba(30,45,42,.1); border-radius: 14px; }
.account-session dd { margin: 6px 0 0; font-size: 13px; font-weight: 800; overflow-wrap: anywhere; }
.account-session button { margin-top: 15px; align-self: stretch; }
.account-learning-entry { width: 100%; margin-top: 15px; text-align: center; text-decoration: none; }
.account-learning-entry-note { width: 100%; margin: 7px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; text-align: center; }
.account-progress-migration { width: 100%; margin-top: 24px; padding: 16px; border: 1px solid rgba(10,143,125,.2); border-radius: 18px; background: rgba(237,248,244,.68); }
.account-progress-migration h3 { margin: 4px 0 8px; font-size: clamp(20px,2.4vw,28px); }
.account-progress-migration > p:not(.account-kicker):not(.account-learning-entry-note) { margin: 0; color: var(--muted); line-height: 1.65; }
.account-progress-migration .account-progress-download { display: block; width: 100%; margin-top: 14px; text-align: center; text-decoration: none; }
.account-progress-download-status { min-height: 1.5em; margin: 8px 0 0; color: var(--muted); font-size: 14px; }
.account-message { margin: 17px 0 0; padding: 12px 14px; border-radius: 12px; color: var(--teal-dark); background: rgba(215,238,231,.72); font-size: 13px; line-height: 1.5; }
.account-message[data-kind="error"] { color: #913d30; background: rgba(247,218,210,.75); }
.learner-message-center { width: 100%; margin: 18px 0; padding: 15px; border: 1px solid rgba(10,143,125,.18); border-radius: 18px; background: rgba(237,248,244,.58); }
.live-refresh-status { margin-top: 5px; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; }
.live-refresh-status i { width: 7px; height: 7px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(10,143,125,.12); }
.learner-learning-settings { width: 100%; margin: 18px 0; padding: 15px; border: 1px solid rgba(10,143,125,.18); border-radius: 18px; background: rgba(255,247,226,.56); }
.learner-learning-settings > p { color: var(--muted); line-height: 1.65; }
.learner-settings-permission { padding: 10px 12px; border-radius: 12px; background: rgba(230,247,241,.8); color: var(--accent-deep) !important; font-weight: 800; }
.learner-settings-permission[data-allowed="false"] { background: rgba(253,229,222,.82); color: #9e3d31 !important; }
.learner-settings-edit-form { margin: 12px 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; padding: 12px; border: 1px solid rgba(30,45,42,.1); border-radius: 14px; background: rgba(255,255,255,.58); }
.learner-settings-edit-form label { min-width: 0; display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 11px; background: rgba(255,255,255,.66); font-weight: 720; }
.learner-settings-edit-form label:last-of-type { display: grid; }
.learner-settings-edit-form input[type="date"] { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid rgba(30,45,42,.14); border-radius: 10px; background: rgba(255,255,255,.8); }
.learner-settings-edit-form button { grid-column: 1 / -1; }
.learner-learning-settings-grid { margin: 12px 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; }
.learner-learning-settings-grid > div { min-width: 0; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.7); }
.learner-learning-settings-grid dt { color: var(--muted); font-size: 11px; }
.learner-learning-settings-grid dd { margin: 5px 0 0; color: var(--ink); font-weight: 850; overflow-wrap: anywhere; }
.learner-api-configuration { border-color: rgba(49,95,112,.22); background: rgba(235,247,250,.58); }
.learner-api-configuration-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.learner-api-proxy-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.learner-api-proxy-actions p { margin: 0; color: var(--accent-deep); font-weight: 750; overflow-wrap: anywhere; }
.message-center-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.message-center-heading h3,.learner-message-center h4 { margin: 0; }
.message-center-heading .account-kicker { margin: 0 0 3px; }
.message-center-heading button { margin-top: 0; align-self: auto; min-height: 40px; }
.message-center-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.message-channel-note { margin: 9px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.learner-mailbox-toolbar { margin-top: 10px; padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid rgba(10,143,125,.14); border-radius: 14px; background: rgba(255,255,255,.52); }
.learner-mailbox-toolbar > div,.learner-message-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.learner-mailbox-toolbar button { min-height: 38px; padding: 7px 11px; }
.danger-action { color: #a33f31; border-color: rgba(198,78,61,.25); background: rgba(255,239,235,.78); }
.learner-message-columns { margin-top: 13px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.learner-message-columns > div,.learner-support-area > div { min-width: 0; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.62); }
.learner-message-list,.learner-support-messages { margin-top: 9px; display: grid; gap: 7px; }
.learner-message-item { padding: 10px; display: grid; gap: 5px; border: 1px solid rgba(30,45,42,.09); border-radius: 11px; background: rgba(255,255,255,.76); overflow-wrap: anywhere; }
.learner-message-item[data-unread="true"] { border-left: 3px solid var(--teal); }
.learner-message-item strong { font-size: 12px; }
.learner-message-item span,.learner-message-item time { color: var(--muted); font-size: 10px; }
.learner-message-item p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; white-space: pre-wrap; }
.learner-message-item button { margin: 2px 0 0; justify-self: start; align-self: auto; min-height: 35px; padding: 7px 10px; }
.learner-message-actions { margin-top: 2px; }
.learner-read-announcements { margin-top: 3px; padding: 9px; border: 1px solid rgba(30,45,42,.09); border-radius: 12px; background: rgba(242,244,242,.72); }
.learner-read-announcements summary { cursor: pointer; color: var(--muted); font-size: 11px; font-weight: 850; list-style-position: inside; }
.learner-read-announcements[open] summary { color: var(--teal-dark); }
.learner-support-area { margin-top: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.learner-support-form { padding: 12px; border: 1px solid rgba(30,45,42,.09); border-radius: 14px; background: rgba(255,255,255,.58); }
.learner-support-form textarea { width: 100%; padding: 10px 12px; border: 1px solid rgba(30,45,42,.14); border-radius: 12px; color: var(--ink); background: rgba(255,255,255,.75); resize: vertical; }
.learner-support-form button { margin-top: 0; }
.learner-support-conversation { margin-top: 10px; padding: 12px; border: 1px solid rgba(90,61,173,.16); border-radius: 14px; background: rgba(245,241,255,.58); }
.learner-support-messages { margin-bottom: 10px; }
.learner-support-messages .learner-message-item[data-author="learner"] { border-left: 3px solid #8661c7; }
.learner-support-messages .learner-message-item[data-author="administrator"] { border-left: 3px solid var(--teal); }
.learner-support-messages .learner-message-item { width: min(82%,520px); }
.learner-support-messages .learner-message-item[data-author="learner"] { justify-self: end; border-left: 1px solid rgba(90,61,173,.12); border-right: 3px solid #8661c7; background: rgba(239,233,255,.82); }
.learner-support-messages .learner-message-item[data-author="administrator"] { justify-self: start; background: rgba(224,247,241,.82); }

@media (hover: hover) {
  .account-brand:hover, button:hover { transform: translateY(-1px) scale(1.015); }
}
@media (max-width: 860px) {
  .account-shell { grid-template-columns: 1fr; gap: 12px; margin-top: 0; }
  .account-intro { padding-top: 15px; }
  .account-intro h1 { font-size: clamp(44px, 13vw, 68px); }
  .account-panel { min-height: 0; }
  .account-session { grid-template-columns: 1fr; gap: 12px; }
  .learner-account-sidebar { position: static; padding: 14px; }
  .learner-profile-overview { grid-template-columns: auto minmax(0,1fr) minmax(180px,.7fr); }
  .learner-profile-overview .status-orb { grid-row: auto; }
  .learner-profile-overview .session-identity { grid-column: auto; margin: 0; }
  .learner-profile-overview dl { grid-column: 1 / -1; }
  .learner-profile-nav { display: flex; overflow-x: auto; scrollbar-width: thin; scroll-snap-type: x proximity; }
  .learner-profile-nav a { min-width: 150px; scroll-snap-align: start; }
  .learner-sidebar-logout { margin-bottom: 0; }
}
body[data-account-view="session"] .account-shell { width: min(1440px,calc(100% - 40px)); grid-template-columns: 1fr; }
body[data-account-view="session"] .account-intro { display: none; }
body[data-account-view="session"] .account-panel { padding: clamp(18px,2.5vw,32px); }
@media (max-width: 560px) {
  .account-header, .account-shell { width: min(100% - 24px, 1180px); }
  .account-header { min-height: 86px; padding: 14px 0; flex-wrap: wrap; gap: 12px; }
  .account-brand > span { width: 46px; border-radius: 14px; font-size: 29px; }
  .account-brand strong { font-size: 21px; }
  .account-header-actions { width: 100%; min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .account-header-actions > * { min-width: 0; justify-content: center; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
  .candidate-badge { padding: 9px 7px; font-size: 10px; }
  .candidate-admin-link { padding: 9px 7px; font-size: 10px; }
  .account-intro h1 { letter-spacing: -.065em; }
  .account-facts { grid-template-columns: 1fr; }
  .account-panel { padding: 22px 18px; border-radius: 26px; }
  .account-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .account-tabs button { min-width: 0; padding: 11px 4px; font-size: 12px; }
  .candidate-invitation { grid-template-columns: 1fr; }
  .candidate-invitation output { grid-column: auto; }
  .account-session dl { grid-template-columns: 1fr; }
  .learner-profile-overview { grid-template-columns: auto minmax(0,1fr); }
  .learner-profile-overview .session-identity,.learner-profile-overview dl { grid-column: 1 / -1; }
  .learner-account-overview { min-height: 330px; padding: 24px 18px; }
.learner-message-columns,.learner-support-area { grid-template-columns: 1fr; }
  .learner-learning-settings-grid { grid-template-columns: 1fr 1fr; }
  .learner-settings-edit-form { grid-template-columns: 1fr; }
.learner-api-configuration-grid { grid-template-columns: 1fr 1fr; }
  .message-center-heading { align-items: stretch; flex-direction: column; }
  .message-center-actions { display: grid; grid-template-columns: 1fr; }
  .learner-mailbox-toolbar { align-items: stretch; flex-direction: column; }
  .learner-mailbox-toolbar > div { display: grid; grid-template-columns: 1fr; }
  #turnstileWidget { transform-origin: left top; max-width: 100%; overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}