/*
 * Public surface refresh: homepage, sign-in and registration.
 * Loaded after the legacy theme so this file can stay isolated and reversible.
 */

body[data-role="public"]:not([data-shell]),
body[data-shell="login"] {
  --public-ink: var(--ui-ink, #242a30);
  --public-muted: var(--ui-muted, #657078);
  --public-line: var(--ui-line, #dce2e6);
  --public-canvas: var(--ui-canvas, #f7f8fa);
  --public-surface: var(--ui-surface, #ffffff);
  --public-accent: var(--ui-accent, var(--brand-primary, #176b5a));
  --public-coral: var(--ui-coral, #bf483e);
  --public-focus: var(--ui-focus, #246b89);
  --public-width: 74rem;
  color: var(--public-ink);
  background: var(--public-canvas);
  font-size: 1rem;
  line-height: 1.55;
}

body[data-role="public"]:not([data-shell]) :is(button, a, input):focus-visible,
body[data-shell="login"] :is(button, a, input):focus-visible {
  outline: 3px solid var(--public-focus);
  outline-offset: 3px;
}

/* A vacant advertising rail must not narrow the page. */
body[data-role="public"][data-page-module="home"]:not([data-shell]) #main {
  display: block;
  inline-size: 100%;
  max-inline-size: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(#public-home-ad-right, #public-home-ad-disclaimer):not(:has(iframe, ins, img, picture, video, object, a[href], [data-ad-filled="true"])) {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(#auth-view, #public-home-sections) {
  inline-size: 100%;
  max-inline-size: none;
}

/* Header */
body[data-role="public"]:not([data-shell]) .site-header {
  min-block-size: 4.5rem;
  border-block: 0;
  padding-block: 0;
  background: color-mix(in srgb, var(--public-surface) 94%, transparent);
  color: var(--public-ink);
  box-shadow: 0 1px 0 var(--public-line);
  backdrop-filter: blur(16px);
}

body[data-role="public"]:not([data-shell]) .site-header-inner {
  inline-size: min(calc(100% - 3rem), var(--public-width));
  min-block-size: 4.5rem;
  margin-inline: auto;
  padding-inline: 0;
}

body[data-role="public"]:not([data-shell]) .brand-logo {
  inline-size: 2.75rem;
  block-size: 2.75rem;
  border: 1px solid var(--public-line);
  border-radius: 8px;
  padding: 0.2rem;
  background: var(--public-surface);
  box-shadow: none;
}

body[data-role="public"]:not([data-shell]) .brand strong {
  color: var(--public-ink);
  font-size: 1rem;
  font-weight: 750;
  letter-spacing: 0;
}

body[data-role="public"]:not([data-shell]) .brand span {
  color: var(--public-muted);
  font-size: 0.8125rem;
}

body[data-role="public"]:not([data-shell]) :is(.nav, .account-nav) .tab {
  min-block-size: 2.75rem;
  border: 0;
  border-radius: 7px;
  padding-inline: 0.875rem;
  background: transparent;
  color: var(--public-muted);
  font-size: 0.9375rem;
  font-weight: 650;
  box-shadow: none;
}

body[data-role="public"]:not([data-shell]) :is(.nav, .account-nav) .tab:is(:hover, :focus-visible),
body[data-role="public"]:not([data-shell]) :is(.nav, .account-nav) .tab.is-active {
  border: 0;
  background: color-mix(in srgb, var(--public-accent) 9%, var(--public-surface));
  color: var(--public-accent);
  box-shadow: none;
}

body[data-role="public"]:not([data-shell]) .account-nav .account-tab:last-child {
  border: 1px solid var(--public-accent);
  background: var(--public-accent);
  color: #ffffff;
}

/* Real promotional artwork remains the first visual signal. */
body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-banner {
  inline-size: 100%;
  margin: 0;
  border-block-end: 1px solid var(--public-line);
  background: var(--public-surface);
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-banner-viewport {
  max-block-size: 31rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-banner-arrow {
  inline-size: 2.75rem;
  block-size: 2.75rem;
  border: 1px solid rgb(255 255 255 / 70%);
  background: rgb(36 42 48 / 72%);
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-banner-toggle {
  min-block-size: 2.25rem;
  border-radius: 6px;
  background: rgb(36 42 48 / 78%);
  font-size: 0.8125rem;
}

/* News and pinyin lookup share one calm, flat band. */
body[data-role="public"][data-page-module="home"]:not([data-shell]) .intro-panel.public-home-intro {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(24rem, 1.1fr);
  gap: 0;
  inline-size: min(calc(100% - 3rem), var(--public-width));
  max-inline-size: none;
  margin: 3rem auto 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--public-line);
  border-radius: 8px;
  background: var(--public-surface);
  box-shadow: 0 12px 34px rgb(36 42 48 / 7%);
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .intro-panel.public-home-intro::before,
body[data-role="public"][data-page-module="home"]:not([data-shell]) .intro-panel.public-home-intro::after {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-intro-primary,
body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-word-lookup {
  min-inline-size: 0;
  padding: 2rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-intro-primary {
  border-inline-end: 1px solid var(--public-line);
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-intro-primary:has(.public-home-live-empty) {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty) {
  grid-template-columns: minmax(0, 1fr);
  max-inline-size: var(--public-width);
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty) {
  grid-template-columns: minmax(0, 1fr) !important;
  inline-size: min(calc(100% - 3rem), var(--public-width));
  max-inline-size: var(--public-width);
  border: 1px solid var(--public-line);
  border-radius: 8px;
  background: var(--public-surface);
  box-shadow: 0 12px 34px rgb(36 42 48 / 7%);
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty)
  .public-home-word-lookup {
  inline-size: 100% !important;
  max-inline-size: none !important;
}

/* Keep this last, simple selector as the definitive empty-news layout. */
body[data-role="public"][data-page-module="home"]:not([data-shell])
  .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty) {
  display: block !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

@media (min-width: 901px) {
  body[data-role="public"][data-page-module="home"]:not([data-shell])
    #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty)
    .public-home-word-lookup {
    display: grid;
    grid-template-columns: minmax(13rem, 0.55fr) minmax(27rem, 1.45fr);
    grid-template-areas:
      "heading form"
      "heading feedback"
      "heading report";
    gap: 0.35rem 2rem;
    align-items: end;
    inline-size: 100% !important;
    padding: 1.5rem 2rem;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty)
    .public-home-word-lookup > :first-child {
    grid-area: heading;
    align-self: center;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty)
    .home-word-lookup-form {
    grid-area: form;
    margin: 0;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty)
    .home-word-lookup-feedback {
    grid-area: feedback;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    #main .intro-panel.public-home-intro:has(.public-home-intro-primary .public-home-live-empty)
    .pinyin-error-report-entry {
    grid-area: report;
  }
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-word-lookup {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: color-mix(in srgb, var(--public-accent) 4%, var(--public-surface));
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(.public-home-intro h1, .public-home-word-lookup h2) {
  margin: 0;
  color: var(--public-ink);
  font-size: 1.5rem;
  font-weight: 760;
  letter-spacing: 0;
  line-height: 1.25;
  text-wrap: balance;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(.public-home-intro p, .public-home-word-lookup p) {
  margin-block: 0.45rem 0;
  color: var(--public-muted);
  font-size: 1rem;
  line-height: 1.6;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-word-lookup-form {
  margin-block-start: 1.25rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-word-lookup-form > label {
  color: var(--public-ink);
  font-size: 0.875rem;
  font-weight: 700;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-word-lookup-form > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.625rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .home-word-lookup-form :is(input, .button) {
  min-block-size: 3rem;
  border-radius: 7px;
  font-size: 1rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-word-lookup-form input {
  border-color: #b8c2c8;
  background: var(--public-surface);
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-word-lookup-form .button {
  border-color: var(--public-accent);
  background: var(--public-accent);
  color: #ffffff;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .pinyin-error-report-trigger {
  color: var(--public-coral);
  font-size: 0.875rem;
}

/* Full-width content rhythm; sections are bands, not floating cards. */
body[data-role="public"][data-page-module="home"]:not([data-shell]) #public-home-sections {
  display: flex;
  flex-direction: column;
  inline-size: min(calc(100% - 3rem), var(--public-width));
  margin-inline: auto;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-section {
  inline-size: 100%;
  max-inline-size: none;
  margin-block-start: 0;
  padding-inline: 0;
  padding-block: 3.5rem;
  border: 0;
  border-block-end: 1px solid var(--public-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* frontend-polish-v2 groups ID and class branches in :is(), which gives the
   whole legacy selector ID specificity. Name the public modules explicitly. */
body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(#public-practice-entries, #public-voice-practice) {
  border: 0;
  border-block-end: 1px solid var(--public-line);
  border-radius: 0;
  padding-inline: 0;
  background: transparent;
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-section .section-title {
  max-inline-size: none;
  margin-block-end: 1.5rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-section .section-title h2,
body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-live-section .panel > h3 {
  margin: 0;
  color: var(--public-ink);
  font-size: 1.5rem;
  font-weight: 760;
  letter-spacing: 0;
  line-height: 1.3;
  text-wrap: balance;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-section .section-title p {
  margin-block: 0.35rem 0;
  color: var(--public-muted);
  font-size: 0.875rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(.public-section, .public-home-intro, .public-home-word-lookup) {
  font-size: 0.9375rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(.section-title label, .section-title .hint, .home-word-lookup-form > label) {
  font-size: 0.875rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  :is(.public-section .hint, .public-section label) {
  font-size: 0.875rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-practice-entries {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(22rem, 0.8fr);
  gap: 1.5rem 2rem;
  padding-inline: 0;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-practice-entries > .section-title {
  align-items: start;
  margin: 0;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .school-practice-search {
  inline-size: 100%;
  max-inline-size: none;
  margin: 0;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .school-practice-search :is(input, .button) {
  min-block-size: 3rem;
  border-radius: 7px;
  font-size: 1rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .textbook-groups {
  grid-column: 1 / -1;
  gap: 2.25rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .textbook-group:has(> .home-course-grid > .empty-state:only-child) {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .textbook-group-heading {
  margin-block-end: 1rem;
  border-block-end: 0;
  padding-block-end: 0;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .textbook-group-heading :is(h3, h4) {
  margin: 0;
  color: var(--public-accent);
  font-size: 1rem;
  font-weight: 750;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .textbook-group > .home-course-grid {
  grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
  gap: 1rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .textbook-group > .home-course-grid:has(> .course-cover-card:only-child) {
  grid-template-columns: minmax(0, 32rem);
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .textbook-group > .home-course-grid > .course-cover-card:only-child {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  align-items: stretch;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .textbook-group > .home-course-grid > .course-cover-card:only-child .course-cover-media {
  block-size: 100%;
  min-block-size: 7.5rem;
  aspect-ratio: auto;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .course-cover-card {
  overflow: hidden;
  min-block-size: 0;
  border: 1px solid var(--public-line);
  border-radius: 8px;
  background: var(--public-surface);
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .course-cover-card:is(:hover, :focus-visible) {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--public-accent) 48%, var(--public-line));
  box-shadow: 0 12px 26px rgb(36 42 48 / 10%);
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .course-cover-media {
  aspect-ratio: 12 / 7;
  background: #eef2f3;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .course-cover-copy {
  gap: 0.25rem;
  padding: 0.875rem;
  background: var(--public-surface);
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .course-cover-copy strong {
  color: var(--public-ink);
  font-size: 1rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .course-cover-copy :is(small, em) {
  color: var(--public-muted);
  font-size: 0.8125rem;
  line-height: 1.45;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .voice-topic-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--public-line);
  border-radius: 8px;
  background: var(--public-line);
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .voice-topic-card:nth-child(n) {
  min-block-size: 8rem;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  border: 0;
  border-radius: 0;
  padding: 1.25rem;
  background: var(--public-surface);
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .voice-topic-card:nth-child(n)::before {
  inline-size: 2.5rem;
  block-size: 2.5rem;
  border-radius: 7px;
  background: color-mix(in srgb, var(--public-accent) 10%, var(--public-surface));
  color: var(--public-accent);
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .voice-topic-card strong {
  color: var(--public-ink);
  font-size: 1rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .voice-topic-card > span {
  color: var(--public-muted);
  font-size: 0.8125rem;
  line-height: 1.5;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  .voice-topic-card:is(:hover, :focus-visible) {
  z-index: 1;
  transform: none;
  background: color-mix(in srgb, var(--public-accent) 5%, var(--public-surface));
  box-shadow: inset 0 -3px 0 var(--public-accent);
}

/* Remove sections whose rendered payload is explicitly only an unavailable placeholder. */
body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-external-practice-preview:has(> .empty-state):not(:has(.external-practice-card)) {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-social-preview:has(.module-entry-card.is-muted):not(:has(a[href], .module-entry-card:not(.is-muted))) {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) #public-external-practice-preview,
body[data-role="public"][data-page-module="home"]:not([data-shell]) #public-trust-preview > .public-trust-section {
  padding: 3.5rem 0;
  border: 0;
  border-block-end: 1px solid var(--public-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-external-practice-preview::before {
  display: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-live-section {
  padding-block: 3.5rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-live-section .panel {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-home-sections .public-live-section .panel {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-live-section .list-item {
  min-block-size: 4.75rem;
  border: 0;
  border-block-start: 1px solid var(--public-line);
  border-radius: 0;
  padding-block: 1rem;
  background: transparent;
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-live-empty {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--public-muted);
  font-size: 1rem;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-live-empty p {
  margin: 0;
}

body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-live-empty .button {
  min-block-size: 2.75rem;
  border-radius: 7px;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-home-copyright-disclaimer > .copyright-disclaimer {
  border: 0;
  border-block: 1px solid var(--public-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-home-copyright-disclaimer .copyright-disclaimer-details > summary {
  min-block-size: 4.5rem;
  padding: 1rem 0;
  background: transparent;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-home-copyright-disclaimer .copyright-disclaimer-body {
  padding: 1rem 0 1.25rem;
  background: transparent;
}

body[data-role="public"][data-page-module="home"]:not([data-shell])
  #public-home-copyright-disclaimer .copyright-disclaimer-version {
  font-size: 0.8125rem;
}

/* Login and registration */
body[data-shell="login"] main {
  padding-block: 2.5rem 4rem;
}

body[data-shell="login"] .login-page {
  inline-size: min(calc(100% - 3rem), var(--public-width));
  max-inline-size: none;
  min-block-size: calc(100dvh - 9rem);
}

body[data-shell="login"] .login-back-home {
  min-block-size: 2.75rem;
  border: 0;
  border-radius: 7px;
  color: var(--public-accent);
  font-size: 0.9375rem;
}

body[data-shell="login"] .login-shell {
  grid-template-columns: minmax(0, 1.05fr) minmax(23rem, 0.75fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--public-line);
  border-radius: 8px;
  background: var(--public-surface);
  box-shadow: 0 18px 48px rgb(36 42 48 / 9%);
}

body[data-shell="login"] .login-page-copy {
  min-block-size: 35rem;
  border-radius: 0;
  padding: 3rem;
  background-color: #164f45;
  background-image:
    linear-gradient(90deg, rgb(14 50 43 / 93%), rgb(14 50 43 / 68%)),
    url("https://3958219.s148i.faieduusr.com/4/101/AJQBCAAQBBgAIOq738UGKNGCy9kHMM4aOIQH.png");
  box-shadow: none;
}

body[data-shell="login"] .login-page-copy h1 {
  max-inline-size: 13ch;
  margin-block: 0.5rem 1rem;
  font-size: 2.5rem;
  letter-spacing: 0;
  line-height: 1.15;
}

body[data-shell="login"] .login-page-copy > p:not(.eyebrow) {
  font-size: 1rem;
  line-height: 1.7;
}

body[data-shell="login"] .login-page .auth-card {
  border: 0;
  border-radius: 0;
  padding: 2.25rem;
  background: var(--public-surface);
  box-shadow: none;
}

body[data-shell="login"] .login-page .tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-block-end: 2rem;
  border-block-end: 1px solid var(--public-line);
}

body[data-shell="login"] .login-page .tabs .tab {
  min-block-size: 3rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--public-muted);
  box-shadow: none;
  font-size: 1rem;
}

body[data-shell="login"] .login-page .tabs .tab.is-active {
  color: var(--public-accent);
  box-shadow: inset 0 -3px 0 var(--public-accent);
}

body[data-shell="login"] .auth-form h2 {
  margin-block: 0 1.5rem;
  color: var(--public-ink);
  font-size: 1.5rem;
  letter-spacing: 0;
}

body[data-shell="login"] .auth-form .field {
  gap: 0.45rem;
}

body[data-shell="login"] .auth-form .field > :is(label, span),
body[data-shell="login"] .auth-form .field > legend {
  color: var(--public-ink);
  font-size: 0.875rem;
  font-weight: 700;
}

body[data-shell="login"] .auth-form .field input:not([type="radio"]):not([type="checkbox"]) {
  min-block-size: 3.25rem;
  border-color: #b8c2c8;
  border-radius: 7px;
  background: var(--public-surface);
  font-size: 1rem;
}

body[data-shell="login"] .auth-form .button.full {
  min-block-size: 3.25rem;
  border-radius: 7px;
  background: var(--public-accent);
  font-size: 1rem;
}

body[data-shell="login"] .registration-role-options label {
  border-radius: 7px;
  font-size: 0.9375rem;
}

body[data-shell="login"] .privacy-consent-field,
body[data-shell="login"] .auth-status-panel {
  border-inline-start-width: 3px;
  border-radius: 0 7px 7px 0;
}

@media (max-width: 900px) {
  body[data-role="public"]:not([data-shell]) .site-header-inner,
  body[data-role="public"][data-page-module="home"]:not([data-shell])
    :is(.intro-panel.public-home-intro, #public-home-sections),
  body[data-shell="login"] .login-page {
    inline-size: min(calc(100% - 2rem), var(--public-width));
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .intro-panel.public-home-intro {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-home-intro-primary {
    border-inline-end: 0;
    border-block-end: 1px solid var(--public-line);
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-practice-entries {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .textbook-groups {
    grid-column: auto;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .voice-topic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-shell="login"] .login-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-shell="login"] .login-page-copy {
    min-block-size: 18rem;
    padding: 2rem;
  }

  body[data-shell="login"] .login-page-copy h1 {
    font-size: 2rem;
  }
}

@media (max-width: 620px) {
  body[data-role="public"]:not([data-shell]) .site-header-inner,
  body[data-role="public"][data-page-module="home"]:not([data-shell])
    :is(.intro-panel.public-home-intro, #public-home-sections),
  body[data-shell="login"] .login-page {
    inline-size: min(calc(100% - 1.5rem), var(--public-width));
  }

  body[data-role="public"]:not([data-shell]) .site-header-inner {
    min-block-size: 4rem;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .intro-panel.public-home-intro {
    margin-block-start: 1.5rem;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    :is(.public-home-intro-primary, .public-home-word-lookup) {
    padding: 1.25rem;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .public-section,
  body[data-role="public"][data-page-module="home"]:not([data-shell]) #public-external-practice-preview,
  body[data-role="public"][data-page-module="home"]:not([data-shell]) #public-trust-preview > .public-trust-section {
    padding-block: 2.5rem;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .home-word-lookup-form > div,
  body[data-role="public"][data-page-module="home"]:not([data-shell]) .school-practice-search {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    :is(.home-word-lookup-form .button, .school-practice-search .button) {
    inline-size: 100%;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .textbook-group > .home-course-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    .textbook-group > .home-course-grid:has(> .course-cover-card:only-child) {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    .textbook-group > .home-course-grid > .course-cover-card:only-child {
    grid-template-columns: minmax(0, 1fr);
    max-inline-size: 15rem;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell])
    .textbook-group > .home-course-grid > .course-cover-card:only-child .course-cover-media {
    min-block-size: 0;
    aspect-ratio: 12 / 7;
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .voice-topic-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-role="public"][data-page-module="home"]:not([data-shell]) .voice-topic-card:nth-child(n) {
    min-block-size: 6.75rem;
  }

  body[data-shell="login"] main {
    padding-block: 1rem 2rem;
  }

  body[data-shell="login"] .login-shell {
    border-radius: 8px;
  }

  body[data-shell="login"] .login-page-copy,
  body[data-shell="login"] .login-page .auth-card {
    padding: 1.25rem;
  }

  body[data-shell="login"] .login-page-copy {
    min-block-size: 15rem;
  }

  body[data-shell="login"] .login-page-copy h1 {
    font-size: 1.75rem;
  }
}

@media (pointer: coarse) {
  body[data-role="public"]:not([data-shell]) :is(button, a, input),
  body[data-shell="login"] :is(button, a, input) {
    min-block-size: 3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-role="public"]:not([data-shell]) .course-cover-card,
  body[data-role="public"]:not([data-shell]) .voice-topic-card {
    transition: none;
  }
}

@media (forced-colors: active) {
  body[data-role="public"]:not([data-shell]) :is(.course-cover-card, .voice-topic-grid),
  body[data-shell="login"] .login-shell {
    border-color: CanvasText;
  }
}