:root {
  color-scheme: light;
  --site-max: 1400px;
  --site-gutter: 24px;
  --site-width: min(var(--site-max), calc(100vw - var(--site-gutter) * 2));
  --header-height: 72px;
  --sidebar-width: 280px;
  --sidebar-width-collapsed: 88px;
  --student-nav-width: clamp(196px, 18vw, 224px);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --radius-1: 10px;
  --radius-2: 14px;
  --radius-3: 18px;
  --radius-4: 24px;
  --radius-5: 32px;
  --radius-pill: 999px;
  --font-root: 16px;
  --font-family-sans:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Arial, sans-serif;
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --line-height-body: 1.5;
  --mp-text-bump: 1;
  --brand-900: #1b2a44;
  --brand-800: #24365b;
  --brand-700: #3f5ea3;
  --brand-600: #5d7ff4;
  --brand-500: #7fa3ff;
  --brand-50: #f6f8ff;
  --brand-200: #dbe5ff;
  --brand-100: #eef3ff;
  --brand: var(--brand-600);
  --brand-1: var(--brand-700);
  --brand-2: var(--brand-500);
  --student-700: #4e64a8;
  --student-600: #6178d4;
  --student-500: #7b95ff;
  --student-400: #a7b8ff;
  --student-300: #ccd6ff;
  --student-200: #d9e2ff;
  --student-100: #eff3ff;
  --success-700: #256848;
  --success-100: #edf7f1;
  --warning-700: #946319;
  --warning-100: #fff6e7;
  --danger-700: #b43e34;
  --danger-100: #fff1f0;
  --bg-canvas: #f4efe5;
  --bg-canvas-soft: #fbf8f2;
  --bg-panel: #fffdf9;
  --bg-panel-2: #f7f1e8;
  --bg-panel-3: #ece2d3;
  --bg-elevated: rgba(255, 253, 249, 0.96);
  --bg-interactive: linear-gradient(180deg, #fffdf9, #f7f1e8);
  --bg-hover: color-mix(in srgb, var(--brand-100) 40%, var(--bg-panel) 60%);
  --bg-active: color-mix(in srgb, var(--brand-100) 58%, var(--bg-panel-2) 42%);
  --bg-selected: linear-gradient(
    135deg,
    rgba(232, 237, 255, 0.96),
    rgba(248, 243, 234, 0.98)
  );
  --bg-highlight: color-mix(in srgb, var(--brand-100) 54%, var(--bg-panel) 46%);
  --bg-accent-soft: color-mix(
    in srgb,
    var(--brand-100) 54%,
    var(--bg-panel) 46%
  );
  --text-strong: #223047;
  --text-body: #48566d;
  --text-soft: #5f6d84;
  --text-inverse: #f8f9ff;
  --text-disabled: #8f98ac;
  --text-muted: var(--text-body);
  --line-subtle: rgba(55, 66, 99, 0.12);
  --line-default: rgba(55, 66, 99, 0.2);
  --line-strong: rgba(55, 66, 99, 0.34);
  --selected-border: rgba(93, 127, 244, 0.34);
  --focus-ring: rgba(93, 127, 244, 0.22);
  --shadow-sm: 0 8px 18px rgba(15, 18, 34, 0.05);
  --shadow-md: 0 16px 34px rgba(15, 18, 34, 0.1);
  --shadow-lg: 0 28px 66px rgba(15, 18, 34, 0.16);
  --surface-shadow-ui: var(--shadow-sm);
  --card-padding: 20px;
  --control-height: 46px;
  --control-height-sm: 40px;
  --row-padding-y: 12px;
  --row-padding-x: 16px;
  --tile-min-height: 80px;
  --text: var(--text-strong);
  --muted: var(--text-body);
  --ink: var(--text-strong);
  --line: var(--line-default);
  --panel: var(--bg-elevated);
  --panel-strong: var(--bg-panel);
  --bg-page: var(--bg-canvas);
  --bg-soft: var(--bg-canvas-soft);
  --text-on-brand: var(--text-inverse);
  --text-on-light-strong: var(--text-strong);
  --text-on-light-muted: var(--text-body);
  --text-on-light-soft: var(--text-soft);
  --text-on-light-muted-strong: color-mix(
    in srgb,
    var(--text-body) 90%,
    var(--text-strong) 10%
  );
  --text-on-light-soft-strong: color-mix(
    in srgb,
    var(--text-soft) 82%,
    var(--text-strong) 18%
  );
  --text-on-dark-strong: var(--text-inverse);
  --text-on-dark-muted: color-mix(
    in srgb,
    var(--text-inverse) 86%,
    var(--brand-100) 14%
  );
  --text-on-dark-soft: color-mix(
    in srgb,
    var(--text-inverse) 72%,
    var(--brand-100) 28%
  );
  --brand-400: color-mix(in srgb, var(--brand-500) 60%, var(--brand-200) 40%);
  --brand-300: color-mix(in srgb, var(--brand-500) 35%, var(--brand-200) 65%);
  --text-default: var(--text-body);
  --student-800: color-mix(
    in srgb,
    var(--student-700) 82%,
    var(--brand-900) 18%
  );
  --success-500: color-mix(
    in srgb,
    var(--success-700) 62%,
    var(--success-100) 38%
  );
  --success-50: color-mix(in srgb, var(--success-100) 82%, var(--bg-panel) 18%);
  --warning-600: color-mix(
    in srgb,
    var(--warning-700) 82%,
    var(--warning-100) 18%
  );
  --warning-500: color-mix(
    in srgb,
    var(--warning-700) 62%,
    var(--warning-100) 38%
  );
  --warning-50: color-mix(in srgb, var(--warning-100) 82%, var(--bg-panel) 18%);
  --danger-500: color-mix(
    in srgb,
    var(--danger-700) 62%,
    var(--danger-100) 38%
  );
  --accent-strong: var(--brand-700);
}

/* R3 SATs 2026 source-bound response affordances.
   These selectors consume the authored coordinate contract; they do not add
   detached controls or change the canonical response. */
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"cross"']
  .image-overlay__marker--point {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"cross"']
  .image-overlay__marker--point::before,
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"cross"']
  .image-overlay__marker--point::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 26px;
  height: 3px;
  border-radius: 2px;
  background: #2563eb;
  box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.96);
  transform-origin: center;
}
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"cross"']
  .image-overlay__marker--point::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"cross"']
  .image-overlay__marker--point::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"bar_height_handle"']
  .image-overlay__bar-preview {
  border-radius: 0;
}
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"bar_height_handle"']
  .image-overlay__marker--point {
  opacity: 0;
  transition: opacity 0.14s ease;
}
.image-overlay__coordinate-layer[data-image-coordinate-overlay*='"marker_style":"bar_height_handle"']:is(
    :hover,
    :focus,
    :focus-visible,
    :active
  )
  .image-overlay__marker--point {
  opacity: 1;
}

[data-question-id="reasoning-2026-p2-v2-q16"]
  .image-overlay__target--circle
  .image-overlay__target-core {
  inset: 16% 24% !important;
}
[data-question-id="reasoning-2026-p2-v2-q16"]
  .image-overlay__target--circle
  .image-overlay__target-core::before,
[data-question-id="reasoning-2026-p2-v2-q16"]
  .image-overlay__target--circle.is-selected
  .image-overlay__target-core::before {
  inset: 0 !important;
  border-width: 2px;
  background: transparent;
  box-shadow: none !important;
}

html[data-appearance="dark"] {
  color-scheme: dark;
  --bg-canvas: #111827;
  --bg-canvas-soft: #182033;
  --bg-panel: #202744;
  --bg-panel-2: #253055;
  --bg-panel-3: #303a60;
  --bg-elevated: rgba(32, 39, 68, 0.96);
  --bg-interactive: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-2) 94%, black 6%)
  );
  --bg-hover: color-mix(in srgb, var(--brand-100) 28%, var(--bg-panel) 72%);
  --bg-active: color-mix(in srgb, var(--brand-100) 38%, var(--bg-panel-2) 62%);
  --bg-selected: linear-gradient(
    135deg,
    rgba(65, 81, 135, 0.92),
    rgba(42, 54, 90, 0.96)
  );
  --bg-highlight: color-mix(in srgb, var(--brand-100) 24%, var(--bg-panel) 76%);
  --bg-accent-soft: color-mix(
    in srgb,
    var(--brand-100) 24%,
    var(--bg-panel) 76%
  );
  --brand-50: #2a3556;
  --text-strong: #f4f6ff;
  --text-body: #c6cee8;
  --text-soft: #a7b1cf;
  --text-inverse: #f8fbff;
  --text-disabled: #7f8aac;
  --line-subtle: rgba(188, 198, 230, 0.12);
  --line-default: rgba(188, 198, 230, 0.2);
  --line-strong: rgba(188, 198, 230, 0.34);
  --selected-border: rgba(168, 184, 255, 0.36);
  --focus-ring: rgba(142, 164, 255, 0.22);
  --success-700: #8fe2b4;
  --success-100: #183127;
  --warning-700: #f0cf8d;
  --warning-100: #3d3020;
  --danger-700: #ffb0ae;
  --danger-100: #3e2021;
  --shadow-sm: 0 10px 22px rgba(0, 0, 0, 0.28);
  --shadow-md: 0 18px 40px rgba(0, 0, 0, 0.34);
  --shadow-lg: 0 28px 72px rgba(0, 0, 0, 0.46);
}
html[data-appearance="high-contrast"] {
  color-scheme: light;
  --brand-900: #111111;
  --brand-800: #111111;
  --brand-700: #111111;
  --brand-600: #111111;
  --brand-500: #111111;
  --brand-50: #f5f5ef;
  --brand-200: #f5f5ef;
  --brand-100: #f5f5ef;
  --bg-canvas: #ffffff;
  --bg-canvas-soft: #f6f6f1;
  --bg-panel: #ffffff;
  --bg-panel-2: #f6f6f1;
  --bg-panel-3: #efefe6;
  --bg-elevated: #ffffff;
  --bg-interactive: #ffffff;
  --bg-hover: #f5f5ef;
  --bg-active: #efefe6;
  --bg-selected: #f5f5ef;
  --bg-highlight: #f5f5ef;
  --bg-accent-soft: #f5f5ef;
  --text-strong: #111111;
  --text-body: #222222;
  --text-soft: #333333;
  --text-inverse: #ffffff;
  --text-disabled: #666666;
  --line-subtle: #222222;
  --line-default: #222222;
  --line-strong: #000000;
  --selected-border: #111111;
  --focus-ring: rgba(17, 17, 17, 0.22);
  --success-700: #0f5d24;
  --success-100: #eff8f0;
  --warning-700: #8a5f00;
  --warning-100: #fff8df;
  --danger-700: #a32020;
  --danger-100: #fff1ee;
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
}
body.portal-adult {
  --site-max: 1520px;
  --bg-canvas: #f7f1e7;
  --bg-canvas-soft: #fcf6ec;
  --bg-panel: #fff9f0;
  --bg-panel-2: #fcf6ec;
  --bg-panel-3: #f0e6d6;
  --bg-elevated: rgba(255, 249, 240, 0.96);
  --text-strong: #22314b;
  --text-body: #616c86;
  --text-soft: #58647d;
  --line-default: rgba(40, 55, 89, 0.16);
  --line-strong: rgba(40, 55, 89, 0.24);
}
html[data-appearance="dark"] body.portal-adult {
  --bg-canvas: #10213f;
  --bg-canvas-soft: #13284b;
  --bg-panel: #17305a;
  --bg-panel-2: #203d72;
  --bg-panel-3: #152b4d;
  --bg-elevated: rgba(23, 48, 90, 0.96);
  --text-strong: #f4f7ff;
  --text-body: rgba(232, 238, 255, 0.84);
  --text-soft: rgba(232, 238, 255, 0.72);
  --line-default: rgba(186, 199, 243, 0.16);
  --line-strong: rgba(186, 199, 243, 0.24);
}
html.appearance-large-text {
  --mp-text-bump: 1.08;
}
html[data-font-level="0"] {
  --font-root: 16px;
}
html[data-font-level="1"] {
  --font-root: 18px;
}
html[data-font-level="2"] {
  --font-root: 20px;
}
html[data-font-level="3"] {
  --font-root: 22px;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
}
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  font-size: var(--font-root);
}
body {
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-500) 12%, transparent),
      transparent 20%
    ),
    radial-gradient(
      circle at top left,
      color-mix(in srgb, var(--brand-700) 10%, transparent),
      transparent 24%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-canvas) 94%, white 6%),
      var(--bg-canvas)
    );
  color: var(--text-strong);
  font: calc(16px * var(--mp-text-bump)) / var(--line-height-body)
    var(--font-family-sans);
}
body:before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.14),
    transparent 28%
  );
}
html[data-appearance="dark"] body:before {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.02),
    transparent 28%
  );
}
html[data-appearance="high-contrast"] body:before {
  background: none;
}
#appRoot {
  position: relative;
  z-index: 1;
}
a {
  color: inherit;
  text-decoration: none;
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  cursor: pointer;
}
img {
  display: block;
  max-width: 100%;
}
code,
.mono {
  font-family: var(--font-family-mono);
}
.hidden,
.is-hidden {
  display: none !important;
}
:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--focus-ring);
}
html[data-appearance="high-contrast"] *:focus-visible {
  outline: 3px solid #000;
  outline-offset: 2px;
  box-shadow: none;
}
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  min-height: 44px;
  align-items: center;
}
.skip-link:focus-visible {
  display: inline-flex;
  left: 12px;
  top: 12px;
  z-index: 300;
  background: var(--bg-panel);
  border-radius: var(--radius-pill);
  padding: 10px 14px;
  box-shadow: var(--shadow-md);
}
.muted,
.small,
.field-help,
.card-subtitle,
.section-header p,
.page-header p,
.brand-copy span,
.utility-strip__inner,
.footer,
.footer a,
.clean-list,
.visual-answer-shell__helper,
.runner-helper,
.runner-prompt__context,
.runner-prompt__detail,
.app-breadcrumbs__item,
.app-breadcrumbs__sep {
  color: var(--text-body);
}
.small {
  font-size: 0.875rem;
}
.eyebrow,
.sidebar-group__title,
.student-side-nav__title,
.homepage-card__eyebrow,
.homepage-section__eyebrow {
  font-size: 0.875rem;
  line-height: 1.25;
  text-transform: none;
  letter-spacing: 0.04em;
  font-weight: 800;
  color: color-mix(in srgb, var(--brand-700) 72%, var(--text-strong) 28%);
}
:is(
  .page-shell,
  .public-shell,
  .student-shell,
  .app-shell,
  .app-topbar__inner,
  .student-topbar__inner,
  .public-header__inner,
  .mp-topbar__inner,
  .utility-strip__inner,
  .footer__inner
) {
  width: var(--site-width);
  margin-inline: auto;
}
:is(.page-shell, .public-shell) {
  padding-block: 18px 32px;
}
.student-shell {
  padding-block: 0 32px;
}
.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  gap: var(--space-5);
  align-items: start;
  padding-block: 16px 32px;
}
.app-main,
.student-page-content,
.app-content {
  min-width: 0;
}
.app-main,
.student-page-content {
  display: grid;
  gap: var(--space-4);
  align-content: start;
}
.student-shell__body,
.student-shell__body--with-nav {
  width: var(--site-width);
  margin-inline: auto;
  display: grid;
  gap: var(--space-5);
  align-items: start;
}
.student-shell__body {
  grid-template-columns: minmax(0, 1fr);
}
.student-shell__body--with-nav {
  grid-template-columns: var(--student-nav-width) minmax(0, 1fr);
}
.student-page-content--runner {
  display: flex;
  width: 100%;
  flex: 1 1 auto;
  min-width: 0;
  min-height: calc(100dvh - var(--header-height) - var(--space-4));
}
.student-page-content--runner .runner-shell {
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 100%;
  width: min(100%, 1120px);
  margin-inline: auto;
}
.student-page-content--runner .runner-shell-v2 {
  --runner-shell-max-width: 1700px;
  --runner-answer-dock-width: clamp(360px, 23vw, 420px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 16px;
  min-width: 0;
  min-height: 100%;
  height: calc(100dvh - clamp(20px, 6dvh, 108px));
  max-height: none;
  width: min(100%, var(--runner-shell-max-width));
  margin-inline: auto;
  padding: 14px 14px 18px;
  --runner-visual-max-h: min(70dvh, 840px);
  align-content: stretch;
  align-items: stretch;
  overflow: visible;
}
body.portal-student:has(.runner-shell-v2--competition-sprint) {
  overflow: hidden;
}
body.portal-student:has(.runner-shell-v2--competition-sprint) .student-shell {
  padding-bottom: 0;
}
@media (min-width: 1181px) {
  body.portal-student
    .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--competition-sprint[data-session-kind="competition"][data-dock-variant="competition-sprint"] {
    grid-template-rows: minmax(0, 1fr);
  }
}
@media (min-width: 761px) and (max-width: 1180px) {
  .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--competition-sprint[data-session-kind="competition"][data-dock-variant="competition-sprint"]
    .runner-stage-v2 {
    grid-template-rows: minmax(132px, 0.25fr) minmax(0, 0.75fr);
  }
}
body.portal-student:has(.runner-shell-v2--competition-sprint)
  .student-shell__body--runner,
body.portal-student:has(.runner-shell-v2--competition-sprint)
  .student-focus-shell__body--runner,
body.portal-student:has(.runner-shell-v2--competition-sprint)
  .student-page-content--runner {
  min-height: calc(100dvh - var(--header-height));
  height: calc(100dvh - var(--header-height));
  padding-bottom: 0;
  overflow: hidden;
}
.student-page-content--runner .runner-shell-v2[data-session-kind="competition"],
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-sprint[data-session-kind="competition"][data-dock-variant="competition-sprint"] {
  --runner-shell-max-width: 1320px;
  --runner-competition-gap: clamp(8px, 1.25dvh, 14px);
  --runner-competition-pad: clamp(8px, 1.2dvh, 14px);
  --runner-competition-key-min: clamp(56px, 8.2dvh, 74px);
  --runner-visual-max-h: min(42dvh, 520px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: var(--runner-competition-gap);
  min-height: 0;
  height: calc(100dvh - var(--header-height));
  max-height: calc(100dvh - var(--header-height));
  width: min(100%, var(--runner-shell-max-width));
  padding: var(--runner-competition-pad) 14px
    calc(var(--runner-competition-pad) + env(safe-area-inset-bottom, 0px));
  align-content: stretch;
  align-items: stretch;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-sprint[data-dock-variant="competition-sprint"]
  .runner-stage-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(92px, 0.28fr) minmax(0, 0.72fr);
  gap: var(--runner-competition-gap);
  min-height: 0;
  height: 100%;
  max-height: 100%;
  align-items: stretch;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-sprint[data-dock-variant="competition-sprint"][data-answer-mode="pick-grid"]
  .runner-stage-v2,
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-sprint[data-dock-variant="competition-sprint"][data-answer-mode="select"]
  .runner-stage-v2 {
  grid-template-rows: minmax(72px, 0.18fr) minmax(0, 0.82fr);
}
.runner-shell-v2--competition-sprint .runner-competition-prompt-panel {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-height: 0;
  height: 100%;
  gap: 0;
  padding: clamp(12px, 1.5dvh, 18px);
  overflow: hidden;
}
.runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel
  .runner-question-body-v2,
.runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel
  .runner-question-stage-v2 {
  display: grid;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  align-content: center;
  align-items: center;
  justify-items: center;
  gap: clamp(6px, 1dvh, 10px);
}
.runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel
  .runner-question-stage-v2
  > .runner-prompt {
  width: 100%;
  max-width: 100%;
  margin: 0;
  align-self: center;
  justify-self: center;
  display: grid;
  place-items: center;
  text-align: center;
}
.runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel
  .runner-prompt__main {
  max-width: min(100%, 54rem);
  max-inline-size: min(100%, 54rem);
  margin-inline: auto;
  text-align: center;
  font-size: clamp(1.45rem, 3.5dvh, 2.75rem);
  line-height: 1.08;
}
.runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel.runner-question-panel--prompt-equation-only
  .runner-prompt__main {
  font-size: clamp(2.2rem, 8.2dvh, 5rem);
  line-height: 1;
}
.runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel:is(
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .runner-prompt__main {
  font-size: clamp(1.32rem, 3dvh, 2.35rem);
  line-height: 1.08;
}
.runner-shell-v2--competition-sprint .runner-visual-panel-v2 {
  max-height: min(100%, var(--runner-visual-max-h));
  overflow: hidden;
}
.runner-shell-v2--competition-sprint .runner-competition-answer-area {
  display: grid;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  padding: clamp(10px, 1.45dvh, 16px);
  overflow: hidden;
  align-content: stretch;
  align-items: stretch;
}
.runner-shell-v2--competition-sprint .runner-competition-answer-area--typed {
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(8px, 1.3dvh, 14px);
}
.runner-shell-v2--competition-sprint .runner-competition-answer-area--choice {
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area
  .runner-answer-stage-v2,
.runner-shell-v2--competition-sprint .runner-competition-answer-stack {
  width: 100%;
  max-width: 100%;
  min-height: 0;
  margin: 0;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--typed
  .runner-answer-stage-v2 {
  align-content: start;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--typed
  .runner-competition-answer-stack {
  width: min(100%, 560px);
  margin-inline: auto;
}
.runner-shell-v2--competition-sprint .runner-answer-field {
  gap: 0;
}
.runner-shell-v2--competition-sprint .runner-answer-field__label {
  display: none;
}
.runner-shell-v2--competition-sprint .runner-answer-field__control {
  grid-template-columns: minmax(0, 1fr);
  margin-top: 0;
}
.runner-shell-v2--competition-sprint .runner-answer-field input,
.runner-shell-v2--competition-sprint [data-answer-input] {
  min-height: clamp(64px, 9dvh, 96px);
  padding: 8px 18px;
  text-align: center;
  font-size: clamp(1.7rem, 5.4dvh, 3rem);
  font-weight: 850;
  line-height: 1.05;
  border-radius: 20px;
}
.runner-competition-numpad-wrap {
  display: grid;
  min-height: 0;
  align-items: center;
  justify-items: center;
  overflow: hidden;
}
.runner-competition-numpad {
  display: grid;
  grid-template-rows: repeat(4, minmax(var(--runner-competition-key-min), 1fr));
  gap: clamp(7px, 1.2dvh, 12px);
  width: min(100%, 540px);
  height: 100%;
  max-height: 100%;
  margin-inline: auto;
}
.runner-competition-numpad__row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(7px, 1.2dvh, 12px);
  min-height: 0;
}
.runner-competition-key {
  min-width: 0;
  min-height: var(--runner-competition-key-min);
  height: 100%;
  border-radius: 18px;
  font-size: clamp(1.35rem, 3.7dvh, 2.05rem);
  font-weight: 900;
  line-height: 1;
  box-shadow: var(--surface-shadow-ui);
}
.runner-competition-key--enter {
  font-size: clamp(1rem, 2.6dvh, 1.45rem);
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .runner-answer-stage-v2,
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .runner-competition-answer-stack {
  height: 100%;
  display: grid;
  min-height: 0;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .options-grid[data-option-grid] {
  display: grid;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  grid-template-columns: repeat(var(--option-grid-cols, 2), minmax(0, 1fr));
  grid-template-rows: repeat(var(--option-grid-rows, 1), minmax(44px, 1fr));
  grid-auto-rows: minmax(44px, 1fr);
  gap: clamp(8px, 1.35dvh, 16px);
  justify-content: stretch;
  align-content: stretch;
  overflow: hidden;
  padding: 0;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .options-grid--scroll-list {
  overflow: hidden;
  max-height: none;
  overscroll-behavior: auto;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  :is(.option-chip, .option-chip--tile, .option-chip--single) {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 20px;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .option-chip
  input[type="radio"],
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .option-chip
  input[type="checkbox"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .option-chip
  > span {
  display: grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 0;
  text-align: center;
  white-space: nowrap;
  text-wrap: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: clamp(1.15rem, 3.2dvh, 2.15rem);
  line-height: 1.05;
  font-weight: 850;
}
.runner-shell-v2--competition-sprint
  .runner-competition-answer-area--choice
  .option-chip--wordy
  > span {
  font-size: clamp(1rem, 2.35dvh, 1.48rem);
}
@media (max-width: 760px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"] {
    --runner-shell-max-width: 100%;
    --runner-competition-gap: 8px;
    --runner-competition-pad: 7px;
    --runner-competition-key-min: clamp(56px, 7.6dvh, 64px);
    padding-inline: 8px;
  }
  .runner-shell-v2--competition-sprint .runner-status-v2 {
    min-height: 64px;
    padding: 8px 10px;
    border-radius: 20px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }
  .runner-shell-v2--competition-sprint .runner-status-v2__center {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .runner-shell-v2--competition-sprint .runner-header-pill-v2 {
    min-height: 38px;
    padding: 6px 10px;
    font-size: 0.84rem;
  }
  .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--competition-sprint[data-dock-variant="competition-sprint"]
    .runner-stage-v2 {
    grid-template-rows: minmax(96px, 0.3fr) minmax(0, 0.7fr);
  }
  .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--competition-sprint[data-dock-variant="competition-sprint"][data-answer-mode="pick-grid"]
    .runner-stage-v2,
  .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--competition-sprint[data-dock-variant="competition-sprint"][data-answer-mode="select"]
    .runner-stage-v2 {
    grid-template-rows: minmax(72px, 0.18fr) minmax(0, 0.82fr);
  }
  .runner-shell-v2--competition-sprint .runner-competition-prompt-panel {
    padding: 10px;
    border-radius: 20px;
  }
  .runner-shell-v2--competition-sprint .runner-competition-answer-area {
    padding: 6px;
    border-radius: 20px;
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-prompt-panel
    .runner-prompt__main {
    font-size: clamp(1.25rem, 3.2dvh, 2rem);
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-prompt-panel.runner-question-panel--prompt-equation-only
    .runner-prompt__main {
    font-size: clamp(2rem, 7dvh, 3.25rem);
  }
  .runner-shell-v2--competition-sprint .runner-answer-field input,
  .runner-shell-v2--competition-sprint [data-answer-input] {
    min-height: clamp(60px, 7.8dvh, 74px);
    font-size: clamp(1.55rem, 4.6dvh, 2.25rem);
    border-radius: 18px;
  }
  .runner-competition-numpad {
    width: 100%;
    gap: 7px;
  }
  .runner-competition-numpad__row {
    gap: 7px;
  }
  .runner-competition-key {
    border-radius: 16px;
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--choice
    .options-grid[data-option-grid] {
    gap: 6px;
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--choice
    .option-chip
    > span {
    font-size: clamp(1.05rem, 2.7dvh, 1.6rem);
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--choice
    .options-grid[data-option-grid="3x6"] {
    gap: 5px;
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--choice
    .options-grid[data-option-grid="3x6"]
    :is(.option-chip, .option-chip--tile, .option-chip--single) {
    padding-inline: 2px;
    border-radius: 16px;
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--choice
    .options-grid[data-option-grid="3x6"]
    .option-chip
    > span {
    font-size: clamp(0.95rem, 4.4dvh, 1.08rem);
  }
}
@media (min-width: 1181px) {
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--choice
    .options-grid[data-option-grid] {
    grid-template-columns: repeat(var(--option-grid-cols, 4), minmax(0, 1fr));
  }
  .runner-shell-v2--competition-sprint
    .runner-competition-answer-area--typed
    .runner-answer-stage-v2,
  .runner-shell-v2--competition-sprint .runner-competition-numpad {
    width: min(100%, 560px);
  }
}
.runner-side-rail-v2[data-has-tools-card="false"] {
  grid-template-rows: auto;
}
.runner-actions-v2--competition {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  flex-wrap: wrap;
}
.runner-actions-v2__group {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.runner-actions-v2__group--utility,
.runner-actions-v2__inline {
  display: grid;
  gap: 10px;
  width: 100%;
  align-items: stretch;
  grid-template-columns: 1fr;
}
.runner-actions-v2__group--danger {
  margin-left: auto;
}
.runner-actions-v2--competition
  .btn:is(
    [data-runner-fullscreen-toggle],
    [data-runner-pause],
    [data-runner-cancel]
  ) {
  min-height: 48px;
  width: 100%;
  min-width: 0;
  justify-content: center;
}
.runner-header-v2 {
  position: relative;
  display: block;
}
.runner-status-v2 {
  display: grid;
  grid-template-columns: auto minmax(420px, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 86px;
  padding: 12px 18px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  border: 1px solid var(--line-default);
  border-radius: 28px;
  box-shadow: var(--surface-shadow-ui);
}
.runner-header-v2__left,
.runner-header-v2__right,
.runner-status-v2__left,
.runner-status-v2__right {
  display: flex;
  align-items: center;
}
.runner-header-v2__right,
.runner-status-v2__right {
  justify-content: flex-end;
}
.runner-header-v2__center,
.runner-status-v2__center {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.runner-status-v2__progress-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.runner-header-pill-v2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 10px 20px;
  border-radius: 999px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-interactive) 96%, white 4%);
  color: var(--text-strong);
  font-size: 1rem;
  font-weight: 800;
  white-space: nowrap;
}
.runner-header-pill-v2--timer {
  min-width: 72px;
  font-variant-numeric: tabular-nums;
}
.runner-header-progress-v2 {
  width: 100%;
  min-width: 0;
}
.runner-header-caption-v2 {
  font-size: 0.84rem;
  color: var(--text-body);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.runner-header-progress-value-v2 {
  color: var(--text-muted);
  font-size: 0.86rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.runner-stage-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(
      380px,
      var(--runner-answer-dock-width, 420px)
    );
  gap: 20px;
  align-items: stretch;
  min-height: 0;
  height: 100%;
  max-height: none;
}
.runner-card-v2,
.runner-rail-card-v2 {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  border: 1px solid var(--line-default);
  border-radius: var(--radius-4);
  box-shadow: var(--surface-shadow-ui);
  color: var(--text-strong);
}
.runner-stage-v2 > .runner-question-card-v2 {
  height: 100%;
  min-height: 0;
  align-self: stretch;
}
.runner-question-card-v2 {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 16px;
  min-height: 0;
  max-height: 100%;
  height: 100%;
  padding: 16px 16px 18px;
  align-content: stretch;
  align-items: stretch;
  overflow: hidden;
}
.runner-question-card-v2:is(
  .runner-question-panel--mode-compact-typed,
  .runner-question-panel--mode-selection-grid,
  .runner-question-panel--mode-diagram-fixed-frame,
  .runner-question-panel--mode-diagram-interactive-grid
) {
  min-height: 0;
  height: 100%;
  align-self: stretch;
}
.runner-question-head-v2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.runner-question-meta-v2 {
  color: var(--student-700);
  font-weight: 800;
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.runner-question-body-v2 {
  display: grid;
  gap: 14px;
  align-content: stretch;
  justify-items: stretch;
  min-height: 0;
  min-width: 0;
  overflow: clip;
  overscroll-behavior: auto;
  padding-right: 0;
  scrollbar-gutter: auto;
}
.runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-question-body-v2 {
  align-content: stretch;
  justify-items: stretch;
  overflow: clip;
  padding-right: 0;
}
.runner-question-card-v2:is(
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .runner-question-body-v2 {
  align-content: stretch;
  justify-items: stretch;
}
.runner-question-stage-v2,
.runner-answer-stage-v2 {
  width: min(100%, var(--runner-content-stage-max, 980px));
  margin-inline: auto;
}
.runner-question-stage-v2 {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
  align-content: stretch;
  align-items: stretch;
  min-height: 100%;
  height: 100%;
}
.runner-answer-stage-v2 {
  display: grid;
  gap: 12px;
}
.runner-question-card-v2.runner-question-panel--mode-selection-grid {
  --runner-content-stage-max: 980px;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame {
  --runner-content-stage-max: 1080px;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid {
  --runner-content-stage-max: 1120px;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
.runner-question-card-v2.runner-question-panel--choice,
.runner-question-card-v2.runner-question-panel--shape-choice {
  --runner-visual-max-h: min(54dvh, 620px);
}
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
.runner-question-card-v2.runner-question-panel--coordinate-grid,
.runner-question-card-v2.runner-question-panel--transformation-grid {
  --runner-visual-max-h: min(64dvh, 760px);
}
.runner-question-card-v2 .runner-prompt {
  gap: 10px;
}
.runner-question-card-v2 .runner-prompt__intro,
.runner-question-card-v2 .runner-prompt__context,
.runner-question-card-v2 .runner-prompt__detail {
  font-size: clamp(0.98rem, 1.05vw, 1.08rem);
  line-height: 1.35;
}
.runner-question-card-v2 .runner-question-body-v2 {
  scroll-padding-top: 88px;
}
.runner-question-card-v2 .runner-question-stage-v2 > .runner-prompt {
  position: relative;
  top: auto;
  z-index: 4;
  color: var(--text-strong);
  background: none;
  padding-bottom: 0;
  align-self: start;
}
.runner-question-card-v2 .runner-prompt__main {
  max-width: min(100%, 68rem);
  max-inline-size: min(100%, 68rem);
  margin-inline: 0;
  text-align: left;
  font-size: clamp(1.32rem, 1.48vw, 1.9rem);
  line-height: 1.2;
}
.runner-question-card-v2.runner-question-panel--prompt-equation-only
  .runner-question-stage-v2 {
  grid-template-rows: minmax(0, 1fr);
  place-items: center;
  align-content: center;
}
.runner-question-card-v2.runner-question-panel--prompt-equation-only
  .runner-prompt {
  align-self: center;
  justify-self: center;
  text-align: center;
  width: min(100%, 64rem);
  display: grid;
  place-items: center;
  margin: auto;
}
.runner-question-card-v2.runner-question-panel--prompt-equation-only
  .runner-prompt__main {
  font-size: clamp(2.2rem, 2.8vw, 3.3rem);
  line-height: 1.06;
  text-align: center;
  margin-inline: auto;
}
.runner-question-card-v2.runner-question-panel--prompt-narrative
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--prompt-visual
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--prompt-choice
  .runner-prompt__main {
  font-size: clamp(1.3rem, 1.46vw, 1.85rem);
  line-height: 1.22;
  text-align: left;
}
.runner-question-card-v2.runner-question-panel--stimulus-geometry
  .runner-visual-panel-v2
  .visual-card,
.runner-question-card-v2.runner-question-panel--visual-size-geometry-medium
  .runner-visual-panel-v2
  .visual-card {
  width: min(100%, 880px);
}
.runner-question-card-v2.runner-question-panel--visual-size-fraction-medium
  .runner-visual-panel-v2
  .visual-card {
  width: min(100%, 900px);
}
.runner-question-card-v2.runner-question-panel--visual-size-fraction-medium
  .runner-visual-panel-v2
  .visual-svg--fraction-model {
  height: clamp(112px, 19dvh, 180px);
  max-height: min(24dvh, 190px);
}
.runner-question-card-v2.runner-question-panel--visual-size-grid-large
  .runner-visual-panel-v2
  .visual-card {
  width: min(100%, 1040px);
}
.runner-question-card-v2.runner-question-panel--visual-size-official-image
  .runner-visual-panel-v2
  .question-image-wrap,
.runner-question-card-v2.runner-question-panel--visual-size-official-image
  .runner-visual-panel-v2
  .official-crop-wrap {
  width: min(100%, 1080px);
  max-height: 100%;
  overflow: hidden;
}
.runner-question-card-v2:is(
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.25rem, 1.42vw, 1.75rem);
  line-height: 1.18;
  text-align: left;
}
.runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
    .runner-question-panel--prompt-equation-only
  )
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.35rem, 1.55vw, 2rem);
  line-height: 1.16;
  text-align: left;
}
.runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-prompt--arithmetic-stimulus {
  grid-row: 1 / -1;
  align-self: center;
  justify-self: center;
  text-align: center;
  width: min(100%, 64rem);
}
.runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-prompt--arithmetic-stimulus
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-prompt--arithmetic-stimulus
  .runner-prompt__main--accent {
  justify-self: center;
  text-align: center;
}
.student-page-content--runner
  .runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel
  .runner-question-stage-v2
  > .runner-prompt {
  align-self: center;
  justify-self: center;
  display: grid;
  place-items: center;
  width: 100%;
  margin: auto;
  text-align: center;
}
.student-page-content--runner
  .runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel
  .runner-prompt__main,
.student-page-content--runner
  .runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel.runner-question-panel--prompt-choice
  .runner-prompt__main,
.student-page-content--runner
  .runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel.runner-question-panel--prompt-equation-only
  .runner-prompt__main,
.student-page-content--runner
  .runner-shell-v2--competition-sprint
  .runner-competition-prompt-panel.runner-question-panel--mode-compact-typed
  .runner-prompt__main {
  margin-inline: auto;
  text-align: center;
  justify-self: center;
}
.runner-visual-panel-v2 {
  display: grid;
  gap: 12px;
  width: 100%;
  min-width: 0;
  min-height: 0;
  max-height: 100%;
  align-content: center;
  justify-items: center;
  overflow: clip;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-visual-panel-v2,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-visual-panel-v2 {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-interactive) 90%, white 10%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  border: 1px solid var(--line-default);
  border-radius: 22px;
  padding: 14px 16px;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-visual-panel-v2 {
  gap: 10px;
}
.runner-question-card-v2:is(
    .runner-question-panel--mode-selection-grid,
    .runner-question-panel--fraction-model,
    .runner-question-panel--table
  )
  .runner-visual-panel-v2 {
  width: min(100%, 980px);
  margin-inline: auto;
}
.runner-visual-panel-v2 .visual-card,
.runner-question-card-v2 .question-image-wrap,
.runner-question-card-v2 .official-crop-wrap {
  width: min(100%, 1080px);
  max-width: 100%;
  margin-inline: auto;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .visual-card,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .question-image-wrap,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .official-crop-wrap {
  width: min(100%, 1180px);
}
.runner-response-zone-v2 {
  display: grid;
  min-width: 0;
  min-height: 0;
  align-self: start;
}
.runner-stage-v2 > .runner-response-zone-v2 {
  height: auto;
}
.runner-answer-panel-v2 {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0;
  align-content: stretch;
  min-width: 0;
  min-height: 0;
  max-height: min(70dvh, 760px);
  padding: 0;
  border: 1px solid var(--line-default);
  border-radius: var(--radius-4);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  box-shadow: var(--surface-shadow-ui);
  overflow: hidden;
}
.runner-answer-dock-head-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-subtle);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.runner-answer-dock-title-v2 {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--text-strong);
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: none;
}
.runner-answer-dock-title-v2 > span {
  min-width: 0;
}
.runner-answer-kind-chip-v2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, transparent);
  background: color-mix(in srgb, var(--brand-50) 58%, var(--bg-panel) 42%);
  color: color-mix(in srgb, var(--text-strong) 92%, var(--brand-700) 8%);
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}
.runner-answer-body-v2 {
  display: grid;
  grid-template-rows: auto auto minmax(0, auto);
  gap: 10px;
  align-content: start;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 10px 14px;
  scrollbar-gutter: stable;
}
.runner-answer-body-v2 > .runner-answer-stage-v2,
.runner-answer-body-v2 .runner-answer-stack-v2,
.runner-answer-body-v2 .runner-answer-tools-wrap-v2 {
  width: 100%;
  margin-inline: 0;
}
.runner-commandbar-wrap-v2 {
  border-top: 1px solid var(--line-subtle);
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
}
.runner-commandbar-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.12fr);
  gap: 10px;
  width: 100%;
  align-items: stretch;
}
.runner-command-button-v2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  min-height: 48px;
  padding: 8px 8px;
  border-radius: 14px;
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
}
.runner-command-button-v2 .runner-command-icon-v2 {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 18px;
}
.runner-command-button-v2 span {
  min-width: 0;
  white-space: nowrap;
}
.runner-command-button-v2[disabled] {
  cursor: not-allowed;
  opacity: 0.58;
}
.runner-command-button-v2--next[disabled] {
  background: color-mix(in srgb, var(--bg-panel-2) 92%, white 8%);
  border-color: var(--line-subtle);
  color: var(--text-disabled);
  box-shadow: none;
}
.runner-answer-panel-v2 .options-grid[data-option-grid] {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}
.runner-answer-panel-v2 :is(.option-chip--tile, .option-chip--single) {
  min-height: 56px;
  border-radius: 18px;
}
.runner-answer-panel-v2 .option-chip > span {
  display: grid;
  place-items: center;
  text-align: center;
  min-width: 0;
}
.options-grid--scroll-list {
  max-height: min(52vh, 520px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 2px 4px 2px 2px;
  align-content: start;
  justify-content: stretch;
  width: 100%;
  margin-inline: 0;
}
.runner-answer-body-v2 .options-grid--scroll-list {
  height: 100%;
  min-height: 0;
  max-height: min(52dvh, 520px, 100%);
}
.options-grid--scroll-list .option-chip > span {
  display: grid;
  place-items: center;
  text-align: center;
  text-wrap: pretty;
}
.runner-answer-tools-v2 {
  display: grid;
  gap: 6px;
  padding: 8px;
  border-radius: 16px;
  border: 1px solid var(--line-subtle);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.runner-answer-tools-title-v2 {
  display: none;
  color: var(--text-body);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.runner-answer-tools-v2 .runner-keyboard-wrap,
.runner-answer-tools-v2 .runner-keyboard {
  display: grid;
  gap: 5px;
}
.runner-answer-tools-v2 .runner-keyboard {
  grid-template-rows: repeat(4, minmax(44px, auto));
}
.runner-answer-tools-v2 .runner-keyboard-row {
  display: grid;
  grid-template-columns: repeat(var(--runner-keyboard-cols, 3), minmax(0, 1fr));
  gap: 5px;
}
.runner-answer-tools-v2 .runner-keyboard-row .btn {
  min-height: 44px;
}
.runner-answer-stack-v2 {
  width: min(100%, 760px);
  margin-inline: auto;
}
.runner-question-card-v2:is(
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .runner-answer-stack-v2 {
  width: min(100%, 980px);
}
.runner-question-card-v2 .options-grid {
  justify-content: center;
}
.runner-answer-panel-v2 .options-grid {
  justify-content: stretch;
}
.runner-question-card-v2:is(
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .options-grid[data-option-grid] {
  grid-template-columns: repeat(
    var(--option-grid-cols, 3),
    minmax(min(28vw, 170px), 1fr)
  );
  grid-auto-rows: minmax(88px, auto);
}
.runner-question-card-v2:is(
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  :is(.option-chip--tile, .option-chip--single) {
  min-height: 84px;
  border-radius: 18px;
}
.runner-question-card-v2:is(
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  :is(.option-chip--tile, .option-chip--single)
  > span {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 100%;
  padding: 12px 10px;
  text-align: center;
  text-wrap: pretty;
  font-size: clamp(1.05rem, 1.45vw, 1.4rem);
}
.runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-answer-panel-v2 {
  padding-top: 8px;
}
.runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-answer-stage-v2 {
  width: min(100%, 920px);
}
.runner-question-card-v2:is(
    .runner-question-panel--mode-selection-grid,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .options-grid[data-option-grid] {
  max-width: 100%;
  width: fit-content;
  margin-inline: auto;
}
.runner-side-rail-v2 {
  display: grid;
  grid-template-rows: auto auto;
  gap: 12px;
  align-content: start;
  align-self: start;
  min-height: 0;
  max-height: 100%;
  overflow: visible;
  position: sticky;
  top: 0;
}
.runner-rail-slot-v2 {
  min-height: 0;
}
.runner-rail-slot-v2--tools {
  display: grid;
  min-height: 0;
}
.runner-rail-slot-v2--actions {
  align-self: start;
}
.runner-rail-card-v2 {
  display: grid;
  gap: 12px;
  padding: 12px;
}
.runner-rail-card-v2--keyboard,
.runner-rail-card-v2--tools-placeholder {
  align-content: start;
  min-height: 0;
}
.runner-rail-card-v2--tools-placeholder {
  gap: 8px;
  padding: 10px 10px 12px;
}
.runner-rail-empty-v2 {
  gap: 8px;
}
.runner-rail-copy-v2 {
  font-size: 0.96rem;
  line-height: 1.45;
}
.runner-shell-v2[data-answer-mode="interactive"]
  .runner-rail-card-v2--tools-placeholder {
  gap: 10px;
}
.runner-rail-empty-v2 {
  display: grid;
  gap: 10px;
  align-content: start;
}
.runner-rail-pill-v2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 30px;
  padding: 5px 11px;
  border-radius: 999px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-interactive) 92%, white 8%);
  color: var(--text-body);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.runner-rail-copy-v2 {
  margin: 0;
  color: var(--text-body);
  font-size: 0.94rem;
  line-height: 1.45;
  max-width: 24ch;
}
.runner-rail-title-v2 {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.runner-actions-v2 {
  display: grid;
  gap: 10px;
}
.runner-actions-v2 .btn,
.runner-rail-card-v2--keyboard .btn {
  width: 100%;
  min-height: 46px;
  white-space: normal;
  word-break: normal;
  text-wrap: balance;
}
.runner-actions-v2__inline .btn {
  width: 100%;
}
.runner-rail-card-v2--keyboard .runner-keyboard-wrap {
  display: grid;
  gap: 10px;
}
.runner-rail-card-v2--keyboard .runner-keyboard {
  display: grid;
  gap: 8px;
}
.runner-rail-card-v2--keyboard .runner-keyboard-row {
  display: grid;
  grid-template-columns: repeat(var(--runner-keyboard-cols, 3), minmax(0, 1fr));
  gap: 8px;
}
.runner-rail-card-v2--keyboard .runner-keyboard-row--actions {
  align-items: stretch;
}
.runner-rail-card-v2--keyboard .btn[data-runner-key="enter"] {
  min-height: 50px;
  font-size: 1.02rem;
}
body.runner-fullscreen-mode {
  overflow: hidden;
}
body.runner-fullscreen-mode .student-shell__body--with-nav {
  grid-template-columns: minmax(0, 1fr);
  width: 100vw;
  max-width: none;
  gap: 0;
  margin: 0;
}
body.runner-fullscreen-mode .student-page-content--runner {
  min-height: 100dvh;
}
body.runner-fullscreen-mode .runner-shell-v2 {
  position: fixed;
  inset: 0;
  z-index: 999;
  min-height: 100dvh;
  height: 100dvh;
  max-height: 100dvh;
  width: 100vw;
  max-width: none;
  margin: 0;
  padding: 18px 16px 22px;
  overflow: auto;
  background: linear-gradient(180deg, var(--bg-page) 0%, var(--bg-soft) 100%);
  --runner-visual-max-h: clamp(220px, 44dvh, 560px);
}
body.runner-fullscreen-mode .runner-shell-v2 > .runner-header-v2,
body.runner-fullscreen-mode .runner-shell-v2 > .runner-stage-v2 {
  width: min(100%, 1440px);
  max-width: min(100%, 1440px);
  margin-inline: auto;
}
body.runner-fullscreen-mode .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr) 236px;
  min-height: 0;
  align-items: start;
}
.section,
.account-grid,
.data-list,
.answer-stack,
.runner-shell,
.runner-focus-shell,
.homepage-shell,
.homepage-section,
.recommendation-stack,
.auth-points,
.section-rail,
.drag-label-slots,
.runner-progress-head,
.visual-answer-shell,
.runner-visual-panel,
.fraction-model,
.drag-label-layout,
.runner-shell .runner-keyboard-wrap {
  display: grid;
  gap: var(--space-4);
}
.hero,
.layout-split,
.layout-split--balanced,
.dashboard-grid,
.auth-split,
.workspace-hero,
.homepage-hero,
.student-auth-split,
.staff-wire-grid,
.class-card__body,
.student-illustration-card,
.runner-layout,
.runner-layout--single {
  display: grid;
  gap: var(--space-5);
  align-items: start;
}
.hero,
.auth-split,
.workspace-hero,
.homepage-hero {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.92fr);
  align-items: stretch;
}
.layout-split {
  grid-template-columns: 1.15fr 0.85fr;
}
.layout-split--balanced {
  grid-template-columns: 1fr minmax(320px, 0.92fr);
}
.dashboard-grid {
  grid-template-columns: 1.2fr 0.8fr;
}
.staff-wire-grid {
  grid-template-columns: minmax(320px, 0.72fr) minmax(0, 1.08fr);
}
.class-card__body {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.92fr);
}
.student-auth-split {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.95fr);
}
.student-illustration-card {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.9fr);
  align-items: center;
}
.runner-layout {
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.45fr);
}
.runner-layout--single {
  grid-template-columns: 1fr;
}
.preview-grid,
.card-grid,
.stats-grid,
.workspace-kpis,
.feature-grid,
.journey-grid,
.pricing-grid,
.steps-grid,
.trust-grid,
.metric-grid,
.compact-kpis,
.student-home-grid,
.student-stat-grid,
.student-quick-grid,
.people-top-grid,
.learning-plan-grid,
.recommendation-grid,
.assignment-target-grid,
.options-grid,
.multi-field-grid,
.runner-meta-grid,
.homepage-feature-grid,
.homepage-journey-grid,
.route-journey,
.class-ops-grid,
.filter-bar,
.filter-bar--wide,
.filter-bar--curriculum,
.appearance-options,
.school-overview-grid {
  display: grid;
  gap: var(--space-4);
  align-items: stretch;
}
.preview-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.card-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.card-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.card-grid.four,
.workspace-kpis,
.pricing-grid,
.steps-grid,
.metric-grid,
.compact-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.feature-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.journey-grid,
.trust-grid,
.class-ops-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-grid,
.student-quick-grid,
.school-overview-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.student-stat-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.people-top-grid,
.learning-plan-grid {
  grid-template-columns: minmax(320px, 0.92fr) minmax(0, 1.08fr);
}
.recommendation-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.assignment-target-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  max-height: 260px;
  overflow: auto;
  padding-right: 2px;
}
.multi-field-grid.two,
.options-grid--2,
.options-grid--cols-2,
.options-grid--inline-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.multi-field-grid.three,
.options-grid--3,
.options-grid--cols-3,
.options-grid--inline-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.options-grid--4,
.options-grid--cols-4,
.options-grid--inline-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.options-grid--cols-5,
.options-grid--inline-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.runner-meta-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.homepage-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.homepage-journey-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.route-journey {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.filter-bar {
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
}
.filter-bar--wide,
.filter-bar--curriculum {
  grid-template-columns: repeat(5, minmax(160px, 1fr));
}
.appearance-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.options-grid[data-option-grid="1x3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.options-grid[data-option-grid="2x2"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.options-grid[data-option-grid="2x3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.options-grid[data-option-grid="2x4"] {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.options-grid[data-option-grid="2x5"] {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.options-grid[data-option-grid="3x3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.options-grid[data-option-grid="3x4"] {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.options-grid[data-option-grid="3x5"] {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.card,
.student-card,
.summary-card,
.sticky-summary-card,
.notice-card,
.list-card,
.kpi-card,
.metric-card,
.reward-card,
.recommendation-card,
.empty-state,
.data-item,
.table-wrap,
.inline-notice,
.sidebar-panel,
.auth-panel,
.auth-aside,
.hero-copy,
.hero-preview,
.workspace-hero,
.workspace-kpi,
.page-hero-card,
.public-band,
.assignment-target-panel,
.section-surface,
.section-surface--nested,
.plan-item-card,
.repair-plan-card,
.class-wire-card,
.student-auth-panel,
.student-auth-aside,
.runner-bar,
.runner-main,
.runner-answer-panel,
.runner-visual-panel,
.visual-card,
.student-side-nav,
.app-content,
.appearance-card,
.homepage-card,
.homepage-journey-card,
.feature-panel,
.journey-card,
.price-card,
.step-card,
.login-card,
.modal-card,
.toast,
.mobile-nav,
.utility-note,
.runner-side-card,
.runner-side-nav,
.runner-bar.runner-status-bar--wide,
.audit-warning-panel {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  border: 1px solid var(--line-default);
  border-radius: var(--radius-4);
  box-shadow: var(--surface-shadow-ui);
  color: var(--text-strong);
}
.card,
.student-card,
.summary-card,
.sticky-summary-card,
.notice-card,
.list-card,
.kpi-card,
.metric-card,
.reward-card,
.recommendation-card,
.empty-state,
.data-item,
.inline-notice,
.auth-panel,
.auth-aside,
.hero-copy,
.hero-preview,
.workspace-hero,
.workspace-kpi,
.page-hero-card,
.public-band,
.assignment-target-panel,
.section-surface,
.section-surface--nested,
.plan-item-card,
.repair-plan-card,
.class-wire-card,
.student-auth-panel,
.student-auth-aside,
.runner-bar,
.runner-main,
.runner-answer-panel,
.runner-visual-panel,
.visual-card,
.appearance-card,
.homepage-card,
.homepage-journey-card,
.feature-panel,
.journey-card,
.price-card,
.step-card,
.login-card,
.modal-card,
.toast,
.mobile-nav,
.utility-note,
.runner-side-card {
  padding: var(--card-padding);
}
.app-content {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-5);
}
.app-content > .section,
.app-content > .card,
.app-content > .summary-card,
.app-content > .notice-card,
.workspace-hero__copy,
.workspace-hero__panel {
  min-width: 0;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  border: 1px solid var(--line-default);
  border-radius: var(--radius-3);
  padding: var(--space-4);
  box-shadow: var(--surface-shadow-ui);
}
.sidebar-panel {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  padding: 0;
}
.workspace-hero {
  gap: var(--space-6);
  padding: var(--space-6);
}
.workspace-hero__panel {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 88%, white 12%),
    color-mix(in srgb, var(--brand-100) 28%, var(--bg-panel-2) 72%)
  );
}
.section-standout,
.surface-accent {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-2) 88%, white 12%)
  );
  border-radius: var(--radius-4);
  border: 1px solid var(--line-default);
  box-shadow: var(--shadow-md);
}
.section-standout {
  padding: 18px 16px 22px;
}
.public-band--hero {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--brand-100) 24%, var(--bg-panel) 76%)
  );
}
.public-band--surface {
  background: color-mix(in srgb, var(--bg-panel) 98%, white 2%);
}
.public-band--surface-alt,
.inline-notice,
.section-surface--nested,
.assignment-target-panel,
.runner-answer-panel,
.visual-answer-shell__summary,
.utility-note {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel-2) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-3) 84%, var(--bg-panel) 16%)
  );
}
.public-band--soft {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 92%, white 8%),
    color-mix(in srgb, var(--bg-canvas-soft) 96%, var(--bg-panel) 4%)
  );
}
.public-band--plans {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 16%, var(--bg-panel) 84%),
    color-mix(in srgb, var(--bg-panel) 98%, white 2%)
  );
}
.public-band--trust {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, #e9f1dc 14%, var(--bg-panel) 86%)
  );
}
.kpi-card,
.metric-card,
.workspace-kpi,
.hero-proof,
.appearance-card {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 84%, white 16%)
  );
}
html[data-appearance="high-contrast"]
  :is(
    .card,
    .student-card,
    .sidebar-panel,
    .auth-panel,
    .auth-aside,
    .workspace-hero,
    .student-side-nav
  ) {
  border-width: 2px;
}
.utility-strip,
.public-header,
.app-topbar,
.student-topbar {
  position: sticky;
  top: 0;
  z-index: 60;
  backdrop-filter: blur(14px) saturate(1.08);
  border-bottom: 1px solid var(--line-default);
}
.utility-strip,
.public-header,
.student-topbar {
  background: color-mix(in srgb, var(--bg-elevated) 92%, transparent);
}
.app-topbar {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-700) 16%, var(--bg-panel) 84%),
    color-mix(in srgb, var(--brand-800) 8%, var(--bg-panel) 92%)
  );
}
.utility-strip__inner {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  font-size: 0.875rem;
}
:is(.public-header__inner, .app-topbar__inner, .student-topbar__inner) {
  min-height: var(--header-height);
  padding-block: 10px;
  display: grid;
  align-items: center;
  gap: var(--space-4);
}
:is(.public-header__inner, .student-topbar__inner) {
  grid-template-columns: auto 1fr auto;
}
.app-topbar__inner {
  grid-template-columns: auto 1fr auto auto;
}
.brand,
.public-footer-brand,
.app-topbar__actions,
.student-topbar__actions,
.public-nav-right,
.utility-strip__links,
.preview-toolbar,
.mini-topbar,
.homepage-hero__actions,
.public-header__nav,
.public-header__controls,
.mp-topbar__controls,
.mp-tool-group,
.button-row,
.quick-action-row,
.pill-nav,
.pill-row,
.scope-switcher,
.tabs,
.tab-strip,
.runner-footer,
.runner-question-head,
.runner-answer-head,
.runner-action-bar,
.student-topbar__stats,
.runner-progress-head__meta,
.runner-status-bar__meta,
.runner-keyboard__extras,
.login-card .actions,
.class-wire-card__actions,
.button-row--equal,
.header-action-stack,
.app-page-bar,
.app-breadcrumbs,
.app-page-bar__meta,
.runner-status-bar__actions,
.runner-shell .runner-action-bar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}
.brand {
  min-width: 0;
}
.brand-badge {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  font-weight: 800;
  letter-spacing: 0.04em;
  background: linear-gradient(135deg, var(--brand-800), var(--brand-700));
  color: var(--text-inverse);
  box-shadow: var(--shadow-sm);
}
.brand-copy strong {
  display: block;
  font-size: 1.05rem;
  color: var(--text-strong);
}
.topbar-brand-image,
.sidebar-brand-image,
.public-footer-brand img,
.mp-footer__logo {
  width: auto;
  height: 40px;
  object-fit: contain;
}
.footer {
  padding: 24px 0 0;
}
.footer__inner {
  padding: 20px 0 0;
  border-top: 1px solid var(--line-subtle);
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.footer--public {
  background: var(--brand-900);
  color: #fffffff0;
}
.footer--public .muted,
.footer--public a {
  color: #ffffffd6;
}
.footer-tag {
  display: inline-flex;
  margin-top: 8px;
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  background: #ffffff1f;
  color: inherit;
  font-size: 12px;
}
.footer-heading {
  margin: 6px 0 10px;
  font-weight: 700;
  color: #fff;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 0.8fr 0.8fr;
  gap: var(--space-5);
}
.footer-links {
  display: grid;
  gap: var(--space-2);
  margin-top: 8px;
}
.footer-links a,
.mp-footer__links a,
.mp-footer a,
.footer a,
.public-header a,
.public-header button,
.student-topbar a,
.student-topbar button,
.public-header__nav a,
.public-header__controls a,
.public-header__controls button,
.public-nav-right a,
.public-nav-right button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
}
.footer-links a:hover {
  color: var(--brand-700);
}
.mp-footer {
  padding: 16px 0 20px;
  border-top: 1px solid var(--line-subtle);
  margin-top: 4px;
}
.mp-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
  max-width: min(100%, 720px);
  margin: 0 auto;
}
.mp-footer__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  font-weight: 700;
}
.mp-footer__links a {
  color: var(--text-strong);
}
.mp-footer__legal {
  display: grid;
  gap: 4px;
  margin-top: 0;
  font-size: 0.76rem;
  line-height: 1.4;
  color: var(--text-body);
  max-width: 64ch;
}
.mp-footer__legal p {
  margin: 0;
}
body.portal-public--auth .mp-footer {
  padding: 12px 0 16px;
  margin-top: 0;
}
body.portal-public--auth .mp-footer__inner {
  gap: 4px;
  max-width: min(100%, 700px);
}
body.portal-public--auth .mp-footer__logo {
  height: 34px;
}
body.portal-public--auth .mp-footer__legal {
  gap: 3px;
  font-size: 0.72rem;
  line-height: 1.36;
  max-width: 60ch;
}
.app-sidebar,
.student-side-nav {
  position: sticky;
  top: calc(var(--header-height) + 14px);
  align-self: start;
  display: grid;
  gap: var(--space-4);
  width: 100%;
  overflow: hidden;
  padding: var(--space-4);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
  );
  border: 1px solid var(--line-default);
  border-radius: var(--radius-5);
  box-shadow: var(--shadow-md);
}
.sidebar-panel--brand {
  padding-bottom: var(--space-3);
}
.sidebar-panel--nav .section-rail,
.student-side-nav__list,
.sidebar-group__items,
.sidebar-group,
.scope-switcher--sidebar,
.sidebar-footer-expanded,
.sidebar-footer-compact {
  display: grid;
  gap: var(--space-2);
}
.sidebar-group + .sidebar-group,
.sidebar-group--tree + .sidebar-group--tree {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--line-subtle);
}
.sidebar-group--tree {
  overflow: visible;
}
.sidebar-group__title,
.student-side-nav__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}
.sidebar-group__title {
  white-space: normal;
  line-height: 1.2;
  cursor: pointer;
  padding-right: 2px;
}
.sidebar-group__summary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
}
.sidebar-group__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}
.sidebar-group__icon {
  width: 18px;
  height: 18px;
  object-fit: contain;
  opacity: 0.88;
}
.sidebar-group__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-group__title::-webkit-details-marker,
.student-side-nav__section-toggle::-webkit-details-marker,
.student-more-options > summary::-webkit-details-marker,
.signin-menu summary::-webkit-details-marker,
.mp-language-menu summary::-webkit-details-marker,
.mp-profile-trigger::-webkit-details-marker {
  display: none;
}
.sidebar-group__chevron {
  transition: transform 0.2s ease;
  opacity: 0.7;
}
.sidebar-group--tree:not([open]) .sidebar-group__chevron {
  transform: rotate(-90deg);
}
.sidebar-link,
.student-side-nav__link {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 46px;
  min-width: 0;
  padding: 10px 14px 10px 18px;
  border-radius: var(--radius-2);
  border: 1px solid transparent;
  color: var(--text-strong);
  font-weight: 700;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    transform 0.12s ease;
}
.sidebar-link:hover,
.student-side-nav__link:hover {
  background: var(--bg-hover);
  border-color: var(--line-default);
}
.sidebar-link.is-active,
.student-side-nav__link.is-active {
  background: var(--bg-selected);
  border-color: var(--selected-border);
}
.sidebar-link.is-active:before,
.student-side-nav__link.is-active:before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: var(--brand-700);
}
.sidebar-link__icon,
.student-side-nav__icon,
.icon-chip img,
.sidebar-link img,
.sidebar-link__icon img {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  object-fit: contain;
  opacity: 0.88;
}
.sidebar-link span,
.student-side-nav__link span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.25;
}
.scope-switcher--sidebar .pill {
  justify-content: flex-start;
  width: 100%;
}
.sidebar-status,
.sidebar-help-btn,
.sidebar-collapse-btn,
.sidebar-icon-btn {
  width: 100%;
}
.sidebar-status {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: 12px 14px;
  border-radius: var(--radius-2);
  background: color-mix(in srgb, var(--brand-100) 22%, var(--bg-panel) 78%);
  border: 1px solid var(--line-subtle);
  color: var(--text-strong);
  font-size: 0.92rem;
}
.sidebar-status__dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #59d38a;
  box-shadow: 0 0 0 3px color-mix(in srgb, #59d38a 18%, transparent);
}
.sidebar-footer-compact {
  display: none;
  justify-items: stretch;
}
.sidebar-plan-note,
.sidebar-plan-note * {
  color: var(--text-body);
}
.sidebar-link__icon,
.student-side-nav__icon {
  filter: none;
}
.student-side-nav__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 12px;
  border: 1px solid var(--line-default);
  background: transparent;
  color: var(--text-strong);
  font: inherit;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  position: relative;
  z-index: 2;
}
.student-side-nav__section--more {
  gap: 8px;
}
.student-side-nav__section-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  min-height: 44px;
  padding: 6px;
  cursor: pointer;
  list-style: none;
  border-radius: 14px;
  color: var(--text-body);
  transition:
    background-color 0.18s ease,
    color 0.18s ease;
}
.student-side-nav__section-toggle:hover,
.student-side-nav__section-toggle.is-open {
  background: color-mix(in srgb, var(--bg-hover) 76%, transparent);
  color: var(--text-strong);
}
.student-side-nav__section-toggle-main {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.student-side-nav__icon-wrap--more {
  color: inherit;
}
.student-side-nav__icon-wrap--more svg {
  width: 18px;
  height: 18px;
}
.student-side-nav__section-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: inherit;
  opacity: 0.72;
  transition:
    transform 0.18s ease,
    opacity 0.18s ease;
}
.student-side-nav__section-chevron svg {
  width: 16px;
  height: 16px;
}
.student-side-nav__section--more[open] .student-side-nav__section-chevron {
  transform: rotate(90deg);
  opacity: 1;
}
.student-side-nav__section-items {
  display: grid;
  gap: var(--space-2);
}
body.sidebar-collapsed .app-shell {
  grid-template-columns: var(--sidebar-width-collapsed) minmax(0, 1fr);
}
body.sidebar-collapsed .app-sidebar {
  width: var(--sidebar-width-collapsed);
}
body.sidebar-collapsed .sidebar-group__label,
body.sidebar-collapsed .sidebar-group__chevron,
body.sidebar-collapsed .sidebar-link span,
body.sidebar-collapsed .sidebar-plan-note,
body.sidebar-collapsed .scope-switcher,
body.sidebar-collapsed .sidebar-status,
body.sidebar-collapsed .sidebar-help-btn,
body.sidebar-collapsed .sidebar-footer-expanded {
  display: none;
}
body.sidebar-collapsed .sidebar-footer-compact {
  display: grid;
}
body.sidebar-collapsed .sidebar-group__title {
  justify-content: center;
  min-height: 44px;
  padding-inline: 0;
  border: 1px solid transparent;
  border-radius: var(--radius-2);
}
body.sidebar-collapsed .sidebar-group__summary {
  justify-content: center;
}
body.sidebar-collapsed .sidebar-group__icon-wrap {
  margin-inline: auto;
}
body.sidebar-collapsed .sidebar-link {
  justify-content: center;
  padding-inline: 0;
}
body.sidebar-collapsed .sidebar-link:before {
  left: 8px;
}
.student-shell__body.student-nav-collapsed,
.student-shell__body--with-nav.student-nav-collapsed {
  grid-template-columns: 76px minmax(0, 1fr);
}
.student-shell__body.student-nav-collapsed .student-side-nav,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav {
  width: 76px;
}
.student-shell__body.student-nav-collapsed .student-side-nav__title,
.student-shell__body.student-nav-collapsed .student-side-nav__link span,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav__title,
.student-shell__body--with-nav.student-nav-collapsed
  .student-side-nav__link
  span {
  display: none;
}
.student-shell__body.student-nav-collapsed .student-side-nav__link,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav__link {
  justify-content: center;
  padding-inline: 0;
}
.student-shell__body.student-nav-collapsed
  .student-side-nav__link.is-active:before,
.student-shell__body--with-nav.student-nav-collapsed
  .student-side-nav__link.is-active:before {
  left: 3px;
}
.student-shell__body.student-nav-collapsed .student-side-nav__header,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav__header {
  justify-content: center;
}
.student-shell__body.student-nav-collapsed .student-side-nav__toggle,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav__toggle {
  margin-inline: auto;
}
.btn,
.button-row button,
.button-row a,
.section-actions button,
.auth-inline-link,
.auth-inline-link--button,
.homepage-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-height);
  padding: 0 16px;
  border-radius: var(--radius-2);
  border: 1px solid transparent;
  font-weight: 760;
  text-align: center;
  line-height: 1.1;
  letter-spacing: -0.01em;
  transition:
    transform 0.12s ease,
    border-color 0.16s ease,
    background-color 0.16s ease,
    box-shadow 0.16s ease;
}
.btn:hover,
.button-row button:hover,
.button-row a:hover,
.section-actions button:hover,
.homepage-btn:hover {
  transform: translateY(-1px);
}
.btn.primary,
.button-row .primary,
.homepage-btn--primary {
  background: linear-gradient(135deg, var(--brand-800), var(--brand-700));
  color: var(--text-inverse);
  box-shadow: var(--shadow-sm);
}
.btn.secondary,
.button-row .secondary,
.homepage-btn--secondary,
.auth-inline-link,
.auth-inline-link--button,
.btn.ghost,
.button-row .ghost,
.tab-button,
.pill,
.nav-pill,
.role-chip,
.mini-badge,
.status-pill.soft,
.status-pill.neutral,
.mp-command,
.mp-home-link,
.mp-portal-pill,
.student-side-nav__toggle {
  background: var(--bg-interactive);
  color: var(--text-strong);
  border-color: var(--line-default);
}
.btn.secondary:hover,
.button-row .secondary:hover,
.btn.ghost:hover,
.button-row .ghost:hover,
.tab-button:hover,
.pill:hover,
.nav-pill:hover,
.role-chip:hover,
.mini-badge:hover,
.student-side-nav__toggle:hover {
  background: var(--bg-hover);
  border-color: var(--line-strong);
}
.btn.accent {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, #dbc28d 70%, white 30%),
    color-mix(in srgb, #dbc28d 42%, white 58%)
  );
  color: #28301b;
  border-color: color-mix(in srgb, #dbc28d 50%, var(--line-default) 50%);
}
.btn.danger {
  background: var(--danger-100);
  color: var(--danger-700);
  border-color: color-mix(
    in srgb,
    var(--danger-700) 18%,
    var(--line-default) 82%
  );
}
.btn.icon,
.mp-topbar__control,
.sidebar-icon-btn {
  min-width: var(--control-height);
}
.btn.btn-compact,
.btn-compact,
.account-grid .tab-button,
.page-header .btn,
.student-topbar .button-row .btn,
.public-header .nav-pill,
.student-topbar .nav-pill,
.auth-switch__tab {
  min-height: var(--control-height);
  border-radius: 12px;
}
.btn.btn-text {
  min-height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--brand-700);
  box-shadow: none;
}
.btn.btn-text:hover {
  text-decoration: underline;
}
.btn:disabled,
.button-row button:disabled,
.section-actions button:disabled,
button[disabled],
.tab-button:disabled,
.btn[aria-disabled="true"] {
  opacity: 1;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
  color: var(--text-disabled);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 86%, var(--bg-panel-2) 14%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel-3) 8%)
  );
  border-color: var(--line-subtle);
}
.btn:disabled *,
.button-row button:disabled * {
  color: inherit;
}
.button-row {
  flex-wrap: wrap;
}
.button-row.stack {
  flex-direction: column;
  align-items: stretch;
}
.button-row--equal {
  justify-content: flex-end;
  flex-wrap: wrap;
}
.button-row--equal > .btn,
.button-row--equal > a,
.button-row--equal > button {
  min-width: 164px;
}
.button-row--dense {
  gap: var(--space-2);
}
.button-row--flush {
  margin-top: var(--space-1);
}
.pill-nav {
  justify-content: center;
}
.pill,
.nav-pill,
.status-pill,
.role-chip,
.mini-badge,
.icon-chip,
.visual-answer-pair {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 40px;
  padding: 8px 14px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line-default);
  background: var(--bg-interactive);
  color: var(--text-strong);
  font-weight: 700;
}
.pill.is-active,
.nav-pill.is-active,
.tab-button.is-active,
[role="tab"][aria-selected="true"] {
  background: var(--bg-selected);
  border-color: var(--selected-border);
  color: var(--text-strong);
}
.status-pill.success {
  background: var(--success-100);
  color: var(--success-700);
  border-color: color-mix(
    in srgb,
    var(--success-700) 22%,
    var(--line-default) 78%
  );
}
.status-pill.warning {
  background: var(--warning-100);
  color: var(--warning-700);
  border-color: color-mix(
    in srgb,
    var(--warning-700) 22%,
    var(--line-default) 78%
  );
}
.status-pill.danger {
  background: var(--danger-100);
  color: var(--danger-700);
  border-color: color-mix(
    in srgb,
    var(--danger-700) 18%,
    var(--line-default) 82%
  );
}
.tabs,
.tab-strip {
  width: fit-content;
  flex-wrap: wrap;
  padding: 4px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line-subtle);
  background: color-mix(in srgb, var(--bg-panel-2) 84%, transparent);
}
.tab-button {
  min-height: 40px;
  padding: 8px 14px;
  border-radius: var(--radius-pill);
  font-weight: 700;
}
input,
select,
textarea,
.search-box,
.search-input,
.command-palette__input,
.mp-command,
.mp-command-palette__input {
  width: 100%;
  min-height: var(--control-height);
  border-radius: var(--radius-2);
  border: 1px solid var(--line-default);
  background: var(--bg-interactive);
  color: var(--text-strong);
  padding: 11px 14px;
  box-shadow: inset 0 1px #ffffff59;
}
input::placeholder,
textarea::placeholder,
.mp-command-palette__input::placeholder {
  color: var(--text-soft);
  opacity: 1;
}
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  padding-inline: 18px;
}
textarea {
  padding-block: 12px;
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.search-box:focus-visible,
.search-input:focus-visible,
.command-palette__input:focus-visible,
.mp-command:focus-visible,
.mp-command-palette__input:focus-visible {
  border-color: var(--brand-600);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
label,
.field-group,
.selector-row label {
  display: grid;
  gap: 8px;
  font-weight: 700;
  color: var(--text-strong);
}
.toggle-row,
.label-inline {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}
.toggle-row input,
.appearance-card input,
.option-chip--compact input {
  width: auto;
  min-height: auto;
}
.selector-row {
  align-items: end;
}
.selector-row .field-help,
.field-help--inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-100) 62%, transparent);
  color: var(--brand-700);
  cursor: help;
  font-weight: 700;
  margin-left: 2px;
}
.option-chip {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 52px;
  padding: 12px 14px;
  border-radius: var(--radius-3);
  border: 1px solid var(--line-default);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  box-shadow: var(--surface-shadow-ui);
}
.option-chip:hover {
  border-color: var(--line-strong);
  background: var(--bg-hover);
}
.option-chip:has(input:checked) {
  background: var(--bg-selected);
  border-color: var(--selected-border);
}
.option-chip.is-active {
  background: var(--bg-selected);
  border-color: var(--selected-border);
}
.option-chip input[type="radio"],
.option-chip input[type="checkbox"] {
  appearance: none;
  width: 22px;
  height: 22px;
  min-height: 22px;
  margin: 0;
  border: 1.8px solid var(--line-strong);
  background: var(--bg-panel);
  box-shadow: inset 0 1px #ffffffd6;
}
.option-chip input[type="radio"] {
  border-radius: 999px;
}
.option-chip input[type="checkbox"] {
  border-radius: 7px;
}
.option-chip input[type="radio"]:checked,
.option-chip input[type="checkbox"]:checked {
  border-color: var(--brand-700);
}
.option-chip input[type="radio"]:checked {
  background: radial-gradient(
    circle at center,
    var(--brand-700) 0 42%,
    #fff 46% 100%
  );
}
.option-chip input[type="checkbox"]:checked {
  background: linear-gradient(135deg, var(--brand-700), var(--brand-600));
  position: relative;
}
.option-chip input[type="checkbox"]:checked:after {
  content: "";
  position: absolute;
  width: 6px;
  height: 11px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  left: 7px;
  top: 3px;
}
.option-chip--compact {
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--radius-2);
}
.option-chip--tile,
.option-chip--single {
  justify-content: center;
  text-align: center;
  min-height: var(--tile-min-height);
}
.option-chip--tile input,
.option-chip--single input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.option-chip--tile span,
.option-chip--single span {
  width: 100%;
  text-align: center;
  font-weight: 750;
}
.option-chip--symbol {
  min-height: 82px;
  border-radius: 22px;
  padding: 12px 16px;
}
.option-chip--symbol span {
  font-size: clamp(2.6rem, 5vw, 4rem);
  line-height: 1;
  font-weight: 800;
}
.table-wrap {
  overflow: auto;
  padding: 0;
}
.table-wrap table,
table,
.visual-table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
}
.table-wrap th,
.table-wrap td,
th,
td {
  padding: var(--row-padding-y) var(--row-padding-x);
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line-subtle);
  color: var(--text-strong);
}
.table-wrap th,
th {
  position: sticky;
  top: 0;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 42%, var(--bg-panel) 58%),
    color-mix(in srgb, var(--bg-panel-2) 84%, white 16%)
  );
  color: var(--text-body);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
}
.table-wrap tbody tr:hover,
tbody tr:hover {
  background: color-mix(in srgb, var(--brand-100) 26%, var(--bg-panel) 74%);
}
.table-wrap td strong,
.data-item strong {
  color: var(--text-strong);
}
.data-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: start;
}
.empty-state {
  gap: var(--space-2);
  justify-items: start;
}
.empty-state strong {
  font-size: 1.25rem;
}
.inline-notice.warning {
  background: var(--warning-100);
  border-color: color-mix(
    in srgb,
    var(--warning-700) 20%,
    var(--line-default) 80%
  );
}
.inline-notice.danger {
  background: var(--danger-100);
  border-color: color-mix(
    in srgb,
    var(--danger-700) 18%,
    var(--line-default) 82%
  );
}
.inline-notice--soft {
  margin-bottom: var(--space-3);
}
.audit-warning-panel {
  margin-bottom: var(--space-4);
  padding: 14px 16px;
  border-radius: var(--radius-3);
  border: 1px solid
    color-mix(in srgb, var(--warning-700) 28%, var(--line-default) 72%);
  background: color-mix(in srgb, var(--warning-100) 78%, var(--bg-panel) 22%);
  box-shadow: var(--shadow-sm);
}
.audit-warning-panel strong {
  display: block;
  margin-bottom: var(--space-2);
}
.audit-warning-panel ul {
  margin: 0;
  padding-left: 18px;
}
.audit-warning-panel li {
  margin: 6px 0;
}
.audit-warning-panel__source {
  display: inline-block;
  min-width: 110px;
  font-weight: 700;
  text-transform: capitalize;
}
.card-title,
.section-header h1,
.section-header h2,
.section-header h3,
.page-header h1,
.hero-copy h1,
.workspace-hero h1,
.auth-panel h1,
.student-auth-panel h1,
.runner-question-title,
.runner-prompt__main,
.homepage-hero__copy h1,
.homepage-section__title,
.homepage-card h3,
.homepage-journey-card h3 {
  margin: 0;
  color: var(--text-strong);
  letter-spacing: -0.03em;
}
.card-title {
  font-size: 1.25rem;
  margin-bottom: 6px;
}
.hero-copy h1,
.auth-panel h1,
.student-auth-panel h1,
.workspace-hero h1 {
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.02;
}
.runner-question-title {
  font-size: clamp(1.9rem, 3vw, 2.6rem);
  line-height: 1.1;
}
.section,
.runner-shell,
.homepage-shell,
.homepage-section {
  gap: var(--space-4);
}
.section.section--compact,
.section--compact {
  gap: 14px;
}
.section-soft {
  padding-top: 8px;
}
.section-header,
.page-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.section-header--stacked {
  align-items: flex-start;
}
.section-header--tight {
  align-items: center;
}
.portal-adult .card > .section-header > a.btn,
.portal-adult .card > .section-header > button.btn,
.portal-adult .card > .section-header > .button-row {
  align-self: flex-start;
}
.section-header p,
.page-header p {
  max-width: 72ch;
}
.section-header h1,
.section-header h2,
.section-header h3,
.page-header h1 {
  margin: 6px 0 2px;
  letter-spacing: -0.03em;
}
.clean-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: var(--space-2);
}
.hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.95fr);
  align-items: stretch;
}
.hero-copy,
.hero-preview,
.auth-panel,
.auth-aside,
.student-auth-panel,
.student-auth-aside {
  border-radius: 28px;
}
.hero-copy p,
.homepage-hero__copy p,
.homepage-section__sub,
.auth-panel p,
.auth-aside p,
.student-auth-panel p,
.student-auth-aside p {
  color: var(--text-body);
}
.homepage-shell {
  gap: var(--space-7);
  padding-top: 28px;
}
.homepage-hero {
  gap: 34px;
  align-items: center;
}
.homepage-hero__copy {
  display: grid;
  gap: 18px;
}
.homepage-hero__copy h1 {
  font-size: clamp(3.1rem, 7vw, 6rem);
  line-height: 0.96;
  letter-spacing: -0.06em;
  max-width: 8ch;
}
.homepage-hero__copy p {
  font-size: clamp(1.15rem, 1.6vw, 1.7rem);
  max-width: 22ch;
}
.homepage-hero__actions {
  display: grid;
  gap: 14px;
  max-width: 38rem;
}
.homepage-hero__actions .btn,
.homepage-btn {
  justify-content: center;
  min-width: 11rem;
}
.homepage-cockpit {
  display: grid;
  place-items: center;
  min-height: clamp(280px, 34vw, 420px);
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}
.homepage-cockpit img {
  width: min(100%, 560px);
  max-height: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
  margin-inline: auto;
}
.homepage-card,
.homepage-journey-card {
  padding: 18px 16px 22px;
  border-radius: 26px;
}
.homepage-card__icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: color-mix(in srgb, var(--brand-100) 60%, white 40%);
  color: var(--brand-700);
}
html[data-appearance="dark"] .homepage-card__icon,
html[data-theme="dark"] .homepage-card__icon,
body.theme-dark .homepage-card__icon {
  background: color-mix(in srgb, var(--brand-100) 84%, white 16%);
  color: var(--brand-700);
}
.homepage-card__icon svg {
  width: 26px;
  height: 26px;
}
.homepage-card h3,
.homepage-journey-card h3 {
  margin: 14px 0 10px;
  font-size: clamp(1.8rem, 2.5vw, 2.6rem);
  line-height: 1;
}
.homepage-journey-card--route h3 {
  margin-top: 0;
}
.homepage-card p,
.homepage-journey-card p {
  margin: 0;
}
.homepage-section__eyebrow,
.homepage-card__eyebrow {
  font-size: 0.9rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 800;
  color: color-mix(in srgb, var(--text-strong) 58%, transparent);
}
.homepage-section__title {
  font-size: clamp(2rem, 3.2vw, 3rem);
}
.homepage-section__sub {
  max-width: 48rem;
}
.homepage-journey-card .btn {
  width: fit-content;
  margin-top: auto;
}
.homepage-shell--v18-6-14 {
  display: grid;
  gap: 2rem;
}
.homepage-shell--v18-6-14 .homepage-card,
.homepage-shell--v18-6-14 .homepage-journey-card {
  min-height: 100%;
  padding: 1.6rem;
  border-radius: 1.5rem;
}
.homepage-hero__copy--landing {
  max-width: 36rem;
  align-content: start;
}
.homepage-hero__copy--landing h1 {
  max-width: 12.2ch;
  font-size: clamp(3.2rem, 5.35vw, 5.5rem);
  line-height: 0.96;
  letter-spacing: -0.055em;
}
.homepage-hero__sub--landing {
  margin: 0;
  max-width: 26ch;
  font-size: clamp(1.02rem, 1.22vw, 1.16rem);
  line-height: 1.42;
  color: color-mix(in srgb, var(--text-strong) 78%, white 22%);
}
.homepage-hero__actions--landing {
  width: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
}
.homepage-hero--landing {
  padding: clamp(1.5rem, 3vw, 2.4rem);
  border-radius: 32px;
  border: 1px solid var(--line-default);
  background:
    radial-gradient(
      circle at top left,
      color-mix(in srgb, var(--brand-100) 32%, transparent),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 96%, white 4%),
      color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
    );
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.homepage-hero__eyebrow {
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-strong) 60%, transparent);
}
.homepage-proof-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.homepage-proof-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0.5rem 0.82rem;
  border-radius: 999px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
  color: var(--text-strong);
  font-weight: 700;
  font-size: 0.86rem;
}
.homepage-hero--landing .homepage-cockpit {
  width: 100%;
  min-height: clamp(290px, 33vw, 410px);
  align-self: center;
}
.homepage-hero--landing .homepage-cockpit img {
  width: min(100%, 640px);
  max-height: clamp(290px, 31vw, 400px);
}
@media (min-width: 1200px) {
  .homepage-hero--landing {
    grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr);
    gap: clamp(1.5rem, 2.4vw, 2.6rem);
  }
  .homepage-hero--landing .homepage-cockpit {
    justify-self: center;
  }
}
.homepage-feature-grid--landing,
.homepage-journey-grid--landing {
  gap: 1.1rem;
}
.homepage-card--mode {
  gap: 0.35rem;
}
.homepage-journey-card {
  gap: 0.65rem;
}
.homepage-section--landing {
  gap: 1rem;
}
.legal-page-shell {
  padding-top: 20px;
}
.section--legal {
  padding-top: 0;
}
.legal-card {
  padding: clamp(1.35rem, 2.6vw, 2rem);
  border-radius: 28px;
}
.legal-card--simple {
  max-width: 760px;
  margin: 0 auto;
}
.legal-meta {
  margin: 10px 0 0;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--text-body);
}
.legal-intro {
  margin: 12px 0 0;
  max-width: 64ch;
}
.legal-stack {
  display: grid;
  gap: 1rem;
  margin-top: 1.4rem;
}
.legal-section {
  display: grid;
  gap: 0.55rem;
  padding: 1rem 1.05rem;
  border: 1px solid var(--line-subtle);
  border-radius: 20px;
  background: color-mix(in srgb, var(--bg-panel) 90%, white 10%);
}
.legal-section h2 {
  margin: 0;
  font-size: clamp(1rem, 1.4vw, 1.2rem);
}
.legal-section p {
  margin: 0;
  line-height: 1.65;
}
.auth-panel,
.auth-aside,
.student-auth-panel,
.student-auth-aside {
  min-height: 420px;
}
.auth-panel,
.auth-aside {
  padding: 24px;
}
.auth-panel__inner,
.auth-panel__inner--tabbed,
.student-auth-panel {
  width: min(100%, 34rem);
  max-width: 34rem;
}
.auth-panel--tabbed {
  align-content: start;
}
.auth-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
  margin-bottom: 0.85rem;
}
.auth-switch__tab {
  min-height: 42px;
}
.auth-tab-panel.is-hidden,
.auth-aside-panel.is-hidden {
  display: none;
}
.auth-aside-panel {
  display: grid;
  gap: 12px;
  align-content: start;
  min-height: 100%;
}
.auth-aside .auth-illustration {
  align-self: center;
  justify-self: center;
}
.auth-illustration,
.section-illustration,
.student-illustration-card img,
.student-auth-aside img,
.page-asset {
  object-fit: contain;
}
.auth-illustration,
.section-illustration,
.page-asset {
  display: block;
  width: min(100%, 100%);
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
  object-position: center;
  margin-inline: auto;
}
.auth-illustration {
  min-height: 200px;
  max-height: 280px;
  height: clamp(200px, 26vw, 280px);
}
.auth-split--tabbed {
  align-items: start;
}
.auth-split--tabbed .auth-panel,
.auth-split--tabbed .auth-aside {
  min-height: 0;
  height: auto;
}
.auth-split--tabbed .auth-panel__inner--tabbed {
  width: min(100%, 31rem);
  max-width: 31rem;
}
.auth-split--tabbed .auth-aside {
  align-content: start;
}
.auth-split--tabbed .auth-aside-panel {
  gap: 10px;
  min-height: 0;
}
.auth-split--tabbed .auth-illustration {
  min-height: 136px;
  height: clamp(136px, 14vw, 190px);
  max-height: 190px;
}
.auth-split--tabbed .section-rail {
  gap: 12px;
}
.auth-split--tabbed .inline-notice {
  margin-top: 2px;
}
.auth-aside-summary {
  margin: 0;
  max-width: 34ch;
  line-height: 1.56;
}
.auth-point {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-2);
  align-items: start;
  padding: 10px 12px;
  border-radius: 18px;
  background: color-mix(in srgb, var(--bg-panel) 82%, transparent);
  border: 1px solid var(--line-subtle);
}
.auth-point .status-pill {
  min-height: 22px;
  min-width: 22px;
  justify-content: center;
  padding: 0;
}
.auth-panel .button-row,
.student-auth-panel .button-row {
  gap: 12px;
  align-items: center;
  margin-top: 10px;
}
.auth-panel .button-row .btn.primary,
.student-auth-panel .button-row .btn.primary {
  min-width: 220px;
}
.metric-card,
.kpi-card {
  min-height: 0;
  padding: 14px;
}
.metric-card .label,
.kpi-card .label {
  font-size: 0.78rem;
  color: var(--text-body);
}
.metric-card .value,
.kpi-card .value,
.hero-stat strong,
.workspace-kpi strong {
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1.04;
  font-weight: 800;
  color: var(--text-strong);
}
.kpi-card--quiet {
  background: color-mix(in srgb, var(--bg-elevated) 86%, #fff 14%);
}
.kpi-card--featured {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-elevated) 88%, #fff 12%),
    color-mix(in srgb, var(--bg-panel) 94%, transparent)
  );
  box-shadow:
    var(--shadow-md),
    0 0 0 1px color-mix(in srgb, var(--brand-500) 12%, transparent);
}
.kpi-card--mission .value,
.kpi-card--featured .value {
  color: var(--brand-500);
}
.kpi-card--completion .value {
  color: #59d38a;
}
.recommendation-card {
  display: grid;
  gap: var(--space-3);
  min-height: 0;
  padding: 14px 16px;
}
.recommendation-card h3 {
  margin: 0;
  font-size: 1.12rem;
  line-height: 1.25;
}
.recommendation-card .inline-notice {
  margin-top: auto;
}
.recommendation-card--quiet {
  box-shadow: var(--shadow-sm);
}
.reward-card {
  display: grid;
  gap: var(--space-3);
}
.reward-card__header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: 10px;
}
.reward-card__icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, #dbc28d 30%, white 70%),
    color-mix(in srgb, var(--brand-100) 28%, white 72%)
  );
  font-size: 20px;
}
.runner-shell {
  display: grid;
  gap: var(--space-4);
}
.runner-bar,
.runner-status-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
}
.runner-status-bar--wide {
  position: sticky;
  top: 14px;
  z-index: 25;
}
.runner-status-bar__main,
.runner-question-panel--visual,
.runner-question-panel--compact-readability .runner-question-body--focus,
.runner-question-panel--choice .runner-answer-panel,
.visual-answer-shell__actions,
.runner-progress-head,
.runner-answer-stack,
.runner-shell .runner-keyboard-wrap {
  display: grid;
  gap: var(--space-3);
}
.runner-question-panel {
  overflow: hidden;
  padding: 0;
}
.runner-question-head,
.runner-answer-head,
.runner-shell .runner-action-bar {
  justify-content: space-between;
  flex-wrap: wrap;
}
.runner-question-head {
  padding: 28px 30px 20px;
  border-bottom: 1px solid var(--line-subtle);
}
.runner-question-head--simple {
  padding-bottom: 0;
  border-bottom: 0;
}
.runner-shell .runner-question-body {
  padding: 20px 30px 0;
}
.runner-question-body--focus {
  align-content: center;
  justify-items: center;
}
.runner-question-body-v2.runner-question-body--focus {
  align-content: start;
  justify-items: stretch;
}
.runner-shell .runner-prompt {
  justify-items: center;
  text-align: center;
}
.runner-prompt--raw {
  justify-items: start;
  width: 100%;
}
.runner-prompt__label,
.runner-question-meta {
  color: var(--brand-700);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.86rem;
}
.runner-prompt__intro,
.runner-prompt__context,
.runner-prompt__detail,
.runner-helper,
.visual-answer-shell__helper {
  color: var(--text-soft);
  font-size: 0.98rem;
  line-height: 1.45;
  max-width: 56ch;
}
.runner-shell .runner-prompt__main {
  font-size: clamp(1.5rem, 4vw, 3.5rem);
  line-height: 1.16;
  font-weight: 800;
  text-wrap: balance;
  max-width: 26ch;
}
.runner-shell
  .runner-prompt--short:not(.runner-prompt--variant-equation-only)
  .runner-prompt__main {
  max-width: 14ch;
  font-size: clamp(2.2rem, 4.6vw, 4.2rem);
}
.runner-shell .runner-prompt--wordy .runner-prompt__intro {
  font-size: clamp(1.25rem, 2vw, 2rem);
  font-weight: 500;
}
.runner-shell .runner-prompt--wordy .runner-prompt__main {
  font-size: clamp(2rem, 4vw, 4rem);
  max-width: 18ch;
  line-height: 1.08;
}
.runner-prompt--with-visual .runner-prompt__main,
.runner-prompt--chart .runner-prompt__main,
.runner-prompt--grid .runner-prompt__main,
.runner-prompt--number-line .runner-prompt__main,
.runner-prompt--probability .runner-prompt__main,
.runner-prompt--angle .runner-prompt__main,
.runner-shell .runner-prompt--fraction-model .runner-prompt__main {
  max-width: 28ch;
  font-size: clamp(1.35rem, 2.2vw, 2.05rem);
}
.runner-prompt--ratio .runner-prompt__main,
.runner-prompt--condition .runner-prompt__main,
.runner-prompt--sequence .runner-prompt__main {
  max-width: min(100%, 64rem);
  font-size: clamp(1.35rem, 1.55vw, 2rem);
}
.runner-prompt--equation .runner-prompt__main,
.runner-shell .runner-prompt--symbol .runner-prompt__main {
  max-width: min(100%, 64rem);
  font-size: clamp(2.25rem, 3vw, 3.5rem);
  line-height: 1.05;
}
.runner-shell .runner-prompt--fraction-expression .runner-prompt__main {
  max-width: none;
  white-space: nowrap;
  font-size: clamp(2rem, 3.8vw, 3.15rem);
  line-height: 1.05;
}
.runner-shell .runner-prompt--compact-flow .runner-prompt__main {
  max-width: 26ch;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
}
.runner-shell .runner-answer-panel {
  margin: 20px 22px 0;
  border-radius: 22px;
}
.runner-answer-head h2 {
  margin: 0;
  font-size: 1.15rem;
}
.runner-answer-panel input,
.runner-answer-panel select,
.runner-answer-panel textarea,
.runner-answer-field input,
.runner-answer-panel .option-chip {
  min-height: 58px;
  font-size: 1.08rem;
  border-radius: 16px;
}
.runner-answer-panel input,
.runner-answer-panel textarea,
.runner-answer-panel select {
  padding-left: 26px;
  font-size: 1.2rem;
}
.runner-answer-field > span,
.runner-answer-field .field-label {
  font-weight: 700;
}
.runner-shell .runner-action-bar {
  padding: 18px 22px 22px;
  margin-top: 8px;
  border-top: 1px solid var(--line-subtle);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-panel-2) 16%);
}
.runner-side-panel {
  position: sticky;
  top: calc(var(--header-height) + 14px);
  display: grid;
  gap: var(--space-3);
}
.runner-side-card,
.runner-visual-panel .visual-card {
  display: grid;
  gap: var(--space-3);
}
.progress-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-500) 10%, transparent);
  overflow: hidden;
}
.progress-bar--runner {
  height: 14px;
}
.progress-bar > span,
.progress-bar span {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand-700), var(--brand-500));
}
.progress-ring {
  width: 78px;
  height: 78px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at center, var(--bg-panel) 58%, transparent 59%),
    conic-gradient(
      var(--brand-700) var(--progress, 0%),
      color-mix(in srgb, var(--brand-500) 10%, transparent) 0
    );
  box-shadow: inset 0 0 0 1px var(--line-subtle);
}
.runner-shell .runner-keyboard {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
}
.runner-shell .runner-keyboard .btn {
  min-height: 56px;
  font-size: 1.08rem;
}
.runner-shell .runner-keyboard .btn[data-runner-key="enter"] {
  grid-column: 1 / -1;
  min-height: 58px;
  font-size: 1.2rem;
}
.frac {
  display: inline-grid;
  grid-template-rows: auto 2px auto;
  align-items: center;
  justify-items: center;
  margin: 0 0.08em;
  min-width: 1.2em;
  vertical-align: middle;
}
.frac__bar {
  display: block;
  width: 100%;
  background: currentColor;
  height: 2px;
}
.frac__top,
.frac__bottom {
  line-height: 1.05;
  font-size: 0.7em;
}
.runner-blank-slot {
  display: inline-flex;
  width: 1.2em;
  min-width: 1.2em;
  height: 0.9em;
  margin: 0 0.08em;
  vertical-align: -0.04em;
  border-bottom: 0.12em solid currentColor;
  border-radius: 0.12em;
}
.official-crop-wrap {
  width: min(100%, 920px);
  max-width: 100%;
  max-height: var(--runner-visual-max-h, none);
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--bg-panel);
  border: 1px solid var(--line-default);
  border-radius: 22px;
  padding: 14px;
  box-shadow: var(--shadow-sm);
}
.official-crop-image {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: calc(var(--runner-visual-max-h, 100dvh) - 28px);
  height: auto;
  border-radius: 14px;
}
.question-image-wrap {
  width: min(100%, 980px);
  max-width: 100%;
  max-height: var(--runner-visual-max-h, none);
  margin: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 10px;
  border-radius: 18px;
  border: 1px solid var(--line-subtle);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel) 84%, var(--bg-panel-2) 16%)
  );
}
.runner-question-card-v2 .question-image-wrap,
.runner-question-card-v2 .official-crop-wrap,
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt--raw
  .question-image-wrap,
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt--raw
  .official-crop-wrap {
  align-self: start;
}
.question-image,
.official-crop-image {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.question-image {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: calc(var(--runner-visual-max-h, 100dvh) - 20px);
  height: auto;
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}
.visual-svg,
.visual-svg--chart,
.visual-svg--grid,
.visual-svg--number-line,
.visual-svg--angle,
.visual-svg--fraction-model,
.visual-svg--probability-scale {
  width: 100%;
  height: auto;
  display: block;
  margin-inline: auto;
}
.visual-svg--grid {
  max-width: 860px;
}
.visual-svg--number-line,
.visual-svg--fraction-model,
.visual-svg--probability-scale {
  max-width: 760px;
}
.visual-svg--chart {
  max-width: 820px;
}
.visual-svg--angle {
  max-width: 520px;
}
.visual-axis,
.visual-number-line-track,
.visual-number-line-tick,
.visual-axis--probability,
.visual-axis--x-strong,
.visual-axis--y-strong {
  stroke: color-mix(in srgb, var(--text-strong) 88%, white 12%);
}
.visual-axis {
  stroke-width: 3;
}
.visual-grid-line {
  stroke: color-mix(in srgb, var(--line-default) 78%, white 22%);
  stroke-width: 1.6;
}
.visual-grid-line--assist {
  stroke: color-mix(in srgb, var(--line-default) 72%, white 28%);
  stroke-width: 1.1;
  opacity: 0.58;
  stroke-dasharray: 4 7;
}
.visual-grid-line--baseline {
  opacity: 0.72;
}
.visual-number-line-track,
.visual-number-line-tick {
  shape-rendering: geometricPrecision;
}
.visual-number-line-track {
  stroke-width: 3.4;
  stroke-linecap: round;
}
.visual-number-line-tick {
  stroke-width: 2.4;
  stroke-linecap: round;
}
.visual-number-line-arrow {
  fill: color-mix(in srgb, var(--text-strong) 88%, white 12%);
}
.visual-axis-label,
.visual-value-label,
.visual-axis-caption,
.visual-axis-label--probability,
.visual-axis-label--x,
.visual-axis-letter {
  fill: var(--text-strong);
  font-size: 13px;
  font-weight: 800;
}
.visual-axis-label--probability,
.visual-axis-label--x,
.visual-axis-letter {
  font-size: 1rem;
  font-weight: 900;
}
.visual-axis-caption {
  letter-spacing: 0.01em;
}
.visual-axis-arrow {
  fill: color-mix(in srgb, var(--text-strong) 90%, white 10%);
}
.visual-guide-line {
  stroke: color-mix(in srgb, var(--student-500) 66%, white 34%);
  stroke-width: 2.5;
  stroke-dasharray: 8 7;
}
.visual-guide-line--symmetry {
  stroke-width: 3.2;
  stroke-dasharray: 10 6;
}
.visual-axis-caption--symmetry {
  fill: color-mix(in srgb, var(--student-700) 86%, white 14%);
  font-weight: 900;
}
.visual-point-label {
  fill: var(--text-strong);
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0.01em;
  paint-order: stroke;
  stroke: #ffffffe0;
  stroke-width: 4px;
  stroke-linejoin: round;
}
.visual-point-label--reference {
  fill: color-mix(in srgb, var(--student-700) 78%, black 22%);
}
.visual-point-label--target {
  fill: color-mix(in srgb, var(--warning-700) 80%, black 20%);
}
.visual-bar {
  fill: color-mix(in srgb, var(--student-500) 76%, white 24%);
}
.visual-line {
  stroke: color-mix(in srgb, var(--student-500) 74%, white 26%);
  stroke-width: 4;
}
.visual-point-fill {
  fill: color-mix(in srgb, var(--student-500) 82%, black 18%);
}
.visual-point-given {
  fill: color-mix(in srgb, var(--success-700) 78%, white 22%);
}
.visual-point-reference {
  fill: color-mix(in srgb, var(--student-700) 82%, white 18%);
}
.visual-point-target {
  fill: color-mix(in srgb, var(--warning-700) 74%, white 26%);
}
.visual-probability-pointer {
  stroke: color-mix(in srgb, var(--student-700) 84%, white 16%);
  stroke-width: 3;
}
.visual-probability-point-ring {
  fill: #fff;
  stroke: color-mix(in srgb, var(--student-500) 82%, white 18%);
  stroke-width: 3;
}
.visual-angle-arc,
.visual-angle-guide-ring,
.visual-angle-triangle,
.visual-angle-square,
.visual-angle-arc--around-point {
  fill: none;
  stroke: color-mix(in srgb, var(--line-default) 74%, var(--text-strong) 26%);
  stroke-width: 2.2;
}
.visual-angle-arc {
  stroke: color-mix(in srgb, var(--student-700) 62%, var(--text-strong) 38%);
  stroke-width: 3.2;
  stroke-linecap: butt;
}
.visual-angle-arc--secondary {
  stroke-width: 2.6;
}
.visual-angle-arc--around-point {
  stroke-dasharray: none;
  stroke-width: 2.8;
}
.visual-angle-label {
  fill: var(--text-strong);
  font-size: 16px;
  font-weight: 900;
}
.visual-polygon {
  vector-effect: non-scaling-stroke;
}
.visual-polygon--source {
  fill: color-mix(in srgb, var(--student-500) 18%, white 82%);
  stroke: color-mix(in srgb, var(--text-strong) 68%, white 32%);
  stroke-width: 3.2;
}
.visual-polygon--answer {
  fill: color-mix(in srgb, var(--warning-500) 16%, white 84%);
  stroke: color-mix(in srgb, var(--warning-700) 70%, var(--text-strong) 30%);
  stroke-width: 3.2;
}
.visual-polygon--selected {
  stroke: color-mix(in srgb, var(--student-700) 78%, white 22%);
  stroke-width: 3.4;
}
.visual-polygon--selected.is-complete {
  fill: color-mix(in srgb, var(--student-500) 16%, white 84%);
}
.visual-hit,
.visual-hit--tick,
.visual-cell-hit,
.visual-shape,
.drag-label-slot,
.visual-hit--number-line {
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    fill 0.16s ease,
    stroke 0.16s ease,
    background 0.16s ease;
}
.visual-hit {
  fill: #ffffff03;
  stroke: transparent;
  cursor: pointer;
}
.visual-hit:hover,
.visual-hit.is-selected,
.visual-hit--tick.is-selected,
.visual-hit--number-line:hover,
.visual-hit--number-line:focus-visible,
.visual-hit--number-line.is-selected {
  fill: color-mix(in srgb, var(--student-200) 60%, white 40%);
  stroke: color-mix(in srgb, var(--student-500) 72%, white 28%);
  stroke-width: 2;
}
.visual-cell-given {
  fill: color-mix(in srgb, var(--student-500) 68%, white 32%);
  opacity: 0.58;
}
.visual-cell-hit {
  fill: #ffffff03;
  stroke: color-mix(in srgb, var(--line-default) 68%, white 32%);
  stroke-width: 1;
  cursor: crosshair;
}
.visual-cell-hit.is-selected {
  fill: color-mix(in srgb, var(--student-300) 62%, white 38%);
  stroke: color-mix(in srgb, var(--student-500) 78%, white 22%);
  stroke-width: 2;
}
.visual-shape {
  fill: color-mix(in srgb, var(--student-100) 52%, white 48%);
  stroke: color-mix(in srgb, var(--text-strong) 78%, white 22%);
  stroke-width: 2.2;
}
.visual-shape.is-selected {
  fill: color-mix(in srgb, var(--student-300) 65%, white 35%);
  stroke: color-mix(in srgb, var(--student-500) 82%, white 18%);
}
.visual-clock-face {
  fill: color-mix(in srgb, white 90%, var(--student-100) 10%);
  stroke: color-mix(in srgb, var(--text-strong) 80%, white 20%);
  stroke-width: 3;
}
.visual-clock-minute {
  stroke: color-mix(in srgb, var(--student-500) 75%, white 25%);
  stroke-width: 4;
  stroke-linecap: round;
}
.visual-clock-hour {
  stroke: var(--text-strong);
  stroke-width: 5.5;
  stroke-linecap: round;
}
.runner-shell-v2 .visual-answer-shell {
  gap: 10px;
}
.runner-shell-v2 .visual-answer-shell--interactive {
  padding-top: 2px;
}
.runner-shell-v2 .visual-answer-shell__support {
  display: grid;
  gap: 10px;
}
.runner-shell-v2 .visual-answer-shell__helper {
  max-width: none;
}
.runner-shell-v2 .visual-answer-shell__actions {
  grid-template-columns: 1fr;
  width: min(100%, 420px);
}
.runner-shell-v2 .visual-answer-shell__actions .btn {
  min-height: 44px;
}
.visual-answer-shell__summary {
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
  align-items: center;
  min-height: 42px;
  padding: 10px 12px;
  border-radius: var(--radius-3);
  border: 1px solid var(--line-default);
  color: var(--text-strong);
}
.visual-answer-pair {
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--student-100) 60%, white 40%);
  border: 1px solid color-mix(in srgb, var(--student-200) 60%, white 40%);
}
.fraction-model__cell {
  min-height: 34px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, white 30%);
  background: color-mix(in srgb, white 80%, var(--bg-canvas-soft) 20%);
  box-shadow: inset 0 1px #ffffffbf;
}
.fraction-model__cell.is-filled {
  background: color-mix(in srgb, var(--student-400) 70%, white 30%);
  border-color: color-mix(in srgb, var(--student-500) 74%, white 26%);
  box-shadow:
    inset 0 0 0 1px #ffffff3d,
    0 2px 6px #5c6fdd29;
}
.drag-label-bank {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}
.drag-label-chip {
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, white 26%);
  border-radius: var(--radius-pill);
  padding: 10px 14px;
  background: var(--bg-panel);
  color: var(--text-strong);
}
.drag-label-chip.is-assigned {
  opacity: 0.55;
}
.drag-label-chip.is-active {
  border-color: color-mix(in srgb, var(--student-500) 74%, white 26%);
  box-shadow: 0 0 0 3px #5d8ef71f;
}
.drag-label-slot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  padding: 12px 14px;
  border-radius: var(--radius-3);
  border: 1px dashed color-mix(in srgb, var(--student-300) 72%, white 28%);
  background: color-mix(in srgb, var(--student-100) 48%, white 52%);
}
.drag-label-slot strong {
  color: var(--text-strong);
}
.runner-shell .runner-question-panel--choice .options-grid,
.runner-shell .runner-question-panel--shape-choice .options-grid,
.runner-shell .options-grid[data-option-grid] {
  gap: 16px;
}
.runner-shell .runner-question-panel--choice .option-chip--tile,
.runner-shell .runner-question-panel--choice .option-chip--single,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile,
.runner-shell .runner-question-panel--shape-choice .option-chip--single {
  min-height: 80px;
  border: 2px solid var(--line-default);
  border-radius: 16px;
  background: var(--bg-panel);
  box-shadow: var(--surface-shadow-ui);
  transition:
    border-color 0.15s ease,
    transform 0.08s ease,
    background-color 0.15s ease;
}
.runner-shell .runner-question-panel--choice .option-chip--tile:hover,
.runner-shell .runner-question-panel--choice .option-chip--single:hover,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile:hover,
.runner-shell .runner-question-panel--shape-choice .option-chip--single:hover {
  border-color: var(--brand-700);
}
.runner-shell .runner-question-panel--choice .option-chip--tile:active,
.runner-shell .runner-question-panel--choice .option-chip--single:active,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile:active,
.runner-shell .runner-question-panel--shape-choice .option-chip--single:active {
  transform: scale(0.98);
}
.runner-shell .runner-question-panel--choice .option-chip--tile > span,
.runner-shell .runner-question-panel--choice .option-chip--single > span,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile > span,
.runner-shell .runner-question-panel--shape-choice .option-chip--single > span {
  font-size: clamp(1.08rem, 1.8vw, 1.5rem);
  line-height: 1.2;
  padding: 14px 16px;
}
.runner-shell
  .runner-question-panel--choice
  .options-grid--wordy-choice
  .option-chip--tile
  > span,
.runner-shell
  .runner-question-panel--choice
  .options-grid--wordy-choice
  .option-chip--single
  > span,
.runner-shell .runner-question-panel--choice .option-chip--wordy > span {
  align-items: flex-start;
  padding-block: 16px;
}
.runner-shell .runner-question-panel--choice .runner-answer-panel,
.runner-shell .runner-question-panel--shape-choice .runner-answer-panel {
  padding-top: 12px;
}
.runner-shell .runner-question-panel--choice .options-grid,
.runner-shell .runner-question-panel--shape-choice .options-grid {
  grid-auto-rows: minmax(64px, auto);
}
.runner-shell .runner-question-panel--choice .option-chip--tile,
.runner-shell .runner-question-panel--choice .option-chip--single,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile,
.runner-shell .runner-question-panel--shape-choice .option-chip--single {
  min-height: 64px;
  border-radius: 16px;
}
.runner-shell,
.runner-shell .runner-layout--single,
.runner-shell .runner-question-panel {
  min-height: 100%;
}
.runner-shell .runner-main,
.runner-shell .runner-question-panel {
  display: flex;
  flex-direction: column;
}
.student-page-content--runner .runner-layout--single {
  align-content: stretch;
}
.student-page-content--runner .runner-question-panel {
  min-height: calc(100dvh - 176px);
}
.runner-shell .runner-question-body {
  flex: 0 0 auto;
}
.runner-shell .runner-answer-panel {
  margin: auto 22px 0;
  padding-top: 12px;
}
.runner-shell .runner-answer-stack,
.runner-shell .runner-keyboard-wrap,
.runner-shell .runner-action-bar .button-row {
  width: min(100%, 1040px);
  margin-inline: auto;
}
.runner-shell .runner-question-panel--choice .runner-answer-stack,
.runner-shell .runner-question-panel--shape-choice .runner-answer-stack,
.runner-shell .runner-question-panel--choice .runner-action-bar .button-row,
.runner-shell
  .runner-question-panel--shape-choice
  .runner-action-bar
  .button-row {
  width: min(100%, 860px);
}
.runner-shell .runner-keyboard-wrap {
  padding-top: 10px;
}
.runner-shell .runner-keyboard {
  gap: 14px;
}
.runner-shell .runner-keyboard .btn {
  min-height: 64px;
  font-size: 1.18rem;
  font-weight: 800;
}
.runner-shell .runner-keyboard .btn[data-runner-key="enter"] {
  min-height: 68px;
  font-size: 1.26rem;
}
.runner-shell .runner-action-bar {
  margin-top: 14px;
  padding-top: 16px;
}
.runner-shell .runner-action-bar .button-row {
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}
.runner-shell .runner-question-panel--choice .options-grid,
.runner-shell .runner-question-panel--shape-choice .options-grid {
  width: 100%;
  justify-content: center;
  gap: 14px;
}
.runner-shell .runner-question-panel--choice .options-grid[data-option-grid],
.runner-shell
  .runner-question-panel--shape-choice
  .options-grid[data-option-grid] {
  grid-template-columns: repeat(
    var(--option-grid-cols, 3),
    minmax(var(--option-tile-width, 186px), var(--option-tile-width, 186px))
  );
  grid-auto-rows: minmax(var(--option-tile-height, 118px), auto);
}
.runner-shell .runner-question-panel--choice .option-chip--tile,
.runner-shell .runner-question-panel--choice .option-chip--single,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile,
.runner-shell .runner-question-panel--shape-choice .option-chip--single {
  min-height: var(--option-tile-height, 118px);
  border-radius: 20px;
}
.runner-shell .runner-question-panel--choice .option-chip--tile > span,
.runner-shell .runner-question-panel--choice .option-chip--single > span,
.runner-shell .runner-question-panel--shape-choice .option-chip--tile > span,
.runner-shell .runner-question-panel--shape-choice .option-chip--single > span {
  display: grid;
  place-items: center;
  min-height: 100%;
  padding: 16px 14px;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  line-height: 1.1;
  font-weight: 800;
}
.runner-shell
  .runner-question-panel--choice
  .options-grid--wordy-choice
  .option-chip--tile
  > span,
.runner-shell
  .runner-question-panel--choice
  .options-grid--wordy-choice
  .option-chip--single
  > span,
.runner-shell .runner-question-panel--choice .option-chip--wordy > span {
  font-size: clamp(1rem, 1.5vw, 1.22rem);
  line-height: 1.3;
}
.runner-shell .runner-prompt {
  gap: 14px;
}
.runner-shell .runner-prompt__intro {
  font-size: clamp(1.18rem, 1.8vw, 1.65rem);
  line-height: 1.28;
  font-weight: 500;
  color: var(--text-strong);
}
.runner-shell .runner-prompt__context {
  font-size: clamp(1.24rem, 1.9vw, 1.75rem);
  line-height: 1.34;
  font-weight: 500;
}
.runner-shell .runner-prompt__main {
  max-width: 22ch;
  margin-inline: auto;
  font-size: clamp(2.45rem, 4.6vw, 4.6rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
}
.runner-question-card-v2 .runner-prompt__intro,
.runner-question-card-v2 .runner-prompt__main,
.runner-question-card-v2 .runner-prompt__main *,
.runner-question-card-v2 .runner-prompt--raw,
.runner-question-card-v2 .runner-prompt--raw p,
.runner-question-card-v2 .runner-prompt--raw span,
.runner-question-card-v2 .runner-prompt--raw strong,
.runner-question-card-v2 .runner-prompt--raw li,
.runner-question-card-v2 .runner-prompt--raw figcaption {
  color: var(--text-strong);
}
.runner-question-card-v2 .runner-prompt__context,
.runner-question-card-v2 .runner-prompt__detail,
.runner-question-card-v2 .runner-prompt--raw small,
.runner-question-card-v2 .runner-prompt--raw .muted {
  color: var(--text-body);
}
.runner-shell .runner-prompt--dense .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.35rem, 1.55vw, 2rem);
}
.runner-prompt--with-visual .runner-prompt__main,
.runner-prompt--chart .runner-prompt__main,
.runner-prompt--grid .runner-prompt__main,
.runner-prompt--number-line .runner-prompt__main,
.runner-prompt--probability .runner-prompt__main,
.runner-prompt--angle .runner-prompt__main,
.runner-shell .runner-prompt--fraction-model .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.35rem, 1.55vw, 2rem);
}
.runner-shell .runner-visual-panel,
.runner-shell .runner-visual-panel .visual-card {
  width: min(100%, 1140px);
  margin-inline: auto;
}
.visual-card--chart .visual-svg,
.visual-svg--chart,
.visual-card--line-graph .visual-svg--chart {
  width: min(100%, 1020px);
  max-width: 1020px;
}
.visual-card--number-line .visual-svg--number-line,
.visual-card--probability-scale .visual-svg--probability-scale,
.visual-card--fraction-model .visual-svg--fraction-model {
  width: min(100%, 980px);
  max-width: 980px;
}
.visual-card--grid .visual-svg--grid {
  width: min(100%, 920px);
  max-width: 920px;
}
.visual-card--angle .visual-svg--angle {
  width: min(100%, 760px);
  max-width: 760px;
}
.visual-card--clock .visual-svg {
  width: min(100%, 560px);
  max-width: 560px;
}
.visual-axis,
.visual-number-line-track,
.visual-number-line-tick,
.visual-axis--probability,
.visual-axis--x-strong,
.visual-axis--y-strong {
  stroke-width: 3.6;
}
.visual-grid-line {
  stroke-width: 2.1;
}
.visual-grid-line--minor {
  stroke-width: 1.2;
  opacity: 0.42;
  stroke-dasharray: 4 6;
}
.visual-grid-line--assist {
  stroke-width: 1.15;
  opacity: 0.56;
  stroke-dasharray: 3 6;
}
.visual-number-line-track {
  stroke-width: 4.2;
}
.visual-number-line-tick {
  stroke-width: 3.2;
}
.visual-axis-label,
.visual-value-label,
.visual-axis-caption,
.visual-axis-label--probability,
.visual-axis-label--x,
.visual-axis-label--compact {
  font-size: 15px;
  font-weight: 800;
}
.visual-axis-label--probability,
.visual-axis-label--x {
  font-size: 1.08rem;
}
.visual-axis-caption {
  font-size: 14px;
}
.visual-line {
  stroke-width: 4.8;
}
body.runner-fullscreen-mode .runner-shell {
  display: grid !important;
  gap: 18px !important;
  padding: 18px 20px 22px !important;
  align-content: start !important;
  min-height: 100dvh !important;
}
body.runner-fullscreen-mode .runner-layout--single,
body.runner-fullscreen-mode .runner-question-panel,
body.runner-fullscreen-mode .runner-status-bar {
  width: min(100%, 1480px);
  max-width: 1480px;
  margin-inline: auto;
}
body.runner-fullscreen-mode .runner-question-panel {
  min-height: calc(100dvh - 138px);
}
body.runner-fullscreen-mode .runner-question-body--focus {
  padding-top: 12px;
}
body.runner-fullscreen-mode .runner-shell .runner-prompt__main {
  font-size: clamp(3rem, 6vw, 6rem);
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
}
body.runner-fullscreen-mode .runner-fullscreen-close {
  display: grid !important;
}
.runner-focus-mode .student-topbar,
.runner-focus-mode .student-side-nav {
  display: none;
}
.runner-focus-mode .student-shell__body {
  grid-template-columns: 1fr;
  width: min(980px, calc(100vw - 20px));
}
.runner-fullscreen-close {
  display: none;
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 1px solid var(--line-default);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  color: var(--text-strong);
  box-shadow: var(--surface-shadow-ui);
}
body.runner-fullscreen-mode .student-topbar,
body.runner-fullscreen-mode .student-side-nav,
body.runner-fullscreen-mode .mp-topbar,
body.runner-fullscreen-mode .public-header,
body.runner-fullscreen-mode .app-topbar {
  display: none !important;
}
body.runner-fullscreen-mode .student-shell,
body.runner-fullscreen-mode .student-shell__body,
body.runner-fullscreen-mode .student-page-content,
body.runner-fullscreen-mode .student-page-content--runner,
body.runner-fullscreen-mode .runner-shell {
  width: 100vw;
  max-width: none;
  margin: 0;
}
body.runner-fullscreen-mode .runner-shell {
  position: fixed;
  inset: 0;
  z-index: 999;
  overflow: hidden;
  padding: 24px;
  background: linear-gradient(180deg, var(--bg-page) 0%, var(--bg-soft) 100%);
}
body.runner-fullscreen-mode .runner-layout--single,
body.runner-fullscreen-mode .runner-status-bar,
body.runner-fullscreen-mode .runner-question-panel {
  width: calc(100vw - 32px);
  max-width: calc(100vw - 32px);
  margin-inline: auto;
}
body.runner-fullscreen-mode .runner-footer {
  position: sticky;
  bottom: 0;
  background: inherit;
}
@keyframes mpRunnerCountdownStep {
  0%,
  99.5% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes mpRunnerCountdownFinalStep {
  0%,
  100% {
    opacity: 1;
  }
}
html[data-mp-countdown-active="true"],
html[data-mp-countdown-active="true"] body {
  overflow: hidden;
}
.runner-countdown-overlay {
  --mp-countdown-curtain-bg:
    radial-gradient(
      circle at 50% 18%,
      rgba(88, 166, 255, 0.18),
      transparent 32%
    ),
    radial-gradient(
      circle at 50% 76%,
      rgba(47, 210, 122, 0.1),
      transparent 30%
    ),
    linear-gradient(180deg, #f8fbff 0%, #eaf2ff 48%, #fff8ee 100%);
  --mp-countdown-art:
    linear-gradient(
      115deg,
      transparent 0 43%,
      rgba(42, 91, 164, 0.16) 43.2% 43.55%,
      transparent 43.75% 100%
    ),
    linear-gradient(
      245deg,
      transparent 0 48%,
      rgba(42, 91, 164, 0.13) 48.2% 48.55%,
      transparent 48.75% 100%
    ),
    radial-gradient(
      circle at 50% 72%,
      rgba(47, 210, 122, 0.12),
      transparent 28%
    );
  --mp-countdown-panel-bg: rgba(255, 255, 255, 0.97);
  --mp-countdown-panel-color: #0b1f46;
  --mp-countdown-panel-shadow: 0 28px 74px rgba(48, 79, 128, 0.18);
  --mp-countdown-step: #102b5d;
  --mp-countdown-muted: rgba(11, 31, 70, 0.68);
  --mp-countdown-light-base: rgba(16, 43, 93, 0.12);
  --mp-countdown-red-base: rgba(240, 75, 75, 0.16);
  --mp-countdown-green-base: rgba(47, 210, 122, 0.14);
  --mp-countdown-red: #ef4444;
  --mp-countdown-green: #2fd27a;
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--mp-countdown-curtain-bg);
  opacity: 1;
  isolation: isolate;
  contain: layout paint style;
}
html[data-appearance="dark"] .runner-countdown-overlay,
html[data-theme="dark"] .runner-countdown-overlay,
body.theme-dark .runner-countdown-overlay {
  --mp-countdown-curtain-bg:
    radial-gradient(
      circle at 50% 18%,
      rgba(88, 166, 255, 0.24),
      transparent 32%
    ),
    radial-gradient(
      circle at 50% 76%,
      rgba(47, 210, 122, 0.14),
      transparent 30%
    ),
    linear-gradient(180deg, #071631 0%, #102b5d 48%, #07101f 100%);
  --mp-countdown-art:
    linear-gradient(
      115deg,
      transparent 0 43%,
      rgba(255, 255, 255, 0.12) 43.2% 43.55%,
      transparent 43.75% 100%
    ),
    linear-gradient(
      245deg,
      transparent 0 48%,
      rgba(255, 255, 255, 0.1) 48.2% 48.55%,
      transparent 48.75% 100%
    ),
    radial-gradient(
      circle at 50% 72%,
      rgba(47, 210, 122, 0.14),
      transparent 28%
    );
  --mp-countdown-panel-bg: rgba(12, 23, 44, 0.96);
  --mp-countdown-panel-color: #f8fbff;
  --mp-countdown-panel-shadow: 0 32px 90px rgba(0, 0, 0, 0.38);
  --mp-countdown-step: #f8fbff;
  --mp-countdown-muted: rgba(248, 251, 255, 0.72);
  --mp-countdown-light-base: rgba(248, 251, 255, 0.14);
  --mp-countdown-red-base: rgba(255, 89, 89, 0.18);
  --mp-countdown-green-base: rgba(47, 232, 126, 0.16);
  --mp-countdown-red: #ff4d4d;
  --mp-countdown-green: #2ee87e;
}
.runner-countdown-overlay,
.runner-countdown-overlay * {
  box-sizing: border-box;
}
.runner-countdown-overlay__backdrop-art {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: var(--mp-countdown-art);
  opacity: 0.92;
}
.runner-countdown-overlay__inner {
  inline-size: min(92vw, 560px);
  min-block-size: clamp(300px, 46vw, 420px);
  display: grid;
  place-items: center;
  gap: clamp(0.75rem, 2vw, 1.25rem);
  border-radius: 32px;
  padding: clamp(1.5rem, 5vw, 3rem);
  background: var(--mp-countdown-panel-bg);
  color: var(--mp-countdown-panel-color);
  box-shadow: var(--mp-countdown-panel-shadow);
  border: 1px solid rgba(255, 255, 255, 0.62);
  contain: layout paint style;
  text-align: center;
}
.runner-countdown-overlay__eyebrow {
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  opacity: 0.72;
}
.runner-countdown-overlay__label {
  font-size: 1.45rem;
  font-weight: 900;
  text-align: center;
  line-height: 1.12;
}
.runner-countdown-overlay__value-stack {
  position: relative;
  display: grid;
  place-items: center;
  inline-size: min(100%, 34rem);
  min-inline-size: min(18rem, 100%);
  block-size: clamp(7rem, 20vw, 11rem);
  contain: layout paint style;
  isolation: isolate;
}
.runner-countdown-overlay__step {
  grid-area: 1/1;
  inline-size: 100%;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  font-variant-numeric: tabular-nums;
  font-size: 8rem;
  line-height: 0.92;
  font-weight: 950;
  letter-spacing: 0;
  color: var(--mp-countdown-step);
  will-change: opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.runner-countdown-overlay__step[data-runner-countdown-step="ready"],
.runner-countdown-overlay__step[data-runner-countdown-step="start"] {
  font-size: 4.5rem;
  letter-spacing: 0;
}
.runner-countdown-overlay__lights {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(22px, 38px));
  grid-template-rows: repeat(2, minmax(22px, 38px));
  gap: clamp(0.42rem, 1.4vw, 0.7rem) clamp(0.5rem, 1.8vw, 0.85rem);
  place-items: center;
}
.runner-countdown-overlay__lights span {
  inline-size: clamp(22px, 6vw, 38px);
  block-size: clamp(22px, 6vw, 38px);
  border-radius: 999px;
}
.runner-countdown-overlay__lights span[data-light-index="1"] {
  grid-column: 1;
}
.runner-countdown-overlay__lights span[data-light-index="2"] {
  grid-column: 2;
}
.runner-countdown-overlay__lights span[data-light-index="3"] {
  grid-column: 3;
}
.runner-countdown-overlay__light-base[data-light-row="red"],
.runner-countdown-overlay__light-active--red {
  grid-row: 1;
}
.runner-countdown-overlay__light-base[data-light-row="green"],
.runner-countdown-overlay__light-active--green {
  grid-row: 2;
}
.runner-countdown-overlay__light-base {
  background: var(--mp-countdown-light-base);
  box-shadow: inset 0 0 0 1px rgba(16, 43, 93, 0.14);
}
.runner-countdown-overlay__light-base--red {
  background: var(--mp-countdown-red-base);
}
.runner-countdown-overlay__light-base--green {
  background: var(--mp-countdown-green-base);
}
.runner-countdown-overlay__light-active {
  opacity: 0;
  will-change: opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.runner-countdown-overlay__light-active--red {
  background: var(--mp-countdown-red);
  box-shadow: 0 0 22px rgba(239, 68, 68, 0.45);
}
.runner-countdown-overlay__light-active--green {
  background: var(--mp-countdown-green);
  box-shadow: 0 0 22px rgba(47, 210, 122, 0.45);
}
.runner-countdown-overlay__meta {
  font-size: 1.05rem;
  font-weight: 700;
  text-align: center;
  color: var(--mp-countdown-muted);
  line-height: 1.35;
}
.runner-countdown-overlay__sr,
.runner-countdown-overlay__live {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
  .runner-countdown-overlay__step,
  .runner-countdown-overlay__light-active {
    transition: none;
    animation: none;
  }
}
.public-nav-right,
.utility-strip__links {
  flex-wrap: wrap;
}
.public-footer-brand {
  gap: var(--space-3);
}
.public-header__nav {
  justify-content: flex-start;
}
.public-nav-right .btn.ghost,
.public-header .nav-pill {
  background: var(--bg-interactive);
  color: var(--text-strong);
  border-color: var(--line-default);
  box-shadow: none;
}
.public-nav-right .btn.ghost:hover,
.public-header .nav-pill:hover {
  background: var(--bg-hover);
}
.app-topbar .brand-copy strong,
.app-topbar__scope strong {
  color: var(--text-strong);
}
.app-topbar .brand-copy span,
.app-topbar .eyebrow,
.app-topbar .muted,
.app-topbar .small {
  color: var(--text-body);
}
.app-topbar .btn.secondary,
.app-topbar .btn.ghost {
  background: var(--bg-interactive);
  color: var(--text-strong);
  border-color: var(--line-default);
  box-shadow: var(--shadow-sm);
}
.app-topbar__scope {
  display: grid;
  justify-items: start;
  gap: 2px;
  min-width: 220px;
}
.app-topbar__actions {
  justify-content: flex-end;
}
.app-page-bar {
  justify-content: space-between;
  min-height: 40px;
  padding: 2px 2px 0;
  flex-wrap: wrap;
}
.app-breadcrumbs {
  flex-wrap: wrap;
  min-width: 0;
}
.app-breadcrumbs__item.is-current {
  color: var(--text-strong);
  font-weight: 700;
}
.app-page-bar__meta {
  flex-wrap: wrap;
  justify-content: flex-end;
}
.app-page-bar__meta .mini-badge {
  min-height: 30px;
  padding: 4px 10px;
  box-shadow: none;
}
.student-topbar .nav-pill {
  min-height: 38px;
  padding: 8px 14px;
  font-size: 0.94rem;
  white-space: nowrap;
}
.student-topbar .nav-pill.is-active {
  background: linear-gradient(135deg, var(--student-500), var(--student-700));
  color: #fff;
  box-shadow: 0 14px 24px #5d8ef733;
}
.student-primary-nav {
  flex-wrap: nowrap;
  justify-content: flex-start;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: none;
}
.student-primary-nav::-webkit-scrollbar {
  display: none;
}
.student-topbar__actions {
  flex-wrap: nowrap;
}
.student-topbar__actions .btn {
  min-height: 36px;
  padding-inline: 12px;
  white-space: nowrap;
}
.student-side-nav__title {
  font-size: 0.78rem;
}
.student-side-nav__link.is-active,
.student-side-nav__link:hover {
  background: var(--bg-selected);
  color: var(--text-strong);
}
.student-card--compact {
  min-height: 0;
  padding: 16px 18px;
}
.student-card--compact h3 {
  font-size: clamp(1.28rem, 2vw, 1.5rem);
  line-height: 1.22;
}
.student-guided-practice .data-item {
  grid-template-columns: minmax(0, 1fr) 190px;
  align-items: center;
}
.student-guided-practice .data-item .btn {
  width: 100%;
}
.student-live-card .section-header,
.student-live-card > div {
  max-width: 46rem;
}
.student-more-options {
  margin-top: 12px;
  border-top: 1px solid var(--line-subtle);
  padding-top: 14px;
}
.student-more-options > summary {
  list-style: none;
  cursor: pointer;
}
.student-card .sats-licence-disclosure {
  border: 1px solid var(--line-default);
  border-radius: var(--radius-3);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
}
.student-card .sats-licence-disclosure summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 16px;
  font-weight: 780;
  color: inherit;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.student-card .sats-licence-disclosure summary::-webkit-details-marker,
.student-card .sats-licence-disclosure summary::marker {
  display: none;
  content: "";
}
.student-card .sats-licence-disclosure summary:after {
  content: "v";
  opacity: 0.72;
  transition: transform 0.18s ease;
}
.student-card .sats-licence-disclosure[open] summary:after {
  transform: rotate(180deg);
}
.student-card .sats-licence-disclosure summary:after {
  content: "⌄";
}
.student-card .sats-licence-disclosure__body {
  padding: 0 16px 16px;
  display: grid;
  gap: 10px;
}
.signin-menu,
.mp-language-menu,
.mp-profile-menu {
  position: relative;
}
.signin-menu summary,
.mp-language-menu summary,
.mp-profile-trigger {
  list-style: none;
  cursor: pointer;
}
.signin-menu__panel,
.mp-language-menu__panel,
.mp-profile-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  min-width: 220px;
  padding: 10px;
  border-radius: 16px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-elevated) 96%, transparent);
  box-shadow: var(--shadow-md);
  display: grid;
  gap: 6px;
  z-index: 80;
}
.mp-language-menu__panel {
  min-width: 152px;
  padding: 8px;
  gap: 4px;
}
.signin-menu:not([open]) .signin-menu__panel,
.mp-language-menu:not([open]) .mp-language-menu__panel,
.mp-profile-menu:not([open]) .mp-profile-menu__panel {
  display: none;
}
.signin-menu__panel a,
.mp-language-menu__item,
.mp-profile-menu__item {
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--text-strong);
  font-weight: 700;
  background: transparent;
  border: 0;
  text-align: left;
  width: 100%;
}
.signin-menu__panel a:hover,
.mp-language-menu__item:hover,
.mp-language-menu__item.is-active,
.mp-profile-menu__item:hover {
  background: var(--bg-hover);
}
.mp-profile-trigger__avatar {
  width: 46px;
  height: 46px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--text-strong);
  color: var(--bg-page);
  font-weight: 800;
  font-size: 0.98rem;
}
.modal-layer {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: #10223547;
  backdrop-filter: blur(4px);
  z-index: 90;
}
.modal-card {
  width: min(740px, 100%);
  max-height: min(90vh, 860px);
  overflow: auto;
}
.portal-adult .modal-card:has(.planner-detail-modal) {
  width: min(920px, 100%);
}
.toast-layer {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 100;
  display: grid;
  gap: 10px;
}
.toast {
  min-width: 280px;
  max-width: 380px;
  padding: 14px 16px;
  border-radius: 16px;
}
.toast[data-kind="success"] {
  background: var(--success-100);
}
.toast[data-kind="warning"] {
  background: var(--warning-100);
}
.toast[data-kind="error"] {
  background: var(--danger-100);
}
.mobile-nav {
  display: none;
  position: sticky;
  bottom: 10px;
  z-index: 50;
  width: min(880px, calc(100vw - 20px));
  margin: 0 auto;
  padding: 8px;
}
.mobile-nav__row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.mobile-nav a {
  display: grid;
  place-items: center;
  min-height: 44px;
  padding: 8px;
  border-radius: 14px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
}
.mobile-nav a.is-active {
  background: var(--bg-selected);
}
.drawer-toggle,
.app-drawer-backdrop {
  display: none;
}
.mp-command {
  width: min(100%, 540px);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  min-height: 46px;
  border-radius: var(--radius-pill);
  box-shadow: inset 0 1px #ffffff2e;
}
.mp-command span {
  flex: 1;
  text-align: left;
}
.mp-command kbd,
.mp-command-palette__item kbd {
  border: 1px solid var(--line-default);
  border-radius: var(--radius-pill);
  padding: 4px 8px;
  font: inherit;
  font-size: 0.82rem;
  color: var(--text-body);
  background: color-mix(in srgb, var(--bg-panel) 82%, transparent);
}
.mp-command-palette[hidden] {
  display: none;
}
[hidden] {
  display: none !important;
}
.mp-command-palette {
  position: fixed;
  inset: 0;
  z-index: 3000;
}
.mp-command-palette__backdrop {
  position: absolute;
  inset: 0;
  background: #070c187a;
  backdrop-filter: blur(6px);
}
.mp-command-palette__dialog {
  position: relative;
  width: min(680px, calc(100vw - 24px));
  margin: 10vh auto 0;
  border-radius: 24px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-elevated) 95%, transparent);
  box-shadow: 0 24px 60px #09101f47;
  overflow: hidden;
}
.mp-command-palette__head {
  padding: 16px;
  border-bottom: 1px solid var(--line-default);
}
.mp-command-palette__input {
  min-height: 54px;
  padding: 0 16px;
}
.mp-command-palette__results {
  display: grid;
  gap: 8px;
  padding: 12px;
  max-height: 56vh;
  overflow: auto;
}
.mp-command-palette__item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid transparent;
  text-align: left;
  background: transparent;
  color: var(--text-strong);
  font: inherit;
  font-weight: 700;
}
.mp-command-palette__item:hover {
  background: var(--bg-hover);
  border-color: var(--line-default);
}
.mp-command-palette__empty {
  padding: 16px;
  color: var(--text-body);
}
@media (max-width: 1180px) {
  .hero,
  .layout-split,
  .layout-split--balanced,
  .dashboard-grid,
  .auth-split,
  .workspace-hero,
  .homepage-hero,
  .student-auth-split,
  .staff-wire-grid,
  .class-card__body,
  .runner-layout,
  .people-top-grid,
  .learning-plan-grid,
  .footer-grid,
  .app-shell {
    grid-template-columns: 1fr;
  }
  .app-sidebar,
  .runner-side-panel {
    position: static;
  }
  .homepage-journey-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-shell__body,
  .student-shell__body--with-nav,
  .student-shell__body.student-nav-collapsed,
  .student-shell__body--with-nav.student-nav-collapsed {
    grid-template-columns: 1fr;
  }
  .student-side-nav,
  .student-shell__body.student-nav-collapsed .student-side-nav,
  .student-shell__body--with-nav.student-nav-collapsed .student-side-nav {
    width: 100%;
  }
}
@media (max-width: 1100px) {
  .stats-grid,
  .workspace-kpis,
  .pricing-grid,
  .steps-grid,
  .metric-grid,
  .compact-kpis,
  .filter-bar,
  .card-grid.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1024px) {
  .journey-grid,
  .trust-grid {
    grid-template-columns: 1fr 1fr;
  }
  .homepage-feature-grid,
  .homepage-journey-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 980px) {
  .student-home-grid,
  .student-quick-grid,
  .school-overview-grid,
  .student-stat-grid,
  .people-top-grid,
  .learning-plan-grid {
    grid-template-columns: 1fr;
  }
  .student-guided-practice .data-item {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .button-row--equal {
    justify-content: flex-start;
  }
  .button-row--equal > .btn,
  .button-row--equal > a,
  .button-row--equal > button {
    min-width: 0;
  }
  .data-item .button-row {
    justify-content: flex-start;
  }
}
@media (max-width: 960px) {
  .student-page-content--runner {
    min-height: auto;
  }
  .student-page-content--runner .runner-shell-v2 {
    --runner-mobile-question-h: clamp(176px, 23.5dvh, 220px);
    min-height: auto;
    height: auto;
    max-height: none;
    width: min(100%, 1120px);
    padding-inline: 12px;
    overflow: visible;
    align-content: start;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    height: auto;
    max-height: none;
    align-items: start;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-stage-v2
    > .runner-question-card-v2,
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-card-v2 {
    height: auto;
    min-height: var(--runner-mobile-question-h);
    max-height: none;
    overflow: visible;
  }
  .student-page-content--runner .runner-question-body-v2 {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }
  .student-page-content--runner .runner-question-stage-v2 {
    height: auto;
    min-height: 0;
    max-height: none;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-response-zone-v2 {
    height: auto;
    align-self: start;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"] {
    --runner-dock-max-h: 36dvh;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"][data-has-answer-tools="true"] {
    --runner-dock-max-h: 50dvh;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2 {
    grid-template-rows: auto minmax(0, 1fr) auto;
    max-height: var(--runner-dock-max-h);
    overflow: hidden;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-dock-head-v2 {
    min-height: 48px;
    padding: 8px 12px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-kind-chip-v2 {
    min-height: 24px;
    padding: 3px 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-body-v2 {
    grid-template-rows: auto minmax(0, auto);
    gap: 8px;
    overflow: auto;
    padding: 8px 12px;
    overscroll-behavior: contain;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2 {
    position: relative;
    z-index: 0;
    min-height: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2 {
    gap: 5px;
    padding: 7px;
    border-radius: 14px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-title-v2 {
    display: none;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard {
    gap: 4px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row {
    gap: 4px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2 {
    position: relative;
    z-index: 1;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-commandbar-v2 {
    gap: 6px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-command-button-v2 {
    min-height: 44px;
    padding: 7px 6px;
    border-radius: 13px;
    font-size: 0.84rem;
  }
  .runner-status-v2 {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .runner-header-v2__right,
  .runner-status-v2__right {
    justify-content: flex-start;
  }
  .runner-stage-v2,
  .runner-shell-v2[data-session-kind="competition"] .runner-stage-v2 {
    grid-template-columns: 1fr;
  }
  .runner-side-rail-v2 {
    position: static;
    grid-template-rows: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    overflow: visible;
  }
  .runner-side-rail-v2[data-has-tools-card="false"] {
    grid-template-columns: 1fr;
  }
  .runner-rail-card-v2--keyboard,
  .runner-rail-card-v2--tools-placeholder {
    min-height: 0;
  }
  .student-page-content--runner .runner-shell,
  .student-page-content--runner .runner-shell .runner-question-panel {
    min-height: auto;
  }
  .runner-shell .runner-question-panel--choice .options-grid,
  .runner-shell .runner-question-panel--shape-choice .options-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
  .route-journey {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .runner-side-rail-v2 {
    grid-template-columns: 1fr;
  }
  .runner-rail-copy-v2 {
    max-width: none;
  }
  .runner-question-card-v2 .runner-prompt__main {
    max-width: 100%;
  }
  .public-header__inner,
  .app-topbar__inner,
  .student-topbar__inner,
  .mp-topbar__inner {
    grid-template-columns: 1fr;
  }
  .app-topbar__actions,
  .student-topbar__actions,
  .public-nav-right {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .app-page-bar,
  .app-page-bar__meta {
    justify-content: flex-start;
  }
  .mp-topbar__right {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .mobile-nav {
    display: block;
  }
  .auth-tabs {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 860px) {
  .runner-question-card-v2 {
    padding: 16px;
  }
  .runner-question-card-v2.runner-question-panel--choice
    .options-grid[data-option-grid],
  .runner-question-card-v2.runner-question-panel--shape-choice
    .options-grid[data-option-grid] {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
  :root {
    --site-gutter: 10px;
  }
  .workspace-kpis,
  .feature-grid,
  .journey-grid,
  .trust-grid,
  .pricing-grid,
  .steps-grid,
  .metric-grid,
  .compact-kpis,
  .footer-grid,
  .student-illustration-card,
  .appearance-options {
    grid-template-columns: 1fr;
  }
  .utility-strip__inner {
    flex-direction: column;
    justify-content: center;
    padding: 8px 0;
  }
}
@media (max-width: 820px) {
  .preview-grid,
  .card-grid.three,
  .card-grid.two,
  .card-grid.four,
  .multi-field-grid.two,
  .multi-field-grid.three,
  .filter-bar,
  .filter-bar--wide,
  .filter-bar--curriculum {
    grid-template-columns: 1fr;
  }
  .runner-question-head,
  .runner-question-body,
  .runner-shell .runner-action-bar {
    padding-left: 18px;
    padding-right: 18px;
  }
  .runner-shell .runner-answer-panel {
    margin: 16px 16px 0;
    padding: 18px;
  }
  .header-action-stack {
    width: 100%;
    justify-content: flex-start;
  }
}
@media (max-width: 980px) {
  body.portal-adult .app-shell--adult,
  body.sidebar-collapsed.portal-adult .app-shell--adult {
    grid-template-columns: minmax(0, 1fr);
  }
  body.portal-adult .app-sidebar--adult {
    display: none;
  }
  body.portal-adult.drawer-open .app-sidebar--adult {
    display: grid;
  }
  .drawer-toggle {
    display: inline-flex;
  }
  .app-drawer-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 64;
    border: 0;
    padding: 0;
    background: #10192c57;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
  }
  body.drawer-open {
    overflow: hidden;
  }
  body.drawer-open .app-drawer-backdrop {
    opacity: 1;
    pointer-events: auto;
  }
  .app-sidebar {
    position: fixed;
    inset: calc(var(--header-height) + 4px) 16px 16px 16px;
    z-index: 65;
    background: var(--bg-panel);
    padding: 14px;
    border-radius: 24px;
    box-shadow: var(--shadow-lg);
    transform: translateY(12px);
    opacity: 0;
    pointer-events: none;
    transition: 0.22s ease;
    overflow: auto;
  }
  body.drawer-open .app-sidebar {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }
  body.drawer-open .app-content {
    filter: blur(1px);
  }
  .sidebar-link__icon {
    display: none;
  }
  .app-content {
    padding: 16px;
    border-radius: 24px;
  }
}
@media (max-width: 720px) {
  .mp-topbar__right--signed-out {
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .mp-public-auth-actions {
    width: 100%;
    justify-content: stretch;
  }
  .mp-inline-link--button {
    flex: 1 1 0;
  }
}
@media (max-width: 640px) {
  .hero-copy,
  .hero-preview,
  .card,
  .summary-card,
  .student-card,
  .runner-main,
  .login-card,
  .homepage-card,
  .homepage-journey-card {
    padding: 18px;
  }
  .hero-copy h1 {
    font-size: 2.2rem;
  }
  .pill-nav {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 2px;
  }
  .toast-layer {
    left: 10px;
    right: 10px;
  }
  .toast {
    min-width: 0;
    max-width: none;
  }
  .topbar-brand-image {
    height: 44px;
  }
}
@media (max-width: 900px) {
  .runner-prompt__main,
  .runner-prompt--wordy .runner-prompt__main,
  .runner-prompt--with-visual .runner-prompt__main,
  .runner-prompt--dense .runner-prompt__main,
  .runner-prompt--chart .runner-prompt__main,
  .runner-prompt--grid .runner-prompt__main,
  .runner-prompt--number-line .runner-prompt__main,
  .runner-prompt--probability .runner-prompt__main,
  .runner-prompt--angle .runner-prompt__main,
  .runner-question-panel--choice .runner-prompt__main,
  .runner-shell .runner-prompt--compact-flow .runner-prompt__main {
    max-width: none;
    font-size: clamp(1.32rem, 5vw, 1.9rem);
  }
  .runner-shell .runner-prompt--fraction-expression .runner-prompt__main {
    white-space: normal;
  }
  .options-grid--cols-5,
  .options-grid[data-option-grid="2x5"],
  .options-grid[data-option-grid="3x5"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media print {
  .public-header,
  .app-topbar,
  .student-topbar,
  .app-sidebar,
  .button-row,
  .mobile-nav,
  .toast-layer,
  .modal-layer,
  .print-hide,
  .skip-link {
    display: none !important;
  }
  body {
    background: #fff !important;
  }
  .app-shell,
  .public-shell,
  .student-shell,
  .page-shell,
  .student-shell__body,
  .app-content {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .card,
  .student-card,
  .sidebar-panel,
  .workspace-hero {
    box-shadow: none !important;
    border: 1px solid #ccc !important;
    break-inside: avoid;
  }
}
.mp-topbar {
  position: sticky;
  top: 0;
  z-index: 80;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}
#appRoot > .mp-topbar:first-child,
body > .mp-topbar:first-child,
.student-shell > .mp-topbar:first-child {
  margin-top: 0;
}
.mp-topbar__inner {
  width: var(--site-width);
  min-height: var(--header-height);
  margin: 0 auto;
  padding: 0 clamp(16px, 2vw, 24px);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: clamp(16px, 2vw, 28px);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-elevated) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  border: 1px solid var(--line-default);
  border-top: 0;
  border-radius: 0 0 24px 24px;
  box-shadow: none;
  transform: translateY(-1px);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .mp-topbar__inner {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-elevated) 96%, black 4%),
    color-mix(in srgb, var(--bg-panel) 94%, black 6%)
  );
}
.student-shell > .mp-topbar:first-child .mp-topbar__inner {
  transform: translateY(0);
}
.mp-topbar__center,
.mp-topbar__left,
.mp-topbar__right {
  min-width: 0;
}
.mp-topbar__left {
  align-self: stretch;
  display: flex;
  align-items: center;
}
.mp-topbar__left-slot {
  display: flex;
  align-items: center;
  min-width: 0;
}
.mp-topbar__center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.mp-topbar__center:empty {
  display: block;
}
.mp-topbar__brand {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  min-width: 0;
  height: 100%;
  padding: 0;
  margin: 0;
}
:is(.topbar-brand-image, .mp-topbar__brand img) {
  display: block;
  width: auto;
  height: calc(var(--header-height) - 8px);
  max-height: calc(var(--header-height) - 8px);
  object-fit: contain;
  object-position: left center;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .topbar-brand-image {
  filter: drop-shadow(0 0 0 rgba(0, 0, 0, 0));
}
.mp-topbar__right,
.mp-topbar__utility-pill,
.mp-tool-group,
.mp-public-auth-actions,
.mp-language-menu,
.mp-profile-menu,
.mp-profile-trigger {
  display: flex;
  align-items: center;
}
.mp-topbar__right {
  justify-self: end;
  justify-content: flex-end;
  align-self: stretch;
  min-height: 100%;
  gap: clamp(12px, 1.4vw, 18px);
  flex-wrap: nowrap;
}
.mp-topbar__utility-pill,
.mp-tool-group,
.mp-public-auth-actions {
  min-height: 100%;
  gap: clamp(10px, 1.1vw, 16px);
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.mp-public-auth-actions {
  justify-content: flex-end;
}
.mp-command {
  min-height: 44px;
  margin: 0;
}
.mp-language-menu,
.mp-profile-menu {
  position: relative;
}
:is(
  .mp-language-menu summary,
  .mp-topbar__control,
  .mp-inline-link--button,
  .mp-profile-trigger
) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-width: 44px;
  min-height: 48px;
  padding: 0 6px;
  margin: 0;
  line-height: 1;
  vertical-align: middle;
  white-space: nowrap;
  background: transparent;
  border: 0;
  box-shadow: none;
  text-decoration: none;
}
:is(.mp-language-menu summary, .mp-topbar__control, .mp-inline-link--button) {
  color: var(--text-strong);
  font-size: 1.14rem;
  font-weight: 800;
  letter-spacing: 0;
}
.mp-inline-link--button,
.mp-profile-trigger {
  padding-inline: 0;
}
:is(
  .mp-language-menu summary,
  .mp-topbar__control,
  .mp-inline-link--button,
  .mp-profile-trigger
):is(:hover, :focus-visible) {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--brand-700);
  outline: none;
}
.mp-topbar__control svg,
.mp-topbar__control .mp-icon {
  width: 1.28rem;
  height: 1.28rem;
}
.mp-topbar__right--signed-out {
  gap: clamp(12px, 1.4vw, 18px);
}
@media (max-width: 1180px) {
  .mp-topbar__inner {
    padding-inline: 16px;
    column-gap: 16px;
  }
  :is(.topbar-brand-image, .mp-topbar__brand img) {
    height: calc(var(--header-height) - 12px);
    max-height: calc(var(--header-height) - 12px);
  }
  :is(.mp-language-menu summary, .mp-topbar__control, .mp-inline-link--button) {
    font-size: 1.06rem;
  }
}
@media (max-width: 980px) {
  .mp-topbar__right,
  .mp-topbar__utility-pill,
  .mp-tool-group,
  .mp-public-auth-actions {
    gap: 10px;
  }
  :is(
    .mp-language-menu summary,
    .mp-topbar__control,
    .mp-inline-link--button,
    .mp-profile-trigger
  ) {
    min-height: 44px;
  }
  .mp-profile-trigger__avatar {
    width: 42px;
    height: 42px;
  }
}
.mp-icon {
  width: 1.1rem;
  height: 1.1rem;
  flex: 0 0 auto;
}
.mp-icon--theme {
  width: 1.15rem;
  height: 1.15rem;
}
.mp-inline-link {
  color: var(--text-body);
  font-weight: 700;
}
.mp-inline-link--strong {
  color: var(--text-strong);
}
.mp-public-auth-actions .mp-inline-link--strong {
  min-height: 44px;
  padding-inline: 14px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 20%, var(--line-default) 80%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 34%, white 66%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  box-shadow: var(--shadow-sm);
}
.mp-public-auth-actions .mp-inline-link--strong:hover,
.mp-public-auth-actions .mp-inline-link--strong:focus-visible {
  color: var(--brand-700);
  border-color: color-mix(
    in srgb,
    var(--brand-500) 32%,
    var(--line-default) 68%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 42%, white 58%),
    color-mix(in srgb, var(--bg-panel) 94%, white 6%)
  );
}
html[data-appearance="dark"] .mp-public-auth-actions .mp-inline-link--strong,
html[data-theme="dark"] .mp-public-auth-actions .mp-inline-link--strong,
body.theme-dark .mp-public-auth-actions .mp-inline-link--strong {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 26%, transparent),
    color-mix(in srgb, var(--bg-panel) 90%, black 10%)
  );
}
.mp-profile-menu__label {
  padding: 10px 12px 8px;
  font-weight: 800;
  color: var(--text-strong);
  border-bottom: 1px solid var(--line-subtle);
  margin-bottom: 2px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.mp-profile-menu__item--danger {
  color: var(--danger-700);
}
.mp-profile-menu__item--danger:hover {
  background: color-mix(in srgb, var(--danger-100) 76%, var(--bg-panel) 24%);
}
.homepage-feature-grid--landing,
.homepage-journey-grid--landing {
  align-items: stretch;
}
.homepage-section--landing {
  gap: var(--space-5);
}
.homepage-section--landing .homepage-section__title {
  margin-top: 2px;
}
.price-card--featured {
  position: relative;
  border-color: color-mix(
    in srgb,
    var(--brand-600) 22%,
    var(--line-default) 78%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 18%, var(--bg-panel) 82%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  box-shadow: var(--shadow-md);
}
.price-card--featured:before {
  content: "Popular";
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, #dbc28d 70%, white 30%);
  color: #28301b;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}
.auth-split--premium .auth-panel,
.auth-split--premium .auth-aside {
  min-height: 0;
}
.sidebar-panel--footer {
  display: grid;
  gap: var(--space-3);
}
.dashboard-kpi-grid {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.form-grid-tight,
.assignment-form-grid {
  gap: var(--space-3);
}
.people-create-card,
.people-credentials-card,
.people-list-card,
.assignment-builder-card,
.curriculum-table-wrap,
.staff-wire-grid__form,
.staff-wire-grid__table {
  min-width: 0;
}
.quick-action-row--compact {
  width: min(340px, 100%);
}
.stack-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}
.table-wrap--compact table th,
.table-wrap--compact table td {
  padding-top: 11px;
  padding-bottom: 11px;
}
.table-wrap--wide {
  overflow-x: auto;
}
.curriculum-table th:nth-child(2),
.curriculum-table td:nth-child(2) {
  width: 88px;
  text-align: center;
}
.recommendation-grid--spacious {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.intervention-card {
  border-color: color-mix(
    in srgb,
    var(--warning-700) 22%,
    var(--line-default) 78%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--warning-100) 36%, var(--bg-panel) 64%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.timeline {
  position: relative;
  display: grid;
  gap: var(--space-3);
}
.timeline:before {
  content: "";
  position: absolute;
  left: 14px;
  top: 10px;
  bottom: 10px;
  width: 2px;
  background: color-mix(in srgb, var(--brand-500) 24%, transparent);
}
.timeline-item {
  position: relative;
  display: grid;
  gap: 4px;
  padding: 14px 16px 14px 42px;
  border-radius: var(--radius-3);
  border: 1px solid var(--line-default);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  box-shadow: var(--shadow-sm);
}
.timeline-item:before {
  content: "";
  position: absolute;
  left: 8px;
  top: 18px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--brand-700), var(--brand-500));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--bg-panel) 88%, transparent);
}
.trend-bars {
  display: flex;
  gap: 12px;
  align-items: flex-end;
  min-height: 180px;
  padding: 8px 0;
}
.trend-bars__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 48px;
}
.trend-bars__item strong,
.trend-bars__item small {
  color: var(--text-body);
}
.trend-bars__value {
  display: block;
  width: 24px;
  min-height: 12px;
  border-radius: 999px 999px 6px 6px;
  background: linear-gradient(180deg, var(--student-500), var(--student-700));
}
.student-auth-points {
  display: grid;
  gap: var(--space-3);
}
.student-auth-points > div {
  display: grid;
  gap: 4px;
  padding-top: var(--space-3);
  border-top: 1px solid var(--line-subtle);
}
.student-auth-points > div:first-child {
  padding-top: 0;
  border-top: 0;
}
.student-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-4);
  align-items: center;
}
.student-completion-card {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--student-100) 20%, var(--bg-panel-2) 80%)
  );
}
.options-grid--explicit {
  grid-auto-flow: row;
  align-items: stretch;
}
.options-grid--explicit .option-chip--tile,
.options-grid--explicit .option-chip--single {
  min-height: 82px;
}
.options-grid--compact-choice {
  grid-auto-rows: minmax(68px, auto);
}
.options-grid--symbol-row {
  gap: var(--space-4);
}
.runner-hint {
  width: min(100%, 760px);
  margin-inline: auto;
  padding: 16px 18px;
  border-radius: var(--radius-3);
  border: 1px solid
    color-mix(in srgb, var(--brand-400) 14%, var(--line-default) 86%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 46%, var(--bg-panel) 54%),
    color-mix(in srgb, var(--bg-panel) 98%, white 2%)
  );
  color: var(--text-strong);
  line-height: 1.65;
}
.runner-hint[hidden],
.runner-worked[hidden] {
  display: none !important;
}
.runner-hint-summary,
.runner-worked-summary,
.runner-visual-explanation {
  margin: 0;
  color: var(--text-default);
}
.runner-hint-ladder,
.runner-teaching-points {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: 8px;
}
.runner-hint-step-label {
  display: inline-block;
  margin-bottom: 4px;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.runner-hint-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.runner-hint-head strong {
  font-size: 0.76rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.runner-hint-progress {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--student-800);
  background: color-mix(in srgb, var(--student-100) 82%, white 18%);
}
.runner-hint-short {
  color: var(--text-default);
}
.runner-watch-out {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--warning-600) 18%, var(--line-default) 82%);
  background: color-mix(in srgb, var(--warning-50) 72%, var(--bg-panel) 28%);
}
.runner-watch-out p {
  margin: 0;
}
.runner-shell .runner-prompt--compact .runner-prompt__main {
  max-width: 18ch;
  font-size: clamp(1.55rem, 3.1vw, 2.55rem);
}
.runner-prompt--table .runner-prompt__main,
.runner-shell .runner-prompt--visual-compact .runner-prompt__main {
  max-width: 34ch;
  font-size: clamp(1.55rem, 2.6vw, 2.35rem);
}
.runner-shell .runner-prompt--single-line-preferred .runner-prompt__main {
  max-width: 38ch;
  text-wrap: unset;
}
.visual-card__title {
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--text-strong);
}
.visual-card--chart,
.visual-card--grid,
.visual-card--number-line,
.visual-card--fraction-model,
.visual-card--probability-scale,
.visual-card--angle,
.visual-card--clock,
.visual-card--table,
.visual-card--line-graph {
  justify-items: center;
}
.visual-card--chart {
  overflow-x: auto;
}
.visual-card--chart .visual-svg,
.visual-svg--chart {
  width: min(100%, 820px);
  max-width: 820px;
  height: auto;
  display: block;
  margin-inline: auto;
}
.visual-card--line-graph .visual-svg--chart {
  width: min(100%, 900px);
  max-width: 900px;
}
.visual-card--number-line .visual-svg--number-line,
.visual-card--probability-scale .visual-svg--probability-scale {
  width: min(100%, 760px);
  max-width: 760px;
  height: auto;
  display: block;
  margin-inline: auto;
}
.visual-card--grid .visual-svg--grid {
  width: min(100%, 920px);
  max-width: 920px;
  height: auto;
}
.visual-card--fraction-model .visual-svg--fraction-model {
  width: min(100%, 900px);
  max-width: 900px;
  height: auto;
}
.visual-card--angle .visual-svg--angle {
  width: min(100%, 520px);
  max-width: 520px;
  height: auto;
  margin-inline: auto;
}
.visual-card--clock .visual-svg {
  width: min(100%, 420px);
  max-width: 420px;
  height: auto;
  margin-inline: auto;
}
.runner-visual-panel-v2 .visual-svg,
.runner-visual-panel-v2 .visual-svg--chart,
.runner-visual-panel-v2 .visual-svg--grid,
.runner-visual-panel-v2 .visual-svg--number-line,
.runner-visual-panel-v2 .visual-svg--angle,
.runner-visual-panel-v2 .visual-svg--fraction-model,
.runner-visual-panel-v2 .visual-svg--probability-scale,
.runner-question-card-v2 .question-image,
.runner-question-card-v2 .official-crop-image {
  max-width: 100%;
  max-height: var(--runner-visual-max-h, none);
}
.runner-visual-panel-v2 .visual-card--chart .visual-svg,
.runner-visual-panel-v2 .visual-card--line-graph .visual-svg--chart,
.runner-visual-panel-v2 .visual-card--number-line .visual-svg--number-line,
.runner-visual-panel-v2
  .visual-card--probability-scale
  .visual-svg--probability-scale,
.runner-visual-panel-v2
  .visual-card--fraction-model
  .visual-svg--fraction-model,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .visual-card--grid,
.runner-question-card-v2.runner-question-panel--transformation-grid
  .visual-card--grid,
.runner-question-card-v2.runner-question-panel--coordinate-grid
  .visual-card--grid {
  width: min(100%, 1180px);
}
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .visual-card--grid
  .visual-svg--grid,
.runner-question-card-v2.runner-question-panel--transformation-grid
  .visual-card--grid
  .visual-svg--grid,
.runner-question-card-v2.runner-question-panel--coordinate-grid
  .visual-card--grid
  .visual-svg--grid {
  width: min(100%, 980px);
  max-width: 980px;
}
.runner-visual-panel-v2 .visual-card--grid .visual-svg--grid,
.runner-visual-panel-v2 .visual-card--angle .visual-svg--angle,
.runner-visual-panel-v2 .visual-card--clock .visual-svg {
  width: auto;
  height: auto;
}
.visual-card--table .visual-table {
  table-layout: fixed;
}
.visual-card--table .visual-table th,
.visual-card--table .visual-table td {
  white-space: nowrap;
}
.visual-card--table-function-input,
.visual-card--function-input,
.table-wrap--function-input {
  width: min(100%, 760px);
  margin-inline: auto;
}
.visual-table--function-input th,
.visual-table--function-input td {
  white-space: nowrap;
  text-align: center;
  padding-block: 16px;
}
.visual-table--function-input th.is-variable {
  font-size: 1rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.visual-table--function-input td.is-target {
  font-weight: 800;
  color: var(--brand-800);
  background: color-mix(in srgb, var(--brand-100) 52%, white 48%);
}
.visual-axis-label--compact {
  font-size: 0.875rem;
  font-weight: 800;
}
.visual-hit--grid,
.visual-cell-hit,
.visual-svg--grid [data-grid-cell],
.visual-svg--grid [data-grid-point] {
  cursor: crosshair;
}
.visual-number-line-target {
  fill: color-mix(in srgb, var(--student-500) 28%, transparent);
}
.fraction-model-segment {
  fill: color-mix(in srgb, white 92%, var(--student-100) 8%);
  stroke: color-mix(in srgb, var(--line-default) 78%, white 22%);
  stroke-width: 2;
}
.visual-svg--fraction-model .fraction-model-segment.is-filled {
  fill: color-mix(in srgb, var(--student-500) 82%, white 18%);
  stroke: color-mix(in srgb, var(--student-700) 70%, white 30%);
}
@media (max-width: 1180px) {
  .dashboard-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 980px) {
  .student-summary {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .mp-topbar__center {
    justify-content: flex-start;
  }
}
@media (max-width: 860px) {
  .dashboard-kpi-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .timeline-item {
    padding-left: 38px;
  }
}
.class-create-bar,
.class-wire-card__header,
.class-wire-card__metric,
.class-wire-card__section,
.toggle-field {
  display: grid;
  gap: var(--space-3);
}
.class-wire-card__section {
  padding-top: var(--space-3);
  border-top: 1px solid var(--line-subtle);
}
.class-wire-card__section--admin {
  margin-top: auto;
}
.compact-kpis--tight .metric-card,
.compact-kpis--tight .kpi-card {
  padding: 12px 14px;
}
.credentials-print-btn {
  min-width: 180px;
  justify-content: center;
}
.people-credentials-note {
  margin: -2px 0 14px;
  max-width: 68ch;
}
.visual-number-line-tick.is-anchor {
  stroke-width: 3.2;
}
.adult-shell {
  width: var(--site-width);
  margin-inline: auto;
}
@media (max-width: 980px) {
  .student-page-content--runner .runner-shell .runner-question-panel {
    min-height: calc(100dvh - 148px);
  }
  .runner-shell .runner-answer-panel {
    margin-inline: 14px;
  }
  .runner-answer-stack,
  .runner-keyboard-wrap,
  .runner-action-bar .button-row,
  .runner-question-panel--choice .runner-answer-stack,
  .runner-question-panel--shape-choice .runner-answer-stack,
  .runner-question-panel--choice .runner-action-bar .button-row,
  .runner-question-panel--shape-choice .runner-action-bar .button-row,
  .runner-visual-panel,
  .runner-visual-panel .visual-card {
    width: 100%;
  }
  .runner-shell .runner-question-panel--choice .options-grid[data-option-grid],
  .runner-shell
    .runner-question-panel--shape-choice
    .options-grid[data-option-grid] {
    grid-template-columns: repeat(
      var(--option-grid-cols, 2),
      minmax(
        min(42vw, var(--option-tile-width, 170px)),
        min(42vw, var(--option-tile-width, 170px))
      )
    );
  }
  .runner-question-panel--choice .option-chip--tile > span,
  .runner-question-panel--choice .option-chip--single > span,
  .runner-question-panel--shape-choice .option-chip--tile > span,
  .runner-question-panel--shape-choice .option-chip--single > span {
    font-size: clamp(1.15rem, 3.3vw, 1.55rem);
  }
  .visual-card--chart .visual-svg,
  .visual-svg--chart,
  .visual-card--line-graph .visual-svg--chart,
  .visual-card--number-line .visual-svg--number-line,
  .visual-card--probability-scale .visual-svg--probability-scale,
  .visual-card--fraction-model .visual-svg--fraction-model,
  .visual-card--grid .visual-svg--grid,
  .visual-card--angle .visual-svg--angle,
  .visual-card--clock .visual-svg {
    width: 100%;
    max-width: 100%;
  }
}
:root {
  --light-primary-start: #3f5ea3;
  --light-primary-end: #324c87;
  --light-primary-border: rgba(50, 76, 135, 0.72);
  --light-primary-shadow: 0 10px 24px rgba(76, 97, 166, 0.14);
  --light-icon-surface: #eef2ff;
  --light-icon-ink: #5671be;
}
.app-sidebar__togglebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px 0;
}
.app-sidebar__menu-title {
  color: var(--text-muted);
  white-space: nowrap;
}
.adult-mobile-menu-row {
  display: none;
}
.adult-mobile-menu-toggle {
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding-inline: 14px;
  border-radius: 999px;
  font-size: 0.92rem;
  font-weight: 700;
}
.adult-mobile-menu-toggle--topbar {
  justify-content: center;
  width: 44px;
  min-width: 44px;
  padding-inline: 0;
  border-radius: 14px;
  border: 1px solid
    color-mix(in srgb, var(--line-default) 78%, var(--brand-100) 22%);
  background: color-mix(in srgb, var(--bg-elevated) 88%, var(--brand-50) 12%);
  color: var(--text-strong);
  box-shadow: 0 8px 18px #0f172a12;
}
.adult-mobile-menu-toggle--topbar:hover,
.adult-mobile-menu-toggle--topbar:focus-visible {
  border-color: color-mix(
    in srgb,
    var(--brand-300) 55%,
    var(--line-default) 45%
  );
  background: color-mix(in srgb, var(--bg-elevated) 80%, var(--brand-50) 20%);
  color: var(--brand-700);
  box-shadow: 0 10px 22px #1e40af1a;
}
.adult-mobile-menu-toggle--topbar .adult-mobile-menu-toggle__label {
  display: none;
}
.app-sidebar__toggle {
  min-width: 42px;
  width: 42px;
  min-height: 42px;
  padding: 0;
  box-shadow: none;
}
body.sidebar-collapsed .app-sidebar__togglebar {
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}
body.sidebar-collapsed .app-sidebar__menu-title {
  display: none;
}
body.sidebar-collapsed .app-sidebar__toggle {
  margin-inline: auto;
}
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .btn.primary,
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .button-row
  .primary,
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .homepage-btn--primary {
  background: linear-gradient(
    135deg,
    var(--light-primary-start),
    var(--light-primary-end)
  );
  border-color: var(--light-primary-border);
  box-shadow: var(--light-primary-shadow);
}
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .btn.primary:hover,
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .button-row
  .primary:hover,
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .homepage-btn--primary:hover {
  filter: saturate(0.96) brightness(1.01);
}
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .homepage-card__icon {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--light-icon-surface) 88%, white 12%),
    color-mix(in srgb, var(--light-icon-surface) 76%, white 24%)
  );
  color: var(--light-icon-ink);
  box-shadow: inset 0 0 0 1px #5c76c61a;
}
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .auth-tabs
  .tab-button {
  background: linear-gradient(180deg, #f8f4ecf5, #f4efe5fa);
  border-color: #3341661a;
  box-shadow: inset 0 0 0 1px #ffffff70;
}
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .auth-tabs
  .tab-button.is-active,
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .auth-tabs
  [role="tab"][aria-selected="true"] {
  background: linear-gradient(180deg, #e8eefffa, #dfe7fcfa);
  border-color: #6f88dd57;
  box-shadow: inset 0 0 0 1px #99aceb4d;
}
html:not([data-appearance="dark"]):not([data-appearance="high-contrast"])
  .auth-tabs
  .tab-button:hover {
  background: linear-gradient(180deg, #f0ece3fa, #ece7dcfa);
}
html[data-appearance="dark"] .sidebar-link__icon,
html[data-appearance="dark"] .student-side-nav__icon,
html[data-appearance="dark"] .sidebar-link img {
  opacity: 1;
  filter: brightness(1.38) saturate(0.92);
}
html[data-appearance="dark"] .sidebar-link.is-active .sidebar-link__icon,
html[data-appearance="dark"]
  .student-side-nav__link.is-active
  .student-side-nav__icon {
  filter: brightness(1.52) saturate(0.96);
}
html[data-appearance="dark"] .topbar-brand-image,
html[data-appearance="dark"] .mp-footer__logo {
  filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.04));
}
html[data-appearance="dark"] .mp-footer__links a,
html[data-theme="dark"] .mp-footer__links a,
body.theme-dark .mp-footer__links a {
  color: var(--text-strong);
}
html[data-appearance="dark"] .mp-footer__legal,
html[data-theme="dark"] .mp-footer__legal,
body.theme-dark .mp-footer__legal {
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
.visual-scene {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.visual-scene .scene-el {
  vector-effect: non-scaling-stroke;
}
.visual-scene .scene-label,
.visual-scene .visual-shape-label,
.visual-scene .visual-angle-label,
.visual-scene .scene-bar-label,
.visual-scene .scene-clock-number {
  fill: var(--text-strong);
  font-size: 14px;
  font-weight: 800;
}
.visual-scene .visual-shape,
.visual-scene .scene-solid-face,
.visual-scene .scene-net-cell,
.visual-scene .scene-partition-cell {
  fill: color-mix(in srgb, var(--student-100) 55%, white 45%);
  stroke: color-mix(in srgb, var(--text-strong) 78%, white 22%);
  stroke-width: 2.2;
}
.visual-scene .scene-solid-face--back {
  fill: color-mix(in srgb, var(--student-100) 35%, white 65%);
}
.visual-scene .scene-solid-face--top {
  fill: color-mix(in srgb, var(--student-100) 46%, white 54%);
}
.visual-scene .scene-solid-face--side {
  fill: color-mix(in srgb, var(--student-100) 42%, white 58%);
}
.visual-scene .scene-solid-face--front {
  fill: color-mix(in srgb, var(--student-100) 58%, white 42%);
}
.visual-scene .scene-solid-edge,
.visual-scene .scene-solid-grid,
.visual-scene .visual-angle-arm,
.visual-scene .visual-arrow,
.visual-scene .scene-axis,
.visual-scene .scene-equal-mark,
.visual-scene .scene-right-angle,
.visual-scene .visual-line,
.visual-scene .scene-grid-line,
.visual-scene .scene-grid-point-target,
.visual-scene .scene-grid-hotspot,
.visual-scene .scene-arrow-head,
.visual-scene .scene-clock-face,
.visual-scene .scene-clock-hour,
.visual-scene .scene-clock-minute,
.visual-scene .scene-clock-centre,
.visual-scene .scene-object--circle,
.visual-scene .scene-object--square,
.visual-scene .scene-object--triangle,
.visual-scene .scene-tens-frame,
.visual-scene .scene-bar-part,
.visual-scene .scene-partition-cell,
.visual-scene .scene-shaded {
  vector-effect: non-scaling-stroke;
}
.visual-scene .visual-angle-arm,
.visual-scene .visual-arrow,
.visual-scene .scene-axis,
.visual-scene .scene-solid-edge,
.visual-scene .scene-solid-grid,
.visual-scene .scene-equal-mark,
.visual-scene .scene-right-angle,
.visual-scene .visual-line {
  fill: none;
  stroke: color-mix(in srgb, var(--text-strong) 78%, white 22%);
  stroke-width: 2.6;
  stroke-linecap: round;
}
.visual-scene .scene-solid-edge--back {
  stroke-opacity: 0.72;
  stroke-dasharray: 5 4;
}
.visual-scene .scene-solid-edge--front {
  stroke-width: 2.9;
}
.visual-scene .scene-solid-grid {
  stroke: color-mix(in srgb, var(--text-strong) 64%, white 36%);
  stroke-width: 1.8;
  stroke-linecap: round;
  opacity: 0.86;
}
.visual-scene .scene-solid-grid--front {
  stroke-width: 2.1;
  opacity: 0.94;
}
.visual-scene .visual-measure-line {
  fill: none;
  stroke: color-mix(in srgb, var(--student-700) 72%, var(--text-strong) 28%);
  stroke-width: 2.8;
  stroke-linecap: round;
}
.visual-scene .visual-construction-line,
.visual-scene .visual-symmetry-line {
  fill: none;
  stroke: color-mix(in srgb, var(--student-500) 68%, white 32%);
  stroke-width: 2.2;
  stroke-dasharray: 8 7;
  stroke-linecap: round;
}
.visual-scene .scene-grid-line {
  stroke: color-mix(in srgb, var(--line-default) 70%, white 30%);
  stroke-width: 1.25;
}
.visual-scene .scene-grid-hotspot {
  fill: #ffffff03;
  stroke: transparent;
}
.visual-scene .scene-grid-hotspot.is-selected,
.visual-scene .scene-grid-point-target.is-selected {
  fill: color-mix(in srgb, var(--student-300) 60%, white 40%);
  stroke: color-mix(in srgb, var(--student-500) 78%, white 22%);
  stroke-width: 2;
}
.visual-scene .scene-grid-point-target {
  fill: #ffffff05;
  stroke: color-mix(in srgb, var(--student-500) 74%, white 26%);
  stroke-width: 1.6;
}
.visual-scene .scene-arrow-head {
  fill: color-mix(in srgb, var(--text-strong) 82%, white 18%);
}
.visual-scene .scene-clock-face {
  fill: #fff;
  stroke: color-mix(in srgb, var(--text-strong) 78%, white 22%);
  stroke-width: 2.6;
}
.visual-scene .scene-clock-hour {
  stroke: var(--text-strong);
  stroke-width: 5;
  stroke-linecap: round;
}
.visual-scene .scene-clock-minute {
  stroke: color-mix(in srgb, var(--student-500) 76%, white 24%);
  stroke-width: 3.8;
  stroke-linecap: round;
}
.visual-scene .scene-clock-centre {
  fill: color-mix(in srgb, var(--student-500) 82%, black 18%);
}
.visual-scene .scene-object--circle,
.visual-scene .scene-object--square,
.visual-scene .scene-object--triangle,
.visual-scene .scene-tens-frame,
.visual-scene .scene-bar-part,
.visual-scene .scene-partition-cell,
.visual-scene .scene-shaded {
  stroke: color-mix(in srgb, var(--text-strong) 74%, white 26%);
  stroke-width: 1.8;
}
.visual-scene .scene-object--circle,
.visual-scene .scene-object--square,
.visual-scene .scene-object--triangle,
.visual-scene .scene-bar-part,
.visual-scene .scene-shaded,
.visual-scene .scene-partition-cell.is-shaded,
.visual-scene .scene-tens-frame.is-filled {
  fill: color-mix(in srgb, var(--student-300) 72%, white 28%);
}
.visual-scene .scene-tens-frame,
.visual-scene .scene-partition-cell {
  fill: #fff;
}
.visual-scene .scene-bar-part--1,
.visual-scene .scene-bar-part--3 {
  opacity: 0.8;
}
.visual-card--image-overlay {
  padding: 14px;
}
.image-overlay-stack {
  display: grid;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  position: relative;
}
.image-overlay-stack > .image-overlay {
  margin: 0;
}
.image-overlay {
  position: relative;
  width: min(100%, 760px);
  margin: 0 auto;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 12px 30px #0f172a14;
}
.image-overlay__image {
  display: block;
  width: 100%;
  height: auto;
}
.image-overlay__hotspot,
.image-overlay__coordinate-layer {
  position: absolute;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
}
.image-overlay__hotspot {
  transform: translate(-50%, -50%);
  border-radius: 14px;
  outline: 2px solid transparent;
  outline-offset: -2px;
  transition:
    outline-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease;
}
.image-overlay__hotspot--circle {
  border-radius: 999px;
}
.image-overlay__hotspot:hover,
.image-overlay__hotspot:focus-visible {
  outline-color: #2563eb66;
  box-shadow: 0 0 0 3px #2563eb1a;
}
.image-overlay__hotspot.is-selected {
  background: #3b82f614;
  outline-color: #2563ebeb;
  box-shadow: 0 0 0 3px #2563eb24;
}
.image-overlay__coordinate-layer {
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: crosshair;
}
.image-overlay__marker {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.image-overlay__marker--point {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #2563ebf2;
  border: 3px solid #fff;
  box-shadow: 0 4px 14px #0f172a38;
}
.image-overlay__marker--arrow-up {
  color: #2563ebf5;
  font-size: 42px;
  font-weight: 800;
  line-height: 1;
  text-shadow: 0 4px 14px rgba(15, 23, 42, 0.18);
  transform: translate(-50%, -92%);
}
.image-overlay__bar-preview {
  position: absolute;
  pointer-events: none;
  border-radius: 10px 10px 2px 2px;
  background: #3b82f62e;
  outline: 2px solid rgba(37, 99, 235, 0.92);
  box-shadow: 0 10px 22px #2563eb2e;
}
.image-overlay__caption {
  margin-top: 10px;
}
.image-overlay__helper-strip {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 16px;
  background:
    linear-gradient(180deg, #f8fafcfa, #f1f5f9f5),
    repeating-linear-gradient(
      90deg,
      rgba(148, 163, 184, 0.08) 0 1px,
      transparent 1px 24px
    );
}
.image-overlay__ruler-pointer-guide {
  position: absolute;
  z-index: 4;
  width: 1px;
  transform: translate(-50%);
  pointer-events: none;
  border-radius: 999px;
  background: linear-gradient(180deg, #2563eb1f, #2563eb7a, #2563eb2e);
  box-shadow: 0 0 0 1px #2563eb14;
}
.image-overlay__helper-strip[hidden] {
  display: none !important;
}
.image-overlay__helper-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.image-overlay__helper-note {
  color: #334155eb;
  font-size: 0.9rem;
  font-weight: 600;
}
.image-overlay__helper-unit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: #2563eb14;
  color: #1e40aff5;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.image-overlay__ruler {
  position: relative;
  height: 54px;
}
.image-overlay__ruler-line {
  position: absolute;
  top: 16px;
  height: 2px;
  border-radius: 999px;
  background: #0f172ac2;
}
.image-overlay__ruler-origin-guide {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  transform: translate(-50%);
  border-radius: 999px;
  background: linear-gradient(180deg, #2563eb14, #2563ebb8, #2563eb29);
}
.image-overlay__ruler-tick {
  position: absolute;
  top: 10px;
  width: 1px;
  height: 10px;
  transform: translate(-50%);
  background: #3341558c;
}
.image-overlay__ruler-tick--mid {
  top: 8px;
  height: 14px;
  background: #1e293bad;
}
.image-overlay__ruler-tick--major {
  top: 5px;
  width: 2px;
  height: 20px;
  background: #0f172ae6;
}
.image-overlay__ruler-label {
  position: absolute;
  top: 28px;
  transform: translate(-50%);
  color: #1e293be6;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.image-overlay__protractor {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  transform-origin: 50% 100%;
}
.image-overlay__protractor[hidden] {
  display: none !important;
}
.image-overlay__protractor-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.image-overlay__protractor-arc,
.image-overlay__protractor-baseline,
.image-overlay__protractor-tick,
.image-overlay__protractor-center {
  vector-effect: non-scaling-stroke;
}
.image-overlay__protractor-arc {
  fill: none;
  stroke: #2563ebb8;
  stroke-width: 1.45;
}
.image-overlay__protractor-baseline {
  stroke: #1e293b8f;
  stroke-width: 1.05;
}
.image-overlay__protractor-tick {
  stroke: #2563eb85;
  stroke-width: 0.8;
  stroke-linecap: round;
}
.image-overlay__protractor-tick--major {
  stroke: #2563ebd6;
  stroke-width: 1.05;
}
.image-overlay__protractor-label {
  fill: #1e293bd6;
  font-size: 5.3px;
  font-weight: 700;
  text-anchor: middle;
  dominant-baseline: middle;
}
.image-overlay__protractor-center {
  fill: #2563ebf0;
  stroke: #fff;
  stroke-width: 1.15;
}
.image-overlay__target,
.image-overlay__input-shell {
  position: absolute;
  box-sizing: border-box;
}
.image-overlay__target {
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  border-radius: 14px;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease,
    outline-color 0.16s ease;
}
.image-overlay__target-core {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}
.image-overlay__target:not(.image-overlay__target--checkbox):not(
    .image-overlay__target--circle
  )
  .image-overlay__target-core {
  border: 2px solid transparent;
  background: transparent;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease;
}
.image-overlay__target:not(.image-overlay__target--checkbox):not(
    .image-overlay__target--circle
  ):hover
  .image-overlay__target-core,
.image-overlay__target:not(.image-overlay__target--checkbox):not(
    .image-overlay__target--circle
  ):focus-visible
  .image-overlay__target-core {
  border-color: #2563eb57;
  box-shadow: 0 0 0 2px #2563eb14;
}
.image-overlay__target:not(.image-overlay__target--checkbox):not(
    .image-overlay__target--circle
  ).is-selected
  .image-overlay__target-core {
  border-color: #2563ebf5;
  background: #3b82f624;
  box-shadow: 0 0 0 2px #2563eb1a;
}
.image-overlay__target--polygon {
  border-radius: 0;
}
.image-overlay__target--polygon .image-overlay__target-core {
  inset: 0;
  border-radius: 0;
}
.image-overlay__target--checkbox {
  border-radius: 4px;
  overflow: visible;
}
.image-overlay__target--checkbox::before,
.image-overlay__target--circle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(100%, 24px);
  height: max(100%, 24px);
  transform: translate(-50%, -50%);
  pointer-events: auto;
}
.image-overlay__coordinate-hit-zone {
  position: absolute;
  z-index: 3;
  overflow: visible;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: crosshair;
}
.image-overlay__coordinate-hit-zone::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(100%, 24px);
  height: max(100%, 24px);
  transform: translate(-50%, -50%);
  pointer-events: auto;
}
.image-overlay__coordinate-hit-zone:focus-visible {
  outline: 3px solid #2563eb;
  outline-offset: 2px;
  background: #2563eb0d;
}
.image-overlay__target--checkbox .image-overlay__target-core {
  inset: 6%;
  border: 2px solid transparent;
  border-radius: 4px;
  background: transparent;
}
.image-overlay__target--checkbox .image-overlay__target-core:after {
  content: "";
  position: absolute;
  left: 34%;
  top: 10%;
  width: 24%;
  height: 52%;
  border-right: 0 solid transparent;
  border-bottom: 0 solid transparent;
  transform: rotate(45deg);
}
.image-overlay__target--checkbox:hover .image-overlay__target-core,
.image-overlay__target--checkbox:focus-visible .image-overlay__target-core {
  border-color: #2563eb61;
  box-shadow: 0 0 0 2px #2563eb14;
}
.image-overlay__target--checkbox.is-selected .image-overlay__target-core {
  border-color: #2563ebfa;
  background: #ffffffe6;
  box-shadow: 0 0 0 2px #2563eb1a;
}
.image-overlay__target--checkbox.is-selected .image-overlay__target-core:after {
  border-right: 3px solid rgba(37, 99, 235, 0.98);
  border-bottom: 3px solid rgba(37, 99, 235, 0.98);
}
.image-overlay__target--circle {
  border-radius: 999px;
  overflow: visible;
}
.image-overlay__target--circle .image-overlay__target-core {
  inset: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
}
.image-overlay__target--circle .image-overlay__target-core:before {
  content: "";
  position: absolute;
  inset: -12%;
  border: 2px solid transparent;
  border-radius: 999px;
  background: transparent;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease,
    inset 0.16s ease;
}
.image-overlay__target--circle:hover .image-overlay__target-core,
.image-overlay__target--circle:focus-visible .image-overlay__target-core {
  background: transparent;
  box-shadow: none;
}
.image-overlay__target--circle:hover .image-overlay__target-core:before,
.image-overlay__target--circle:focus-visible
  .image-overlay__target-core:before {
  border-color: #2563eb6b;
  box-shadow:
    0 0 0 1px #fffffff5,
    0 0 0 4px #2563eb1a;
}
.image-overlay__target--circle.is-selected .image-overlay__target-core {
  background: transparent;
  box-shadow: none;
}
.image-overlay__target--circle.is-selected .image-overlay__target-core:before {
  inset: -14%;
  border-color: #2563ebfa;
  box-shadow:
    0 0 0 1px #fffffffa,
    0 0 0 4px #2563eb2e;
}
[data-question-id="reasoning-2026-p2-v2-q16"]
  .image-overlay__target--circle
  .image-overlay__target-core {
  inset: 10% 18%;
}
[data-question-id="reasoning-2026-p2-v2-q16"]
  .image-overlay__target--circle
  .image-overlay__target-core:before,
[data-question-id="reasoning-2026-p2-v2-q16"]
  .image-overlay__target--circle.is-selected
  .image-overlay__target-core:before {
  inset: 0;
}
.image-overlay__target:hover,
.image-overlay__target:focus-visible {
  box-shadow: none;
}
.image-overlay__input-shell {
  display: block;
  z-index: 4;
  padding: 0;
  overflow: hidden;
  --image-overlay-input-reserve-left: 0%;
  --image-overlay-input-reserve-right: 0%;
  --image-overlay-input-reserve-top: 0%;
  --image-overlay-input-reserve-bottom: 0%;
  --image-overlay-input-text-align: center;
}
.image-overlay__fraction-bar {
  position: absolute;
  z-index: 3;
  display: block;
  height: var(--image-overlay-fraction-bar-thickness, 1.35px);
  min-height: 1px;
  border-radius: 999px;
  background: #0f172adb;
  pointer-events: none;
}
.image-overlay__input {
  display: block;
  width: calc(
    100% - var(--image-overlay-input-reserve-left, 0%) -
      var(--image-overlay-input-reserve-right, 0%)
  );
  height: calc(
    100% - var(--image-overlay-input-reserve-top, 0%) -
      var(--image-overlay-input-reserve-bottom, 0%)
  );
  max-width: 100%;
  max-height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  margin-inline-start: var(--image-overlay-input-reserve-left, 0%);
  margin-inline-end: var(--image-overlay-input-reserve-right, 0%);
  margin-block-start: var(--image-overlay-input-reserve-top, 0%);
  margin-block-end: var(--image-overlay-input-reserve-bottom, 0%);
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  border-radius: 3px;
  border: 1px solid rgba(37, 99, 235, 0.26);
  background: #ffffffeb;
  color: #0f172a;
  font: inherit;
  font-size: clamp(12px, 1.15vw, 17px);
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  text-align: var(--image-overlay-input-text-align, center);
  padding: 0 4px;
  padding-inline: 4px;
  padding-block: 0;
  box-shadow: none;
}
.image-overlay__input--compact {
  font-size: clamp(10px, 0.95vw, 15px);
  padding: 0 2px;
  padding-inline: 2px;
  padding-block: 0;
}
.image-overlay__input--micro {
  font-size: clamp(9px, 0.82vw, 13px);
  padding: 0 1px;
  padding-inline: 1px;
  padding-block: 0;
  letter-spacing: -0.02em;
}
.image-overlay__input--large {
  font-size: clamp(16px, 1.45vw, 22px);
  line-height: 1.08;
}
.image-overlay__input--line {
  border-radius: 0;
  border-width: 0 0 2px 0;
  border-color: #0f172a9e;
  background: transparent;
  box-shadow: none;
  padding-inline: 1px;
  text-align: var(--image-overlay-input-text-align, left);
}
.image-overlay__input--line:not(:focus) {
  border-color: #0f172a8a;
}
.image-overlay__input--line:focus {
  border-color: #2563ebf2;
  box-shadow: none;
}
.image-overlay__input:not(:focus) {
  border-color: #2563eb38;
}
.image-overlay__input:focus {
  outline: none;
  border-color: #2563ebf2;
  box-shadow: inset 0 0 0 1px #2563eb24;
}
.image-overlay__match-node {
  position: absolute;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  z-index: 3;
  overflow: visible;
}
.image-overlay__match-node:before {
  content: "";
  position: absolute;
  inset: -14px;
}
[data-image-match-hit-padding="0"] .image-overlay__match-node:before {
  inset: 0;
}
.image-overlay__match-node-core {
  position: absolute;
  inset: 0;
  border-radius: 2px;
  border: 1px solid transparent;
  background: transparent;
  pointer-events: none;
  overflow: visible;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease;
}
.image-overlay__match-node-core:after {
  content: "";
  position: absolute;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  border: 1.25px solid rgba(37, 99, 235, 0.42);
  background: #fffffff5;
  box-shadow: none;
  transform: translate(-50%, -50%);
}
.image-overlay__match-node--source .image-overlay__match-node-core:after {
  left: calc(100% + 1px);
}
.image-overlay__match-node--target .image-overlay__match-node-core:after {
  left: -1px;
}
.image-overlay__match-node--shared .image-overlay__match-node-core:after {
  left: 50%;
}
.image-overlay__match-node:hover .image-overlay__match-node-core,
.image-overlay__match-node:focus-visible .image-overlay__match-node-core {
  border-color: #2563eb29;
  box-shadow: none;
  background: transparent;
}
.image-overlay__match-node:hover .image-overlay__match-node-core:after,
.image-overlay__match-node:focus-visible .image-overlay__match-node-core:after {
  border-color: #2563ebb3;
  box-shadow: 0 0 0 2px #3b82f624;
}
.image-overlay__match-node.is-active .image-overlay__match-node-core {
  border-color: #2563eb2e;
  box-shadow: none;
  background: transparent;
}
.image-overlay__match-node.is-active .image-overlay__match-node-core:after,
.image-overlay__match-node.is-connected .image-overlay__match-node-core:after {
  border-color: #2563ebeb;
  background: #fffffffa;
  box-shadow: 0 0 0 2px #3b82f629;
}
.image-overlay__match-node.is-connected .image-overlay__match-node-core {
  border-color: transparent;
  background: transparent;
}
.image-overlay__connection-line--match {
  stroke-width: 0.54;
}
.runner-answer-panel-v2--image-text-boxes .visual-answer-shell__summary {
  min-height: 26px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .runner-answer-body-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .runner-answer-body-v2 {
  gap: 6px;
  padding-block: 8px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell {
  gap: 6px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell__helper,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell__helper {
  display: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell__support,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell__support {
  gap: 6px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell__summary,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2--image-text-boxes
  .visual-answer-shell__summary {
  min-height: 34px;
  padding: 7px 10px;
}
.public-band--compact {
  padding: 1.2rem 1.4rem;
}
.steps-grid--request-demo {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.visual-axis-label--number-line {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.01em;
}
.visual-axis-caption--number-line {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.015em;
}
.visual-card--number-line .visual-svg--number-line,
.runner-visual-panel-v2 .visual-card--number-line .visual-svg--number-line {
  width: min(100%, 900px);
  max-width: 900px;
}
.visual-hit--number-line {
  cursor: pointer;
}
.scene-label.visual-shape-label {
  paint-order: stroke;
  stroke: #ffffffe6;
  stroke-width: 6px;
  stroke-linejoin: round;
}
.runner-shell-v2[data-session-kind="competition"] .runner-question-stage-v2 {
  justify-items: center;
}
.runner-shell-v2[data-session-kind="competition"] .runner-prompt {
  width: min(100%, 980px);
  justify-items: center;
  text-align: center;
}
.runner-shell-v2[data-session-kind="competition"]
  :is(.runner-prompt__intro, .runner-prompt__context, .runner-prompt__detail) {
  text-align: center;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2.runner-question-panel--mode-compact-typed {
  min-height: clamp(320px, 42vh, 500px);
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-question-body-v2 {
  justify-items: stretch;
  align-content: center;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(2.8rem, 5vw, 4.8rem);
  line-height: 1.02;
  margin-inline: 0;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2:is(
    .runner-question-panel--mode-selection-grid,
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.9rem, 2.9vw, 3.2rem);
  margin-inline: 0;
}
.runner-shell-v2[data-session-kind="competition"] .runner-answer-stage-v2,
.runner-shell-v2[data-session-kind="competition"] .runner-answer-stack-v2 {
  width: min(100%, 880px);
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-answer-stack-v2
  :is(.field-label, .answer-label, label) {
  text-align: center;
}
.runner-header-v2__left,
.runner-status-v2__left {
  flex-wrap: wrap;
  gap: 10px;
}
.runner-header-pill-v2--status {
  background: color-mix(in srgb, var(--student-100) 84%, var(--bg-panel) 16%);
  border-color: color-mix(
    in srgb,
    var(--student-600) 24%,
    var(--line-default) 76%
  );
  color: var(--student-800);
}
.runner-shell-v2[data-session-kind="competition"] .runner-stage-v2 {
  grid-template-columns: minmax(0, 1.65fr) minmax(320px, 380px);
  gap: 24px;
  align-items: start;
}
.runner-shell-v2[data-session-kind="competition"] .runner-question-card-v2 {
  min-height: clamp(620px, 76vh, 920px);
  padding: 24px 26px;
  gap: 22px;
  border-radius: 30px;
}
.runner-shell-v2[data-session-kind="competition"] .runner-question-body-v2,
.runner-shell-v2[data-session-kind="competition"] .runner-question-stage-v2 {
  gap: 18px;
}
.runner-shell-v2[data-session-kind="competition"] .runner-question-stage-v2 {
  justify-items: stretch;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2
  .runner-prompt {
  width: min(100%, 980px);
  justify-items: center;
  text-align: center;
  margin-inline: auto;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2
  :is(.runner-prompt__intro, .runner-prompt__context, .runner-prompt__detail) {
  text-align: center;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(4.2rem, 6vw, 6.6rem);
  line-height: 0.96;
  margin-inline: 0;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-card-v2:is(
    .runner-question-panel--mode-selection-grid,
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice
  )
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(2.2rem, 3.3vw, 3.6rem);
}
.runner-shell-v2[data-session-kind="competition"] .runner-answer-panel-v2 {
  margin-top: 0;
}
.runner-shell-v2[data-session-kind="competition"] .runner-answer-stage-v2,
.runner-shell-v2[data-session-kind="competition"] .runner-answer-stack-v2 {
  width: min(100%, 1080px);
}
.runner-shell-v2[data-session-kind="competition"] .runner-side-rail-v2 {
  align-self: stretch;
}
.runner-shell-v2[data-session-kind="competition"]
  :is(.runner-rail-slot-v2--tools, [data-runner-tools-card]) {
  height: 100%;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-rail-card-v2--keyboard,
.runner-shell-v2[data-session-kind="competition"]
  .runner-rail-card-v2--tools-placeholder {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 16px;
  padding: 14px;
}
.runner-shell-v2[data-session-kind="competition"] .runner-rail-title-v2 {
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.runner-card-actions-v2 {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid var(--line-subtle);
}
.runner-shell-v2[data-session-kind="competition"] .runner-card-actions-v2 {
  padding-top: 20px;
}
.runner-card-actions-v2 .btn {
  min-height: 48px;
}
.runner-worked {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
  border-radius: var(--radius-3);
  border: 1px solid
    color-mix(in srgb, var(--brand-600) 22%, var(--line-default) 78%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 82%, var(--bg-panel) 18%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.runner-worked strong {
  font-size: 0.84rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.runner-worked ol,
.runner-worked-steps {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: 8px;
}
.runner-worked-steps li {
  padding-left: 2px;
}
.runner-worked-final {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-600) 18%, var(--line-default) 82%);
  background: color-mix(in srgb, var(--brand-100) 52%, white 48%);
}
.runner-worked-final__label {
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--brand-800);
}
.runner-worked-final__value {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-strong);
}
html[data-appearance="dark"] .runner-worked-final,
html[data-theme="dark"] .runner-worked-final,
body.theme-dark .runner-worked-final {
  border-color: color-mix(
    in srgb,
    var(--brand-400) 32%,
    var(--line-default) 68%
  );
  background: color-mix(in srgb, var(--brand-900) 78%, var(--bg-panel) 22%);
}
html[data-appearance="dark"] .runner-worked-final__label,
html[data-theme="dark"] .runner-worked-final__label,
body.theme-dark .runner-worked-final__label {
  color: var(--text-on-dark-soft);
}
html[data-appearance="dark"] .runner-worked-final__value,
html[data-theme="dark"] .runner-worked-final__value,
body.theme-dark .runner-worked-final__value {
  color: var(--text-on-dark-strong);
}
.runner-worked-visual,
.runner-worked-visual-steps {
  display: grid;
  gap: 10px;
}
.runner-worked-visual {
  padding: 12px;
  border-radius: var(--radius-3);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: color-mix(in srgb, var(--bg-panel) 86%, var(--brand-50) 14%);
}
.runner-worked-visual .visual-card {
  margin: 0;
}
.runner-worked-visual-steps {
  margin: 0;
  padding-left: 1.2rem;
}
.completion-kpi-card {
  text-align: center;
  align-content: center;
  justify-items: center;
  min-height: 140px;
}
.completion-kpi-card .label,
.completion-kpi-card .value {
  text-align: center;
}
.visual-line--series-1 {
  stroke: color-mix(in srgb, var(--student-700) 84%, white 16%);
  stroke-width: 4;
}
.visual-line--series-2 {
  stroke: color-mix(in srgb, var(--brand-700) 74%, white 26%);
  stroke-width: 4;
  stroke-dasharray: 10 7;
}
.visual-point-fill--series-1 {
  fill: color-mix(in srgb, var(--student-700) 84%, white 16%);
}
.visual-point-fill--series-2 {
  fill: color-mix(in srgb, var(--brand-700) 74%, white 26%);
}
.visual-axis-label--focus {
  fill: color-mix(in srgb, var(--text-strong) 92%, var(--brand-700) 8%);
  font-weight: 900;
}
.visual-bar--focus {
  fill: color-mix(in srgb, var(--student-500) 68%, white 32%);
  stroke: color-mix(in srgb, var(--student-700) 44%, white 56%);
  stroke-width: 2.5;
}
.visual-bar--solution {
  stroke: color-mix(in srgb, var(--brand-700) 80%, white 20%);
  stroke-width: 4;
}
.visual-point-fill--focus {
  stroke: color-mix(in srgb, var(--brand-500) 66%, white 34%);
  stroke-width: 3.5;
}
.visual-point-fill--solution {
  stroke: color-mix(in srgb, var(--brand-700) 78%, white 22%);
  stroke-width: 4.5;
}
.visual-chart-node {
  cursor: pointer;
  outline: none;
}
.visual-chart-hit {
  fill: transparent;
  stroke: transparent;
  pointer-events: all;
}
.visual-chart-readout__guide,
.visual-chart-readout__label {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.14s ease;
}
.visual-chart-readout__guide {
  stroke: color-mix(in srgb, var(--brand-600) 70%, white 30%);
  stroke-width: 2.1;
  stroke-dasharray: 6 6;
  fill: none;
}
.visual-chart-readout__label {
  fill: color-mix(in srgb, var(--text-strong) 90%, var(--brand-700) 10%);
  font-size: 13px;
  font-weight: 900;
  paint-order: stroke;
  stroke: color-mix(in srgb, white 88%, var(--bg-panel) 12%);
  stroke-width: 4px;
  stroke-linejoin: round;
}
.visual-chart-node:hover .visual-chart-readout__guide,
.visual-chart-node:hover .visual-chart-readout__label,
.visual-chart-node:focus .visual-chart-readout__guide,
.visual-chart-node:focus .visual-chart-readout__label,
.visual-chart-node:focus-visible .visual-chart-readout__guide,
.visual-chart-node:focus-visible .visual-chart-readout__label {
  opacity: 1;
}
.visual-chart-node:focus-visible .visual-chart-hit {
  stroke: color-mix(in srgb, var(--brand-500) 44%, white 56%);
  stroke-width: 2;
}
.visual-table__row--focus td,
.visual-table__cell--focus {
  background: color-mix(in srgb, var(--brand-50) 72%, white 28%);
}
.visual-solution-guide,
.scene-axis--solution,
.symmetry-axis {
  stroke: color-mix(in srgb, var(--brand-600) 82%, white 18%);
  stroke-width: 3.5;
  stroke-dasharray: 9 6;
  fill: none;
}
.visual-solution-ring {
  fill: #fff;
  stroke: color-mix(in srgb, var(--brand-600) 82%, white 18%);
  stroke-width: 4;
}
.visual-axis-label--solution {
  fill: color-mix(in srgb, var(--brand-700) 82%, black 18%);
  font-weight: 800;
}
.visual-line-legend text {
  font-weight: 800;
}
.visual-card--line-graph .visual-svg--chart {
  max-width: 100%;
}
.visual-card--number-line .visual-svg--number-line,
.runner-visual-panel-v2 .visual-card--number-line .visual-svg--number-line {
  width: min(100%, 1040px);
  max-width: 1040px;
}
.visual-axis-label--number-line {
  font-size: 20px;
}
.visual-axis-caption--number-line {
  font-size: 17px;
}
.visual-number-line-track {
  stroke-width: 4.8;
}
.visual-number-line-tick {
  stroke-width: 3.4;
}
.visual-hit--number-line {
  rx: 18px;
}
:root {
  --select-caret-glyph-color: #334568;
  --select-caret-slot-bg: color-mix(
    in srgb,
    var(--brand-100) 18%,
    var(--bg-panel) 82%
  );
  --select-caret-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.25 1.25L6 6l4.75-4.75' fill='none' stroke='%23334568' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
html[data-appearance="dark"],
html[data-theme="dark"],
body.theme-dark,
html[data-appearance="high-contrast"] {
  --select-caret-glyph-color: #f4f7ff;
  --select-caret-slot-bg: color-mix(
    in srgb,
    var(--bg-interactive) 84%,
    black 16%
  );
  --select-caret-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.25 1.25L6 6l4.75-4.75' fill='none' stroke='%23F4F7FF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
select:not([multiple]) {
  cursor: pointer;
  padding-right: 58px;
  background-image:
    var(--select-caret-icon),
    linear-gradient(
      to left,
      color-mix(in srgb, var(--brand-100) 18%, var(--bg-panel) 82%),
      color-mix(in srgb, var(--brand-100) 18%, var(--bg-panel) 82%)
    ),
    linear-gradient(
      to left,
      color-mix(in srgb, var(--line-default) 76%, transparent 24%),
      color-mix(in srgb, var(--line-default) 76%, transparent 24%)
    );
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 4px) 50%,
    calc(100% - 42px) 50%;
  background-size:
    12px 8px,
    38px calc(100% - 8px),
    1px calc(100% - 16px);
  background-repeat: no-repeat;
}
select:not([multiple]):hover {
  border-color: color-mix(
    in srgb,
    var(--brand-400) 30%,
    var(--line-default) 70%
  );
}
select:not([multiple]) {
  background-image:
    var(--select-caret-icon),
    linear-gradient(
      to left,
      var(--select-caret-slot-bg),
      var(--select-caret-slot-bg)
    ),
    linear-gradient(
      to left,
      color-mix(in srgb, var(--line-default) 76%, transparent 24%),
      color-mix(in srgb, var(--line-default) 76%, transparent 24%)
    );
}
select[multiple] {
  padding-right: 18px;
  background-image: none;
  cursor: default;
}
.portal-adult .adult-select-field,
.portal-adult .filter-bar label:has(select:not([multiple])),
.portal-public .auth-panel label:has(select:not([multiple])),
.student-auth-panel label:has(select:not([multiple])),
.section-rail label:has(select:not([multiple])),
.card-grid label:has(select:not([multiple])) {
  position: relative;
}
.portal-adult .adult-select-field:after,
.portal-adult .filter-bar label:has(select:not([multiple])):after,
.portal-public .auth-panel label:has(select:not([multiple])):after,
.student-auth-panel label:has(select:not([multiple])):after,
.section-rail label:has(select:not([multiple])):after,
.card-grid label:has(select:not([multiple])):after {
  content: "â–¾";
  position: absolute;
  right: 16px;
  bottom: 14px;
  z-index: 2;
  pointer-events: none;
  color: var(--select-caret-glyph-color);
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.18);
}
.portal-adult .adult-select-field:after,
.portal-adult .filter-bar label:has(select:not([multiple])):after,
.portal-public .auth-panel label:has(select:not([multiple])):after,
.student-auth-panel label:has(select:not([multiple])):after,
.section-rail label:has(select:not([multiple])):after,
.card-grid label:has(select:not([multiple])):after {
  content: none;
}
select::-ms-expand {
  display: none;
}
select option,
select optgroup {
  color: var(--text-strong);
  background: var(--bg-panel);
}
html[data-appearance="dark"] select,
html[data-appearance="high-contrast"] select {
  background-color: color-mix(in srgb, var(--bg-interactive) 84%, black 16%);
  color: var(--text-strong);
  border-color: color-mix(in srgb, var(--line-default) 82%, white 18%);
}
html[data-appearance="dark"] select option,
html[data-appearance="dark"] select optgroup,
html[data-appearance="high-contrast"] select option,
html[data-appearance="high-contrast"] select optgroup {
  background: color-mix(in srgb, var(--bg-panel-2) 88%, black 12%);
  color: var(--text-strong);
}
html[data-appearance="dark"] .student-side-nav__toggle,
html[data-appearance="dark"] .student-side-nav__link,
html[data-appearance="dark"] .student-side-nav {
  border-color: color-mix(in srgb, var(--line-default) 78%, white 22%);
}
@media (max-width: 1100px) {
  .runner-shell-v2[data-session-kind="competition"] .runner-stage-v2 {
    grid-template-columns: 1fr;
  }
  .runner-shell-v2[data-session-kind="competition"]
    .runner-question-card-v2
    .runner-prompt__main {
    max-width: 100%;
  }
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-question-head-v2--simple {
  padding-bottom: 4px;
}
.runner-shell-v2[data-session-kind="competition"] .runner-question-meta-v2 {
  font-size: 0.86rem;
  letter-spacing: 0.14em;
}
.runner-shell-v2[data-session-kind="competition"] .runner-question-stage-v2 {
  justify-items: stretch;
  align-content: start;
  gap: 24px;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-answer-stack-v2
  :is(.field-label, .answer-label, label) {
  text-align: center;
  font-size: 0.92rem;
  letter-spacing: 0;
}
.runner-shell-v2[data-session-kind="competition"] .runner-answer-stack-v2 input,
.runner-shell-v2[data-session-kind="competition"]
  .runner-answer-stack-v2
  textarea,
.runner-shell-v2[data-session-kind="competition"]
  .runner-answer-stack-v2
  [data-answer-input] {
  min-height: 84px;
  font-size: 2rem;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-rail-card-v2--keyboard,
.runner-shell-v2[data-session-kind="competition"]
  .runner-rail-card-v2--tools-placeholder {
  border-radius: 28px;
  padding: 18px;
}
.runner-shell-v2[data-session-kind="competition"]
  .runner-header-progress-value-v2 {
  font-size: 1rem;
}
.student-completion-card--refined {
  display: grid;
  gap: 18px;
  max-width: min(100%, 980px);
}
.student-completion-card--competition {
  gap: 12px;
  max-width: min(100%, 1060px);
  padding: 16px 18px;
}
.student-completion-card--competition .completion-page-header {
  align-items: center;
}
.student-completion-card--competition .completion-page-header h1 {
  font-size: clamp(1.75rem, 2.2vw, 2.35rem);
  line-height: 1.08;
}
.student-completion-card--competition .completion-page-summary {
  margin: 0;
  max-width: 68ch;
  line-height: 1.35;
}
.student-completion-card--competition .completion-kpi-grid {
  gap: 10px;
}
.student-completion-card--competition .completion-kpi-card {
  padding: 12px 14px;
  min-height: 0;
}
.student-completion-card--competition .completion-kpi-card .value {
  font-size: clamp(1.55rem, 2.5vw, 2.1rem);
  line-height: 1.02;
}
.student-completion-card--competition .completion-overview--competition {
  gap: 10px;
}
.student-completion-card--competition .completion-hero-card {
  gap: 12px;
  padding: 14px 16px;
}
.student-completion-card--competition .completion-hero-card__header,
.student-completion-card--competition .completion-hero-card__body,
.student-completion-card--competition .completion-hero-card__meta {
  gap: 12px;
}
.student-completion-card--competition .completion-hero-card__score-wrap {
  min-width: 150px;
  padding: 12px 14px;
}
.student-completion-card--competition .completion-hero-card__score {
  font-size: clamp(2.2rem, 4vw, 3.1rem);
}
.student-completion-card--competition .completion-hero-card__summary {
  gap: 8px;
}
.student-completion-card--competition .completion-actions {
  margin-top: 0;
}
.student-completion-card--competition .completion-actions--primary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.student-completion-card--competition .completion-actions--primary .btn {
  min-width: 0;
  min-height: 42px;
  padding: 8px 10px;
}
.completion-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.completion-page-header__meta {
  white-space: nowrap;
  padding-top: 4px;
}
.completion-page-summary {
  max-width: 72ch;
  margin-top: -6px;
}
.completion-overview {
  display: grid;
  gap: 16px;
}
.completion-hero-card {
  display: grid;
  gap: 18px;
  padding: 20px 22px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 12%, var(--line-default) 88%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 72%, var(--bg-panel) 28%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.completion-hero-card__header,
.completion-hero-card__body,
.completion-hero-card__meta {
  display: flex;
  align-items: center;
  gap: 16px;
}
.completion-hero-card__header {
  justify-content: space-between;
}
.completion-hero-card__body {
  align-items: stretch;
}
.completion-hero-card__score-wrap {
  min-width: 180px;
  padding: 16px 18px;
  border-radius: var(--radius-3);
  background: color-mix(in srgb, var(--bg-panel) 82%, white 18%);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 12%, var(--line-subtle) 88%);
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 6px;
}
.completion-hero-card__score {
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  line-height: 0.95;
  font-weight: 900;
  color: var(--brand-700);
}
.completion-hero-card__score-label {
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.completion-hero-card__summary {
  display: grid;
  gap: 10px;
  flex: 1;
}
.completion-hero-card__summary h3,
.completion-hero-card__header h2 {
  margin: 0;
}
.completion-hero-card__meta {
  flex-wrap: wrap;
}
.completion-hero-card__meta-item {
  display: grid;
  gap: 4px;
  min-width: 140px;
}
.completion-hero-card__meta-item span {
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.completion-hero-card__meta-item strong {
  font-size: 1.1rem;
  color: var(--text-strong);
}
.completion-kpi-grid {
  align-items: stretch;
}
.completion-kpi-grid--compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.completion-kpi-card {
  text-align: left;
  align-content: start;
  justify-items: start;
  min-height: 0;
  padding: 18px;
}
.completion-kpi-card .label,
.completion-kpi-card .value {
  text-align: left;
}
.completion-actions {
  margin-top: 4px;
}
.completion-actions--primary {
  justify-content: flex-start;
}
.completion-actions--secondary {
  margin-top: -8px;
}
.student-feedback-card--compact {
  gap: 12px;
  padding: 18px;
}
.student-feedback-card--compact h2 {
  margin: 0;
}
@media (max-width: 980px) {
  .completion-kpi-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .completion-page-header,
  .completion-hero-card__header,
  .completion-hero-card__body {
    flex-direction: column;
    align-items: flex-start;
  }
  .completion-page-header__meta {
    white-space: normal;
    padding-top: 0;
  }
  .completion-hero-card__score-wrap {
    width: 100%;
    min-width: 0;
  }
  .completion-kpi-grid--compact {
    grid-template-columns: 1fr;
  }
  .student-completion-card--competition {
    padding: 14px;
    gap: 10px;
  }
  .student-completion-card--competition .completion-page-header h1 {
    font-size: clamp(1.55rem, 7vw, 2rem);
  }
  .student-completion-card--competition .completion-kpi-card {
    padding: 11px 12px;
  }
  .student-completion-card--competition .completion-hero-card {
    padding: 13px;
  }
  .student-completion-card--competition .completion-actions--primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .runner-actions-v2--competition {
    align-items: stretch;
  }
  .runner-actions-v2__group,
  .runner-actions-v2__group--danger {
    width: 100%;
    margin-left: 0;
  }
  .runner-actions-v2__group--utility,
  .runner-actions-v2__inline {
    grid-template-columns: 1fr;
  }
  .runner-actions-v2--competition
    .btn:is(
      [data-runner-fullscreen-toggle],
      [data-runner-pause],
      [data-runner-cancel]
    ) {
    flex: 1 1 160px;
  }
}
.student-portal-columns-2-1 {
  grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
}
.layout-split--compact {
  gap: 16px;
}
.student-licence-card {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 18px 20px;
  border-radius: 24px;
  border: 1px solid rgba(27, 42, 68, 0.12);
  background:
    linear-gradient(135deg, #ffffffc7, #ffffff9e),
    radial-gradient(
      circle at top right,
      rgba(90, 140, 255, 0.16),
      transparent 42%
    ),
    linear-gradient(180deg, #e8dfc8b8, #ffffffe6);
  box-shadow: 0 22px 46px #1b2a441a;
}
.student-shell--playful,
.student-shell--playful :is(button, input, select, textarea) {
  font-family:
    Avenir Next Rounded,
    Nunito,
    Quicksand,
    Segoe UI,
    system-ui,
    sans-serif;
}
.student-shell--playful .student-card,
.student-shell--playful .student-licence-card {
  box-shadow: 0 10px 24px #1b2a440d;
}
.student-licence-card--football {
  background:
    linear-gradient(135deg, #ffffffd1, #ffffffa8),
    radial-gradient(
      circle at top right,
      rgba(50, 156, 111, 0.18),
      transparent 42%
    ),
    linear-gradient(180deg, #e8dfc8b8, #ffffffeb);
}
.student-licence-card__hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.85fr);
  gap: 18px;
  align-items: end;
}
.student-licence-card__copy h1 {
  margin: 6px 0 4px;
  font-size: clamp(1.5rem, 2.4vw, 2.1rem);
  line-height: 1.05;
}
.student-licence-card__level-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}
.student-level-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 120px;
  padding: 10px 12px;
  border-radius: 18px;
  background: #1b2a4414;
  border: 1px solid rgba(27, 42, 68, 0.12);
}
.student-level-badge--football {
  background: #329c6f1a;
  border-color: #329c6f2e;
}
.student-level-badge__icon {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  font-size: 1.05rem;
  background: #ffffffad;
}
.student-level-badge__token {
  font-weight: 800;
  letter-spacing: 0.06em;
}
.student-level-badge__copy {
  display: grid;
  gap: 1px;
}
.student-level-badge__copy strong {
  font-size: 0.88rem;
  line-height: 1.1;
}
.student-level-badge__copy small {
  font-size: 0.68rem;
  color: #1b2a44b8;
}
.student-level-badge--locked {
  opacity: 0.82;
  background: #ffffff70;
}
.student-level-badge--locked .student-level-badge__icon {
  background: #1b2a4414;
}
.student-level-copy {
  display: grid;
  gap: 2px;
}
.student-level-copy strong {
  font-size: 1rem;
}
.student-theme-switch {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}
.student-licence-card__meter {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-radius: 18px;
  background: #ffffff9e;
  border: 1px solid rgba(27, 42, 68, 0.1);
}
.student-licence-card__meter-head,
.student-licence-card__meter-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
.student-licence-card__meter-head strong {
  font-size: 1.1rem;
}
.student-progress-track {
  position: relative;
  height: 12px;
  border-radius: 999px;
  overflow: visible;
  background: #1b2a441a;
}
.student-progress-track > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #5a8cfff2, #1b2a44d1);
}
.student-progress-track__marker {
  position: absolute;
  top: -16px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  font-size: 1rem;
  border-radius: 999px;
  background: #fffffff5;
  border: 1px solid rgba(27, 42, 68, 0.1);
  box-shadow: 0 10px 18px #1b2a441a;
}
.student-licence-card--football .student-progress-track > span {
  background: linear-gradient(90deg, #329c6ff5, #1b2a44db);
}
.student-metric-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 10px;
}
.student-metric-chip {
  position: relative;
  display: grid;
  gap: 3px;
  padding: 12px 13px;
  min-height: 92px;
  border-radius: 18px;
  background: #ffffffbd;
  border: 1px solid rgba(27, 42, 68, 0.08);
}
.student-metric-chip--emphasis {
  background: #5a8cff14;
}
.student-metric-chip__icon {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #ffffffc2;
  font-size: 0.92rem;
}
.student-metric-chip--mission {
  background: linear-gradient(180deg, #5a8cff1a, #ffffffd1);
}
.student-metric-chip--success {
  background: linear-gradient(180deg, #50ba741f, #ffffffd1);
}
.student-metric-chip--energy {
  background: linear-gradient(180deg, #ffb34729, #ffffffd1);
}
.student-metric-chip__label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #1b2a44b8;
}
.student-metric-chip__value {
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.15;
}
.student-metric-chip__meta {
  font-size: 0.78rem;
  color: #1b2a44b8;
}
.student-card--compact {
  padding: 16px 18px;
}
.student-action-stack,
.student-compact-list {
  display: grid;
  gap: 10px;
}
.student-action-row,
.student-compact-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: #ffffff8f;
}
.student-action-row[hidden],
.student-compact-row[hidden],
.student-compact-row.is-filter-hidden,
.inline-notice[hidden] {
  display: none !important;
}
.student-action-row__copy,
.student-compact-row__main {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.student-compact-row__main strong,
.student-action-row__copy strong {
  line-height: 1.2;
}
.student-compact-row__meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.student-compact-row__meta--stack {
  display: grid;
  justify-items: end;
}
.student-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #1b2a4414;
  border: 1px solid rgba(27, 42, 68, 0.08);
  font-size: 0.76rem;
  font-weight: 700;
  color: #1b2a44db;
}
.student-pill--accent {
  background: #5a8cff1f;
}
.student-badge-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.student-badge-chip {
  display: inline-grid;
  gap: 2px;
  min-width: 148px;
  padding: 10px 12px;
  border-radius: 16px;
  background: #ffffff9e;
  border: 1px solid rgba(27, 42, 68, 0.08);
  font-size: 0.84rem;
}
.student-badge-chip span {
  color: #1b2a44b8;
  font-size: 0.75rem;
}
.student-inline-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.student-home-assigned-actions {
  justify-content: flex-start;
}
.student-home-mission__card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: linear-gradient(135deg, #a9d8ff7a, #fffffff0);
}
.student-home-mission__card--empty {
  background: linear-gradient(135deg, #1b2a440a, #fffffff0);
}
.student-home-mission__copy {
  display: grid;
  gap: 6px;
}
.student-home-mission__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #1b2a44c7;
}
.student-home-mission__icon {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #ffffffc2;
}
.student-home-mission__copy strong {
  font-size: 1.22rem;
  line-height: 1.15;
}
.student-home-mission__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.student-home-mission__cta {
  min-width: 156px;
  min-height: 50px;
  justify-content: center;
  font-size: 1rem;
}
.student-home-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.student-home-choice {
  display: grid;
  gap: 8px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: #ffffffbd;
}
.student-home-choice__icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: #5a8cff1f;
  font-size: 1.1rem;
}
.student-home-choice--primary {
  background: linear-gradient(180deg, #5a8cff1f, #ffffffd1);
}
.student-home-choice .btn {
  justify-self: start;
  min-height: 46px;
  padding-inline: 16px;
}
.student-home-cheer {
  background: linear-gradient(180deg, #fffffff0, #ffc1541a);
}
.student-home-progress-strip .student-metric-chip {
  min-height: 94px;
}
.student-home-summary-links {
  margin-top: 0;
}
.student-home-summary-links .btn {
  min-width: 144px;
  min-height: 46px;
  justify-content: center;
}
.student-badge-chip--celebrate {
  background: linear-gradient(180deg, #ffdd7347, #ffffffe0);
}
.student-task-row__title {
  display: flex;
  align-items: center;
  gap: 10px;
}
.student-task-row__icon {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: #5a8cff1f;
  font-size: 1rem;
}
.student-task-row--challenge .student-task-row__icon {
  background: #f7bd462e;
}
.student-task-row--bookwork .student-task-row__icon {
  background: #50ba7424;
}
.student-form-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-form-grid--compact label {
  display: grid;
  gap: 6px;
}
.student-form-grid--compact :is(select, input, textarea) {
  min-height: 42px;
}
.student-segmented {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}
.student-segmented__button {
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(27, 42, 68, 0.12);
  background: #ffffffd6;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.student-segmented__button.is-active {
  background: #1b2a44e6;
  color: #fff;
  border-color: #1b2a44e6;
}
.student-recommended-pack {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  margin: 0 0 14px;
  border-radius: 18px;
  background: #5a8cff14;
  border: 1px solid rgba(90, 140, 255, 0.14);
}
.student-card .student-card {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.student-completion-card--refined {
  padding: 18px 20px;
}
.completion-actions--primary .btn,
.completion-actions--secondary .btn {
  min-height: 40px;
}
@media (max-width: 1100px) {
  .student-licence-card__hero,
  .student-portal-columns-2-1,
  .student-recommended-pack {
    grid-template-columns: 1fr;
  }
  .student-theme-switch {
    margin-left: 0;
  }
}
@media (max-width: 720px) {
  .student-licence-card,
  .student-card--compact {
    padding: 14px;
  }
  .student-action-row,
  .student-compact-row {
    grid-template-columns: 1fr;
  }
  .student-compact-row__meta,
  .student-compact-row__meta--stack,
  .student-licence-card__meter-head,
  .student-licence-card__meter-foot {
    justify-content: flex-start;
  }
  .student-form-grid {
    grid-template-columns: 1fr;
  }
}
html[data-appearance="dark"] .student-licence-card,
body.theme-dark .student-licence-card {
  background:
    linear-gradient(135deg, #152135f5, #0c172af5),
    radial-gradient(
      circle at top right,
      rgba(90, 140, 255, 0.2),
      transparent 42%
    );
  border-color: #ffffff14;
}
html[data-appearance="dark"] .student-licence-card--football,
body.theme-dark .student-licence-card--football {
  background:
    linear-gradient(135deg, #152135f5, #0c172af5),
    radial-gradient(
      circle at top right,
      rgba(50, 156, 111, 0.22),
      transparent 42%
    );
}
.student-licence-card__hero {
  position: relative;
}
.student-licence-card__copy,
.student-licence-card__meter {
  position: relative;
  z-index: 1;
}
.student-licence-card:before,
.student-licence-card:after {
  content: "";
  position: absolute;
  inset: auto auto 18px 18px;
  width: 78px;
  height: 36px;
  border-radius: 999px;
  background: #ffffff57;
  filter: blur(0.5px);
  pointer-events: none;
}
.student-licence-card:after {
  left: auto;
  right: 24px;
  top: 20px;
  width: 96px;
  height: 42px;
}
.student-shell--playful .student-side-nav__link {
  min-height: 48px;
  border-radius: 16px;
}
.student-shell--playful .student-side-nav__link span {
  font-weight: 700;
}
@media (max-width: 900px) {
  .student-level-badge {
    min-width: 0;
  }
  .student-home-mission__card {
    grid-template-columns: 1fr;
  }
  .student-home-mission__cta {
    width: 100%;
  }
}
html[data-appearance="dark"]
  :is(
    .student-metric-chip,
    .student-action-row,
    .student-compact-row,
    .student-level-badge,
    .student-licence-card__meter,
    .student-badge-chip,
    .student-recommended-pack
  ),
body.theme-dark
  :is(
    .student-metric-chip,
    .student-action-row,
    .student-compact-row,
    .student-level-badge,
    .student-licence-card__meter,
    .student-badge-chip,
    .student-recommended-pack
  ) {
  background: #ffffff0d;
  border-color: #ffffff14;
}
html[data-appearance="dark"] .student-segmented__button,
body.theme-dark .student-segmented__button {
  background: #ffffff0f;
  border-color: #ffffff1a;
}
html[data-appearance="dark"] .student-segmented__button.is-active,
body.theme-dark .student-segmented__button.is-active {
  background: #ffffffeb;
  color: #102038;
}
.mp-topbar__inner {
  padding-left: max(16px, env(safe-area-inset-left));
  padding-right: max(16px, env(safe-area-inset-right));
}
.mp-topbar__left,
.mp-topbar__center,
.mp-topbar__right,
.mp-topbar__utility-pill,
.mp-tool-group,
.mp-public-auth-actions,
.section-header,
.quick-action-row,
.header-action-stack,
.button-row,
.tabs,
.tab-strip,
.data-item,
.card,
.section-surface,
.section-surface--nested,
label {
  min-width: 0;
}
.mp-topbar__right,
.mp-topbar__utility-pill,
.mp-tool-group,
.mp-public-auth-actions {
  flex-wrap: wrap;
}
.mp-command {
  max-width: 100%;
  min-width: 0;
}
.mp-command span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topbar-brand-image,
.mp-topbar__brand img {
  max-width: min(240px, 100%);
  height: clamp(42px, calc(var(--header-height) - 10px), 72px);
}
.tab-button,
.pill,
.nav-pill,
.btn,
.button-row button,
.button-row a {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
input,
select,
textarea,
button,
.btn,
.tab-button,
.option-chip,
.data-item,
.section-header > *,
.button-row > * {
  max-width: 100%;
}
.card-grid,
.card-grid > *,
.data-list,
.data-list > *,
.multi-field-grid,
.multi-field-grid > * {
  min-width: 0;
}
.student-page-content--runner .runner-shell-v2,
:is(
    html[data-font-level="1"],
    html[data-font-level="2"],
    html[data-font-level="3"]
  )
  .student-page-content--runner
  .runner-shell-v2 {
  min-height: auto;
}
:is(
    html[data-font-level="1"],
    html[data-font-level="2"],
    html[data-font-level="3"]
  )
  :is(
    .student-page-content--runner .runner-shell-v2,
    .runner-question-card-v2
  ) {
  height: auto;
  max-height: none;
  overflow: visible;
}
:is(
    html[data-font-level="1"],
    html[data-font-level="2"],
    html[data-font-level="3"]
  )
  .runner-stage-v2 {
  grid-template-columns: 1fr;
}
:is(
    html[data-font-level="1"],
    html[data-font-level="2"],
    html[data-font-level="3"]
  )
  .runner-side-rail-v2 {
  position: static;
  grid-template-columns: 1fr;
  overflow: visible;
}
:is(
    html[data-font-level="1"],
    html[data-font-level="2"],
    html[data-font-level="3"]
  )
  :is(.runner-question-body-v2, .runner-visual-panel-v2) {
  overflow: visible;
  max-height: none;
}
:is(html[data-font-level="2"], html[data-font-level="3"])
  .runner-question-card-v2
  .runner-question-stage-v2
  > .runner-prompt {
  position: static;
}
@media (max-width: 900px) and (max-height: 960px) {
  .student-page-content--runner .runner-shell-v2 {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .student-page-content--runner .runner-stage-v2 {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
  }
  .student-page-content--runner .runner-question-card-v2 {
    height: auto;
    min-height: var(--runner-mobile-question-h);
    max-height: none;
    overflow: visible;
  }
  .student-page-content--runner .runner-question-body-v2 {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .student-page-content--runner .runner-visual-panel-v2 {
    max-height: none;
    overflow: visible;
  }
  .runner-side-rail-v2 {
    position: static;
    grid-template-columns: 1fr;
    overflow: visible;
  }
}
@media (max-width: 1100px) {
  .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    row-gap: 10px;
  }
  .mp-topbar__left,
  .mp-topbar__center,
  .mp-topbar__right {
    width: 100%;
    justify-content: flex-start;
  }
  .mp-topbar__utility-pill {
    width: 100%;
    justify-content: space-between;
  }
  .mp-command {
    justify-content: flex-start;
  }
}
@media (max-width: 760px) {
  .mp-topbar__inner {
    border-radius: 0 0 20px 20px;
    padding-top: 8px;
    padding-bottom: 10px;
  }
  .topbar-brand-image,
  .mp-topbar__brand img {
    max-width: min(200px, 100%);
    height: clamp(36px, 9vw, 48px);
  }
  .mp-topbar__utility-pill,
  .mp-topbar__right,
  .mp-public-auth-actions,
  .quick-action-row,
  .header-action-stack,
  .section-header,
  .button-row,
  .tabs,
  .tab-strip {
    width: 100%;
    justify-content: flex-start;
  }
  .mp-topbar__utility-pill {
    gap: 8px;
    align-items: center;
  }
  .mp-tool-group {
    gap: 8px;
  }
  .mp-command {
    min-height: 48px;
    padding-inline: 12px;
  }
  .mp-command span {
    white-space: normal;
    text-overflow: clip;
  }
  .mp-public-auth-actions .mp-inline-link--button,
  .button-row > .btn,
  .button-row > a,
  .button-row > button,
  .tabs > .tab-button,
  .tab-strip > .tab-button {
    flex: 1 1 220px;
  }
  .card-grid,
  .card-grid.three,
  .card-grid.four,
  .dashboard-kpi-grid,
  .account-grid,
  .multi-field-grid.two,
  .multi-field-grid.three {
    grid-template-columns: 1fr;
  }
  .data-item {
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: start;
  }
}
@media (max-width: 420px) {
  .mp-topbar__inner {
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
  }
  .mp-language-menu summary,
  .mp-topbar__control,
  .mp-profile-trigger {
    min-width: 44px;
    min-height: 44px;
  }
  .mp-profile-trigger__avatar {
    width: 44px;
    height: 44px;
  }
}
@media (max-width: 760px) {
  .mp-topbar {
    padding-top: max(0px, env(safe-area-inset-top));
  }
  .portal-public .mp-topbar {
    padding-left: max(var(--site-gutter), env(safe-area-inset-left));
    padding-right: max(var(--site-gutter), env(safe-area-inset-right));
  }
  .portal-public .mp-topbar__inner {
    width: 100%;
    max-width: none;
  }
  .mp-topbar__inner {
    min-height: auto;
    width: min(
      100%,
      calc(
        100vw - max(12px, env(safe-area-inset-left)) -
          max(12px, env(safe-area-inset-right))
      )
    );
    padding: max(10px, env(safe-area-inset-top))
      max(12px, env(safe-area-inset-right)) 12px
      max(12px, env(safe-area-inset-left));
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "left right" "center center";
    align-items: start;
    row-gap: 10px;
    column-gap: 10px;
    border-radius: 0 0 20px 20px;
    transform: none;
  }
  .mp-topbar__left {
    grid-area: left;
    min-width: 0;
    align-self: center;
  }
  .mp-topbar__center {
    grid-area: center;
    width: 100%;
    min-width: 0;
    justify-content: stretch;
  }
  .mp-topbar__center:empty {
    display: none;
  }
  .mp-topbar__right {
    grid-area: right;
    width: auto;
    min-height: auto;
    align-self: start;
    justify-self: end;
    gap: 8px;
  }
  .mp-topbar__right--signed-in .mp-topbar__utility-pill,
  .mp-topbar__right--signed-out .mp-topbar__utility-pill {
    width: auto;
    min-height: auto;
    justify-content: flex-end;
    gap: 6px;
  }
  .mp-tool-group {
    min-height: auto;
    gap: 6px;
  }
  .mp-public-auth-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .mp-public-auth-actions .mp-inline-link--button {
    width: 100%;
    min-height: 46px;
    justify-content: center;
    text-align: center;
  }
  .mp-command {
    width: 100%;
    min-height: 48px;
    justify-content: flex-start;
    padding-inline: 12px;
  }
  .mp-command span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    text-overflow: clip;
  }
  .mp-command kbd {
    flex: 0 0 auto;
  }
  :is(.topbar-brand-image, .mp-topbar__brand img) {
    max-width: min(190px, 100%);
    height: clamp(34px, 8vw, 42px);
  }
  :is(.mp-profile-trigger, .mp-language-menu summary, .mp-topbar__control) {
    min-width: 44px;
    min-height: 44px;
  }
  .mp-profile-trigger__avatar {
    width: 44px;
    height: 44px;
  }
  .public-shell,
  .page-shell,
  .app-shell,
  .student-shell__body,
  .student-shell__body--with-nav {
    padding-top: 14px;
  }
  .auth-panel--tabbed {
    padding-top: 20px;
  }
}
@media (max-width: 560px) {
  .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "left" "right" "center";
  }
  .mp-topbar__right,
  .mp-topbar__right--signed-in,
  .mp-topbar__right--signed-out {
    width: 100%;
    justify-self: stretch;
    min-height: auto;
  }
  .mp-topbar__right--signed-in {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 10px;
  }
  .mp-topbar__right--signed-in .mp-topbar__utility-pill {
    justify-content: flex-start;
  }
  .mp-topbar__right--signed-out {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 8px;
  }
  .mp-topbar__right--signed-out .mp-topbar__utility-pill {
    justify-content: flex-start;
  }
  .mp-public-auth-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mp-language-menu__panel,
  .mp-profile-menu__panel {
    right: auto;
    left: 0;
    max-width: min(92vw, 20rem);
  }
}
@media (max-width: 420px) {
  .mp-topbar__inner {
    row-gap: 8px;
  }
  .mp-topbar--student-dashboard .mp-topbar__inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "left center right";
    row-gap: 0;
    column-gap: 6px;
    padding-inline: 6px;
  }
  .mp-topbar--student-dashboard .mp-topbar__brand img,
  .mp-topbar--student-dashboard .topbar-brand-image {
    max-width: min(124px, 100%);
    height: 22px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-strip {
    gap: 4px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-chip {
    padding: 4px 6px;
    gap: 4px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-icon {
    width: 20px;
    height: 20px;
    font-size: 0.72rem;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-value-compact {
    font-size: 0.8rem;
  }
  .topbar-brand-image,
  .mp-topbar__brand img {
    max-width: min(168px, 100%);
    height: 36px;
  }
  .mp-public-auth-actions {
    grid-template-columns: 1fr;
  }
  .mp-command kbd {
    display: none;
  }
}
:root {
  --safe-area-top: env(safe-area-inset-top, 0px);
  --safe-area-right: env(safe-area-inset-right, 0px);
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --safe-area-left: env(safe-area-inset-left, 0px);
  --app-vh: 100dvh;
  --app-vw: 100vw;
  --app-height: var(--app-vh);
  --keyboard-offset: 0px;
  --student-mobile-nav-height: 0px;
  --student-mobile-nav-gap: 0px;
  --student-mobile-bottom-clearance: calc(
    var(--student-mobile-nav-height) + var(--student-mobile-nav-gap) +
      var(--safe-area-bottom)
  );
}
html,
body {
  min-height: 100%;
}
body,
#appRoot {
  min-height: var(--app-height);
}
.utility-strip,
.public-header,
.app-topbar,
.student-topbar,
.mp-topbar {
  padding-top: var(--safe-area-top);
}
.public-header__inner,
.app-topbar__inner,
.student-topbar__inner,
.mp-topbar__inner {
  min-height: calc(var(--header-height) + var(--safe-area-top));
}
.student-shell,
.student-shell__body,
.student-page-content,
.student-page-content--runner,
.app-shell {
  min-height: max(0px, calc(var(--app-height) - var(--safe-area-top)));
}
.student-page-content--runner {
  min-height: calc(
    var(--app-height) - var(--header-height) - var(--safe-area-top) -
      var(--space-4) - var(--keyboard-offset)
  );
  padding-bottom: max(
    var(--space-4),
    calc(
      var(--keyboard-offset) +
        max(var(--safe-area-bottom), var(--student-mobile-bottom-clearance))
    )
  );
  scroll-padding-bottom: calc(var(--student-mobile-bottom-clearance) + 24px);
}
.student-page-content--runner .runner-shell-v2 {
  height: calc(
    var(--app-height) - var(--header-height) - var(--safe-area-top) - 28px -
      var(--keyboard-offset)
  );
  max-height: calc(
    var(--app-height) - var(--header-height) - var(--safe-area-top) - 28px -
      var(--keyboard-offset)
  );
}
body.keyboard-open .student-page-content--runner .runner-shell-v2 {
  height: auto;
  min-height: calc(
    var(--app-height) - var(--header-height) - var(--safe-area-top) - 28px -
      var(--keyboard-offset)
  );
  max-height: none;
}
body.keyboard-open .runner-shell-v2,
body.keyboard-open .runner-stage-v2,
body.keyboard-open .runner-question-card-v2 {
  overflow: visible;
}
body.keyboard-open .runner-answer-panel-v2,
body.keyboard-open .runner-side-rail-v2 {
  scroll-margin-bottom: calc(var(--keyboard-offset) + 32px);
}
body.keyboard-open .runner-side-rail-v2 {
  position: sticky;
  bottom: max(12px, calc(var(--keyboard-offset) + var(--safe-area-bottom)));
}
.runner-shell [readonly][data-runner-keyboard-target],
.runner-shell-v2 [readonly][data-runner-keyboard-target] {
  caret-color: transparent;
}
@media (max-width: 1180px) {
  .mp-topbar__inner,
  .public-header__inner,
  .student-topbar__inner,
  .app-topbar__inner {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 10px;
  }
  .mp-topbar__left,
  .mp-topbar__center,
  .mp-topbar__right {
    justify-content: flex-start;
  }
  .mp-topbar__right {
    justify-self: stretch;
    flex-wrap: wrap;
  }
  .mp-topbar__utility-pill,
  .mp-public-auth-actions,
  .button-row,
  .tabs,
  .scope-switcher {
    flex-wrap: wrap;
  }
}
@media (max-width: 820px) {
  .dashboard-kpi-grid,
  .card-grid.three,
  .layout-split,
  .student-portal-columns-2-1,
  .student-form-grid,
  .assignment-form-grid {
    grid-template-columns: 1fr;
  }
  .curriculum-table-wrap,
  .table-wrap {
    overflow-x: auto;
  }
  .mp-topbar__inner {
    border-radius: 0 0 18px 18px;
  }
  .topbar-brand-image,
  .mp-topbar__brand img {
    height: clamp(42px, calc(var(--header-height) - 18px), 56px);
    max-height: clamp(42px, calc(var(--header-height) - 18px), 56px);
  }
}
@media (max-width: 640px) {
  :root {
    --header-height: 64px;
  }
  .student-shell__body,
  .app-shell__body {
    padding-inline: max(12px, var(--safe-area-left))
      max(12px, var(--safe-area-right));
    padding-bottom: max(16px, var(--safe-area-bottom));
  }
  .mp-topbar__inner {
    width: calc(
      100% - max(0px, var(--safe-area-left)) - max(0px, var(--safe-area-right))
    );
    padding-inline: 14px;
  }
  .mp-public-auth-actions,
  .mp-topbar__right,
  .mp-tool-group {
    width: 100%;
  }
  .mp-public-auth-actions .mp-inline-link--button,
  .mp-public-auth-actions .mp-inline-link--strong {
    flex: 1 1 auto;
    justify-content: center;
  }
  .runner-actions-v2__group,
  .runner-actions-v2__inline,
  .runner-status-v2__left,
  .runner-status-v2__right,
  .runner-header-v2__left,
  .runner-header-v2__right {
    width: 100%;
    justify-content: space-between;
  }
}
.h-full {
  height: 100%;
}
.flex {
  display: flex;
}
.flex-col {
  flex-direction: column;
}
.grid {
  display: grid;
}
.gap-5 {
  gap: 1.25rem;
}
.gap-8 {
  gap: 2rem;
}
.items-center {
  align-items: center;
}
.auto-rows-fr {
  grid-auto-rows: minmax(0, 1fr);
}
@media (min-width: 768px) {
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (min-width: 1280px) {
  .xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl\:grid-cols-\[minmax\(0\,1\.02fr\)_minmax\(360px\,\.98fr\)\] {
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.98fr);
  }
}
.student-shell__body,
.student-profile-page {
  display: grid;
  gap: 20px;
}
.student-portal-columns-2-1 {
  grid-template-columns: minmax(0, 1.5fr) minmax(320px, 1fr);
}
.layout-split--compact {
  gap: 20px;
}
.student-card,
.student-licence-card {
  display: grid;
  gap: 16px;
}
.student-licence-card__hero {
  align-items: start;
  gap: 20px;
  grid-template-columns: minmax(0, 1.55fr) minmax(320px, 0.95fr);
}
.student-licence-card__title-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}
.student-hero-avatar {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  font-size: 1.9rem;
  background: linear-gradient(180deg, #5a8cff24, #ffffffeb);
  border: 1px solid rgba(27, 42, 68, 0.12);
  box-shadow: inset 0 1px #fff9;
}
.student-licence-card__title-copy {
  min-width: 0;
}
.student-identity-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.student-pill--soft {
  background: #1b2a440f;
  border-color: #1b2a4414;
}
.student-licence-card__status-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-top: 14px;
}
.student-licence-card__badge-stack {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.student-licence-card__badge-stack--next {
  justify-content: flex-start;
}
.student-licence-card__theme-panel {
  display: grid;
  gap: 8px;
  justify-items: end;
}
.student-inline-label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #1b2a44b8;
}
.student-theme-switch {
  margin-left: 0;
  justify-content: flex-end;
}
.student-progress-track {
  height: 14px;
}
.student-progress-track__marker {
  top: 50%;
  transform: translate(-50%, -50%);
  left: 0;
}
.student-progress-track--challenge {
  margin-top: 4px;
}
.student-progress-track__marker--compact {
  width: 28px;
  height: 28px;
  font-size: 0.92rem;
}
.student-home-mission__card {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.student-home-mission__cta {
  align-self: center;
  display: inline-flex;
  align-items: center;
}
.student-home-progress-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-progress-strip .student-metric-chip {
  min-height: 108px;
  padding: 14px;
}
.student-gap-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.student-gap-card {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: #ffffffbd;
}
.student-gap-card--accent {
  background: linear-gradient(180deg, #5a8cff1a, #ffffffe6);
}
.student-gap-card__label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #1b2a44b3;
}
.student-class-challenge-card {
  gap: 14px;
}
.student-class-challenge__summary,
.student-board-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.student-class-challenge__score {
  font-weight: 800;
  font-size: 1.05rem;
}
.student-stack-grid {
  display: grid;
  gap: 20px;
}
.student-leaderboard-list {
  display: grid;
  gap: 10px;
}
.student-leaderboard-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: #ffffffad;
}
.student-leaderboard-row--current {
  border-color: #5a8cff38;
  background: linear-gradient(180deg, #5a8cff1f, #ffffffeb);
}
.student-leaderboard-row__rank {
  min-width: 42px;
  font-weight: 800;
}
.student-leaderboard-row__profile {
  min-width: 0;
  display: flex;
  gap: 12px;
  align-items: center;
}
.student-leaderboard-row__avatar,
.student-avatar-option {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
  background: #1b2a440f;
  border: 1px solid rgba(27, 42, 68, 0.08);
}
.student-leaderboard-row__stats {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.student-profile-form {
  display: grid;
  gap: 14px;
}
.student-avatar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(52px, 1fr));
  gap: 10px;
}
.student-avatar-option {
  cursor: pointer;
  width: 100%;
  height: 52px;
  font-size: 1.4rem;
  background: #ffffffd1;
}
.student-avatar-option.is-active {
  background: #5a8cff29;
  border-color: #5a8cff5c;
  box-shadow: inset 0 0 0 1px #5a8cff33;
}
.mp-topbar__right--signed-in,
.mp-topbar__utility-pill,
.mp-tool-group {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}
html[data-appearance="dark"] .student-card,
html[data-appearance="dark"] .student-home-choice,
html[data-appearance="dark"] .student-home-mission__card,
html[data-appearance="dark"] .student-home-cheer,
html[data-appearance="dark"] .student-gap-card,
html[data-appearance="dark"] .student-leaderboard-row,
html[data-appearance="dark"] .student-avatar-option,
body.theme-dark .student-card,
body.theme-dark .student-home-choice,
body.theme-dark .student-home-mission__card,
body.theme-dark .student-home-cheer,
body.theme-dark .student-gap-card,
body.theme-dark .student-leaderboard-row,
body.theme-dark .student-avatar-option {
  background: #ffffff0f;
  border-color: #ffffff1f;
}
html[data-appearance="dark"] .student-home-mission__card,
body.theme-dark .student-home-mission__card {
  background: linear-gradient(135deg, #5a8cff2e, #121c30f5);
}
html[data-appearance="dark"] .student-home-cheer,
body.theme-dark .student-home-cheer {
  background: linear-gradient(180deg, #ffffff0f, #ffc1541f);
}
html[data-appearance="dark"] .student-metric-chip,
html[data-appearance="dark"] .student-badge-chip,
html[data-appearance="dark"] .student-pill,
html[data-appearance="dark"] .student-pill--soft,
html[data-appearance="dark"] .student-hero-avatar,
html[data-appearance="dark"] .student-progress-track__marker,
body.theme-dark .student-metric-chip,
body.theme-dark .student-badge-chip,
body.theme-dark .student-pill,
body.theme-dark .student-pill--soft,
body.theme-dark .student-hero-avatar,
body.theme-dark .student-progress-track__marker {
  background: #ffffff17;
  border-color: #ffffff24;
  color: #fffffff5;
}
html[data-appearance="dark"] .student-metric-chip__label,
html[data-appearance="dark"] .student-gap-card__label,
html[data-appearance="dark"] .student-inline-label,
html[data-appearance="dark"] .student-level-badge__copy small,
body.theme-dark .student-metric-chip__label,
body.theme-dark .student-gap-card__label,
body.theme-dark .student-inline-label,
body.theme-dark .student-level-badge__copy small,
html[data-appearance="dark"] .student-card .muted,
html[data-appearance="dark"] .student-licence-card .muted,
body.theme-dark .student-card .muted,
body.theme-dark .student-licence-card .muted {
  color: #ebf1ffc7;
}
html[data-appearance="dark"] .student-licence-card:before,
html[data-appearance="dark"] .student-licence-card:after,
body.theme-dark .student-licence-card:before,
body.theme-dark .student-licence-card:after {
  background: #ffffff14;
}
@media (max-width: 1100px) {
  .student-licence-card__status-grid,
  .student-home-progress-strip,
  .student-gap-strip,
  .student-portal-columns-2-1 {
    grid-template-columns: 1fr;
  }
  .student-licence-card__theme-panel {
    justify-items: start;
  }
}
@media (max-width: 720px) {
  .student-licence-card__title-row,
  .student-leaderboard-row {
    grid-template-columns: 1fr;
  }
  .student-leaderboard-row__stats,
  .student-class-challenge__summary,
  .student-board-summary {
    justify-content: flex-start;
  }
}
.student-shell__body,
.student-profile-page,
.student-page-content,
.layout-split--compact,
.student-stack-grid,
.student-card,
.student-licence-card {
  gap: 24px;
}
.student-card,
.student-licence-card {
  border-radius: 26px;
}
.student-card--compact,
.student-licence-card {
  padding: 20px 22px;
}
.student-portal-columns-2-1 {
  grid-template-columns: minmax(0, 1.55fr) minmax(320px, 0.95fr);
  align-items: start;
}
.student-profile-page .student-portal-columns-2-1 {
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr);
}
.student-licence-card__hero {
  grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.9fr);
  gap: 24px;
  align-items: start;
}
.student-licence-card__status-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(190px, auto);
  gap: 14px;
  align-items: start;
}
.student-licence-card__badge-stack {
  align-items: stretch;
}
.student-level-badge {
  position: relative;
  overflow: hidden;
  min-height: 64px;
  padding: 12px 14px;
  border-radius: 20px;
  box-shadow: inset 0 1px #ffffff59;
}
.student-level-badge:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.32),
    transparent 58%
  );
  pointer-events: none;
}
.student-level-badge--current.student-level-badge--flight {
  background: linear-gradient(135deg, #5a8cff29, #ffffffe6);
  border-color: #5a8cff38;
}
.student-level-badge--current.student-level-badge--football {
  background: linear-gradient(135deg, #329c6f2e, #ffffffe6);
  border-color: #329c6f38;
}
.student-level-badge__token {
  display: inline-grid;
  place-items: center;
  min-width: 38px;
  height: 38px;
  padding-inline: 10px;
  border-radius: 14px;
  background: #ffffffc7;
  box-shadow: inset 0 1px #ffffff80;
}
.student-level-badge__copy strong {
  font-size: 0.94rem;
}
.student-licence-card__meter {
  align-self: start;
  padding: 16px 18px;
}
.student-licence-card__meter-head,
.student-licence-card__meter-foot {
  gap: 16px;
}
.student-licence-card__meter-foot span {
  min-width: 0;
}
.student-progress-track {
  height: 12px;
  padding-right: 14px;
}
.student-progress-track__marker {
  top: 50%;
  transform: translate(-50%, -50%);
}
.student-home-mission,
.student-home-cheer,
.student-class-board-card,
.student-class-challenge-card {
  align-content: start;
}
.student-home-mission__card {
  gap: 20px;
  min-height: 160px;
  padding: 20px;
}
.student-home-mission__cta {
  min-width: 132px;
  justify-content: center;
}
.student-home-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.student-portal-columns-2-1
  > .student-card:last-child
  .student-home-choice-grid {
  grid-template-columns: 1fr;
}
.student-home-choice {
  min-height: 188px;
  align-content: start;
}
.student-home-choice strong {
  font-size: 1.14rem;
  line-height: 1.15;
}
.student-home-choice .muted.small {
  min-height: 3.7em;
}
.student-home-choice .btn {
  margin-top: auto;
  min-width: 116px;
}
.student-home-progress-strip {
  gap: 12px;
}
.student-home-progress-strip .student-metric-chip {
  min-height: 116px;
}
.student-gap-strip {
  grid-template-columns: 1fr;
  gap: 10px;
}
.student-gap-card {
  padding: 14px 16px;
}
:is(.student-home-summary-links, .student-inline-links) {
  gap: 10px;
}
:is(.student-home-summary-links, .student-inline-links) .btn {
  min-width: 0;
}
:is(.student-action-stack, .student-compact-list, .student-leaderboard-list) {
  gap: 12px;
}
:is(.student-action-row, .student-compact-row, .student-leaderboard-row) {
  padding: 14px 16px;
}
.student-compact-row__meta .btn,
.student-action-row .btn,
.student-home-summary-links .btn {
  justify-content: center;
}
.student-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.student-profile-form label {
  display: grid;
  gap: 8px;
}
.student-avatar-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.student-leaderboard-row__rank {
  min-width: auto;
}
.student-leaderboard-row__rank-badge {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: #1b2a4414;
  border: 1px solid rgba(27, 42, 68, 0.08);
  font-weight: 900;
}
.student-leaderboard-row__profile strong {
  font-size: 1rem;
}
.student-class-board-card .student-leaderboard-list {
  max-height: 560px;
  overflow: auto;
  padding-right: 4px;
}
.student-competition-board-switcher,
.student-competition-board-panels,
.student-competition-board-panel {
  display: grid;
  gap: 12px;
}
.student-competition-board-panel__intro {
  display: grid;
  gap: 4px;
}
.student-competition-board-subsection {
  display: grid;
  gap: 10px;
  padding-top: 4px;
  border-top: 1px solid
    color-mix(in srgb, var(--line-default) 86%, transparent 14%);
}
.student-competition-board-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.student-leaderboard-row__stats--competition-board {
  justify-content: flex-end;
}
.student-topbar,
.mp-topbar {
  backdrop-filter: blur(18px) saturate(1.08);
}
.student-topbar__inner,
.mp-topbar__inner {
  column-gap: 20px;
}
.mp-topbar__right,
.mp-topbar__controls,
.mp-tool-group,
.student-topbar__actions {
  gap: 14px;
}
.student-side-nav__list {
  gap: 8px;
}
.student-side-nav__link {
  min-height: 48px;
  padding: 12px 14px;
}
html[data-appearance="dark"] .student-topbar,
html[data-appearance="dark"] .mp-topbar,
body.theme-dark .student-topbar,
body.theme-dark .mp-topbar {
  background: linear-gradient(180deg, #080e1cf2, #0a101fe6);
  border-bottom-color: #91aaff24;
}
html[data-appearance="dark"] .student-side-nav,
html[data-appearance="dark"] .student-side-nav__link,
body.theme-dark .student-side-nav,
body.theme-dark .student-side-nav__link {
  background: #0a101ead;
  border-color: #91aaff24;
  color: #f8fafff5;
}
html[data-appearance="dark"] .student-side-nav,
body.theme-dark .student-side-nav {
  box-shadow: 0 18px 32px #00000047;
}
html[data-appearance="dark"] .student-side-nav__link:hover,
body.theme-dark .student-side-nav__link:hover {
  background: #5b80ff29;
}
html[data-appearance="dark"] .student-side-nav__link.is-active,
body.theme-dark .student-side-nav__link.is-active {
  background: linear-gradient(180deg, #5b80ff42, #5b80ff29);
  border-color: #91aaff3d;
}
html[data-appearance="dark"]
  :is(
    .student-card,
    .student-home-choice,
    .student-home-mission__card,
    .student-home-cheer,
    .student-gap-card,
    .student-leaderboard-row,
    .student-avatar-option
  ),
body.theme-dark
  :is(
    .student-card,
    .student-home-choice,
    .student-home-mission__card,
    .student-home-cheer,
    .student-gap-card,
    .student-leaderboard-row,
    .student-avatar-option
  ) {
  background: linear-gradient(180deg, #0d1425f0, #0a101ee6);
  border-color: #91aaff24;
  box-shadow: 0 18px 38px #00000038;
}
html[data-appearance="dark"] .student-licence-card,
body.theme-dark .student-licence-card {
  background: linear-gradient(135deg, #0c1324f5, #080e1ce6);
  border-color: #91aaff29;
  box-shadow: 0 18px 42px #00000047;
}
html[data-appearance="dark"] .student-licence-card--football,
body.theme-dark .student-licence-card--football {
  background:
    linear-gradient(135deg, #09141ff5, #080e1ceb),
    radial-gradient(
      circle at top right,
      rgba(50, 156, 111, 0.22),
      transparent 42%
    );
}
html[data-appearance="dark"] .student-home-mission__card,
body.theme-dark .student-home-mission__card {
  background: linear-gradient(135deg, #4b6ed657, #0c1426f5);
}
html[data-appearance="dark"] .student-home-cheer,
body.theme-dark .student-home-cheer {
  background: linear-gradient(180deg, #0e1628f5, #4e39083d);
}
html[data-appearance="dark"] .student-level-badge,
body.theme-dark .student-level-badge {
  background: #ffffff14;
  border-color: #ffffff24;
}
html[data-appearance="dark"]
  .student-level-badge--current.student-level-badge--flight,
body.theme-dark .student-level-badge--current.student-level-badge--flight {
  background: linear-gradient(135deg, #5a8cff38, #ffffff12);
}
html[data-appearance="dark"]
  .student-level-badge--current.student-level-badge--football,
body.theme-dark .student-level-badge--current.student-level-badge--football {
  background: linear-gradient(135deg, #329c6f38, #ffffff12);
}
html[data-appearance="dark"]
  :is(
    .student-metric-chip,
    .student-badge-chip,
    .student-pill,
    .student-pill--soft,
    .student-hero-avatar,
    .student-progress-track__marker,
    .student-leaderboard-row__rank-badge
  ),
body.theme-dark
  :is(
    .student-metric-chip,
    .student-badge-chip,
    .student-pill,
    .student-pill--soft,
    .student-hero-avatar,
    .student-progress-track__marker,
    .student-leaderboard-row__rank-badge
  ) {
  background: #ffffff1a;
  border-color: #ffffff24;
  color: #f8fafffa;
}
html[data-appearance="dark"]
  :is(
    .student-card h1,
    .student-card h2,
    .student-card h3,
    .student-card strong,
    .student-licence-card h1,
    .student-licence-card h2,
    .student-licence-card h3,
    .student-licence-card strong,
    .student-home-choice strong,
    .student-compact-row strong,
    .student-metric-chip__value
  ),
body.theme-dark
  :is(
    .student-card h1,
    .student-card h2,
    .student-card h3,
    .student-card strong,
    .student-licence-card h1,
    .student-licence-card h2,
    .student-licence-card h3,
    .student-licence-card strong,
    .student-home-choice strong,
    .student-compact-row strong,
    .student-metric-chip__value
  ) {
  color: #fafcfffc;
}
html[data-appearance="dark"]
  :is(
    .muted,
    .student-metric-chip__meta,
    .student-level-badge__copy small,
    .student-gap-card__label,
    .student-inline-label,
    .student-metric-chip__label
  ),
body.theme-dark
  :is(
    .muted,
    .student-metric-chip__meta,
    .student-level-badge__copy small,
    .student-gap-card__label,
    .student-inline-label,
    .student-metric-chip__label
  ) {
  color: #e2ebffd1 !important;
}
html[data-appearance="dark"] .student-progress-track,
body.theme-dark .student-progress-track {
  background: #ffffff1f;
}
html[data-appearance="dark"] .student-progress-track > span,
body.theme-dark .student-progress-track > span {
  background: linear-gradient(90deg, #6f93fff5, #3b59c2f0);
}
@media (max-width: 1200px) {
  .student-licence-card__hero,
  .student-portal-columns-2-1,
  .student-profile-page .student-portal-columns-2-1 {
    grid-template-columns: 1fr;
  }
  .student-licence-card__theme-panel {
    justify-items: start;
  }
}
@media (max-width: 860px) {
  :is(
    .student-home-choice-grid,
    .student-form-grid,
    .student-avatar-grid,
    .student-home-progress-strip,
    .student-gap-strip
  ) {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  :is(
    .student-home-mission__card,
    .student-action-row,
    .student-compact-row,
    .student-leaderboard-row,
    .student-licence-card__status-grid
  ) {
    grid-template-columns: 1fr;
  }
  :is(
    .student-home-mission__cta,
    .student-compact-row__meta,
    .student-leaderboard-row__stats
  ) {
    justify-content: flex-start;
  }
  .student-topbar__inner,
  .mp-topbar__inner {
    column-gap: 12px;
  }
}
.student-home-page {
  gap: 20px;
}
.student-home-hero {
  gap: 18px;
}
.student-home-hero .student-licence-card__hero {
  grid-template-columns: minmax(0, 1.6fr) minmax(300px, 0.86fr);
  gap: 22px;
  align-items: stretch;
}
.student-home-hero .student-licence-card__status-grid,
.student-licence-card__status-grid--compact {
  grid-template-columns: minmax(0, 1.28fr) minmax(220px, 0.92fr);
  gap: 14px;
}
.student-licence-card__journey-card {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.student-licence-card__journey-meta {
  padding-inline: 4px;
  font-size: 0.93rem;
  line-height: 1.35;
}
.student-home-hero .student-licence-card__meter {
  min-height: 100%;
  display: grid;
  align-content: center;
  gap: 14px;
}
.student-home-hero .student-progress-track {
  height: 11px;
}
.student-home-hero .student-progress-track__marker {
  width: 28px;
  height: 28px;
  top: 50%;
}
.student-home-row--mission {
  align-items: stretch;
}
:is(
  .student-home-mission,
  .student-home-cheer,
  .student-home-choices-panel,
  .student-home-support-card
) {
  gap: 16px;
}
.student-home-mission__card {
  min-height: 148px;
  align-items: center;
}
.student-home-mission__cta {
  align-self: center;
}
.student-home-progress-strip .student-metric-chip {
  min-height: 104px;
}
.student-home-class-summary {
  display: grid;
  gap: 12px;
  padding-top: 2px;
}
.student-home-class-summary__header,
.student-home-class-summary__challenge-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.student-home-class-summary__header strong,
.student-home-class-summary__challenge-head strong {
  font-size: 0.98rem;
}
.student-home-class-summary__challenge {
  display: grid;
  gap: 8px;
}
.student-home-choices-panel .student-home-choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-choice {
  min-height: 0;
  padding: 18px;
}
.student-home-choice strong {
  font-size: 1.08rem;
}
.student-home-choice .muted.small {
  min-height: 2.8em;
}
.student-home-support-card .student-compact-list {
  min-height: 0;
}
:is(
    .student-home-support-card,
    .student-home-choices-panel,
    .student-home-cheer,
    .student-home-mission
  )
  .section-header
  h2 {
  line-height: 1.12;
}
.student-home-shell .student-card--compact,
.student-home-shell .student-licence-card {
  padding: 20px;
}
.student-home-shell .student-inline-links {
  justify-content: flex-start;
}
:is(html[data-appearance="dark"], body.theme-dark) .student-home-class-summary {
  color: #f4f8fffa;
}
:is(html[data-appearance="dark"], body.theme-dark)
  .student-home-class-summary
  .btn {
  background: #ffffff14;
  border-color: #ffffff24;
}
@media (max-width: 1240px) {
  .student-home-hero .student-licence-card__hero,
  .student-home-choices-panel .student-home-choice-grid {
    grid-template-columns: 1fr 1fr;
  }
  .student-home-choices-panel .student-home-choice-grid > :last-child {
    grid-column: 1 / -1;
  }
}
@media (max-width: 960px) {
  .student-home-hero .student-licence-card__hero,
  .student-home-hero .student-licence-card__status-grid,
  .student-home-progress-strip,
  .student-home-choices-panel .student-home-choice-grid,
  .student-gap-strip--double {
    grid-template-columns: 1fr;
  }
  .student-home-class-summary__header,
  .student-home-class-summary__challenge-head {
    align-items: flex-start;
    flex-direction: column;
  }
}
.mp-runtime-error {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
  max-width: min(420px, calc(100vw - 32px));
  padding: 14px 16px;
  border-radius: 16px;
  background: #0f172af5;
  color: #fff;
  box-shadow: 0 16px 40px #0f172a47;
  font-size: 14px;
  line-height: 1.4;
}
body.mp-dark .mp-runtime-error {
  background: #0f172afa;
  color: #f8fafc;
}
.student-inline-metric-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.student-inline-metric {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "label meta" "value value";
  gap: 4px 10px;
  min-height: 0;
  padding: 10px 12px;
  border-radius: 18px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: #ffffffad;
}
.student-inline-metric__label {
  grid-area: label;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #1b2a44b8;
}
.student-inline-metric__value {
  grid-area: value;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.12;
}
.student-inline-metric__meta {
  grid-area: meta;
  justify-self: end;
  text-align: right;
  max-width: 18ch;
  font-size: 0.78rem;
  line-height: 1.28;
  color: #1b2a44b8;
}
.mp-language-menu summary,
.mp-topbar__control,
.mp-inline-link--button,
.mp-profile-trigger,
.student-side-nav__link,
.student-side-nav__link span {
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}
.student-licence-card,
.student-card--compact {
  gap: 18px;
}
.student-licence-card {
  padding: 18px 20px;
}
.student-licence-card__hero {
  grid-template-columns: minmax(0, 1.12fr) minmax(250px, 0.88fr);
  gap: 18px;
  align-items: start;
}
.student-licence-card__title-row {
  gap: 12px;
  align-items: start;
}
.student-hero-avatar {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  font-size: 1.7rem;
}
.student-licence-card__title-copy h1 {
  margin-bottom: 4px;
}
.student-identity-chips {
  gap: 6px;
  margin-top: 6px;
}
.student-licence-card__status-grid,
.student-licence-card__status-grid--compact {
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 10px;
  margin-top: 12px;
  align-items: start;
}
.student-licence-card__status-grid--with-theme {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
}
.student-licence-card__journey-card {
  gap: 8px;
}
.student-licence-card__journey-meta {
  padding-inline: 2px;
  font-size: 0.84rem;
  line-height: 1.28;
}
.student-level-badge {
  min-height: 74px;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 20px;
}
.student-level-badge__token {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  font-size: 1rem;
}
.student-level-badge__copy strong {
  font-size: 1rem;
  line-height: 1.08;
}
.student-level-badge__copy small {
  font-size: 0.76rem;
}
.student-licence-card__meter {
  padding: 14px 16px;
  gap: 12px;
  border-radius: 20px;
}
.student-licence-card__meter-head,
.student-licence-card__meter-foot {
  gap: 8px 14px;
}
.student-licence-card__meter-head strong {
  font-size: 1.08rem;
}
.student-licence-card__meter-foot {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  font-size: 0.83rem;
  line-height: 1.28;
}
.student-progress-track {
  height: 10px;
  padding-right: 12px;
}
.student-progress-track__marker {
  width: 26px;
  height: 26px;
  font-size: 0.82rem;
}
.student-metric-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-metric-chip {
  min-height: 0;
  gap: 2px;
  padding: 10px 12px;
}
.student-metric-chip__value {
  font-size: 1rem;
}
.student-metric-chip__meta {
  font-size: 0.76rem;
  line-height: 1.28;
}
:is(
  .student-shell__body,
  .student-page-content,
  .student-home-page,
  .student-stack-grid,
  .layout-split--compact,
  .student-portal-columns-2-1,
  .student-home-hero,
  .student-card,
  .student-licence-card
) {
  gap: 16px;
}
.student-home-shell .student-card--compact,
.student-home-shell .student-licence-card {
  padding: 18px;
}
.student-home-hero .student-licence-card__hero {
  grid-template-columns: minmax(0, 1.08fr) minmax(240px, 0.92fr);
  gap: 18px;
}
.student-home-progress-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.student-home-progress-strip .student-metric-chip {
  min-height: 0;
}
.student-home-mission__card {
  min-height: 0;
  padding: 18px;
}
:is(.student-home-choice-grid, .student-home-choice-grid--triple) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-choice {
  min-height: 0;
  padding: 16px;
}
.student-home-choice .muted.small {
  min-height: 2.5em;
}
.student-gap-strip--double {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
:is(.student-action-row, .student-compact-row, .student-leaderboard-row) {
  padding: 12px 14px;
}
:is(.student-action-row, .student-compact-row) {
  grid-template-columns: minmax(0, 1fr) auto;
}
.student-compact-row__meta {
  justify-content: flex-end;
}
.student-action-row .btn,
.student-compact-row__meta .btn,
.student-home-summary-links .btn,
.student-inline-links .btn,
.student-home-choice .btn,
.student-home-mission__cta .btn {
  min-height: 44px;
}
html[data-appearance="dark"] .student-inline-metric,
body.theme-dark .student-inline-metric {
  background: #ffffff14;
  border-color: #ffffff24;
}
html[data-appearance="dark"]
  :is(.student-inline-metric__label, .student-inline-metric__meta),
body.theme-dark
  :is(.student-inline-metric__label, .student-inline-metric__meta) {
  color: #e2ebffd1;
}
@media (max-width: 860px) {
  :is(
    .student-shell__body,
    .student-page-content,
    .student-home-page,
    .student-portal-columns-2-1,
    .student-home-row,
    .student-stack-grid
  ) {
    gap: 14px;
  }
  :is(
    .student-home-choice-grid,
    .student-home-choice-grid--triple,
    .student-home-progress-strip,
    .student-gap-strip--double,
    .student-metric-strip,
    .student-inline-metric-strip
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  :is(
    .student-home-mission__card,
    .student-action-row,
    .student-compact-row,
    .student-leaderboard-row
  ) {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  :is(
    .student-compact-row__meta,
    .student-leaderboard-row__stats,
    .student-home-mission__cta
  ) {
    justify-content: flex-end;
  }
  :is(.student-licence-card, .student-card--compact) {
    padding: 16px;
  }
  .student-licence-card__hero,
  .student-home-hero .student-licence-card__hero {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .student-licence-card__status-grid,
  .student-licence-card__status-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-licence-card__status-grid--with-theme {
    grid-template-columns: 1fr;
  }
  .student-licence-card__theme-panel {
    justify-items: start;
  }
  .student-home-choice-grid > :last-child {
    grid-column: auto;
  }
}
@media (max-width: 640px) {
  .mp-topbar__right,
  .mp-topbar__utility-pill,
  .mp-tool-group,
  .mp-public-auth-actions {
    gap: 8px;
  }
  .mp-topbar__right--signed-in {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 8px;
  }
  .mp-topbar__right--signed-in .mp-topbar__utility-pill {
    width: 100%;
    justify-content: space-between;
    flex-wrap: nowrap;
  }
  .mp-language-menu,
  .mp-profile-menu,
  .mp-tool-group {
    flex: 0 0 auto;
  }
  .mp-language-menu summary,
  .mp-topbar__control,
  .mp-profile-trigger {
    min-width: 44px;
    min-height: 44px;
    padding-inline: 4px;
  }
  .mp-language-menu__panel,
  .mp-profile-menu__panel {
    top: calc(100% + 8px);
    z-index: 120;
  }
  .student-side-nav:not(.student-side-nav--compact) {
    padding: 8px 10px;
  }
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__link {
    padding: 10px 14px;
  }
  :is(
    .student-shell__body,
    .student-page-content,
    .student-home-page,
    .student-stack-grid,
    .layout-split--compact,
    .student-portal-columns-2-1,
    .student-home-hero,
    .student-card,
    .student-licence-card
  ) {
    gap: 14px;
  }
  .student-licence-card,
  .student-card--compact,
  .student-home-shell .student-card--compact,
  .student-home-shell .student-licence-card {
    padding: 14px;
  }
  :is(
    .student-home-choice-grid,
    .student-home-choice-grid--triple,
    .student-home-progress-strip,
    .student-gap-strip--double,
    .student-metric-strip,
    .student-inline-metric-strip
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-hero-avatar {
    width: 52px;
    height: 52px;
    font-size: 1.56rem;
  }
  .student-level-badge {
    min-height: 70px;
    padding: 10px 11px;
  }
  .student-licence-card__meter-foot {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .student-home-mission__card {
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .student-home-mission__cta,
  .student-home-choice .btn,
  .student-home-mission__cta .btn {
    width: 100%;
    justify-content: center;
  }
}
@media (max-width: 420px) {
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__link {
    padding: 10px 13px;
  }
  :is(
    .student-home-choice-grid,
    .student-home-choice-grid--triple,
    .student-home-progress-strip,
    .student-gap-strip--double,
    .student-metric-strip,
    .student-inline-metric-strip,
    .student-licence-card__status-grid,
    .student-licence-card__status-grid--compact,
    .student-licence-card__status-grid--with-theme
  ) {
    grid-template-columns: 1fr;
  }
  :is(
    .student-action-row,
    .student-compact-row,
    .student-leaderboard-row,
    .student-home-mission__card
  ) {
    grid-template-columns: 1fr;
  }
  :is(
    .student-compact-row__meta,
    .student-leaderboard-row__stats,
    .student-home-mission__cta
  ) {
    justify-content: flex-start;
  }
}
body.portal-student {
  --site-max: 1500px;
  --student-shell-max: 1480px;
}
body.portal-adult {
  --adult-shell-max: 1660px;
}
.public-shell {
  width: min(
    var(--public-shell-max, var(--site-width)),
    calc(100vw - var(--site-gutter) * 2)
  );
  margin-inline: auto;
  display: grid;
  gap: 22px;
}
.student-shell__body,
.student-shell__body--with-nav {
  width: min(
    var(--student-shell-max, var(--site-width)),
    calc(100vw - var(--site-gutter) * 2)
  );
}
.app-shell {
  width: min(
    var(--adult-shell-max, var(--site-width)),
    calc(100vw - var(--site-gutter) * 2)
  );
}
.app-content {
  gap: 20px;
  padding: 18px;
}
.homepage-shell--v18-6-14 {
  gap: 18px;
}
.homepage-hero--landing {
  align-items: stretch;
}
.homepage-section--landing {
  display: grid;
  gap: 18px;
}
.homepage-proof-strip {
  flex-wrap: wrap;
}
.student-section-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.42fr);
  gap: 16px;
  align-items: stretch;
  padding: 18px 20px;
  border-radius: 24px;
  border: 1px solid var(--line-default);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
}
.student-section-hero__main {
  display: grid;
  gap: 14px;
}
.student-section-hero__copy {
  display: grid;
  gap: 12px;
}
.student-section-hero__copy h1 {
  margin: 6px 0 8px;
  line-height: 1.08;
}
.student-section-hero__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.student-section-hero__metrics {
  margin-top: 0;
}
.student-section-hero__aside {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}
.adult-dashboard-screen .dashboard-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.adult-dashboard-screen .layout-split--balanced {
  grid-template-columns: minmax(0, 1.16fr) minmax(340px, 0.84fr);
  align-items: start;
}
.adult-dashboard-screen .compact-kpis--tight {
  gap: 12px;
}
.adult-dashboard-screen :is(.card, .metric-card, .kpi-card) {
  min-height: 0;
}
:is(html[data-appearance="dark"], body.theme-dark) .student-section-hero {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 92%, black 8%),
    color-mix(in srgb, var(--bg-panel-2) 88%, black 12%)
  );
}
:is(html[data-appearance="dark"], body.theme-dark)
  .student-section-hero
  :is(h1, strong) {
  color: var(--text-strong);
}
@media (min-width: 1600px) {
  body.portal-adult {
    --site-max: 1680px;
  }
  .homepage-shell--v18-6-14 {
    --public-shell-max: 1460px;
  }
  .homepage-hero--landing {
    grid-template-columns: minmax(0, 1.06fr) minmax(420px, 0.94fr);
  }
  .homepage-section--landing {
    grid-template-columns: minmax(280px, 0.38fr) minmax(0, 1fr);
    align-items: start;
  }
  .student-home-page,
  .student-shell__body,
  .student-shell__body--with-nav {
    gap: 22px;
  }
  .adult-dashboard-screen .layout-split--balanced {
    grid-template-columns: minmax(0, 1.22fr) minmax(360px, 0.78fr);
  }
}
@media (max-width: 1180px) {
  .student-side-nav:not(.student-side-nav--compact) {
    position: sticky;
    top: calc(var(--header-height) + var(--safe-area-top) + 8px);
    z-index: 25;
    padding: 10px 12px;
    border-radius: 22px;
  }
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__header,
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__toggle {
    display: none;
  }
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__list {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }
  .student-side-nav:not(.student-side-nav--compact)
    .student-side-nav__list::-webkit-scrollbar {
    display: none;
  }
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__link {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 46px;
    padding: 10px 15px;
    border-radius: 20px;
    gap: 10px;
  }
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__icon {
    display: none;
  }
  .student-side-nav:not(.student-side-nav--compact)
    .student-side-nav__link
    span {
    overflow: visible;
    text-overflow: clip;
  }
  .student-side-nav:not(.student-side-nav--compact)
    .student-side-nav__link.is-active:before {
    left: 10px;
    top: 9px;
    bottom: 9px;
  }
  .student-section-hero {
    grid-template-columns: 1fr;
  }
  .student-section-hero__aside {
    justify-content: flex-start;
  }
}
@media (max-width: 860px) {
  .student-side-nav:not(.student-side-nav--compact) {
    padding-inline: 12px;
  }
  .student-side-nav:not(.student-side-nav--compact) .student-side-nav__link {
    padding-inline: 16px;
  }
  .public-shell {
    gap: 18px;
  }
  .homepage-section--landing {
    gap: 14px;
  }
  .student-section-hero {
    padding: 16px;
  }
}
.runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr) minmax(
      380px,
      var(--runner-answer-dock-width, 420px)
    );
  gap: 20px;
}
.runner-card-actions-v2 {
  display: grid;
  gap: 12px;
  align-items: start;
}
.runner-card-actions-v2__heading {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.runner-actions-v2 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;
}
.runner-actions-v2 > .btn,
.runner-actions-v2__inline,
.runner-actions-v2__group {
  flex: 0 1 140px;
}
.runner-actions-v2__inline,
.runner-actions-v2__group--utility {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.runner-actions-v2 .btn,
.runner-actions-v2__inline .btn,
.runner-actions-v2__group--utility .btn {
  width: auto;
  min-width: 118px;
}
.runner-answer-format {
  display: grid;
  gap: 2px;
  margin-bottom: 4px;
  padding: 8px 10px;
  border-radius: 16px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-interactive) 90%, white 10%);
}
.runner-answer-format__label {
  color: var(--student-700);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.runner-answer-format__helper {
  color: var(--text-body);
  font-size: 0.88rem;
  line-height: 1.28;
}
.runner-answer-field__control {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
.runner-answer-input-row {
  width: 100%;
  min-height: 58px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 38%, var(--line-default) 62%);
  border-radius: 18px;
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-500) 10%, transparent);
}
.runner-answer-input-row:focus-within {
  border-color: var(--brand-600);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-500) 20%, transparent);
}
.runner-answer-input-row .runner-answer-field__input {
  min-width: 0;
  width: 100%;
  min-height: 56px;
  border: 0;
  background: transparent;
  padding: 0 14px;
  font-weight: 800;
  color: var(--text-strong);
  outline: 0;
  box-shadow: none;
}
.runner-answer-input-row .runner-answer-field__input:focus,
.runner-answer-input-row .runner-answer-field__input:focus-visible {
  outline: 0;
  box-shadow: none;
}
.runner-answer-input-row .runner-answer-field__prefix,
.runner-answer-input-row .runner-answer-field__suffix {
  min-height: 42px;
  min-width: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-inline: 8px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand-50) 72%, var(--bg-panel) 28%);
  border: 1px solid var(--line-subtle);
  font-weight: 900;
}
.runner-answer-field__suffix {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 12px;
  border-radius: 14px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
  font-weight: 700;
}
.runner-answer-field__label {
  display: inline-block;
  margin-bottom: 8px;
  font-weight: 700;
}
.mixed-frac {
  display: inline-flex;
  align-items: center;
  gap: 0.28em;
}
.mixed-frac__whole {
  display: inline-block;
}
.student-shell__body--with-nav {
  gap: var(--space-4);
  grid-template-columns: minmax(210px, var(--student-nav-width)) minmax(0, 1fr);
}
.student-page-content--runner .runner-shell-v2 {
  --runner-shell-max-width: 1700px;
  gap: 14px;
  margin-top: 8px;
  padding: 14px 10px;
  height: calc(100dvh - clamp(20px, 6dvh, 108px));
  max-height: calc(100dvh - clamp(20px, 6dvh, 108px));
}
:is(.page-shell, .public-shell, .app-shell) {
  padding-block: 12px 24px;
}
:is(.hero, .auth-split, .workspace-hero, .homepage-hero) {
  gap: var(--space-4);
  grid-template-columns: minmax(0, 1.12fr) minmax(300px, 0.88fr);
}
:is(
  .auth-panel,
  .auth-aside,
  .student-auth-panel,
  .student-auth-aside,
  .hero-copy,
  .hero-preview,
  .page-hero-card,
  .workspace-hero
) {
  padding: 20px;
}
.recommendation-grid,
.recommendation-grid--spacious {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.recommendation-card {
  padding: 18px;
}
@media (max-width: 1100px) {
  .runner-stage-v2 {
    grid-template-columns: 1fr;
  }
  .runner-side-rail-v2 {
    position: static;
  }
}
@media (max-width: 820px) {
  .student-shell__body--with-nav,
  .hero,
  .auth-split,
  .workspace-hero,
  .homepage-hero {
    grid-template-columns: 1fr;
  }
  .runner-actions-v2,
  .runner-actions-v2__inline,
  .runner-actions-v2__group--utility {
    display: grid;
    grid-template-columns: 1fr;
  }
  .runner-actions-v2 .btn,
  .runner-actions-v2__inline .btn,
  .runner-actions-v2__group--utility .btn {
    width: 100%;
    min-width: 0;
  }
}
.runner-visual-panel-v2 .visual-card--scene .visual-scene {
  width: min(100%, 900px);
  max-width: 900px;
  height: auto;
  margin-inline: auto;
}
.runner-question-card-v2.runner-question-panel--choice .runner-visual-panel-v2,
.runner-question-card-v2.runner-question-panel--shape-choice
  .runner-visual-panel-v2 {
  justify-items: center;
}
.student-page-content--runner .student-shell__body--with-nav {
  grid-template-columns: minmax(170px, 188px) minmax(0, 1fr);
}
.student-page-content--runner .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr) minmax(
      320px,
      var(--runner-answer-dock-width, 420px)
    );
  gap: 14px;
}
.student-page-content--runner .runner-question-card-v2 {
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.student-page-content--runner .runner-side-rail-v2 {
  grid-template-rows: auto auto;
  gap: 12px;
}
.student-page-content--runner .runner-rail-card-v2--actions {
  gap: 10px;
  padding: 12px;
}
.student-page-content--runner .runner-actions-v2--rail {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  align-items: stretch;
}
.student-page-content--runner .runner-actions-v2--rail > .btn,
.student-page-content--runner .runner-actions-v2--rail .btn {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  justify-content: center;
}
.student-page-content--runner .runner-actions-v2--rail [data-runner-cancel] {
  margin-top: 4px;
}
.student-page-content--runner .runner-card-actions-v2 {
  display: none;
}
.student-page-content--runner .runner-visual-panel-v2 {
  min-height: clamp(240px, 42vh, 520px);
  align-content: center;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-visual-panel-v2 {
  min-height: clamp(280px, 46vh, 560px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-compact-typed {
  min-height: clamp(200px, 26vh, 320px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid {
  min-height: clamp(420px, 58vh, 720px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--coordinate-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--transformation-grid {
  min-height: clamp(520px, 68vh, 860px);
}
@media (max-width: 1200px) {
  .student-page-content--runner .student-shell__body--with-nav {
    grid-template-columns: 176px minmax(0, 1fr);
  }
  .student-page-content--runner .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) 196px;
  }
}
@media (max-width: 1100px) {
  .student-page-content--runner .runner-stage-v2 {
    grid-template-columns: 1fr;
  }
  .student-page-content--runner .runner-side-rail-v2 {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}
@media (max-width: 820px) {
  .student-page-content--runner .runner-side-rail-v2 {
    grid-template-columns: 1fr;
  }
  .student-page-content--runner .runner-visual-panel-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
    .runner-visual-panel-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .runner-visual-panel-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-visual-panel-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-visual-panel-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .runner-visual-panel-v2 {
    min-height: 220px;
  }
}
.student-page-content--runner .runner-question-card-v2 .runner-answer-panel-v2 {
  padding-top: 8px;
}
.student-page-content--runner .runner-question-card-v2 .runner-answer-field {
  gap: 8px;
}
.student-page-content--runner .runner-question-card-v2 .runner-answer-format {
  margin-bottom: 6px;
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-answer-format__label:only-child {
  margin-bottom: 0;
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-answer-format:has(.runner-answer-format__label):not(
    :has(.runner-answer-format__helper)
  ) {
  padding-block: 8px;
}
.visual-card--angle-straight-line {
  width: 100%;
}
.visual-card--angle-straight-line .visual-svg--angle {
  width: min(100%, 680px);
  max-width: 680px;
  margin-inline: auto;
  display: block;
}
.learner-avatar {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  overflow: hidden;
}
.learner-avatar__img,
.learner-avatar__fallback {
  width: 100%;
  height: 100%;
  border-radius: inherit;
}
.learner-avatar__img {
  display: block;
  object-fit: cover;
}
.learner-avatar__fallback {
  display: none;
  place-items: center;
  background: linear-gradient(180deg, #5a8cff29, #fffffff0);
  color: var(--text-strong);
  font-weight: 800;
  letter-spacing: 0.04em;
}
.learner-avatar.is-fallback .learner-avatar__fallback,
.learner-avatar .learner-avatar__img[hidden] + .learner-avatar__fallback {
  display: grid;
}
.learner-avatar--initial .learner-avatar__fallback {
  display: grid;
  background:
    radial-gradient(
      circle at 35% 22%,
      rgba(255, 255, 255, 0.92),
      transparent 34%
    ),
    linear-gradient(145deg, #dbe4fff5, #f4eee0f5);
  color: color-mix(in srgb, var(--text-strong) 86%, var(--brand-600) 14%);
  font-weight: 900;
}
.learner-avatar--topbar {
  width: 100%;
  height: 100%;
}
.mp-profile-trigger__avatar {
  overflow: hidden;
  border: 1px solid
    color-mix(in srgb, var(--line-default) 82%, var(--brand-100) 18%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-elevated) 68%, var(--brand-100) 32%),
    color-mix(in srgb, var(--bg-panel) 82%, var(--brand-2) 18%)
  );
  color: var(--text-strong);
}
.mp-profile-trigger__avatar-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--text-strong);
  font-size: 0.98rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.mp-profile-trigger__avatar .learner-avatar__fallback {
  font-size: 0.92rem;
}
.student-hero-avatar {
  overflow: hidden;
  padding: 0;
}
.student-hero-avatar .learner-avatar__fallback {
  font-size: 1rem;
}
.student-licence-card__avatar-meta {
  margin-top: 6px;
  font-size: 0.82rem;
  font-weight: 700;
  color: color-mix(in srgb, var(--text-strong) 74%, transparent);
}
.student-licence-card__action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-top: 12px;
}
.student-licence-card__action-meta {
  font-size: 0.92rem;
}
.student-licence-card__mission-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.student-leaderboard-row__avatar {
  overflow: hidden;
  padding: 0;
}
.student-leaderboard-row__avatar .learner-avatar__fallback {
  font-size: 0.78rem;
}
.student-avatar-grid {
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
}
.student-avatar-option {
  height: 92px;
  padding: 10px 8px;
  grid-template-rows: auto auto;
  gap: 8px;
  align-content: center;
  justify-items: center;
}
.student-avatar-option__preview {
  width: 48px;
  height: 48px;
  display: inline-grid;
}
.student-avatar-option__label {
  display: block;
  font-size: 0.73rem;
  line-height: 1.15;
  font-weight: 700;
  color: var(--text-strong);
  text-align: center;
}
.student-avatar-option .learner-avatar__fallback {
  font-size: 0.84rem;
}
.runner-blank-slot {
  min-width: 1.26em;
  height: 1em;
  align-items: center;
  justify-content: center;
  background: #5a8cff14;
}
.runner-blank-slot--digit {
  min-width: 0.82em;
  width: 0.82em;
  margin: 0;
  border-bottom-width: 0.14em;
  border-radius: 0.2em;
}
.runner-blank-slot--inline {
  vertical-align: -0.06em;
}
.runner-answer-field__prefix,
.runner-answer-field__suffix {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  color: var(--text-strong);
}
@media (max-width: 860px) {
  .student-licence-card__action-row {
    align-items: flex-start;
  }
  .student-avatar-grid {
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  }
  .student-avatar-option {
    height: 88px;
  }
}
.student-profile-page {
  gap: 18px;
}
.student-profile-main {
  display: grid;
  gap: 18px;
  width: min(100%, 1080px);
  margin: 0 auto;
}
.student-profile-focus-panel {
  display: grid;
  gap: 18px;
  padding: 22px;
}
.student-profile-hero {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 18px;
  border-radius: 24px;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--brand-2) 14%, white),
    color-mix(in srgb, var(--bg-panel) 92%, var(--brand-1) 8%)
  );
  border: 1px solid color-mix(in srgb, var(--line) 85%, var(--brand-2) 15%);
}
.student-profile-hero__avatar {
  width: min(100%, 220px);
  aspect-ratio: 1;
  justify-self: center;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 20px 44px #1f29371f;
}
.student-profile-hero__copy {
  display: grid;
  gap: 8px;
}
.student-profile-hero__copy h2 {
  margin: 0;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
}
.student-profile-form {
  display: grid;
  gap: 16px;
}
.student-profile-form__nickname input {
  margin-top: 8px;
}
.student-avatar-library-intro {
  display: grid;
  gap: 4px;
  margin: 0;
}
.student-avatar-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.student-avatar-option {
  min-height: 196px;
  height: auto;
  padding: 16px 14px;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line) 86%, var(--brand-2) 14%);
  background: linear-gradient(
    180deg,
    #fffffffa,
    color-mix(in srgb, var(--bg-panel) 94%, var(--brand-2) 6%)
  );
  box-shadow: 0 10px 24px #1f29370f;
  display: grid;
  grid-template-rows: auto auto;
  gap: 10px;
  align-content: start;
  justify-items: start;
  text-align: left;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}
.student-avatar-option:is(:hover, :focus-visible) {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px #1f29371a;
}
.student-avatar-option.is-active {
  border-color: color-mix(in srgb, var(--brand-2) 62%, white);
  box-shadow: 0 18px 36px color-mix(in srgb, var(--brand-2) 24%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, white 72%, var(--brand-2) 28%),
    color-mix(in srgb, var(--bg-panel) 86%, var(--brand-2) 14%)
  );
}
.student-avatar-option__preview {
  width: 100%;
  aspect-ratio: 1;
  max-width: 120px;
  justify-self: center;
  border-radius: 24px;
  overflow: hidden;
}
.student-avatar-option__copy {
  display: grid;
  gap: 6px;
  width: 100%;
}
.student-avatar-option__label {
  display: block;
  font-size: 0.98rem;
  line-height: 1.15;
  font-weight: 800;
  color: var(--text-strong);
  text-align: left;
}
.student-avatar-option__meta {
  display: block;
  min-height: 2.5em;
  font-size: 0.78rem;
  line-height: 1.28;
  color: var(--text-muted);
  text-align: left;
}
.student-profile-class-card .student-home-class-summary {
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
}
.student-profile-class-card .student-home-class-summary__header {
  align-items: center;
}
.student-profile-class-card .student-gap-strip {
  margin-top: 12px;
}
.student-profile-class-card .student-home-class-summary__challenge {
  margin-top: 14px;
}
.student-profile-focus-card,
.student-profile-side-stack,
.student-profile-page .student-portal-columns-2-1 {
  position: static;
  display: block;
}
@media (max-width: 1100px) {
  .student-avatar-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  .student-profile-focus-panel {
    padding: 18px;
  }
  .student-profile-hero {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .student-profile-hero__copy {
    justify-items: center;
  }
  .student-avatar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .student-profile-main {
    gap: 14px;
  }
  .student-profile-focus-panel,
  .student-profile-hero {
    padding: 14px;
  }
  .student-avatar-grid {
    gap: 10px;
  }
  .student-avatar-option {
    min-height: 170px;
    padding: 12px;
  }
  .student-avatar-option__preview {
    max-width: 96px;
  }
}
.student-profile-focus-panel {
  overflow: visible;
}
:is(.student-profile-hero__avatar, .student-avatar-option__preview) {
  display: grid;
  place-items: center;
}
.student-profile-hero__avatar {
  width: min(100%, 228px);
  height: min(100%, 228px);
}
.student-avatar-grid {
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 16px;
}
.student-avatar-option {
  min-height: 228px;
  grid-template-rows: 124px auto;
  align-content: start;
}
.student-avatar-option__preview {
  width: 124px;
  min-width: 124px;
  height: 124px;
  min-height: 124px;
  justify-self: center;
  align-self: start;
  border-radius: 999px;
  overflow: hidden;
  background: #ffffffb8;
  box-shadow: inset 0 0 0 1px #0f172a0a;
}
:is(.student-profile-hero__avatar, .student-avatar-option__preview)
  .learner-avatar {
  width: 100%;
  height: 100%;
  display: grid;
}
:is(.student-profile-hero__avatar, .student-avatar-option__preview)
  .learner-avatar__img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}
.student-avatar-option__copy {
  gap: 4px;
}
.student-avatar-option__meta {
  min-height: 2.8em;
}
@media (max-width: 1100px) {
  .student-avatar-grid {
    grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
  }
}
@media (max-width: 860px) {
  .student-avatar-option {
    min-height: 214px;
    grid-template-rows: 112px auto;
  }
  .student-avatar-option__preview {
    width: 112px;
    min-width: 112px;
    height: 112px;
    min-height: 112px;
  }
}
@media (max-width: 560px) {
  .student-avatar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .student-avatar-option {
    min-height: 196px;
    grid-template-rows: 96px auto;
  }
  .student-avatar-option__preview {
    width: 96px;
    min-width: 96px;
    height: 96px;
    min-height: 96px;
  }
}
.student-session-finishing {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: #0f172a2e;
  backdrop-filter: blur(4px);
}
.student-session-finishing__card {
  width: min(520px, calc(100vw - 32px));
  padding: 24px;
  border-radius: 24px;
  background: #fffcf7fa;
  box-shadow: 0 24px 60px #0f172a29;
  border: 1px solid rgba(124, 146, 191, 0.2);
}
.student-session-finishing__card h2 {
  margin: 8px 0;
}
.student-shell,
.student-home-shell {
  --student-topbar-height: 64px;
}
.mp-topbar--student-dashboard {
  border-bottom-color: #4666c11f;
}
.mp-topbar--student-dashboard .mp-topbar__inner {
  min-height: calc(var(--student-topbar-height) + var(--safe-area-top));
  padding: 8px 18px 10px;
  column-gap: 14px;
  row-gap: 10px;
  align-items: center;
  border-radius: 0 0 18px 18px;
}
.mp-topbar--student-dashboard .mp-topbar__brand img,
.mp-topbar--student-dashboard .topbar-brand-image {
  height: 34px;
  max-height: 34px;
}
.mp-topbar__center--metrics {
  min-width: 0;
}
.mp-topbar__status-strip {
  display: flex;
  align-items: stretch;
  gap: 10px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  padding-block: 2px;
}
.mp-topbar__status-strip::-webkit-scrollbar {
  display: none;
}
.mp-topbar__status-chip {
  min-width: min(220px, 30vw);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 16px;
  border: 1px solid rgba(70, 102, 193, 0.12);
  background: linear-gradient(180deg, #ffffffeb, #edf2ffd6);
  box-shadow: 0 10px 24px #25355914;
  white-space: nowrap;
}
.mp-topbar__status-chip--status {
  background: linear-gradient(180deg, #e8f0fffa, #dce8ffe0);
}
.mp-topbar__status-chip--tasks {
  background: linear-gradient(180deg, #f4f6fffa, #e9eeffe0);
}
.mp-topbar__status-chip--points {
  background: linear-gradient(180deg, #fff9eafa, #fff1d2e6);
}
.mp-topbar__status-icon {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #ffffffd1;
  border: 1px solid rgba(70, 102, 193, 0.1);
  flex: 0 0 auto;
  font-size: 1rem;
}
.mp-topbar__status-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.mp-topbar__status-label {
  font-size: 0.68rem;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #3c4a6eb8;
  font-weight: 800;
}
.mp-topbar__status-value {
  display: block;
  color: var(--text-strong);
  font-size: 0.98rem;
  line-height: 1.15;
}
.mp-topbar__status-value-compact {
  display: none;
}
.mp-topbar__status-meta {
  font-size: 0.78rem;
  line-height: 1.1;
  color: #495879cc;
}
.mp-profile-menu__utility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0 8px;
  padding-top: 10px;
  border-top: 1px solid rgba(27, 42, 68, 0.08);
}
.mp-profile-menu__utility {
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: linear-gradient(180deg, #fffffffa, #f0f4ffeb);
  border-radius: 12px;
  min-height: 38px;
  padding: 8px 10px;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-strong);
  cursor: pointer;
}
.mp-profile-menu__utility.is-active {
  background: linear-gradient(180deg, #677eff2e, #677eff14);
  border-color: #677eff3d;
}
.student-home-hero {
  gap: 14px;
}
.student-home-hero .student-licence-card__hero {
  gap: 18px;
}
.student-home-hero .student-licence-card__copy h1 {
  font-size: clamp(2rem, 3vw, 2.5rem);
}
.student-licence-card__action-row {
  gap: 12px;
}
.student-home-hero .student-licence-card__mission-chips {
  display: none;
}
.student-home-mission,
.student-home-cheer,
.student-home-choices-panel,
.student-home-support-card {
  gap: 14px;
}
@media (max-width: 980px) {
  .mp-topbar--student-dashboard .mp-topbar__inner {
    padding-inline: 14px;
    column-gap: 10px;
  }
  .mp-topbar__status-chip {
    min-width: 172px;
  }
}
@media (max-width: 720px) {
  .student-shell,
  .student-home-shell {
    --student-topbar-height: 58px;
  }
  .mp-topbar--student-dashboard .mp-topbar__inner {
    padding: 6px 10px 8px;
    column-gap: 8px;
  }
  .mp-topbar--student-dashboard .mp-topbar__brand img,
  .mp-topbar--student-dashboard .topbar-brand-image {
    height: 28px;
    max-height: 28px;
  }
  .mp-topbar--student-dashboard .mp-language-menu,
  .mp-topbar--student-dashboard .mp-tool-group {
    display: none;
  }
  .mp-topbar--student-dashboard .mp-topbar__utility-pill {
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  .mp-topbar--student-dashboard .mp-topbar__right,
  .mp-topbar__status-strip {
    gap: 8px;
  }
  .mp-topbar__status-chip {
    min-width: auto;
    padding: 7px 10px;
    border-radius: 14px;
    gap: 8px;
  }
  .mp-topbar__status-icon {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    font-size: 0.92rem;
  }
  .mp-topbar__status-label,
  .mp-topbar__status-meta,
  .mp-topbar__status-value-full {
    display: none;
  }
  .mp-topbar__status-value-compact {
    display: inline;
    font-size: 0.92rem;
    line-height: 1;
  }
  .mp-topbar__status-copy {
    gap: 0;
  }
  .student-home-page {
    gap: 14px;
  }
  .student-home-hero {
    padding: 16px;
  }
  .student-home-hero .student-licence-card__hero,
  .student-home-hero .student-licence-card__status-grid {
    gap: 14px;
  }
  .student-home-hero .student-licence-card__title-row {
    align-items: center;
    gap: 12px;
  }
  .student-home-hero .student-licence-card__title-copy h1 {
    font-size: 1.9rem;
  }
  .student-licence-card__avatar-meta {
    display: none;
  }
  .student-licence-card__action-row {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .student-shell,
  .student-home-shell {
    --student-topbar-height: 56px;
  }
  .mp-topbar--student-dashboard .mp-topbar__inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding-inline: 8px;
  }
  .mp-topbar__status-strip {
    justify-content: flex-start;
  }
  .mp-topbar__status-chip {
    padding: 7px 9px;
  }
  .mp-topbar__status-icon {
    width: 26px;
    height: 26px;
  }
  .mp-profile-menu__utility-grid {
    grid-template-columns: 1fr 1fr;
  }
  .student-home-hero .student-licence-card__title-copy h1 {
    font-size: 1.72rem;
  }
  .student-home-hero .student-licence-card__meter-head,
  .student-home-hero .student-licence-card__meter-foot {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}
html[data-appearance="dark"] .mp-topbar__status-chip,
body.theme-dark .mp-topbar__status-chip {
  background: linear-gradient(180deg, #11182af0, #0b1222e6);
  border-color: #91aaff29;
  box-shadow: 0 14px 28px #00000038;
}
html[data-appearance="dark"] .mp-topbar__status-chip--points,
body.theme-dark .mp-topbar__status-chip--points {
  background: linear-gradient(180deg, #2d230af0, #12121ce6);
}
html[data-appearance="dark"] .mp-topbar__status-icon,
body.theme-dark .mp-topbar__status-icon {
  background: #ffffff14;
  border-color: #91aaff24;
}
html[data-appearance="dark"]
  :is(.mp-topbar__status-label, .mp-topbar__status-meta),
body.theme-dark :is(.mp-topbar__status-label, .mp-topbar__status-meta) {
  color: #e2ebffd1;
}
html[data-appearance="dark"] .mp-profile-menu__utility,
body.theme-dark .mp-profile-menu__utility {
  background: linear-gradient(180deg, #141c30f5, #0d1426e6);
  border-color: #91aaff24;
  color: #f8fafff5;
}
.mp-topbar--student-dashboard .mp-topbar__status-chip {
  min-width: min(204px, 27vw);
  padding: 7px 11px;
  border-radius: 14px;
  box-shadow: 0 6px 14px #2535590f;
}
.mp-topbar--student-dashboard .mp-topbar__status-icon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
}
.mp-topbar--student-dashboard .mp-topbar__status-value {
  font-size: 0.94rem;
}
@media (max-width: 720px) {
  .mp-topbar--student-dashboard .mp-topbar__inner {
    row-gap: 8px;
    padding: 6px 10px 7px;
  }
  .mp-topbar--student-dashboard .mp-topbar__right {
    align-self: center;
  }
  .mp-topbar--student-dashboard .mp-topbar__utility-pill {
    gap: 0;
  }
  .mp-topbar--student-dashboard .mp-profile-trigger,
  .mp-topbar--student-dashboard .mp-profile-trigger__avatar {
    min-height: 34px;
    width: 34px;
    height: 34px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-strip {
    gap: 6px;
    padding-block: 0;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-chip {
    padding: 6px 9px;
    border-radius: 12px;
    gap: 6px;
    box-shadow: none;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-icon {
    width: 24px;
    height: 24px;
    border-radius: 8px;
    font-size: 0.84rem;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-value-compact {
    font-size: 0.88rem;
    font-weight: 800;
  }
  .student-home-hero {
    gap: 12px;
    padding: 14px;
  }
  .student-home-hero .student-licence-card__copy {
    gap: 12px;
  }
  .student-home-hero .student-identity-chips {
    gap: 6px;
  }
  .student-home-hero .student-pill,
  .student-home-hero .student-pill--soft {
    min-height: 28px;
    padding: 5px 10px;
    font-size: 0.82rem;
  }
  .student-home-hero .student-licence-card__status-grid,
  .student-home-hero .student-licence-card__secondary,
  .student-home-hero .student-inline-metric-strip,
  .student-home-hero .student-inline-metric-strip--hero {
    gap: 10px;
  }
  .student-home-hero .student-level-badge {
    min-height: 64px;
    padding: 10px;
  }
}
@media (max-width: 560px) {
  .student-shell,
  .student-home-shell {
    --student-topbar-height: 52px;
  }
  .mp-topbar--student-dashboard .mp-topbar__inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "left center right";
    align-items: center;
    row-gap: 0;
    column-gap: 8px;
    padding: 5px 8px 6px;
    border-radius: 0 0 16px 16px;
  }
  .mp-topbar--student-dashboard .mp-topbar__left,
  .mp-topbar--student-dashboard .mp-topbar__center,
  .mp-topbar--student-dashboard .mp-topbar__right {
    align-self: center;
  }
  .mp-topbar--student-dashboard .mp-topbar__center {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
  }
  .mp-topbar--student-dashboard .mp-topbar__right,
  .mp-topbar--student-dashboard .mp-topbar__right--signed-in,
  .mp-topbar--student-dashboard .mp-topbar__right--signed-out {
    width: auto;
    min-height: auto;
    justify-self: end;
    justify-content: flex-end;
    display: flex;
    align-items: center;
    gap: 0;
  }
  .mp-topbar--student-dashboard
    .mp-topbar__right--signed-in
    .mp-topbar__utility-pill,
  .mp-topbar--student-dashboard
    .mp-topbar__right--signed-out
    .mp-topbar__utility-pill {
    width: auto;
    min-height: auto;
    justify-content: flex-end;
    gap: 0;
  }
  .mp-topbar--student-dashboard .mp-topbar__brand img,
  .mp-topbar--student-dashboard .topbar-brand-image {
    height: 24px;
    max-height: 24px;
    max-width: min(138px, 100%);
  }
  .mp-topbar--student-dashboard .mp-profile-trigger,
  .mp-topbar--student-dashboard .mp-profile-trigger__avatar {
    min-height: 32px;
    width: 32px;
    height: 32px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-strip {
    width: 100%;
    justify-content: flex-start;
    gap: 5px;
    overflow-x: auto;
    padding-right: 2px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-chip {
    flex: 0 0 auto;
    min-width: 0;
    padding: 4px 7px;
    border-radius: 10px;
    gap: 5px;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-icon {
    width: 22px;
    height: 22px;
    border-radius: 7px;
    font-size: 0.78rem;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-value-compact {
    font-size: 0.84rem;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-copy {
    display: flex;
    align-items: center;
  }
  .mp-topbar--student-dashboard .mp-profile-menu__panel {
    right: 0;
    left: auto;
    min-width: min(240px, calc(100vw - 16px));
    max-width: min(240px, calc(100vw - 16px));
  }
  .student-shell .student-segmented,
  .student-home-shell .student-segmented {
    gap: 6px;
    margin-bottom: 8px;
  }
  .student-shell .student-segmented__button,
  .student-home-shell .student-segmented__button {
    min-height: 32px;
    padding: 7px 12px;
  }
  .student-home-hero {
    padding: 12px;
  }
  .student-home-hero .student-hero-avatar,
  .student-home-hero .student-licence-card__avatar-meta,
  .student-home-hero .student-licence-card__mission-chips {
    display: none;
  }
  .student-home-hero .student-licence-card__title-row {
    gap: 6px;
  }
  .student-home-hero .student-licence-card__title-copy h1 {
    font-size: 1.56rem;
    line-height: 1.06;
  }
  .student-home-hero .student-licence-card__title-copy .muted {
    font-size: 0.98rem;
    line-height: 1.35;
  }
  .student-home-hero .student-licence-card__hero,
  .student-home-hero .student-licence-card__status-grid,
  .student-home-hero .student-inline-metric-strip,
  .student-home-hero .student-inline-metric-strip--hero,
  .student-home-hero .student-metric-strip {
    gap: 8px;
  }
  .student-home-hero .student-licence-card__journey-meta {
    font-size: 0.88rem;
    line-height: 1.3;
  }
  .student-home-hero .student-licence-card__meter {
    gap: 10px;
  }
}
.mp-topbar {
  background: linear-gradient(180deg, #f6f4edf5, #f6f4edc7);
}
.mp-topbar__inner {
  box-shadow: 0 10px 24px #1f2f520f;
}
.student-shell__body,
.student-shell__body--with-nav {
  padding-top: 14px;
}
.student-home-page {
  gap: 18px;
}
.student-home-first-impression,
.student-home-summary-grid {
  align-items: stretch;
}
.student-home-onboarding-card,
.student-home-guide-card,
.student-home-glance-card,
.student-home-support-card--stacked {
  display: grid;
  gap: 16px;
}
.student-home-onboarding-card {
  padding: 22px;
}
.student-home-onboarding-card__header h1 {
  margin: 0;
  font-size: clamp(2rem, 2.8vw, 2.5rem);
  line-height: 1.02;
}
.student-home-onboarding-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.student-home-onboarding-meta .student-identity-chips {
  display: contents;
}
.student-home-onboarding-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-guide-card {
  padding: 20px;
}
.student-home-guide-steps {
  display: grid;
  gap: 10px;
}
.student-home-guide-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(103, 126, 255, 0.12);
  background: linear-gradient(180deg, #fffffff0, #f6f8ffe6);
}
.student-home-guide-step--primary {
  background: linear-gradient(180deg, #e7eefff0, #f3f6ffeb);
  border-color: #677eff2e;
}
.student-home-guide-step__index {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #677eff1f;
  color: var(--accent-strong);
  font-size: 0.86rem;
  font-weight: 800;
}
.student-home-guide-step__copy {
  display: grid;
  gap: 4px;
}
.student-home-guide-progress {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(103, 126, 255, 0.12);
  background: linear-gradient(180deg, #f8fafff2, #ffffffe6);
}
.student-home-guide-progress__badges {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-home-guide-progress__meter {
  display: grid;
  gap: 8px;
}
.student-home-guide-progress__head,
.student-home-guide-progress__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.student-home-guide-progress__head strong {
  font-size: 1rem;
}
.student-home-guide-progress__foot {
  font-size: 0.86rem;
}
.student-home-guide-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-home-choices-panel--onboarding,
.student-home-glance-card,
.student-home-support-card--stacked {
  padding: 20px;
}
.student-home-progress-strip--glance {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-support-divider {
  border-top: 1px solid rgba(31, 47, 82, 0.08);
  margin: 2px 0;
}
.student-home-support-minihead {
  display: grid;
  gap: 2px;
}
.student-home-class-summary {
  gap: 14px;
}
.student-home-class-summary__header {
  align-items: start;
}
.student-home-shell .student-card,
.student-home-shell .student-licence-card {
  box-shadow: 0 10px 26px #1f2f520d;
}
@media (max-width: 1080px) {
  .student-home-onboarding-metrics,
  .student-home-progress-strip--glance {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  .student-shell__body,
  .student-shell__body--with-nav {
    padding-top: 10px;
  }
  .student-home-first-impression,
  .student-home-summary-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .student-home-guide-progress__badges {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .student-home-page {
    gap: 14px;
  }
  .student-home-onboarding-card,
  .student-home-guide-card,
  .student-home-choices-panel--onboarding,
  .student-home-glance-card,
  .student-home-support-card--stacked {
    padding: 16px;
    gap: 14px;
  }
  .student-home-onboarding-card__header h1 {
    font-size: 1.85rem;
  }
  .student-home-onboarding-metrics,
  .student-home-progress-strip--glance,
  .student-home-choice-grid--triple {
    grid-template-columns: 1fr;
  }
  .student-home-guide-step {
    padding: 11px 12px;
  }
  .student-home-guide-progress {
    padding: 12px;
  }
}
@media (max-width: 560px) {
  .student-shell__body,
  .student-shell__body--with-nav {
    padding-top: 8px;
  }
  .student-home-onboarding-card,
  .student-home-guide-card,
  .student-home-choices-panel--onboarding,
  .student-home-glance-card,
  .student-home-support-card--stacked {
    padding: 14px;
  }
  .student-home-onboarding-card__header h1 {
    font-size: 1.68rem;
    line-height: 1.04;
  }
  .student-home-guide-progress__head,
  .student-home-guide-progress__foot,
  .student-home-class-summary__header {
    flex-direction: column;
    align-items: flex-start;
  }
  .student-home-guide-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
}
html[data-appearance="dark"] .mp-topbar,
html[data-theme="dark"] .mp-topbar,
body.theme-dark .mp-topbar {
  background: linear-gradient(180deg, #0c111ff5, #0c111fd1);
}
html[data-appearance="dark"] .student-home-guide-step,
html[data-theme="dark"] .student-home-guide-step,
body.theme-dark .student-home-guide-step,
html[data-appearance="dark"] .student-home-guide-progress,
html[data-theme="dark"] .student-home-guide-progress,
body.theme-dark .student-home-guide-progress {
  background: linear-gradient(180deg, #11182af0, #0b1222e6);
  border-color: #91aaff24;
}
html[data-appearance="dark"] .student-home-support-divider,
html[data-theme="dark"] .student-home-support-divider,
body.theme-dark .student-home-support-divider {
  border-color: #91aaff1f;
}
.student-shell,
.student-home-shell {
  --student-content-top-offset: clamp(8px, 1.2vw, 16px);
}
.student-shell__body,
.student-shell__body--with-nav {
  padding-top: var(--student-content-top-offset);
}
.student-section-hero--action-first {
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 20px 22px;
}
.student-section-hero__main--action-first,
.student-section-hero__copy--action-first {
  display: grid;
  gap: 14px;
}
.student-section-hero__copy--action-first h1 {
  margin: 6px 0 8px;
  line-height: 1.04;
}
.student-section-hero__meta-line {
  margin-top: 6px;
  font-size: 0.95rem;
  line-height: 1.4;
}
.student-section-hero__primary-action .student-action-row {
  background: linear-gradient(180deg, #e8f0fff0, #f5f8ffeb);
  border-color: #677eff33;
  box-shadow: 0 10px 24px #2535590d;
}
.student-action-row--hero {
  padding: 14px 16px;
}
.student-section-hero__actions-row,
.student-guided-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-section-hero__metrics--inline {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 2px;
}
.student-guided-layout {
  align-items: start;
}
.student-guided-card {
  display: grid;
  gap: 14px;
}
.student-guided-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-guided-card .student-card,
.student-guided-card .student-class-challenge-card {
  box-shadow: none;
}
.student-shell__body--runner {
  --student-content-top-offset: clamp(8px, 1vw, 12px);
}
.student-shell__body--runner .student-page-content--runner {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin-inline: 0;
}
.student-shell--focus-mode .student-shell__body,
.student-shell--focus-mode .student-shell__body--runner,
.student-shell--focus-mode .student-shell__body--with-nav {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: 0;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  padding-bottom: 20px;
}
.student-shell--focus-mode.student-shell--runner-shell {
  width: min(100%, 1700px);
  max-width: calc(100vw - var(--site-gutter) * 2);
  margin-inline: auto;
  padding-bottom: 0;
}
.student-shell--focus-mode .student-shell__body--runner {
  min-height: calc(var(--app-height) - var(--header-height));
  height: calc(var(--app-height) - var(--header-height));
  padding-bottom: 0;
  overflow: hidden;
}
.student-shell--focus-mode .student-shell__body--focus {
  overflow-x: hidden;
}
.student-shell--focus-mode .student-side-nav,
.student-shell--focus-mode .student-mobile-nav {
  display: none !important;
}
.student-page-content--focus-shell,
.student-focus-shell__body,
.student-focus-shell__runner,
.student-focus-shell__notice {
  display: grid;
  gap: 12px;
  min-width: 0;
  width: 100%;
}
.student-page-content--focus-shell {
  align-content: start;
  grid-auto-rows: max-content;
}
.student-focus-shell__runner > .student-page-content--runner {
  width: 100%;
  min-width: 0;
}
.student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__inner {
  width: 100%;
  max-width: none;
  grid-template-columns: minmax(0, 1fr);
  min-height: 52px;
  padding: 6px 16px 8px;
  column-gap: 0;
}
.student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__center,
.student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__right {
  display: none;
}
.student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__brand img,
.student-shell--focus-mode > .mp-topbar:first-child .topbar-brand-image {
  height: 28px;
  max-height: 28px;
  max-width: min(172px, 100%);
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-topbar__left {
  width: 100%;
  justify-content: flex-start;
  gap: 14px;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-topbar__left-slot {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-slot {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-progress {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-progress-stack {
  display: grid;
  gap: 4px;
  min-width: 0;
  flex: 1 1 auto;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-progress-meta {
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-progress-bar {
  min-width: 0;
  height: 8px;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-pill {
  min-height: 40px;
  padding: 7px 14px;
  font-size: 0.96rem;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: max-content;
  flex: 0 0 auto;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--line-default);
  border-radius: 16px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  color: var(--text-strong);
  box-shadow: var(--shadow-sm);
  line-height: 1;
  cursor: pointer;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action:hover {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 30%,
    var(--line-default) 70%
  );
  background: var(--bg-hover);
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action:focus-visible {
  outline: 2px solid var(--brand-500);
  outline-offset: 2px;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action--danger {
  color: var(--danger-700, #b42318);
  border-color: color-mix(
    in srgb,
    var(--danger-700, #b42318) 24%,
    var(--line-default) 76%
  );
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action__icon {
  display: block;
  width: 20px;
  height: 20px;
  max-width: 20px;
  max-height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 20px;
}
.student-shell--focus-mode
  > .mp-topbar.mp-topbar--runner-focus:first-child
  .mp-runner-topbar-action
  span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 720px) {
  .student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__inner {
    min-height: 48px;
    padding: 4px 10px 6px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-slot {
    gap: 8px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-progress {
    gap: 6px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-progress-stack {
    gap: 2px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-pill {
    min-height: 36px;
    padding: 6px 10px;
    font-size: 0.88rem;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-actions {
    gap: 4px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-action {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    border-radius: 14px;
  }
}
.student-focus-shell__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: min(100%, var(--runner-shell-max-width, 1480px));
  margin: 0 auto;
  padding: 0 4px;
}
.student-focus-shell__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-focus-shell__meta {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.student-page-content--completion-focus {
  width: min(100%, 1100px);
  margin: 0 auto;
  display: grid;
  gap: 10px;
  align-content: start;
}
.student-page-content--completion-focus .student-completion-card,
.student-page-content--completion-focus .student-completion-card--refined {
  margin-top: 0;
}
@media (max-width: 1180px) {
  .student-side-nav {
    position: static;
    top: auto;
    z-index: 1;
  }
  .student-shell__body,
  .student-shell__body--with-nav {
    gap: 10px;
  }
}
@media (max-width: 1080px) {
  .student-section-hero__metrics--inline,
  .student-guided-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px) {
  .student-shell__body--runner {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .student-shell__body--runner .student-side-nav {
    display: none;
  }
  .student-shell__body--runner .student-page-content--runner .runner-shell-v2 {
    padding-inline: 0;
  }
  .student-shell__body--runner .runner-header-v2 {
    padding-inline: 2px;
  }
  .student-shell__body--runner .runner-question-card-v2 {
    border-radius: 20px;
  }
  .student-shell__body--runner .runner-answer-panel-v2 {
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 0;
    padding: 0;
    overflow: hidden;
  }
  .student-shell__body--runner .runner-answer-stage-v2,
  .student-shell__body--runner .runner-answer-stack-v2 {
    width: min(100%, 100%);
  }
  .student-shell__body--runner .runner-rail-card-v2 {
    gap: 10px;
    padding: 10px;
  }
  .student-shell__body--runner .runner-actions-v2--rail > .btn,
  .student-shell__body--runner .runner-actions-v2--rail .btn {
    min-height: 42px;
  }
}
@media (max-width: 720px) {
  .student-section-hero--action-first {
    padding: 16px;
  }
  .student-section-hero__actions-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-section-hero__metrics--inline,
  .student-guided-strip {
    grid-template-columns: 1fr;
  }
  .student-guided-card {
    gap: 12px;
  }
  .student-shell__body--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    input,
  .student-shell__body--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    textarea,
  .student-shell__body--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    [data-answer-input] {
    min-height: 68px;
    padding: 14px 16px;
    font-size: clamp(1rem, 5.4vw, 1.3rem);
    border-radius: 18px;
  }
  .student-shell__body--runner .runner-rail-card-v2--keyboard,
  .student-shell__body--runner .runner-rail-card-v2--actions {
    padding: 10px;
  }
}
@media (max-width: 560px) {
  .student-section-hero--action-first {
    padding: 14px;
  }
  .student-section-hero__copy--action-first h1 {
    font-size: 1.72rem;
  }
  .student-section-hero__actions-row {
    grid-template-columns: 1fr;
  }
  .student-action-row,
  .student-compact-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .student-compact-row__meta {
    justify-content: flex-start;
  }
  .student-shell__body--runner .runner-question-card-v2 {
    padding: 14px;
  }
  .student-shell__body--runner .runner-question-card-v2 .runner-prompt__main {
    font-size: clamp(1.55rem, 10vw, 2.4rem);
  }
  .student-shell__body--runner .runner-question-card-v2 .runner-answer-format,
  .student-shell__body--runner .runner-question-card-v2 .runner-answer-field {
    gap: 6px;
  }
}
.student-home-focus-card,
.student-view-card,
.student-manual-card,
.student-home-choices-panel--compact,
.student-home-glance-card--compact,
.student-guided-layout--tight > .student-card,
.student-card--inner {
  border-radius: 28px;
}
.student-home-focus-card .section-header,
.student-view-card > .section-header,
.student-guided-card .section-header,
.student-home-choices-panel--compact .section-header,
.student-home-glance-card--compact .section-header {
  margin-bottom: 16px;
}
.student-home-focus-card__header h1,
.student-section-hero__copy--action-first h1 {
  max-width: 13ch;
}
.student-home-mini-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 16px;
}
.student-home-primary-grid,
.student-home-summary-grid,
.student-guided-layout--tight {
  align-items: start;
}
.student-home-focus-card .student-home-mission,
.student-home-focus-card .student-home-mission__inner {
  margin-top: 0;
}
.student-home-focus-card .student-home-mission {
  margin-bottom: 16px;
}
.student-inline-metric-strip--focus,
.student-inline-metric-strip--board {
  margin-top: 8px;
}
.student-home-choices-panel--compact .student-home-choice-grid,
.student-home-choice-grid--triple {
  gap: 16px;
}
.student-view-card {
  padding-top: 18px;
}
.student-view-card .student-segmented--views {
  margin-bottom: 16px;
}
.student-view-panels {
  display: grid;
  gap: 18px;
}
.student-view-panel[hidden] {
  display: none !important;
}
.student-card--inner {
  border: 1px solid rgba(44, 56, 95, 0.08);
  box-shadow: none;
}
.student-guided-layout--tight {
  gap: 18px;
}
.student-home-glance-card--compact .student-home-class-summary {
  margin-top: 16px;
}
.student-manual-card .student-preset-list {
  margin-bottom: 14px;
}
.student-more-options--panel {
  width: 100%;
}
.student-more-options--panel > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding-block: 6px;
}
.student-shell .btn.btn-compact,
.student-shell .btn-compact,
.student-more-options--panel > summary.btn-compact,
.portal-puzzle-codebreaker__key.btn-compact,
.portal-puzzle-codebreaker__composer .btn.btn-compact {
  min-height: 44px;
}
.student-more-options--panel > summary::-webkit-details-marker {
  display: none;
}
.student-more-options--panel[open] {
  padding-top: 6px;
}
.student-compact-form--focus .student-form-grid--core {
  margin-bottom: 14px;
}
.student-compact-form--focus .button-row {
  margin-top: 14px;
}
.student-section-hero--action-first {
  gap: 18px;
}
.student-section-hero__copy--action-first > div:first-child p.muted {
  max-width: 56ch;
}
.student-section-hero__actions-row {
  row-gap: 10px;
}
.student-guided-card--plain-text .student-inline-metric-strip,
.student-guided-card--plain-text .student-inline-metric-strip--hero,
.student-class-board-card--summary .student-class-challenge-card {
  margin-top: 10px;
}
.student-home-support-card--stacked .student-compact-list,
.student-guided-card .student-compact-list {
  gap: 12px;
}
.student-home-support-card--stacked .student-home-support-minihead {
  margin-bottom: 12px;
}
.student-shell__body > .student-card,
.student-shell__body > .layout-split {
  scroll-margin-top: 132px;
}
@media (min-width: 981px) {
  .student-home-primary-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
  }
  .student-home-summary-grid,
  .student-guided-layout--tight.student-portal-columns-2-1 {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  }
  .student-view-card--competition
    .student-guided-layout--tight.student-portal-columns-2-1 {
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  }
  .student-home-focus-card {
    padding: 22px 22px 20px;
  }
  .student-home-focus-card .student-home-mission__inner {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}
@media (max-width: 980px) {
  .student-home-focus-card__header h1,
  .student-section-hero__copy--action-first h1 {
    max-width: none;
  }
  .student-home-primary-grid,
  .student-home-summary-grid,
  .student-guided-layout--tight,
  .student-view-card .layout-split {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .student-home-focus-card,
  .student-home-choices-panel--compact,
  .student-home-glance-card--compact,
  .student-view-card,
  .student-guided-card,
  .student-card--inner {
    border-radius: 24px;
  }
  .student-section-hero__copy--action-first p.muted,
  .student-card .section-header p.muted {
    font-size: 0.98rem;
    line-height: 1.5;
  }
  .student-card .section-header p.muted {
    margin-top: 6px;
  }
  .student-home-mini-steps {
    gap: 8px;
    margin: 12px 0 14px;
  }
  .student-home-mini-steps .student-pill:nth-child(n + 3) {
    display: none;
  }
  .student-home-choice-grid--triple {
    grid-template-columns: 1fr;
  }
  .student-view-card {
    padding: 16px;
  }
  .student-view-card .student-segmented,
  .student-view-card .student-segmented--views {
    overflow-x: auto;
    padding-bottom: 2px;
  }
  .student-view-card .student-segmented__button {
    white-space: nowrap;
  }
  .student-compact-form--focus .student-form-grid,
  .student-compact-form--focus .card-grid,
  .student-compact-form--focus .selector-row {
    grid-template-columns: 1fr;
  }
  .student-manual-card .student-more-options--panel > summary,
  .student-view-card .student-more-options--panel > summary {
    width: 100%;
  }
  .runner-header-v2 {
    padding: 14px 14px 12px;
    gap: 12px;
  }
  .runner-question-card-v2,
  .runner-rail-card-v2 {
    padding: 16px;
    border-radius: 26px;
  }
  .runner-question-card-v2 .runner-answer-stack-v2 input,
  .runner-question-card-v2 .runner-answer-stack-v2 textarea,
  .runner-question-card-v2 .runner-answer-stack-v2 [data-answer-input] {
    min-height: 76px;
    font-size: clamp(1.7rem, 4.9vw, 2rem);
  }
  .runner-actions-v2--rail > .btn,
  .runner-actions-v2--rail .btn {
    min-height: 52px;
  }
}
.student-section-hero {
  gap: 14px;
  padding: 16px 18px;
}
.student-section-hero__main,
.student-section-hero__copy {
  gap: 10px;
}
.student-section-hero__copy h1 {
  margin: 4px 0 6px;
}
.student-section-hero__metrics--inline {
  gap: 10px;
}
.student-section-hero__actions-row,
.student-guided-links,
.student-view-panels,
.student-guided-layout--tight,
.student-home-primary-grid,
.student-home-summary-grid {
  gap: 14px;
}
.student-home-focus-card,
.student-view-card,
.student-guided-card,
.student-home-choices-panel--compact,
.student-home-glance-card--compact,
.student-card--inner {
  padding: 18px;
}
.student-home-focus-card .section-header,
.student-view-card > .section-header,
.student-guided-card .section-header,
.student-home-choices-panel--compact .section-header,
.student-home-glance-card--compact .section-header {
  margin-bottom: 10px;
}
.student-home-mini-steps {
  gap: 8px;
  margin: 10px 0 12px;
}
.student-home-choice-grid--triple,
.student-guided-card .student-compact-list,
.student-home-support-card--stacked .student-compact-list,
.student-action-stack {
  gap: 10px;
}
.student-action-row,
.student-compact-row {
  padding: 12px 14px;
}
.student-action-row__copy {
  gap: 4px;
}
.student-manual-presets {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.student-manual-presets .btn {
  width: 100%;
}
.student-manual-hint {
  margin-top: -2px;
}
.student-manual-card .student-more-options--panel[open] {
  padding-top: 2px;
}
.student-manual-card .student-compact-form--focus .student-form-grid--core {
  margin-bottom: 10px;
}
.student-view-card {
  padding-top: 16px;
}
.student-view-card .student-segmented--views {
  margin-bottom: 12px;
}
.student-filter-block .student-compact-list[data-filter-limit] {
  gap: 10px;
}
.student-page-content--runner {
  min-height: 0;
}
.student-page-content--runner
  .runner-shell-v2:not([data-runner-form-factor="touch-stack"]) {
  --runner-shell-max-width: 1700px;
  gap: 10px;
  margin-top: 4px;
  padding: 6px 4px 10px;
  min-height: calc(100dvh - clamp(20px, 6dvh, 108px));
  height: calc(100dvh - clamp(20px, 6dvh, 108px));
  max-height: none;
  align-content: stretch;
  align-items: stretch;
  overflow: visible;
}
.student-shell__body--runner {
  grid-template-columns: minmax(156px, 176px) minmax(0, 1fr);
}
.student-page-content--runner
  .runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr) minmax(
      320px,
      var(--runner-answer-dock-width, 420px)
    );
  gap: 10px;
  min-height: 0;
  height: 100%;
  max-height: none;
}
.runner-status-v2 {
  min-height: 68px;
  gap: 10px;
  padding: 8px 12px;
}
.runner-header-pill-v2 {
  min-height: 44px;
  padding: 8px 14px;
}
.runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-question-card-v2,
.student-page-content--runner
  .runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-question-card-v2 {
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
  min-height: 0;
  max-height: 100%;
  height: 100%;
  padding: 14px 14px 16px;
  overflow: hidden;
}
.runner-question-head-v2 {
  gap: 10px;
}
.runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-question-body-v2,
.student-page-content--runner
  .runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-question-body-v2 {
  gap: 12px;
  overflow: clip;
  overscroll-behavior: auto;
  padding-right: 0;
}
.runner-question-stage-v2 {
  gap: 10px;
  width: min(100%, var(--runner-content-stage-max, 980px));
}
.runner-answer-stage-v2 {
  width: min(100%, min(var(--runner-content-stage-max, 980px), 980px));
}
.runner-question-card-v2 .runner-question-stage-v2 > .runner-prompt {
  position: static;
  padding-bottom: 0;
  background: none;
}
.runner-question-card-v2 .runner-prompt {
  gap: 8px;
}
.runner-question-card-v2 .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.7rem, 2.5vw, 2.7rem);
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--choice .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--shape-choice
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  font-size: clamp(1.3rem, 1.85vw, 2rem);
}
.runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-shell-v2:not([data-runner-form-factor="touch-stack"])
  .runner-visual-panel-v2 {
  min-height: 0;
  max-height: 100%;
  overflow: clip;
  align-content: center;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-compact-typed {
  min-height: 0;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid {
  min-height: clamp(220px, 30vh, 420px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--coordinate-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--transformation-grid {
  min-height: clamp(280px, 38vh, 540px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-visual-panel-v2 {
  min-height: clamp(160px, 22vh, 280px);
  padding: 10px 12px;
}
.student-page-content--runner .runner-rail-card-v2,
.student-page-content--runner .runner-rail-card-v2--actions {
  gap: 8px;
  padding: 10px;
}
.student-page-content--runner .runner-actions-v2--rail {
  gap: 6px;
}
.student-page-content--runner .runner-actions-v2--rail > .btn,
.student-page-content--runner .runner-actions-v2--rail .btn {
  min-height: 42px;
}
.runner-hint,
.runner-worked {
  margin-top: 2px;
}
.student-home-page {
  gap: 16px;
}
.student-home-focus-card,
.student-view-card,
.student-guided-card,
.student-home-choices-panel--compact,
.student-home-glance-card--compact,
.student-card--inner {
  padding: 16px;
}
.student-home-focus-card {
  padding-bottom: 14px;
}
.student-home-mini-steps {
  gap: 8px;
  margin: 8px 0 10px;
}
.student-home-mission__card {
  align-items: start;
  min-height: 0;
  gap: 14px;
  padding: 16px;
}
.student-home-mission__cta {
  min-width: 132px;
  min-height: 44px;
  align-self: start;
}
.student-home-choice-grid--triple,
.student-guided-card .student-compact-list,
.student-home-support-card--stacked .student-compact-list,
.student-action-stack {
  gap: 8px;
}
.student-home-choice {
  padding: 14px;
  gap: 6px;
}
.student-home-choice strong {
  font-size: 1rem;
}
.student-home-primary-grid,
.student-home-summary-grid,
.student-guided-layout--tight {
  gap: 12px;
}
.student-home-glance-card--compact .student-home-class-summary {
  margin-top: 12px;
}
.student-home-support-card--stacked .student-home-support-minihead {
  margin-bottom: 8px;
}
.student-practice-layout,
.student-competition-stack {
  display: grid;
  gap: 12px;
}
.student-manual-card .student-more-options--panel > summary {
  min-width: 0;
}
.student-manual-presets {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-manual-card .student-compact-form {
  gap: 10px;
}
.student-view-card--competition .student-view-panels {
  gap: 14px;
}
.student-inline-metric-strip--board {
  margin-top: 10px;
}
@media (min-width: 981px) {
  .student-home-primary-grid {
    grid-template-columns: minmax(0, 1.14fr) minmax(320px, 0.86fr);
  }
  .student-home-summary-grid,
  .student-guided-layout--tight.student-portal-columns-2-1,
  .student-view-card--competition
    .student-guided-layout--tight.student-portal-columns-2-1 {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
  }
}
@media (max-width: 1100px) {
  .student-shell__body--runner,
  .student-page-content--runner .runner-stage-v2 {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .student-section-hero {
    padding: 14px;
  }
  .student-home-focus-card,
  .student-view-card,
  .student-guided-card,
  .student-home-choices-panel--compact,
  .student-home-glance-card--compact,
  .student-card--inner {
    padding: 16px;
  }
  .student-manual-presets {
    grid-template-columns: 1fr;
  }
  .student-page-content--runner .runner-shell-v2 {
    padding: 4px 0 10px;
  }
  .student-home-mission__card {
    grid-template-columns: 1fr;
  }
  .student-home-mission__cta {
    width: 100%;
  }
}
.student-home-page--v18-8-52 {
  gap: 12px;
}
.student-home-primary-grid--v18-8-52,
.student-home-summary-grid--v18-8-52 {
  gap: 12px;
  align-items: start;
}
.student-home-focus-card--v18-8-52,
.student-home-glance-card--v18-8-52 {
  padding: 14px;
}
.student-home-focus-card--v18-8-52 .section-header {
  margin-bottom: 8px;
}
.student-home-focus-card__header h1 {
  max-width: 11ch;
  margin: 2px 0 4px;
  line-height: 1.02;
}
.student-home-focus-card--v18-8-52 .student-home-mission__card {
  gap: 12px;
  padding: 14px;
  border-radius: 24px;
}
.student-home-focus-card--v18-8-52 .student-home-mission__copy {
  gap: 6px;
}
.student-home-focus-card--v18-8-52 .student-home-mission__copy strong {
  font-size: clamp(1.26rem, 2vw, 1.6rem);
  line-height: 1.12;
}
.student-home-focus-card--v18-8-52 .student-home-mission__copy .muted {
  font-size: 0.98rem;
  line-height: 1.4;
}
.student-home-focus-card--v18-8-52 .student-home-mission__chips {
  gap: 6px;
}
.student-home-focus-card--v18-8-52 .student-home-mission__cta {
  min-width: 124px;
  min-height: 44px;
}
.student-home-quick-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.student-home-quick-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(44, 56, 95, 0.12);
  background: #ffffffbd;
  color: var(--text-strong);
  text-decoration: none;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.2;
  box-shadow: none;
}
.student-home-quick-link:hover,
.student-home-quick-link:focus-visible {
  transform: translateY(-1px);
}
.student-home-quick-link--primary {
  background: #677eff1f;
  border-color: #677eff2e;
}
.student-home-glance-card--v18-8-52 .section-header {
  margin-bottom: 8px;
}
.student-home-glance-card--v18-8-52 .student-inline-metric-strip--home-glance {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.student-home-glance-card--v18-8-52 .student-inline-metric {
  padding: 10px 12px;
  min-height: 0;
}
.student-home-glance-card--v18-8-52 .student-home-class-summary {
  margin-top: 10px;
}
.student-home-class-summary--compact {
  gap: 10px;
}
.student-home-class-summary--compact .student-home-class-summary__header {
  align-items: center;
}
.student-home-class-summary--compact .student-home-class-summary__challenge {
  padding-top: 0;
}
.student-home-class-summary__compact-gaps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.student-home-class-summary__compact-gaps .student-pill {
  min-height: 28px;
  font-size: 0.78rem;
  padding: 5px 10px;
}
.student-home-summary-grid--v18-8-52 .student-home-support-card {
  padding: 14px;
}
.student-home-summary-grid--v18-8-52 .section-header {
  margin-bottom: 8px;
}
.student-home-summary-grid--v18-8-52 .student-compact-row {
  padding: 10px 12px;
}
.student-home-summary-grid--v18-8-52 .student-home-support-divider {
  margin: 8px 0;
}
@media (min-width: 981px) {
  .student-home-primary-grid--v18-8-52 {
    grid-template-columns: minmax(0, 1.34fr) minmax(300px, 0.78fr);
  }
  .student-home-summary-grid--v18-8-52 {
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  }
}
@media (max-width: 980px) {
  .student-home-primary-grid--v18-8-52,
  .student-home-summary-grid--v18-8-52 {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .student-home-page--v18-8-52 {
    gap: 10px;
  }
  .student-home-focus-card--v18-8-52,
  .student-home-glance-card--v18-8-52,
  .student-home-summary-grid--v18-8-52 .student-home-support-card {
    padding: 12px;
    border-radius: 22px;
  }
  .student-home-focus-card__header h1 {
    max-width: none;
    font-size: clamp(1.95rem, 8vw, 2.55rem);
    margin-bottom: 2px;
  }
  .student-home-focus-card__context {
    font-size: 0.9rem;
  }
  .student-home-focus-card--v18-8-52 .student-home-mission__card {
    padding: 12px;
    gap: 10px;
  }
  .student-home-focus-card--v18-8-52 .student-home-mission__copy strong {
    font-size: clamp(1.15rem, 5.4vw, 1.46rem);
  }
  .student-home-focus-card--v18-8-52 .student-home-mission__copy .muted {
    font-size: 0.96rem;
  }
  .student-home-quick-links {
    grid-template-columns: 1fr;
    gap: 6px;
    margin-top: 8px;
  }
  .student-home-quick-link {
    justify-content: flex-start;
    min-height: 40px;
    padding: 9px 12px;
  }
  .student-home-glance-card--v18-8-52
    .student-inline-metric-strip--home-glance {
    grid-template-columns: 1fr 1fr;
  }
  .student-home-class-summary--compact .student-home-class-summary__header {
    gap: 8px;
  }
  .student-home-class-summary__compact-gaps {
    gap: 5px;
  }
}
@media (max-width: 560px) {
  .student-home-focus-card--v18-8-52,
  .student-home-glance-card--v18-8-52,
  .student-home-summary-grid--v18-8-52 .student-home-support-card {
    padding: 12px 12px 11px;
  }
  .student-home-focus-card__header h1 {
    font-size: clamp(1.74rem, 7.6vw, 2.18rem);
  }
  .student-home-glance-card--v18-8-52
    .student-inline-metric-strip--home-glance {
    grid-template-columns: 1fr;
  }
  .student-home-glance-card--v18-8-52 .student-inline-metric {
    padding: 9px 10px;
  }
}
html[data-appearance="dark"] .student-home-quick-link,
body.theme-dark .student-home-quick-link {
  background: #11182aeb;
  border-color: #91aaff24;
  color: #f8fafff5;
}
html[data-appearance="dark"] .student-home-quick-link--primary,
body.theme-dark .student-home-quick-link--primary {
  background: #677eff2e;
}
.student-shell__body {
  gap: 18px;
}
.student-card--compact {
  padding: 16px 18px;
  gap: 14px;
}
.student-section-hero {
  gap: 12px;
  padding: 14px 16px;
  border-radius: 22px;
}
.student-section-hero__main {
  gap: 10px;
}
.student-section-hero__copy {
  gap: 8px;
}
.student-section-hero__copy h1 {
  margin: 4px 0 2px;
  font-size: clamp(2rem, 3.1vw, 2.55rem);
}
.student-section-hero__copy p {
  margin: 0;
  max-width: 58ch;
}
.student-section-hero__meta-line,
.student-home-focus-card__context {
  font-size: 0.9rem;
}
.student-section-hero__actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-inline-metric-strip {
  gap: 8px;
  margin-top: 8px;
}
.student-inline-metric {
  padding: 8px 10px;
  border-radius: 16px;
}
.student-inline-metric__value {
  font-size: 0.96rem;
}
.student-inline-metric__meta,
.student-inline-metric__label {
  line-height: 1.2;
}
.student-action-row,
.student-compact-row {
  padding: 10px 12px;
  gap: 10px;
  border-radius: 16px;
}
.student-action-row__copy,
.student-compact-row__main {
  gap: 1px;
}
.student-action-row__copy strong,
.student-compact-row__main strong {
  font-size: 1rem;
}
.student-compact-row__main .muted.small,
.student-action-row__copy .muted.small {
  line-height: 1.26;
}
.student-pill {
  min-height: 24px;
  padding: 2px 8px;
}
.student-compact-list {
  display: grid;
  gap: 8px;
}
.student-view-card,
.student-filter-block,
.student-guided-card,
.student-class-board-card,
.student-home-support-card,
.student-home-glance-card,
.student-home-focus-card {
  min-height: 0;
}
.student-home-focus-card__topline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.56fr);
  gap: 12px;
  align-items: start;
}
.student-home-focus-card__topline h1 {
  margin: 4px 0 2px;
  font-size: clamp(2rem, 3vw, 2.45rem);
}
.student-home-mission__card {
  min-height: 0;
  padding: 14px 16px;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.student-home-mission__copy {
  gap: 6px;
}
.student-home-mission__copy .muted {
  max-width: 48ch;
}
.student-home-mission__chips {
  gap: 8px;
}
.student-home-quick-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.student-home-quick-link {
  min-height: 0;
  padding: 10px 12px;
  border-radius: 16px;
}
.student-home-summary-list .student-compact-row .btn,
.student-home-support-card .student-compact-row .btn {
  min-width: 0;
}
.student-home-summary-grid--v18-8-53 {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.64fr);
  align-items: start;
}
.student-practice-layout--v18-8-53 {
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.76fr);
  align-items: start;
}
.student-action-stack--dense {
  gap: 8px;
}
.student-guided-card--quick-lane .student-inline-links {
  margin-top: 2px;
}
.student-manual-presets--compact {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.student-manual-card .student-more-options > summary,
.student-guided-card .student-more-options > summary {
  margin-bottom: 0;
}
.student-form-grid--compact {
  gap: 10px 12px;
}
.student-view-card--competition-v18-8-53 .student-view-panels {
  margin-top: 10px;
}
.student-competition-preview-card .student-compact-list {
  gap: 8px;
}
.student-class-board-card .section-header,
.student-guided-card .section-header,
.student-filter-block .section-header,
.student-home-support-card .section-header,
.student-home-glance-card .section-header,
.student-home-focus-card .section-header {
  margin-bottom: 0;
}
.student-filter-block .student-segmented,
.student-view-card .student-segmented {
  margin-top: 2px;
}
.student-segmented {
  gap: 8px;
}
.student-segmented__button {
  min-height: 34px;
  padding: 7px 14px;
}
.student-compact-row--skill .muted.small,
.student-compact-row--history .muted.small {
  max-width: 80ch;
}
@media (min-width: 1280px) {
  .student-shell__body,
  .student-shell__body--with-nav {
    padding-inline: 16px 20px;
  }
  .student-portal-columns-2-1,
  .student-home-primary-grid--v18-8-53 {
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  }
}
@media (max-width: 980px) {
  .student-home-focus-card__topline,
  .student-practice-layout--v18-8-53,
  .student-home-summary-grid--v18-8-53,
  .student-portal-columns-2-1,
  .student-home-quick-links,
  .student-manual-presets--compact {
    grid-template-columns: minmax(0, 1fr);
  }
  .student-section-hero,
  .student-card--compact {
    padding: 14px;
  }
  .student-home-mission__card {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
  .student-home-mission__cta {
    width: 100%;
  }
}
@media (max-width: 720px) {
  .student-shell__body,
  .student-shell__body--with-nav {
    gap: 14px;
  }
  .student-section-hero {
    padding: 12px;
  }
  .student-section-hero__copy h1,
  .student-home-focus-card__topline h1 {
    font-size: clamp(1.75rem, 9vw, 2.2rem);
    line-height: 1.02;
  }
  .student-inline-metric-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-action-row,
  .student-compact-row {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
  .student-compact-row__meta,
  .student-action-row .btn,
  .student-compact-row .btn,
  .student-section-hero__actions-row .btn {
    width: 100%;
    justify-content: center;
  }
  .student-home-quick-link {
    justify-content: center;
  }
  .student-home-quick-links {
    gap: 8px;
  }
  .student-segmented {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.student-section-hero--action-first {
  gap: 12px;
  padding: 14px 16px;
}
.student-section-hero--action-first .student-section-hero__main,
.student-section-hero--action-first .student-section-hero__metrics,
.student-section-hero--action-first .student-section-hero__secondary-actions {
  gap: 10px;
}
.student-section-hero--action-first .student-metric-chip {
  min-height: 0;
  padding: 8px 10px;
}
.student-section-hero--action-first .student-metric-chip__value {
  font-size: 1rem;
}
.student-home-primary-grid--v18-8-53 {
  grid-template-columns: minmax(0, 1.16fr) minmax(280px, 0.74fr);
  gap: 12px;
}
.student-home-summary-grid--v18-8-53 {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.56fr);
  gap: 12px;
}
.student-home-focus-card--v18-8-53,
.student-home-glance-card--v18-8-53,
.student-home-support-card {
  gap: 12px;
}
.student-home-quick-links {
  gap: 8px;
}
.student-home-quick-link {
  padding: 9px 10px;
}
.student-home-support-card--later .student-compact-list,
.student-home-support-card .student-compact-list,
.student-home-summary-list {
  gap: 6px;
}
.student-practice-layout--v18-8-53 {
  grid-template-columns: minmax(0, 1.18fr) minmax(300px, 0.62fr);
  gap: 12px;
}
.student-manual-card--v18-8-54 {
  gap: 10px;
  align-content: start;
}
.student-inline-note {
  margin-top: 2px;
}
.student-manual-card--v18-8-54 .student-more-options--panel > summary {
  width: fit-content;
}
.student-manual-card--v18-8-54 .student-compact-form {
  gap: 10px;
}
.student-manual-card--v18-8-54 .student-form-grid--core {
  gap: 10px 12px;
}
.student-guided-card--quick-lane .student-action-stack--dense,
.student-progress-card--v18-8-54 .student-action-stack,
.student-history-card--v18-8-54 .student-compact-list,
.student-official-pack-list {
  gap: 6px;
}
.student-view-card--competition-v18-8-53 {
  gap: 10px;
}
.student-view-card--competition-v18-8-53 .student-view-panels {
  margin-top: 8px;
}
.student-view-card--competition-v18-8-53
  .student-view-panel[data-view-value="sprint"]
  .student-portal-columns-2-1 {
  grid-template-columns: minmax(0, 1.14fr) minmax(280px, 0.7fr);
}
.student-competition-preview-card,
.student-live-layout--v18-8-54 > .student-card,
.student-bookwork-layout--v18-8-54 > .student-card {
  align-self: start;
}
.student-live-layout--v18-8-54,
.student-bookwork-layout--v18-8-54 {
  gap: 12px;
}
.student-live-layout--v18-8-54 .student-action-stack,
.student-bookwork-layout--v18-8-54 .student-action-stack {
  gap: 8px;
}
.student-progress-card--v18-8-54 .student-view-panels,
.student-history-card--v18-8-54,
.student-card--official-catalog,
.student-card--official-list {
  gap: 10px;
}
.student-compact-row--dense,
.student-compact-row--history,
.student-compact-row--skill,
.student-compact-row--official,
.student-action-row--dense {
  padding-top: 10px;
  padding-bottom: 10px;
}
.student-compact-row--history .muted.small,
.student-compact-row--skill .muted.small,
.student-compact-row--official .muted.small {
  line-height: 1.35;
}
.student-card--official-catalog .section-header,
.student-card--official-list .section-header {
  margin-bottom: 0;
}
.student-official-recommended-row {
  margin-top: 4px;
  padding-block: 10px;
  border-radius: 16px;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 520px);
  align-items: center;
}
.student-official-pack-list .student-compact-row__meta {
  gap: 8px;
}
.student-official-pack-list .student-compact-row__main,
.student-official-recommended-row .student-action-row__copy {
  gap: 4px;
}
.student-official-pack-meta,
.student-official-recommended-meta,
.student-official-pack-status__meta {
  line-height: 1.2;
}
.student-official-pack-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin-top: 2px;
}
.student-official-recommended-row .eyebrow {
  margin-bottom: 1px;
}
.student-official-recommended-row strong {
  line-height: 1.14;
}
.student-official-pack-list .button-row {
  justify-content: flex-end;
}
@media (min-width: 1280px) {
  .student-home-primary-grid--v18-8-53 {
    grid-template-columns: minmax(0, 1.18fr) minmax(300px, 0.72fr);
  }
  .student-home-summary-grid--v18-8-53 {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.52fr);
  }
  .student-practice-layout--v18-8-53 {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.6fr);
  }
}
@media (max-width: 980px) {
  .student-home-primary-grid--v18-8-53,
  .student-home-summary-grid--v18-8-53,
  .student-practice-layout--v18-8-53,
  .student-view-card--competition-v18-8-53
    .student-view-panel[data-view-value="sprint"]
    .student-portal-columns-2-1,
  .student-live-layout--v18-8-54,
  .student-bookwork-layout--v18-8-54,
  .student-official-recommended-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .student-official-pack-list .button-row {
    justify-content: flex-start;
  }
}
@media (max-width: 560px) {
  .mp-topbar:not(.mp-topbar--signed-in) .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "left right" "center center";
    align-items: start;
    row-gap: 8px;
    column-gap: 10px;
  }
  .mp-topbar:not(.mp-topbar--signed-in) .mp-topbar__right,
  .mp-topbar:not(.mp-topbar--signed-in) .mp-topbar__right--signed-out {
    width: auto;
    justify-self: end;
  }
  .mp-topbar:not(.mp-topbar--signed-in) .mp-topbar__right--signed-out {
    display: grid;
    grid-template-columns: auto;
    justify-items: end;
    row-gap: 8px;
  }
  .mp-topbar:not(.mp-topbar--signed-in)
    .mp-topbar__right--signed-out
    .mp-topbar__utility-pill {
    justify-content: flex-end;
    gap: 6px;
  }
  .mp-topbar:not(.mp-topbar--signed-in) .mp-public-auth-actions {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mp-topbar:not(.mp-topbar--signed-in)
    .mp-public-auth-actions
    .mp-inline-link--button {
    min-height: 44px;
    padding-inline: 12px;
    font-size: 0.98rem;
  }
}
@media (max-width: 420px) {
  .mp-topbar:not(.mp-topbar--signed-in) .mp-topbar__inner {
    padding-inline: 10px;
  }
  .mp-topbar:not(.mp-topbar--signed-in) .topbar-brand-image,
  .mp-topbar:not(.mp-topbar--signed-in) .mp-topbar__brand img {
    max-width: min(156px, 100%);
    height: 32px;
  }
  .mp-topbar:not(.mp-topbar--signed-in) .mp-public-auth-actions {
    gap: 6px;
  }
}
.student-page-content--runner,
.student-page-content--runner .runner-shell-v2,
.student-page-content--runner .runner-stage-v2,
.student-page-content--runner .runner-question-card-v2,
.student-page-content--runner .runner-question-body-v2,
.student-page-content--runner .runner-answer-panel-v2,
.student-page-content--runner .runner-answer-stage-v2,
.student-page-content--runner .runner-answer-stack-v2,
.student-page-content--runner .runner-side-rail-v2 {
  min-width: 0;
}
@media (max-width: 820px) {
  .student-page-content--runner {
    overflow-x: clip;
  }
  .student-page-content--runner .runner-shell-v2 {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }
  .student-page-content--runner .runner-status-v2,
  .student-page-content--runner .runner-header-v2,
  .student-page-content--runner .runner-question-body-v2,
  .student-page-content--runner .runner-question-stage-v2,
  .student-page-content--runner .runner-answer-stage-v2,
  .student-page-content--runner .runner-answer-stack-v2,
  .student-page-content--runner .runner-side-rail-v2,
  .student-page-content--runner .runner-rail-card-v2,
  .student-page-content--runner .runner-actions-v2,
  .student-page-content--runner .runner-actions-v2__inline,
  .student-page-content--runner .runner-actions-v2__group,
  .student-page-content--runner .options-grid[data-option-grid] {
    width: 100%;
    max-width: 100%;
  }
  .student-page-content--runner .runner-question-card-v2,
  .student-page-content--runner .runner-rail-card-v2 {
    overflow-x: clip;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .options-grid[data-option-grid],
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .options-grid[data-option-grid],
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .options-grid[data-option-grid] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 100%;
    justify-content: stretch;
    gap: 10px;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .option-chip--tile,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .option-chip--single,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .option-chip--tile,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .option-chip--single,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .option-chip--tile,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .option-chip--single {
    min-height: 74px;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .option-chip--tile
    > span,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .option-chip--single
    > span,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .option-chip--tile
    > span,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .option-chip--single
    > span,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .option-chip--tile
    > span,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .option-chip--single
    > span {
    font-size: clamp(1rem, 4.8vw, 1.25rem);
    padding: 10px 8px;
  }
  .student-page-content--runner .runner-header-v2__left,
  .student-page-content--runner .runner-header-v2__right,
  .student-page-content--runner .runner-status-v2__left,
  .student-page-content--runner .runner-status-v2__right {
    width: 100%;
    min-width: 0;
  }
}
@media (max-width: 560px) {
  .student-page-content--runner .runner-shell-v2 {
    padding: 8px 0 14px;
  }
  .student-page-content--runner .runner-header-v2 {
    padding-inline: 0;
  }
  .student-page-content--runner .runner-question-card-v2 {
    padding: 12px 12px 14px;
  }
  .student-page-content--runner .runner-question-card-v2 .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.8rem, 14vw, 3.05rem);
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-prompt__main {
    font-size: clamp(1.45rem, 8vw, 2.15rem);
  }
  .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stage-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-answer-stack-v2,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-answer-stack-v2 {
    width: 100%;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .options-grid[data-option-grid],
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .options-grid[data-option-grid],
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .options-grid[data-option-grid] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .student-page-content--runner .runner-rail-card-v2--actions,
  .student-page-content--runner .runner-rail-card-v2--keyboard {
    padding: 10px;
  }
}
@media (max-width: 420px) {
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .options-grid[data-option-grid],
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .options-grid[data-option-grid],
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .options-grid[data-option-grid] {
    grid-template-columns: 1fr;
  }
  .student-page-content--runner .runner-header-pill-v2 {
    min-height: 42px;
    padding-inline: 14px;
  }
  .student-page-content--runner .runner-header-progress-value-v2 {
    font-size: 1.15rem;
  }
}
.competition-sprint-layout {
  align-items: start;
}
.competition-sprint-layout--solo.student-portal-columns-2-1 {
  grid-template-columns: minmax(0, 1fr) !important;
}
.competition-sprint-layout--solo .competition-sprint-summary {
  display: none !important;
}
.competition-sprint-wizard-card,
.competition-sprint-summary {
  --competition-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 95%, white 5%)
  );
  --competition-surface-strong: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 99%, white 1%),
    color-mix(in srgb, var(--bg-panel-2) 92%, white 8%)
  );
  --competition-choice-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 99%, white 1%),
    color-mix(in srgb, var(--bg-panel-2) 90%, white 10%)
  );
  --competition-choice-hover-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-hover) 68%, var(--bg-panel) 32%),
    color-mix(in srgb, var(--bg-panel-2) 88%, white 12%)
  );
  --competition-choice-selected-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-selected) 84%, var(--bg-panel) 16%),
    color-mix(in srgb, var(--bg-active) 70%, var(--bg-panel-2) 30%)
  );
  --competition-border: var(--line-default);
  --competition-border-strong: color-mix(
    in srgb,
    var(--line-strong) 72%,
    var(--selected-border) 28%
  );
  --competition-divider: color-mix(
    in srgb,
    var(--line-default) 68%,
    transparent
  );
  --competition-helper-text: var(--text-body);
  --competition-soft-text: var(--text-soft);
  --competition-selected-text: var(--text-strong);
  --competition-choice-shadow: var(--shadow-sm);
  --competition-choice-selected-shadow: 0 10px 24px
    color-mix(in srgb, var(--focus-ring) 70%, transparent);
  --competition-actions-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-elevated) 18%, transparent),
    color-mix(in srgb, var(--bg-elevated) 96%, transparent) 34%,
    var(--bg-elevated)
  );
  --competition-choice-accent: #5d8ef7;
  --competition-choice-accent-soft: color-mix(in srgb, #5d8ef7 16%, white 84%);
  --competition-choice-accent-strong: #2f5fe6;
}
.competition-sprint-wizard-card,
.competition-sprint-summary,
.competition-sprint-step {
  border-color: var(--competition-border);
}
.competition-sprint-wizard-card,
.competition-sprint-summary {
  background: var(--competition-surface);
}
.competition-sprint-wizard {
  display: grid;
  gap: 12px;
}
.competition-sprint-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(180px, 240px);
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid var(--competition-border);
  border-radius: var(--radius-4);
  background:
    radial-gradient(
      circle at top left,
      color-mix(in srgb, #d6a94e 16%, transparent) 0,
      transparent 48%
    ),
    radial-gradient(
      circle at bottom right,
      color-mix(in srgb, #5d8ef7 14%, transparent) 0,
      transparent 44%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 98%, white 2%),
      color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
    );
  overflow: hidden;
}
.competition-sprint-hero__copy {
  display: grid;
  gap: 8px;
}
.competition-sprint-hero__eyebrow {
  color: var(--competition-soft-text);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.competition-sprint-hero__title {
  max-width: 30ch;
  font-size: clamp(1.18rem, 1rem + 0.45vw, 1.55rem);
  font-weight: 900;
  line-height: 1.1;
  text-wrap: balance;
}
.competition-sprint-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.competition-sprint-hero__meta span {
  padding: 7px 10px;
  border: 1px solid
    color-mix(in srgb, var(--competition-border) 76%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, white 62%, transparent);
  font-size: 0.84rem;
  font-weight: 700;
}
.competition-sprint-hero__art {
  width: min(100%, 230px);
  justify-self: end;
  filter: drop-shadow(0 12px 18px rgba(36, 49, 39, 0.08));
}
.competition-sprint-wizard__main {
  display: grid;
  gap: 12px;
  min-width: 0;
  max-width: 100%;
}
.competition-sprint-step {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--competition-border);
  border-radius: calc(var(--radius-4) + 2px);
  background: var(--competition-surface-strong);
  box-shadow:
    inset 0 1px color-mix(in srgb, white 34%, transparent),
    0 16px 34px #705b2e0f;
  position: relative;
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
}
.competition-sprint-step:before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    color-mix(in srgb, #f1dca6 26%, transparent) 0,
    transparent 72%
  );
  pointer-events: none;
}
.competition-sprint-step[data-competition-step-active="true"] {
  border-color: color-mix(
    in srgb,
    var(--competition-border-strong) 72%,
    #f1dca6 28%
  );
  box-shadow:
    inset 0 1px color-mix(in srgb, white 44%, transparent),
    0 22px 42px #5c4a2317;
}
.competition-sprint-choice-grid {
  display: grid;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
}
.competition-sprint-choice-grid--two {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}
.competition-sprint-choice-grid--grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 96px), 1fr));
}
.competition-sprint-choice-grid--question {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 172px), 1fr));
}
.competition-sprint-choice-grid--duration {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr));
}
.competition-sprint-choice-grid--range {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 132px), 1fr));
}
.competition-sprint-inline-grid {
  display: grid;
  gap: 10px;
  margin-top: 2px;
  padding-top: 10px;
  border-top: 1px solid var(--competition-divider);
}
.competition-sprint-inline-grid__copy {
  display: grid;
  gap: 4px;
  justify-items: center;
}
.competition-sprint-choice {
  display: grid;
  gap: 10px;
  justify-items: center;
  align-content: center;
  min-height: 118px;
  padding: 14px 12px;
  border: 1px solid var(--competition-border);
  border-radius: var(--radius-3);
  background: var(--competition-choice-surface);
  color: inherit;
  text-align: center;
  box-shadow: none;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease,
    color 0.18s ease;
  position: relative;
  overflow: hidden;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}
.competition-sprint-choice:before {
  content: "";
  position: absolute;
  inset: 10px auto auto 10px;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--competition-choice-accent) 12%, white 88%),
    transparent
  );
  opacity: 0.9;
  pointer-events: none;
}
.competition-sprint-choice:after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    color-mix(in srgb, var(--competition-choice-accent) 12%, transparent) 0,
    transparent 72%
  );
  pointer-events: none;
}
.competition-sprint-choice[data-competition-choice-tone="blue"] {
  --competition-choice-accent: #5d8ef7;
  --competition-choice-accent-soft: color-mix(in srgb, #5d8ef7 18%, white 82%);
  --competition-choice-accent-strong: #2f5fe6;
}
.competition-sprint-choice[data-competition-choice-tone="gold"] {
  --competition-choice-accent: #d6a94e;
  --competition-choice-accent-soft: color-mix(in srgb, #d6a94e 22%, white 78%);
  --competition-choice-accent-strong: #a26b00;
}
.competition-sprint-choice[data-competition-choice-tone="sage"] {
  --competition-choice-accent: #86a378;
  --competition-choice-accent-soft: color-mix(in srgb, #86a378 22%, white 78%);
  --competition-choice-accent-strong: #4f6948;
}
.competition-sprint-choice:hover:not([disabled]),
.competition-sprint-choice:focus-visible:not([disabled]) {
  border-color: color-mix(
    in srgb,
    var(--competition-choice-accent) 48%,
    var(--competition-border-strong) 52%
  );
  background: var(--competition-choice-hover-surface);
  box-shadow:
    0 14px 28px
      color-mix(in srgb, var(--competition-choice-accent) 16%, transparent),
    var(--competition-choice-shadow);
}
.competition-sprint-choice.is-selected {
  border-color: color-mix(
    in srgb,
    var(--competition-choice-accent) 64%,
    var(--selected-border) 36%
  );
  background: var(--competition-choice-selected-surface);
  box-shadow:
    0 18px 34px
      color-mix(in srgb, var(--competition-choice-accent) 20%, transparent),
    var(--competition-choice-selected-shadow);
  color: var(--competition-selected-text);
}
.competition-sprint-choice[disabled] {
  opacity: 1;
  background: color-mix(in srgb, var(--bg-panel-2) 86%, transparent);
  border-color: color-mix(in srgb, var(--line-subtle) 92%, transparent);
  color: var(--text-disabled);
  box-shadow: none;
  cursor: not-allowed;
}
.competition-sprint-choice__content {
  display: grid;
  gap: 0;
  justify-items: center;
  max-width: 100%;
  width: 100%;
  position: relative;
  z-index: 1;
}
.competition-sprint-choice__visual {
  position: relative;
  z-index: 1;
}
.competition-sprint-choice__visual--icon {
  display: inline-grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border-radius: 20px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--competition-choice-accent) 18%, white 82%),
    color-mix(in srgb, var(--competition-choice-accent) 9%, white 91%)
  );
  box-shadow: inset 0 1px #ffffffa6;
}
.competition-sprint-choice__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: var(--competition-choice-accent-strong);
}
.competition-sprint-choice__icon svg {
  width: 100%;
  height: 100%;
}
.competition-sprint-choice__visual--grid {
  display: inline-grid;
  place-items: center;
  width: 68px;
  min-height: 58px;
}
.competition-sprint-choice__mini-grid {
  display: grid;
  grid-template-columns: repeat(
    var(--competition-choice-grid-columns, 2),
    minmax(0, 1fr)
  );
  gap: 4px;
  width: 100%;
  max-width: 68px;
}
.competition-sprint-choice__mini-grid-cell {
  aspect-ratio: 1;
  border-radius: 9px;
  border: 1px solid
    color-mix(in srgb, var(--competition-choice-accent) 28%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--competition-choice-accent) 8%, white 92%),
    color-mix(in srgb, var(--competition-choice-accent) 2%, white 98%)
  );
}
.competition-sprint-choice__mini-grid-cell.is-accent {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--competition-choice-accent) 34%, white 66%),
    color-mix(in srgb, var(--competition-choice-accent) 18%, white 82%)
  );
  border-color: color-mix(
    in srgb,
    var(--competition-choice-accent) 58%,
    transparent
  );
}
.competition-sprint-choice__visual--operations {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
  max-width: 156px;
}
.competition-sprint-choice__operation-token {
  min-width: 40px;
  padding: 7px 10px;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--competition-choice-accent) 18%, white 82%),
    color-mix(in srgb, var(--competition-choice-accent) 6%, white 94%)
  );
  color: var(--competition-choice-accent-strong);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}
.competition-sprint-choice__visual--timer {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 72px;
  height: 72px;
}
.competition-sprint-choice__timer-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(
    var(--competition-choice-accent) 0 var(--competition-choice-progress, 56%),
    color-mix(in srgb, var(--competition-choice-accent) 12%, white 88%)
      var(--competition-choice-progress, 56%) 100%
  );
  mask: radial-gradient(circle at center, transparent 54%, black 56%);
  -webkit-mask: radial-gradient(circle at center, transparent 54%, black 56%);
}
.competition-sprint-choice__timer-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  min-height: 52px;
  padding: 0 8px;
  border-radius: 50%;
  background: color-mix(
    in srgb,
    white 84%,
    var(--competition-choice-accent) 16%
  );
  color: var(--competition-choice-accent-strong);
  font-size: 0.95rem;
  font-weight: 900;
  box-shadow: inset 0 1px #ffffffb8;
}
.competition-sprint-choice__visual--range {
  display: inline-grid;
  place-items: center;
  min-height: 42px;
}
.competition-sprint-choice__number-trail {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex-wrap: nowrap;
}
.competition-sprint-choice__number-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 9px;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--competition-choice-accent) 20%, white 80%),
    color-mix(in srgb, var(--competition-choice-accent) 8%, white 92%)
  );
  color: var(--competition-choice-accent-strong);
  font-size: 0.84rem;
  font-weight: 800;
}
.competition-sprint-choice__number-link {
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--competition-choice-accent) 48%,
    transparent
  );
}
.competition-sprint-choice__title {
  font-weight: 800;
  font-size: 0.99rem;
  line-height: 1.25;
  width: 100%;
  max-width: none;
  text-align: center;
  text-wrap: balance;
}
.competition-sprint-choice__detail {
  display: none;
}
.competition-sprint-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  padding-top: 4px;
  border-top: 1px solid var(--competition-divider);
}
.competition-sprint-actions .btn {
  flex: 1 1 0;
  justify-content: center;
}
.competition-sprint-summary {
  gap: 8px;
  align-self: start;
}
.competition-sprint-summary__rows {
  display: grid;
  gap: 4px;
}
.competition-sprint-step--ready {
  gap: 12px;
}
.competition-sprint-summary__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 8px 0;
  border-top: 1px solid var(--competition-divider);
}
.competition-sprint-summary__row:first-child {
  border-top: 0;
  padding-top: 0;
}
.competition-sprint-summary__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
  color: var(--competition-soft-text);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.competition-sprint-summary strong {
  display: block;
  font-size: 1rem;
}
.competition-sprint-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  flex: 0 0 auto;
}
.competition-sprint-icon svg {
  width: 16px;
  height: 16px;
}
.competition-sprint-icon--blue {
  color: #2f5fe6;
  background: color-mix(in srgb, #5d8ef7 18%, white 82%);
}
.competition-sprint-icon--gold {
  color: #a26b00;
  background: color-mix(in srgb, #d6a94e 24%, white 76%);
}
.competition-sprint-icon--sage {
  color: #4f6948;
  background: color-mix(in srgb, #86a378 26%, white 74%);
}
.competition-sprint-wizard-card .section-header,
.competition-sprint-summary .section-header {
  margin-bottom: 2px;
}
.competition-sprint-step .section-header,
.competition-sprint-summary__row > div {
  min-width: 0;
}
.competition-sprint-step .section-header {
  text-align: center;
  min-width: 0;
  max-width: 100%;
}
.competition-sprint-step .section-header > div {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0 auto;
  min-height: 34px;
}
.competition-sprint-step .section-header .eyebrow {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  min-width: 34px;
  height: 34px;
  padding: 0 11px;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #f0ddb6 72%, white 28%),
    color-mix(in srgb, #dfe8ff 86%, white 14%)
  );
  color: #2f5fe6;
  font-size: 0.79rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  box-shadow: 0 8px 20px #5d8ef71f;
}
.competition-sprint-step .section-header h3 {
  margin: 0;
  padding-inline: 52px;
  text-align: center;
  text-wrap: balance;
  min-width: 0;
  max-width: 100%;
}
.competition-sprint-step .section-header .muted {
  max-width: 40ch;
  margin: 10px auto 0;
  padding-inline: 52px;
  text-align: center;
  text-wrap: balance;
}
.competition-sprint-step .muted,
.competition-sprint-summary .muted,
.competition-sprint-wizard .muted {
  color: var(--competition-helper-text);
}
.competition-sprint-ready {
  display: grid;
  gap: 12px;
}
.competition-sprint-ready__banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid
    color-mix(in srgb, var(--competition-border) 72%, #f0ddb6 28%);
  border-radius: calc(var(--radius-3) + 2px);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, #d6a94e 14%, transparent) 0,
      transparent 44%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, #f6ecd2 58%, white 42%),
      color-mix(in srgb, var(--bg-panel) 94%, white 6%)
    );
  box-shadow: 0 14px 28px #8c692214;
}
.competition-sprint-ready__banner p {
  margin: 2px 0 0;
}
.competition-sprint-ready__banner-icon .competition-sprint-icon,
.competition-sprint-ready__banner-icon {
  display: inline-flex;
}
.competition-sprint-ready__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: 10px;
  min-width: 0;
  max-width: 100%;
}
.competition-sprint-ready__tile {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  min-height: 138px;
  padding: 16px 14px;
  border: 1px solid
    color-mix(in srgb, var(--competition-border) 86%, transparent);
  border-radius: calc(var(--radius-3) + 1px);
  background:
    radial-gradient(
      circle at top left,
      color-mix(in srgb, #5d8ef7 10%, transparent) 0,
      transparent 34%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, white 66%, var(--bg-panel) 34%),
      color-mix(in srgb, white 48%, var(--bg-panel) 52%)
    );
  text-align: center;
  box-shadow: inset 0 1px #ffffffb3;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}
.competition-sprint-ready__tile-label {
  display: inline-grid;
  place-items: center;
}
.competition-sprint-ready__tile strong {
  font-size: 1.04rem;
  line-height: 1.2;
  text-wrap: balance;
}
.competition-sprint-ready__tile-caption {
  color: var(--competition-soft-text);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.competition-sprint-step .eyebrow,
.competition-sprint-summary .eyebrow,
.competition-sprint-summary__label {
  color: var(--competition-soft-text);
}
.competition-sprint-summary .btn.ghost,
.competition-sprint-wizard .btn.ghost {
  background: var(--bg-interactive);
  border-color: var(--competition-border);
}
html[data-appearance="dark"]
  :is(.competition-sprint-wizard-card, .competition-sprint-summary),
html[data-theme="dark"]
  :is(.competition-sprint-wizard-card, .competition-sprint-summary),
body.theme-dark
  :is(.competition-sprint-wizard-card, .competition-sprint-summary) {
  --competition-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, black 4%),
    color-mix(in srgb, var(--bg-panel-2) 94%, black 6%)
  );
  --competition-surface-strong: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel-2) 94%, black 6%),
    color-mix(in srgb, var(--bg-panel-3) 88%, black 12%)
  );
  --competition-choice-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 92%, black 8%),
    color-mix(in srgb, var(--bg-panel-2) 90%, black 10%)
  );
  --competition-choice-hover-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-hover) 76%, var(--bg-panel) 24%),
    color-mix(in srgb, var(--bg-panel-2) 84%, black 16%)
  );
  --competition-choice-selected-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-active) 74%, var(--bg-panel) 26%),
    color-mix(in srgb, var(--bg-selected) 68%, var(--bg-panel-2) 32%)
  );
  --competition-border: color-mix(in srgb, var(--line-default) 82%, white 18%);
  --competition-border-strong: color-mix(
    in srgb,
    var(--selected-border) 82%,
    white 18%
  );
  --competition-divider: color-mix(
    in srgb,
    var(--line-default) 72%,
    transparent
  );
  --competition-helper-text: color-mix(in srgb, var(--text-body) 94%, white 6%);
  --competition-soft-text: color-mix(in srgb, var(--text-soft) 92%, white 8%);
  --competition-choice-shadow: 0 12px 24px rgba(0, 0, 0, 0.26);
  --competition-choice-selected-shadow: 0 14px 28px rgba(0, 0, 0, 0.34);
  --competition-actions-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-elevated) 12%, transparent),
    color-mix(in srgb, var(--bg-elevated) 92%, transparent) 34%,
    color-mix(in srgb, var(--bg-panel) 94%, black 6%)
  );
}
html[data-appearance="dark"] .competition-sprint-step,
html[data-theme="dark"] .competition-sprint-step,
body.theme-dark .competition-sprint-step {
  box-shadow: inset 0 1px #ffffff0a;
}
html[data-appearance="dark"] .competition-sprint-summary .btn.ghost,
html[data-appearance="dark"] .competition-sprint-wizard .btn.ghost,
html[data-theme="dark"] .competition-sprint-summary .btn.ghost,
html[data-theme="dark"] .competition-sprint-wizard .btn.ghost,
body.theme-dark .competition-sprint-summary .btn.ghost,
body.theme-dark .competition-sprint-wizard .btn.ghost {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel-2) 92%, black 8%),
    color-mix(in srgb, var(--bg-panel) 90%, black 10%)
  );
  color: var(--text-strong);
}
@media (min-width: 1181px) {
  .competition-sprint-layout.student-portal-columns-2-1 {
    grid-template-columns: minmax(0, 1.16fr) minmax(300px, 0.72fr);
  }
  .competition-sprint-summary {
    position: sticky;
    top: 108px;
  }
}
@media (min-width: 981px) and (max-width: 1180px) {
  .competition-sprint-layout.student-portal-columns-2-1 {
    grid-template-columns: minmax(0, 1.04fr) minmax(260px, 0.78fr);
    gap: 12px;
  }
  .competition-sprint-hero {
    grid-template-columns: minmax(0, 1fr) minmax(160px, 210px);
  }
  .competition-sprint-choice {
    min-height: 126px;
    padding: 14px 12px;
  }
  .competition-sprint-choice-grid--question {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .competition-sprint-summary {
    position: sticky;
    top: 96px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .competition-sprint-layout.student-portal-columns-2-1,
  .competition-sprint-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .competition-sprint-hero__art {
    justify-self: start;
  }
  .competition-sprint-choice-grid--two,
  .competition-sprint-choice-grid--question,
  .competition-sprint-choice-grid--duration,
  .competition-sprint-ready__grid {
    grid-template-columns: 1fr;
  }
  .competition-sprint-summary {
    position: static;
  }
}
@media (max-width: 767px) {
  .competition-sprint-layout.student-portal-columns-2-1 {
    grid-template-columns: minmax(0, 1fr);
  }
  .competition-sprint-hero {
    grid-template-columns: 1fr;
    padding: 12px;
  }
  .competition-sprint-hero__art {
    width: min(100%, 200px);
    justify-self: start;
  }
  .competition-sprint-wizard {
    gap: 10px;
    align-content: start;
  }
  .competition-sprint-wizard__main {
    gap: 10px;
  }
  .competition-sprint-step {
    padding: 10px;
    border-radius: var(--radius-3);
  }
  .competition-sprint-choice-grid--two,
  .competition-sprint-choice-grid--question,
  .competition-sprint-choice-grid--duration,
  .competition-sprint-ready__grid {
    grid-template-columns: 1fr;
  }
  .competition-sprint-choice {
    min-height: 96px;
    padding: 12px;
  }
  .competition-sprint-step .section-header > div {
    grid-template-columns: auto 1fr;
    justify-content: stretch;
  }
  .competition-sprint-summary {
    position: static;
  }
  .competition-sprint-summary__row {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
  .competition-sprint-summary__row .btn {
    width: 100%;
    justify-content: center;
  }
  .competition-sprint-ready__tile {
    min-height: 96px;
  }
  .competition-sprint-actions {
    position: sticky;
    bottom: 0;
    z-index: 12;
    padding: 8px 0 calc(env(safe-area-inset-bottom, 0px) + 2px);
    background: var(--competition-actions-surface);
    backdrop-filter: blur(10px);
  }
}
.runner-question-card-v2.runner-question-panel--mode-compact-typed {
  --runner-content-stage-max: 760px;
}
.runner-question-card-v2.runner-question-panel--mode-selection-grid {
  --runner-content-stage-max: 920px;
}
.runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-answer-stage-v2,
.runner-question-card-v2.runner-question-panel--mode-compact-typed
  .runner-answer-stack-v2 {
  width: min(100%, 1000px);
}
.runner-question-card-v2 .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--choice .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--shape-choice
  .runner-prompt__main,
.runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
}
.runner-question-card-v2 .runner-prompt--narrative .runner-prompt__main,
.runner-question-card-v2 .runner-prompt--wordy .runner-prompt__main,
.runner-question-card-v2 .runner-prompt--ratio .runner-prompt__main,
.runner-question-card-v2 .runner-prompt--condition .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  line-height: 1.18;
}
.runner-visual-panel-v2 .visual-card--scene {
  width: 100%;
}
.runner-visual-panel-v2 .visual-card--scene .visual-scene {
  width: min(100%, 940px);
  max-width: 720px;
}
.runner-visual-panel-v2 .visual-card--scene-compact .visual-scene {
  width: min(100%, 520px);
  max-width: 520px;
}
.runner-visual-panel-v2 .visual-card--scene-medium .visual-scene {
  width: min(100%, 640px);
  max-width: 640px;
}
.runner-visual-panel-v2 .visual-card--scene-wide .visual-scene {
  width: min(100%, 820px);
  max-width: 820px;
}
.runner-question-card-v2 .runner-official-crop {
  width: min(100%, 860px);
  margin: 0 auto;
  display: grid;
  gap: 12px;
}
.runner-question-card-v2 .runner-official-crop figcaption {
  max-width: min(100%, 64ch);
  margin-inline: auto;
  text-align: left;
  font-size: clamp(0.96rem, 1.2vw, 1.05rem);
  line-height: 1.45;
}
.student-page-content--runner .runner-question-card-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-compact-typed,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--coordinate-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--transformation-grid {
  min-height: 0;
}
.student-page-content--runner .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-visual-panel-v2 {
  min-height: 0;
  max-height: none;
  align-content: start;
  justify-items: center;
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-question-stage-v2 {
  gap: 10px;
}
.student-page-content--runner .runner-question-card-v2 .runner-answer-panel-v2 {
  padding-top: 6px;
}
@media (min-width: 821px) {
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.6rem, 1.95vw, 2.45rem);
    line-height: 1.12;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.18rem, 1.45vw, 1.7rem);
    line-height: 1.16;
  }
}
@media (max-width: 820px) {
  .student-page-content--runner .runner-question-card-v2 .runner-prompt__main {
    max-width: min(100%, 34ch);
    font-size: clamp(1.28rem, 4.8vw, 2rem);
    line-height: 1.15;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.08rem, 4.2vw, 1.5rem);
  }
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--narrative
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--ratio
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--condition
    .runner-prompt__main {
    max-width: 100%;
  }
}
@media (max-width: 560px) {
  .student-page-content--runner .runner-question-card-v2 .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.18rem, 6.8vw, 1.95rem);
    line-height: 1.14;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt__main {
    font-size: clamp(2.2rem, 4vw, 4rem);
    line-height: 1.04;
    text-align: center;
    letter-spacing: 0;
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.05rem, 5.4vw, 1.45rem);
  }
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--narrative
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--ratio
    .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--condition
    .runner-prompt__main {
    max-width: 100%;
    line-height: 1.18;
  }
  .student-page-content--runner .runner-question-card-v2 .runner-prompt__intro,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt__context,
  .student-page-content--runner .runner-question-card-v2 .runner-prompt__detail,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-official-crop
    figcaption {
    font-size: 0.94rem;
  }
}
.runner-response-zone-v2 {
  display: grid;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  align-content: stretch;
}
.student-session-recovery-card {
  width: min(100%, 42rem);
  margin: clamp(20px, 4vw, 40px) auto 0;
  display: grid;
  gap: 14px;
  padding: clamp(20px, 3vw, 28px);
}
.student-session-recovery-card__eyebrow {
  color: var(--student-700);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.student-session-recovery-card h1 {
  margin: 0;
  font-size: clamp(1.5rem, 3.4vw, 2.2rem);
  line-height: 1.08;
}
.student-session-recovery-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.student-session-recovery-card__actions .btn {
  flex: 1 1 220px;
  justify-content: center;
}
.student-practice-more-choices[open] > summary,
.student-manual-disclosure[open] > summary {
  margin-bottom: 12px;
}
.student-manual-card--v18-8-54 .student-inline-note {
  margin-bottom: 4px;
}
.competition-sprint-choice-grid--question {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.competition-sprint-actions .btn {
  min-height: 52px;
}
.student-page-content--runner .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr) minmax(
      380px,
      var(--runner-answer-dock-width, 420px)
    );
  gap: 20px;
  align-items: stretch;
  min-height: 0;
}
.student-page-content--runner .runner-response-zone-v2 {
  position: static;
  top: auto;
  align-self: stretch;
  align-content: stretch;
  min-height: 0;
  height: 100%;
}
.student-page-content--runner .runner-response-zone-v2 .runner-rail-card-v2 {
  gap: 14px;
  padding: 16px;
}
.student-page-content--runner
  .runner-response-zone-v2
  .runner-rail-card-v2--keyboard
  .runner-keyboard,
.student-page-content--runner
  .runner-response-zone-v2
  .runner-rail-card-v2--keyboard
  .runner-keyboard-row {
  gap: 10px;
}
.student-page-content--runner
  .runner-response-zone-v2
  .runner-rail-card-v2--keyboard
  .btn,
.student-page-content--runner .runner-response-zone-v2 .runner-actions-v2 .btn {
  min-height: 56px;
}
.student-page-content--runner
  .runner-response-zone-v2
  .runner-rail-card-v2--keyboard
  .btn {
  font-size: 1.14rem;
  font-weight: 800;
}
.student-page-content--runner
  .runner-response-zone-v2
  .runner-rail-card-v2--keyboard
  .btn[data-runner-key="enter"],
.student-page-content--runner
  .runner-response-zone-v2
  .runner-command-button-v2 {
  min-height: 60px;
  font-size: 1.08rem;
}
.student-page-content--runner .runner-actions-v2__group--support {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-page-content--runner .runner-actions-v2__group--support .btn {
  width: 100%;
}
.student-page-content--runner .runner-question-card-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-compact-typed,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--coordinate-grid,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--transformation-grid {
  min-height: auto;
}
.student-page-content--runner .runner-question-card-v2 .runner-question-body-v2,
.student-page-content--runner
  .runner-question-card-v2
  .runner-question-stage-v2 {
  min-width: 0;
  gap: 18px;
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt:not(.runner-prompt--raw) {
  width: min(100%, 72rem);
  max-width: 100%;
  min-width: 0;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-prompt:not(.runner-prompt--raw),
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-prompt:not(.runner-prompt--raw),
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-prompt:not(.runner-prompt--raw),
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-prompt:not(.runner-prompt--raw),
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-prompt:not(.runner-prompt--raw) {
  width: min(100%, 72rem);
}
.student-page-content--runner .runner-question-card-v2 .runner-prompt--raw {
  width: min(100%, 52rem);
  margin-inline: auto;
  max-width: 100%;
  min-width: 0;
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt--raw
  .official-crop-wrap,
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt--raw
  .question-image-wrap {
  width: min(100%, 940px);
  margin-inline: auto;
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-question-body-v2 {
  overflow-x: hidden;
}
.student-page-content--runner .runner-question-card-v2 .runner-prompt,
.student-page-content--runner .runner-question-card-v2 .runner-prompt__intro,
.student-page-content--runner .runner-question-card-v2 .runner-prompt__context,
.student-page-content--runner .runner-question-card-v2 .runner-prompt__main,
.student-page-content--runner .runner-question-card-v2 .runner-prompt__detail,
.student-page-content--runner .runner-question-card-v2 .runner-prompt--raw,
.student-page-content--runner .runner-question-card-v2 .runner-prompt--raw * {
  max-width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: normal;
}
.student-page-content--runner .runner-question-card-v2 .runner-visual-panel-v2 {
  min-width: 0;
  overflow: hidden;
}
.student-page-content--runner .runner-question-card-v2 .runner-answer-panel-v2 {
  padding-top: 14px;
}
.student-page-content--runner .runner-question-card-v2 .runner-answer-stage-v2 {
  width: min(100%, 36rem);
  margin-inline: 0 auto;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-answer-stage-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-answer-stage-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-answer-stage-v2 {
  width: min(100%, 58rem);
}
.student-page-content--runner .runner-question-card-v2 .runner-visual-panel-v2 {
  min-height: 0;
  padding-top: 8px;
  align-content: center;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-visual-panel-v2 {
  min-height: clamp(190px, 30vh, 360px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--coordinate-grid
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--transformation-grid
  .runner-visual-panel-v2 {
  min-height: clamp(240px, 34vh, 420px);
}
.student-page-content--runner
  .runner-question-card-v2
  .visual-card--scene
  .visual-scene {
  width: min(100%, 560px);
}
.student-page-content--runner
  .runner-question-card-v2
  .visual-card--scene-wide
  .visual-scene {
  width: min(100%, 680px);
}
.student-page-content--runner
  .runner-question-card-v2
  .visual-card--scene-compact
  .visual-scene {
  width: min(100%, 440px);
}
@media (min-width: 1181px) {
  .student-shell--focus-mode .student-page-content--runner .runner-shell-v2 {
    --runner-shell-max-width: 1700px;
    --runner-answer-dock-width: clamp(360px, 23vw, 420px);
    gap: 12px;
    padding: 4px 0 12px;
    min-height: 0;
    height: calc(100dvh - clamp(20px, 6dvh, 108px));
    max-height: calc(100dvh - clamp(20px, 6dvh, 108px));
    overflow: visible;
  }
  .student-shell--focus-mode .student-page-content--runner .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(
        360px,
        var(--runner-answer-dock-width)
      );
    gap: 18px;
    align-items: stretch;
    min-height: 0;
    height: 100%;
    max-height: none;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2 {
    top: 76px;
    height: auto;
    max-height: min(68dvh, 720px);
    align-self: start;
    align-content: start;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-answer-panel-v2 {
    height: auto;
    max-height: min(68dvh, 720px);
    min-height: 0;
    align-self: start;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-answer-body-v2 {
    min-height: 0;
    overflow: auto;
    align-content: start;
    overscroll-behavior: contain;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-commandbar-wrap-v2 {
    flex: 0 0 auto;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2 {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    padding: 18px 20px 20px;
    overflow: hidden;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-question-body-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-question-stage-v2 {
    gap: 18px;
    min-height: 0;
    height: 100%;
    align-content: stretch;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt:not(.runner-prompt--raw) {
    width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-compact-typed {
    --runner-content-stage-max: 880px;
    min-height: 0;
    height: 100%;
    align-self: stretch;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.25rem, 1.42vw, 1.75rem);
    line-height: 1.18;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--fraction-model,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--table {
    --runner-content-stage-max: 1320px;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--coordinate-grid,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--transformation-grid {
    --runner-content-stage-max: 1380px;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--choice
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--shape-choice
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-selection-grid
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--fraction-model
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--table
    .runner-visual-panel-v2 {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    padding: 14px 16px;
    align-content: center;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--coordinate-grid
    .runner-visual-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--transformation-grid
    .runner-visual-panel-v2 {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    padding: 14px 16px;
    align-content: center;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .visual-card,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .question-image-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .official-crop-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .visual-card,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .question-image-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid
    .official-crop-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--coordinate-grid
    .visual-card,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--coordinate-grid
    .question-image-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--coordinate-grid
    .official-crop-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--transformation-grid
    .visual-card,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--transformation-grid
    .question-image-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--transformation-grid
    .official-crop-wrap {
    width: min(100%, 1440px);
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .visual-card--scene
    .visual-scene {
    width: min(100%, 780px);
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .visual-card--scene-wide
    .visual-scene {
    width: min(100%, 920px);
  }
}
@media (max-width: 900px), (orientation: portrait) and (max-width: 1180px) {
  .student-page-content--runner .runner-stage-v2 {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .student-page-content--runner .runner-response-zone-v2 {
    position: static;
    top: auto;
    gap: 12px;
  }
  .student-page-content--runner
    .runner-response-zone-v2
    [data-runner-tools-card],
  .student-page-content--runner
    .runner-response-zone-v2
    [data-runner-actions-card] {
    width: min(100%, 860px);
    margin-inline: auto;
  }
  .student-page-content--runner
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn {
    min-height: 66px;
    font-size: 1.2rem;
  }
  .student-page-content--runner
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn[data-runner-key="enter"],
  .student-page-content--runner
    .runner-response-zone-v2
    .runner-command-button-v2 {
    min-height: 68px;
  }
  .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stage-v2 {
    width: min(100%, 44rem);
  }
}
@media (max-width: 820px) {
  .student-session-recovery-card__actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .student-page-content--runner .runner-actions-v2__group--support {
    grid-template-columns: 1fr;
  }
  .student-session-recovery-card__actions .btn,
  .student-page-content--runner
    .runner-response-zone-v2
    [data-runner-tools-card],
  .student-page-content--runner
    .runner-response-zone-v2
    [data-runner-actions-card] {
    width: 100%;
  }
  .student-page-content--runner .runner-response-zone-v2 .runner-rail-card-v2 {
    padding: 14px;
  }
  .student-page-content--runner
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn,
  .student-page-content--runner
    .runner-response-zone-v2
    .runner-actions-v2
    .btn {
    min-height: 58px;
  }
  .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-field__control {
    grid-template-columns: 1fr;
  }
  .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-field__suffix {
    width: fit-content;
  }
}
.student-side-nav--compact {
  width: 100%;
  min-width: 0;
  padding: 12px 10px;
  gap: 12px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 95%, white 5%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 92%, white 8%)
  );
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  border-radius: 26px;
  box-shadow: var(--surface-shadow-ui);
}
.student-side-nav--compact .student-side-nav__header,
.student-side-nav--compact .student-side-nav__list,
.student-side-nav--compact .student-side-nav__section {
  gap: 10px;
}
.student-side-nav--compact .student-side-nav__title,
.student-side-nav--compact .student-side-nav__section-label {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.student-side-nav--compact .student-side-nav__section-toggle {
  min-height: 44px;
  padding: 6px;
  border-radius: 14px;
}
.student-side-nav--compact .student-side-nav__section-items {
  gap: 10px;
}
.student-side-nav--compact .student-side-nav__link {
  min-height: 48px;
  padding: 10px 14px;
  border-radius: 18px;
}
.student-side-nav--compact .student-side-nav__icon-wrap {
  width: 26px;
  height: 26px;
}
.student-side-nav--compact .student-side-nav__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.student-nav-collapsed .student-side-nav--compact {
  width: 72px;
}
.student-nav-collapsed .student-side-nav--compact .student-side-nav__title,
.student-nav-collapsed
  .student-side-nav--compact
  .student-side-nav__section-label,
.student-nav-collapsed .student-side-nav--compact .student-side-nav__label {
  display: none;
}
.student-nav-collapsed .student-side-nav--compact .student-side-nav__link,
.student-nav-collapsed
  .student-side-nav--compact
  .student-side-nav__section-toggle {
  justify-content: center;
  padding-inline: 10px;
}
.student-nav-collapsed
  .student-side-nav--compact
  .student-side-nav__section-toggle-main {
  justify-content: center;
}
.student-nav-collapsed
  .student-side-nav--compact
  .student-side-nav__section-chevron,
.student-mobile-nav {
  display: none;
}
.student-mobile-nav__bar {
  display: grid;
  grid-template-columns: repeat(
    var(--student-mobile-nav-columns, 5),
    minmax(0, 1fr)
  );
  gap: 8px;
  padding: 10px;
  position: relative;
  overflow: visible;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  border-radius: 24px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 96%, white 4%)
  );
  box-shadow: 0 14px 28px #0f172a24;
  backdrop-filter: blur(8px);
}
.student-mobile-nav__link {
  min-height: 58px;
  padding: 8px 6px;
  border-radius: 18px;
  display: grid;
  justify-items: center;
  gap: 4px;
  text-align: center;
  color: var(--text-strong);
  text-decoration: none;
}
.student-mobile-nav__link.is-active,
.student-mobile-nav__link--more.is-active {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-panel));
  border: 1px solid color-mix(in srgb, var(--brand) 38%, transparent);
}
.student-mobile-nav__icon {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
}
.student-mobile-nav__icon .student-side-nav__icon,
.student-mobile-nav__icon .student-side-nav__icon-wrap,
.student-mobile-nav__icon .student-side-nav__icon img {
  width: 22px;
  height: 22px;
}
.student-mobile-nav__label {
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.15;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.student-mobile-nav__more {
  position: static;
}
.student-mobile-nav__more > summary {
  list-style: none;
}
.student-mobile-nav__more > summary::-webkit-details-marker {
  display: none;
}
.student-mobile-nav__more:not([open]) .student-mobile-nav__sheet {
  display: none;
}
.student-mobile-nav__sheet {
  position: absolute;
  left: 50%;
  right: auto;
  bottom: calc(100% + 8px);
  display: grid;
  gap: 10px;
  width: min(360px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  transform: translate(-50%);
  padding: 12px;
  z-index: 2;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  border-radius: 22px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 99%, white 1%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 97%, white 3%)
  );
  box-shadow: 0 18px 36px #0f172a1f;
}
.student-mobile-nav__sheet-title {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.student-mobile-nav__sheet-links {
  display: grid;
  gap: 8px;
}
.student-mobile-nav__sheet-links .student-mobile-nav__link {
  grid-template-columns: auto 1fr;
  justify-items: start;
  align-items: center;
  min-height: 50px;
  text-align: left;
  padding-inline: 10px;
}
.student-mobile-nav__sheet-links .student-mobile-nav__label {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}
.student-home-page--ux-refresh,
.student-practice-page--ux-refresh,
.student-competition-shell .student-shell__body {
  gap: 16px;
}
.student-competition-hub,
.student-competition-builder {
  display: grid;
  gap: 14px;
}
.student-competition-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.student-competition-action-card {
  gap: 12px;
}
.student-competition-status-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-hero-grid--ux-refresh,
.student-home-support-grid--ux-refresh,
.student-practice-hub-grid,
.student-competition-support-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(300px, 0.88fr);
  gap: 14px;
  align-items: start;
}
.student-home-focus-card--ux-refresh,
.student-home-glance-card--ux-refresh,
.student-practice-path-card,
.student-practice-builder-card {
  gap: 12px;
  padding: 18px;
  border-radius: 28px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 97%, white 3%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 94%, white 6%)
  );
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  box-shadow: var(--surface-shadow-ui);
}
.student-home-focus-card__topline--compact {
  gap: 10px;
  align-items: start;
}
.student-home-focus-card--ux-refresh h1 {
  margin: 0;
  font-size: clamp(1.72rem, 3vw, 2.28rem);
  line-height: 1.04;
}
.student-home-focus-card__context {
  font-size: 0.92rem;
  line-height: 1.35;
}
.student-home-focus-card--ux-refresh .student-inline-metric-strip {
  gap: 8px;
}
.student-home-focus-card--ux-refresh .student-inline-metric {
  min-height: 0;
  padding: 10px 12px;
}
.student-home-quick-links--compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.student-home-summary-list,
.student-home-mini-board .student-leaderboard-list,
.student-home-fallback-actions {
  gap: 8px;
}
.student-home-choice-grid--triple {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-home-choice {
  min-height: 0;
  padding: 14px;
  gap: 6px;
}
.student-home-choice .muted.small {
  min-height: 0;
}
.student-practice-quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-practice-flow-stack {
  display: grid;
  gap: 14px;
  width: min(100%, 920px);
  margin: 0 auto;
}
.student-practice-secondary-disclosure {
  display: grid;
  gap: 10px;
}
.student-practice-secondary-disclosure > summary {
  width: fit-content;
}
.student-practice-secondary-disclosure__intro {
  max-width: 54ch;
}
.student-practice-builder__launch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  background: color-mix(
    in srgb,
    var(--bg-panel-2, var(--bg-panel)) 88%,
    transparent
  );
}
.student-practice-builder__wizard,
.student-practice-builder__step {
  display: grid;
  gap: 14px;
}
.student-practice-builder__header {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}
.student-practice-builder__header .learner-setup__header-actions {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.student-practice-builder__header .setup-close-button {
  position: absolute;
  top: 0;
  right: 0;
}
.practice-builder-choice-grid {
  display: grid;
  gap: 12px;
}
.practice-builder-choice-grid--focus {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
}
.practice-builder-choice-grid--three {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
}
.practice-builder-choice-grid--five {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 136px), 1fr));
}
.practice-builder-choice {
  min-height: 92px;
  padding: 12px;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 88%, transparent);
  background: color-mix(
    in srgb,
    var(--bg-panel-2, var(--bg-panel)) 90%,
    transparent
  );
  display: grid;
  align-content: start;
  gap: 6px;
  text-align: left;
  color: var(--text-strong);
}
.practice-builder-choice__title {
  font-size: 1rem;
  font-weight: 800;
}
.practice-builder-choice.is-selected {
  border-color: color-mix(in srgb, var(--brand) 46%, transparent);
  background: color-mix(in srgb, var(--brand) 16%, var(--bg-panel));
  box-shadow: 0 14px 32px #0000001f;
  transform: translateY(-1px);
}
.student-practice-builder__summary,
.competition-sprint-ready {
  display: grid;
  gap: 10px;
}
.student-practice-builder__summary-row,
.competition-sprint-ready__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  background: color-mix(
    in srgb,
    var(--bg-panel-2, var(--bg-panel)) 90%,
    transparent
  );
}
.student-practice-builder__summary-row span,
.competition-sprint-ready__row span {
  color: var(--text-muted);
  font-size: 0.84rem;
}
.student-practice-builder__advanced-grid {
  margin-top: 12px;
}
.student-practice-builder__core-controls {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line-default);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--brand-50) 6%);
}
.student-practice-builder__core-controls select {
  min-height: 44px;
}
.student-practice-builder__actions {
  display: flex;
  gap: 10px;
  position: sticky;
  bottom: 0;
  padding-top: 12px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 0%, transparent),
    color-mix(in srgb, var(--bg-panel) 92%, transparent) 36%
  );
}
.student-practice-builder__section-stack {
  display: grid;
  gap: 14px;
}
.student-practice-builder__subsection {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, transparent);
  border-radius: 20px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 95%, white 5%)
  );
}
.student-practice-path-card,
.student-practice-builder-card {
  --practice-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 95%, white 5%)
  );
  --practice-surface-strong: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 99%, white 1%),
    color-mix(in srgb, var(--bg-panel-2, var(--bg-panel)) 92%, white 8%)
  );
  --practice-border: color-mix(in srgb, var(--line-default) 84%, transparent);
  --practice-border-strong: color-mix(
    in srgb,
    var(--selected-border) 72%,
    var(--line-strong) 28%
  );
  --practice-divider: color-mix(in srgb, var(--line-default) 68%, transparent);
}
html:not([data-appearance="dark"]):not([data-theme="dark"])
  body.portal-student
  :is(.student-practice-path-card, .student-practice-builder-card),
body.portal-student:not(.theme-dark)
  :is(.student-practice-path-card, .student-practice-builder-card) {
  --practice-surface: linear-gradient(
    180deg,
    color-mix(in srgb, white 92%, var(--bg-panel-2) 8%),
    color-mix(in srgb, white 72%, var(--bg-panel-2) 28%)
  );
  --practice-surface-strong: linear-gradient(
    180deg,
    color-mix(in srgb, white 95%, var(--bg-panel-2) 5%),
    color-mix(in srgb, white 78%, var(--bg-panel-2) 22%)
  );
  --practice-border: rgba(34, 48, 71, 0.18);
  --practice-border-strong: rgba(93, 127, 244, 0.42);
}
.student-practice-hero-action {
  width: min(100%, 640px);
}
.student-game-hub-page {
  min-width: 0;
}
.student-game-hub-page .student-section-hero--action-first {
  gap: 8px;
  padding: 12px 14px;
}
.student-game-hub-page .student-section-hero__main--action-first,
.student-game-hub-page .student-section-hero__header,
.student-game-hub-page .student-section-hero__copy--action-first {
  gap: 8px;
}
.student-game-hub-page .student-section-hero__copy--action-first p {
  display: none;
}
.student-game-hub-page .student-section-hero__primary-action {
  width: 100%;
  max-width: 760px;
}
.student-game-hub-page .student-section-hero__metrics--status-row {
  gap: 8px;
}
.student-game-hub-page
  .student-section-hero__metrics--status-row
  .student-inline-metric {
  grid-template-columns: 1fr;
  grid-template-areas: "label" "value" "meta";
  gap: 4px;
  align-content: start;
}
.student-game-hub-page
  .student-section-hero__metrics--status-row
  .student-inline-metric__meta {
  justify-self: start;
  text-align: left;
  max-width: none;
  overflow-wrap: anywhere;
}
.student-game-hub-page .student-section-hero--with-aside {
  grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
  align-items: stretch;
}
.student-game-hub-page
  .student-section-hero--with-aside
  .student-section-hero__main--action-first,
.student-game-hub-page
  .student-section-hero--with-aside
  .student-section-hero__aside--compact {
  min-width: 0;
}
.student-game-hub-page
  .student-section-hero--with-aside
  .student-section-hero__aside--compact {
  display: flex;
  align-items: stretch;
  justify-content: stretch;
}
.student-game-hub-page
  .student-section-hero--with-aside
  .student-section-hero__aside--compact
  > * {
  flex: 1 1 auto;
}
.student-hero-preview {
  position: relative;
  min-height: 184px;
  height: 100%;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, white 24%);
  background:
    radial-gradient(circle at top left, #ffffffeb, #fff0 42%),
    linear-gradient(160deg, #f4f7fff0, #fff8eed1);
  box-shadow:
    inset 0 1px #ffffffb8,
    0 18px 40px #25355914;
  overflow: hidden;
  isolation: isolate;
}
.student-hero-preview:before,
.student-hero-preview:after {
  content: "";
  position: absolute;
  inset: auto;
  border-radius: 999px;
  pointer-events: none;
  z-index: 0;
}
.student-hero-preview:before {
  top: -46px;
  left: -28px;
  width: 132px;
  height: 132px;
  background: radial-gradient(circle, #7692ff33, #7692ff00);
}
.student-hero-preview:after {
  right: -34px;
  bottom: -52px;
  width: 158px;
  height: 158px;
  background: radial-gradient(circle, #f7c76d33, #f7c76d00);
}
.student-hero-preview__surface {
  position: relative;
  z-index: 1;
  display: grid;
  align-content: center;
  height: 100%;
  padding: 16px;
}
.student-hero-preview__glow {
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  box-shadow: 0 0 0 10px #ffffff29;
}
.student-hero-preview__glow--blue {
  top: 16px;
  right: 22px;
  background: #6c87fb;
}
.student-hero-preview__glow--gold {
  bottom: 18px;
  left: 24px;
  background: #e0ae46;
}
.student-hero-preview--sudoku .student-hero-preview__surface {
  place-items: center;
}
.student-hero-preview__sudoku-board {
  width: min(100%, 220px);
  aspect-ratio: 1;
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  border-radius: 18px;
  overflow: hidden;
  border: 2px solid rgba(109, 126, 166, 0.62);
  background: #ffffffad;
  backdrop-filter: blur(10px);
}
.student-hero-preview__sudoku-cell {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  border-right: 1px solid rgba(147, 160, 192, 0.44);
  border-bottom: 1px solid rgba(147, 160, 192, 0.44);
  color: #28375461;
  font-size: clamp(0.54rem, 1.4vw, 0.9rem);
  font-weight: 800;
  line-height: 1;
  background: #ffffff61;
}
.student-hero-preview__sudoku-cell:nth-child(9n) {
  border-right: 0;
}
.student-hero-preview__sudoku-cell:nth-last-child(-n + 9) {
  border-bottom: 0;
}
.student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(3n):not(:nth-child(9n)) {
  border-right-width: 2px;
  border-right-color: #6d7ea69e;
}
.student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(n + 19):nth-child(-n + 27),
.student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(n + 46):nth-child(-n + 54) {
  border-bottom-width: 2px;
  border-bottom-color: #6d7ea69e;
}
.student-hero-preview__sudoku-cell.is-filled {
  color: var(--text-strong);
}
.student-hero-preview__sudoku-cell.is-focus {
  background: linear-gradient(180deg, #e4ebfffa, #d6e0ffc7);
  box-shadow: inset 0 0 0 2px #6881f557;
}
.student-hero-preview--practice {
  background:
    radial-gradient(circle at top left, #e1ecffd1, #e1ecff00 44%),
    linear-gradient(160deg, #f5f9fffa, #eff7f3d6);
}
.student-hero-preview__practice-sheet {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 20px;
  border: 1px solid rgba(130, 155, 198, 0.26);
  background: #ffffffbd;
  box-shadow: inset 0 1px #ffffffdb;
}
.student-hero-preview__practice-dots {
  display: inline-flex;
  gap: 6px;
}
.student-hero-preview__practice-dots span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #8ea4c980;
}
.student-hero-preview__practice-dots span:first-child {
  background: #6984f5ad;
}
.student-hero-preview__practice-svg {
  width: 100%;
  height: 108px;
}
.student-hero-preview__geometry-shape,
.student-hero-preview__geometry-line {
  fill: none;
  stroke: #465776d6;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.student-hero-preview__geometry-line {
  stroke-width: 3;
  stroke: #7e95bfb8;
}
.student-hero-preview__geometry-arc {
  fill: none;
  stroke: #687b9f75;
  stroke-width: 3;
}
.student-hero-preview__geometry-arc--accent {
  stroke: #657ff6e0;
}
.student-hero-preview__geometry-point {
  fill: #657ff6db;
}
.student-hero-preview__geometry-label {
  fill: var(--text-strong);
  font-size: 16px;
  font-weight: 800;
  font-family:
    Trebuchet MS,
    Segoe UI,
    sans-serif;
}
.student-hero-preview__geometry-label--accent {
  fill: #657ff6eb;
}
.student-hero-preview__geometry-label--muted {
  fill: var(--text-muted);
  font-size: 13px;
}
.student-hero-preview__practice-answers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.student-hero-preview__practice-answers span {
  min-height: 12px;
  border-radius: 999px;
  background: #c1ccde85;
}
.student-hero-preview__practice-answers span.is-active {
  background: linear-gradient(90deg, #607cf4f0, #93b9ffb8);
}
.student-hero-preview--competition {
  background:
    radial-gradient(circle at top left, #e2ebffd1, #e2ebff00 44%),
    linear-gradient(160deg, #f5f8fffa, #fff5e3d6);
}
.student-hero-preview__competition-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.student-hero-preview__score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(97, 127, 248, 0.24);
  background: #ffffffd1;
  color: #4a62b9f0;
  font-size: 0.82rem;
  font-weight: 800;
}
.student-hero-preview__streak {
  display: inline-flex;
  gap: 6px;
}
.student-hero-preview__streak i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #e0ae4647;
}
.student-hero-preview__streak i:nth-child(-n + 2) {
  background: #e0ae46d1;
}
.student-hero-preview__pickup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-hero-preview__pickup-card {
  display: grid;
  place-items: center;
  min-height: 54px;
  border-radius: 18px;
  border: 1px solid rgba(137, 154, 196, 0.34);
  background: #ffffffd1;
  color: var(--text-strong);
  font-size: 0.98rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  box-shadow: inset 0 1px #ffffffbd;
}
.student-hero-preview__pickup-card.is-hot {
  border-color: #657ff661;
  background: linear-gradient(180deg, #e7eefffa, #d5e0ffcc);
  transform: translateY(-2px);
}
.student-hero-preview__pickup-card.is-hit {
  border-color: #6a9c6757;
  background: linear-gradient(180deg, #eff8eefa, #e4f1e2d6);
}
.student-hero-preview__race-track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.student-hero-preview__race-track span {
  min-height: 8px;
  border-radius: 999px;
  background: #becae07a;
}
.student-hero-preview__race-track span:nth-child(-n + 3) {
  background: linear-gradient(90deg, #657ff6e0, #e0ae46b3);
}
.student-hero-preview__surface {
  place-items: center;
  padding: 18px;
}
.student-hero-preview__frame {
  inline-size: min(100%, 454px);
  block-size: 188px;
  display: grid;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 24px;
  border: 1px solid rgba(130, 155, 198, 0.26);
  background: #ffffffbd;
  box-shadow: inset 0 1px #ffffffdb;
}
.student-hero-preview__frame--sudoku {
  place-items: center;
}
.student-hero-preview__frame--practice,
.student-hero-preview__frame--competition {
  align-content: start;
}
.student-hero-preview-switcher,
.student-hero-preview-switcher__stage {
  position: relative;
  min-height: 184px;
  height: 100%;
}
.student-hero-preview-switcher__panel {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity 0.28s ease,
    transform 0.28s ease;
  pointer-events: none;
}
.student-hero-preview-switcher__panel.is-active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.student-hero-preview-switcher__panel > .student-hero-preview {
  height: 100%;
}
.student-hero-preview-switcher__controls {
  position: absolute;
  left: 50%;
  bottom: 14px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(132, 154, 198, 0.26);
  background: #ffffffd6;
  box-shadow: 0 12px 24px #2535591f;
  transform: translate(-50%);
}
.student-hero-preview-switcher__dot {
  position: relative;
  inline-size: 44px;
  block-size: 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  transition:
    transform 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease;
}
.student-hero-preview-switcher__dot:after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  inline-size: 10px;
  block-size: 10px;
  border-radius: 999px;
  background: #919fbf9e;
  box-shadow: inset 0 0 0 1px #ffffffb8;
  transform: translate(-50%, -50%);
  transition:
    background 0.16s ease,
    box-shadow 0.16s ease;
}
.student-hero-preview-switcher__dot.is-active[data-games-preview-target="sudoku"]:after {
  background: #6c87fb;
}
.student-hero-preview-switcher__dot:hover,
.student-hero-preview-switcher__dot:focus-visible {
  transform: scale(1.14);
  outline: none;
  box-shadow: 0 0 0 3px #6c87fb33;
}
.student-hero-preview__sudoku-board {
  width: min(100%, 172px);
}
.student-hero-preview__practice-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.student-hero-preview__practice-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(97, 127, 248, 0.24);
  background: #ffffffd6;
  color: #4a62b9f0;
  font-size: 0.82rem;
  font-weight: 800;
}
.student-hero-preview__practice-chart {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
  min-height: 94px;
  padding: 12px 4px 0;
}
.student-hero-preview__practice-chart:before {
  content: "";
  position: absolute;
  inset: 8px 0 0;
  background:
    linear-gradient(180deg, #cdd8eb4d, #cdd8eb4d) top / 100% 1px no-repeat,
    linear-gradient(180deg, #cdd8eb3d, #cdd8eb3d) center / 100% 1px no-repeat,
    linear-gradient(180deg, #cdd8eb33, #cdd8eb33) bottom / 100% 1px no-repeat;
  pointer-events: none;
}
.student-hero-preview__practice-bar {
  position: relative;
  align-self: end;
  min-height: 34px;
  height: var(--bar-height, 56%);
  border-radius: 16px 16px 10px 10px;
  background: linear-gradient(180deg, #a3bafff5, #6e88f6c7);
  box-shadow:
    inset 0 1px #ffffff8f,
    0 10px 18px #657ff61f;
}
.student-hero-preview__practice-bar.is-active {
  background: linear-gradient(180deg, #fbd688f5, #e0ae46db);
  transform: translateY(-2px);
}
.student-hero-preview__practice-answers {
  gap: 10px;
}
.student-hero-preview__practice-answers span {
  min-height: 10px;
}
.student-hero-preview__competition-top {
  margin-bottom: 0;
}
.student-hero-preview__pickup-grid {
  gap: 10px;
}
.student-hero-preview__pickup-card {
  min-height: 54px;
}
.student-hero-preview__race-track {
  margin-top: 0;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview,
body.theme-dark .student-shell[data-learner-theme] .student-hero-preview {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top left,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 22%,
        transparent
      ),
      transparent 42%
    ),
    linear-gradient(
      160deg,
      var(--student-theme-dark-surface),
      var(--student-theme-dark-surface-soft)
    );
  box-shadow:
    inset 0 1px #ffffff14,
    0 18px 40px #0000003d;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(.student-hero-preview--practice, .student-hero-preview--competition),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(.student-hero-preview--practice, .student-hero-preview--competition),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(.student-hero-preview--practice, .student-hero-preview--competition) {
  background:
    radial-gradient(
      circle at top left,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 24%,
        transparent
      ),
      transparent 44%
    ),
    linear-gradient(
      160deg,
      color-mix(
        in srgb,
        rgba(14, 21, 36, 0.96) 84%,
        var(--student-theme-primary, #5a78ff) 16%
      ),
      color-mix(
        in srgb,
        rgba(8, 14, 25, 0.98) 90%,
        var(--student-theme-secondary, #dce6ff) 10%
      )
    );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(.student-hero-preview__frame, .student-hero-preview__practice-sheet),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(.student-hero-preview__frame, .student-hero-preview__practice-sheet),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(.student-hero-preview__frame, .student-hero-preview__practice-sheet) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(226, 235, 255, 0.16)
  );
  background: color-mix(
    in srgb,
    rgba(10, 16, 30, 0.9) 80%,
    var(--student-theme-primary, #5a78ff) 20%
  );
  box-shadow: inset 0 1px #ffffff14;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-board,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-board,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-board {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 30%,
    rgba(230, 236, 255, 0.24)
  );
  background: color-mix(
    in srgb,
    rgba(9, 15, 26, 0.94) 84%,
    var(--student-theme-primary, #5a78ff) 16%
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell {
  border-right-color: #95a5d247;
  border-bottom-color: #95a5d247;
  color: #e2ebff42;
  background: #ffffff0a;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(4n + 2),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(4n + 2),
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(4n + 2) {
  border-right-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(230, 236, 255, 0.34)
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(n + 5):nth-child(-n + 8),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(n + 5):nth-child(-n + 8),
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview--sudoku
  .student-hero-preview__sudoku-cell:nth-child(n + 5):nth-child(-n + 8) {
  border-bottom-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(230, 236, 255, 0.34)
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell.is-filled,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell.is-filled,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell.is-filled {
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell.is-focus,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell.is-focus,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__sudoku-cell.is-focus {
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(18, 27, 45, 0.96) 66%,
      var(--student-theme-primary, #5a78ff) 34%
    ),
    color-mix(
      in srgb,
      rgba(10, 16, 30, 0.96) 76%,
      var(--student-theme-primary, #5a78ff) 24%
    )
  );
  box-shadow: inset 0 0 0 2px
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 42%,
      rgba(230, 236, 255, 0.3)
    );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-dots
  span,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-dots
  span,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-dots
  span {
  background: #98a8d257;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-dots
  span:first-child,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-dots
  span:first-child,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-dots
  span:first-child {
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 76%,
    white 24%
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-hero-preview__geometry-shape,
    .student-hero-preview__geometry-label
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-hero-preview__geometry-shape,
    .student-hero-preview__geometry-label
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-hero-preview__geometry-shape,
    .student-hero-preview__geometry-label
  ) {
  stroke: #eaf0ffd6;
  fill: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-line,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-line,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-line {
  stroke: #95abe5b8;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-arc,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-arc,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-arc {
  stroke: #aabae557;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-arc--accent,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-arc--accent,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-arc--accent {
  stroke: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 82%,
    white 18%
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-point,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-point,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-point,
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-label--accent,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-label--accent,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-label--accent {
  fill: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 78%,
    white 22%
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-label--muted,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-label--muted,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__geometry-label--muted {
  fill: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-chart:before,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-chart:before,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__practice-chart:before {
  background:
    linear-gradient(180deg, #aabae533, #aabae533) top / 100% 1px no-repeat,
    linear-gradient(180deg, #aabae529, #aabae529) center / 100% 1px no-repeat,
    linear-gradient(180deg, #aabae51f, #aabae51f) bottom / 100% 1px no-repeat;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-hero-preview__practice-answers span,
    .student-hero-preview__race-track span
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-hero-preview__practice-answers span,
    .student-hero-preview__race-track span
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-hero-preview__practice-answers span,
    .student-hero-preview__race-track span
  ) {
  background: #a5b4dc3d;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(.student-hero-preview__practice-pill, .student-hero-preview__score),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(.student-hero-preview__practice-pill, .student-hero-preview__score),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(.student-hero-preview__practice-pill, .student-hero-preview__score) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(255, 255, 255, 0.18)
  );
  background: color-mix(
    in srgb,
    rgba(10, 16, 30, 0.82) 74%,
    var(--student-theme-primary, #5a78ff) 26%
  );
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 20%,
    rgba(226, 235, 255, 0.14)
  );
  background: color-mix(
    in srgb,
    rgba(10, 16, 30, 0.86) 78%,
    var(--student-theme-primary, #5a78ff) 22%
  );
  color: var(--student-theme-dark-strong);
  box-shadow: inset 0 1px #ffffff14;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card.is-hot,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card.is-hot,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card.is-hot {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 42%,
    rgba(230, 236, 255, 0.22)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(18, 27, 45, 0.96) 58%,
      var(--student-theme-primary, #5a78ff) 42%
    ),
    color-mix(
      in srgb,
      rgba(10, 16, 30, 0.96) 74%,
      var(--student-theme-primary, #5a78ff) 26%
    )
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card.is-hit,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card.is-hit,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__pickup-card.is-hit {
  border-color: #74a67047;
  background: linear-gradient(180deg, #1a3021f5, #101e17f5);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview-switcher__controls,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview-switcher__controls,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview-switcher__controls {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(226, 235, 255, 0.16)
  );
  background: #080e19d6;
  box-shadow: 0 14px 28px #0000003d;
}
.student-game-hub-stack {
  display: grid;
  gap: 12px;
  width: 100%;
  margin: 0;
}
.student-game-hub-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.38fr) minmax(280px, 0.62fr);
  gap: 12px;
  align-items: start;
}
.student-game-hub-card {
  gap: 12px;
}
.student-game-hub-card .section-header .eyebrow {
  display: none;
  margin: 0;
}
.student-game-hub-card > .muted.small {
  display: none;
}
.student-game-hub-card .section-header h2 {
  display: block;
  margin: 0;
  font-size: clamp(1.04rem, 1.4vw, 1.2rem);
}
.student-game-hub-card .student-practice-start-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: 12px;
}
.student-game-hub-card .student-practice-start-card {
  min-height: 124px;
  padding: 14px 16px;
  border-radius: 22px;
  align-content: start;
}
.student-game-hub-card .student-practice-start-card__detail {
  display: block;
  max-width: 30ch;
}
.student-game-hub-card .student-practice-start-card__title {
  font-size: 1.02rem;
  line-height: 1.18;
}
.student-game-hub-card .student-practice-start-card__copy {
  gap: 4px;
}
@media (max-width: 1180px) {
  .student-game-hub-page .student-section-hero--with-aside {
    grid-template-columns: 1fr;
  }
  .student-game-hub-page
    .student-section-hero--with-aside
    .student-section-hero__aside--compact {
    display: flex;
  }
}
.student-practice-start-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 12px;
  min-width: 0;
}
.student-practice-start-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  align-content: start;
  justify-items: start;
  gap: 10px 12px;
  min-height: 108px;
  width: 100%;
  padding: 14px 16px;
  border-radius: 24px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--practice-accent, #5d8ef7) 14%,
      var(--practice-border-strong) 86%
    );
  background: var(--practice-surface-strong);
  color: var(--text-strong);
  text-align: left;
  text-decoration: none;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 44%, transparent),
    0 12px 28px
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 8%, transparent);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}
.student-practice-start-card:before,
.practice-builder-choice:before {
  content: "";
  position: absolute;
  inset: 10px auto auto 10px;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 12%, white 88%),
    transparent
  );
  pointer-events: none;
  opacity: 0.92;
}
.student-practice-start-card:after,
.practice-builder-choice:after {
  content: "";
  position: absolute;
  inset: auto -18px -18px auto;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 12%, transparent) 0,
    transparent 72%
  );
  pointer-events: none;
}
.student-practice-start-card[data-practice-card-tone="blue"],
.practice-builder-choice[data-practice-choice-tone="blue"] {
  --practice-accent: #5d8ef7;
  --practice-accent-strong: #2f5fe6;
}
.student-practice-start-card[data-practice-card-tone="gold"],
.practice-builder-choice[data-practice-choice-tone="gold"] {
  --practice-accent: #d6a94e;
  --practice-accent-strong: #a26b00;
}
.student-practice-start-card[data-practice-card-tone="sage"],
.practice-builder-choice[data-practice-choice-tone="sage"] {
  --practice-accent: #86a378;
  --practice-accent-strong: #4f6948;
}
.student-practice-start-card:hover,
.student-practice-start-card:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 58%,
    var(--practice-border-strong) 42%
  );
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 52%, transparent),
    0 18px 34px
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 16%, transparent);
}
.student-practice-start-card__visual,
.practice-builder-choice__visual,
.student-practice-builder__launch-visual {
  position: relative;
  z-index: 1;
}
.student-practice-start-card__visual {
  grid-column: 1;
  grid-row: 1 / span 2;
}
.student-practice-start-card__copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 4px;
  min-width: 0;
  width: 100%;
}
.student-practice-start-card__title {
  position: relative;
  z-index: 1;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.22;
  text-wrap: pretty;
  text-align: left;
}
.student-practice-start-card__detail {
  position: relative;
  z-index: 1;
  color: var(--text-muted);
  font-size: 0.86rem;
  line-height: 1.35;
  text-wrap: balance;
  text-align: left;
}
.student-practice-start-card__cta {
  position: relative;
  z-index: 1;
  grid-column: 1 / -1;
  justify-self: start;
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--practice-accent-strong, #2f5fe6) 36%, white 64%);
  background: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 14%,
    white 86%
  );
  color: var(--practice-accent-strong, #2f5fe6);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  box-shadow: 0 8px 18px
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 12%, transparent);
}
.student-practice-start-card:hover .student-practice-start-card__cta,
.student-practice-start-card:focus-visible .student-practice-start-card__cta {
  background: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 20%,
    white 80%
  );
}
.student-practice-hero-action .student-practice-start-card {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  min-height: 92px;
  padding: 14px 16px;
  gap: 0 16px;
  text-align: left;
}
.student-practice-hero-action .student-practice-start-card__visual {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}
.student-practice-hero-action .student-practice-start-card__copy {
  grid-column: 2;
  grid-row: 1;
}
.student-practice-hero-action .student-practice-start-card__title {
  font-size: 1.12rem;
}
.student-practice-hero-action .student-practice-start-card__detail {
  margin-top: 2px;
  max-width: 40ch;
}
.student-practice-hero-action .student-practice-start-card__cta {
  grid-column: 3;
  grid-row: 1;
  margin-top: 0;
  justify-self: end;
}
.student-practice-start-grid .student-practice-start-card__detail,
.student-game-hub-card
  .student-practice-start-grid
  .student-practice-start-card__detail {
  display: block;
  max-width: 30ch;
}
.student-practice-start-grid--custom {
  grid-template-columns: 1fr;
}
.student-game-hub-card
  .student-practice-start-grid--games
  .student-practice-start-card__detail {
  display: block;
  max-width: 30ch;
}
.student-practice-start-card--hub-game {
  min-height: 120px;
}
.student-game-hub-card
  .student-practice-start-grid--custom
  .student-practice-start-card__detail {
  display: block;
  max-width: 48ch;
}
.student-practice-start-card--wide-action {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  min-height: 88px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 10%, white 90%),
    var(--practice-surface-strong)
  );
  box-shadow: 0 14px 28px
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 12%, transparent);
}
.student-practice-start-card--wide-action .student-practice-start-card__visual {
  grid-row: 1;
}
.student-practice-start-card--wide-action .student-practice-start-card__copy {
  grid-column: 2;
  grid-row: 1;
}
.student-practice-start-card--wide-action .student-practice-start-card__cta {
  grid-column: 3;
  grid-row: 1;
  margin-top: 0;
  justify-self: end;
}
.practice-icon {
  display: inline-grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, currentColor 12%, white 88%),
    color-mix(in srgb, currentColor 4%, white 96%)
  );
}
.practice-icon svg {
  width: 28px;
  height: 28px;
}
.practice-icon--blue {
  color: #2f5fe6;
}
.practice-icon--gold {
  color: #a26b00;
}
.practice-icon--sage {
  color: #4f6948;
}
.student-practice-builder__launch {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  gap: 12px;
  align-items: center;
  padding: 16px;
  border-radius: 24px;
  border: 1px solid
    color-mix(in srgb, #5d8ef7 14%, var(--practice-border-strong) 86%);
  background: var(--practice-surface-strong);
  color: var(--text-strong);
  text-align: left;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 44%, transparent),
    0 12px 28px #1b2a440d;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}
.student-practice-builder__launch:hover,
.student-practice-builder__launch:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(
    in srgb,
    #5d8ef7 54%,
    var(--practice-border-strong) 46%
  );
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 52%, transparent),
    0 14px 30px #5d8ef724;
}
.student-practice-builder__launch[disabled] {
  cursor: not-allowed;
  opacity: 0.62;
  transform: none;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, white 40%, transparent);
}
.student-practice-builder__launch-copy {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.student-practice-builder__launch-copy strong {
  font-size: 1.04rem;
  line-height: 1.24;
  text-wrap: balance;
}
.student-practice-builder__wizard {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.student-practice-builder__step {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--practice-border);
  border-radius: 26px;
  background: var(--practice-surface-strong);
  position: relative;
  overflow: hidden;
  box-shadow:
    inset 0 1px color-mix(in srgb, white 34%, transparent),
    0 16px 34px #705b2e0f;
}
.student-practice-builder__step:before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    color-mix(in srgb, #f1dca6 26%, transparent) 0,
    transparent 72%
  );
  pointer-events: none;
}
.student-practice-builder__step .section-header {
  text-align: center;
  min-width: 0;
}
.student-practice-builder__step .section-header > div {
  position: relative;
  display: block;
  width: 100%;
  min-height: 34px;
}
.student-practice-builder__step .section-header .eyebrow {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  min-width: 34px;
  height: 34px;
  padding: 0 11px;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #f0ddb6 72%, white 28%),
    color-mix(in srgb, #dfe8ff 86%, white 14%)
  );
  color: #2f5fe6;
  font-size: 0.79rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  box-shadow: 0 8px 20px #5d8ef71f;
}
.student-practice-builder__step .section-header h3 {
  margin: 0;
  padding-inline: 52px;
  text-align: center;
  text-wrap: balance;
}
.practice-builder-choice-grid {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.practice-builder-choice-grid--focus,
.practice-builder-choice-grid--three {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
}
.practice-builder-choice-grid--four {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}
.practice-builder-choice {
  min-height: 134px;
  width: 100%;
  padding: 16px 14px;
  border-radius: 24px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--practice-accent, #5d8ef7) 14%,
      var(--practice-border-strong) 86%
    );
  background: var(--practice-surface);
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 10px;
  text-align: center;
  color: var(--text-strong);
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 42%, transparent),
    0 12px 28px
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 8%, transparent);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}
.practice-builder-choice__title {
  position: relative;
  z-index: 1;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.22;
  text-wrap: balance;
}
.practice-builder-choice__detail {
  display: none;
}
.practice-builder-choice.is-selected {
  border-color: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 62%,
    var(--practice-border-strong) 38%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 12%, white 88%),
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 5%, white 95%)
  );
  box-shadow: 0 18px 34px
    color-mix(in srgb, var(--practice-accent, #5d8ef7) 16%, transparent);
  transform: translateY(-2px);
}
.practice-builder-choice[disabled] {
  opacity: 0.56;
  box-shadow: none;
}
.student-practice-builder__summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: 10px;
}
.student-practice-builder__summary-tile {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  min-height: 138px;
  padding: 16px 14px;
  border-radius: 22px;
  border: 1px solid var(--practice-border);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, white 66%, var(--bg-panel) 34%),
    color-mix(in srgb, white 48%, var(--bg-panel) 52%)
  );
  text-align: center;
}
.student-practice-builder__summary-tile strong {
  font-size: 1.03rem;
  line-height: 1.2;
  text-wrap: balance;
}
.student-practice-builder__summary-tile span {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.student-practice-builder__why {
  display: grid;
  gap: 4px;
  margin: 10px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--practice-border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--practice-surface) 88%, white 12%);
  color: var(--text-strong);
}
.student-practice-builder__why span {
  color: var(--text-muted);
}
.student-practice-prep {
  display: grid;
  gap: 16px;
  outline: none;
}
.student-practice-prep__status {
  font-size: 1.08rem;
  font-weight: 800;
  color: var(--text-strong);
}
.student-practice-prep__steps {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.student-practice-prep__steps li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--practice-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--practice-surface) 88%, white 12%);
  color: var(--text-muted);
}
.student-practice-prep__steps li span {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: var(--bg-interactive);
  color: var(--text-muted);
  font-weight: 800;
}
.student-practice-prep__steps li.is-active,
.student-practice-prep__steps li.is-done {
  border-color: color-mix(
    in srgb,
    var(--brand-600) 34%,
    var(--practice-border)
  );
  color: var(--text-strong);
}
.student-practice-prep__steps li.is-active span,
.student-practice-prep__steps li.is-done span {
  background: var(--brand-600);
  color: #fff;
}
.student-practice-prep__message {
  margin: 0;
}
.student-practice-prep__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.student-practice-prep__actions .btn {
  min-height: 44px;
  flex: 1 1 180px;
}
.student-page-content--runner
  :is(.runner-actions-v2, .runner-rail-card-v2--keyboard)
  .btn:disabled,
.student-page-content--runner
  :is(.runner-actions-v2, .runner-rail-card-v2--keyboard)
  .btn[aria-disabled="true"] {
  opacity: 0.78;
  color: var(--text-muted);
  border-color: color-mix(in srgb, var(--line-default) 86%, transparent);
  background: color-mix(
    in srgb,
    var(--bg-interactive) 82%,
    var(--bg-panel) 18%
  );
  cursor: not-allowed;
}
html:not([data-appearance="dark"]):not([data-theme="dark"])
  body.portal-student
  :is(
    .student-practice-start-card,
    .student-practice-builder__launch,
    .practice-builder-choice
  ),
body.portal-student:not(.theme-dark)
  :is(
    .student-practice-start-card,
    .student-practice-builder__launch,
    .practice-builder-choice
  ) {
  border-color: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 18%,
    rgba(34, 48, 71, 0.22) 82%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, white 95%, var(--practice-accent, #5d8ef7) 5%),
    color-mix(in srgb, white 86%, var(--practice-accent, #5d8ef7) 14%)
  );
  box-shadow:
    inset 0 0 0 1px #ffffffc2,
    0 0 0 1px #22304714,
    0 1px #ffffffd1,
    0 10px 22px #1b2a440d;
}
html:not([data-appearance="dark"]):not([data-theme="dark"])
  body.portal-student
  :is(.student-practice-start-card:before, .practice-builder-choice:before),
body.portal-student:not(.theme-dark)
  :is(.student-practice-start-card:before, .practice-builder-choice:before) {
  opacity: 0.52;
}
html:not([data-appearance="dark"]):not([data-theme="dark"])
  body.portal-student
  :is(.student-practice-start-card:after, .practice-builder-choice:after),
body.portal-student:not(.theme-dark)
  :is(.student-practice-start-card:after, .practice-builder-choice:after) {
  opacity: 0.24;
}
html:not([data-appearance="dark"]):not([data-theme="dark"])
  body.portal-student
  :is(
    .student-practice-start-card:hover,
    .student-practice-start-card:focus-visible,
    .student-practice-builder__launch:hover,
    .student-practice-builder__launch:focus-visible,
    .practice-builder-choice.is-selected
  ),
body.portal-student:not(.theme-dark)
  :is(
    .student-practice-start-card:hover,
    .student-practice-start-card:focus-visible,
    .student-practice-builder__launch:hover,
    .student-practice-builder__launch:focus-visible,
    .practice-builder-choice.is-selected
  ) {
  box-shadow:
    inset 0 0 0 1px #ffffffd6,
    0 0 0 1px #2230471a,
    0 16px 30px
      color-mix(
        in srgb,
        var(--practice-accent, #5d8ef7) 12%,
        rgba(27, 42, 68, 0.02)
      );
}
.student-practice-builder__actions {
  display: flex;
  gap: 10px;
  align-items: center;
  padding-top: 6px;
  border-top: 1px solid var(--practice-divider);
}
.student-practice-builder__actions .btn {
  flex: 1 1 0;
}
@media (max-width: 960px) {
  body.portal-student {
    --student-mobile-nav-height: 92px;
    --student-mobile-nav-gap: 20px;
    --student-mobile-bottom-clearance: calc(
      var(--student-mobile-nav-height) + var(--student-mobile-nav-gap) +
        var(--safe-area-bottom)
    );
  }
  .student-shell--compact-page .student-shell__body,
  .student-shell--compact-page .student-shell__body--with-nav {
    padding-bottom: calc(var(--student-mobile-bottom-clearance) + 24px);
  }
  .student-shell--compact-page .student-page-content {
    width: 100%;
    max-width: none;
  }
  .student-shell__body--with-nav,
  .student-shell__body--with-nav.student-nav-collapsed {
    grid-template-columns: 1fr;
  }
  .student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__inner {
    min-height: 46px;
    padding: max(6px, env(safe-area-inset-top)) 12px 7px;
  }
  .student-shell--focus-mode > .mp-topbar:first-child .mp-topbar__brand img,
  .student-shell--focus-mode > .mp-topbar:first-child .topbar-brand-image {
    height: 24px;
    max-height: 24px;
    max-width: min(152px, 100%);
  }
  .student-focus-shell__bar {
    flex-direction: column;
    align-items: stretch;
  }
  .student-shell--focus-mode .student-focus-shell__actions {
    width: 100%;
  }
  .student-shell--focus-mode .student-focus-shell__actions > .btn {
    width: 100%;
  }
  .student-focus-shell__meta {
    text-align: left;
  }
  .student-shell--focus-mode .student-page-content--runner .runner-shell-v2 {
    width: 100%;
    max-width: none;
    min-height: 0;
    height: auto;
    max-height: none;
    gap: 10px;
    padding: 0 0 12px;
    overflow: visible;
  }
  .student-shell--focus-mode .student-page-content--runner .runner-header-v2 {
    padding-inline: 0;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2 {
    padding: 14px;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-answer-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-commandbar-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    [data-runner-tools-card],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    [data-runner-actions-card] {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2 {
    width: 100%;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    input,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    textarea,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    [data-answer-input] {
    min-height: 64px;
    padding: 12px 14px;
    font-size: clamp(1rem, 4.8vw, 1.18rem);
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    input::placeholder,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    textarea::placeholder,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2
    .runner-answer-stack-v2
    [data-answer-input]::placeholder {
    font-size: 0.88em;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    .runner-rail-card-v2 {
    padding: 12px;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    .runner-actions-v2
    .btn {
    min-height: 54px;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn[data-runner-key="enter"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    .runner-command-button-v2 {
    min-height: 56px;
  }
  .student-side-nav--compact {
    display: none;
  }
  .student-mobile-nav {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    padding: 0 10px calc(10px + var(--safe-area-bottom));
  }
  .student-shell__body,
  .student-shell__body--with-nav {
    padding-bottom: calc(var(--student-mobile-bottom-clearance) + 18px);
    scroll-padding-bottom: calc(var(--student-mobile-bottom-clearance) + 36px);
  }
  .student-home-hero-grid--ux-refresh,
  .student-home-support-grid--ux-refresh,
  .student-practice-hub-grid,
  .student-competition-support-grid {
    grid-template-columns: 1fr;
  }
  .student-competition-action-grid,
  .student-home-choice-grid--triple,
  .student-home-quick-links--compact,
  .student-practice-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-competition-status-strip {
    grid-template-columns: 1fr;
  }
  .practice-builder-choice-grid--three,
  .practice-builder-choice-grid--four,
  .practice-builder-choice-grid--five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-practice-builder__launch {
    flex-direction: column;
    align-items: flex-start;
  }
  .student-practice-hero-action .student-practice-start-card {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    min-height: 112px;
    padding: 16px;
    gap: 8px;
  }
  .student-practice-hero-action .student-practice-start-card__visual,
  .student-practice-hero-action .student-practice-start-card__copy,
  .student-practice-hero-action .student-practice-start-card__cta {
    grid-column: auto;
    grid-row: auto;
    text-align: center;
  }
  .student-practice-hero-action .student-practice-start-card__copy {
    justify-items: center;
  }
  .student-practice-hero-action .student-practice-start-card__detail {
    max-width: none;
  }
  .student-practice-hero-action .student-practice-start-card__cta {
    justify-self: center;
    margin-top: 4px;
  }
  .student-practice-start-card--wide-action {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }
  .student-practice-start-card--wide-action
    .student-practice-start-card__visual,
  .student-practice-start-card--wide-action .student-practice-start-card__copy,
  .student-practice-start-card--wide-action .student-practice-start-card__cta {
    grid-column: auto;
    grid-row: auto;
    justify-self: center;
    text-align: center;
  }
  .student-practice-start-card--wide-action .student-practice-start-card__copy {
    justify-items: center;
  }
  .student-practice-builder__actions {
    position: static;
    bottom: auto;
    padding-top: 8px;
    background: none;
  }
  .student-competition-preview-card {
    display: none;
  }
  .competition-sprint-actions {
    position: static;
    bottom: auto;
    z-index: auto;
    padding: 8px 0 0;
    background: none;
    backdrop-filter: none;
  }
}
@media (min-width: 961px) and (max-width: 1180px) {
  .student-home-hero-grid--ux-refresh,
  .student-home-support-grid--ux-refresh,
  .student-practice-hub-grid,
  .student-competition-support-grid {
    grid-template-columns: 1fr;
  }
  .student-home-choice-grid--triple,
  .student-competition-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .student-home-choice-grid--triple,
  .student-home-quick-links--compact,
  .student-practice-quick-grid,
  .student-competition-action-grid,
  .practice-builder-choice-grid--three,
  .practice-builder-choice-grid--four,
  .practice-builder-choice-grid--five {
    grid-template-columns: 1fr;
  }
  .student-practice-builder__actions {
    position: static;
    padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px));
    background: transparent;
  }
  .student-mobile-nav__bar {
    gap: 6px;
    padding: 8px;
  }
  .student-mobile-nav__link {
    min-height: 54px;
  }
  .student-mobile-nav__label {
    font-size: 0.64rem;
  }
}
body:not(.portal-student) .runner-shell-v2 .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr) minmax(
      380px,
      var(--runner-answer-dock-width, 420px)
    );
  gap: 20px;
  align-items: start;
}
body:not(.portal-student) .runner-shell-v2 .runner-question-card-v2 {
  gap: 18px;
  padding: 18px 18px 20px;
}
body:not(.portal-student) .runner-shell-v2 .runner-question-body-v2,
body:not(.portal-student) .runner-shell-v2 .runner-question-stage-v2 {
  gap: 16px;
}
body:not(.portal-student) .runner-shell-v2 .runner-answer-panel-v2 {
  display: grid;
  gap: 0;
  align-content: stretch;
}
body:not(.portal-student) .runner-shell-v2 .runner-answer-stage-v2,
body:not(.portal-student) .runner-shell-v2 .runner-answer-tools-wrap-v2,
body:not(.portal-student) .runner-shell-v2 .runner-commandbar-wrap-v2 {
  width: 100%;
  margin-inline: 0;
}
.runner-answer-tools-v2 {
  padding: 8px;
  border-radius: 16px;
}
.runner-answer-tools-v2 .runner-keyboard,
.runner-answer-tools-v2 .runner-keyboard-row,
.runner-answer-tools-v2 .runner-keyboard-actions {
  gap: 10px;
}
body:not(.portal-student) .runner-answer-tools-v2 .btn {
  min-height: 60px;
  font-size: 1.12rem;
  font-weight: 800;
}
.runner-commandbar-v2,
.runner-commandbar-wrap-v2 .runner-actions-v2 {
  display: grid;
  gap: 10px;
}
.runner-commandbar-v2 .runner-command-button-v2 {
  width: 100%;
  min-height: 64px;
  font-size: 1.08rem;
}
.runner-modal-panel {
  display: grid;
  gap: 16px;
}
.runner-modal-panel .runner-hint,
.runner-modal-panel .runner-worked {
  width: 100%;
  margin-top: 0;
}
.runner-modal-panel__actions {
  justify-content: flex-end;
}
.runner-pause-modal__copy {
  display: grid;
  gap: 8px;
}
.runner-pause-modal__copy h4 {
  margin: 0;
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  color: var(--text-strong);
}
.runner-pause-modal__copy p {
  margin: 0;
}
.runner-pause-modal__status {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.runner-pause-modal__actions {
  justify-content: flex-start;
}
.runner-modal-layer--locked {
  pointer-events: none;
}
.runner-modal-layer--locked .modal-card {
  pointer-events: auto;
}
.runner-modal-layer--locked #modalCloseBtn {
  display: none;
}
.mp-session-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2200;
  display: grid;
  place-items: center;
  padding: clamp(16px, 4vw, 40px);
  background: rgba(26, 32, 44, 0.48);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.mp-session-dialog {
  width: min(100%, 520px);
  display: grid;
  gap: 10px;
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, white 16%);
  border-radius: 24px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  box-shadow: var(--shadow-lg);
  color: var(--text-strong);
}
.mp-session-dialog__eyebrow {
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--brand-700) 76%, var(--text-strong) 24%);
}
.mp-session-dialog__title {
  margin: 0;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  line-height: 1.1;
  color: var(--text-strong);
  letter-spacing: 0;
}
.mp-session-dialog__message {
  margin: 0;
  color: var(--text-body);
  line-height: 1.45;
}
.mp-session-dialog__actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
}
.mp-session-dialog__button {
  appearance: none;
  min-height: 48px;
  border: 1px solid var(--line-default);
  border-radius: 16px;
  padding: 0 18px;
  background: var(--bg-interactive);
  color: var(--text-strong);
  font-weight: 850;
  box-shadow: var(--shadow-sm);
}
.mp-session-dialog__button:hover {
  background: var(--bg-hover);
  border-color: color-mix(
    in srgb,
    var(--brand-500) 28%,
    var(--line-default) 72%
  );
}
.mp-session-dialog__button--danger {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--danger-100) 78%, var(--bg-panel) 22%),
    color-mix(in srgb, var(--danger-100) 60%, var(--bg-panel-2) 40%)
  );
  border-color: color-mix(
    in srgb,
    var(--danger-700) 30%,
    var(--line-default) 70%
  );
  color: var(--danger-700);
}
.mp-session-dialog__button--danger:hover {
  background: color-mix(in srgb, var(--danger-100) 82%, var(--bg-panel) 18%);
  border-color: color-mix(
    in srgb,
    var(--danger-700) 44%,
    var(--line-default) 56%
  );
}
@media (max-width: 560px) {
  .mp-session-dialog {
    padding: 20px;
    border-radius: 22px;
  }
  .mp-session-dialog__actions {
    grid-template-columns: 1fr;
  }
  .mp-session-dialog__button {
    width: 100%;
  }
}
@media (min-width: 821px) {
  .student-page-content--runner
    .runner-shell-v2:not([data-runner-form-factor="touch-stack"])
    .runner-rail-slot-v2 {
    min-height: 0;
  }
}
@media (max-width: 960px) {
  body:not(.portal-student) .runner-shell-v2 .runner-stage-v2 {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  body:not(.portal-student) .runner-answer-tools-v2 .btn {
    min-height: 64px;
  }
}
@media (max-width: 640px) {
  body:not(.portal-student) .runner-shell-v2 .runner-question-card-v2 {
    padding: 14px 14px 16px;
  }
  body:not(.portal-student) .runner-answer-tools-v2 .btn,
  .runner-commandbar-v2 .runner-command-button-v2 {
    min-height: 58px;
  }
}
@media (max-width: 560px) {
  .mp-topbar--public-home .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "left right";
    min-height: 48px;
    padding: 4px 10px 5px;
    align-items: center;
    row-gap: 0;
    column-gap: 6px;
  }
  .mp-topbar--public-home .mp-topbar__center,
  .mp-topbar--public-home .mp-public-auth-actions {
    display: none;
  }
  .mp-topbar--public-home .mp-topbar__left,
  .mp-topbar--public-home .mp-topbar__right,
  .mp-topbar--public-home .mp-topbar__right--signed-out {
    width: auto;
    min-height: auto;
    align-self: center;
    justify-self: end;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 0;
  }
  .mp-topbar--public-home .mp-topbar__left {
    justify-self: start;
    justify-content: flex-start;
  }
  .mp-topbar--public-home .mp-topbar__right--signed-out {
    display: flex;
    align-items: center;
    row-gap: 0;
  }
  .mp-topbar--public-home .mp-topbar__utility-pill {
    width: auto;
    min-height: auto;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 0;
  }
  .mp-topbar--public-home .mp-language-menu,
  .mp-topbar--public-home .mp-tool-group {
    width: auto;
    flex: 0 0 auto;
  }
  .mp-topbar--public-home .mp-tool-group {
    gap: 0;
  }
  .mp-topbar--public-home [data-font-toggle] {
    display: none;
  }
  .mp-topbar--public-home .mp-language-menu summary,
  .mp-topbar--public-home .mp-topbar__control {
    min-height: 36px;
    padding-inline: 4px;
    font-size: 0.94rem;
  }
  .mp-topbar--public-home .mp-language-menu summary,
  .mp-topbar--public-home .mp-topbar__control--theme {
    min-width: 36px;
  }
  .mp-topbar--public-home .mp-topbar__control svg,
  .mp-topbar--public-home .mp-topbar__control .mp-icon {
    width: 1.04rem;
    height: 1.04rem;
  }
  .mp-topbar--public-home .topbar-brand-image,
  .mp-topbar--public-home .mp-topbar__brand img {
    height: 24px;
    max-height: 24px;
    max-width: min(144px, 100%);
  }
}
@media (max-width: 420px) {
  .mp-topbar--public-home .mp-topbar__inner {
    padding-inline: 8px;
  }
  .mp-topbar--public-home .mp-language-menu summary,
  .mp-topbar--public-home .mp-topbar__control {
    min-height: 34px;
    font-size: 0.9rem;
  }
  .mp-topbar--public-home .topbar-brand-image,
  .mp-topbar--public-home .mp-topbar__brand img {
    height: 22px;
    max-height: 22px;
    max-width: min(136px, 100%);
  }
}
.student-mobile-nav__label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
}
.student-mobile-nav__label--compact {
  font-size: 0.62rem;
  letter-spacing: -0.01em;
}
@media (max-width: 640px) {
  .student-mobile-nav__label--compact {
    font-size: 0.6rem;
  }
}
@media (min-width: 821px) {
  .runner-question-card-v2.runner-question-panel--compact-short {
    min-height: clamp(200px, 24vh, 280px);
    align-self: start;
    height: auto;
  }
  .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-body-v2,
  .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-stage-v2 {
    gap: 12px;
  }
  .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-stage-v2 {
    min-height: auto;
    align-content: start;
  }
  .runner-question-card-v2.runner-question-panel--compact-short
    .runner-prompt:not(.runner-prompt--raw) {
    width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    margin-inline: 0;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--compact-short {
    min-height: clamp(220px, 28vh, 300px);
    padding: 16px 18px 18px;
  }
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--compact-short:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.8rem, 2.3vw, 2.6rem);
  }
}
.runner-shell-v2.runner-shell-v2--choice-copy-heavy .runner-answer-stage-v2,
.runner-shell-v2.runner-shell-v2--choice-copy-heavy .runner-answer-stack-v2 {
  width: min(100%, 64rem);
}
.runner-shell-v2.runner-shell-v2--choice-copy-heavy
  .options-grid[data-option-grid] {
  width: min(100%, 64rem);
  max-width: 100%;
  margin-inline: auto;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}
.runner-shell-v2.runner-shell-v2--choice-copy-heavy .option-chip--tile,
.runner-shell-v2.runner-shell-v2--choice-copy-heavy .option-chip--single {
  min-height: 96px;
  align-items: stretch;
}
.runner-shell-v2.runner-shell-v2--choice-copy-heavy .option-chip--tile > span,
.runner-shell-v2.runner-shell-v2--choice-copy-heavy
  .option-chip--single
  > span {
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: normal;
  text-wrap: balance;
  overflow-wrap: anywhere;
  line-height: 1.25;
  font-size: clamp(0.98rem, 1.15vw, 1.18rem);
  padding: 14px 16px;
}
.runner-shell-v2.runner-shell-v2--choice-copy-heavy
  .runner-answer-body-v2
  .options-grid--scroll-list {
  height: min(48dvh, 360px);
  max-height: min(48dvh, 360px);
}
@media (max-width: 900px) {
  .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .runner-answer-body-v2
    .options-grid--scroll-list {
    height: min(25dvh, 300px);
    max-height: min(25dvh, 300px);
  }
}
@media (max-width: 600px) {
  .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .runner-answer-body-v2
    .options-grid--scroll-list {
    height: min(20dvh, 170px);
    max-height: min(20dvh, 170px);
  }
}
@media (min-width: 821px) {
  .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  .student-page-content--runner
    .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .runner-response-zone-v2 {
    position: static;
    top: auto;
  }
}
@media (min-width: 961px) {
  body:not(.portal-student)
    .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}
@media (max-width: 820px) {
  .runner-shell-v2.runner-shell-v2--choice-copy-heavy
    .options-grid[data-option-grid] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"] {
  --runner-touch-stage-max: 56rem;
  --runner-touch-visual-max: 72rem;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
.student-shell--focus-mode .student-focus-shell__bar--runner {
  gap: 8px;
  justify-content: flex-end;
}
@media (min-width: 821px) {
  .student-shell--focus-mode .student-page-content--runner .runner-header-v2 {
    display: none;
  }
}
@media (max-width: 1180px) and (min-width: 821px) {
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__inner {
    padding-inline: 14px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-slot {
    gap: 10px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-progress {
    gap: 8px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-pill {
    min-height: 36px;
    padding: 6px 12px;
    font-size: 0.88rem;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-progress-meta {
    font-size: 0.72rem;
  }
}
@media (max-width: 820px) {
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__inner {
    padding: 6px 12px 7px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__brand
    img,
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .topbar-brand-image {
    height: 24px;
    max-height: 24px;
    max-width: min(142px, 100%);
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-slot {
    justify-content: flex-end;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-progress {
    display: none;
  }
  .student-shell--focus-mode .student-focus-shell__bar--runner {
    display: none;
  }
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-response-zone-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-response-zone-v2 {
  position: static;
  top: auto;
  gap: 8px;
  align-content: start;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2 {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 6px 8px;
  min-height: 0;
  padding: 6px 8px;
  border-radius: 18px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__left,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__right,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__left,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__right {
  display: contents;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__left,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__left {
  grid-area: auto;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__center,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__center {
  grid-area: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  min-width: clamp(88px, 28vw, 180px);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__right,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__right {
  grid-area: auto;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__progress-meta,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__progress-meta {
  display: contents;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-caption-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-caption-v2 {
  display: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-v2 {
  min-width: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-value-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-value-v2 {
  justify-self: end;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2 {
  min-height: 30px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 0.74rem;
  letter-spacing: 0.03em;
}
.runner-response-zone-v2 .options-grid[data-option-grid],
.runner-answer-stage-v2 .options-grid[data-option-grid] {
  width: 100%;
  max-width: 100%;
  grid-template-columns: repeat(var(--option-grid-cols, 1), minmax(0, 1fr));
}
.runner-response-zone-v2 .options-grid--wordy-choice[data-option-grid],
.runner-answer-stage-v2 .options-grid--wordy-choice[data-option-grid] {
  grid-template-columns: minmax(0, 1fr);
}
.runner-response-zone-v2 .option-chip--tile > span,
.runner-response-zone-v2 .option-chip--single > span,
.runner-answer-stage-v2 .option-chip--tile > span,
.runner-answer-stage-v2 .option-chip--single > span {
  min-width: 0;
  padding: 12px 10px;
  font-size: clamp(0.92rem, 1.15vw, 1.12rem);
  line-height: 1.2;
  text-wrap: balance;
  overflow-wrap: anywhere;
  word-break: normal;
}
@media (max-width: 1100px) {
  .runner-response-zone-v2 .options-grid[data-option-grid],
  .runner-answer-stage-v2 .options-grid[data-option-grid] {
    grid-template-columns: repeat(
      min(var(--option-grid-cols, 2), 2),
      minmax(0, 1fr)
    );
  }
  .runner-response-zone-v2 .options-grid--wordy-choice[data-option-grid],
  .runner-answer-stage-v2 .options-grid--wordy-choice[data-option-grid] {
    grid-template-columns: minmax(0, 1fr);
  }
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2--timer,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2--timer {
  min-width: 0;
  padding-inline: 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2[data-compact-label],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2[data-compact-label] {
  font-size: 0;
  line-height: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2[data-compact-label]:after,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-pill-v2[data-compact-label]:after {
  content: attr(data-compact-label);
  font-size: 0.74rem;
  line-height: 1.1;
  color: inherit;
  white-space: nowrap;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-value-v2[data-compact-value],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-value-v2[data-compact-value] {
  font-size: 0;
  line-height: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-value-v2[data-compact-value]:after,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-header-progress-value-v2[data-compact-value]:after {
  content: attr(data-compact-value);
  font-size: 0.72rem;
  line-height: 1.1;
  color: var(--text-muted);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  #runnerHeaderPrimary,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  #runnerHeaderPrimary {
  order: 1;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__center,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-status-v2__center {
  order: 2;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  #runnerSessionStatus,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  #runnerSessionStatus {
  order: 3;
  justify-self: end;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  #runnerTimerValue,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  #runnerTimerValue {
  order: 4;
  justify-self: end;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .progress-bar--runner,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .progress-bar--runner {
  height: 6px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2 {
  grid-template-rows: auto auto auto;
  min-height: clamp(190px, 23dvh, 210px);
  max-height: none;
  overflow: visible;
  gap: 10px;
  padding: 10px 10px 12px;
  border-radius: 20px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-head-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-head-v2 {
  display: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-body-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-body-v2 {
  overflow: visible;
  padding-right: 0;
  gap: 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2 {
  width: min(100%, var(--runner-touch-visual-max));
  gap: 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2 {
  max-height: min(34dvh, 360px);
  min-height: 0;
  overflow: clip;
  align-content: center;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  .visual-card,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  .visual-card {
  max-height: min(34dvh, 360px);
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  .visual-svg,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  .visual-svg {
  max-height: min(32dvh, 340px);
  height: auto;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  :is(.visual-svg--grid, .visual-svg--shape-diagram, .visual-svg--angle),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  :is(.visual-svg--grid, .visual-svg--shape-diagram, .visual-svg--angle) {
  height: clamp(150px, 28dvh, 340px);
  max-height: min(32dvh, 340px);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  .visual-svg--fraction-model,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2:not(.runner-question-panel--official-sats-image)
  .runner-visual-panel-v2
  .visual-svg--fraction-model {
  height: clamp(96px, 18dvh, 160px);
  max-height: min(24dvh, 190px);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2
  > .runner-prompt,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2
  > .runner-prompt {
  position: static;
  padding-bottom: 0;
  background: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt {
  gap: 6px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt__intro,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt__context,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt__detail,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt__intro,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt__context,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-prompt__detail {
  font-size: 0.9rem;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
    .runner-question-panel--prompt-equation-only
  )
  .runner-prompt__main,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
    .runner-question-panel--prompt-equation-only
  )
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  margin-inline: 0;
  text-align: left;
  font-size: clamp(1.2rem, 5.8vw, 1.75rem);
  line-height: 1.14;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short {
  gap: 8px;
  padding: 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-question-body-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-question-body-v2 {
  gap: 8px;
  align-content: start;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-question-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-question-stage-v2 {
  min-height: clamp(108px, 15dvh, 190px);
  align-content: start;
  justify-items: stretch;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt:not(.runner-prompt--raw),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt:not(.runner-prompt--raw) {
  width: min(100%, 64rem);
  margin-inline: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short:not(
    .runner-question-panel--prompt-equation-only
  )
  .runner-prompt__main,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short:not(
    .runner-question-panel--prompt-equation-only
  )
  .runner-prompt__main {
  max-width: min(100%, 64rem);
  max-inline-size: min(100%, 64rem);
  margin-inline: 0;
  text-align: left;
  font-size: clamp(1.6rem, 7.2vw, 2.45rem);
  line-height: 1.04;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt__detail,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt__detail {
  text-align: center;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2 {
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0;
  padding: 0;
  overflow: hidden;
  max-height: var(--runner-dock-max-h);
  height: auto;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2 {
  gap: 8px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-rail-slot-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-rail-slot-v2 {
  width: min(100%, var(--runner-touch-stage-max));
  max-width: 100%;
  margin-inline: auto;
}
@media (orientation: landscape) and (min-width: 961px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"] {
    --runner-touch-stage-max: clamp(60rem, 82vw, 70rem);
    --runner-touch-visual-max: clamp(76rem, 88vw, 84rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-response-zone-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-response-zone-v2 {
    width: 100%;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short {
    gap: 12px;
    padding: 16px 18px 18px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed
    .runner-question-body-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-body-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed
    .runner-question-body-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-body-v2 {
    gap: 12px;
    align-content: start;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed
    .runner-question-stage-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed
    .runner-question-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short
    .runner-question-stage-v2 {
    min-height: clamp(176px, 24dvh, 280px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed
    .runner-prompt:not(.runner-prompt--raw),
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short
    .runner-prompt:not(.runner-prompt--raw),
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed
    .runner-prompt:not(.runner-prompt--raw),
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short
    .runner-prompt:not(.runner-prompt--raw) {
    width: min(100%, 64rem);
    margin-inline: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--mode-compact-typed:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2.runner-question-panel--compact-short:not(
      .runner-question-panel--prompt-equation-only
    )
    .runner-prompt__main {
    max-width: min(100%, 64rem);
    max-inline-size: min(100%, 64rem);
    font-size: clamp(1.2rem, 5.8vw, 1.75rem);
  }
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-stack-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-stack-v2 {
  width: 100%;
}
.student-shell--focus-mode .student-page-content--focus-shell {
  min-height: 0;
  height: 100%;
  align-content: stretch;
}
.student-shell--focus-mode .student-page-content--runner {
  height: 100%;
  padding-bottom: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2 {
  display: grid;
  gap: 6px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2 {
  position: relative;
  bottom: auto;
  z-index: 1;
  padding-top: 6px;
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 6px);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
}
html[data-appearance="dark"]
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
html[data-theme="dark"]
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
body.theme-dark
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
html[data-appearance="dark"]
  .student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
html[data-theme="dark"]
  .student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2,
body.theme-dark
  .student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2 {
  background: linear-gradient(
    180deg,
    #12182a00,
    color-mix(in srgb, var(--bg-panel) 82%, transparent) 28%,
    color-mix(in srgb, var(--bg-panel) 96%, transparent)
  );
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2 {
  width: 100%;
  gap: 4px;
  padding: 6px;
  border-radius: 14px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-rail-title-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-rail-title-v2 {
  display: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard {
  gap: 4px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row {
  width: 100%;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-actions-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-actions-v2 {
  gap: 4px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-rail-card-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-rail-card-v2 {
  gap: 8px;
  padding: 10px;
  border-radius: 18px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-command-button-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-command-button-v2 {
  min-height: 50px;
  font-size: 1rem;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn[data-runner-key="enter"],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn[data-runner-key="enter"] {
  min-height: 52px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field {
  gap: 6px;
  font-size: 0.92rem;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-format,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-format {
  display: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-body-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-body-v2 {
  gap: 6px;
  padding: 7px 12px;
  overflow: auto;
  overscroll-behavior: contain;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-dock-head-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-dock-head-v2 {
  min-height: 48px;
  padding: 7px 12px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-command-button-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-command-button-v2 {
  min-height: 44px;
  padding: 7px 6px;
  border-radius: 13px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-title-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-tools-title-v2 {
  font-size: 0.68rem;
  line-height: 1;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-format__helper,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-format__helper {
  font-size: 0.86rem;
  line-height: 1.35;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__control,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__control {
  gap: 8px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field
  input,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  [data-answer-input],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field
  input,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  [data-answer-input] {
  min-height: 48px;
  padding-left: 16px;
  font-size: 1rem;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field
  input::placeholder,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  [data-answer-input]::placeholder,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field
  input::placeholder,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  [data-answer-input]::placeholder {
  font-size: 0.82em;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__suffix,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__suffix {
  min-height: 38px;
  padding-inline: 10px;
  border-radius: 12px;
  font-size: 0.92rem;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__control,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__control {
  grid-template-columns: minmax(0, 1fr) auto;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__suffix,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-answer-field__suffix {
  width: fit-content;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid] {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  justify-content: stretch;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
  grid-auto-rows: minmax(84px, auto);
  gap: 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"].runner-shell-v2--choice-copy-heavy
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"].runner-shell-v2--choice-copy-heavy
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid] {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile, .option-chip--single),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile, .option-chip--single) {
  min-height: 88px;
  border-radius: 20px;
  align-items: stretch;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile > span, .option-chip--single > span),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile > span, .option-chip--single > span) {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  padding: 12px 10px;
  white-space: normal;
  text-wrap: balance;
  overflow-wrap: anywhere;
  line-height: 1.2;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-visual-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-visual-panel-v2 {
  min-height: 0;
  max-height: none;
  overflow: visible;
  align-content: start;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice,
    .runner-question-panel--mode-selection-grid
  )
  .runner-visual-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-question-panel--mode-diagram-fixed-frame,
    .runner-question-panel--choice,
    .runner-question-panel--shape-choice,
    .runner-question-panel--mode-selection-grid
  )
  .runner-visual-panel-v2 {
  min-height: clamp(220px, 34dvh, 460px);
  padding: 12px 14px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--coordinate-grid,
    .runner-question-panel--transformation-grid
  )
  .runner-visual-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-question-panel--mode-diagram-interactive-grid,
    .runner-question-panel--coordinate-grid,
    .runner-question-panel--transformation-grid
  )
  .runner-visual-panel-v2 {
  min-height: clamp(300px, 42dvh, 620px);
  padding: 12px 14px;
}
@media (max-width: 640px) {
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-status-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-status-v2 {
    padding: 7px 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-header-pill-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-header-pill-v2 {
    min-height: 32px;
    padding: 5px 9px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2 {
    padding: 6px 6px 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn,
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2
    .runner-command-button-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2
    .runner-command-button-v2 {
    min-height: 44px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn[data-runner-key="enter"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn[data-runner-key="enter"] {
    min-height: 46px;
  }
}
.portal-adult {
  --adult-shell-max: 1368px;
  --sidebar-width: 252px;
  --sidebar-width-collapsed: 86px;
  --adult-ui-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 97%, white 3%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
  --adult-ui-surface-active: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-highlight) 88%, var(--bg-panel) 12%),
    color-mix(in srgb, var(--bg-panel-2) 82%, var(--bg-highlight) 18%)
  );
  --adult-ui-border: color-mix(in srgb, var(--line-default) 88%, transparent);
  --adult-ui-border-strong: color-mix(
    in srgb,
    var(--brand-600) 38%,
    var(--line-default) 62%
  );
  --adult-ui-shadow: var(--shadow-sm);
  --adult-ui-shadow-active: var(--shadow-md);
}
.portal-adult .app-shell--adult {
  gap: 16px;
  padding-block: 14px 28px;
}
.portal-adult .app-sidebar--adult {
  gap: 12px;
  padding: 12px;
  border-radius: 28px;
  grid-template-rows: auto auto auto;
  align-content: start;
  top: calc(var(--header-height) + 14px);
  max-height: calc(100vh - var(--header-height) - 28px);
  max-height: calc(100dvh - var(--header-height) - 28px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
.portal-adult .sidebar-panel--nav {
  min-height: 0;
  overflow: visible;
}
.portal-adult .sidebar-panel--nav .section-rail {
  min-height: 0;
  overflow: visible;
  padding-right: 0;
  scrollbar-gutter: auto;
}
.portal-adult .sidebar-panel--footer {
  align-self: stretch;
  margin-top: 4px;
}
.portal-adult .app-content--adult {
  gap: 14px;
  padding: 14px;
}
.portal-adult .sidebar-group__title {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  border-radius: 16px;
}
.portal-adult .sidebar-group__icon-wrap {
  width: 20px;
  height: 20px;
  flex-basis: 20px;
}
.portal-adult .sidebar-group__icon {
  width: 20px;
  height: 20px;
}
.portal-adult .sidebar-group--active > .sidebar-group__title {
  color: var(--text-strong);
}
body.sidebar-collapsed.portal-adult .section-rail {
  gap: 6px;
}
body.sidebar-collapsed.portal-adult .sidebar-group + .sidebar-group,
body.sidebar-collapsed.portal-adult
  .sidebar-group--tree
  + .sidebar-group--tree {
  margin-top: 10px;
  padding-top: 10px;
}
body.sidebar-collapsed.portal-adult .sidebar-group__title {
  display: flex;
  position: relative;
  justify-content: center;
  padding: 0;
  min-height: 44px;
}
body.sidebar-collapsed.portal-adult .sidebar-group__summary {
  justify-content: center;
}
body.sidebar-collapsed.portal-adult .sidebar-group__items {
  display: none;
}
body.sidebar-collapsed.portal-adult
  .sidebar-group--active
  > .sidebar-group__title {
  background: var(--bg-selected);
  border-color: var(--selected-border);
}
body.sidebar-collapsed.portal-adult
  .sidebar-group--active
  > .sidebar-group__title:before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: var(--brand-700);
}
.sidebar-collapsed.portal-adult .sidebar-panel--footer {
  display: none;
}
.portal-adult .sidebar-link {
  min-height: 44px;
  padding: 9px 12px 9px 16px;
}
.portal-adult .sidebar-status {
  padding: 10px 12px;
}
.portal-adult .overview-kpi-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.portal-adult .overview-kpi {
  padding: 16px;
}
.portal-adult .overview-workbench {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
  align-items: start;
}
.portal-adult .adult-overview-screen > .adult-metric-rail {
  margin-bottom: 14px;
}
.portal-adult .adult-home-screen {
  display: grid;
  gap: 14px;
}
.portal-adult .adult-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 24px 28px;
  background:
    radial-gradient(
      circle at 6% 16%,
      color-mix(in srgb, var(--brand-500) 12%, transparent),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--adult-ui-surface-active) 78%, white 22%),
      var(--adult-ui-surface)
    );
}
.portal-adult .adult-home-hero h1 {
  margin: 0;
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  letter-spacing: -0.045em;
}
.portal-adult .adult-home-hero p {
  max-width: 72ch;
  margin: 8px 0 0;
  color: var(--text-muted);
  font-size: 1rem;
  line-height: 1.55;
}
.portal-adult .adult-home-hero__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.portal-adult .adult-metric-rail--home .adult-workspace-metric {
  min-height: 78px;
}

/* 19.9.4 — compact adult overview: summary first, detail on subpages. */
.portal-adult .adult-home-screen--compact {
  gap: 12px;
}
.portal-adult .adult-home-screen--compact .adult-home-hero--compact {
  padding: 20px 22px;
}
.portal-adult .adult-home-screen--compact .adult-home-hero--compact h1 {
  font-size: clamp(1.65rem, 2.7vw, 2.3rem);
}
.portal-adult .adult-home-screen--compact .adult-home-hero--compact p {
  max-width: 62ch;
  margin-top: 6px;
  line-height: 1.4;
}
.portal-adult .adult-metric-rail--compact .adult-workspace-metric {
  min-height: 70px;
  padding: 13px 15px;
}
.portal-adult .adult-home-overview-grid,
.portal-adult .adult-home-lower-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}
.portal-adult .adult-home-overview-card,
.portal-adult .adult-home-activity-card--compact {
  min-width: 0;
  padding: 17px;
}
.portal-adult .adult-home-priority-summary {
  display: grid;
  gap: 5px;
  min-height: 76px;
  align-content: center;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 16px;
  background: color-mix(in srgb, var(--adult-ui-surface-active) 58%, var(--adult-ui-surface) 42%);
}
.portal-adult .adult-home-priority-summary strong,
.portal-adult .adult-home-priority-summary p {
  margin: 0;
  overflow-wrap: anywhere;
}
.portal-adult .adult-home-priority-summary p {
  color: var(--text-muted);
  line-height: 1.4;
}
.portal-adult .adult-home-glance-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.portal-adult .adult-home-glance-item {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 12px 13px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 15px;
  background: var(--adult-ui-surface);
  color: var(--text-body);
  text-decoration: none;
}
.portal-adult .adult-home-glance-item:hover,
.portal-adult .adult-home-glance-item:focus-visible {
  border-color: color-mix(in srgb, var(--brand-500) 42%, var(--adult-ui-border) 58%);
}
.portal-adult .adult-home-glance-item strong,
.portal-adult .adult-home-glance-item span,
.portal-adult .adult-home-glance-item small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.portal-adult .adult-home-glance-item span,
.portal-adult .adult-home-glance-item small {
  color: var(--text-muted);
  line-height: 1.3;
}
.portal-adult .adult-home-glance-item small {
  font-size: 0.76rem;
}
.portal-adult .adult-home-top-actions {
  display: grid;
  gap: 8px;
}
.portal-adult .adult-home-action-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-left: 4px solid color-mix(in srgb, var(--brand-500) 52%, transparent);
  border-radius: 14px;
  background: var(--adult-ui-surface);
  color: var(--text-body);
  text-decoration: none;
}
.portal-adult .adult-home-action-row--warning {
  border-left-color: color-mix(in srgb, var(--warning-700) 64%, transparent);
}
.portal-adult .adult-home-action-row > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.portal-adult .adult-home-action-row strong,
.portal-adult .adult-home-action-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.portal-adult .adult-home-action-row > div > span {
  color: var(--text-muted);
  font-size: 0.84rem;
  line-height: 1.35;
}
.portal-adult .adult-home-timeline-compact {
  display: grid;
  gap: 0;
  max-height: none;
  overflow: visible;
}
.portal-adult .adult-home-timeline-compact .timeline-item {
  padding-block: 9px;
}
@media (max-width: 980px) {
  .portal-adult .adult-home-overview-grid,
  .portal-adult .adult-home-lower-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .portal-adult .adult-home-screen--compact .adult-home-hero--compact {
    padding: 17px;
  }
  .portal-adult .adult-home-glance-grid {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-home-action-row {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-home-action-row .btn {
    width: 100%;
    justify-content: center;
  }
}

.portal-adult .adult-home-focus-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
  gap: 14px;
  align-items: stretch;
}
.portal-adult .adult-home-focus-card,
.portal-adult .adult-home-scope-card-wrap,
.portal-adult .adult-home-board-card {
  min-width: 0;
}
.portal-adult .adult-home-focus-card__body {
  display: grid;
  gap: 12px;
}
.portal-adult .adult-home-focus-card__body h3 {
  margin: 0;
  color: var(--text-strong);
  font-size: 1.25rem;
  letter-spacing: -0.025em;
}
.portal-adult .adult-home-focus-card__body p {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.55;
}
.portal-adult .adult-home-mini-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.portal-adult .adult-home-mini-kpis span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 15px;
  background: color-mix(in srgb, var(--adult-ui-surface-active) 56%, white 44%);
}
.portal-adult .adult-home-mini-kpis strong {
  color: var(--text-strong);
  font-size: 1.18rem;
  line-height: 1.05;
}
.portal-adult .adult-home-mini-kpis small {
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.portal-adult .adult-home-scope-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}
.portal-adult .adult-home-scope-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 13px 15px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 90%, transparent);
  border-radius: 16px;
  background: var(--adult-ui-surface);
  color: var(--text-strong);
  text-decoration: none;
}
.portal-adult .adult-home-scope-card.is-active {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 38%,
    var(--adult-ui-border) 62%
  );
  background: color-mix(
    in srgb,
    var(--brand-100) 24%,
    var(--adult-ui-surface) 76%
  );
}
.portal-adult .adult-home-scope-card span {
  min-width: 0;
  color: var(--text-muted);
  font-size: 0.88rem;
  overflow-wrap: anywhere;
}
.portal-adult .adult-home-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.portal-adult .adult-home-list {
  display: grid;
  gap: 10px;
}
.portal-adult .adult-home-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 16px;
  background: var(--adult-ui-surface);
  color: var(--text-strong);
  text-decoration: none;
}
.portal-adult .adult-home-list-row--needs_attention {
  box-shadow: inset 4px 0 color-mix(in srgb, var(--danger-700) 58%, transparent);
}
.portal-adult .adult-home-list-row--practice_next {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--warning-700) 58%, transparent);
}
.portal-adult .adult-home-list-row--on_track {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--success-700) 58%, transparent);
}
.portal-adult .adult-home-list-row__main,
.portal-adult .adult-home-list-row__head {
  min-width: 0;
}
.portal-adult .adult-home-list-row__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.portal-adult .adult-home-list-row__focus {
  margin-top: 5px;
  color: var(--text-strong);
  font-weight: 750;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.portal-adult .adult-home-list-row__detail {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1.42;
  overflow-wrap: anywhere;
}
.portal-adult .adult-home-list-row__meta {
  display: grid;
  gap: 6px;
  justify-items: end;
  min-width: 108px;
  color: var(--text-muted);
  font-size: 0.84rem;
  font-weight: 700;
  text-align: right;
}
.portal-adult .adult-home-list-row__meta--action {
  min-width: 0;
}
.portal-adult .adult-home-activity-card .timeline-list {
  max-height: min(32vh, 340px);
}
.portal-adult .class-focus-card .adult-metric-rail--dashboard-focus {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin-top: 14px;
}
.portal-adult .overview-workbench--single {
  grid-template-columns: 1fr;
}
.portal-adult .report-hero-grid {
  display: grid;
  grid-template-columns: minmax(320px, 1.05fr) minmax(300px, 0.95fr);
  gap: 14px;
  margin-bottom: 16px;
  align-items: stretch;
}
.portal-adult .report-hero-grid--command > .card {
  height: 100%;
}
.portal-adult .report-controls-card {
  display: grid;
  align-content: start;
  grid-template-rows: auto auto;
}
.portal-adult .report-controls-card__summary {
  display: grid;
  gap: 10px;
  align-content: start;
}
.portal-adult .report-callout {
  display: grid;
  gap: 14px;
  grid-template-rows: auto auto auto 1fr;
}
.portal-adult .report-callout__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.portal-adult .report-callout h2 {
  margin: 0;
}
.portal-adult .report-callout__kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.portal-adult .report-callout__kpis .report-summary-card {
  padding: 13px 14px 11px;
  min-height: 92px;
}
.portal-adult .report-callout__kpis .report-summary-card__value {
  margin: 6px 0 0;
  font-size: 1.8rem;
}
.portal-adult .report-callout__lead {
  margin: 0;
  max-width: 58ch;
  color: var(--text-strong);
  font-size: 1.02rem;
  line-height: 1.65;
}
.portal-adult .report-callout__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.portal-adult .report-callout__priority {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding-top: 2px;
}
.portal-adult .report-callout__priority-copy {
  display: grid;
  gap: 2px;
}
.portal-adult .report-callout__priority-label {
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.portal-adult .report-summary-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.portal-adult .report-visual-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: 14px;
  margin-bottom: 16px;
  align-items: stretch;
}
.portal-adult .report-chart-card {
  display: grid;
  gap: 16px;
  padding: 18px;
}
.portal-adult .report-chart-card--primary {
  grid-template-rows: auto auto minmax(0, 1fr);
  align-content: start;
  min-height: 0;
}
.portal-adult .report-chart-card__cluster {
  display: grid;
  gap: 14px;
  padding-top: 2px;
}
.portal-adult .report-chart-card__cluster + .report-chart-card__cluster {
  border-top: 1px solid
    color-mix(in srgb, var(--adult-ui-border) 84%, transparent);
  padding-top: 16px;
}
.portal-adult .report-chart-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.portal-adult .report-chart-card__head h2 {
  margin: 0;
}
.portal-adult .report-chart-card__insight {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 0.92rem;
  line-height: 1.45;
}
.portal-adult .report-chart-card__head--compact {
  gap: 10px;
}
.portal-adult .report-chart-card__stat {
  display: grid;
  gap: 4px;
  min-width: 180px;
  justify-items: end;
  text-align: right;
}
.portal-adult .report-chart-card__stat strong {
  color: var(--text-strong);
  font-size: 1rem;
  line-height: 1.35;
}
.portal-adult .report-chart-card__stat span {
  color: var(--text-muted);
  font-size: 0.88rem;
  line-height: 1.45;
}
.portal-adult .report-chart-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: -2px;
  align-self: start;
  align-items: flex-start;
}
.portal-adult .report-chart-card__meta--summary {
  gap: 10px;
  margin-top: 0;
}
.portal-adult .report-chart-card__meta--summary .mini-badge {
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 14px;
  white-space: nowrap;
  font-size: 0.9rem;
  box-shadow: inset 0 1px color-mix(in srgb, white 52%, transparent);
}
.portal-adult .report-chart-plot {
  display: grid;
  gap: 10px;
  padding: 14px 16px 12px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 18px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--adult-ui-surface-active) 72%, white 28%),
    var(--adult-ui-surface)
  );
}
.portal-adult .report-chart-plot svg {
  display: block;
  width: 100%;
  height: auto;
}
.portal-adult .report-chart-guide {
  stroke: color-mix(in srgb, var(--adult-ui-border-strong) 26%, transparent);
  stroke-width: 1;
}
.portal-adult .report-chart-axis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: 8px;
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.portal-adult .report-chart-axis span {
  text-align: center;
}
.portal-adult .report-chart-empty {
  min-height: 120px;
  display: grid;
  place-items: center;
  text-align: center;
}
.portal-adult .report-stackbar {
  display: flex;
  width: 100%;
  min-height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--adult-ui-border) 72%, white 28%);
}
.portal-adult .report-stackbar__segment {
  min-width: 0;
  flex: 0 0 auto;
}
.portal-adult .report-stackbar__segment--needs_attention {
  background: color-mix(in srgb, var(--danger-700) 76%, white 24%);
}
.portal-adult .report-stackbar__segment--practice_next {
  background: color-mix(in srgb, var(--warning-700) 78%, white 22%);
}
.portal-adult .report-stackbar__segment--on_track {
  background: color-mix(in srgb, var(--success-700) 78%, white 22%);
}
.portal-adult .report-stackbar__segment--needs_evidence {
  background: color-mix(in srgb, var(--line-strong) 60%, white 40%);
}
.portal-adult .report-stackbar-legend {
  display: grid;
  gap: 10px;
}
.portal-adult .report-stackbar-legend__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  color: var(--text-strong);
  font-size: 0.9rem;
}
.portal-adult .report-stackbar-legend__item strong {
  font-size: 0.96rem;
}
.portal-adult .report-stackbar-legend__dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}
.portal-adult .report-stackbar-legend__dot--needs_attention {
  background: color-mix(in srgb, var(--danger-700) 76%, white 24%);
}
.portal-adult .report-stackbar-legend__dot--practice_next {
  background: color-mix(in srgb, var(--warning-700) 78%, white 22%);
}
.portal-adult .report-stackbar-legend__dot--on_track {
  background: color-mix(in srgb, var(--success-700) 78%, white 22%);
}
.portal-adult .report-stackbar-legend__dot--needs_evidence {
  background: color-mix(in srgb, var(--line-strong) 60%, white 40%);
}
.portal-adult .report-summary-card {
  padding: 18px;
}
.portal-adult .report-summary-card__label {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.portal-adult .report-summary-card__value {
  margin: 8px 0 6px;
  color: var(--text-strong);
  font-size: 2rem;
  font-weight: 800;
  line-height: 1.05;
}
.portal-adult .report-summary-card--needs_attention {
  border-color: color-mix(
    in srgb,
    var(--danger-700) 18%,
    var(--adult-ui-border) 82%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--danger-100) 30%, var(--bg-panel) 70%),
    var(--bg-panel)
  );
}
.portal-adult .report-summary-card--needs_evidence {
  border-color: color-mix(
    in srgb,
    var(--line-strong) 16%,
    var(--adult-ui-border) 84%
  );
}
.portal-adult .report-summary-card--practice_next {
  border-color: color-mix(
    in srgb,
    var(--warning-700) 16%,
    var(--adult-ui-border) 84%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--warning-100) 30%, var(--bg-panel) 70%),
    var(--bg-panel)
  );
}
.portal-adult .report-summary-card--on_track {
  border-color: color-mix(
    in srgb,
    var(--success-700) 16%,
    var(--adult-ui-border) 84%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--success-100) 28%, var(--bg-panel) 72%),
    var(--bg-panel)
  );
}
.portal-adult .report-roster-list {
  display: grid;
  gap: 12px;
}
.portal-adult .overview-workbench--reports {
  align-items: stretch;
}
.portal-adult .overview-workbench--reports > .card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100%;
}
.portal-adult .report-queue-list {
  height: min(36vh, 360px);
  max-height: none;
}
.portal-adult .report-queue-item {
  min-height: 106px;
  gap: 14px;
  align-items: start;
}
.portal-adult .report-queue-item--action {
  grid-template-columns: minmax(0, 1fr) auto;
}
.portal-adult .report-queue-item__body {
  display: grid;
  gap: 5px;
  align-content: start;
}
.portal-adult .report-queue-item__meta,
.portal-adult .report-queue-item__subtle {
  color: var(--text-muted);
  font-size: 0.92rem;
  line-height: 1.42;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.portal-adult .report-queue-item__meta {
  -webkit-line-clamp: 2;
}
.portal-adult .report-queue-item__subtle {
  -webkit-line-clamp: 1;
}
.portal-adult .report-queue-item__actions {
  align-self: center;
}
.portal-adult .report-action-board {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
}
.portal-adult .report-action-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 10px;
}
.portal-adult .report-action-filter,
.portal-adult .report-action-group-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 17px;
  background: var(--adult-ui-surface);
  color: var(--text-strong);
  text-align: left;
  cursor: pointer;
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .report-action-filter {
  align-content: center;
  border-color: color-mix(
    in srgb,
    var(--brand-500) 28%,
    var(--adult-ui-border) 72%
  );
  background: color-mix(
    in srgb,
    var(--brand-100) 22%,
    var(--adult-ui-surface) 78%
  );
}
.portal-adult .report-action-filter.is-active,
.portal-adult .report-action-group-card.is-active {
  outline: 2px solid color-mix(in srgb, var(--brand-500) 44%, transparent);
  outline-offset: 2px;
}
.portal-adult .report-action-filter span,
.portal-adult .report-action-group-card__label {
  color: var(--text-muted);
  font-size: 0.73rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.portal-adult .report-action-filter strong,
.portal-adult .report-action-group-card strong {
  color: var(--text-strong);
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  line-height: 1;
}
.portal-adult .report-action-group-card__detail,
.portal-adult .report-action-group-card__names {
  min-width: 0;
  color: var(--text-muted);
  font-size: 0.86rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.portal-adult .report-action-group-card__names {
  color: var(--text-strong);
  font-weight: 700;
}
.portal-adult .report-action-table {
  display: grid;
  overflow-x: auto;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 90%, transparent);
  border-radius: 20px;
  background: var(--adult-ui-surface);
}
.portal-adult .report-action-row {
  display: grid;
  grid-template-columns: minmax(160px, 1.05fr) minmax(132px, 0.55fr) minmax(
      220px,
      1.15fr
    ) minmax(220px, 1.2fr) minmax(130px, auto);
  gap: 12px;
  align-items: center;
  min-width: 920px;
  padding: 13px 16px;
  border-bottom: 1px solid
    color-mix(in srgb, var(--adult-ui-border) 76%, transparent);
}
.portal-adult .report-action-row:last-child {
  border-bottom: 0;
}
.portal-adult .report-action-row[hidden] {
  display: none;
}
.portal-adult .report-action-row--head {
  position: sticky;
  top: 0;
  z-index: 1;
  min-height: 44px;
  background: color-mix(in srgb, var(--adult-ui-surface-active) 72%, white 28%);
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  box-shadow: inset 0 -1px
    color-mix(in srgb, var(--adult-ui-border) 90%, transparent);
}
.portal-adult .report-action-row__learner,
.portal-adult .report-action-row__status,
.portal-adult .report-action-row__evidence,
.portal-adult .report-action-row__next,
.portal-adult .report-action-row__actions {
  min-width: 0;
}
.portal-adult .report-action-row__learner {
  display: grid;
  gap: 4px;
}
.portal-adult .report-action-row__learner strong {
  color: var(--text-strong);
}
.portal-adult .report-action-row__learner span,
.portal-adult .report-action-row__evidence,
.portal-adult .report-action-row__next {
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1.42;
  overflow-wrap: anywhere;
}
.portal-adult .report-action-row__next {
  color: var(--text-strong);
  font-weight: 700;
}
.portal-adult .report-action-row__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: nowrap;
}
.portal-adult .report-action-row--needs_attention {
  box-shadow: inset 4px 0 color-mix(in srgb, var(--danger-700) 58%, transparent);
}
.portal-adult .report-action-row--needs_evidence {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--line-strong) 36%, transparent);
}
.portal-adult .report-action-row--practice_next {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--warning-700) 58%, transparent);
}
.portal-adult .report-action-row--strong_progress,
.portal-adult .report-action-row--on_track {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--success-700) 58%, transparent);
}
@media (max-width: 900px) {
  .portal-adult .report-action-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .report-action-table {
    gap: 10px;
    overflow: visible;
    border: 0;
    background: transparent;
  }
  .portal-adult .report-action-row {
    min-width: 0;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--adult-ui-border);
    border-radius: 18px;
    background: var(--adult-ui-surface);
  }
  .portal-adult .report-action-row--head {
    display: none;
  }
  .portal-adult .report-action-row__actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}
.portal-adult .report-followup-list {
  display: grid;
  gap: 10px;
  height: min(36vh, 360px);
  max-height: none;
  overflow: auto;
  padding-right: 2px;
}
.portal-adult .report-followup-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  min-height: 108px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 18px;
  background: var(--adult-ui-surface);
}
.portal-adult .report-followup-row--needs_attention {
  box-shadow: inset 4px 0 color-mix(in srgb, var(--danger-700) 58%, transparent);
}
.portal-adult .report-followup-row--practice_next {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--warning-700) 58%, transparent);
}
.portal-adult .report-followup-row--on_track {
  box-shadow: inset 4px 0
    color-mix(in srgb, var(--success-700) 58%, transparent);
}
.portal-adult .report-followup-row__body,
.portal-adult .report-followup-row__title {
  min-width: 0;
}
.portal-adult .report-followup-row__body {
  display: grid;
  gap: 5px;
}
.portal-adult .report-followup-row__title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.portal-adult .report-followup-row__meta,
.portal-adult .report-followup-row__action {
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1.42;
  overflow-wrap: anywhere;
}
.portal-adult .report-followup-row__action {
  color: var(--text-strong);
  font-weight: 700;
}
.portal-adult .report-followup-row__actions {
  justify-content: flex-end;
  align-self: center;
  flex-wrap: nowrap;
}
.portal-adult .report-roster-row {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--adult-ui-border);
  border-radius: 18px;
  background: var(--adult-ui-surface);
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .report-roster-row--needs_attention {
  box-shadow:
    inset 4px 0 color-mix(in srgb, var(--danger-700) 65%, transparent),
    var(--adult-ui-shadow);
}
.portal-adult .report-roster-row--needs_evidence {
  box-shadow:
    inset 4px 0 color-mix(in srgb, var(--line-strong) 35%, transparent),
    var(--adult-ui-shadow);
}
.portal-adult .report-roster-row--practice_next {
  box-shadow:
    inset 4px 0 color-mix(in srgb, var(--warning-700) 60%, transparent),
    var(--adult-ui-shadow);
}
.portal-adult .report-roster-row--on_track {
  box-shadow:
    inset 4px 0 color-mix(in srgb, var(--success-700) 60%, transparent),
    var(--adult-ui-shadow);
}
.portal-adult .report-roster-row__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.portal-adult .report-roster-row__focus {
  margin-bottom: 6px;
  color: var(--text-strong);
  font-size: 1.04rem;
  font-weight: 700;
  line-height: 1.4;
}
.portal-adult .report-roster-row__primary {
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
}
.portal-adult .report-roster-row__next {
  color: var(--text-muted);
  font-size: 0.94rem;
  line-height: 1.46;
}
.portal-adult .report-roster-row__signal {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--text-muted);
  font-size: 0.92rem;
  line-height: 1.4;
}
.portal-adult .report-roster-row__meta {
  display: grid;
  gap: 12px;
  align-content: start;
}
.portal-adult .report-roster-row__meta--compact {
  gap: 10px;
}
.portal-adult .report-roster-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
}
.portal-adult .report-roster-stat {
  display: grid;
  gap: 3px;
  min-width: 116px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--adult-ui-border) 88%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--adult-ui-surface-active) 54%, white 46%);
}
.portal-adult .report-roster-stat--highlight {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 34%,
    var(--adult-ui-border) 66%
  );
  background: color-mix(
    in srgb,
    var(--brand-100) 26%,
    var(--adult-ui-surface) 74%
  );
}
.portal-adult .report-roster-stat__label {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.portal-adult .report-row-trend {
  display: grid;
  gap: 6px;
  padding-top: 4px;
}
.portal-adult .report-row-trend--compact {
  gap: 4px;
  padding-top: 0;
}
.portal-adult .report-row-trend__sparkline {
  width: min(148px, 100%);
}
.portal-adult .report-row-trend--compact .report-row-trend__sparkline {
  width: min(116px, 100%);
}
.portal-adult .report-row-trend__caption {
  color: var(--text-muted);
  font-size: 0.84rem;
  font-weight: 600;
}
.portal-adult .report-meta {
  display: grid;
  gap: 4px;
}
.portal-adult .report-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.portal-adult .report-meta__label {
  color: var(--text-muted);
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.portal-adult .report-meta__value {
  color: var(--text-strong);
  font-weight: 600;
  line-height: 1.45;
}
.portal-adult .report-secondary-details {
  margin-top: 16px;
}
.portal-adult .report-secondary-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  list-style: none;
  color: var(--text-strong);
  font-weight: 800;
}
.portal-adult .report-secondary-details > summary::-webkit-details-marker,
.portal-adult .report-secondary-details > summary::marker {
  display: none;
}
.portal-adult .report-secondary-details > summary:after {
  content: "+";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
}
.portal-adult .report-secondary-details[open] > summary:after {
  content: "-";
}
.portal-adult .report-secondary-details > *:not(summary) {
  margin-top: 16px;
}
.portal-adult .draft-badge-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.portal-adult .draft-badge-line__hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 800;
  cursor: help;
}
.portal-adult .draft-badge-line__hint:hover,
.portal-adult .draft-badge-line__hint:focus-visible {
  border-color: var(--adult-ui-border-strong);
  color: var(--text-strong);
  outline: none;
}
.portal-adult .status-filter-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.portal-adult .status-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--adult-ui-border);
  background: var(--adult-ui-surface);
  color: var(--text-strong);
  border-radius: 999px;
  padding: 9px 14px;
  font: inherit;
  cursor: pointer;
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .status-filter.is-active {
  border-color: var(--adult-ui-border-strong);
  background: var(--adult-ui-surface-active);
  color: var(--text-strong);
}
.portal-adult .status-filter__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-600) 16%, transparent);
  color: var(--text-strong);
  font-size: 12px;
}
.portal-adult .adult-workspace-grid {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 14px;
}
.portal-adult .adult-workspace-grid--people {
  grid-template-columns: minmax(340px, 400px) minmax(0, 1fr);
  align-items: start;
}
.portal-adult .adult-people-overview-card {
  display: grid;
  gap: 16px;
}
.portal-adult .adult-people-overview-header {
  align-items: center;
}
.portal-adult .adult-people-overview-header__actions {
  align-self: center;
  justify-content: flex-end;
}
.portal-adult .adult-people-overview-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  gap: 14px;
  align-items: end;
}
.portal-adult .adult-people-overview-toolbar--search-only {
  grid-template-columns: minmax(0, 1fr);
}
.portal-adult .adult-people-overview-toolbar__actions {
  justify-content: flex-start;
  flex-wrap: wrap;
}
.portal-adult .adult-summary-metric-grid--people {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.portal-adult .adult-class-workspace--students {
  gap: 10px;
  margin-bottom: 12px;
}
.portal-adult .adult-class-workspace--students > .section-header {
  align-items: center;
}
.portal-adult .adult-students-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.portal-adult .adult-students-roster-card,
.portal-adult .adult-students-side-panel {
  min-width: 0;
}
.portal-adult .adult-students-side-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}
.portal-adult .adult-students-roster-head {
  align-items: flex-start;
}
.portal-adult .adult-people-roster-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto;
  gap: 12px;
  align-items: center;
}
.portal-adult .adult-people-roster-toolbar input {
  min-width: 0;
  max-width: none;
}
.portal-adult .adult-detail-panel--people,
.portal-adult .adult-family-learner-grid {
  overflow: visible;
}
.portal-adult .adult-family-learner-grid .table-wrap--viewport {
  max-height: none;
  overflow: visible;
}
.portal-adult .adult-family-learner-grid .row-actions-menu__more-list {
  z-index: 90;
}
.portal-adult .adult-compact-snapshot--students {
  grid-template-columns: minmax(0, 1fr);
  margin-top: 12px;
}
.portal-adult .adult-list-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.portal-adult .adult-list-panel__items {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: min(58vh, 640px);
  overflow: auto;
}
.portal-adult .adult-list-item {
  display: grid;
  gap: 4px;
  text-align: left;
  border: 1px solid var(--adult-ui-border);
  background: var(--adult-ui-surface);
  border-radius: 16px;
  padding: 14px 16px;
  font: inherit;
  cursor: pointer;
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-list-item.is-active {
  border-color: var(--adult-ui-border-strong);
  background: var(--adult-ui-surface-active);
  box-shadow: var(--adult-ui-shadow-active);
}
.portal-adult .adult-class-directory,
.portal-adult .adult-class-directory__group,
.portal-adult .adult-class-directory__items {
  display: grid;
  gap: 10px;
}
.portal-adult .adult-class-directory__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
}
.portal-adult .adult-detail-panel {
  display: grid;
  gap: 14px;
}
.portal-adult .adult-class-workspace {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
}
.portal-adult .adult-class-workspace > .section-header {
  align-items: flex-start;
}
.portal-adult .adult-class-workspace__toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}
.portal-adult .adult-class-workspace__toolbar--split {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.portal-adult .adult-class-workspace__toolbar input {
  min-width: 220px;
  max-width: none;
}
.portal-adult .adult-class-workspace__toolbar-actions {
  justify-content: flex-end;
}
.portal-adult .adult-class-workspace__filters {
  display: grid;
  gap: 10px;
}
.portal-adult .adult-class-workspace__selectors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.portal-adult
  .adult-class-workspace--student-directory
  .adult-class-workspace__selectors,
.portal-adult
  .adult-class-workspace--assignment-board
  .adult-class-workspace__selectors,
.portal-adult
  .adult-class-workspace--insight-board
  .adult-class-workspace__selectors {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.portal-adult
  .adult-class-workspace--planner
  .adult-class-workspace__selectors {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.portal-adult .planner-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.portal-adult .planner-board,
.portal-adult .planner-inspector,
.portal-adult .planner-backlog {
  margin-bottom: 14px;
}
.portal-adult .planner-timeline {
  display: grid;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 4px;
}
.portal-adult .planner-board--empty {
  min-height: 220px;
}
.portal-adult .planner-start-empty {
  display: grid;
  gap: 8px;
  min-height: 128px;
  place-items: center;
  text-align: center;
  border: 1px dashed
    color-mix(in srgb, var(--adult-ui-border) 82%, transparent 18%);
  border-radius: 22px;
  background: color-mix(in srgb, var(--brand-50) 28%, transparent 72%);
  padding: 28px;
}
.portal-adult .planner-start-empty strong {
  color: var(--text-strong);
  font-size: 1.05rem;
}
.portal-adult .planner-timeline__header,
.portal-adult .planner-timeline__row {
  display: grid;
  grid-template-columns: minmax(130px, 0.18fr) minmax(490px, 1fr);
  gap: 8px;
  min-width: 640px;
}
.portal-adult .planner-timeline__corner,
.portal-adult .planner-timeline__lane,
.portal-adult .planner-timeline__column,
.portal-adult .planner-timeline__track {
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 90%, white 10%);
}
.portal-adult .planner-timeline__corner,
.portal-adult .planner-timeline__column {
  min-height: 52px;
  border-radius: 16px;
  padding: 10px 12px;
}
.portal-adult .planner-timeline__corner,
.portal-adult .planner-timeline__column strong,
.portal-adult .planner-timeline__lane strong {
  color: var(--text-strong);
  font-weight: 800;
}
.portal-adult .planner-timeline__columns,
.portal-adult .planner-timeline__track {
  display: grid;
  gap: 8px;
}
.portal-adult .planner-timeline__column {
  display: grid;
  gap: 2px;
}
.portal-adult .planner-timeline__column span,
.portal-adult .planner-timeline__lane span {
  color: var(--text-muted);
  font-size: 0.8rem;
}
.portal-adult .planner-timeline__lane {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 10px;
  align-content: center;
  min-height: 96px;
  border-radius: 18px;
  padding: 12px;
}
.portal-adult .planner-timeline__lane span {
  grid-column: 1;
}
.portal-adult .planner-timeline__lane em {
  grid-row: 1 / 3;
  grid-column: 2;
  align-self: center;
  min-width: 32px;
  min-height: 32px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-500) 12%, var(--bg-panel) 88%);
  color: var(--text-strong);
  font-style: normal;
  font-weight: 800;
}
.portal-adult .planner-timeline__track {
  position: relative;
  grid-template-rows: repeat(3, minmax(30px, auto));
  min-height: 96px;
  border-radius: 18px;
  padding: 8px;
  overflow: hidden;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel) 88%, var(--brand-50) 12%)
  );
}
.portal-adult .planner-timeline__slot {
  grid-row: 1 / 4;
  min-height: 78px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand-50) 38%, transparent 62%);
  border: 1px dashed
    color-mix(in srgb, var(--adult-ui-border) 76%, transparent 24%);
}
.portal-adult .planner-bar {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 1px;
  align-content: center;
  justify-items: center;
  min-width: 0;
  min-height: 30px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 22%, var(--adult-ui-border) 78%);
  border-radius: 999px;
  padding: 5px 10px;
  background: color-mix(in srgb, var(--brand-500) 16%, var(--bg-panel) 84%);
  color: var(--text-strong);
  box-shadow: var(--adult-ui-shadow);
  text-align: center;
  cursor: pointer;
}
.portal-adult .planner-bar span,
.portal-adult .planner-bar small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.portal-adult .planner-bar span {
  font-size: 0.82rem;
  font-weight: 800;
}
.portal-adult .planner-bar small {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.portal-adult .planner-bar--assignment {
  background: color-mix(
    in srgb,
    var(--success, #3f8f62) 14%,
    var(--bg-panel) 86%
  );
  border-color: color-mix(
    in srgb,
    var(--success, #3f8f62) 28%,
    var(--adult-ui-border) 72%
  );
}
.portal-adult .planner-bar--warning,
.portal-adult .planner-bar.is-unscheduled {
  background: color-mix(
    in srgb,
    var(--warning, #bf7a25) 16%,
    var(--bg-panel) 84%
  );
  border-style: dashed;
}
.portal-adult .planner-bar--neutral {
  background: color-mix(in srgb, var(--text-muted) 10%, var(--bg-panel) 90%);
}
.portal-adult .planner-bar.is-selected {
  outline: 2px solid color-mix(in srgb, var(--brand-500) 72%, white 28%);
  outline-offset: 2px;
}
.portal-adult .planner-empty-lane {
  position: absolute;
  inset: 12px;
  display: grid;
  place-items: center;
  color: var(--text-muted);
  font-size: 0.86rem;
  pointer-events: none;
}
.portal-adult .planner-inspector {
  display: grid;
  gap: 12px;
}
.portal-adult .planner-detail-modal .planner-inspector {
  border: 0;
  box-shadow: none;
  padding: 0;
  background: transparent;
}
.portal-adult .planner-inspector__facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.portal-adult .planner-inspector__facts .adult-info-card {
  grid-template-columns: minmax(78px, 0.42fr) minmax(0, 1fr);
  gap: 8px 12px;
  align-items: center;
  align-content: start;
  min-width: 0;
  padding: 10px 12px;
}
.portal-adult .planner-inspector__facts .adult-info-card__value {
  justify-self: end;
  text-align: right;
  max-width: 100%;
  font-size: 0.94rem;
  line-height: 1.28;
  overflow-wrap: break-word;
}
.portal-adult .planner-focus-stack {
  margin-top: 2px;
}
.portal-adult .planner-backlog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 12px;
}
.portal-adult .planner-backlog-item {
  min-height: 0;
}
.portal-adult .planner-backlog-item__meta {
  margin-top: 6px;
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 700;
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--planner
  .adult-class-workspace__selectors {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--planner
  .adult-select-field__label {
  display: none !important;
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--planner
  .adult-select-field
  select {
  min-height: 40px;
  border-radius: 14px;
}
body.portal-adult.viewport-short-landscape .planner-shell {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
body.portal-adult.viewport-short-landscape .planner-board,
body.portal-adult.viewport-short-landscape .planner-inspector,
body.portal-adult.viewport-short-landscape .planner-backlog {
  margin-bottom: 10px;
}
body.portal-adult.viewport-short-landscape .planner-timeline__header,
body.portal-adult.viewport-short-landscape .planner-timeline__row {
  grid-template-columns: minmax(116px, 0.16fr) minmax(520px, 1fr);
  min-width: 660px;
}
body.portal-adult.viewport-short-landscape .planner-timeline__lane,
body.portal-adult.viewport-short-landscape .planner-timeline__track {
  min-height: 76px;
}
body.portal-adult.viewport-short-landscape .planner-timeline__column,
body.portal-adult.viewport-short-landscape .planner-timeline__corner,
body.portal-adult.viewport-short-landscape .planner-timeline__lane {
  padding: 8px 9px;
}
body.portal-adult.viewport-short-landscape .planner-timeline__slot {
  min-height: 58px;
}
body.portal-adult.viewport-short-landscape .planner-bar {
  min-height: 25px;
  padding: 3px 8px;
}
body.portal-adult.viewport-short-landscape .planner-bar small,
body.portal-adult.viewport-short-landscape .planner-timeline__column span {
  display: none;
}
.portal-adult .adult-student-directory-card__header {
  align-items: flex-start;
}
.portal-adult .adult-student-directory-table td {
  vertical-align: middle;
}
.portal-adult .adult-filter-strip {
  display: grid;
  gap: 8px;
}
.portal-adult .adult-filter-tabs {
  width: 100%;
  justify-content: flex-start;
}
.portal-adult .adult-filter-tabs .tab-button {
  min-height: 38px;
  padding: 8px 13px;
}
.portal-adult .adult-filter-tabs--classes .tab-button {
  font-weight: 800;
}
.portal-adult .adult-select-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.portal-adult .adult-select-field__label {
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.portal-adult .adult-select-field select {
  width: 100%;
  min-height: 48px;
  border-radius: 18px;
  border: 1px solid var(--adult-ui-border);
  background-color: color-mix(
    in srgb,
    var(--bg-panel) 90%,
    var(--brand-50) 10%
  );
  color: var(--text-strong);
  font-weight: 700;
}
.portal-adult .adult-class-workspace__metrics,
.portal-adult .adult-metric-rail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}
.portal-adult .adult-workspace-metric {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 14px;
  padding: 11px 14px;
  min-height: 68px;
  border-radius: 18px;
  border: 1px solid var(--adult-ui-border);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel) 86%, var(--brand-100) 14%)
  );
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-workspace-metric__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-adult .adult-workspace-metric__label {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.portal-adult .adult-workspace-metric__value {
  justify-self: end;
  text-align: right;
  color: var(--text-strong);
  font-size: clamp(1.45rem, 2.3vw, 1.9rem);
  font-weight: 800;
  line-height: 1.05;
}
.portal-adult .adult-workspace-metric__hint {
  color: var(--text-muted);
  font-size: 0.88rem;
  line-height: 1.35;
}
.portal-adult .adult-class-workspace__selection {
  display: inline-grid;
  gap: 2px;
  padding: 10px 14px;
  border-radius: 16px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 90%, var(--brand-100) 10%);
  box-shadow: var(--adult-ui-shadow);
  color: var(--text-muted);
  font-size: 0.88rem;
}
.portal-adult .adult-class-workspace__selection strong {
  color: var(--text-strong);
  font-size: 0.96rem;
}
.portal-adult .adult-detail-header {
  display: grid;
  gap: 12px;
}
.portal-adult .adult-detail-header--compact {
  gap: 10px;
}
.portal-adult .adult-detail-header__summary {
  display: grid;
  gap: 6px;
}
.portal-adult .adult-detail-header__summary h2 {
  margin: 0;
}
.portal-adult .adult-detail-meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  color: var(--text-muted);
  font-size: 0.92rem;
}
.portal-adult .adult-detail-meta-line span {
  position: relative;
}
.portal-adult .adult-detail-meta-line span:not(:last-child):after {
  content: "\2022";
  margin-left: 14px;
  color: color-mix(in srgb, var(--text-muted) 72%, transparent 28%);
}
.portal-adult .adult-detail-header__nav {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.portal-adult .adult-detail-header__nav--compact {
  align-items: center;
}
.portal-adult .adult-detail-tabs {
  margin-bottom: 0;
}
.portal-adult .adult-detail-tabs--secondary .tab-button {
  font-size: 0.92rem;
}
.portal-adult .adult-class-overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.portal-adult .adult-inline-menu {
  position: relative;
}
.portal-adult .adult-inline-menu__summary {
  list-style: none;
}
.portal-adult .adult-inline-menu__summary::-webkit-details-marker {
  display: none;
}
.portal-adult .adult-inline-menu__summary.is-active {
  background: color-mix(in srgb, var(--brand-100) 26%, var(--bg-panel) 74%);
  border-color: color-mix(
    in srgb,
    var(--brand-400) 34%,
    var(--adult-ui-border) 66%
  );
}
.portal-adult .adult-inline-menu__panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 220px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border-radius: 18px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  box-shadow: var(--adult-ui-shadow);
  z-index: 20;
}
.portal-adult .adult-inline-menu__action {
  width: 100%;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-strong);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.portal-adult .adult-inline-menu__action:hover,
.portal-adult .adult-inline-menu__action:focus-visible,
.portal-adult .adult-inline-menu__action.is-active {
  background: color-mix(in srgb, var(--brand-100) 18%, var(--bg-panel) 82%);
  border-color: color-mix(
    in srgb,
    var(--brand-400) 24%,
    var(--adult-ui-border) 76%
  );
}
.portal-adult .adult-compact-snapshot {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.portal-adult .adult-compact-snapshot.adult-compact-snapshot--students {
  grid-template-columns: minmax(0, 1fr);
}
.portal-adult .adult-compact-snapshot--overview {
  margin-top: 16px;
}
.portal-adult .adult-key-block {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid var(--adult-ui-border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--bg-panel) 92%, var(--brand-100) 8%);
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-key-block > strong {
  color: var(--text-strong);
  font-size: 0.94rem;
}
.portal-adult .adult-contact-list {
  display: grid;
  gap: 6px;
}
.portal-adult .adult-contact-list span {
  color: var(--text-body);
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.portal-adult .adult-inline-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.portal-adult .adult-inline-metrics span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--brand-100) 12%);
  color: var(--text-body);
  font-size: 0.84rem;
  font-weight: 600;
}
.portal-adult .adult-inline-metrics strong {
  color: var(--text-strong);
}
.portal-adult .adult-info-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 14px;
  align-items: start;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 90%, var(--brand-100) 10%);
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-info-card--wide {
  grid-column: 1 / -1;
}
.portal-adult .adult-info-card__head {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-adult .adult-info-card__value {
  justify-self: end;
  text-align: right;
  max-width: 24ch;
  font-size: 1.18rem;
  font-weight: 800;
  line-height: 1.2;
  color: var(--text-strong);
}
.portal-adult .adult-info-card__value--text {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
}
.portal-adult .adult-class-picker,
.portal-adult .adult-class-picker__group {
  display: grid;
  gap: 12px;
}
.portal-adult .adult-class-picker__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.portal-adult .adult-class-picker__items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.portal-adult .adult-class-picker-card {
  display: grid;
  gap: 8px;
  text-align: left;
  border: 1px solid var(--adult-ui-border);
  background: var(--adult-ui-surface);
  border-radius: 18px;
  padding: 14px;
  font: inherit;
  cursor: pointer;
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-class-picker-card.is-active {
  border-color: var(--adult-ui-border-strong);
  background: var(--adult-ui-surface-active);
  box-shadow: var(--adult-ui-shadow-active);
}
.portal-adult .adult-class-picker-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.portal-adult .adult-class-picker-card__head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-adult .adult-class-picker-card__head strong {
  color: var(--text-strong);
}
.portal-adult .adult-class-picker-card__head span {
  color: var(--text-muted);
  font-size: 0.86rem;
}
.portal-adult .adult-class-picker-card__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.portal-adult .adult-mini-stat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--brand-100) 12%);
  color: var(--text-strong);
  font-size: 0.82rem;
  font-weight: 600;
}
.portal-adult .adult-mini-stat strong {
  font-size: 0.88rem;
}
.portal-adult .adult-workspace-tabs {
  margin-bottom: 14px;
}
.portal-adult .adult-page-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.portal-adult .adult-page-toolbar .adult-workspace-tabs {
  margin-bottom: 0;
}
.portal-adult .adult-recommendation-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
  align-items: stretch;
}
.portal-adult .adult-recommendation-item {
  display: grid;
  gap: 12px;
  height: 100%;
  border: 1px solid var(--adult-ui-border);
  border-radius: 18px;
  padding: 16px;
  background: var(--adult-ui-surface);
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-recommendation-item__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.portal-adult .planner-backlog-item .status-pill,
.portal-adult .recommendation-inbox-row__status .status-pill {
  display: inline-grid;
  place-items: center;
  text-align: center;
  min-height: 38px;
  line-height: 1.15;
}
.portal-adult .recommendation-inbox {
  display: grid;
  gap: 10px;
}
.portal-adult .recommendation-inbox-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.15fr) repeat(
      3,
      minmax(150px, 0.85fr)
    ) minmax(116px, 0.45fr) minmax(170px, 0.58fr);
  gap: 10px;
  align-items: stretch;
  border: 1px solid var(--adult-ui-border);
  border-radius: 20px;
  padding: 12px;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel) 88%, var(--brand-50) 12%)
  );
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .recommendation-inbox-row__who,
.portal-adult .recommendation-inbox-row__cell,
.portal-adult .recommendation-inbox-row__status {
  min-width: 0;
  border: 1px solid
    color-mix(in srgb, var(--adult-ui-border) 82%, transparent 18%);
  border-radius: 16px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
}
.portal-adult .recommendation-inbox-row__who {
  display: grid;
  gap: 6px;
}
.portal-adult .recommendation-inbox-row__who h3 {
  margin: 0;
  color: var(--text-strong);
  font-size: clamp(1rem, 1.4vw, 1.16rem);
  line-height: 1.18;
}
.portal-adult .recommendation-inbox-row__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.portal-adult .recommendation-inbox-row__meta span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border: 1px solid var(--adult-ui-border);
  border-radius: 999px;
  padding: 4px 9px;
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 800;
}
.portal-adult .recommendation-inbox-row__cell {
  display: grid;
  gap: 5px;
  align-content: start;
}
.portal-adult .recommendation-inbox-row__cell strong {
  color: var(--text-strong);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.portal-adult .recommendation-inbox-row__cell span {
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1.35;
}
.portal-adult .recommendation-inbox-row__status {
  display: grid;
  gap: 8px;
  align-content: center;
  justify-items: center;
}
.portal-adult .recommendation-inbox-row__actions {
  align-content: center;
  align-items: center;
  justify-content: flex-end;
}
@media (max-width: 1180px) {
  .portal-adult
    .adult-class-workspace--planner
    .adult-class-workspace__selectors {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .portal-adult .recommendation-inbox-row {
    grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(150px, 0.8fr));
  }
  .portal-adult .recommendation-inbox-row__status,
  .portal-adult .recommendation-inbox-row__actions {
    grid-column: auto;
  }
}
@media (max-width: 760px) {
  .portal-adult
    .adult-class-workspace--planner
    .adult-class-workspace__selectors,
  .portal-adult .planner-inspector__facts {
    grid-template-columns: 1fr;
  }
  .portal-adult .planner-timeline__header,
  .portal-adult .planner-timeline__row {
    grid-template-columns: minmax(118px, 0.2fr) minmax(520px, 1fr);
    min-width: 660px;
  }
  .portal-adult .planner-timeline__lane {
    min-height: 86px;
    padding: 10px;
  }
  .portal-adult .planner-timeline__track {
    min-height: 86px;
  }
  .portal-adult .planner-bar {
    min-height: 28px;
    padding: 4px 8px;
  }
  .portal-adult .recommendation-inbox-row {
    grid-template-columns: 1fr;
  }
  .portal-adult .recommendation-inbox-row__actions {
    justify-content: stretch;
  }
  .portal-adult .recommendation-inbox-row__actions .btn {
    width: 100%;
  }
}
.portal-adult .adult-collapsible-panel {
  overflow: hidden;
}
.portal-adult .adult-collapsible-panel__summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
}
.portal-adult .adult-collapsible-panel__summary::-webkit-details-marker {
  display: none;
}
.portal-adult .adult-collapsible-panel__body {
  margin-top: 14px;
}
.portal-adult .adult-collapsible-panel--embedded {
  border-top: 1px solid var(--line-subtle);
  padding-top: 12px;
}
.portal-adult .adult-login-sheet {
  display: grid;
  gap: 14px;
}
.portal-adult .adult-login-sheet > .section-header {
  margin-bottom: 0;
}
.portal-adult .adult-login-sheet__latest {
  display: grid;
  gap: 10px;
  padding: 13px 15px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 24%, var(--adult-ui-border) 76%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 88%, var(--brand-100) 12%),
    color-mix(in srgb, var(--bg-panel) 94%, white 6%)
  );
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-login-sheet__latest-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.portal-adult .adult-login-sheet__latest-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.portal-adult .adult-login-sheet__latest-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-adult .adult-login-sheet__latest-grid span {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}
.portal-adult .adult-login-sheet__latest-grid strong {
  font-size: 1rem;
  color: var(--text-strong);
  overflow-wrap: anywhere;
}
.portal-adult .adult-login-sheet__actions {
  margin-top: -2px;
}
.portal-adult .adult-login-sheet__history {
  display: grid;
  gap: 10px;
  max-height: min(40vh, 420px);
  overflow: auto;
  padding-right: 4px;
  scrollbar-gutter: stable;
}
.portal-adult .adult-login-sheet__entry {
  display: grid;
  gap: 8px;
  padding: 11px 13px;
  border-radius: 16px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--brand-100) 6%);
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-login-sheet__entry-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.portal-adult .adult-login-sheet__entry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.portal-adult .adult-login-sheet__entry-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-adult .adult-login-sheet__entry-grid span {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}
.portal-adult .adult-login-sheet__entry-grid strong {
  font-size: 1rem;
  color: var(--text-strong);
  overflow-wrap: anywhere;
}
.portal-adult .adult-login-inline {
  display: grid;
  gap: 2px;
  margin-top: 6px;
  padding: 8px 10px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand-100) 42%, var(--bg-panel) 58%);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--adult-ui-border) 82%);
  color: var(--text-body);
}
.portal-adult .adult-login-inline__label {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
}
.portal-adult .row-actions-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-start;
}
.portal-adult .row-actions-menu .btn {
  white-space: nowrap;
}
.portal-adult .row-actions-menu__more {
  position: relative;
}
.portal-adult .row-actions-menu__more summary {
  list-style: none;
}
.portal-adult .row-actions-menu__more summary::-webkit-details-marker {
  display: none;
}
.portal-adult .row-actions-menu__more-list {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 30;
  min-width: 180px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border-radius: 16px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  box-shadow: var(--adult-ui-shadow-active);
}
.portal-adult .row-actions-menu__more-list .btn {
  width: 100%;
  justify-content: flex-start;
}
.portal-adult .class-roster-modal {
  gap: 16px;
}
.portal-adult .class-roster-modal__summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--line-subtle) 86%, transparent);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--brand-100) 6%);
}
.portal-adult .class-roster-modal__summary-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.portal-adult .class-roster-modal__list {
  max-height: min(54vh, 520px);
  overflow: auto;
  padding-right: 4px;
  scrollbar-gutter: stable;
}
.portal-adult .class-roster-option {
  align-items: center;
}
.portal-adult .class-roster-option > span {
  display: grid;
  gap: 4px;
}
.portal-adult .data-item--link {
  text-decoration: none;
  color: inherit;
}
.portal-adult .data-item--stacked {
  display: grid;
  gap: 12px;
}
.portal-adult .adult-panel-scroll {
  max-height: min(44vh, 420px);
  overflow: auto;
  padding-right: 4px;
  scrollbar-gutter: stable;
}
.portal-adult .table-wrap--viewport {
  max-height: min(55vh, 560px);
  overflow: auto;
  scrollbar-gutter: stable;
}
.portal-adult .adult-people-screen .adult-detail-panel .table-wrap--viewport {
  max-height: min(74vh, 960px);
}
.portal-adult .adult-top-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
  gap: 14px;
  align-items: start;
}
.portal-adult .adult-class-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}
.portal-adult .adult-class-switch__button {
  display: grid;
  gap: 4px;
  min-width: 180px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 92%, var(--brand-100) 8%);
  color: var(--text-body);
  text-align: left;
  cursor: pointer;
  box-shadow: var(--adult-ui-shadow);
  transition:
    transform 0.12s ease,
    border-color 0.12s ease,
    background 0.12s ease;
}
.portal-adult .adult-class-switch__button strong {
  color: var(--text-strong);
  font-size: 0.96rem;
}
.portal-adult .adult-class-switch__button span {
  color: var(--text-muted);
  font-size: 0.82rem;
}
.portal-adult .adult-class-switch__button:hover,
.portal-adult .adult-class-switch__button:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(
    in srgb,
    var(--brand-500) 42%,
    var(--adult-ui-border) 58%
  );
  background: color-mix(in srgb, var(--bg-panel) 82%, var(--brand-100) 18%);
  outline: none;
}
.portal-adult .adult-class-switch__button.is-active {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 56%,
    var(--adult-ui-border) 44%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 74%, white 26%),
    color-mix(in srgb, var(--bg-panel) 88%, var(--brand-100) 12%)
  );
}
.portal-adult .filter-bar--adult-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.portal-adult .filter-bar--adult-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.portal-adult .filter-bar--adult-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.portal-adult .adult-summary-stack,
.portal-adult .adult-summary-actions,
.portal-adult .adult-summary-card,
.portal-adult .adult-summary-metric-grid,
.portal-adult .adult-settings-form,
.portal-adult .adult-settings-card,
.portal-adult .adult-settings-stack {
  display: grid;
  gap: 12px;
}
.portal-adult .adult-summary-metric {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: center;
  padding: 11px 14px;
  border-radius: 18px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 90%, var(--brand-100) 10%);
  box-shadow: var(--adult-ui-shadow);
}
.portal-adult .adult-summary-metric > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-adult .adult-summary-metric__value {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--text-strong);
}
.portal-adult .adult-summary-actions .btn {
  width: auto;
}
.portal-adult .adult-summary-actions {
  grid-template-columns: repeat(auto-fit, minmax(180px, max-content));
  justify-content: flex-start;
}
.portal-adult .adult-class-details-grid {
  margin-top: 4px;
}
.portal-adult .adult-class-details-card {
  gap: 14px;
}
.portal-adult .adult-class-titlebar {
  display: grid;
  grid-template-columns: minmax(220px, max-content) minmax(0, 1fr);
  gap: 16px;
  align-items: end;
}
.portal-adult .adult-class-title-nav {
  justify-content: flex-end;
  align-items: flex-end;
}
.portal-adult .adult-detail-tabs--class {
  justify-content: flex-end;
  margin-bottom: 0;
}
.portal-adult .adult-detail-tabs--class .adult-inline-menu {
  display: inline-flex;
}
.portal-adult .adult-detail-tabs--class .adult-inline-menu__summary {
  min-height: 44px;
  align-items: center;
  justify-content: center;
}
.portal-adult .adult-class-details-card .adult-detail-header__nav {
  justify-content: flex-start;
}
.portal-adult .adult-class-details-card .adult-class-title-nav {
  justify-content: flex-end;
}
.portal-adult .adult-class-details-card .adult-compact-snapshot {
  margin-top: 12px;
}
.portal-adult .adult-class-setup-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr);
  gap: 14px;
  align-items: stretch;
}
.portal-adult .adult-class-setup-block {
  display: grid;
  gap: 14px;
  align-content: start;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid
    color-mix(in srgb, var(--adult-ui-border) 86%, var(--brand-400) 14%);
  background:
    radial-gradient(
      circle at 12% 0%,
      color-mix(in srgb, var(--brand-100) 30%, transparent 70%),
      transparent 34%
    ),
    color-mix(in srgb, var(--bg-panel) 94%, white 6%);
}
.portal-adult .adult-class-setup-block--readiness {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--brand-100) 20%, transparent 80%),
      transparent 48%
    ),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.portal-adult .adult-class-setup-block__header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}
.portal-adult .adult-class-setup-block__header h3 {
  margin: 4px 0 0;
  color: var(--text-strong);
  font-size: clamp(1.08rem, 1.4vw, 1.28rem);
  line-height: 1.12;
}
.portal-adult .adult-class-setup-fields {
  margin-top: 0;
}
.portal-adult .adult-class-access-grid,
.portal-adult .adult-class-readiness-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.portal-adult .adult-class-setup-block .adult-key-block,
.portal-adult .adult-class-setup-block .adult-workspace-metric {
  box-shadow: none;
}
.portal-adult .adult-class-setup-block .adult-workspace-metric {
  min-height: 74px;
  background: color-mix(in srgb, var(--bg-panel) 90%, var(--brand-100) 10%);
}
.portal-adult .adult-class-activity-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.portal-adult .adult-class-activity-strip div {
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 92%, var(--brand-100) 8%);
}
.portal-adult .adult-class-activity-strip span {
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.portal-adult .adult-class-activity-strip strong {
  color: var(--text-strong);
  font-size: 1.18rem;
  line-height: 1;
}
.portal-adult .adult-material-summary {
  display: grid;
  gap: 4px;
}
.portal-adult .adult-material-summary strong {
  color: var(--text-strong);
  line-height: 1.2;
}
.portal-adult .adult-material-summary span {
  color: var(--text-muted);
  font-size: 0.84rem;
  line-height: 1.35;
}
.portal-adult .adult-detail-header__actions {
  justify-content: flex-end;
}
.portal-adult .adult-detail-header__actions .tab-button {
  font-size: 0.88rem;
  padding: 10px 14px;
}
.portal-adult .inline-notice--compact {
  margin-top: 14px;
  padding: 12px 14px;
}
.portal-adult .adult-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.portal-adult .adult-stat-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.portal-adult .adult-stat-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--adult-ui-border);
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--brand-100) 12%);
  color: var(--text-strong);
  font-size: 0.9rem;
  font-weight: 600;
}
.portal-adult .workspace-empty-card {
  padding: 20px;
}
.portal-adult .wizard-step-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.portal-adult .wizard-step {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 8px 12px;
  background: color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%);
  color: var(--text-body);
  font-size: 12px;
  font-weight: 600;
}
.portal-adult .wizard-step.is-active {
  background: color-mix(in srgb, var(--bg-highlight) 88%, var(--bg-panel) 12%);
  color: var(--text-strong);
}
.portal-adult .adult-overview-screen .section-header p,
.portal-adult .adult-detail-header p {
  max-width: 58ch;
}
@media (max-width: 1180px) {
  .portal-adult .mp-topbar--adult .mp-topbar__inner {
    grid-template-columns: auto minmax(220px, 1fr) auto;
    row-gap: 8px;
    align-items: center;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__left,
  .portal-adult .mp-topbar--adult .mp-topbar__center,
  .portal-adult .mp-topbar--adult .mp-topbar__right {
    justify-content: flex-start;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__right {
    justify-self: end;
    justify-content: flex-end;
  }
  .portal-adult .app-shell--adult {
    grid-template-columns: 228px minmax(0, 1fr);
    align-items: start;
  }
  .portal-adult .adult-compact-snapshot {
    grid-template-columns: 1fr;
  }
  body.sidebar-collapsed.portal-adult .app-shell--adult {
    grid-template-columns: var(--sidebar-width-collapsed) minmax(0, 1fr);
  }
  .portal-adult .app-sidebar--adult {
    position: sticky;
    top: calc(var(--header-height) + 10px);
    max-height: calc(100vh - var(--header-height) - 24px);
    max-height: calc(100dvh - var(--header-height) - 24px);
  }
  .portal-adult .filter-bar--curriculum {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 1100px) {
  .portal-adult .report-visual-grid,
  .portal-adult .report-hero-grid,
  .portal-adult .adult-top-grid,
  .portal-adult .adult-home-focus-grid,
  .portal-adult .adult-home-board,
  .portal-adult .adult-students-workbench,
  .portal-adult .adult-settings-grid,
  .portal-adult .overview-workbench,
  .portal-adult .adult-workspace-grid,
  .portal-adult .report-roster-row,
  .portal-adult .report-callout__header,
  .portal-adult .report-callout__priority {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-list-panel__items {
    max-height: none;
  }
  .portal-adult .adult-people-overview-toolbar,
  .portal-adult .adult-summary-metric-grid--people,
  .portal-adult .adult-login-sheet__latest-grid {
    grid-template-columns: 1fr;
  }
  .portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__selectors {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .adult-class-workspace--students .adult-workspace-metric {
    min-height: 64px;
    padding: 9px 11px;
  }
  .portal-adult
    .adult-class-workspace--students
    .adult-workspace-metric__value {
    font-size: clamp(1.12rem, 2vw, 1.42rem);
  }
  .portal-adult .adult-class-workspace--students .adult-workspace-metric__hint {
    font-size: 0.78rem;
  }
  .portal-adult .adult-compact-snapshot.adult-compact-snapshot--students {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .adult-login-sheet__entry-grid {
    grid-template-columns: 1fr;
  }
  .portal-adult .row-actions-menu {
    flex-direction: column;
    align-items: stretch;
  }
  .portal-adult .adult-class-workspace__toolbar {
    align-items: stretch;
  }
  .portal-adult .adult-class-workspace__toolbar--split,
  .portal-adult .adult-class-workspace__selectors {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-class-workspace__toolbar input {
    max-width: none;
  }
  .portal-adult .adult-class-workspace__metrics,
  .portal-adult .adult-metric-rail,
  .portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__selectors {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .portal-adult .adult-detail-header__nav {
    flex-direction: column;
    align-items: stretch;
  }
  .portal-adult .adult-inline-menu__panel {
    position: static;
    margin-top: 8px;
    min-width: 0;
  }
}
@media (max-width: 980px) {
  .portal-adult .filter-bar--curriculum {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .adult-class-titlebar {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .portal-adult .adult-class-details-card .adult-class-title-nav,
  .portal-adult .adult-detail-tabs--class {
    justify-content: flex-start;
  }
  .portal-adult .adult-class-setup-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .portal-adult .report-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .report-chart-card__head {
    grid-template-columns: 1fr;
    display: grid;
  }
  .portal-adult .report-chart-card__stat {
    min-width: 0;
    justify-items: start;
    text-align: left;
  }
  .portal-adult .report-chart-card--primary {
    grid-template-rows: auto auto auto;
  }
  .portal-adult .adult-home-hero {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-home-hero__actions {
    justify-content: flex-start;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr);
  }
  .portal-adult .mp-topbar--adult .mp-topbar__right {
    justify-self: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .portal-adult .adult-recommendation-list,
  .portal-adult .filter-bar--adult-2,
  .portal-adult .filter-bar--adult-3,
  .portal-adult .filter-bar--adult-4 {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-class-switch__button {
    width: 100%;
  }
  .portal-adult .adult-class-workspace__metrics,
  .portal-adult .adult-metric-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .adult-class-overview-grid {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-info-card,
  .portal-adult .adult-info-card--wide {
    grid-column: auto;
  }
  .portal-adult .adult-info-card {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-info-card__value {
    justify-self: start;
    text-align: left;
    max-width: none;
  }
}
@media (max-width: 640px) {
  .portal-adult .filter-bar--curriculum,
  .portal-adult .adult-class-workspace__metrics,
  .portal-adult .adult-metric-rail {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-home-hero {
    padding: 18px;
  }
  .portal-adult .adult-home-mini-kpis,
  .portal-adult .report-followup-row {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-home-hero__actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .portal-adult .adult-home-hero__actions > .btn,
  .portal-adult .adult-home-hero__actions > button {
    width: 100%;
    justify-content: center;
  }
  .portal-adult .adult-home-list-row {
    grid-template-columns: minmax(0, 1fr) clamp(108px, 30vw, 148px);
    align-items: stretch;
    gap: 10px;
  }
  .portal-adult .adult-home-list-row__meta {
    min-width: 0;
    justify-items: end;
    text-align: right;
    align-content: space-between;
  }
  .portal-adult .adult-home-list-row__meta--action {
    align-content: center;
  }
  .portal-adult .report-action-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .report-action-table {
    gap: 10px;
    overflow: visible;
    border: 0;
    background: transparent;
  }
  .portal-adult .report-action-row {
    min-width: 0;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--adult-ui-border);
    border-radius: 18px;
    background: var(--adult-ui-surface);
  }
  .portal-adult .report-action-row--head {
    display: none;
  }
  .portal-adult .report-action-row__actions,
  .portal-adult .report-followup-row__actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .portal-adult .report-followup-list {
    height: auto;
  }
  .portal-adult .adult-class-access-grid,
  .portal-adult .adult-class-readiness-grid,
  .portal-adult .adult-class-activity-strip {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-class-details-card .adult-detail-tabs {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .adult-class-details-card .adult-detail-tabs .tab-button,
  .portal-adult .adult-class-details-card .adult-inline-menu,
  .portal-adult .adult-class-details-card .adult-inline-menu__summary {
    width: 100%;
  }
  .portal-adult .adult-class-details-card .adult-inline-menu__summary {
    justify-content: center;
  }
  .portal-adult .adult-roster-table,
  .portal-adult .adult-roster-table thead,
  .portal-adult .adult-roster-table tbody,
  .portal-adult .adult-roster-table tr,
  .portal-adult .adult-roster-table th,
  .portal-adult .adult-roster-table td {
    display: block;
  }
  .portal-adult .adult-roster-table thead {
    display: none;
  }
  .portal-adult .adult-roster-table tbody {
    display: grid;
    gap: 10px;
  }
  .portal-adult .adult-roster-table tr {
    padding: 12px;
    border: 1px solid var(--adult-ui-border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  }
  .portal-adult .adult-roster-table td {
    display: grid;
    grid-template-columns: minmax(92px, 0.38fr) minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 7px 0;
    border-bottom: 1px solid
      color-mix(in srgb, var(--adult-ui-border) 72%, transparent 28%);
  }
  .portal-adult .adult-roster-table td:last-child {
    border-bottom: 0;
  }
  .portal-adult .adult-roster-table td:before {
    content: attr(data-label);
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
  }
  .portal-adult .adult-roster-table td[data-label="Actions"],
  .portal-adult .adult-roster-table td[data-label="Akcje"] {
    display: grid;
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-roster-table td[data-label="Actions"]:before,
  .portal-adult .adult-roster-table td[data-label="Akcje"]:before {
    display: none;
  }
  .portal-adult .adult-roster-table .row-actions-menu {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .portal-adult .adult-roster-table .row-actions-menu .btn,
  .portal-adult .adult-roster-table .row-actions-menu__more,
  .portal-adult .adult-roster-table .row-actions-menu__more summary {
    width: 100%;
  }
}
@media (max-width: 760px) {
  .portal-adult .mp-topbar--adult .mp-topbar__inner {
    width: min(100%, calc(100vw - 16px));
    padding: 8px 8px 10px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "left right" "center center";
    align-items: center;
    row-gap: 8px;
    column-gap: 8px;
    border-radius: 0 0 18px 18px;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__left {
    min-width: 0;
    gap: 10px;
    align-self: center;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__left-slot {
    order: 0;
  }
  .portal-adult .report-queue-list {
    height: auto;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__brand {
    min-width: 0;
  }
  .portal-adult .mp-topbar--adult .topbar-brand-image,
  .portal-adult .mp-topbar--adult .mp-topbar__brand img {
    max-width: min(164px, 100%);
    height: clamp(28px, 7vw, 34px);
  }
  .portal-adult .mp-topbar--adult .mp-topbar__center {
    width: 100%;
    justify-content: stretch;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__right,
  .portal-adult .mp-topbar--adult .mp-topbar__right--signed-in,
  .portal-adult .mp-topbar--adult .mp-topbar__right--signed-out {
    width: auto;
    min-height: auto;
    justify-self: end;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    display: flex;
  }
  .portal-adult .mp-topbar--adult .mp-topbar__utility-pill {
    width: auto;
    min-height: auto;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 4px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  .portal-adult .mp-topbar--adult .mp-tool-group,
  .portal-adult .mp-topbar--adult .mp-language-menu,
  .portal-adult .mp-topbar--adult .mp-profile-menu {
    width: auto;
    flex: 0 0 auto;
  }
  .portal-adult .mp-topbar--adult .mp-tool-group {
    gap: 4px;
  }
  .portal-adult .mp-topbar--adult .mp-language-menu summary,
  .portal-adult .mp-topbar--adult .mp-topbar__control,
  .portal-adult .mp-topbar--adult .mp-profile-trigger {
    min-height: 44px;
    padding-inline: 4px;
    font-size: 1rem;
  }
  .portal-adult .mp-topbar--adult .mp-profile-trigger__avatar {
    width: 36px;
    height: 36px;
  }
  .portal-adult .mp-topbar--adult .mp-command {
    min-height: 44px;
    padding-inline: 12px;
    border-radius: 18px;
  }
  .portal-adult .drawer-toggle {
    align-self: center;
    padding-inline: 8px;
    font-size: 1.28rem;
    line-height: 1;
  }
  .portal-adult .adult-mobile-menu-toggle--topbar {
    padding-inline: 0;
    width: 44px;
    min-width: 44px;
    min-height: 44px;
  }
  .portal-adult .app-sidebar__togglebar {
    display: none;
  }
  .portal-adult .app-content--adult {
    gap: 10px;
    padding: 10px;
  }
  .portal-adult .adult-people-overview-toolbar__actions {
    width: 100%;
  }
  .portal-adult .adult-people-overview-toolbar__actions > * {
    flex: 1 1 100%;
  }
  .portal-adult .adult-people-roster-toolbar,
  .portal-adult .adult-compact-snapshot.adult-compact-snapshot--students {
    grid-template-columns: 1fr;
  }
  .portal-adult .adult-students-roster-head .button-row {
    width: 100%;
  }
  .portal-adult .adult-students-roster-head .button-row > * {
    flex: 1 1 100%;
  }
  .portal-adult .section.section--compact,
  .portal-adult .section--compact {
    gap: 10px;
  }
  .portal-adult .section-header {
    align-items: flex-start;
    gap: 8px;
  }
  .portal-adult .section-header h1,
  .portal-adult .section-header h2 {
    margin-top: 4px;
    line-height: 1.06;
  }
  .portal-adult .adult-workspace-metric {
    min-height: 64px;
  }
  .portal-adult .adult-class-workspace--students,
  .portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__selectors {
    gap: 8px;
  }
  .portal-adult .adult-class-workspace--students .adult-select-field {
    gap: 4px;
  }
  .portal-adult .adult-class-workspace--students .adult-select-field select {
    min-height: 42px;
    border-radius: 14px;
  }
  .portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .portal-adult .adult-class-workspace--students .adult-workspace-metric {
    min-height: 58px;
    padding: 8px 10px;
  }
  .portal-adult
    .adult-class-workspace--students
    .adult-workspace-metric__label {
    font-size: 0.68rem;
  }
  .portal-adult
    .adult-class-workspace--students
    .adult-workspace-metric__value {
    font-size: 1.14rem;
  }
  .portal-adult .adult-class-workspace--students .adult-workspace-metric__hint {
    display: none;
  }
  .portal-adult .section-header h1 {
    font-size: clamp(2rem, 8vw, 2.5rem);
  }
  .portal-adult .section-header p {
    font-size: 0.98rem;
    line-height: 1.45;
  }
  .portal-adult .card,
  .portal-adult .overview-kpi,
  .portal-adult .adult-detail-header,
  .portal-adult .adult-list-panel,
  .portal-adult .adult-detail-panel > .card {
    padding: 14px;
    border-radius: 22px;
  }
  .portal-adult .overview-kpi-strip,
  .portal-adult .adult-summary-metric-grid,
  .portal-adult .report-summary-strip,
  .portal-adult .report-meta-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .portal-adult .report-chart-plot {
    padding: 12px 12px 10px;
  }
  .portal-adult .report-chart-axis {
    font-size: 0.72rem;
    gap: 6px;
  }
  .portal-adult .adult-stat-pills {
    gap: 6px;
  }
  .portal-adult .adult-stat-pill {
    width: 100%;
    justify-content: space-between;
  }
  .portal-adult .table-wrap--viewport {
    max-height: none;
  }
  .portal-adult .app-shell--adult,
  body.sidebar-collapsed.portal-adult .app-shell--adult {
    grid-template-columns: 1fr;
  }
  .portal-adult .app-sidebar--adult,
  body.sidebar-collapsed.portal-adult .app-sidebar--adult {
    position: fixed;
    inset: calc(var(--header-height) + 44px) 12px 12px 12px;
    width: auto;
    max-height: calc(100vh - var(--header-height) - 56px);
    max-height: calc(100dvh - var(--header-height) - 56px);
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 22px;
  }
  body.sidebar-collapsed.portal-adult .sidebar-group__label {
    display: inline;
  }
  body.sidebar-collapsed.portal-adult .sidebar-group__chevron {
    display: inline-block;
  }
  body.sidebar-collapsed.portal-adult .sidebar-group__title {
    justify-content: space-between;
    padding-right: 2px;
    min-height: 0;
  }
  body.sidebar-collapsed.portal-adult .sidebar-group__summary {
    justify-content: flex-start;
  }
  body.sidebar-collapsed.portal-adult .sidebar-group__items {
    display: grid;
  }
  body.sidebar-collapsed.portal-adult .sidebar-link span {
    display: block;
  }
  body.sidebar-collapsed.portal-adult .scope-switcher,
  body.sidebar-collapsed.portal-adult .sidebar-panel--footer {
    display: grid;
  }
  body.sidebar-collapsed.portal-adult .sidebar-status {
    display: flex;
  }
  body.sidebar-collapsed.portal-adult .sidebar-help-btn {
    display: block;
  }
  body.sidebar-collapsed.portal-adult .sidebar-footer-expanded {
    display: grid;
  }
  body.sidebar-collapsed.portal-adult .sidebar-footer-compact {
    display: none;
  }
  body.sidebar-collapsed.portal-adult .sidebar-link {
    justify-content: flex-start;
    padding: 9px 12px 9px 16px;
  }
  body.portal-adult .app-sidebar--adult,
  body.sidebar-collapsed.portal-adult .app-sidebar--adult {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 10px;
    min-height: 0;
    overflow: hidden;
    padding: 12px;
    padding-bottom: max(12px, var(--safe-area-bottom));
  }
  body.portal-adult .sidebar-panel--nav {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-right: 2px;
  }
  body.portal-adult .sidebar-panel--nav .section-rail {
    display: grid;
    gap: 10px;
    padding-bottom: 4px;
  }
  body.portal-adult .sidebar-panel--footer {
    flex: 0 0 auto;
    margin-top: 0;
    padding-top: 10px;
    border-top: 1px solid
      color-mix(in srgb, var(--adult-ui-border) 82%, transparent 18%);
    background: linear-gradient(
      180deg,
      color-mix(in srgb, var(--adult-ui-surface) 86%, white 14%),
      color-mix(in srgb, var(--adult-ui-surface) 96%, white 4%)
    );
  }
  body.portal-adult .scope-switcher--sidebar {
    gap: 8px;
  }
  body.portal-adult .scope-switcher--sidebar .pill {
    min-height: 44px;
  }
  .portal-adult .mp-topbar--adult .mp-profile-menu__panel {
    left: auto;
    right: 0;
    min-width: min(248px, calc(100vw - 24px));
    max-width: min(248px, calc(100vw - 24px));
  }
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__inner {
  min-height: calc(60px + var(--safe-area-top));
  padding: 6px clamp(14px, 1.8vw, 18px) 8px;
  column-gap: 10px;
  row-gap: 8px;
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__status-strip {
  gap: 8px;
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__status-chip {
  min-width: min(176px, 24vw);
  padding: 6px 10px;
  border-radius: 14px;
  gap: 8px;
  box-shadow: 0 6px 14px #2535590d;
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__status-label {
  font-size: 0.66rem;
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__status-meta,
.student-shell--compact-page
  > .mp-topbar:first-child
  .mp-topbar__status-value-full {
  display: none;
}
.student-shell--compact-page
  > .mp-topbar:first-child
  .mp-topbar__status-value-compact {
  display: inline;
}
.student-shell__body--compact-page {
  gap: 12px;
  padding-top: 14px;
}
.student-shell--compact-page .student-page-content,
.student-shell--compact-page .student-official-exams-page {
  gap: 12px;
}
.student-shell--compact-page .student-shell__body,
.student-shell--compact-page .student-shell__body--with-nav,
.student-shell--compact-page .student-page-content {
  min-height: auto;
}
.student-shell--compact-page .student-section-hero--action-first {
  gap: 10px;
  padding: 14px;
  border-radius: 24px;
}
.student-shell--compact-page .student-section-hero__header,
.student-shell--compact-page .student-section-hero__main--action-first {
  gap: 10px;
}
.student-shell--compact-page .student-section-hero__copy--action-first h1 {
  margin: 2px 0 6px;
  max-width: none;
  font-size: clamp(1.72rem, 2.7vw, 2.24rem);
}
.student-shell--compact-page .student-section-hero__copy--action-first p,
.student-shell--compact-page .student-section-hero__context,
.student-shell--compact-page .student-section-hero__meta-line {
  margin: 0;
}
.student-shell--compact-page .student-section-hero__copy--action-first p,
.student-shell--compact-page .student-section-hero__meta-line {
  font-size: 0.92rem;
}
.student-shell--compact-page .student-section-hero__metrics--status-row {
  gap: 10px;
}
.student-shell--compact-page
  .student-section-hero--action-first
  .student-metric-chip {
  gap: 2px;
  padding: 8px 10px;
}
.student-shell--compact-page
  .student-section-hero--action-first
  .student-metric-chip__meta {
  display: none;
}
.student-shell--compact-page .student-card--compact {
  padding: 14px;
  border-radius: 24px;
}
.student-shell--compact-page .student-action-row--hero,
.student-shell--compact-page .student-action-row,
.student-shell--compact-page .student-compact-row,
.student-shell--compact-page .inline-notice {
  padding: 12px 14px;
}
.student-shell--compact-page .section-header h2 {
  font-size: clamp(1.36rem, 2vw, 1.66rem);
}
.student-practice-shell .student-practice-flow-stack {
  width: 100%;
  margin: 0;
  gap: 10px;
}
.student-practice-shell .student-practice-path-card,
.student-practice-shell .student-practice-builder-card {
  padding: 12px;
  border-radius: 24px;
}
.student-practice-page--ux-refresh
  .student-section-hero__copy--action-first
  .eyebrow {
  margin-bottom: 2px;
}
.student-practice-page--ux-refresh .student-section-hero__main--action-first {
  gap: 8px;
}
.student-practice-page--ux-refresh .student-section-hero__primary-action {
  width: 100%;
  max-width: 760px;
}
.student-practice-page--ux-refresh .student-section-hero__metrics--status-row {
  gap: 8px;
}
.student-practice-page--ux-refresh .student-inline-metric {
  min-height: 0;
  padding: 10px 12px;
}
.student-practice-page--ux-refresh .student-inline-metric__value {
  font-size: 1.16rem;
}
.student-practice-page--ux-refresh .student-practice-hero-action {
  width: 100%;
  max-width: 760px;
}
.student-practice-page--ux-refresh .student-practice-start-card {
  min-height: 112px;
  padding: 14px 16px;
}
.student-practice-page--ux-refresh .student-practice-start-card__title {
  font-size: 0.98rem;
}
.student-practice-page--ux-refresh .student-practice-start-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  gap: 12px;
}
.student-competition-page--v18-8-57 .student-practice-start-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
}
.student-competition-page--v18-8-57 .student-section-hero--action-first {
  gap: 10px;
}
.student-competition-page--v18-8-57
  .student-section-hero__copy--action-first
  h1 {
  margin-bottom: 4px;
}
.student-competition-page--v18-8-57 .student-section-hero__actions-row--header {
  gap: 8px;
  flex-wrap: wrap;
}
.student-competition-board-card--hero,
.student-competition-board-card--hero .student-competition-board-list,
.student-competition-actions-grid {
  display: grid;
  gap: 10px;
}
.student-competition-board-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.student-competition-board-card--hero {
  padding: 12px;
}
.student-competition-board-card--hero .student-competition-board-switcher,
.student-competition-board-card--hero .student-competition-board-panels,
.student-competition-board-card--hero .student-competition-board-panel {
  gap: 10px;
}
.student-competition-board-card--hero .student-competition-board-panel__intro {
  gap: 3px;
}
.student-competition-board-card--hero .student-competition-board-subsection {
  gap: 8px;
  padding-top: 8px;
}
.student-competition-board-card--hero .student-segmented--views {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.student-competition-board-card--hero
  .student-segmented--views
  .student-segmented__button {
  justify-content: center;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.student-competition-board-card--hero .student-leaderboard-list {
  gap: 8px;
}
.student-competition-board-card--hero .student-leaderboard-row {
  padding: 12px 14px;
}
.student-competition-board-card--hero .student-leaderboard-row__profile strong {
  font-size: 0.96rem;
}
.student-competition-board-card--hero
  .student-leaderboard-row__stats--competition-board {
  gap: 6px;
}
.student-competition-actions-grid {
  grid-template-columns: minmax(0, 1.24fr) minmax(300px, 0.76fr);
  align-items: start;
}
.student-competition-page--v18-8-57 .student-practice-builder__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  align-items: start;
}
.student-competition-page--v18-8-57 .student-practice-builder__launch {
  width: 100%;
  min-height: 72px;
}
.student-competition-page--v18-8-57 .student-competition-builder-intro__copy {
  max-width: 56ch;
}
.student-competition-page--v18-8-57
  .student-competition-builder-intro__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.student-competition-page--v18-8-57
  .student-competition-builder-intro__actions
  .muted.small {
  line-height: 1.35;
}
.student-competition-page--v18-8-57 .student-game-hub-card,
.student-competition-page--v18-8-57
  .student-game-hub-card
  .student-practice-start-grid {
  gap: 10px;
}
.student-competition-page--v18-8-57
  .student-game-hub-card
  .student-practice-start-card {
  min-height: 96px;
  padding: 12px 14px;
  border-radius: 20px;
  gap: 8px 10px;
}
.student-competition-page--v18-8-57
  .student-game-hub-card
  .student-practice-start-card__detail {
  display: none !important;
}
.student-competition-page--v18-8-57
  .student-game-hub-card
  .student-practice-start-card__title {
  font-size: 0.98rem;
}
.student-competition-page--v18-8-57
  .student-game-hub-card
  .student-practice-start-card__cta {
  margin-top: 2px;
}
.student-competition-page--v18-8-57
  .student-competition-play-card
  .student-practice-start-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.student-competition-page--v18-8-57
  .student-competition-custom-card
  .student-practice-start-grid {
  grid-template-columns: 1fr;
}
.student-competition-page--v18-8-57
  .student-competition-custom-card
  .student-practice-start-card--wide-action {
  min-height: 92px;
}
.student-competition-header-card {
  padding: 12px 14px;
}
.student-competition-header,
.student-competition-header__main,
.student-competition-header__metrics,
.student-competition-header__actions,
.student-competition-scoreboard,
.student-competition-scoreboard-panels,
.student-competition-score-panel,
.student-competition-launch-note {
  display: flex;
  gap: 10px;
}
.student-competition-header,
.student-competition-launch-note {
  align-items: flex-start;
  justify-content: space-between;
}
.student-competition-header {
  flex-wrap: wrap;
}
.student-competition-header__main {
  flex: 1 1 540px;
  align-items: center;
  flex-wrap: wrap;
}
.student-competition-header__main h1 {
  margin: 0;
  font-size: clamp(2rem, 3vw, 2.55rem);
  line-height: 0.96;
  letter-spacing: -0.04em;
}
.student-competition-header__metrics,
.student-competition-header__actions,
.student-competition-panel-summary {
  align-items: center;
  flex-wrap: wrap;
}
.student-competition-header__actions {
  justify-content: flex-end;
  align-self: flex-start;
  display: grid;
  justify-items: end;
  min-width: min(100%, 340px);
}
.student-competition-header__actions .btn {
  justify-self: end;
}
.student-storage-mode-switch,
.student-competition-storage-mode {
  display: grid;
  gap: 7px;
  min-width: 280px;
  max-width: 360px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--line-default) 78%, transparent 22%);
  border-radius: 18px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-2) 86%, white 14%)
  );
  box-shadow:
    inset 0 1px #ffffffb8,
    0 10px 20px rgba(31, 47, 82, 0.06);
}
.student-storage-mode-switch__label,
.student-competition-storage-mode__label {
  color: var(--text-soft);
  font-size: 0.72rem;
  font-weight: 860;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}
.student-storage-mode-switch__control.student-segmented--views,
.student-competition-storage-mode__control.student-segmented--views {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  min-height: 0;
  padding: 4px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent 32%);
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg-panel) 82%, white 18%);
}
.student-storage-mode-switch__control .student-segmented__button,
.student-competition-storage-mode__control .student-segmented__button {
  justify-content: center;
  min-width: 0;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  box-shadow: none;
  color: var(--text-strong);
  font-size: 0.88rem;
  font-weight: 820;
  line-height: 1.05;
  white-space: nowrap;
}
.student-storage-mode-switch__control .student-segmented__button:hover,
.student-storage-mode-switch__control .student-segmented__button:focus-visible,
.student-competition-storage-mode__control .student-segmented__button:hover,
.student-competition-storage-mode__control
  .student-segmented__button:focus-visible {
  transform: none;
  background: color-mix(in srgb, var(--brand-100) 48%, transparent 52%);
}
.student-storage-mode-switch__control .student-segmented__button.is-active,
.student-competition-storage-mode__control
  .student-segmented__button.is-active {
  background: var(--brand-900);
  color: var(--text-inverse);
  box-shadow: 0 8px 16px rgba(31, 47, 82, 0.16);
}
.student-storage-mode-switch__detail,
.student-competition-storage-mode__detail {
  color: var(--text-soft);
  font-size: 0.78rem;
  line-height: 1.25;
}
.student-storage-mode-switch--sats {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: none;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.student-storage-mode-switch--sats .student-storage-mode-switch__label {
  white-space: nowrap;
}
.student-storage-mode-switch--sats
  .student-storage-mode-switch__control.student-segmented--views {
  min-width: 236px;
  min-height: 52px;
}
.student-storage-mode-switch--sats
  .student-storage-mode-switch__control
  .student-segmented__button {
  min-height: 44px;
}
.student-storage-mode-switch--sats .student-storage-mode-switch__detail {
  display: none;
}
.student-storage-mode-switch + .btn,
.student-competition-storage-mode + .btn {
  margin-top: 2px;
}
@media (max-width: 860px) {
  .student-competition-header__actions {
    width: 100%;
    min-width: 0;
    justify-items: stretch;
  }
  .student-competition-header__actions .btn {
    justify-self: stretch;
  }
  .student-storage-mode-switch,
  .student-storage-mode-switch,
  .student-competition-storage-mode {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
}
.student-competition-header__metric {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent 16%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, white 82%, var(--bg-panel) 18%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  white-space: nowrap;
}
.student-competition-header__metric span {
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.student-competition-header__metric strong {
  font-size: 1rem;
  line-height: 1;
}
.student-competition-scoreboard-card {
  gap: 12px;
}
.student-competition-scoreboard,
.student-competition-scoreboard-panels,
.student-competition-score-panel {
  display: grid;
  gap: 10px;
}
.student-competition-scoreboard > .student-segmented--views {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-competition-scoreboard-view > .student-segmented--views {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.student-competition-scoreboard .student-segmented__button {
  min-width: 0;
  justify-content: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.student-competition-self-list,
.student-competition-rank-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}
.student-competition-self-item,
.student-competition-rank-item {
  display: grid;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 10px 0;
  border-bottom: 1px solid
    color-mix(in srgb, var(--line-default) 84%, transparent 16%);
}
.student-competition-self-item {
  grid-template-columns: minmax(0, 1fr) auto;
}
.student-competition-rank-item {
  grid-template-columns: auto minmax(0, 1fr) auto;
}
.student-competition-self-list > :last-child,
.student-competition-rank-list > :last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.student-competition-self-item__copy,
.student-competition-rank-item__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.student-competition-self-item__copy strong,
.student-competition-rank-item__copy strong {
  font-size: 0.98rem;
  line-height: 1.16;
}
.student-competition-self-item__stats,
.student-competition-rank-item__stats,
.student-competition-panel-summary {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.student-competition-rank-item__rank {
  display: inline-grid;
  place-items: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent 16%);
  background: color-mix(in srgb, var(--bg-panel-2) 90%, white 10%);
  color: var(--text-strong);
  font-size: 0.96rem;
  font-weight: 900;
}
.student-competition-rank-item.is-current,
.student-competition-self-item.is-current {
  background: color-mix(in srgb, var(--bg-selected) 56%, transparent 44%);
}
.student-competition-launch-card {
  gap: 12px;
}
.student-competition-launch-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
}
.student-competition-launch-grid__label {
  display: flex;
  align-items: center;
  min-height: 0;
}
.student-competition-launch-grid__label h2 {
  margin: 0;
  font-size: clamp(1.14rem, 1.5vw, 1.34rem);
}
.student-competition-launch-grid__label--play,
.student-competition-launch-grid__label--custom {
  grid-column: 1 / -1;
}
.student-competition-launch-grid .student-practice-start-card {
  min-height: 112px;
  padding: 12px 14px;
  border-radius: 20px;
  gap: 8px 10px;
}
.student-competition-launch-grid .student-practice-start-card__detail {
  display: none !important;
}
.student-competition-launch-grid .student-practice-start-card__title {
  font-size: 0.96rem;
}
.student-competition-launch-grid .student-practice-start-card__cta {
  margin-top: 2px;
}
.student-competition-launch-grid .student-practice-start-card:hover,
.student-competition-launch-grid .student-practice-start-card:focus-visible {
  transform: none;
}
.student-competition-launch-note {
  margin-top: 2px;
  flex-wrap: wrap;
}
html.student-competition-builder-open,
body.student-competition-builder-open {
  overflow: hidden;
}
.student-competition-builder-modal {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: 24px;
}
.student-competition-builder-modal[hidden] {
  display: none !important;
}
.student-competition-builder-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: #1c223052;
  backdrop-filter: blur(10px);
  cursor: pointer;
}
.student-competition-builder-modal__window {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
  width: min(100%, 1180px);
  max-height: calc(100dvh - 48px);
  padding: 16px;
  overflow: auto;
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--line-default) 86%, transparent 14%);
  background: linear-gradient(180deg, #fffcf7fa, #f8f3eafa);
  box-shadow: 0 30px 80px #1f253438;
}
.student-competition-builder-modal .btn:hover,
.student-competition-builder-modal .btn:focus-visible {
  transform: none;
}
.student-competition-builder-modal__header {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding-right: 56px;
}
.student-competition-builder-modal__header .setup-close-button {
  position: absolute;
  top: 0;
  right: 0;
}
.student-competition-builder-modal__header h2 {
  margin: 2px 0 0;
  font-size: clamp(1.4rem, 2vw, 1.8rem);
}
.student-competition-builder-modal .competition-sprint-layout {
  width: 100%;
}
.student-competition-mode-modal__window {
  width: min(100%, 760px);
  max-height: calc(100vh - 64px);
}
.student-competition-mode-modal__header {
  align-items: flex-start;
}
.student-competition-mode-modal__operation,
.student-competition-mode-modal__copy {
  margin: 4px 0 0;
}
.student-competition-mode-modal__body {
  display: grid;
  gap: 12px;
}
.student-competition-mode-modal__choices {
  margin-top: 2px;
}
@media (max-width: 1280px) {
  .student-competition-launch-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .student-competition-launch-grid__label--play,
  .student-competition-launch-grid__label--custom {
    grid-column: span 3;
  }
}
@media (max-width: 460px) {
  .portal-adult .report-action-groups {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .student-competition-launch-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-competition-launch-grid__label--play,
  .student-competition-launch-grid__label--custom {
    grid-column: span 2;
  }
}

/* 19.9.4 — native Competition mode cards and Number Flight mental-chain. */
.student-competition-mode-switcher {
  display: grid;
  gap: 12px;
}
.student-competition-mode-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.student-competition-mode-card {
  appearance: none;
  width: 100%;
  min-width: 0;
  min-height: 154px;
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 22%, var(--line-default) 78%);
  border-radius: 22px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--bg-panel) 92%, var(--student-theme-secondary, #dce6ff) 8%), var(--bg-panel));
  color: var(--text-body);
  font: inherit;
  text-align: left;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
}
.student-competition-mode-card:hover {
  border-color: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 44%, var(--line-default) 56%);
  transform: translateY(-1px);
}
.student-competition-mode-card:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 72%, white 28%);
  outline-offset: 3px;
}
.student-competition-mode-card__art {
  width: 84px;
  height: 96px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 6px;
  place-items: center;
  padding: 10px;
  border-radius: 20px;
  background: color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 48%, var(--bg-panel) 52%);
  color: var(--student-theme-strong, #274694);
}
.student-competition-mode-card__art > span {
  grid-column: 1 / -1;
  font-size: 2rem;
  line-height: 1;
}
.student-competition-mode-card__art > i {
  min-width: 0;
  font-style: normal;
  font-size: 0.78rem;
  font-weight: 900;
}
.student-competition-mode-card__copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.student-competition-mode-card__copy strong {
  color: var(--text-strong);
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 1.15;
}
.student-competition-mode-card__copy > span:last-child {
  color: var(--text-muted);
  line-height: 1.4;
  text-wrap: pretty;
}
.student-competition-mode-card > .btn {
  pointer-events: none;
  justify-self: end;
  white-space: nowrap;
}
.student-competition-mode-card--number-flight {
  background:
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 56%, transparent) 0 22%, transparent 23%),
    linear-gradient(145deg, color-mix(in srgb, var(--bg-panel) 88%, #eaf5ff 12%), var(--bg-panel));
}
.young-kids-number-flight {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid color-mix(in srgb, var(--young-kids-blue, #4f7cff) 26%, var(--young-kids-line, #b9fb7f) 74%);
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--young-kids-gold, #f2c96f) 30%, transparent) 0 18%, transparent 19%),
    linear-gradient(135deg, color-mix(in srgb, var(--young-kids-blue, #4f7cff) 10%, white 90%), color-mix(in srgb, var(--young-kids-green, #2f9f72) 8%, white 92%));
  box-shadow: var(--shadow-sm);
}
.young-kids-number-flight__art {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: #ffffffcc;
  color: var(--young-kids-blue, #4f7cff);
  font-size: 2.35rem;
  box-shadow: 0 10px 24px #2f4e8520;
  transform: rotate(-7deg);
}
.young-kids-number-flight h2,
.young-kids-number-flight p {
  margin: 0;
}
.young-kids-number-flight h2 {
  margin-top: 2px;
  font-size: clamp(1.32rem, 2.4vw, 1.75rem);
}
.young-kids-number-flight p {
  margin-top: 4px;
  color: var(--young-kids-muted, #52627c);
}
.number-flight-page {
  --number-flight-accent: var(--student-theme-primary, #4f76f6);
  --number-flight-soft: color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 34%, var(--bg-panel) 66%);
  width: min(100%, 1080px);
  margin-inline: auto;
  display: grid;
  gap: 12px;
  min-width: 0;
}
.number-flight-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  border: 1px solid color-mix(in srgb, var(--number-flight-accent) 20%, var(--line-default) 80%);
  border-radius: 24px;
  background:
    radial-gradient(circle at 87% -10%, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 58%, transparent) 0 28%, transparent 29%),
    linear-gradient(145deg, color-mix(in srgb, var(--bg-panel) 94%, var(--number-flight-accent) 6%), var(--bg-panel));
  box-shadow: var(--shadow-sm);
}
.number-flight-hero h1,
.number-flight-hero p {
  margin: 0;
}
.number-flight-hero h1 {
  margin-top: 3px;
  font-size: clamp(1.8rem, 3.4vw, 2.65rem);
  line-height: 1;
}
.number-flight-hero p {
  max-width: none;
  margin-top: 6px;
  color: var(--text-muted);
  line-height: 1.4;
}
.number-flight-card {
  padding: clamp(16px, 2.4vw, 26px);
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 36%, transparent) 0 25%, transparent 26%),
    var(--bg-panel);
}
.number-flight-setup {
  display: grid;
  grid-template-columns: minmax(250px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(18px, 2.6vw, 30px);
  align-items: start;
}
.number-flight-setup__intro {
  min-height: 100%;
  display: grid;
  align-content: center;
  gap: 10px;
  padding: clamp(18px, 2.8vw, 30px);
  border-radius: 22px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--number-flight-soft) 88%, white 12%), color-mix(in srgb, var(--bg-panel) 92%, var(--number-flight-accent) 8%));
}
.number-flight-setup__intro h2,
.number-flight-setup__intro p {
  margin: 0;
}
.number-flight-setup__intro h2 {
  font-size: clamp(1.38rem, 2.4vw, 1.95rem);
  line-height: 1.16;
  text-wrap: balance;
}
.number-flight-setup__intro p {
  color: var(--text-muted);
}
.number-flight-plane {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  background: #ffffffc9;
  color: var(--number-flight-accent);
  font-size: 2.7rem;
  box-shadow: 0 14px 30px color-mix(in srgb, var(--number-flight-accent) 18%, transparent);
  transform: rotate(-8deg);
}
.number-flight-controls {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.number-flight-controls fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.number-flight-controls legend {
  margin-bottom: 8px;
  color: var(--text-strong);
  font-size: 0.95rem;
  font-weight: 900;
}
.number-flight-controls fieldset > p {
  margin: -3px 0 8px;
  color: var(--text-muted);
  font-size: 0.84rem;
}
.number-flight-level-grid,
.number-flight-operation-grid,
.number-flight-duration-grid {
  display: grid;
  gap: 8px;
}
.number-flight-level-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.number-flight-operation-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.number-flight-duration-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.number-flight-level,
.number-flight-operation,
.number-flight-duration {
  appearance: none;
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--line-default);
  border-radius: 15px;
  background: color-mix(in srgb, var(--bg-panel) 96%, var(--number-flight-soft) 4%);
  color: var(--text-body);
  font: inherit;
  cursor: pointer;
}
.number-flight-level {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  text-align: left;
}
.number-flight-level strong {
  color: var(--text-strong);
}
.number-flight-level span {
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.28;
}
.number-flight-operation {
  display: grid;
  justify-items: center;
  gap: 2px;
  padding: 8px 5px;
}
.number-flight-operation > span {
  color: var(--number-flight-accent);
  font-size: 1.35rem;
  font-weight: 900;
}
.number-flight-operation strong {
  min-width: 0;
  font-size: 0.78rem;
  overflow-wrap: anywhere;
}
.number-flight-duration {
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 7px 4px;
}
.number-flight-duration strong {
  color: var(--text-strong);
  font-size: 1.08rem;
}
.number-flight-duration span {
  color: var(--text-muted);
  font-size: 0.68rem;
}
.number-flight-level.is-selected,
.number-flight-operation.is-selected,
.number-flight-duration.is-selected {
  border-color: var(--mp-selection-line, var(--number-flight-accent));
  background: var(--mp-selection-surface, var(--bg-panel));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--number-flight-accent) 14%, transparent);
}
.number-flight-level:focus-visible,
.number-flight-operation:focus-visible,
.number-flight-duration:focus-visible,
.number-flight-keypad button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--number-flight-accent) 62%, white 38%);
  outline-offset: 2px;
}
.number-flight-operation:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}
.number-flight-message {
  min-height: 1.25em;
  margin: 4px 0 0;
  color: var(--danger-700);
  font-size: 0.86rem;
  font-weight: 800;
}
.number-flight-start {
  min-height: 50px;
  justify-content: center;
}
.number-flight-resume {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 250px;
}
.number-flight-resume h2,
.number-flight-resume p {
  margin: 0;
}
.number-flight-resume h2 {
  margin-top: 4px;
  font-size: clamp(1.35rem, 2.5vw, 1.9rem);
}
.number-flight-resume p {
  margin-top: 8px;
  color: var(--text-muted);
}
.number-flight-resume > div:last-child {
  display: grid;
  gap: 8px;
}
.number-flight-session {
  display: grid;
  gap: 14px;
  min-height: min(520px, calc(100dvh - 245px));
}
.number-flight-session-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(76px, 1fr)) auto;
  gap: 8px;
  align-items: stretch;
}
.number-flight-session-bar > div {
  display: grid;
  place-items: center;
  gap: 1px;
  min-height: 54px;
  padding: 7px 10px;
  border: 1px solid var(--line-default);
  border-radius: 15px;
  background: color-mix(in srgb, var(--number-flight-soft) 58%, var(--bg-panel) 42%);
}
.number-flight-session-bar span {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.number-flight-session-bar strong {
  color: var(--text-strong);
  font-size: 1.25rem;
}
.number-flight-stage {
  flex: 1 1 auto;
  min-height: 330px;
  display: grid;
  place-content: center;
  gap: 12px;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--number-flight-accent) 16%, var(--line-default) 84%);
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 120%, color-mix(in srgb, var(--number-flight-accent) 12%, transparent) 0 40%, transparent 41%),
    linear-gradient(180deg, color-mix(in srgb, #eaf6ff 48%, var(--bg-panel) 52%), var(--bg-panel));
}
.number-flight-phase-label {
  color: var(--text-muted);
  font-size: clamp(1rem, 1.8vw, 1.22rem);
  font-weight: 850;
}
.number-flight-phase-value {
  color: var(--text-strong);
  font-size: clamp(4.2rem, 12vw, 7.8rem);
  font-weight: 950;
  letter-spacing: -0.055em;
  line-height: 0.94;
}
.number-flight-phase-value--plane {
  color: var(--number-flight-accent);
  font-size: clamp(4rem, 10vw, 6.8rem);
  transform: rotate(-8deg);
}
.number-flight-checkpoint {
  width: min(100%, 620px);
  margin: auto;
  display: grid;
  gap: 10px;
  text-align: center;
}
.number-flight-checkpoint h2 {
  margin: 0;
  font-size: clamp(1.45rem, 3vw, 2rem);
}
.number-flight-checkpoint label {
  display: grid;
  gap: 6px;
  text-align: left;
}
.number-flight-checkpoint label > span {
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 800;
}
.number-flight-checkpoint input {
  width: 100%;
  min-height: 68px;
  border: 2px solid color-mix(in srgb, var(--number-flight-accent) 32%, var(--line-default) 68%);
  border-radius: 18px;
  background: var(--bg-panel);
  color: var(--text-strong);
  font: inherit;
  font-size: clamp(1.8rem, 5vw, 2.7rem);
  font-weight: 900;
  text-align: center;
}
.number-flight-checkpoint input:focus {
  border-color: var(--number-flight-accent);
  outline: 3px solid color-mix(in srgb, var(--number-flight-accent) 15%, transparent);
}
.number-flight-keypad {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.number-flight-keypad button {
  min-height: 48px;
  border: 1px solid var(--line-default);
  border-radius: 14px;
  background: var(--bg-panel);
  color: var(--text-strong);
  font: inherit;
  font-size: 1.12rem;
  font-weight: 900;
  cursor: pointer;
}
.number-flight-answer-actions,
.number-flight-completion-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.number-flight-answer-actions .btn {
  flex: 1 1 140px;
}
.number-flight-feedback {
  min-height: 330px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  place-content: center;
  align-items: center;
  gap: 18px;
  text-align: left;
}
.number-flight-feedback > span {
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border-radius: 28px;
  background: color-mix(in srgb, var(--success-700) 12%, var(--bg-panel) 88%);
  color: var(--success-700);
  font-size: 3rem;
  font-weight: 900;
}
.number-flight-feedback.is-wrong > span {
  background: color-mix(in srgb, var(--danger-700) 10%, var(--bg-panel) 90%);
  color: var(--danger-700);
}
.number-flight-feedback h2,
.number-flight-feedback p {
  margin: 0;
}
.number-flight-feedback h2 {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
}
.number-flight-feedback p {
  margin-top: 5px;
  color: var(--text-muted);
}
.number-flight-completion {
  display: grid;
  gap: 16px;
}
.number-flight-completion-hero {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
}
.number-flight-completion-hero > span {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  background: var(--number-flight-soft);
  color: var(--number-flight-accent);
  font-size: 2.7rem;
  transform: rotate(-7deg);
}
.number-flight-completion-hero h2,
.number-flight-completion-hero p {
  margin: 0;
}
.number-flight-completion-hero h2 {
  margin-top: 4px;
  font-size: clamp(1.45rem, 3vw, 2.1rem);
}
.number-flight-completion-hero p {
  margin-top: 4px;
  color: var(--text-muted);
}
.number-flight-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
.number-flight-metrics article {
  display: grid;
  gap: 3px;
  padding: 13px;
  border: 1px solid var(--line-default);
  border-radius: 16px;
  background: color-mix(in srgb, var(--number-flight-soft) 46%, var(--bg-panel) 54%);
  text-align: center;
}
.number-flight-metrics span {
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 800;
}
.number-flight-metrics strong {
  color: var(--text-strong);
  font-size: 1.45rem;
}
.number-flight-review[hidden] {
  display: none !important;
}
.number-flight-review {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding-top: 4px;
}
.number-flight-review-head,
.number-flight-review-row {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(86px, 0.55fr) minmax(86px, 0.55fr) minmax(98px, 0.65fr);
  gap: 10px;
  align-items: center;
}
.number-flight-review-head {
  padding: 0 12px;
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.number-flight-review-row {
  padding: 11px 12px;
  border: 1px solid var(--line-default);
  border-left: 4px solid var(--success-700);
  border-radius: 15px;
  background: var(--bg-panel);
}
.number-flight-review-row.is-wrong {
  border-left-color: var(--danger-700);
}
.number-flight-review-row.is-unanswered {
  border-left-color: var(--text-soft);
}
.number-flight-review-row > div {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
}
.number-flight-review-row > div strong {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: var(--number-flight-soft);
}
.number-flight-review-row > div span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.number-flight-review-row em {
  width: fit-content;
  max-width: 100%;
  padding: 5px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--success-700) 11%, var(--bg-panel) 89%);
  color: var(--success-700);
  font-style: normal;
  font-size: 0.74rem;
  font-weight: 850;
}
.number-flight-review-row.is-wrong em {
  background: color-mix(in srgb, var(--danger-700) 9%, var(--bg-panel) 91%);
  color: var(--danger-700);
}
/* MP_19.9.4 — native Competition hub, Quick Calculations setup and Number Flight pace. */
.competition-mode-hub,
.competition-setup-page,
.competition-board-page {
  width: min(100%, 1080px);
  margin-inline: auto;
  min-width: 0;
}
.competition-mode-hub {
  display: grid;
  gap: 14px;
}
.competition-mode-hub__hero,
.competition-setup-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: clamp(18px, 2.8vw, 28px);
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 18%, var(--line-default) 82%);
  border-radius: 25px;
  background:
    radial-gradient(circle at 92% -12%, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 48%, transparent) 0 32%, transparent 33%),
    linear-gradient(145deg, color-mix(in srgb, var(--bg-panel) 95%, var(--student-theme-primary, #5a78ff) 5%), var(--bg-panel));
  box-shadow: var(--shadow-sm);
}
.competition-mode-hub__hero h1,
.competition-mode-hub__hero p,
.competition-setup-hero h1,
.competition-setup-hero p {
  margin: 0;
}
.competition-mode-hub__hero h1,
.competition-setup-hero h1 {
  margin-top: 4px;
  color: var(--text-strong);
  font-size: clamp(1.8rem, 3.4vw, 2.65rem);
  line-height: 1.06;
  text-wrap: balance;
}
.competition-mode-hub__hero p,
.competition-setup-hero p {
  max-width: 62ch;
  margin-top: 7px;
  color: var(--text-muted);
  line-height: 1.45;
}
.competition-mode-hub__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.competition-mode-hub__choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.competition-mode-hub__choices .student-competition-mode-card {
  min-height: 184px;
}
.competition-mode-hub__note {
  margin: 0;
  padding: 2px 8px;
  color: var(--text-muted);
  font-size: 0.88rem;
  text-align: center;
}

.competition-setup-page,
.competition-board-page {
  display: grid;
  gap: 14px;
}
.competition-setup-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(270px, 0.7fr);
  align-items: start;
  gap: 16px;
  min-width: 0;
}
.competition-setup-fields {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.competition-config-fieldset {
  min-width: 0;
  margin: 0;
  padding: clamp(15px, 2.2vw, 21px);
  border: 1px solid var(--line-default);
  border-radius: 21px;
  background: var(--bg-panel);
  box-shadow: var(--shadow-sm);
}
.competition-config-fieldset legend {
  padding: 0 6px;
  color: var(--text-strong);
  font-size: clamp(1rem, 1.55vw, 1.18rem);
  font-weight: 900;
}
.competition-config-fieldset > p {
  margin: 0 0 11px;
  color: var(--text-muted);
  font-size: 0.86rem;
  line-height: 1.4;
}
.competition-option-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
  gap: 9px;
}
.competition-option-grid--time {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.competition-setup-option {
  appearance: none;
  min-width: 0;
  min-height: 60px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid var(--line-default);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg-panel) 97%, var(--student-theme-secondary, #dce6ff) 3%);
  color: var(--text-body);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.competition-setup-option strong {
  min-width: 0;
  color: var(--text-strong);
  font-size: 0.96rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.competition-setup-option span {
  min-width: 0;
  color: var(--text-muted);
  font-size: 0.76rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.competition-setup-option:hover {
  border-color: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 38%, var(--line-default) 62%);
}
.competition-setup-option.is-selected,
.competition-setup-option[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 70%, var(--line-default) 30%);
  background: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 10%, var(--bg-panel) 90%);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--student-theme-primary, #5a78ff) 14%, transparent);
}
.competition-setup-option:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 66%, white 34%);
  outline-offset: 2px;
}
.competition-setup-option:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.competition-live-summary {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 13px;
  min-width: 0;
  padding: clamp(17px, 2.4vw, 23px);
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 22%, var(--line-default) 78%);
  border-radius: 23px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 48%, transparent) 0 28%, transparent 29%),
    var(--bg-panel);
  box-shadow: var(--shadow-sm);
}
.competition-live-summary h2 {
  margin: -4px 0 0;
  color: var(--text-strong);
  font-size: clamp(1.25rem, 2vw, 1.65rem);
}
.competition-live-summary dl {
  display: grid;
  gap: 0;
  margin: 0;
  border: 1px solid var(--line-default);
  border-radius: 17px;
  overflow: hidden;
}
.competition-live-summary dl > div {
  display: grid;
  grid-template-columns: minmax(80px, 0.7fr) minmax(0, 1.3fr);
  gap: 9px;
  padding: 10px 11px;
  border-bottom: 1px solid var(--line-subtle);
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--student-theme-secondary, #dce6ff) 6%);
}
.competition-live-summary dl > div:last-child {
  border-bottom: 0;
}
.competition-live-summary dt {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.competition-live-summary dd {
  min-width: 0;
  margin: 0;
  color: var(--text-strong);
  font-weight: 850;
  text-align: right;
  overflow-wrap: anywhere;
}
.competition-live-summary__storage {
  align-items: stretch;
}
.competition-live-summary__storage .student-storage-mode-switch__detail {
  min-height: 0;
}
.competition-start-button {
  width: 100%;
  min-height: 52px;
  justify-content: center;
}
.competition-setup-status {
  min-height: 1.3em;
  margin: -3px 0 0;
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 750;
}
.competition-board-page__card {
  min-height: 180px;
  padding: clamp(17px, 2.5vw, 24px);
}

.number-flight-plan-summary {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  padding: 13px 14px;
  border: 1px solid color-mix(in srgb, var(--number-flight-accent) 20%, var(--line-default) 80%);
  border-radius: 17px;
  background: #ffffffb8;
}
.number-flight-plan-summary strong {
  color: var(--text-strong);
  font-size: 1.05rem;
}
.number-flight-plan-summary span {
  color: var(--text-muted);
  font-size: 0.82rem;
  line-height: 1.35;
}
.number-flight-pace-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.number-flight-pace {
  appearance: none;
  min-width: 0;
  min-height: 66px;
  display: grid;
  align-content: center;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid var(--line-default);
  border-radius: 15px;
  background: color-mix(in srgb, var(--bg-panel) 96%, var(--number-flight-soft) 4%);
  color: var(--text-body);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.number-flight-pace strong {
  color: var(--text-strong);
  font-size: 1rem;
}
.number-flight-pace span,
.number-flight-pace small {
  color: var(--text-muted);
  font-size: 0.73rem;
  line-height: 1.25;
}
.number-flight-pace em {
  width: fit-content;
  margin-top: 2px;
  padding: 2px 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--success-700) 11%, var(--bg-panel) 89%);
  color: var(--success-700);
  font-size: 0.64rem;
  font-style: normal;
  font-weight: 850;
}
.number-flight-pace.is-selected,
.number-flight-pace[aria-pressed="true"] {
  border-color: var(--mp-selection-line, var(--number-flight-accent));
  background: var(--mp-selection-surface, var(--bg-panel));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--number-flight-accent) 14%, transparent);
}
.number-flight-pace:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--number-flight-accent) 62%, white 38%);
  outline-offset: 2px;
}
.number-flight-pace:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}
.number-flight-setup-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 9px;
}
.number-flight-setup-actions .btn {
  min-height: 50px;
  justify-content: center;
}
.number-flight-tutorial {
  min-height: 420px;
  display: grid;
  grid-template-rows: auto minmax(190px, 1fr) auto;
  gap: 18px;
}
.number-flight-tutorial__head {
  display: grid;
  gap: 5px;
  text-align: center;
}
.number-flight-tutorial__head h2 {
  max-width: 54ch;
  margin: 0 auto;
  color: var(--text-strong);
  font-size: clamp(1.25rem, 2.3vw, 1.7rem);
  line-height: 1.25;
}
.number-flight-tutorial__demo {
  display: grid;
  place-content: center;
  gap: 10px;
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--number-flight-accent) 17%, var(--line-default) 83%);
  border-radius: 23px;
  background:
    radial-gradient(circle at 50% 115%, color-mix(in srgb, var(--number-flight-accent) 12%, transparent) 0 42%, transparent 43%),
    color-mix(in srgb, var(--number-flight-soft) 52%, var(--bg-panel) 48%);
  text-align: center;
}
.number-flight-tutorial__demo > span {
  color: var(--text-muted);
  font-size: 1rem;
  font-weight: 850;
}
.number-flight-tutorial__demo > strong {
  color: var(--text-strong);
  font-size: clamp(4rem, 11vw, 7rem);
  line-height: 0.95;
}
.number-flight-tutorial__demo > p {
  max-width: 44ch;
  margin: 3px auto 0;
  color: var(--text-muted);
  line-height: 1.45;
}
.number-flight-tutorial__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.number-flight-tutorial__actions .btn {
  min-height: 50px;
  justify-content: center;
}
.number-flight-stage__context {
  position: absolute;
  inset: 16px 18px auto;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 850;
}
.number-flight-stage {
  position: relative;
  padding: 54px 20px 28px;
}
.number-flight-passive-note {
  max-width: 40ch;
  margin: 0 auto;
  color: var(--text-muted);
  font-size: 0.92rem;
  font-weight: 750;
  line-height: 1.4;
}
.number-flight-interval {
  width: min(82%, 560px);
  height: 8px;
  margin: 7px auto 0;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--number-flight-accent) 12%, var(--line-subtle) 88%);
}
.number-flight-interval > span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: var(--number-flight-accent);
  transition: width 80ms linear;
}
.number-flight-answer-clock {
  justify-self: center;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid var(--line-default);
  border-radius: 999px;
  background: var(--number-flight-soft);
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 850;
}
.number-flight-answer-clock strong {
  min-width: 1.5em;
  color: var(--text-strong);
  font-size: 1rem;
  text-align: center;
}

@media (max-width: 900px) {
  .competition-setup-shell {
    grid-template-columns: 1fr;
  }
  .competition-live-summary {
    position: static;
  }
}
@media (max-width: 760px) {
  .competition-mode-hub__hero,
  .competition-setup-hero {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .competition-mode-hub__links {
    justify-content: flex-start;
  }
  .competition-mode-hub__choices {
    grid-template-columns: 1fr;
  }
  .competition-option-grid--time,
  .number-flight-pace-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .competition-option-grid,
  .competition-option-grid--time,
  .number-flight-pace-grid,
  .number-flight-setup-actions,
  .number-flight-tutorial__actions {
    grid-template-columns: 1fr;
  }
  .competition-live-summary dl > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
  .competition-live-summary dd {
    text-align: left;
  }
  .number-flight-stage__context {
    inset: 12px 12px auto;
    font-size: 0.7rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .number-flight-interval > span,
  .student-competition-mode-card,
  .competition-setup-option {
    transition: none !important;
  }
}

@media (max-width: 820px) {
  .student-competition-mode-grid {
    grid-template-columns: 1fr;
  }
  .number-flight-setup {
    grid-template-columns: 1fr;
  }
  .number-flight-setup__intro {
    min-height: 0;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }
  .number-flight-setup__intro .number-flight-plane {
    grid-row: 1 / 5;
  }
  .number-flight-resume {
    grid-template-columns: 72px minmax(0, 1fr);
  }
  .number-flight-resume > div:last-child {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .number-flight-session {
    min-height: min(520px, calc(100dvh - 220px));
  }
}
@media (max-width: 620px) {
  .student-competition-mode-card {
    grid-template-columns: 62px minmax(0, 1fr);
    min-height: 132px;
    padding: 12px;
  }
  .student-competition-mode-card__art {
    width: 62px;
    height: 78px;
    padding: 7px;
  }
  .student-competition-mode-card > .btn {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }
  .young-kids-number-flight {
    grid-template-columns: 56px minmax(0, 1fr);
    padding: 14px;
  }
  .young-kids-number-flight__art {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    font-size: 1.9rem;
  }
  .young-kids-number-flight > .btn {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }
  .number-flight-hero {
    grid-template-columns: 1fr;
    align-items: start;
    padding: 14px 16px;
  }
  .number-flight-hero .btn {
    width: 100%;
    justify-content: center;
  }
  .number-flight-card {
    padding: 12px;
  }
  .number-flight-setup__intro {
    grid-template-columns: 54px minmax(0, 1fr);
    padding: 15px;
  }
  .number-flight-setup__intro .number-flight-plane {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    font-size: 2rem;
  }
  .number-flight-level-grid {
    grid-template-columns: 1fr;
  }
  .number-flight-operation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .number-flight-duration-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .number-flight-duration span {
    font-size: 0.58rem;
  }
  .number-flight-session {
    min-height: min(590px, calc(100dvh - 175px));
  }
  .number-flight-session-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .number-flight-session-bar > .btn {
    grid-column: 1 / -1;
    min-height: 42px;
  }
  .number-flight-stage,
  .number-flight-feedback {
    min-height: 290px;
  }
  .number-flight-feedback {
    grid-template-columns: 64px minmax(0, 1fr);
  }
  .number-flight-feedback > span {
    width: 62px;
    height: 62px;
    border-radius: 21px;
    font-size: 2.25rem;
  }
  .number-flight-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .number-flight-completion-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .number-flight-completion-actions .btn {
    width: 100%;
    justify-content: center;
  }
  .number-flight-review-head {
    display: none;
  }
  .number-flight-review-row {
    grid-template-columns: minmax(0, 1fr) repeat(3, auto);
    gap: 7px;
    padding: 10px;
  }
  .number-flight-review-row > div {
    grid-column: 1 / -1;
  }
  .number-flight-review-row > span::before {
    display: block;
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
  }
}
@media (prefers-reduced-motion: reduce) {
  .student-competition-mode-card,
  .number-flight-page * {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}

.student-sudoku-shell .student-game-hub-card .student-practice-start-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
}
.student-practice-page--ux-refresh
  .student-practice-builder-card[data-builder-state="closed"] {
  padding: 10px 12px;
}
.student-practice-page--ux-refresh .student-practice-builder__intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-items: start;
  cursor: pointer;
}
.student-practice-page--ux-refresh .student-practice-section-note {
  margin: 4px 0 0;
  max-width: 56ch;
}
.student-practice-page--ux-refresh .student-practice-builder__intro-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.student-practice-page--ux-refresh .student-practice-builder__intro-copy h3 {
  margin: 0;
  font-size: 1.04rem;
}
.student-practice-page--ux-refresh .student-practice-builder__launch-copy {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px 12px;
  align-items: start;
  width: 100%;
}
.student-practice-page--ux-refresh .student-practice-builder__launch-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-practice-page--ux-refresh
  .student-practice-builder__launch-text
  strong {
  font-size: 1.04rem;
  line-height: 1.2;
}
.student-practice-page--ux-refresh .practice-builder-choice__detail {
  display: block;
  color: var(--text-muted);
  font-size: 0.82rem;
  line-height: 1.35;
  text-wrap: pretty;
}
.student-practice-page--ux-refresh .student-practice-builder__toggle {
  min-height: 38px;
  padding-inline: 14px;
}
.student-practice-page--ux-refresh .student-practice-builder__launch {
  width: 100%;
  min-height: 72px;
}
.student-practice-page--ux-refresh .practice-builder-choice {
  min-height: 128px;
  padding: 12px;
}
.student-practice-page--ux-refresh .student-practice-builder__wizard,
.student-practice-page--ux-refresh .student-practice-builder__step {
  gap: 10px;
}
.student-practice-page--ux-refresh .student-practice-builder__actions {
  position: static;
  padding-top: 4px;
  background: none;
}
.student-practice-page--ux-refresh .student-practice-builder__actions .btn {
  min-height: 46px;
}
.student-practice-page--ux-refresh .student-practice-builder__actions[hidden] {
  display: none;
}
.student-practice-page--ux-refresh
  .student-practice-builder__step
  .section-header
  h3,
.student-practice-page--ux-refresh
  .student-practice-path-card
  .section-header
  h2 {
  font-size: clamp(1.18rem, 1.7vw, 1.5rem);
}
.student-practice-page--ux-refresh
  .student-practice-builder-card[data-builder-state="closed"]
  .section-header
  .eyebrow,
.competition-sprint-wizard .competition-sprint-choice__detail,
.sudoku-setup-wizard .competition-sprint-choice__detail {
  display: none;
}
.competition-sprint-wizard .competition-sprint-choice__title,
.sudoku-setup-wizard .competition-sprint-choice__title {
  font-size: 1rem;
  line-height: 1.18;
  text-wrap: balance;
}
@media (max-width: 1180px) {
  .student-game-hub-grid {
    grid-template-columns: 1fr;
  }
  .student-game-hub-card .student-practice-start-grid,
  .student-practice-page--ux-refresh .student-practice-start-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-competition-actions-grid {
    grid-template-columns: 1fr;
  }
  .student-competition-board-card--hero .student-segmented--views,
  .student-competition-page--v18-8-57
    .student-competition-play-card
    .student-practice-start-grid,
  .student-home-start-card .student-practice-start-grid,
  .student-sudoku-shell .student-game-hub-card .student-practice-start-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-competition-header__main,
  .student-competition-header__actions {
    flex: 1 1 100%;
  }
  .student-competition-header__actions {
    justify-content: flex-start;
  }
  .student-competition-scoreboard-view > .student-segmented--views {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  body.portal-student {
    scrollbar-width: none;
  }
  body.portal-student::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  .student-game-hub-card .student-practice-start-grid,
  .student-competition-actions-grid,
  .student-competition-board-card--hero .student-segmented--views,
  .student-competition-page--v18-8-57
    .student-competition-play-card
    .student-practice-start-grid,
  .student-game-hub-card .student-practice-builder__intro {
    grid-template-columns: 1fr;
  }
  .student-game-hub-card .student-practice-builder__launch {
    width: 100%;
  }
  .student-practice-page--ux-refresh .student-practice-start-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .student-practice-page--ux-refresh
    .student-game-hub-card
    .student-practice-start-card,
  .student-practice-page--ux-refresh
    .student-practice-builder-card[data-builder-state="closed"]
    .student-practice-start-card--wide-action {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 0;
    padding: 10px 12px;
    border-radius: 18px;
    text-align: left;
  }
  .student-practice-page--ux-refresh
    .student-game-hub-card
    .student-practice-start-card__visual,
  .student-practice-page--ux-refresh
    .student-practice-builder-card[data-builder-state="closed"]
    .student-practice-start-card--wide-action
    .student-practice-start-card__visual {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }
  .student-practice-page--ux-refresh
    .student-game-hub-card
    .student-practice-start-card__copy,
  .student-practice-page--ux-refresh
    .student-practice-builder-card[data-builder-state="closed"]
    .student-practice-start-card--wide-action
    .student-practice-start-card__copy {
    grid-column: 2;
    grid-row: 1;
    justify-items: start;
    text-align: left;
  }
  .student-practice-page--ux-refresh
    .student-game-hub-card
    .student-practice-start-card__detail {
    font-size: 0.78rem;
    line-height: 1.25;
    max-width: none;
  }
  .student-practice-page--ux-refresh
    .student-game-hub-card
    .student-practice-start-card__cta,
  .student-practice-page--ux-refresh
    .student-practice-builder-card[data-builder-state="closed"]
    .student-practice-start-card--wide-action
    .student-practice-start-card__cta {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    width: auto;
    min-width: 70px;
    min-height: 44px;
    margin: 0;
    justify-content: center;
  }
  .student-practice-page--ux-refresh .student-storage-mode-switch--hero {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .student-practice-page--ux-refresh
    .student-storage-mode-switch--hero
    .student-storage-mode-switch__label {
    white-space: nowrap;
  }
  .student-practice-page--ux-refresh
    .student-storage-mode-switch--hero
    .student-storage-mode-switch__detail {
    display: none;
  }
  .student-practice-page--ux-refresh
    .student-storage-mode-switch--hero
    .student-storage-mode-switch__control.student-segmented--views {
    flex: 1;
    min-width: 0;
  }
  .student-practice-builder__header {
    grid-template-columns: 1fr;
    padding-right: 54px;
  }
  .student-practice-builder__header .learner-setup__header-actions {
    display: grid;
    justify-self: stretch;
    margin-top: 4px;
  }
  .student-practice-builder__header .student-storage-mode-switch--wizard {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
  .student-competition-page--v18-8-57
    .student-competition-builder-intro__actions {
    flex-direction: column;
    align-items: stretch;
  }
  .student-competition-page--v18-8-57
    .student-competition-builder-intro__actions
    .btn {
    width: 100%;
  }
  .student-home-start-card .student-practice-start-grid,
  .student-sudoku-shell .student-game-hub-card .student-practice-start-grid {
    grid-template-columns: 1fr;
  }
  .student-competition-header__metric,
  .student-competition-panel-summary,
  .student-competition-self-item__stats,
  .student-competition-rank-item__stats,
  .student-competition-launch-note {
    justify-content: flex-start;
  }
  .student-competition-self-item,
  .student-competition-rank-item {
    grid-template-columns: 1fr;
  }
  .student-competition-rank-item__rank {
    width: 30px;
    min-width: 30px;
    height: 30px;
  }
  .student-competition-scoreboard > .student-segmented--views,
  .student-competition-scoreboard-view > .student-segmented--views {
    grid-template-columns: 1fr;
  }
  .student-competition-launch-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .student-competition-launch-grid__label--play,
  .student-competition-launch-grid__label--custom {
    grid-column: 1 / -1;
  }
  .student-competition-launch-grid .student-practice-start-card {
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    align-items: center;
    gap: 7px 8px;
    min-height: 112px;
    padding: 10px;
    border-radius: 18px;
  }
  .student-competition-launch-grid .student-practice-start-card__visual {
    grid-column: 1;
    grid-row: 1;
  }
  .student-competition-launch-grid .student-practice-start-card__copy {
    grid-column: 2;
    grid-row: 1;
    gap: 2px;
  }
  .student-competition-launch-grid .student-practice-start-card__detail {
    display: none;
  }
  .student-competition-launch-grid .student-practice-start-card__cta {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    margin: 0;
  }
  .student-competition-builder-modal {
    padding: 8px;
    place-items: start center;
  }
  .student-competition-builder-modal__window.learner-setup__shell {
    grid-template-rows: auto auto;
    align-content: start;
    align-items: start;
    min-height: 0;
    height: auto;
    max-height: calc(100dvh - 16px);
    padding: 10px;
    border-radius: 22px;
    gap: 10px;
    overflow: auto;
  }
  .student-competition-builder-modal .competition-sprint-layout {
    align-self: start;
  }
  .student-competition-builder-modal__header {
    display: grid;
    grid-template-columns: 1fr;
    min-height: 0;
    padding-right: 54px;
  }
  .student-competition-builder-modal__header .setup-close-button {
    top: 0;
    right: 0;
  }
  .student-inline-metric {
    grid-template-columns: 1fr;
    grid-template-areas: "label" "value" "meta";
  }
  .student-inline-metric__meta {
    justify-self: start;
    text-align: left;
    max-width: none;
  }
}
.student-practice-shell .student-practice-quick-grid .btn {
  min-height: 48px;
}
.student-competition-support-grid--single {
  grid-template-columns: 1fr;
}
.student-section-hero--action-first {
  gap: 12px;
}
.student-section-hero__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.student-section-hero__actions-row--header {
  justify-content: flex-end;
  align-self: start;
}
.student-section-hero__primary-action,
.student-section-hero__metrics--status-row {
  margin-top: 0;
}
.student-section-hero__metrics--status-row {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
}
.student-home-page--v18-8-57,
.student-competition-page--v18-8-57 {
  display: grid;
  gap: 14px;
}
.student-home-summary-card__row,
.student-home-main-grid--v18-8-57,
.student-home-lower-grid--v18-8-57,
.student-home-action-grid,
.student-official-filter-toolbar {
  display: grid;
  gap: 12px;
}
.student-official-filter-toolbar {
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: end;
}
.student-official-exams-page {
  display: grid;
  gap: 16px;
}
.student-official-licence-trigger {
  min-width: min(100%, 220px);
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid var(--line-default);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel-2) 94%, white 6%)
  );
  color: var(--text-muted);
  font: inherit;
  font-weight: 780;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}
.student-official-licence-trigger:hover,
.student-official-licence-trigger:focus-visible {
  color: var(--text-strong);
  border-color: color-mix(
    in srgb,
    var(--brand-600) 24%,
    var(--line-default) 76%
  );
  box-shadow: 0 10px 24px #2535590d;
}
.student-official-licence-trigger:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand-500) 48%, transparent);
  outline-offset: 2px;
}
.student-sats-page .student-section-hero--action-first {
  padding-block: 14px;
}
.student-sats-page .student-section-hero {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, var(--brand-500)) 14%,
    var(--line-default) 86%
  );
}
.student-sats-page .student-section-hero__main--action-first {
  gap: 12px;
}
.student-sats-page .student-section-hero__header {
  grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr);
  gap: 16px;
  align-items: start;
}
.student-sats-page .student-section-hero__aside {
  align-items: flex-start;
}
.student-sats-page .student-section-hero__actions-row--header {
  width: 100%;
  justify-content: stretch;
}
.student-sats-page
  .student-section-hero__copy--action-first
  > div:first-child
  p.muted {
  max-width: none;
}
.student-sats-hub__utility {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  width: 100%;
}
.student-sats-hub__metrics {
  margin-top: 0;
  min-width: 0;
  grid-template-columns: repeat(2, minmax(136px, 1fr));
  gap: 10px;
}
.student-sats-hub__metrics .student-inline-metric {
  min-height: 0;
  padding: 10px 12px;
  grid-template-columns: 1fr;
  grid-template-areas: "label" "value" "meta";
  gap: 4px;
  align-content: start;
}
.student-sats-hub__metrics .student-inline-metric__meta {
  justify-self: start;
  text-align: left;
  max-width: none;
  overflow-wrap: anywhere;
}
.student-sats-hub__utility-action {
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
}
.student-sats-hub__utility-action .student-official-licence-trigger {
  height: 100%;
  min-height: 0;
  white-space: nowrap;
}
.student-sats-page [data-filter-controls="official-exams"] {
  display: none !important;
}
.student-filter-field--actions {
  justify-content: end;
  align-self: end;
}
.student-filter-field--actions > span {
  opacity: 0;
  user-select: none;
}
.student-filter-reset-btn {
  width: max-content;
}
.student-sats-page .student-official-licence-trigger {
  min-width: 0;
  padding: 12px 16px;
  border-radius: 14px;
}
.student-sats-section {
  display: grid;
  gap: 10px;
}
.student-sats-section-header {
  margin-bottom: 0;
}
.student-sats-section-header__actions {
  margin-left: auto;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  align-self: flex-start;
  min-width: 0;
}
.student-sats-archive-utilities {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}
.student-sats-section-header p {
  margin: 4px 0 0;
  max-width: 48ch;
}
.student-sats-featured-card,
.student-sats-continue-card {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(240px, 0.82fr);
  gap: 18px;
  align-items: start;
}
.student-sats-featured-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, var(--brand-500)) 20%,
    var(--line-default) 80%
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      var(--student-theme-primary, var(--brand-500)) 8%,
      var(--bg-panel) 92%
    ),
    color-mix(in srgb, var(--bg-panel) 95%, white 5%)
  );
}
.student-sats-continue-card {
  background: color-mix(in srgb, var(--bg-panel) 96%, var(--bg-panel-2) 4%);
}
.student-sats-featured-card__main,
.student-sats-featured-card__copy,
.student-sats-featured-card__aside,
.student-sats-continue-card__main,
.student-sats-continue-card__aside {
  display: grid;
  gap: 10px;
}
.student-sats-featured-card__copy h3,
.student-sats-continue-card__main h3 {
  margin: 0;
  line-height: 1.12;
}
.student-sats-featured-card__intro {
  margin: 0;
  max-width: 54ch;
}
.student-sats-featured-card__detail,
.student-sats-continue-card__detail,
.student-sats-paper-row__detail {
  max-width: 46ch;
}
.student-sats-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.student-sats-resources {
  display: grid;
  gap: 8px;
}
.student-sats-resources--labelled {
  padding-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--line-default) 80%, transparent);
}
.student-sats-resources__label {
  font-size: 0.76rem;
  font-weight: 780;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.student-sats-resource-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.student-sats-resource-buttons .btn,
.student-sats-resource-buttons a {
  width: 100%;
  min-width: 0;
  justify-content: center;
  text-align: center;
}
.student-sats-archive-card {
  gap: 12px;
}
.student-sats-archive-controls {
  display: grid;
  gap: 10px;
  padding-top: 2px;
}
.student-sats-archive-card .student-sats-section-header {
  align-items: flex-start;
}
.student-sats-archive-completed-summary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  width: auto;
}
.student-sats-archive-completed-summary__label {
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #1b2a44b8;
  white-space: nowrap;
}
.student-sats-archive-completed-summary__value {
  min-height: 36px;
  width: auto;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  color: var(--text-strong);
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.86rem;
  line-height: 1.1;
  font-weight: 850;
  white-space: nowrap;
}
.student-sats-archive-reset {
  display: flex;
  align-items: flex-end;
}
.student-sats-archive-card .student-sats-section-header p {
  max-width: 68ch;
}
.student-sats-archive-list {
  display: grid;
  gap: 14px;
}
.student-sats-year-group {
  display: grid;
  gap: 10px;
}
.student-sats-year-group__header {
  padding: 0 2px 4px;
  border-bottom: 1px solid
    color-mix(in srgb, var(--line-default) 78%, transparent);
}
.student-sats-year-group__header h3 {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.2;
}
.student-sats-year-group__rows {
  gap: 8px;
}
.student-sats-paper-row {
  grid-template-columns: minmax(0, 1fr) fit-content(280px);
  align-items: start;
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.student-sats-paper-row__main {
  gap: 6px;
}
.student-sats-paper-row__meta {
  align-items: stretch;
  inline-size: fit-content;
  justify-self: end;
}
.student-sats-paper-row__actions {
  display: grid;
  gap: 8px;
  inline-size: clamp(216px, 18vw, 280px);
}
.student-sats-paper-row__actions > .btn,
.student-sats-paper-row__actions > a {
  width: 100%;
}
.student-sats-featured-card__aside > .btn,
.student-sats-continue-card__aside > .btn,
.student-sats-featured-card__aside > a,
.student-sats-continue-card__aside > a {
  width: 100%;
}
.student-sats-custom-section {
  gap: 12px;
}
.student-sats-custom-tile {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
  gap: 16px;
  align-items: start;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, var(--brand-500)) 18%,
    var(--line-default) 82%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-2) 92%, white 8%)
  );
}
.student-sats-custom-tile__main,
.student-sats-custom-tile__copy,
.student-sats-custom-wizard form,
.student-sats-custom-panels,
.student-sats-custom-panel,
.student-sats-custom-panel__head {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.student-sats-custom-tile__copy h3,
.student-sats-custom-panel__head h3 {
  margin: 0;
  line-height: 1.18;
}
.student-sats-custom-tile__copy p {
  margin: 0;
}
.student-sats-custom-tile__actions {
  display: grid;
  align-items: stretch;
  justify-items: stretch;
}
.student-sats-custom-tile__actions .btn {
  width: 100%;
}
.student-sats-custom-metrics {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  margin-top: 0;
}
.student-sats-custom-metrics .student-inline-metric {
  grid-template-columns: 1fr;
  grid-template-areas: "label" "value" "meta";
  gap: 3px;
  align-content: start;
  min-width: 0;
}
.student-sats-custom-metrics .student-inline-metric__label,
.student-sats-custom-metrics .student-inline-metric__value,
.student-sats-custom-metrics .student-inline-metric__meta {
  min-width: 0;
  max-width: none;
  justify-self: start;
  text-align: left;
  overflow-wrap: break-word;
  word-break: normal;
}
.student-sats-custom-metrics .student-inline-metric__value {
  font-size: 1.08rem;
}
.student-sats-custom-wizard {
  gap: 14px;
  border-color: color-mix(
    in srgb,
    var(--brand-600) 18%,
    var(--line-default) 82%
  );
}
.student-sats-custom-wizard[hidden],
.student-sats-custom-panel[hidden],
.student-sats-custom-paper-choice[hidden],
.student-sats-custom-filter-chip[hidden] {
  display: none;
}
.student-sats-custom-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  margin: 0;
  list-style: none;
}
.student-sats-custom-steps li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid var(--line-default);
  border-radius: 14px;
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 780;
  line-height: 1.2;
}
.student-sats-custom-steps li span {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel-2) 82%, white 18%);
  color: var(--text-strong);
}
.student-sats-custom-steps li strong {
  min-width: 0;
  font-size: 0.8rem;
  line-height: 1.15;
  word-break: normal;
  overflow-wrap: break-word;
}
.student-sats-custom-steps li.is-active {
  color: var(--text-strong);
  border-color: color-mix(
    in srgb,
    var(--brand-600) 28%,
    var(--line-default) 72%
  );
  background: color-mix(in srgb, var(--brand-100) 42%, var(--bg-panel) 58%);
}
.student-sats-entry,
.student-sats-entry__head,
.student-sats-entry-card,
.student-sats-entry-card__copy,
.student-sats-recommended-card,
.student-sats-recommended-card__copy,
.student-sats-recommended-card__actions,
.student-sats-full-papers-header,
.student-sats-custom-year-paper,
.student-sats-custom-ready-card,
.student-sats-custom-edit-links {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.student-sats-entry__head h2,
.student-sats-entry-card h2,
.student-sats-recommended-card h2,
.student-sats-full-papers-header h1 {
  margin: 0;
  line-height: 1.12;
  letter-spacing: 0;
  word-break: normal;
  overflow-wrap: break-word;
}
.student-sats-entry__choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 14px;
  align-items: stretch;
}
.student-sats-entry-card {
  align-content: space-between;
  min-height: 188px;
}
.student-sats-entry-card p,
.student-sats-recommended-card p {
  margin: 0;
  color: var(--text-muted);
}
.student-sats-entry-card small {
  color: var(--text-muted);
  font-weight: 760;
}
.student-sats-entry-card .btn,
.student-sats-recommended-card__actions > .btn,
.student-sats-recommended-card__actions > a {
  width: max-content;
  min-width: 180px;
  min-height: 44px;
}
.student-sats-recommended-card {
  grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
  align-items: center;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, var(--brand-500)) 18%,
    var(--line-default) 82%
  );
}
.student-sats-recommended-card__actions {
  justify-items: stretch;
}
.student-sats-recommended-card__actions .student-sats-resources {
  width: 100%;
}
.student-sats-entry__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--text-muted);
  font-size: 0.86rem;
  font-weight: 780;
}
.student-sats-entry__stats span {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--line-default) 86%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
}
.student-sats-full-papers-header {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px 18px;
}
.student-sats-full-papers-header__tools {
  justify-self: end;
  align-self: start;
}
.student-sats-full-papers-header__copy {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 8px 12px;
  min-width: 0;
}
.student-sats-full-papers-header__title {
  min-width: 0;
}
.student-sats-full-papers-header__title p {
  margin: 2px 0 0;
}
.student-sats-custom-goal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 10px;
}
.student-sats-custom-year-paper[hidden],
.student-sats-custom-chip-grid[hidden],
.student-sats-custom-reasoning-switch[hidden] {
  display: none;
}
.student-sats-custom-filter-chip em,
.student-sats-custom-choice em {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-style: normal;
  font-weight: 800;
}
.student-sats-custom-filter-chip:disabled,
.student-sats-custom-choice-button:disabled {
  cursor: not-allowed;
  opacity: 0.56;
}
.student-sats-custom-ready-card {
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--line-default) 88%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg-panel) 95%, var(--brand-50) 5%);
}
.student-sats-custom-ready-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
  gap: 8px;
}
.student-sats-custom-ready-list span {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  font-weight: 780;
  word-break: normal;
  overflow-wrap: break-word;
}
.student-sats-custom-edit-links {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}
.student-sats-custom-edit-links .btn {
  width: 100%;
}
.student-sats-custom-type-grid,
.student-sats-custom-chip-grid,
.student-sats-custom-status-group,
.student-sats-custom-paper-row {
  display: grid;
  gap: 10px;
}
.student-sats-custom-type-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
}
.student-sats-custom-paper-row {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
}
.student-sats-custom-config,
.student-sats-custom-config__group {
  display: grid;
  gap: 12px;
}
.student-sats-custom-config {
  padding: 14px;
  border: 1px solid var(--line-default);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--brand-50) 6%);
}
.student-sats-custom-config__group h3 {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.2;
}
.student-sats-custom-status-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  gap: 10px;
}
.student-sats-custom-count-label {
  display: grid;
  gap: 6px;
  max-width: 240px;
}
.student-sats-custom-count-label select {
  min-height: 44px;
}
.student-sats-custom-chip-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
}
.student-sats-custom-chip-grid--marks {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 136px), 1fr));
}
.student-sats-custom-status-group {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 4px;
}
.student-sats-custom-choice,
.student-sats-custom-filter-chip,
.student-sats-custom-status-choice {
  min-height: 70px;
  border-radius: 14px;
}
.student-sats-custom-choice-button {
  appearance: none;
  width: 100%;
  cursor: pointer;
  color: var(--text-strong);
  font: inherit;
  text-align: left;
}
.student-sats-custom-filter-chip span,
.student-sats-custom-choice span,
.student-sats-custom-status-choice span {
  display: grid;
  gap: 4px;
  min-width: 0;
  word-break: normal;
  overflow-wrap: break-word;
}
.student-sats-custom-filter-chip strong,
.student-sats-custom-choice strong,
.student-sats-custom-status-choice strong,
.student-sats-custom-metrics strong,
.student-sats-custom-metrics span {
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: none;
}
.student-sats-custom-filter-chip small,
.student-sats-custom-choice small {
  display: block;
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
}
.student-sats-custom-paper-choice {
  justify-content: flex-start;
  min-width: 0;
}
.student-sats-custom-wizard .option-chip:has(input:focus-visible),
.student-sats-custom-wizard .student-sats-custom-choice-button:focus-visible,
.student-sats-custom-wizard .btn:focus-visible,
.student-sats-custom-wizard select:focus-visible,
.student-sats-custom-wizard input[type="number"]:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand-600) 48%, transparent);
  outline-offset: 2px;
}
.student-sats-custom-final-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}
.student-sats-custom-final-controls input,
.student-sats-custom-final-controls select {
  min-height: 44px;
  border-radius: 14px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  color: var(--text-strong);
  padding: 0 12px;
}
.student-sats-custom-review-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-sats-custom-review-item {
  display: grid;
  gap: 4px;
  min-width: 0;
  min-height: 64px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--line-default) 88%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg-panel) 95%, var(--bg-panel-2) 5%);
}
.student-sats-custom-review-item span {
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 760;
}
.student-sats-custom-review-item strong {
  color: var(--text-strong);
  overflow-wrap: anywhere;
}
.student-sats-custom-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.student-sats-custom-actions .btn {
  min-height: 44px;
}
.student-sats-primary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 14px;
  align-items: stretch;
}
.student-sats-primary-grid > .student-card {
  height: 100%;
}
@media (max-width: 1024px) {
  .student-sats-primary-grid,
  .student-sats-custom-tile {
    grid-template-columns: 1fr;
  }
  .student-sats-custom-tile__actions {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  }
}
.student-sats-archive-details {
  padding: 0;
  overflow: clip;
}
.student-sats-archive-summary {
  min-height: 72px;
  padding: 18px 20px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 16px;
  align-items: center;
  cursor: pointer;
  list-style: none;
}
.student-sats-archive-summary::-webkit-details-marker {
  display: none;
}
.student-sats-archive-summary:after {
  content: none;
  display: none;
}
.student-sats-archive-details[open] .student-sats-archive-summary:after {
  content: none;
}
.student-sats-archive-summary__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-sats-archive-summary__title {
  color: var(--text-strong);
  font-weight: 850;
}
.student-sats-archive-summary small {
  color: var(--text-muted);
  font-weight: 650;
}
.student-sats-archive-summary__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  min-width: 136px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  color: var(--text-strong);
  font-weight: 820;
  line-height: 1.1;
  white-space: nowrap;
}
.student-sats-archive-summary__label--hide,
.student-sats-archive-details[open] .student-sats-archive-summary__label--show {
  display: none;
}
.student-sats-archive-details[open] .student-sats-archive-summary__label--hide {
  display: inline;
}
.student-sats-archive-summary__chevron {
  font-size: 1rem;
  line-height: 1;
  transition: transform 0.16s ease;
}
.student-sats-archive-details[open] .student-sats-archive-summary__chevron {
  transform: rotate(180deg);
}
.student-sats-archive-details__body {
  display: grid;
  gap: 14px;
  padding: 0 18px 18px;
}
.student-sats-archive-filter-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 14px;
  align-items: center;
}
.student-sats-archive-filter-header h2,
.student-sats-archive-filter-header h3 {
  margin: 0;
  font-size: 1.3rem;
  line-height: 1.16;
}
.student-sats-archive-filter-header p {
  margin: 4px 0 0;
  max-width: 68ch;
}
.student-sats-custom-tile__actions {
  gap: 8px;
}
.student-sats-custom-tile__actions .btn {
  min-height: 44px;
  white-space: normal;
}
.student-sats-custom-screen-header {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding-right: 56px;
}
.student-sats-custom-screen-header .setup-close-button {
  position: absolute;
  top: 0;
  right: 0;
}
.student-sats-custom-screen-header .btn {
  min-height: 44px;
}
.student-shell--sats-custom-focus {
  --student-mobile-nav-height: 0px;
  --student-mobile-nav-gap: 0px;
}
.student-shell--sats-custom-focus .student-shell__body--compact-page {
  grid-template-columns: minmax(0, 1fr) !important;
  width: min(var(--site-width), calc(100vw - 32px));
}
.student-shell--sats-custom-focus .student-sats-custom-page {
  width: 100%;
  justify-items: stretch;
}
.student-shell--sats-custom-focus > .mp-topbar {
  position: static;
}
.student-sats-custom-screen-header h1,
.student-sats-custom-panel__head h2,
.student-sats-custom-detail-block h3 {
  margin: 0;
  line-height: 1.12;
}
.student-sats-custom-screen-header p,
.student-sats-custom-panel__head p {
  margin: 4px 0 0;
}
.student-sats-custom-wizard--screen {
  max-width: 980px;
  width: 100%;
  margin-inline: auto;
}
.student-sats-custom-steps--guided {
  grid-template-columns: repeat(6, minmax(64px, 1fr));
  gap: 6px;
}
.student-sats-custom-steps--child {
  max-width: none;
}
.student-sats-custom-steps--child li {
  grid-template-columns: auto minmax(0, 1fr);
  justify-items: stretch;
  min-height: 34px;
  padding: 5px 8px;
  border-radius: 999px;
}
.student-sats-custom-steps--child li span {
  width: 9px;
  height: 9px;
  font-size: 0;
}
.student-sats-custom-steps--child li strong {
  font-size: 0.74rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.student-sats-custom-type-grid--guided,
.student-sats-custom-pick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
  gap: 10px;
}
.student-sats-custom-choice--large,
.student-sats-custom-choice--pick,
.student-sats-custom-filter-chip--friendly {
  min-height: 78px;
  align-items: center;
}
.student-sats-custom-choice--large span,
.student-sats-custom-choice--pick span,
.student-sats-custom-filter-chip--friendly span {
  gap: 5px;
}
.student-sats-custom-choice em,
.student-sats-custom-filter-chip--friendly em {
  font-style: normal;
  color: var(--text-muted);
  font-size: 0.78rem;
  font-weight: 760;
}
.student-sats-custom-choice.is-disabled {
  opacity: 0.58;
}
.student-sats-custom-detail-block {
  display: grid;
  gap: 10px;
}
.student-sats-custom-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
}
.student-sats-custom-chip-grid--length {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
}
.student-sats-custom-advanced {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line-default);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
}
.student-sats-custom-advanced summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--text-strong);
  font-weight: 850;
}
.student-sats-custom-advanced__body,
.student-sats-custom-choice-footer,
.student-sats-custom-recovery {
  display: grid;
  gap: 10px;
}
.student-sats-custom-advanced:not([open])
  > .student-sats-custom-advanced__body {
  display: none;
}
.student-sats-custom-choice-footer {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding-top: 2px;
}
.student-sats-custom-choice-footer .btn {
  min-width: 150px;
}
.student-sats-custom-recovery .btn {
  justify-self: start;
}
.student-sats-custom-ready {
  display: grid;
  gap: 12px;
}
.student-sats-custom-ready-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, var(--brand-500)) 20%,
      var(--line-default) 80%
    );
  border-radius: 18px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, var(--brand-500)) 8%,
    var(--bg-panel) 92%
  );
}
.student-sats-custom-ready-card strong {
  color: var(--text-strong);
  font-size: 1.16rem;
  line-height: 1.16;
}
.student-sats-custom-ready-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-sats-custom-ready-list span {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line-default);
  background: var(--bg-panel);
  color: var(--text-strong);
  font-weight: 760;
}
.student-sats-custom-actions--guided {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  position: static;
  z-index: 20;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, white 18%);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  box-shadow: var(--shadow-soft);
}
.student-sats-custom-wizard--has-goal .student-sats-custom-actions--guided {
  position: sticky;
  bottom: 12px;
}
.student-sats-custom-actions--guided .btn,
.student-sats-custom-actions--guided a.btn {
  min-width: 124px;
  white-space: nowrap;
}
.student-sats-custom-next-reason {
  color: var(--text-muted);
  font-size: 0.88rem;
  font-weight: 760;
  text-align: right;
}
@media (max-width: 720px) {
  .student-sats-primary-grid {
    grid-template-columns: 1fr;
  }
  .student-sats-archive-summary {
    grid-template-columns: 1fr;
    padding: 16px;
    align-items: stretch;
  }
  .student-sats-archive-summary__button {
    width: 100%;
  }
  .student-sats-archive-filter-header,
  .student-sats-custom-screen-header {
    grid-template-columns: 1fr;
  }
  .student-sats-custom-steps--guided {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .student-sats-custom-choice-footer {
    grid-template-columns: 1fr;
  }
  .student-sats-custom-actions--guided {
    display: grid;
    grid-template-columns: 1fr;
    position: static;
    bottom: auto;
    z-index: 30;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--line-default) 82%, white 18%);
    border-radius: 18px;
    background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
    box-shadow: var(--shadow-soft);
  }
  .student-shell--sats-custom-focus
    .student-sats-custom-wizard--has-goal
    .student-sats-custom-actions--guided {
    position: sticky;
    bottom: 10px;
  }
  .student-sats-custom-actions--guided .btn,
  .student-sats-custom-actions--guided a.btn {
    width: 100%;
  }
  .student-sats-custom-next-reason {
    text-align: left;
    order: -1;
  }
  .student-sats-custom-ready-card strong {
    font-size: 1.12rem;
  }
}
html[data-appearance="dark"]
  :is(
    .student-sats-featured-card,
    .student-sats-continue-card,
    .student-sats-paper-row,
    .student-sats-custom-tile,
    .student-sats-custom-wizard,
    .student-sats-custom-review-item,
    .student-sats-entry-card,
    .student-sats-recommended-card,
    .student-sats-custom-ready-card
  ),
body.theme-dark
  :is(
    .student-sats-featured-card,
    .student-sats-continue-card,
    .student-sats-paper-row,
    .student-sats-custom-tile,
    .student-sats-custom-wizard,
    .student-sats-custom-review-item,
    .student-sats-entry-card,
    .student-sats-recommended-card,
    .student-sats-custom-ready-card
  ) {
  background: #ffffff0d;
  border-color: #ffffff1a;
}
.sats-licence-disclosure__body--modal {
  padding: 0;
}
.student-home-summary-card__row {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.student-home-summary-card__copy {
  display: grid;
  gap: 4px;
}
.student-home-summary-card__copy h1 {
  margin: 0;
  line-height: 1.02;
  font-size: clamp(1.9rem, 3.1vw, 2.35rem);
}
.student-home-summary-card__context {
  font-size: 0.92rem;
}
.student-inline-metric-strip--home-summary {
  grid-template-columns: repeat(3, minmax(132px, 1fr));
  min-width: min(100%, 460px);
  margin-top: 0;
}
.student-home-main-grid--v18-8-57,
.student-home-lower-grid--v18-8-57,
.student-competition-support-grid {
  grid-template-columns: minmax(0, 1.14fr) minmax(280px, 0.86fr);
  align-items: start;
}
.student-home-action-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.student-home-action-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, transparent);
  background: color-mix(
    in srgb,
    var(--bg-panel-2, var(--bg-panel)) 92%,
    white 8%
  );
}
.student-home-action-card--primary,
.student-live-lead-card,
.student-official-recommended-row {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 46%, var(--bg-panel) 54%),
    color-mix(in srgb, var(--bg-panel) 94%, white 6%)
  );
  border-color: color-mix(
    in srgb,
    var(--brand-600) 22%,
    var(--line-default) 78%
  );
}
.student-home-action-card__copy {
  display: grid;
  gap: 4px;
}
.student-home-action-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.student-home-side-card,
.student-home-assigned-card,
.student-live-queue-card,
.student-bookwork-list-card,
.student-progress-card--v18-8-57,
.student-history-card--v18-8-57,
.student-card--official-list {
  display: grid;
  gap: 12px;
}
.student-home-side-card .student-action-row,
.student-home-assigned-card .student-compact-row,
.student-live-queue-card .student-compact-row,
.student-bookwork-list-card .student-compact-row,
.student-progress-card--v18-8-57 .student-compact-row,
.student-history-card--v18-8-57 .student-compact-row,
.student-card--official-list .student-compact-row {
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--bg-panel-2) 6%);
}
.student-sats-archive-card .student-sats-paper-row {
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.student-shell--compact-page
  .student-section-hero__copy--action-first
  .student-identity-chips {
  margin-top: 8px;
}
.student-home-shell.student-shell--compact-page
  .student-home-main-grid--v18-8-57 {
  grid-template-columns: minmax(0, 1.22fr) minmax(320px, 0.78fr);
}
.student-home-shell.student-shell--compact-page
  .student-home-assigned-card
  .student-compact-list,
.student-home-shell.student-shell--compact-page
  .student-home-side-card
  .student-action-stack,
.student-bookwork-list-card .student-compact-list,
.student-history-card--v18-8-57 .student-compact-list,
.student-live-queue-card .student-compact-list {
  gap: 10px;
}
.student-practice-secondary-card .student-action-row,
.student-bookwork-list-card .inline-notice--soft {
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--bg-panel-2) 6%);
}
.student-empty-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid color-mix(in srgb, var(--line-default) 88%, transparent);
  border-radius: 18px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 92%, white 8%),
    color-mix(in srgb, var(--bg-panel) 98%, transparent)
  );
  box-shadow: inset 0 1px color-mix(in srgb, white 55%, transparent);
}
.student-empty-panel__copy {
  display: grid;
  gap: 6px;
}
.student-empty-panel__copy h3,
.student-empty-panel__copy p {
  margin: 0;
}
.student-empty-panel__copy h3 {
  color: var(--text-strong);
  font-size: 1.06rem;
  line-height: 1.3;
}
.student-empty-panel__copy p {
  line-height: 1.5;
}
.student-empty-panel__metrics {
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
}
.student-empty-panel__metrics .student-metric-chip {
  min-height: 0;
  padding: 12px 14px;
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--bg-panel-2) 6%);
}
.student-empty-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.student-progress-card--v18-8-57 .student-card--inner {
  padding: 0;
  border: 0;
  border-radius: 22px;
  background: transparent;
  box-shadow: none;
}
.student-progress-card--v18-8-57 .student-view-panel {
  display: grid;
  gap: 10px;
}
.student-compact-row--skill .student-compact-row__main,
.student-history-card--v18-8-57 .student-compact-row__main,
.student-bookwork-list-card .student-compact-row__main {
  gap: 6px;
}
.student-compact-row--skill .student-compact-row__meta--stack,
.student-official-pack-list .student-compact-row__meta--stack {
  align-items: flex-end;
  justify-items: stretch;
}
.student-compact-row--skill .student-compact-row__meta--stack .btn {
  min-width: 132px;
}
.student-history-card--v18-8-57 .student-compact-row__main strong,
.student-bookwork-list-card .student-compact-row__main strong {
  line-height: 1.25;
}
.student-official-pack-row__meta > .student-pill,
.student-official-pack-list .student-compact-row__meta--stack > .student-pill {
  justify-self: end;
}
.student-official-pack-list .student-compact-row__meta--stack {
  gap: 8px;
  inline-size: clamp(360px, 30vw, 468px);
  justify-content: stretch;
  grid-template-columns: minmax(0, 1fr);
}
.student-official-pack-list .student-official-actions {
  justify-self: stretch;
}
.student-official-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr));
  align-items: stretch;
  inline-size: 100%;
  gap: 8px;
}
.student-official-actions > .btn,
.student-official-actions > a,
.student-official-actions > button {
  inline-size: 100%;
  min-width: 0;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
  overflow-wrap: normal;
}
.student-official-recommended-row .student-official-actions {
  inline-size: min(100%, 520px);
}
.student-filter-field {
  display: grid;
  gap: 6px;
  color: var(--text-muted);
  font-size: 0.84rem;
  font-weight: 700;
}
.student-filter-field select {
  min-height: 44px;
  border-radius: 14px;
  border: 1px solid var(--line-default);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  color: var(--text-strong);
  padding: 0 12px;
}
html[data-appearance="dark"] .student-home-action-card,
html[data-appearance="dark"] .student-home-summary-card,
html[data-appearance="dark"] .student-live-lead-card,
html[data-appearance="dark"] .student-official-recommended-row,
html[data-appearance="dark"] .student-filter-field select,
html[data-appearance="dark"]
  .student-shell--compact-page
  > .mp-topbar:first-child
  .mp-topbar__status-chip,
body.theme-dark .student-home-action-card,
body.theme-dark .student-home-summary-card,
body.theme-dark .student-live-lead-card,
body.theme-dark .student-official-recommended-row,
body.theme-dark .student-filter-field select,
body.theme-dark
  .student-shell--compact-page
  > .mp-topbar:first-child
  .mp-topbar__status-chip {
  background: #ffffff0f;
  border-color: #ffffff1f;
}
@media (max-width: 1180px) {
  .student-shell--compact-page .student-page-content {
    width: 100%;
    max-width: none;
    justify-self: stretch;
  }
  .student-shell--compact-page .student-game-hub-stack,
  .student-shell--compact-page .student-game-hub-page,
  .student-shell--compact-page .student-home-page--v18-8-57,
  .student-shell--compact-page .student-competition-page--v18-8-57 {
    max-width: none;
  }
}
@media (max-width: 1080px) {
  .student-section-hero__header,
  .student-home-summary-card__row,
  .student-home-main-grid--v18-8-57,
  .student-home-lower-grid--v18-8-57,
  .student-home-action-grid,
  .student-competition-support-grid,
  .student-official-filter-toolbar,
  .student-sats-featured-card,
  .student-sats-continue-card,
  .student-sats-paper-row,
  .student-sats-custom-tile,
  .student-sats-entry__choices,
  .student-sats-recommended-card,
  .student-sats-full-papers-header {
    grid-template-columns: 1fr;
  }
  .student-section-hero__actions-row--header {
    justify-content: flex-start;
  }
  .student-sats-hub__utility {
    grid-template-columns: 1fr;
  }
  .student-sats-hub__utility-action {
    justify-content: flex-start;
  }
  .student-sats-custom-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .student-shell--compact-page
    > .mp-topbar:first-child
    .mp-topbar__status-chip {
    min-width: min(160px, 32vw);
  }
  .student-shell__body--compact-page {
    padding-top: 12px;
  }
  .student-shell--compact-page .student-section-hero--action-first,
  .student-shell--compact-page .student-card--compact {
    border-radius: 22px;
  }
  .student-inline-metric-strip--home-summary,
  .student-section-hero__metrics--status-row {
    min-width: 0;
  }
}
@media (max-width: 720px) {
  .student-shell--compact-page
    > .mp-topbar:first-child
    .mp-topbar__status-strip {
    gap: 6px;
  }
  .student-shell--compact-page .student-section-hero__copy--action-first h1 {
    font-size: clamp(1.5rem, 7vw, 1.9rem);
  }
  .student-shell--compact-page .student-section-hero__actions-row--header,
  .student-shell--compact-page .student-section-hero__actions-row--header .btn,
  .student-shell--compact-page .student-action-row--hero .button-row,
  .student-shell--compact-page .student-action-row--hero .button-row .btn {
    width: 100%;
  }
  .student-inline-metric-strip--home-summary,
  .student-section-hero__metrics--status-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-home-action-card__footer .btn,
  .student-official-filter-toolbar select,
  .student-compact-row--skill .student-compact-row__meta--stack .btn,
  .student-empty-panel__actions .btn {
    width: 100%;
  }
  .student-sats-paper-row__actions {
    inline-size: 100%;
  }
  .student-sats-section-header__actions {
    width: 100%;
    justify-content: flex-start;
  }
  .student-sats-archive-utilities {
    justify-content: flex-start;
  }
  .student-sats-archive-completed-summary {
    justify-content: flex-start;
  }
  .student-sats-entry-card .btn,
  .student-sats-recommended-card__actions > .btn,
  .student-sats-recommended-card__actions > a {
    width: 100%;
  }
  .student-sats-resource-buttons,
  .student-sats-custom-type-grid,
  .student-sats-custom-paper-row,
  .student-sats-custom-status-group,
  .student-sats-custom-final-controls,
  .student-sats-custom-review-grid {
    grid-template-columns: 1fr;
  }
  .student-sats-custom-actions {
    justify-content: stretch;
  }
  .student-sats-custom-actions .btn,
  .student-sats-custom-tile__actions .btn {
    width: 100%;
  }
  .student-official-pack-list .student-compact-row__meta--stack,
  .student-official-recommended-row .student-official-actions {
    inline-size: 100%;
    justify-items: stretch;
  }
  .student-official-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 640px) {
  .student-shell--compact-page .student-section-hero__metrics--status-row {
    display: none;
  }
  .student-shell--compact-page .student-section-hero__copy--action-first p,
  .student-shell--compact-page .student-section-hero__meta-line {
    font-size: 0.84rem;
  }
}
@media (max-width: 560px) {
  .student-shell--compact-page .student-card--compact,
  .student-shell--compact-page .student-section-hero--action-first {
    padding: 12px;
    border-radius: 20px;
  }
  .student-sats-featured-card,
  .student-sats-continue-card {
    gap: 12px;
  }
  .student-sats-custom-steps,
  .student-sats-custom-metrics,
  .student-inline-metric-strip--home-summary,
  .student-section-hero__metrics--status-row,
  .student-sats-hub__metrics {
    grid-template-columns: 1fr;
  }
}
.visual-card--image-overlay {
  padding: clamp(12px, 1.2vw, 18px);
}
.image-overlay {
  width: min(100%, 940px);
}
.image-overlay__image {
  max-height: min(78dvh, 920px);
  object-fit: contain;
}
.image-overlay__connections {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}
.image-overlay__connection-line {
  fill: none;
  stroke: #2563ebeb;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.image-overlay__connection-line--closed {
  fill: none;
}
.image-overlay__connection-fill {
  fill: #3b82f624;
  stroke: none;
}
.image-overlay__connection-point {
  fill: #2563ebf5;
  stroke: #fff;
  stroke-width: 0.35;
}
.image-overlay__input--multiline {
  resize: none;
  width: 100%;
  padding: 8px 10px;
  padding-inline: 10px;
  padding-block: 8px;
  margin-inline: 0;
  border-color: transparent;
  border-radius: 4px;
  background: #ffffff14;
  text-align: left;
  line-height: 1.25;
  font-weight: 500;
}
@media (pointer: coarse) {
  .image-overlay__target--checkbox::before,
  .image-overlay__target--circle::after,
  .image-overlay__coordinate-hit-zone::before {
    width: max(100%, 44px);
    height: max(100%, 44px);
  }
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
.runner-question-card-v2.runner-question-panel--mode-selection-grid {
  --runner-content-stage-max: 1160px;
}
.runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame {
  --runner-visual-max-h: min(62dvh, 720px);
}
.runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid {
  --runner-visual-max-h: min(68dvh, 760px);
}
@media (max-width: 1100px) {
  .image-overlay {
    width: min(100%, 920px);
  }
  .image-overlay__image {
    max-height: min(68dvh, 780px);
  }
}
.image-overlay__input::placeholder {
  color: #0f172a8c;
  font-weight: 600;
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-body-v2,
.runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-stage-v2 {
  gap: 12px;
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-visual-panel-v2 {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 6px 0 0;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-visual-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-visual-panel-v2 {
  min-height: 0;
  padding-top: 2px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image {
  min-height: 0;
  height: auto;
  gap: 6px;
  padding: 8px 10px 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-visual-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-visual-panel-v2 {
  min-height: 0;
  max-height: none;
  padding: 0;
  align-content: start;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-body-v2,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-body-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-stage-v2 {
  gap: 6px;
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .visual-card--image-overlay {
  width: 100%;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  border: 0;
  box-shadow: none;
  border-radius: 18px;
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__image {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: var(--runner-visual-max-h, none);
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input {
  border-radius: 3px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  line-height: normal;
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input:focus {
  border-color: #2563eb9e;
  background: #ffffffc2;
  box-shadow:
    inset 0 0 0 1px #2563eb14,
    0 0 0 1px #ffffff80;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input {
  min-height: 0;
  padding: 0 3px;
  padding-inline: 3px;
  padding-block: 0;
  font-size: clamp(9px, 2.55vw, 12px);
  line-height: normal;
  border-width: 1px;
  border-radius: 3px;
  border-color: #2563eb1f;
  background: transparent;
  box-shadow: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input:not(:focus),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input:not(:focus) {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input:focus,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input:focus {
  border-color: #2563eb9e;
  background: #ffffffc2;
  box-shadow:
    inset 0 0 0 1px #2563eb14,
    0 0 0 1px #ffffff80;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  textarea.image-overlay__input,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  textarea.image-overlay__input {
  padding: 6px 8px;
  font-size: clamp(10px, 2.7vw, 13px);
  line-height: 1.2;
  text-align: left;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--compact,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--compact {
  font-size: clamp(8px, 2.3vw, 11px);
  padding-inline: 2px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--micro,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--micro {
  font-size: clamp(7px, 1.95vw, 10px);
  padding-inline: 1px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--large,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--large {
  font-size: clamp(12px, 3.05vw, 17px);
  line-height: 1.08;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--line,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__input--line {
  border-width: 0 0 2px 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding-inline: 1px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--checkbox
  .image-overlay__target-core,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--checkbox
  .image-overlay__target-core {
  inset: 8%;
  border-width: 1.5px;
  border-radius: 3px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--checkbox.is-selected
  .image-overlay__target-core:after,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--checkbox.is-selected
  .image-overlay__target-core:after {
  border-right-width: 2px;
  border-bottom-width: 2px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle
  .image-overlay__target-core,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle
  .image-overlay__target-core {
  inset: 14%;
  border-width: 1.5px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__hotspot--circle,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__hotspot--circle {
  min-width: clamp(44px, 9vw, 60px);
  min-height: clamp(44px, 9vw, 60px);
  touch-action: manipulation;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle-choice,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle-choice {
  --mp-official-sats-circle-hitbox-size: clamp(64px, 11vw, 88px);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle-choice:after,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__target--circle-choice:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(100%, var(--mp-official-sats-circle-hitbox-size));
  height: max(100%, var(--mp-official-sats-circle-hitbox-size));
  transform: translate(-50%, -50%);
  border-radius: 16px;
  background: transparent;
  pointer-events: auto;
}
@media (hover: none), (pointer: coarse) {
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--official-sats-image
    .image-overlay__target--circle-choice,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--official-sats-image
    .image-overlay__target--circle-choice {
    --mp-official-sats-circle-hitbox-size: clamp(64px, 11vw, 88px);
  }
  .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--official-sats-image
    .image-overlay__target--circle-choice:after,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-question-card-v2.runner-question-panel--official-sats-image
    .image-overlay__target--circle-choice:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: max(100%, var(--mp-official-sats-circle-hitbox-size));
    height: max(100%, var(--mp-official-sats-circle-hitbox-size));
    transform: translate(-50%, -50%);
    border-radius: 16px;
    background: transparent;
    pointer-events: auto;
  }
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__match-node-core,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__match-node-core {
  border-width: 1.5px;
  border-radius: 3px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__match-node-core:after,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .image-overlay__match-node-core:after {
  width: 6px;
  height: 6px;
  border-width: 1.25px;
  box-shadow: none;
}
body.portal-student {
  --student-dashboard-content-max: 1288px;
  --student-nav-collapsed-width: 84px;
}
.student-shell__body,
.student-shell__body--with-nav {
  width: min(100%, var(--site-width));
  box-sizing: border-box;
}
.student-side-nav__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
}
.student-side-nav__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.student-shell:not(.student-shell--runner-shell) .student-page-content {
  width: 100%;
  max-width: var(--student-dashboard-content-max);
  min-width: 0;
}
.student-shell--compact-page .student-page-content {
  max-width: none;
  justify-self: stretch;
}
.student-shell__body--with-nav .student-page-content {
  justify-self: stretch;
  min-width: 0;
}
.student-game-hub-page,
.student-game-hub-stack,
.student-home-page--v18-8-57,
.student-competition-page--v18-8-57,
.student-home-main-grid--v18-8-57,
.student-home-lower-grid--v18-8-57,
.student-home-action-grid,
.student-home-console-grid,
.student-competition-support-grid,
.student-sudoku-main-grid,
.student-sudoku-main-grid--focus,
.student-sudoku-board-shell,
.student-sudoku-console--play,
.student-sudoku-page--play,
.student-page-content--sudoku-focus {
  min-width: 0;
  width: 100%;
}
.student-game-hub-stack {
  max-width: none;
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__status-chip {
  min-width: min(176px, 20vw);
  min-height: 62px;
}
.student-shell--compact-page > .mp-topbar:first-child .mp-topbar__status-copy {
  gap: 2px;
}
.student-home-shell.student-shell--compact-page
  .student-home-summary-card__row {
  gap: 12px;
}
.student-home-shell.student-shell--compact-page
  .student-home-summary-card__copy {
  gap: 2px;
}
.student-home-shell.student-shell--compact-page
  .student-home-summary-card__copy
  h1 {
  font-size: clamp(1.76rem, 2.9vw, 2.28rem);
}
.student-home-shell.student-shell--compact-page
  .student-inline-metric-strip--home-summary {
  min-width: min(100%, 420px);
  gap: 10px;
}
.student-home-shell.student-shell--compact-page
  .student-home-main-grid--v18-8-57,
.student-home-shell.student-shell--compact-page
  .student-home-lower-grid--v18-8-57 {
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
}
.student-home-page--game-dashboard {
  gap: 10px;
}
.student-home-page--game-dashboard .student-section-hero--action-first {
  gap: 8px;
  padding: 12px 14px;
}
.student-home-page--game-dashboard .student-section-hero__main--action-first,
.student-home-page--game-dashboard .student-section-hero__header,
.student-home-page--game-dashboard .student-section-hero__copy--action-first {
  gap: 8px;
}
.student-home-page--game-dashboard .student-section-hero__copy--action-first p {
  max-width: 28ch;
}
.student-home-page--game-dashboard .student-section-hero__metrics--status-row {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
}
.student-home-page--game-dashboard
  .student-section-hero__primary-action
  .student-home-mission__card {
  min-height: 0;
  gap: 10px;
  padding: 12px 14px;
}
.student-home-page--game-dashboard .student-home-mission__copy {
  gap: 4px;
}
.student-home-page--game-dashboard .student-home-mission__chips {
  display: none;
}
.student-home-console-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(340px, 0.86fr);
  gap: 12px;
  align-items: start;
}
.student-home-console-side {
  display: grid;
  gap: 12px;
}
.student-home-console-card {
  gap: 10px;
}
.student-home-console-card .section-header {
  margin-bottom: 0;
  align-items: start;
  gap: 8px;
}
.student-home-start-card .student-practice-start-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: 12px;
}
.student-home-start-card .student-practice-start-card {
  min-height: 120px;
  padding: 14px;
  gap: 8px;
  border-radius: 18px;
  border-color: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 18%,
    rgba(34, 48, 71, 0.22) 82%
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, white 95%, var(--practice-accent, #5d8ef7) 5%),
    color-mix(in srgb, white 86%, var(--practice-accent, #5d8ef7) 14%)
  );
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 42%, transparent),
    0 0 0 1px #22304714,
    0 8px 18px
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 6%, transparent);
}
.student-home-start-card .student-practice-start-card:before {
  inset: 8px auto auto 8px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
}
.student-home-start-card .student-practice-start-card:after {
  width: 68px;
  height: 68px;
  inset: auto -12px -12px auto;
}
.student-home-start-card .student-practice-start-card__visual {
  transform: scale(0.9);
}
.student-home-start-card .student-practice-start-card__title {
  font-size: 0.98rem;
}
.student-home-start-card .student-practice-start-card__detail {
  display: block;
  max-width: none;
}
.student-avatar-option__meta,
.student-profile-hero__copy [data-profile-selected-descriptor] {
  display: none;
}
.student-home-overview-card .student-compact-list {
  gap: 8px;
}
.student-home-overview-card .student-compact-row {
  padding: 10px 12px;
}
.student-home-task-note {
  margin: 0;
  max-width: 46ch;
  font-size: 0.9rem;
  line-height: 1.4;
}
.student-home-overview-links {
  display: grid;
  gap: 8px;
}
.student-home-overview-card .student-home-quick-links {
  margin-top: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.student-home-overview-card .student-home-quick-link {
  justify-content: flex-start;
  min-height: 42px;
  padding: 9px 10px;
  border-radius: 16px;
  border: 1px solid rgba(31, 47, 82, 0.08);
  background: #ffffffb3;
  box-shadow: none;
}
.student-home-overview-card .student-home-quick-link--primary {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 16%,
    rgba(31, 47, 82, 0.1)
  );
  background: linear-gradient(
    180deg,
    #ffffffd6,
    color-mix(in srgb, white 84%, var(--student-theme-secondary, #dce6ff) 16%)
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card {
  border-color: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 26%,
    var(--student-theme-dark-border, rgba(188, 198, 230, 0.18)) 74%
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 14%, transparent),
      transparent 52%
    ),
    linear-gradient(
      160deg,
      var(--student-theme-dark-surface),
      var(--student-theme-dark-surface-soft)
    );
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 10%, transparent),
    0 12px 28px
      color-mix(
        in srgb,
        rgba(0, 0, 0, 0.24) 54%,
        var(--practice-accent, #5d8ef7) 46%
      );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:before,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:before,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:before {
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      var(--practice-accent, #5d8ef7) 28%,
      rgba(255, 255, 255, 0.14)
    ),
    transparent
  );
  opacity: 0.82;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:after,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:after,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:after {
  opacity: 0.42;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:is(:hover, :focus-visible),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:is(:hover, :focus-visible),
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:is(:hover, :focus-visible) {
  border-color: color-mix(
    in srgb,
    var(--practice-accent, #5d8ef7) 44%,
    rgba(230, 236, 255, 0.42)
  );
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 14%, transparent),
    0 18px 34px
      color-mix(
        in srgb,
        rgba(0, 0, 0, 0.28) 42%,
        var(--practice-accent, #5d8ef7) 58%
      );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card__cta,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card__cta,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card__cta {
  border-color: color-mix(
    in srgb,
    var(--practice-accent-strong, #2f5fe6) 38%,
    rgba(255, 255, 255, 0.18)
  );
  background: color-mix(
    in srgb,
    rgba(10, 16, 30, 0.88) 76%,
    var(--practice-accent, #5d8ef7) 24%
  );
  color: color-mix(
    in srgb,
    white 82%,
    var(--practice-accent-strong, #2f5fe6) 18%
  );
  box-shadow: 0 8px 18px
    color-mix(
      in srgb,
      rgba(0, 0, 0, 0.18) 58%,
      var(--practice-accent, #5d8ef7) 42%
    );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:is(:hover, :focus-visible)
  .student-practice-start-card__cta,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:is(:hover, :focus-visible)
  .student-practice-start-card__cta,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-start-card
  .student-practice-start-card:is(:hover, :focus-visible)
  .student-practice-start-card__cta {
  background: color-mix(
    in srgb,
    rgba(10, 16, 30, 0.8) 68%,
    var(--practice-accent, #5d8ef7) 32%
  );
}
.student-shell__body.student-nav-collapsed,
.student-shell__body--with-nav.student-nav-collapsed {
  grid-template-columns: var(--student-nav-collapsed-width) minmax(0, 1fr);
}
.student-shell__body.student-nav-collapsed .student-side-nav,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav {
  width: var(--student-nav-collapsed-width);
}
.student-shell__body.student-nav-collapsed .student-side-nav__icon-wrap,
.student-shell__body--with-nav.student-nav-collapsed
  .student-side-nav__icon-wrap {
  display: inline-flex !important;
  margin-inline: auto;
}
.student-shell__body.student-nav-collapsed .student-side-nav__label,
.student-shell__body.student-nav-collapsed .student-side-nav__section-label,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav__label,
.student-shell__body--with-nav.student-nav-collapsed
  .student-side-nav__section-label {
  display: none;
}
.student-shell__body.student-nav-collapsed .student-side-nav__section,
.student-shell__body--with-nav.student-nav-collapsed
  .student-side-nav__section {
  gap: 8px;
}
.student-shell__body.student-nav-collapsed .student-side-nav__link,
.student-shell__body--with-nav.student-nav-collapsed .student-side-nav__link {
  gap: 0;
  padding-inline: 0;
}
@media (max-width: 1180px) {
  .student-shell:not(.student-shell--runner-shell) .student-page-content {
    width: 100%;
  }
  .student-home-console-grid,
  .student-home-shell.student-shell--compact-page
    .student-home-main-grid--v18-8-57,
  .student-home-shell.student-shell--compact-page
    .student-home-lower-grid--v18-8-57 {
    grid-template-columns: 1fr;
  }
  .student-shell--compact-page
    > .mp-topbar:first-child
    .mp-topbar__status-chip {
    min-width: min(164px, 34vw);
  }
}
@media (min-width: 961px) and (max-width: 1180px) {
  .mp-topbar--student-dashboard .mp-topbar__inner,
  .student-shell--compact-page > .mp-topbar:first-child .mp-topbar__inner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "left center right";
    align-items: center;
    row-gap: 0;
    column-gap: 10px;
  }
  .mp-topbar--student-dashboard .mp-topbar__left,
  .mp-topbar--student-dashboard .mp-topbar__center,
  .mp-topbar--student-dashboard .mp-topbar__right {
    justify-content: flex-start;
    align-self: center;
  }
  .mp-topbar--student-dashboard .mp-topbar__center {
    width: 100%;
    min-width: 0;
  }
  .mp-topbar--student-dashboard .mp-topbar__right,
  .mp-topbar--student-dashboard .mp-topbar__right--signed-in,
  .mp-topbar--student-dashboard .mp-topbar__right--signed-out {
    width: auto;
    min-height: auto;
    justify-self: end;
    justify-content: flex-end;
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: nowrap;
  }
  .mp-topbar--student-dashboard .mp-topbar__utility-pill,
  .mp-topbar--student-dashboard
    .mp-topbar__right--signed-in
    .mp-topbar__utility-pill,
  .mp-topbar--student-dashboard
    .mp-topbar__right--signed-out
    .mp-topbar__utility-pill {
    width: auto;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 0;
  }
  .mp-topbar--student-dashboard .mp-topbar__status-strip {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: nowrap;
  }
  .student-shell--compact-page
    > .mp-topbar:first-child
    .mp-topbar__status-chip {
    min-width: min(150px, 19vw);
  }
}
@media (max-width: 860px) {
  .student-home-shell.student-shell--compact-page
    .student-home-summary-card__row {
    grid-template-columns: 1fr;
  }
  .student-home-page--game-dashboard
    .student-section-hero__metrics--status-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-home-shell.student-shell--compact-page
    .student-inline-metric-strip--home-summary {
    min-width: 0;
  }
  .student-shell--compact-page
    > .mp-topbar:first-child
    .mp-topbar__status-chip {
    min-width: max-content;
    min-height: 0;
  }
}
@media (max-width: 640px) {
  .student-home-page--game-dashboard
    .student-section-hero__metrics--status-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-home-page--game-dashboard
    .student-section-hero__copy--action-first
    p,
  .student-home-page--game-dashboard .student-home-mission__copy .muted {
    display: none;
  }
  .student-home-start-card .student-practice-start-card {
    min-height: 88px;
    padding: 10px 8px;
  }
  .student-home-start-card .student-practice-start-card__title {
    font-size: 0.84rem;
  }
  .student-home-start-card.student-game-hub-card
    .student-practice-start-grid
    .student-practice-start-card__detail {
    display: none !important;
  }
}
@media (max-width: 560px) {
  .student-home-overview-card .student-home-quick-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-home-start-card .student-practice-start-grid {
    gap: 6px;
  }
  .student-home-start-card .student-practice-start-card {
    min-height: 76px;
    border-radius: 16px;
  }
  .student-home-start-card .student-practice-start-card__visual {
    transform: scale(0.74);
  }
}
@media (min-width: 1181px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    ) {
    --runner-shell-max-width: 1720px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
    gap: 16px;
    align-items: stretch;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2 {
    top: 88px;
    gap: 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--prompt-equation-only
    .runner-prompt__main {
    font-size: clamp(2.4rem, 4vw, 4rem);
    line-height: 1.04;
    text-align: center;
    letter-spacing: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2 {
    gap: 8px;
    padding: 10px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .runner-keyboard,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .runner-keyboard-row,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-actions-v2__group--support {
    gap: 6px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-actions-v2
    .btn {
    min-height: 46px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn {
    font-size: 1.06rem;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn[data-runner-key="enter"],
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-command-button-v2 {
    min-height: 50px;
    font-size: 1rem;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2
    .runner-answer-panel-v2 {
    gap: 8px;
    padding-top: 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2
    .runner-answer-stage-v2 {
    width: 100%;
    max-width: 100%;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-answer-panel-v2--structured-multi-part
    .multi-field-grid.three,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-answer-panel-v2--multi-box
    .multi-field-grid.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-answer-panel-v2--structured-multi-part
    .multi-field-grid
    label,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-answer-panel-v2--multi-box
    .multi-field-grid
    label {
    font-size: 0.95rem;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    :is(
      .runner-question-panel--mode-diagram-fixed-frame,
      .runner-question-panel--choice,
      .runner-question-panel--shape-choice,
      .runner-question-panel--mode-selection-grid,
      .runner-question-panel--coordinate-grid,
      .runner-question-panel--transformation-grid
    )
    .runner-visual-panel-v2 {
    align-content: start;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 4px 0 0;
  }
}
.homepage-hero--landing {
  gap: clamp(1.3rem, 2.4vw, 2.3rem);
  background:
    radial-gradient(
      circle at top left,
      color-mix(in srgb, var(--brand-100) 36%, transparent),
      transparent 40%
    ),
    radial-gradient(
      circle at bottom right,
      color-mix(in srgb, var(--accent-teal) 10%, transparent),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 97%, white 3%),
      color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
    );
}
.homepage-hero__copy--landing {
  display: grid;
  gap: 1rem;
}
.homepage-hero__copy--landing h1 {
  max-width: 12.8ch;
}
.homepage-hero__sub--landing {
  max-width: 33ch;
}
.homepage-proof-pill {
  background: color-mix(in srgb, var(--bg-panel) 84%, white 16%);
  box-shadow: 0 8px 18px #0f172a0f;
}
.landing-showcase {
  display: grid;
  gap: 1rem;
  align-content: start;
}
.landing-showcase__stage {
  display: grid;
  gap: 0.95rem;
}
.landing-showcase__frame,
.landing-showcase__mini {
  display: grid;
  gap: 0.85rem;
  margin: 0;
  padding: 0.95rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, white 16%);
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
  box-shadow: 0 18px 40px #0f172a14;
}
.landing-showcase__frame--primary {
  min-height: 100%;
}
.landing-showcase__frame img,
.landing-showcase__mini img {
  width: 100%;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, white 28%);
  background: color-mix(in srgb, var(--bg-panel-2) 82%, white 18%);
}
.landing-showcase__frame--primary img {
  min-height: 260px;
  object-fit: cover;
  object-position: center top;
}
.landing-showcase__mini img {
  min-height: 152px;
  object-fit: cover;
}
.landing-showcase__stack {
  display: grid;
  gap: 0.95rem;
}
.landing-showcase__frame-meta {
  display: grid;
  gap: 0.18rem;
}
.landing-showcase__frame-meta strong {
  font-size: 0.98rem;
  line-height: 1.28;
  color: var(--text-strong);
}
.landing-showcase__eyebrow {
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-muted) 92%, transparent);
}
.landing-showcase__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.landing-showcase__chip {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0.45rem 0.8rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-100) 24%, white 76%);
  color: var(--text-strong);
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, white 28%);
  font-size: 0.84rem;
  font-weight: 700;
}
.homepage-section--proof {
  gap: 1.25rem;
}
.landing-proof-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.landing-proof-card {
  display: grid;
  gap: 0.9rem;
  padding: 1rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, white 16%);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  box-shadow: 0 14px 34px #0f172a0f;
}
.landing-proof-card--wide {
  grid-column: span 2;
}
.landing-proof-card__media {
  margin: 0;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, white 28%);
  background: color-mix(in srgb, var(--bg-panel-2) 84%, white 16%);
  aspect-ratio: 16 / 9;
}
.landing-proof-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}
.landing-proof-card__copy {
  display: grid;
  gap: 0.45rem;
}
.landing-proof-card__copy h3 {
  margin: 0;
  font-size: clamp(1.05rem, 1.4vw, 1.28rem);
  line-height: 1.2;
}
.landing-proof-card__copy p {
  margin: 0;
  color: var(--text-body);
  line-height: 1.58;
}
.homepage-section--landing {
  gap: 1.15rem;
}
.homepage-journey-card--route .btn {
  margin-top: auto;
}
.auth-panel__inner--tabbed > .auth-tab-panel {
  display: grid;
  gap: 0.9rem;
  align-content: start;
}
.auth-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
}
.auth-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.3rem 0.62rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 80%, white 20%);
  background: color-mix(in srgb, var(--brand-100) 18%, white 82%);
  color: var(--text-strong);
  font-size: 0.79rem;
  font-weight: 720;
}
.auth-support-card {
  display: grid;
  gap: 0.32rem;
  padding: 0.82rem 0.9rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 80%, white 20%);
  background: color-mix(in srgb, var(--bg-panel) 86%, white 14%);
}
.auth-support-card strong,
.auth-support-card p {
  margin: 0;
}
.auth-support-card p {
  color: var(--text-body);
  font-size: 0.94rem;
  line-height: 1.52;
}
.auth-support-card .auth-inline-link {
  justify-self: start;
  font-size: 0.94rem;
}
.auth-split--tabbed .auth-aside-panel {
  gap: 0.72rem;
}
.auth-illustration--product {
  width: min(100%, 420px);
  max-height: 220px;
  min-height: 148px;
  object-fit: contain;
  object-position: center;
}
.auth-illustration--public-signin {
  width: min(100%, 250px);
  min-height: 0;
  height: auto;
  max-height: 150px;
}
.auth-aside-copy {
  display: grid;
  gap: 0.35rem;
}
.auth-aside-highlights {
  display: grid;
  gap: 0.55rem;
}
.auth-aside-highlight {
  display: grid;
  gap: 0.18rem;
  padding: 0.72rem 0.8rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, white 18%);
  background: color-mix(in srgb, var(--bg-panel) 90%, white 10%);
}
.auth-aside-highlight__title,
.auth-aside-highlight__body {
  margin: 0;
}
.auth-aside-highlight__title {
  color: var(--text-strong);
  font-size: 0.92rem;
  line-height: 1.28;
}
.auth-aside-highlight__body {
  color: var(--text-body);
  font-size: 0.87rem;
  line-height: 1.48;
}
.auth-point {
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
}
@media (min-width: 900px) {
  .landing-showcase__stage {
    grid-template-columns: minmax(0, 1.06fr) minmax(200px, 0.74fr);
    align-items: stretch;
  }
}
@media (max-width: 980px) {
  .landing-proof-grid {
    grid-template-columns: 1fr;
  }
  .landing-proof-card--wide {
    grid-column: auto;
  }
}
@media (max-width: 780px) {
  .landing-showcase__stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .landing-showcase__stack {
    grid-template-columns: 1fr;
  }
  .landing-showcase__frame,
  .landing-showcase__mini,
  .landing-proof-card {
    padding: 0.85rem;
    border-radius: 20px;
  }
  .landing-showcase__frame--primary img {
    min-height: 210px;
  }
  .auth-support-card {
    padding: 0.9rem;
  }
}
body.portal-public {
  --accent-teal: #cadcd6;
  background:
    radial-gradient(
      circle at top left,
      color-mix(in srgb, var(--brand-100) 72%, white 28%),
      transparent 28%
    ),
    radial-gradient(
      circle at top right,
      color-mix(in srgb, #efe5d3 78%, white 22%),
      transparent 24%
    ),
    linear-gradient(180deg, #f7f1e7, #f3ecdf 34%, #f6f2ea);
}
body.portal-public:before {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.44),
      rgba(255, 255, 255, 0.08) 24%,
      transparent 48%
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.22),
      rgba(255, 255, 255, 0.22) 1px,
      transparent 1px,
      transparent 140px
    );
  opacity: 0.86;
}
body.portal-public:after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(
      circle at 18% 24%,
      rgba(255, 255, 255, 0.62),
      transparent 0 22%
    ),
    radial-gradient(
      circle at 84% 14%,
      rgba(230, 219, 198, 0.42),
      transparent 0 18%
    );
}
.portal-public .public-shell {
  gap: clamp(1.4rem, 2.6vw, 2.6rem);
}
body.portal-public--auth .public-shell {
  --public-shell-max: var(--site-max);
  gap: clamp(0.95rem, 1.6vw, 1.25rem);
  align-content: start;
}
body.portal-public--auth .public-shell--auth {
  min-height: 0;
}
body.portal-public--auth .page-shell,
body.portal-public--auth .public-shell {
  padding-block: 10px 16px;
}
body.portal-public--auth .auth-split--public-auth {
  gap: clamp(0.85rem, 1.4vw, 1.1rem);
}
.portal-public .mp-topbar--public-home .mp-topbar__inner {
  min-height: 72px;
  padding: 8px 12px;
  border-radius: 30px;
  border: 1px solid rgba(71, 82, 107, 0.12);
  background: #fffcf7b8;
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 48px #1f253417;
}
.portal-public .mp-topbar--public-home .mp-topbar__utility-pill {
  padding: 5px;
  border-radius: 999px;
  background: #fffbf4c7;
  border: 1px solid rgba(71, 82, 107, 0.12);
}
.portal-public .mp-topbar--public-home .mp-public-auth-actions {
  gap: 0.55rem;
}
.portal-public
  .mp-topbar--public-home
  .mp-public-auth-actions
  .mp-inline-link--button {
  min-height: 46px;
  padding-inline: 1.1rem;
  border-radius: 999px;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  font-weight: 760;
}
.portal-public
  .mp-topbar--public-home
  .mp-public-auth-actions
  .mp-inline-link--strong {
  background: linear-gradient(180deg, #fffffff0, #faf5eceb);
  border-color: #3f5ea32e;
  box-shadow: 0 10px 24px #1f253414;
}
.portal-public .mp-topbar--public-auth .mp-topbar__inner {
  min-height: 68px;
  padding: 7px 12px;
  border-radius: 28px;
  box-shadow: 0 14px 34px #1f253412;
}
.portal-public .mp-topbar--public-auth .mp-topbar__utility-pill {
  padding: 4px;
  background: #fffbf4bd;
}
.portal-public .mp-topbar--public-auth .mp-public-auth-actions {
  gap: 0.42rem;
}
.portal-public
  .mp-topbar--public-auth
  .mp-public-auth-actions
  .mp-inline-link--button {
  min-height: 42px;
  padding-inline: 0.98rem;
  font-size: 0.98rem;
  font-weight: 720;
}
.portal-public
  .mp-topbar--public-auth
  .mp-public-auth-actions
  .mp-inline-link--strong {
  background: #fffbf5d6;
  border-color: #47526b24;
  box-shadow: none;
}
.portal-public .homepage-shell--v18-6-14 {
  --public-shell-max: 1480px;
  gap: clamp(1.8rem, 3vw, 3.25rem);
  padding-top: 12px;
}
.portal-public .homepage-hero--landing {
  position: relative;
  isolation: isolate;
  padding: clamp(2.2rem, 4vw, 3.4rem);
  border-radius: 44px;
  border: 1px solid rgba(71, 82, 107, 0.12);
  background:
    linear-gradient(140deg, #fffcf7f0, #f7f1e7eb 48%, #f4eee3f5),
    linear-gradient(180deg, #ffffff6b, #fff0);
  box-shadow: 0 28px 64px #1f25341a;
}
.portal-public .homepage-hero--landing:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(
      circle at 18% 18%,
      rgba(255, 255, 255, 0.56),
      transparent 0 24%
    ),
    radial-gradient(
      circle at 78% 86%,
      rgba(210, 224, 216, 0.18),
      transparent 0 26%
    );
  z-index: -1;
}
.portal-public .homepage-hero__copy--landing {
  max-width: 43rem;
  gap: 1.15rem;
}
.portal-public .homepage-hero__copy--landing h1 {
  max-width: 9.1ch;
  font-size: clamp(4.15rem, 6.8vw, 6.95rem);
  line-height: 0.91;
  letter-spacing: -0.07em;
}
.portal-public .homepage-hero__sub--landing {
  max-width: 35ch;
  font-size: clamp(1.1rem, 1.45vw, 1.28rem);
  line-height: 1.54;
  color: color-mix(in srgb, var(--text-strong) 80%, white 20%);
}
.landing-hero-note {
  margin: 0;
  max-width: 40ch;
  font-size: 0.96rem;
  line-height: 1.6;
  color: color-mix(in srgb, var(--text-body) 88%, white 12%);
}
.portal-public .homepage-hero__actions--landing {
  gap: 0.9rem;
}
.portal-public .homepage-btn--primary {
  background: linear-gradient(180deg, #314569, #253653);
  box-shadow: 0 16px 30px #25365338;
}
.portal-public .homepage-btn--secondary {
  background: #fffbf5ad;
  border-color: #47526b1f;
  box-shadow: inset 0 1px #ffffffc7;
}
.landing-hero-rail {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  max-width: min(100%, 58rem);
  margin-top: 0.25rem;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid rgba(71, 82, 107, 0.12);
  background: #47526b14;
}
.landing-hero-rail__item {
  display: grid;
  gap: 0.3rem;
  padding: 1rem 1.1rem 1.1rem;
  background: #fffbf5bd;
}
.landing-hero-rail__label {
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 82%, white 18%);
}
.landing-hero-rail__value {
  font-size: 1.02rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.landing-hero-rail__item p {
  margin: 0;
  color: var(--text-body);
  line-height: 1.45;
  font-size: 0.91rem;
}
.portal-public .landing-showcase {
  gap: 1.15rem;
}
.portal-public .landing-showcase__frame,
.portal-public .landing-showcase__mini {
  padding: 1rem;
  border-radius: 30px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: linear-gradient(180deg, #fffefbe0, #f8f3eaeb);
  box-shadow: 0 20px 48px #1f25341a;
}
.portal-public .landing-showcase__frame img,
.portal-public .landing-showcase__mini img {
  border-radius: 20px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: linear-gradient(180deg, #ffffffa8, #f7f2eae0);
}
.portal-public .landing-showcase__frame-meta {
  gap: 0.22rem;
}
.portal-public .landing-showcase__frame-meta strong {
  font-size: 1rem;
}
.portal-public .landing-showcase__chips {
  gap: 0.65rem;
}
.portal-public .landing-showcase__chip {
  min-height: 34px;
  background: #fffbf4b8;
  border-color: #47526b1f;
  box-shadow: 0 10px 24px #1f25340d;
}
.portal-public .homepage-feature-grid--landing,
.portal-public .homepage-journey-grid--landing {
  gap: 1.35rem;
}
.portal-public .homepage-shell--v18-6-14 .homepage-card,
.portal-public .homepage-shell--v18-6-14 .homepage-journey-card {
  padding: 1.9rem 1.8rem;
  border-radius: 30px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: linear-gradient(180deg, #fffdf9e0, #f9f4ece6);
  box-shadow: 0 18px 42px #1f253412;
}
.portal-public .homepage-card__icon {
  width: 58px;
  height: 58px;
  border-radius: 20px;
  background: linear-gradient(180deg, #ebf1fff0, #f6f0e4f5);
  box-shadow:
    inset 0 1px #ffffffe0,
    0 10px 24px #1f25340f;
}
.portal-public .homepage-card h3,
.portal-public .homepage-journey-card h3 {
  margin: 16px 0 10px;
  font-size: clamp(1.5rem, 1.9vw, 2.2rem);
  line-height: 1.04;
  letter-spacing: -0.04em;
}
.portal-public .homepage-card p,
.portal-public .homepage-journey-card p {
  max-width: 32ch;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  line-height: 1.62;
}
.portal-public .homepage-journey-card--route .btn {
  margin-top: 1.15rem;
  background: #fffbf5bd;
  border-color: #47526b1f;
}
.portal-public .homepage-section--proof,
.portal-public .homepage-section--landing {
  gap: 1.35rem;
}
.portal-public .homepage-section__title {
  max-width: 13ch;
  font-size: clamp(2.55rem, 4.2vw, 4.2rem);
  line-height: 0.97;
  letter-spacing: -0.06em;
}
.portal-public .homepage-section__sub {
  max-width: 42ch;
  font-size: 1.02rem;
  color: color-mix(in srgb, var(--text-body) 90%, white 10%);
}
.portal-public .landing-proof-card {
  padding: 1.15rem;
  border-radius: 32px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: linear-gradient(180deg, #fffdf9eb, #f8f3ebe6);
  box-shadow: 0 20px 48px #1f253414;
}
.portal-public .landing-proof-card__media {
  border-radius: 22px;
  border: 1px solid rgba(71, 82, 107, 0.1);
}
.portal-public .landing-proof-card__copy {
  gap: 0.5rem;
  padding-inline: 0.15rem;
}
.portal-public .landing-proof-card__copy h3 {
  font-size: clamp(1.15rem, 1.5vw, 1.4rem);
  letter-spacing: -0.03em;
}
.portal-public .public-band--soft {
  padding: clamp(1.55rem, 2.8vw, 2.5rem);
  border-radius: 34px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  box-shadow: 0 18px 42px #1f25340f;
}
.portal-public .auth-split--premium {
  padding: 0.25rem;
  border-radius: 32px;
  border: 1px solid rgba(71, 82, 107, 0.09);
  background: linear-gradient(180deg, #fffdf9eb, #f7f1e7e6);
  box-shadow: 0 18px 40px #1f253412;
}
.portal-public :is(.auth-panel, .auth-aside) {
  padding: clamp(1rem, 1.6vw, 1.25rem);
  border-radius: 24px;
  background: linear-gradient(180deg, #fffefaeb, #f8f3ebe6);
  border: 1px solid rgba(71, 82, 107, 0.08);
  box-shadow: none;
}
.portal-public .auth-tabs {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: #fffaf3bd;
  border: 1px solid rgba(71, 82, 107, 0.08);
}
.portal-public .auth-switch__tab {
  min-height: 42px;
  padding-inline: 0.4rem;
  border-radius: 999px;
  border: 0;
  background: transparent;
  color: var(--text-body);
  font-size: 0.94rem;
  font-weight: 720;
}
.portal-public .auth-switch__tab.is-active,
.portal-public .auth-switch__tab[aria-selected="true"] {
  background: linear-gradient(180deg, #fffffff0, #f5efe5e6);
  color: var(--text-strong);
  box-shadow: 0 6px 14px #1f25340d;
}
.portal-public .auth-panel__inner--tabbed {
  width: min(100%, 38rem);
  max-width: 38rem;
}
.portal-public .auth-chip {
  background: #fffaf3db;
  border-color: #47526b1a;
}
.portal-public .auth-support-card {
  border-radius: 18px;
  border-color: #47526b14;
  background: linear-gradient(180deg, #fffcf7e0, #f8f2e9e0);
}
.portal-public .auth-panel .section-rail label,
.portal-public .auth-panel .card-grid label {
  display: grid;
  gap: 0.32rem;
  font-weight: 720;
  color: var(--text-body);
}
.portal-public .auth-panel :is(input, select) {
  min-height: 46px;
  padding-inline: 14px;
  border-radius: 14px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background-color: #fffdf9e6;
  box-shadow: none;
}
.portal-public .auth-panel select:not([multiple]) {
  padding-right: 58px;
}
.portal-public .auth-illustration--product {
  max-height: 200px;
}
.portal-public .auth-point {
  padding: 0.72rem 0.8rem;
  border-radius: 18px;
  border-color: #47526b14;
  background: #fffbf5bd;
}
.portal-public .auth-point .status-pill {
  position: relative;
  color: transparent;
  font-size: 0;
}
.portal-public .auth-point .status-pill:before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--brand-700);
  display: block;
}
@media (max-width: 1100px) {
  .landing-hero-rail {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  body.portal-public:before,
  body.portal-public:after {
    opacity: 0.72;
  }
  .portal-public .homepage-hero--landing {
    padding: 1.55rem;
    border-radius: 30px;
  }
  .portal-public .homepage-hero__copy--landing h1 {
    max-width: 10ch;
    font-size: clamp(3.25rem, 13vw, 4.8rem);
  }
  .portal-public .homepage-shell--v18-6-14 .homepage-card,
  .portal-public .homepage-shell--v18-6-14 .homepage-journey-card,
  .portal-public .landing-proof-card {
    padding: 1.2rem;
    border-radius: 24px;
  }
  .portal-public .auth-split--premium {
    padding: 0.2rem;
    border-radius: 28px;
  }
  .portal-public :is(.auth-panel, .auth-aside) {
    border-radius: 22px;
    padding: 1.15rem;
  }
}
.portal-public .homepage-hero--landing {
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.88fr);
  gap: clamp(1.15rem, 2vw, 1.8rem);
  padding: clamp(1.3rem, 2.6vw, 2.15rem);
  align-items: start;
}
.portal-public .homepage-hero__copy--landing {
  gap: 0.72rem;
  max-width: 36rem;
  padding-inline-start: clamp(0.35rem, 1.3vw, 1.05rem);
}
.portal-public .homepage-hero__copy--landing h1 {
  max-width: 10.4ch;
  font-size: clamp(3.15rem, 4.9vw, 5.1rem);
  line-height: 0.92;
  letter-spacing: -0.065em;
}
.portal-public .homepage-hero__sub--landing {
  max-width: 31ch;
  font-size: clamp(0.99rem, 1.08vw, 1.06rem);
  line-height: 1.42;
}
.portal-public .landing-hero-note {
  max-width: 40ch;
  font-size: 0.9rem;
  line-height: 1.5;
}
.portal-public .homepage-proof-strip--landing,
.portal-public .homepage-proof-strip.homepage-proof-strip--landing {
  gap: 0.5rem;
  max-width: 34rem;
}
.portal-public .homepage-proof-strip--landing .homepage-proof-pill,
.portal-public
  .homepage-proof-strip.homepage-proof-strip--landing
  .homepage-proof-pill {
  min-height: 30px;
  padding: 0.34rem 0.66rem;
  font-size: 0.78rem;
  border-color: #47526b1a;
  background: #fffbf5d6;
}
.portal-public .landing-showcase--proof {
  place-items: stretch;
  min-height: 0;
  align-self: stretch;
}
.portal-public .landing-showcase__shell {
  position: relative;
  min-height: 0;
  padding: 0;
}
.portal-public .landing-showcase__browser {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0.72rem;
  width: 100%;
  padding: 0.92rem;
  border-radius: 30px;
  border: 1px solid rgba(71, 82, 107, 0.11);
  background: linear-gradient(180deg, #fffefbf2, #f7f1e7ed);
  box-shadow: 0 24px 56px #1f25341f;
}
.portal-public .landing-showcase__browser-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.9rem;
}
.portal-public .landing-showcase__browser-window {
  display: inline-flex;
  gap: 0.38rem;
}
.portal-public .landing-showcase__browser-window span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #707a9438;
}
.portal-public .landing-showcase__browser-window span:nth-child(2) {
  background: #cda86647;
}
.portal-public .landing-showcase__browser-window span:nth-child(3) {
  background: #739c8c42;
}
.portal-public .landing-showcase__browser-copy {
  display: grid;
  gap: 0.18rem;
  justify-items: start;
  text-align: left;
}
.portal-public .landing-showcase__browser-copy strong {
  max-width: 20ch;
  font-size: 1rem;
  line-height: 1.2;
  color: var(--text-strong);
}
.portal-public .landing-showcase__mode-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.portal-public .landing-showcase__mode-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  min-height: 34px;
  padding: 0.38rem 0.82rem;
  border-radius: 999px;
  border: 1px solid rgba(71, 82, 107, 0.12);
  background: #fffcf7d1;
  color: var(--text-body);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}
.portal-public .landing-showcase__mode-trigger:hover {
  border-color: #718ae43d;
  background: #f4f7fff5;
}
.portal-public .landing-showcase__mode-trigger:focus-visible {
  outline: 2px solid rgba(113, 138, 228, 0.38);
  outline-offset: 2px;
}
.portal-public .landing-showcase__mode-trigger.is-active {
  border-color: #718ae438;
  background: #e9effff2;
  color: var(--text-strong);
  box-shadow: inset 0 1px #ffffffe0;
}
.portal-public .landing-showcase__stage {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: #f8f4edf5;
  aspect-ratio: 16 / 9.2;
}
.portal-public .landing-showcase__slide-frame {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  transform: translateY(10px) scale(0.985);
  pointer-events: none;
  transition:
    opacity 0.42s ease,
    transform 0.52s ease;
}
.portal-public .landing-showcase__slide-frame.is-active {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.portal-public .landing-showcase__slide-frame img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center top;
}
.portal-public .landing-showcase__browser-footer {
  display: grid;
  gap: 0.65rem;
}
.portal-public .landing-showcase__browser-footer--showcase {
  min-height: 4.9rem;
  align-content: start;
}
.portal-public .landing-showcase__slide-meta {
  display: none;
  gap: 0.22rem;
  max-width: 28rem;
}
.portal-public .landing-showcase__slide-meta.is-active {
  display: grid;
}
.portal-public .landing-showcase__slide-meta strong {
  font-size: 0.98rem;
  line-height: 1.2;
  color: var(--text-strong);
}
.portal-public .landing-showcase__slide-meta p {
  margin: 0;
  max-width: 34ch;
  color: var(--text-body);
  line-height: 1.45;
  font-size: 0.9rem;
}
.portal-public .landing-showcase__support {
  position: absolute;
  right: 0;
  display: grid;
  gap: 0.65rem;
  width: min(244px, 41%);
  padding: 0.82rem;
  border-radius: 24px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: linear-gradient(180deg, #fffdf9f2, #f7f1e7f0);
  box-shadow: 0 18px 38px #1f25341a;
}
.portal-public .landing-showcase__support--paper {
  top: 20px;
}
.portal-public .landing-showcase__support--progress {
  bottom: 16px;
}
.portal-public .landing-showcase__support-copy {
  display: grid;
  gap: 0.22rem;
}
.portal-public .landing-showcase__support-copy strong {
  font-size: 0.96rem;
  line-height: 1.22;
}
.portal-public .landing-showcase__support-copy p {
  margin: 0;
  color: var(--text-body);
  font-size: 0.88rem;
  line-height: 1.5;
}
.portal-public .landing-showcase__support-media {
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(71, 82, 107, 0.09);
  background: #faf6f0eb;
  aspect-ratio: 16 / 11;
}
.portal-public .landing-showcase__support-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: top center;
}
.portal-public .homepage-section--reasons,
.portal-public .homepage-section--modes {
  gap: 1.05rem;
}
.portal-public .landing-reason-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.portal-public .landing-reason-card {
  display: grid;
  gap: 0.72rem;
  padding: 1rem 1.08rem 1.06rem;
  border-radius: 24px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: linear-gradient(180deg, #fffdf9f0, #f7f1e7e6);
  box-shadow: 0 14px 30px #1f25340f;
}
.portal-public .landing-reason-card__header {
  display: flex;
  align-items: center;
  gap: 0.82rem;
  min-width: 0;
}
.portal-public .landing-reason-card__icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  flex: 0 0 46px;
  border-radius: 16px;
  background: #e8eefbb8;
  color: var(--brand-700);
}
.portal-public .landing-reason-card__icon svg {
  width: 22px;
  height: 22px;
}
.portal-public .landing-reason-card__header h3 {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.2;
}
.portal-public .landing-reason-card__body {
  margin: 0;
  color: var(--text-body);
  line-height: 1.55;
}
.portal-public .homepage-card--mode {
  gap: 0.68rem;
  padding: 1.12rem 1.14rem 1.18rem;
}
.portal-public .homepage-card__header {
  display: flex;
  align-items: center;
  gap: 0.82rem;
  min-width: 0;
}
.portal-public .homepage-card__header--journey {
  margin-bottom: 0.08rem;
}
.portal-public .homepage-card__title-wrap {
  min-width: 0;
}
.portal-public .homepage-card__title-wrap h3,
.portal-public .homepage-journey-card--route .homepage-card__title-wrap h3 {
  margin: 0;
  max-width: none;
  font-size: clamp(1.16rem, 1.5vw, 1.42rem);
  line-height: 1.12;
  letter-spacing: -0.03em;
}
.portal-public .homepage-card--mode .homepage-card__icon,
.portal-public .homepage-journey-card--route .homepage-card__icon {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  border-radius: 18px;
}
.portal-public .homepage-card--mode .homepage-card__icon svg,
.portal-public .homepage-journey-card--route .homepage-card__icon svg {
  width: 23px;
  height: 23px;
}
.portal-public .homepage-card--mode p {
  margin: 0;
  max-width: none;
  font-size: 0.95rem;
  line-height: 1.56;
}
.portal-public .homepage-journey-card--route {
  gap: 0.72rem;
  padding: 1.12rem 1.14rem 1.16rem;
}
.portal-public .homepage-journey-card--route p {
  margin: 0;
  max-width: none;
  font-size: 0.95rem;
  line-height: 1.56;
}
.portal-public .landing-final-band {
  padding-block: clamp(1.3rem, 2.4vw, 1.9rem);
}
.portal-public .landing-final-band .section-header {
  margin-bottom: 0.25rem;
}
.portal-public .auth-split--tabbed {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  align-items: stretch;
}
.portal-public .auth-panel--tabbed {
  display: grid;
  align-content: start;
}
.portal-public .auth-panel__inner--tabbed {
  min-height: 0;
  gap: 0.82rem;
}
.portal-public .auth-panel__inner--tabbed > .auth-tab-panel {
  gap: 0.82rem;
}
.portal-public .auth-panel-heading {
  display: grid;
  gap: 0.28rem;
}
.portal-public .auth-panel-heading h1 {
  margin: 0;
  font-size: clamp(2rem, 2.7vw, 3rem);
  line-height: 1.04;
  letter-spacing: -0.05em;
  font-weight: 700;
}
.portal-public .auth-panel-heading p {
  margin: 0;
  max-width: 38ch;
  font-size: 1rem;
  line-height: 1.58;
}
.portal-public .auth-form-stack {
  gap: 0.72rem;
}
.portal-public .auth-submit-btn {
  width: 100%;
  min-height: 48px;
  margin-top: 0.05rem;
}
.portal-public .mp-public-auth-secondary-action {
  display: grid;
}
.portal-public .mp-public-auth-secondary-action__trigger {
  width: 100%;
  justify-content: center;
  text-align: center;
}
.portal-public .auth-form-meta {
  display: flex;
  justify-content: flex-start;
  font-size: 0.94rem;
}
.portal-public .auth-form-meta .auth-inline-link,
.portal-public .auth-form-meta .auth-inline-link--button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-body);
  font-weight: 700;
  box-shadow: none;
}
.portal-public .auth-form-meta .auth-inline-link:hover,
.portal-public .auth-form-meta .auth-inline-link--button:hover,
.portal-public .auth-form-meta .auth-inline-link:focus-visible,
.portal-public .auth-form-meta .auth-inline-link--button:focus-visible {
  color: var(--text-strong);
  box-shadow: none;
}
.portal-public .auth-panel .inline-notice {
  margin-top: 0;
  padding: 0.62rem 0.78rem;
  border-radius: 14px;
  border: 1px solid rgba(71, 82, 107, 0.08);
  background: #fffbf5bd;
  font-size: 0.92rem;
  line-height: 1.48;
}
.portal-public .mp-public-lead--strong {
  font-size: clamp(1.08rem, 1.5vw, 1.24rem);
  font-weight: 700;
  color: var(--text-strong);
}
.portal-public .mp-public-demo-shell {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.9fr);
  align-items: start;
}
.portal-public .mp-public-demo-form {
  display: grid;
  gap: var(--space-4);
  padding: clamp(22px, 3vw, 32px);
  border-radius: var(--radius-4);
  background: var(--bg-panel);
  border: 1px solid var(--line-subtle);
  box-shadow: var(--shadow-sm);
}
.portal-public .mp-public-demo-grid {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.portal-public .mp-public-demo-form label {
  display: grid;
  gap: 8px;
  font-weight: 600;
  color: var(--text-strong);
}
.portal-public .mp-public-demo-form input,
.portal-public .mp-public-demo-form select,
.portal-public .mp-public-demo-form textarea {
  width: 100%;
  border-radius: var(--radius-2);
  border: 1px solid var(--line-subtle);
  background: var(--bg-panel-2);
  color: var(--text-strong);
  padding: 13px 14px;
  font: inherit;
}
.portal-public .mp-public-demo-form textarea {
  min-height: 132px;
  resize: vertical;
}
.portal-public .mp-public-demo-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.portal-public .mp-public-demo-status.is-error {
  color: #8f2d2d;
  background: #be43431f;
}
.portal-public .mp-public-demo-status.is-success {
  color: #1f5e42;
  background: #45915f24;
}
.portal-public .mp-public-final-band--inline {
  min-height: 100%;
}
.portal-public .inline-notice--soft {
  background: #7887ad14;
}
.portal-public .mp-public-auth-page--single .auth-panel__inner {
  gap: var(--space-4);
}
.portal-public .mp-public-auth-form--single {
  margin-top: var(--space-3);
}
@media (max-width: 940px) {
  .portal-public .mp-public-demo-shell {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 680px) {
  .portal-public .mp-public-demo-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
.portal-public .auth-support-card {
  margin-top: 0;
  gap: 0.3rem;
}
.portal-public .auth-support-card__copy {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}
.portal-public .auth-support-card__cta {
  justify-self: start;
  align-self: start;
}
@media (min-width: 1181px) {
  .portal-public .auth-support-card--with-cta {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    column-gap: 1rem;
  }
  .portal-public .auth-support-card--with-cta .auth-support-card__cta {
    justify-self: end;
    margin-top: 0.05rem;
  }
}
.portal-public .auth-aside--tabbed {
  align-content: start;
}
.portal-public .auth-aside--tabbed .auth-aside-panel {
  gap: 0.62rem;
}
.portal-public .auth-aside--tabbed .auth-illustration--product {
  width: 100%;
  max-width: 230px;
  min-height: 0;
  height: auto;
  max-height: 138px;
}
.portal-public .auth-aside--tabbed .auth-illustration--public-signin {
  width: min(100%, 238px);
  max-width: 238px;
  max-height: 136px;
}
.portal-public .auth-aside--tabbed h2 {
  margin: 0;
  font-size: clamp(1.2rem, 1.6vw, 1.45rem);
  line-height: 1.16;
}
.portal-public .auth-aside-summary {
  max-width: none;
  font-size: 0.95rem;
  line-height: 1.55;
}
.portal-public .auth-point {
  padding: 0.72rem 0.78rem;
  gap: 0.58rem;
}
.portal-public .auth-point .status-pill {
  min-width: 20px;
  min-height: 20px;
}
.portal-public .auth-aside-highlights {
  gap: 0.48rem;
}
.portal-public .auth-aside-highlight {
  padding: 0.66rem 0.72rem;
  border-radius: 16px;
}
.portal-public .auth-aside-highlight__title {
  font-size: 0.88rem;
}
.portal-public .auth-aside-highlight__body {
  font-size: 0.84rem;
}
@media (max-width: 1180px) {
  .portal-public .landing-showcase__browser {
    width: calc(100% - 22px);
  }
  .portal-public .landing-showcase__support {
    width: min(220px, 38%);
  }
  .portal-public .landing-reason-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-public .auth-split--tabbed {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  }
}
@media (max-width: 980px) {
  .portal-public .homepage-hero--landing {
    grid-template-columns: 1fr;
  }
  .portal-public .homepage-hero__copy--landing {
    max-width: none;
    padding-inline-start: 0;
  }
  .portal-public .landing-showcase__shell {
    min-height: 0;
    padding: 0;
    display: grid;
    gap: 0.9rem;
  }
  .portal-public .landing-showcase__browser {
    width: 100%;
  }
  .portal-public .landing-showcase__support {
    position: static;
    width: 100%;
  }
  .portal-public .landing-showcase__support--paper,
  .portal-public .landing-showcase__support--progress {
    top: auto;
    right: auto;
    bottom: auto;
  }
  .portal-public .auth-split--tabbed {
    grid-template-columns: 1fr;
  }
  .portal-public .auth-panel__inner--tabbed {
    width: 100%;
    max-width: none;
    min-height: 0;
  }
  .portal-public .auth-aside--tabbed .auth-illustration--product {
    max-width: 220px;
  }
}
@media (max-width: 760px) {
  .portal-public .homepage-hero__copy--landing h1 {
    max-width: 9.6ch;
    font-size: clamp(2.8rem, 11.6vw, 4rem);
  }
  .portal-public .landing-reason-grid {
    grid-template-columns: 1fr;
  }
  .portal-public .landing-showcase__browser {
    padding: 0.9rem;
    border-radius: 24px;
  }
  .portal-public .landing-showcase__browser-frame {
    border-radius: 18px;
  }
  .portal-public .landing-showcase__mode-trigger {
    flex: 1 1 calc(33.333% - 0.35rem);
    justify-content: center;
    min-height: 38px;
    padding-inline: 0.55rem;
    font-size: 0.8rem;
  }
  .portal-public .landing-showcase__support {
    padding: 0.78rem;
    border-radius: 20px;
  }
  .portal-public .homepage-card__header,
  .portal-public .landing-reason-card__header {
    gap: 0.7rem;
  }
  .portal-public .homepage-card--mode .homepage-card__icon,
  .portal-public .homepage-journey-card--route .homepage-card__icon,
  .portal-public .landing-reason-card__icon {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
    border-radius: 15px;
  }
  .portal-public .homepage-card--mode .homepage-card__icon svg,
  .portal-public .homepage-journey-card--route .homepage-card__icon svg,
  .portal-public .landing-reason-card__icon svg {
    width: 20px;
    height: 20px;
  }
  .portal-public .auth-tabs {
    border-radius: 22px;
  }
  .portal-public .auth-switch__tab {
    min-height: 42px;
    font-size: 0.88rem;
  }
}
@media (max-width: 620px) {
  .portal-public .landing-showcase__browser-top {
    align-items: start;
    flex-direction: column;
  }
  .portal-public .landing-showcase__browser-copy {
    justify-items: start;
    text-align: left;
  }
  .portal-public .landing-showcase__browser-copy strong {
    max-width: none;
  }
  .portal-public .landing-showcase__browser-pills {
    gap: 0.38rem;
  }
}
.student-shell[data-learner-theme="flight"],
.student-theme-card--flight,
.student-theme-preview-panel--flight {
  --student-theme-primary: #5a78ff;
  --student-theme-secondary: #dce6ff;
  --student-theme-strong: #274694;
  --student-theme-glow: rgba(90, 120, 255, 0.2);
}
.student-shell[data-learner-theme="football"],
.student-theme-card--football,
.student-theme-preview-panel--football {
  --student-theme-primary: #2f9e64;
  --student-theme-secondary: #dff7e8;
  --student-theme-strong: #15603f;
  --student-theme-glow: rgba(47, 158, 100, 0.18);
}
.student-shell[data-learner-theme="space"],
.student-theme-card--space,
.student-theme-preview-panel--space {
  --student-theme-primary: #6d5efc;
  --student-theme-secondary: #e9e5ff;
  --student-theme-strong: #322681;
  --student-theme-glow: rgba(109, 94, 252, 0.2);
}
.student-shell[data-learner-theme="studio"],
.student-theme-card--studio,
.student-theme-preview-panel--studio {
  --student-theme-primary: #ef6b8f;
  --student-theme-secondary: #ffe3ec;
  --student-theme-strong: #8c3150;
  --student-theme-glow: rgba(239, 107, 143, 0.18);
}
.student-shell[data-learner-theme="ocean"],
.student-theme-card--ocean,
.student-theme-preview-panel--ocean {
  --student-theme-primary: #2b8cc4;
  --student-theme-secondary: #dff4ff;
  --student-theme-strong: #13506f;
  --student-theme-glow: rgba(43, 140, 196, 0.2);
}
.student-shell[data-learner-theme="rescue"],
.student-theme-card--rescue,
.student-theme-preview-panel--rescue {
  --student-theme-primary: #f08a4b;
  --student-theme-secondary: #ffeddc;
  --student-theme-strong: #8a4720;
  --student-theme-glow: rgba(240, 138, 75, 0.2);
}
.student-shell[data-learner-theme] .student-home-hero,
.student-shell[data-learner-theme] .student-profile-banner,
.student-shell[data-learner-theme] .student-profile-command,
.student-shell[data-learner-theme] .student-home-mission__card,
.student-shell[data-learner-theme] .student-theme-preview-panel {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary) 28%,
    rgba(255, 255, 255, 0.82)
  );
  box-shadow: 0 20px 48px var(--student-theme-glow);
}
.student-shell[data-learner-theme] .student-home-hero,
.student-shell[data-learner-theme] .student-profile-banner {
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--student-theme-primary) 18%, transparent),
      transparent 36%
    ),
    linear-gradient(
      140deg,
      color-mix(in srgb, white 82%, var(--student-theme-secondary) 18%),
      color-mix(in srgb, white 72%, var(--student-theme-primary) 28%)
    );
}
.student-shell[data-learner-theme] .student-profile-command {
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--student-theme-primary) 16%, transparent),
      transparent 40%
    ),
    linear-gradient(
      180deg,
      #fffffffa,
      color-mix(in srgb, white 78%, var(--student-theme-secondary) 22%)
    );
}
.student-shell[data-learner-theme] .student-home-mission__card,
.student-shell[data-learner-theme] .student-theme-preview-panel,
.student-shell[data-learner-theme] .student-profile-note {
  background: linear-gradient(
    180deg,
    #fffffff5,
    color-mix(in srgb, white 74%, var(--student-theme-secondary) 26%)
  );
}
.student-shell[data-learner-theme] .student-progress-track > span,
.student-shell[data-learner-theme] .student-progress-track--challenge > span {
  background: linear-gradient(
    90deg,
    var(--student-theme-primary),
    var(--student-theme-strong)
  );
}
.student-shell[data-learner-theme] .student-progress-track__marker,
.student-shell[data-learner-theme] .student-level-badge__token,
.student-shell[data-learner-theme] .student-home-mission__icon,
.student-shell[data-learner-theme] .student-theme-preview-panel__icon {
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--student-theme-primary) 22%, white),
    0 12px 28px var(--student-theme-glow);
}
.student-shell[data-learner-theme] .student-level-badge,
.student-shell[data-learner-theme] .student-licence-card__meter,
.student-shell[data-learner-theme] .student-inline-metric,
.student-shell[data-learner-theme] .student-metric-chip {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary) 18%,
    rgba(15, 23, 42, 0.08)
  );
}
.student-licence-card__action-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.student-home-command-card__mission {
  margin-bottom: 14px;
}
.student-home-mission__card--empty {
  opacity: 0.92;
}
.student-profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.82fr);
  gap: 18px;
  width: min(100%, 1180px);
  margin: 0 auto;
  align-items: start;
}
.student-profile-customizer,
.student-profile-side {
  display: grid;
  gap: 18px;
  min-width: 0;
}
.student-profile-side__rail {
  display: grid;
  gap: 18px;
  position: sticky;
  top: calc(var(--student-topbar-height, 64px) + 18px);
}
.student-profile-form__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.85fr);
  gap: 14px;
  align-items: start;
}
.student-profile-command {
  position: sticky;
  top: calc(var(--student-topbar-height, 64px) + 18px);
  z-index: 6;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 22px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  backdrop-filter: blur(10px);
}
.student-profile-form.is-dirty .student-profile-command {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 36%,
    rgba(27, 42, 68, 0.08)
  );
  box-shadow: 0 24px 48px
    color-mix(
      in srgb,
      var(--student-theme-glow, rgba(90, 120, 255, 0.18)) 85%,
      transparent
    );
}
.student-profile-command__copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.student-profile-command__copy h3,
.student-profile-section__header strong {
  margin: 0;
}
.student-profile-command__copy h3 {
  font-size: clamp(1.15rem, 1.8vw, 1.4rem);
}
.student-profile-command__copy p {
  margin: 0;
  max-width: 60ch;
}
.student-profile-command__actions {
  display: grid;
  gap: 10px;
  justify-items: end;
}
.student-profile-command__meta {
  justify-content: flex-end;
}
.student-profile-note,
.student-profile-section {
  display: grid;
  gap: 10px;
}
.student-profile-section__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.student-profile-note {
  padding: 14px 16px;
  border-radius: 20px;
  border: 1px solid rgba(27, 42, 68, 0.08);
}
.student-profile-form__nickname input {
  min-height: 52px;
}
.student-theme-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.student-theme-card {
  display: grid;
  gap: 12px;
  width: 100%;
  padding: 15px;
  border-radius: 22px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 22%,
      rgba(15, 23, 42, 0.08)
    );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 14%,
        transparent
      ),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      #fffffffa,
      color-mix(in srgb, white 72%, var(--student-theme-secondary, #dce6ff) 28%)
    );
  box-shadow: 0 12px 28px #0f172a0f;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}
.student-theme-card:hover,
.student-theme-card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 18px 34px var(--student-theme-glow, rgba(90, 120, 255, 0.16));
}
.student-theme-card.is-active {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 58%,
    white
  );
  box-shadow: 0 22px 40px var(--student-theme-glow, rgba(90, 120, 255, 0.18));
}
.student-theme-card__top {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}
.student-theme-card__icon,
.student-theme-preview-panel__icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
  background: linear-gradient(
    180deg,
    #fffffff5,
    color-mix(in srgb, white 60%, var(--student-theme-secondary, #dce6ff) 40%)
  );
}
.student-theme-card__copy {
  display: grid;
  gap: 4px;
}
.student-theme-card__copy strong {
  font-size: 1rem;
}
.student-theme-card__copy span,
.student-theme-card__state,
.student-theme-card__footer span {
  font-size: 0.82rem;
  line-height: 1.35;
  color: #1b2a44c2;
}
.student-theme-card__state {
  font-weight: 800;
  color: var(--student-theme-strong, #274694);
}
.student-theme-card__chips,
.student-theme-preview-panel__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-theme-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.student-theme-card__footer strong {
  font-size: 0.96rem;
  color: var(--student-theme-strong, #274694);
}
.student-theme-preview-panel {
  gap: 16px;
}
.student-theme-preview-panel__header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.student-theme-preview-panel__header h2 {
  margin: 0;
}
.student-theme-preview-panel__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.student-theme-preview-stat {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(15, 23, 42, 0.08)
    );
  background: #ffffffb8;
}
.student-theme-preview-stat span,
.student-theme-preview-stat small {
  font-size: 0.76rem;
  line-height: 1.3;
  color: #1b2a44b8;
}
.student-theme-preview-stat strong {
  font-size: 1rem;
  line-height: 1.15;
}
.student-profile-section--avatar .student-avatar-grid {
  max-height: min(72vh, 860px);
  overflow: auto;
  padding-right: 6px;
  align-content: start;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.student-profile-section__actions {
  align-items: center;
}
.student-avatar-library-toggle {
  white-space: nowrap;
}
.student-profile-avatar-library-note {
  margin: 0;
}
.student-profile-avatar-library {
  display: grid;
  gap: 12px;
}
.student-profile-avatar-library__host {
  min-height: 0;
}
.student-profile-section--avatar .student-avatar-grid::-webkit-scrollbar {
  width: 10px;
}
.student-profile-section--avatar .student-avatar-grid::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(27, 42, 68, 0.12)
  );
}
.student-profile-section--avatar .student-avatar-grid::-webkit-scrollbar-track {
  background: transparent;
}
.student-profile-footer {
  display: none;
}
.student-profile-class-card .student-home-class-summary--compact {
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
}
@media (min-width: 1180px) {
  .student-profile-page {
    gap: 16px;
  }
  .student-profile-banner,
  .student-profile-layout {
    width: min(100%, 1100px);
  }
  .student-profile-banner {
    gap: 14px;
    padding: 18px 20px;
    border-radius: 28px;
  }
  .student-profile-banner .student-licence-card__hero {
    grid-template-columns: minmax(0, 1.22fr) minmax(250px, 0.78fr);
    gap: 16px;
  }
  .student-profile-banner .student-licence-card__title-row {
    gap: 12px;
    align-items: center;
  }
  .student-profile-banner .student-hero-avatar {
    width: 58px;
    height: 58px;
    border-radius: 18px;
  }
  .student-profile-banner .student-licence-card__title-copy h1 {
    margin: 0;
    font-size: clamp(1.95rem, 2.55vw, 2.6rem);
    line-height: 0.96;
  }
  .student-profile-banner .student-licence-card__title-copy .muted {
    max-width: 34ch;
    font-size: 0.98rem;
    line-height: 1.42;
  }
  .student-profile-banner .student-identity-chips {
    margin-top: 2px;
    gap: 6px;
  }
  .student-profile-banner .student-licence-card__action-row {
    margin-top: 8px;
  }
  .student-profile-banner .student-licence-card__status-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    margin-top: 10px;
  }
  .student-profile-banner .student-level-badge {
    min-height: 60px;
    padding: 10px 12px;
  }
  .student-profile-banner .student-level-badge__token {
    min-width: 34px;
    height: 34px;
    border-radius: 12px;
  }
  .student-profile-banner .student-level-badge__copy strong {
    font-size: 0.88rem;
  }
  .student-profile-banner .student-level-badge__copy small,
  .student-profile-banner .student-licence-card__journey-meta {
    font-size: 0.75rem;
    line-height: 1.26;
  }
  .student-profile-banner .student-licence-card__meter {
    padding: 14px 16px;
    gap: 10px;
    border-radius: 20px;
  }
  .student-profile-banner .student-licence-card__meter-head strong {
    font-size: 1rem;
  }
  .student-profile-banner .student-licence-card__meter-foot {
    gap: 8px 12px;
    font-size: 0.79rem;
    line-height: 1.28;
  }
  .student-profile-layout {
    grid-template-columns: minmax(0, 1.62fr) minmax(280px, 0.72fr);
    gap: 16px;
  }
  .student-profile-customizer,
  .student-profile-side,
  .student-profile-side__rail {
    gap: 14px;
  }
  .student-profile-focus-panel {
    gap: 16px;
    padding: 18px 20px 20px;
  }
  .student-profile-hero {
    grid-template-columns: minmax(148px, 188px) minmax(0, 1fr);
    gap: 16px;
    padding: 14px 16px;
    border-radius: 22px;
  }
  .student-profile-hero__avatar {
    width: min(100%, 172px);
    height: min(100%, 172px);
    border-radius: 24px;
    box-shadow: 0 16px 32px #1f29371a;
  }
  .student-profile-hero__copy {
    gap: 6px;
    align-content: center;
  }
  .student-profile-hero__copy h2 {
    font-size: clamp(1.6rem, 2.05vw, 1.95rem);
  }
  .student-profile-form {
    gap: 14px;
  }
  .student-profile-command {
    gap: 14px;
    padding: 14px 16px;
    border-radius: 20px;
  }
  .student-profile-command__copy {
    gap: 4px;
  }
  .student-profile-command__copy h3 {
    font-size: clamp(1.05rem, 1.45vw, 1.24rem);
  }
  .student-profile-command__copy p {
    max-width: 48ch;
    font-size: 0.94rem;
    line-height: 1.42;
  }
  .student-profile-command__actions {
    gap: 8px;
  }
  .student-profile-form__grid {
    grid-template-columns: minmax(0, 1fr) minmax(200px, 0.72fr);
    gap: 12px;
  }
  .student-profile-note,
  .student-profile-section {
    gap: 8px;
  }
  .student-profile-note {
    padding: 12px 14px;
    border-radius: 18px;
  }
  .student-theme-grid {
    gap: 10px;
  }
  .student-theme-card {
    gap: 10px;
    padding: 13px;
    border-radius: 20px;
  }
  .student-theme-card__chips,
  .student-theme-preview-panel__chips {
    gap: 6px;
  }
  .student-theme-preview-panel,
  .student-profile-class-card {
    gap: 14px;
    padding: 18px;
  }
  .student-theme-preview-panel__stats {
    gap: 8px;
  }
  .student-theme-preview-stat {
    gap: 3px;
    padding: 10px;
    border-radius: 16px;
  }
  .student-theme-preview-stat span,
  .student-theme-preview-stat small {
    font-size: 0.74rem;
  }
  .student-theme-preview-stat strong {
    font-size: 0.95rem;
  }
  .student-profile-class-card .student-home-class-summary__challenge {
    margin-top: 10px;
  }
  .student-profile-section--avatar .student-avatar-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    max-height: min(58vh, 700px);
  }
  .student-profile-section--avatar .student-avatar-option {
    min-height: 186px;
    padding: 12px;
    grid-template-rows: 96px auto;
    gap: 8px;
    border-radius: 20px;
  }
  .student-profile-section--avatar .student-avatar-option__preview {
    width: 96px;
    min-width: 96px;
    height: 96px;
    min-height: 96px;
  }
  .student-profile-section--avatar .student-avatar-option__label {
    font-size: 0.9rem;
  }
  .student-profile-section--avatar .student-avatar-option__meta {
    min-height: 2.35em;
    font-size: 0.74rem;
    line-height: 1.22;
  }
}
@media (min-width: 1180px) and (max-height: 1120px) and (hover: hover) and (pointer: fine) {
  .student-profile-page {
    gap: 14px;
  }
  .student-profile-banner {
    padding: 16px 18px;
  }
  .student-profile-banner .student-licence-card__title-copy h1 {
    font-size: clamp(1.8rem, 2.35vw, 2.35rem);
  }
  .student-profile-banner .student-licence-card__hero {
    gap: 14px;
  }
  .student-profile-banner .student-licence-card__meter {
    padding: 12px 14px;
  }
  .student-profile-focus-panel {
    padding: 16px 18px 18px;
  }
  .student-profile-hero {
    padding: 12px 14px;
  }
  .student-profile-hero__avatar {
    width: min(100%, 160px);
    height: min(100%, 160px);
  }
  .student-profile-command {
    padding: 12px 14px;
  }
  .student-profile-section--avatar .student-avatar-grid {
    max-height: min(54vh, 640px);
  }
  .student-profile-section--avatar .student-avatar-option {
    min-height: 172px;
    grid-template-rows: 88px auto;
  }
  .student-profile-section--avatar .student-avatar-option__preview {
    width: 88px;
    min-width: 88px;
    height: 88px;
    min-height: 88px;
  }
}
@media (max-width: 1080px) {
  .student-profile-layout,
  .student-profile-form__grid,
  .student-theme-preview-panel__stats {
    grid-template-columns: 1fr;
  }
  .student-profile-side__rail {
    position: static;
    top: auto;
  }
  .student-profile-section--avatar .student-avatar-grid {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}
@media (max-width: 860px) {
  .student-profile-command {
    position: static;
    top: auto;
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .student-profile-command__actions {
    justify-items: stretch;
  }
  .student-profile-command__meta {
    justify-content: flex-start;
  }
  .student-theme-grid {
    grid-template-columns: 1fr;
  }
  .student-profile-footer {
    display: flex;
  }
  .student-profile-footer .btn {
    width: 100%;
  }
}
.student-profile-layout {
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr);
  width: min(100%, 1140px);
}
.student-profile-customizer,
.student-profile-side__rail {
  gap: 14px;
}
.student-profile-banner .student-licence-card__copy {
  display: grid;
  gap: 12px;
}
.student-profile-banner .student-licence-card__hero {
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  align-items: start;
}
.student-profile-banner .student-inline-metric-strip--hero {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  width: min(100%, 660px);
}
.student-profile-preview-card {
  display: grid;
  gap: 14px;
  padding: 18px;
}
.student-profile-preview-card__hero {
  display: grid;
  grid-template-columns: minmax(108px, 152px) minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}
.student-profile-preview-card__avatar {
  width: min(100%, 146px);
  aspect-ratio: 1;
  justify-self: center;
  display: grid;
  place-items: center;
  border-radius: 26px;
  overflow: hidden;
  background: linear-gradient(
    180deg,
    #fffffff5,
    color-mix(in srgb, white 74%, var(--student-theme-secondary, #dce6ff) 26%)
  );
  box-shadow: 0 16px 36px #1b2a441a;
}
.student-profile-preview-card__avatar .learner-avatar,
.student-profile-preview-card__avatar .learner-avatar__img {
  width: 100%;
  height: 100%;
}
.student-profile-preview-card__copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.student-profile-preview-card__copy h2 {
  margin: 0;
  font-size: clamp(1.55rem, 2vw, 2rem);
}
.student-profile-preview-card__chips {
  margin-top: -2px;
}
.student-profile-preview-card__edit {
  align-self: start;
  justify-self: end;
  width: 56px;
  min-width: 56px;
  height: 56px;
  padding: 0;
  border-radius: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 22%,
      rgba(27, 42, 68, 0.08)
    );
  background: linear-gradient(
    180deg,
    #fffffffa,
    color-mix(in srgb, white 82%, var(--student-theme-secondary, #dce6ff) 18%)
  );
  box-shadow: 0 14px 30px #1b2a441a;
  font-size: 1.2rem;
}
.student-profile-appearance-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 22px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: linear-gradient(
    180deg,
    #fffffffa,
    color-mix(in srgb, white 78%, var(--student-theme-secondary, #dce6ff) 22%)
  );
}
.student-profile-appearance-card__copy {
  display: grid;
  gap: 4px;
}
.student-profile-appearance-card__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}
.student-profile-appearance-card__trigger {
  white-space: nowrap;
}
.student-profile-appearance-modal {
  display: grid;
  gap: 16px;
}
.student-profile-appearance-modal__hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(220px, 0.92fr);
  gap: 14px;
  align-items: start;
}
.student-profile-appearance-modal__preview {
  padding: 16px;
  border-radius: 24px;
  background: linear-gradient(
    180deg,
    #fffffff5,
    color-mix(in srgb, white 76%, var(--student-theme-secondary, #dce6ff) 24%)
  );
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(15, 23, 42, 0.08)
    );
}
.student-profile-preview-card--modal .student-profile-preview-card__hero {
  grid-template-columns: 120px minmax(0, 1fr);
}
.student-profile-preview-card--modal .student-profile-preview-card__avatar {
  width: 120px;
}
.student-profile-appearance-modal__aside {
  display: grid;
  gap: 8px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: linear-gradient(180deg, #ffffffeb, #ffffffd1);
}
.student-profile-appearance-modal__aside p {
  margin: 0;
}
.student-profile-appearance-modal__panel {
  display: grid;
  gap: 12px;
}
.student-profile-appearance-modal .student-theme-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.student-profile-appearance-modal .student-avatar-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-height: min(54vh, 620px);
  overflow: auto;
  padding-right: 6px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.student-profile-appearance-modal .student-avatar-grid::-webkit-scrollbar {
  width: 10px;
}
.student-profile-appearance-modal
  .student-avatar-grid::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(27, 42, 68, 0.12)
  );
}
.student-profile-appearance-modal-card {
  width: min(1040px, 100%);
  max-height: min(88vh, 960px);
}
@media (min-width: 1180px) {
  .student-profile-banner,
  .student-profile-layout {
    width: min(100%, 1140px);
  }
  .student-profile-banner .student-licence-card__hero {
    grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
  }
  .student-profile-layout {
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr);
  }
  .student-profile-preview-card {
    padding: 16px 18px;
  }
  .student-profile-preview-card__hero {
    grid-template-columns: minmax(96px, 136px) minmax(0, 1fr) auto;
    gap: 12px;
  }
  .student-profile-preview-card__avatar {
    width: min(100%, 132px);
    border-radius: 24px;
  }
  .student-profile-preview-card__copy h2 {
    font-size: clamp(1.4rem, 1.8vw, 1.8rem);
  }
  .student-profile-appearance-card {
    padding: 14px 16px;
  }
  .student-profile-appearance-modal .student-avatar-grid {
    gap: 12px;
    max-height: min(52vh, 580px);
  }
  .student-profile-appearance-modal .student-avatar-option {
    min-height: 186px;
    padding: 12px;
    grid-template-rows: 96px auto;
    gap: 8px;
    border-radius: 20px;
  }
  .student-profile-appearance-modal .student-avatar-option__preview {
    width: 96px;
    min-width: 96px;
    height: 96px;
    min-height: 96px;
  }
}
@media (min-width: 1180px) and (max-height: 1120px) and (hover: hover) and (pointer: fine) {
  .student-profile-appearance-modal .student-avatar-grid {
    max-height: min(50vh, 540px);
  }
  .student-profile-appearance-modal .student-avatar-option {
    min-height: 172px;
    grid-template-rows: 88px auto;
  }
  .student-profile-appearance-modal .student-avatar-option__preview {
    width: 88px;
    min-width: 88px;
    height: 88px;
    min-height: 88px;
  }
}
@media (max-width: 1180px) {
  .student-profile-preview-card__hero {
    grid-template-columns: minmax(92px, 126px) minmax(0, 1fr) auto;
  }
  .student-profile-preview-card__avatar {
    width: min(100%, 122px);
  }
  .student-profile-appearance-card {
    grid-template-columns: 1fr;
  }
  .student-profile-appearance-card__meta {
    justify-content: flex-start;
  }
  .student-profile-appearance-modal__hero {
    grid-template-columns: 1fr;
  }
  .student-profile-appearance-modal .student-avatar-grid {
    max-height: min(50vh, 560px);
  }
  .student-profile-appearance-modal .student-avatar-option {
    min-height: 172px;
    grid-template-rows: 88px auto;
  }
  .student-profile-appearance-modal .student-avatar-option__preview {
    width: 88px;
    min-width: 88px;
    height: 88px;
    min-height: 88px;
  }
}
@media (max-width: 1080px) {
  .student-profile-appearance-modal .student-avatar-grid {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}
@media (max-width: 860px) {
  .student-profile-preview-card__hero,
  .student-profile-appearance-modal .student-theme-grid,
  .student-profile-appearance-modal .student-avatar-grid {
    grid-template-columns: 1fr;
  }
  .student-profile-preview-card__edit {
    justify-self: start;
  }
}
.student-profile-page--clean {
  gap: 16px;
}
.student-profile-form--surface {
  width: min(100%, 1120px);
  margin: 0 auto;
}
.student-profile-layout--clean {
  width: 100%;
  grid-template-columns: minmax(0, 1.06fr) minmax(320px, 0.94fr);
  gap: 18px;
  align-items: start;
}
.student-profile-layout--clean .student-profile-preview-card {
  gap: 18px;
  padding: 22px;
}
.student-profile-layout--clean .student-profile-preview-card__hero {
  grid-template-columns: minmax(136px, 176px) minmax(0, 1fr) auto;
  align-items: start;
}
.student-profile-layout--clean .student-profile-preview-card__avatar {
  width: min(100%, 168px);
}
.student-profile-preview-card__progress {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 20px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: linear-gradient(
    180deg,
    #ffffffd1,
    color-mix(in srgb, white 82%, var(--student-theme-secondary, #dce6ff) 18%)
  );
}
:is(
  .student-profile-preview-card__progress-head,
  .student-profile-preview-card__progress-foot,
  .student-profile-preview-card__footer
) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.student-profile-preview-card__progress-head strong {
  font-size: 1rem;
}
.student-profile-preview-card__progress-foot {
  font-size: 0.82rem;
  color: #1b2a44b8;
}
.student-profile-preview-card__footer {
  align-items: end;
}
.student-profile-preview-card__status {
  max-width: 28ch;
  font-size: 0.92rem;
  line-height: 1.4;
}
.student-profile-layout--clean .student-theme-preview-panel {
  gap: 16px;
  padding: 22px;
}
.student-theme-preview-panel__summary {
  margin: 4px 0 0;
  max-width: 28ch;
}
.student-profile-layout--clean .student-theme-preview-panel__stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.student-profile-appearance-modal__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  gap: 14px;
  align-items: stretch;
}

/* 19.9.4 — compact learner profile with Identity, Theme and Progress only. */
.student-profile-page--player-setup .student-profile-form--surface {
  min-height: 0;
  gap: 12px;
}
.student-profile-page--player-setup .student-profile-guide {
  padding: 18px 20px;
}
.student-profile-compact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
  min-width: 0;
}
.student-profile-compact-grid > *,
.student-profile-section,
.student-profile-section__heading,
.student-profile-identity__copy {
  min-width: 0;
}
.student-profile-section {
  height: auto;
  min-height: 0;
  padding: 18px;
  border-color: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 18%, var(--line-default) 82%);
}
.student-profile-section--identity,
.student-profile-section--theme {
  min-height: 238px;
}
.student-profile-section--progress {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1.28fr);
  gap: 16px 22px;
  align-items: center;
}
.student-profile-section__header {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: start;
  gap: 11px;
}
.student-profile-section__icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 42%, var(--bg-panel) 58%);
  color: var(--student-theme-strong, #274694);
  font-size: 1.35rem;
}
.student-profile-section__heading {
  display: grid;
  gap: 3px;
}
.student-profile-section__heading h2,
.student-profile-section__heading p {
  margin: 0;
}
.student-profile-section__heading h2 {
  font-size: clamp(1.25rem, 2.1vw, 1.65rem);
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.student-profile-section__heading p {
  line-height: 1.38;
  overflow-wrap: anywhere;
}
.student-profile-section__action {
  min-width: max-content;
  min-height: 44px;
  align-self: start;
}
.student-profile-identity {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
}
.student-profile-identity__avatar,
.student-profile-identity__avatar .learner-avatar {
  width: 104px;
  height: 104px;
}
.student-profile-identity__avatar .learner-avatar {
  border-radius: 28px;
  overflow: hidden;
  background: linear-gradient(145deg, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 58%, white 42%), color-mix(in srgb, var(--bg-panel-2) 86%, var(--student-theme-primary, #5a78ff) 14%));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--student-theme-primary, #5a78ff) 16%, transparent);
}
.student-profile-identity__avatar .learner-avatar__fallback {
  font-size: 2rem;
  font-weight: 900;
}
.student-profile-identity__copy {
  display: grid;
  gap: 4px;
}
.student-profile-identity__copy h2,
.student-profile-identity__copy p {
  margin: 0;
}
.student-profile-identity__copy h2 {
  font-size: clamp(1.45rem, 2.8vw, 2rem);
  line-height: 1.04;
  overflow-wrap: anywhere;
}
.student-profile-identity__context {
  color: var(--text-strong);
  font-weight: 750;
  overflow-wrap: anywhere;
}
.student-profile-identity__copy .muted {
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.student-profile-identity__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 13px;
}
.student-profile-theme-mini-preview {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(150px, 0.75fr);
  gap: 12px;
  margin-top: 16px;
}
.student-profile-theme-mini-preview__route {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 14%, var(--line-default) 86%);
  border-radius: 17px;
  background: color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 18%, var(--bg-panel) 82%);
}
.student-profile-theme-mini-preview__step {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 5px;
  min-width: 0;
  text-align: center;
}
.student-profile-theme-mini-preview__step > span {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 18%, var(--line-default) 82%);
  background: var(--bg-panel);
}
.student-profile-theme-mini-preview__step.is-current > span {
  background: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 13%, var(--bg-panel) 87%);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--student-theme-primary, #5a78ff) 14%, transparent);
}
.student-profile-theme-mini-preview__step strong {
  min-width: 0;
  font-size: 0.72rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.student-profile-theme-mini-preview__mission {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 14%, var(--line-default) 86%);
  border-radius: 17px;
  background: var(--bg-panel);
}
.student-profile-theme-mini-preview__mission strong,
.student-profile-theme-mini-preview__mission small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.student-profile-theme-mini-preview__mission small {
  color: var(--text-muted);
  line-height: 1.35;
}
.student-profile-progress-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.student-profile-progress-kpis > div {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 11px 12px;
  border: 1px solid var(--line-default);
  border-radius: 15px;
  background: color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 13%, var(--bg-panel) 87%);
}
.student-profile-progress-kpis span {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
}
.student-profile-progress-kpis strong {
  min-width: 0;
  color: var(--text-strong);
  font-size: 1.12rem;
  overflow-wrap: anywhere;
}
.student-profile-progress-bar {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid var(--line-default);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg-panel-2) 70%, var(--bg-panel) 30%);
}
.student-profile-progress-bar__head,
.student-profile-progress-bar__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.student-profile-progress-bar__foot {
  color: var(--text-muted);
  font-size: 0.76rem;
}
.student-profile-progress-bar__foot span {
  min-width: 0;
  overflow-wrap: anywhere;
}
@media (max-width: 980px) {
  .student-profile-compact-grid {
    grid-template-columns: 1fr;
  }
  .student-profile-section--progress {
    grid-column: auto;
  }
}
@media (max-width: 720px) {
  .student-profile-page--player-setup .student-profile-guide {
    padding: 16px;
  }
  .student-profile-section {
    padding: 15px;
  }
  .student-profile-section--identity,
  .student-profile-section--theme {
    min-height: 0;
  }
  .student-profile-identity {
    grid-template-columns: 76px minmax(0, 1fr);
  }
  .student-profile-identity__avatar,
  .student-profile-identity__avatar .learner-avatar {
    width: 76px;
    height: 76px;
  }
  .student-profile-section__action,
  .student-profile-identity > .student-profile-section__action {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
    justify-content: center;
  }
  .student-profile-section__header {
    grid-template-columns: 44px minmax(0, 1fr);
  }
  .student-profile-section__header > .student-profile-section__action {
    grid-column: 1 / -1;
  }
  .student-profile-theme-mini-preview {
    grid-template-columns: 1fr;
  }
  .student-profile-section--progress {
    grid-template-columns: 1fr;
  }
  .student-profile-progress-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-profile-progress-kpis > div:last-child {
    grid-column: 1 / -1;
  }
  .student-profile-progress-bar__foot {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }
}

.student-profile-appearance-modal__controls {
  display: grid;
  grid-template-rows: minmax(58px, 1fr) minmax(58px, 1fr);
  gap: 12px;
  align-content: stretch;
  align-self: stretch;
  min-height: 148px;
}
.student-profile-appearance-modal__switchers {
  min-height: 0;
}
.student-profile-appearance-modal__controls .student-segmented {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  min-height: 100%;
}
.student-profile-appearance-modal__controls .student-segmented__button {
  min-height: 100%;
  padding: 0 14px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.student-profile-modal-field {
  display: grid;
  gap: 8px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid rgba(27, 42, 68, 0.08);
  background: linear-gradient(180deg, #fffffff0, #ffffffd6);
}
.student-profile-modal-field span {
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #1b2a44bd;
}
.student-profile-modal-field input {
  min-height: 52px;
}
.student-profile-modal-save-top {
  width: 100%;
  min-height: 100%;
}
.student-profile-appearance-modal__panel .student-theme-grid {
  gap: 12px;
}
.student-profile-appearance-modal
  [data-view-panel="profile-appearance"][data-view-value="theme"] {
  max-height: min(54vh, 620px);
  overflow: auto;
  padding-right: 6px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.student-profile-appearance-modal
  [data-view-panel="profile-appearance"][data-view-value="theme"]::-webkit-scrollbar {
  width: 10px;
}
.student-profile-appearance-modal
  [data-view-panel="profile-appearance"][data-view-value="theme"]::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(27, 42, 68, 0.12)
  );
}
.student-profile-preview-card--modal {
  gap: 10px;
  min-height: 148px;
}
.student-profile-preview-card--modal .student-profile-preview-card__hero {
  grid-template-columns: 104px minmax(0, 1fr) minmax(220px, 250px);
  gap: 12px;
  align-items: center;
  min-height: 100%;
}
.student-profile-preview-card--modal .student-profile-preview-card__avatar {
  width: 104px;
  border-radius: 22px;
}
.student-profile-preview-card--modal .student-profile-preview-card__copy {
  gap: 4px;
  min-width: 0;
}
.student-profile-preview-card--modal .student-profile-preview-card__copy .muted,
.student-profile-preview-card--modal .student-profile-preview-card__chips {
  display: none;
}
.student-profile-modal-field--inline {
  align-self: stretch;
  align-content: center;
  min-width: 0;
  padding: 14px 16px;
}
.student-profile-modal-field--inline input {
  min-height: 52px;
}
.student-profile-appearance-modal .student-avatar-option {
  min-height: 124px;
  padding: 10px;
  display: grid;
  place-items: center;
  grid-template-rows: 1fr;
}
.student-profile-appearance-modal .student-avatar-option__copy,
.student-profile-appearance-modal .student-avatar-option__label,
.student-profile-appearance-modal .student-avatar-option__meta {
  display: none;
}
.student-profile-appearance-modal .student-avatar-option__preview {
  width: 92px;
  min-width: 92px;
  height: 92px;
  min-height: 92px;
  margin: 0 auto;
}
.student-profile-appearance-modal-card {
  width: min(980px, 100%);
}
@media (max-width: 1180px) {
  .student-profile-layout--clean {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.9fr);
  }
  .student-profile-layout--clean .student-profile-preview-card {
    padding: 20px;
  }
  .student-profile-layout--clean .student-profile-preview-card__hero {
    grid-template-columns: minmax(120px, 156px) minmax(0, 1fr) auto;
  }
  .student-profile-layout--clean .student-profile-preview-card__avatar {
    width: min(100%, 150px);
  }
  .student-profile-appearance-modal__top {
    grid-template-columns: 1fr;
  }
  .student-profile-appearance-modal__controls {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .student-profile-appearance-modal
    [data-view-panel="profile-appearance"][data-view-value="theme"] {
    max-height: min(50vh, 560px);
  }
}
@media (max-width: 1080px) {
  .student-profile-layout--clean {
    grid-template-columns: 1fr;
  }
  .student-profile-layout--clean .student-profile-side__rail {
    position: static;
    top: auto;
  }
  .student-profile-appearance-modal
    [data-view-panel="profile-appearance"][data-view-value="theme"] {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}
@media (max-width: 860px) {
  .student-profile-preview-card--modal .student-profile-preview-card__hero,
  .student-profile-layout--clean .student-profile-preview-card__hero {
    grid-template-columns: 1fr;
  }
  :is(
    .student-profile-preview-card__progress-head,
    .student-profile-preview-card__progress-foot
  ) {
    flex-direction: column;
    align-items: flex-start;
  }
  .student-profile-layout--clean .student-theme-preview-panel__stats {
    grid-template-columns: 1fr;
  }
  .student-profile-preview-card__edit {
    width: 52px;
    min-width: 52px;
    height: 52px;
  }
}
@media (max-width: 720px) {
  .student-licence-card__action-buttons {
    width: 100%;
  }
  .student-home-command-card__mission {
    margin-bottom: 12px;
  }
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme] {
  --student-theme-dark-border: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(188, 198, 230, 0.18)
  );
  --student-theme-dark-surface: color-mix(
    in srgb,
    rgba(12, 19, 34, 0.96) 82%,
    var(--student-theme-primary, #5a78ff) 18%
  );
  --student-theme-dark-surface-soft: color-mix(
    in srgb,
    rgba(8, 14, 25, 0.96) 88%,
    var(--student-theme-secondary, #dce6ff) 12%
  );
  --student-theme-dark-chip: color-mix(
    in srgb,
    rgba(255, 255, 255, 0.08) 74%,
    var(--student-theme-primary, #5a78ff) 26%
  );
  --student-theme-dark-chip-border: color-mix(
    in srgb,
    rgba(255, 255, 255, 0.14) 62%,
    var(--student-theme-primary, #5a78ff) 38%
  );
  --student-theme-dark-strong: color-mix(
    in srgb,
    white 88%,
    var(--student-theme-secondary, #dce6ff) 12%
  );
  --student-theme-dark-muted: rgba(226, 235, 255, 0.82);
  --student-theme-dark-glow: color-mix(
    in srgb,
    rgba(0, 0, 0, 0.34) 44%,
    var(--student-theme-primary, #5a78ff) 56%
  );
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  :is(.student-home-hero, .student-profile-banner) {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 22%,
        transparent
      ),
      transparent 40%
    ),
    linear-gradient(
      140deg,
      var(--student-theme-dark-surface),
      var(--student-theme-dark-surface-soft)
    );
  box-shadow: 0 22px 48px var(--student-theme-dark-glow);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission__card,
    .student-theme-preview-panel,
    .student-profile-note,
    .student-profile-command,
    .student-profile-preview-card,
    .student-profile-appearance-card,
    .student-profile-appearance-modal__preview,
    .student-profile-appearance-modal__aside
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(188, 198, 230, 0.16)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(19, 28, 48, 0.96) 82%,
      var(--student-theme-primary, #5a78ff) 18%
    ),
    #0a101ef2
  );
  box-shadow: 0 18px 40px #00000038;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  :is(
    .student-level-badge,
    .student-licence-card__meter,
    .student-inline-metric,
    .student-metric-chip,
    .student-badge-chip,
    .student-pill,
    .student-pill--soft,
    .student-hero-avatar,
    .student-progress-track__marker,
    .student-home-mission__icon,
    .student-theme-preview-panel__icon,
    .student-level-badge__token
  ) {
  background: var(--student-theme-dark-chip);
  border-color: var(--student-theme-dark-chip-border);
  color: var(--student-theme-dark-strong);
  box-shadow:
    0 0 0 1px
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 20%,
        rgba(255, 255, 255, 0.08)
      ),
    0 12px 28px
      color-mix(
        in srgb,
        rgba(0, 0, 0, 0.18) 50%,
        var(--student-theme-primary, #5a78ff) 50%
      );
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  :is(
    .student-metric-chip__label,
    .student-metric-chip__meta,
    .student-level-badge__copy small,
    .student-gap-card__label,
    .student-inline-label,
    .student-inline-metric__label,
    .student-inline-metric__meta,
    .student-theme-card__copy span,
    .student-theme-card__footer span,
    .student-theme-preview-stat span,
    .student-theme-preview-stat small
  ) {
  color: var(--student-theme-dark-muted);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  :is(
    .student-card h1,
    .student-card h2,
    .student-card h3,
    .student-card strong,
    .student-licence-card h1,
    .student-licence-card h2,
    .student-licence-card h3,
    .student-licence-card strong,
    .student-inline-metric__value,
    .student-theme-card__state,
    .student-theme-card__footer strong,
    .student-theme-preview-stat strong
  ) {
  color: var(--student-theme-dark-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(188, 198, 230, 0.18)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(21, 30, 50, 0.98) 84%,
      var(--student-theme-primary, #5a78ff) 16%
    ),
    #0b1220fa
  );
  color: var(--text-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(.student-profile-preview-card, .student-profile-modal-field) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 30%,
    rgba(188, 198, 230, 0.18)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(24, 35, 58, 0.98) 78%,
      var(--student-theme-secondary, #dce6ff) 22%
    ),
    #0c1220f5
  );
  color: var(--text-strong);
  box-shadow: 0 16px 34px #00000038;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(
    .student-profile-preview-card h1,
    .student-profile-preview-card h2,
    .student-profile-preview-card h3,
    .student-profile-modal-field input
  ) {
  color: var(--text-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(.student-profile-preview-card .muted, .student-profile-modal-field span) {
  color: var(--text-muted);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(
    .student-profile-command-token,
    .student-theme-command-tile,
    .student-theme-mode-preview,
    .student-profile-preview-card__ready,
    .student-profile-summary-card,
    .student-theme-scene__route,
    .student-theme-scene__mission,
    .student-profile-preview-card__progress,
    .student-avatar-option
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(188, 198, 230, 0.16)
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 14%,
        transparent
      ),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(18, 27, 45, 0.96) 82%,
        var(--student-theme-primary, #5a78ff) 18%
      ),
      #0a101ef5
    );
  box-shadow:
    0 14px 30px #00000038,
    inset 0 1px #ffffff0d;
  color: var(--text-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-profile-preview-card__avatar {
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 24%,
      rgba(188, 198, 230, 0.16)
    );
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.08),
      transparent 48%
    ),
    linear-gradient(160deg, #141d34fa, #0b111ffa);
  box-shadow:
    0 16px 34px #00000042,
    inset 0 1px #ffffff0f;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-profile-preview-card__avatar
  .learner-avatar__fallback {
  color: var(--text-strong);
  opacity: 1;
  text-shadow: none;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(
    .student-profile-command-token small,
    .student-theme-command-tile span,
    .student-theme-mode-preview span,
    .student-profile-summary-card span,
    .student-profile-summary-card small,
    .student-theme-scene__step small,
    .student-theme-scene__mission p,
    .student-profile-preview-card__context,
    .student-profile-preview-card__progress-foot,
    .student-theme-card__copy span,
    .student-theme-card__footer span,
    .student-avatar-option__meta
  ) {
  color: var(--text-muted);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(
    .student-profile-command-token strong,
    .student-theme-command-tile strong,
    .student-profile-preview-card__ready,
    .student-profile-summary-card strong,
    .student-theme-scene__step strong,
    .student-theme-scene__mission strong,
    .student-profile-preview-card__progress-head strong,
    .student-theme-card__copy strong,
    .student-theme-card__state,
    .student-theme-card__footer strong,
    .student-avatar-option__label
  ) {
  color: var(--text-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-theme-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 30%,
    rgba(188, 198, 230, 0.18)
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 16%,
        transparent
      ),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(18, 27, 45, 0.96) 82%,
        var(--student-theme-primary, #5a78ff) 18%
      ),
      #0a101ef5
    );
  box-shadow: 0 12px 28px #0000003d;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-theme-card:is(:hover, :focus-visible) {
  box-shadow: 0 18px 36px #0000004d;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-theme-card.is-active {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 48%,
    rgba(230, 236, 255, 0.7)
  );
  box-shadow: 0 22px 40px #00000052;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  :is(.student-theme-card__icon, .student-theme-scene__dot) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 26%,
    rgba(188, 198, 230, 0.16)
  );
  background: color-mix(
    in srgb,
    rgba(24, 35, 60, 0.98) 78%,
    var(--student-theme-primary, #5a78ff) 22%
  );
  color: var(--text-strong);
  box-shadow:
    inset 0 0 0 1px #ffffff0f,
    0 10px 22px #0000003d;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-theme-scene__line {
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(188, 198, 230, 0.16)
  );
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-segmented__button {
  background: #ffffff0d;
  border-color: #91aaff29;
  color: var(--text-muted);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-segmented__button.is-active {
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 18%,
        transparent
      ),
      transparent 46%
    ),
    linear-gradient(180deg, #1c2845fa, #0f1627fa);
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(230, 236, 255, 0.48)
  );
  color: var(--text-strong);
  box-shadow: 0 10px 22px #00000038;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-appearance-modal-card
  .student-profile-modal-field
  input {
  background: #232f52c7;
  border-color: #91aaff2e;
  color: var(--text-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  :is(
    .student-progress-track > span,
    .student-progress-track--challenge > span
  ) {
  background: linear-gradient(
    90deg,
    color-mix(in srgb, white 16%, var(--student-theme-primary, #5a78ff) 84%),
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 58%,
      var(--student-theme-strong, #274694) 42%
    )
  );
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  .student-progress-track {
  background: #ffffff1f;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  .student-theme-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 30%,
    rgba(188, 198, 230, 0.18)
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 18%,
        transparent
      ),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(18, 27, 45, 0.96) 80%,
        var(--student-theme-primary, #5a78ff) 20%
      ),
      #0a101ef5
    );
  box-shadow: 0 12px 28px #00000038;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  .student-theme-card:is(:hover, :focus-visible) {
  box-shadow: 0 18px 36px var(--student-theme-dark-glow);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  .student-theme-card.is-active {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 48%,
    rgba(230, 236, 255, 0.7)
  );
  box-shadow: 0 22px 40px var(--student-theme-dark-glow);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-shell[data-learner-theme]
  .student-theme-preview-stat {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(188, 198, 230, 0.16)
  );
  background: color-mix(
    in srgb,
    rgba(12, 18, 33, 0.88) 82%,
    var(--student-theme-primary, #5a78ff) 18%
  );
}
@media (max-width: 560px) {
  .student-profile-layout {
    gap: 14px;
  }
  .student-theme-card {
    padding: 13px;
  }
  .student-theme-card__top {
    grid-template-columns: auto 1fr;
  }
  .student-theme-card__state {
    grid-column: 1 / -1;
  }
  .student-theme-preview-panel__stats {
    gap: 8px;
  }
}
html[data-appearance="dark"] body.portal-public,
html[data-theme="dark"] body.portal-public,
body.theme-dark.portal-public {
  --accent-teal: #5d7a78;
  background:
    radial-gradient(
      circle at top left,
      rgba(58, 76, 126, 0.34),
      transparent 28%
    ),
    radial-gradient(
      circle at top right,
      rgba(119, 102, 79, 0.18),
      transparent 22%
    ),
    linear-gradient(180deg, #0f1627, #121a2d 32%, #0d1423);
}
html[data-appearance="dark"] body.portal-public:before,
html[data-theme="dark"] body.portal-public:before,
body.theme-dark.portal-public:before {
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.03),
      rgba(255, 255, 255, 0) 26%,
      transparent 52%
    ),
    repeating-linear-gradient(
      90deg,
      rgba(163, 178, 225, 0.06),
      rgba(163, 178, 225, 0.06) 1px,
      transparent 1px,
      transparent 140px
    );
  opacity: 0.82;
}
html[data-appearance="dark"] body.portal-public:after,
html[data-theme="dark"] body.portal-public:after,
body.theme-dark.portal-public:after {
  background:
    radial-gradient(
      circle at 16% 18%,
      rgba(69, 87, 145, 0.26),
      transparent 0 22%
    ),
    radial-gradient(
      circle at 84% 12%,
      rgba(121, 104, 86, 0.14),
      transparent 0 18%
    );
}
html[data-appearance="dark"]
  body.portal-public
  .mp-topbar--public-home
  .mp-topbar__inner,
html[data-theme="dark"]
  body.portal-public
  .mp-topbar--public-home
  .mp-topbar__inner,
body.theme-dark.portal-public .mp-topbar--public-home .mp-topbar__inner {
  border-color: #bcc6e624;
  background: #131b2ec7;
  box-shadow: 0 18px 44px #00000047;
}
html[data-appearance="dark"]
  body.portal-public
  .mp-topbar--public-home
  .mp-topbar__utility-pill,
html[data-theme="dark"]
  body.portal-public
  .mp-topbar--public-home
  .mp-topbar__utility-pill,
body.theme-dark.portal-public .mp-topbar--public-home .mp-topbar__utility-pill {
  background: #1c263ee0;
  border-color: #bcc6e624;
}
html[data-appearance="dark"]
  body.portal-public
  .mp-topbar--public-home
  .mp-public-auth-actions
  .mp-inline-link--strong,
html[data-theme="dark"]
  body.portal-public
  .mp-topbar--public-home
  .mp-public-auth-actions
  .mp-inline-link--strong,
body.theme-dark.portal-public
  .mp-topbar--public-home
  .mp-public-auth-actions
  .mp-inline-link--strong {
  background: linear-gradient(180deg, #37497ba8, #1c2741eb);
  border-color: #9db0e838;
  box-shadow: 0 14px 28px #00000042;
}
html[data-appearance="dark"]
  body.portal-public
  .mp-topbar--public-auth
  .mp-topbar__inner,
html[data-theme="dark"]
  body.portal-public
  .mp-topbar--public-auth
  .mp-topbar__inner,
body.theme-dark.portal-public .mp-topbar--public-auth .mp-topbar__inner {
  box-shadow: 0 16px 34px #0000003d;
}
html[data-appearance="dark"]
  body.portal-public
  .mp-topbar--public-auth
  .mp-topbar__utility-pill,
html[data-theme="dark"]
  body.portal-public
  .mp-topbar--public-auth
  .mp-topbar__utility-pill,
body.theme-dark.portal-public .mp-topbar--public-auth .mp-topbar__utility-pill {
  background: #1c263ed1;
}
html[data-appearance="dark"]
  body.portal-public
  .mp-topbar--public-auth
  .mp-public-auth-actions
  .mp-inline-link--strong,
html[data-theme="dark"]
  body.portal-public
  .mp-topbar--public-auth
  .mp-public-auth-actions
  .mp-inline-link--strong,
body.theme-dark.portal-public
  .mp-topbar--public-auth
  .mp-public-auth-actions
  .mp-inline-link--strong {
  background: #253254e6;
  border-color: #9db0e833;
}
html[data-appearance="dark"] body.portal-public .homepage-hero--landing,
html[data-theme="dark"] body.portal-public .homepage-hero--landing,
body.theme-dark.portal-public .homepage-hero--landing {
  border-color: #bcc6e629;
  background:
    linear-gradient(150deg, #131c30f0, #0f1727f7 52%, #0b121ffa),
    linear-gradient(180deg, #ffffff0a, #fff0);
  box-shadow: 0 30px 68px #00000057;
}
html[data-appearance="dark"] body.portal-public .homepage-hero--landing:before,
html[data-theme="dark"] body.portal-public .homepage-hero--landing:before,
body.theme-dark.portal-public .homepage-hero--landing:before {
  background:
    radial-gradient(
      circle at 18% 18%,
      rgba(84, 103, 170, 0.16),
      transparent 0 24%
    ),
    radial-gradient(
      circle at 78% 86%,
      rgba(104, 140, 126, 0.08),
      transparent 0 26%
    );
}
html[data-appearance="dark"] body.portal-public .homepage-btn--primary,
html[data-theme="dark"] body.portal-public .homepage-btn--primary,
body.theme-dark.portal-public .homepage-btn--primary {
  background: linear-gradient(180deg, #5875c4, #3a517f);
  box-shadow: 0 16px 30px #0a0e1852;
}
html[data-appearance="dark"] body.portal-public .homepage-btn--secondary,
html[data-theme="dark"] body.portal-public .homepage-btn--secondary,
body.theme-dark.portal-public .homepage-btn--secondary {
  background: #1c263edb;
  border-color: #bcc6e629;
  color: var(--text-strong);
  box-shadow: inset 0 1px #ffffff0d;
}
html[data-appearance="dark"]
  body.portal-public
  .homepage-proof-strip--landing
  .homepage-proof-pill,
html[data-theme="dark"]
  body.portal-public
  .homepage-proof-strip--landing
  .homepage-proof-pill,
body.theme-dark.portal-public
  .homepage-proof-strip--landing
  .homepage-proof-pill {
  border-color: #bcc6e629;
  background: #1e2841d6;
  color: var(--text-body);
}
html[data-appearance="dark"]
  body.portal-public
  :is(
    .homepage-section__eyebrow,
    .homepage-card__eyebrow,
    .landing-showcase__eyebrow
  ),
html[data-theme="dark"]
  body.portal-public
  :is(
    .homepage-section__eyebrow,
    .homepage-card__eyebrow,
    .landing-showcase__eyebrow
  ),
body.theme-dark.portal-public
  :is(
    .homepage-section__eyebrow,
    .homepage-card__eyebrow,
    .landing-showcase__eyebrow
  ) {
  color: color-mix(in srgb, var(--text-soft) 90%, white 10%);
}
html[data-appearance="dark"]
  body.portal-public
  :is(
    .landing-showcase__browser,
    .landing-proof-card,
    .public-band--soft,
    .auth-split--premium,
    .auth-panel,
    .auth-aside,
    .homepage-shell--v18-6-14 .homepage-card,
    .homepage-shell--v18-6-14 .homepage-journey-card,
    .landing-reason-card
  ),
html[data-theme="dark"]
  body.portal-public
  :is(
    .landing-showcase__browser,
    .landing-proof-card,
    .public-band--soft,
    .auth-split--premium,
    .auth-panel,
    .auth-aside,
    .homepage-shell--v18-6-14 .homepage-card,
    .homepage-shell--v18-6-14 .homepage-journey-card,
    .landing-reason-card
  ),
body.theme-dark.portal-public
  :is(
    .landing-showcase__browser,
    .landing-proof-card,
    .public-band--soft,
    .auth-split--premium,
    .auth-panel,
    .auth-aside,
    .homepage-shell--v18-6-14 .homepage-card,
    .homepage-shell--v18-6-14 .homepage-journey-card,
    .landing-reason-card
  ) {
  border-color: #bcc6e624;
  background: linear-gradient(180deg, #171f35f0, #101829f5);
  box-shadow: 0 18px 40px #0000003d;
}
html[data-appearance="dark"]
  body.portal-public
  :is(.landing-showcase__stage, .landing-proof-card__media),
html[data-theme="dark"]
  body.portal-public
  :is(.landing-showcase__stage, .landing-proof-card__media),
body.theme-dark.portal-public
  :is(.landing-showcase__stage, .landing-proof-card__media) {
  border-color: #bcc6e61f;
  background: #090e19eb;
}
html[data-appearance="dark"]
  body.portal-public
  :is(
    .landing-showcase__mode-trigger,
    .auth-chip,
    .auth-point,
    .auth-support-card,
    .auth-panel .inline-notice
  ),
html[data-theme="dark"]
  body.portal-public
  :is(
    .landing-showcase__mode-trigger,
    .auth-chip,
    .auth-point,
    .auth-support-card,
    .auth-panel .inline-notice
  ),
body.theme-dark.portal-public
  :is(
    .landing-showcase__mode-trigger,
    .auth-chip,
    .auth-point,
    .auth-support-card,
    .auth-panel .inline-notice
  ) {
  border-color: #bcc6e624;
  background: #1f2a45d6;
}
html[data-appearance="dark"]
  body.portal-public
  .homepage-journey-card--route
  .btn,
html[data-theme="dark"] body.portal-public .homepage-journey-card--route .btn,
body.theme-dark.portal-public .homepage-journey-card--route .btn {
  background: #1f2a45db;
  border-color: #bcc6e624;
  color: var(--text-strong);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-showcase__mode-trigger:hover,
html[data-theme="dark"]
  body.portal-public
  .landing-showcase__mode-trigger:hover,
body.theme-dark.portal-public .landing-showcase__mode-trigger:hover {
  border-color: #9eb1ea3d;
  background: #2c3a5feb;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-showcase__mode-trigger.is-active,
html[data-theme="dark"]
  body.portal-public
  .landing-showcase__mode-trigger.is-active,
body.theme-dark.portal-public .landing-showcase__mode-trigger.is-active {
  border-color: #9eb1ea42;
  background: linear-gradient(180deg, #485c96ad, #283558e6);
  box-shadow: inset 0 1px #ffffff14;
}
html[data-appearance="dark"]
  body.portal-public
  :is(.homepage-card__icon, .landing-reason-card__icon),
html[data-theme="dark"]
  body.portal-public
  :is(.homepage-card__icon, .landing-reason-card__icon),
body.theme-dark.portal-public
  :is(.homepage-card__icon, .landing-reason-card__icon) {
  background: linear-gradient(180deg, #4258918a, #1f2b48e6);
  color: #dce5ff;
  box-shadow:
    inset 0 1px #ffffff0d,
    0 10px 24px #00000038;
}
html[data-appearance="dark"] body.portal-public .auth-tabs,
html[data-theme="dark"] body.portal-public .auth-tabs,
body.theme-dark.portal-public .auth-tabs {
  border-color: #bcc6e624;
  background: #131c30e6;
}
html[data-appearance="dark"] body.portal-public .auth-switch__tab,
html[data-theme="dark"] body.portal-public .auth-switch__tab,
body.theme-dark.portal-public .auth-switch__tab {
  color: var(--text-body);
}
html[data-appearance="dark"] body.portal-public .auth-switch__tab.is-active,
html[data-theme="dark"] body.portal-public .auth-switch__tab.is-active,
html[data-appearance="dark"]
  body.portal-public
  .auth-switch__tab[aria-selected="true"],
html[data-theme="dark"]
  body.portal-public
  .auth-switch__tab[aria-selected="true"],
body.theme-dark.portal-public .auth-switch__tab.is-active,
body.theme-dark.portal-public .auth-switch__tab[aria-selected="true"] {
  background: linear-gradient(180deg, #3e5185c2, #212d4af0);
  color: var(--text-strong);
  box-shadow: 0 10px 20px #00000038;
}
html[data-appearance="dark"] body.portal-public .auth-panel :is(input, select),
html[data-theme="dark"] body.portal-public .auth-panel :is(input, select),
body.theme-dark.portal-public .auth-panel :is(input, select) {
  border-color: #bcc6e629;
  background-color: #0e1627eb;
  color: var(--text-strong);
  box-shadow: inset 0 1px #ffffff08;
}
html[data-appearance="dark"]
  body.portal-public
  .auth-panel
  :is(input, select)::placeholder,
html[data-theme="dark"]
  body.portal-public
  .auth-panel
  :is(input, select)::placeholder,
body.theme-dark.portal-public .auth-panel :is(input, select)::placeholder {
  color: color-mix(in srgb, var(--text-soft) 88%, transparent);
}
html[data-appearance="dark"] body.portal-public .auth-point .status-pill:before,
html[data-theme="dark"] body.portal-public .auth-point .status-pill:before,
body.theme-dark.portal-public .auth-point .status-pill:before {
  background: #9eb1ea;
}
.student-inline-links--wrap {
  flex-wrap: wrap;
}
.student-sudoku-page {
  gap: var(--space-6);
}
.student-sudoku-page--hub,
.student-sudoku-page--wizard,
.student-sudoku-page--play {
  gap: var(--space-5);
}
.student-sudoku-hub-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(280px, 0.88fr);
  gap: var(--space-5);
  align-items: start;
}
.student-sudoku-hub-main {
  display: grid;
  gap: var(--space-4);
}
.student-sudoku-flow-list,
.student-sudoku-overview-list {
  display: grid;
  gap: 12px;
}
.student-sudoku-flow-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  padding: 14px 16px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 12%, var(--line-default) 88%);
  background: color-mix(in srgb, var(--brand-50) 62%, var(--bg-panel) 38%);
}
.student-sudoku-overview-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  padding: 14px 16px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 12%, var(--line-default) 88%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--brand-50) 36%, var(--bg-panel) 64%)
  );
}
.student-sudoku-overview-row__main {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-sudoku-stepper {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.student-sudoku-stepper__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 12%, var(--line-default) 88%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  color: var(--text-soft);
}
.student-sudoku-stepper__item.is-active {
  border-color: color-mix(
    in srgb,
    var(--brand-600) 32%,
    var(--line-default) 68%
  );
  background: color-mix(in srgb, var(--brand-50) 68%, var(--bg-panel) 32%);
  color: var(--text-strong);
}
.student-sudoku-stepper__item.is-complete {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 18%,
    var(--line-default) 82%
  );
  color: var(--text-body);
}
.student-sudoku-stepper__index {
  display: inline-grid;
  place-items: center;
  inline-size: 28px;
  block-size: 28px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-100) 60%, white 40%);
  color: var(--brand-800);
  font-weight: 800;
}
.student-sudoku-stepper__label {
  font-weight: 700;
}
.student-sudoku-shell--play .student-section-hero--action-first {
  padding-block: 12px;
}
.student-sudoku-shell--play .student-section-hero__header,
.student-sudoku-shell--play .student-section-hero__main--action-first {
  gap: 8px;
}
.student-sudoku-shell--play .student-sudoku-main-grid {
  gap: var(--space-4);
}
.student-sudoku-shell--play .student-sudoku-game-card .section-header {
  margin-bottom: 8px;
}
.student-sudoku-shell--play .student-sudoku-game-card .section-header p {
  max-width: 48ch;
}
.student-sudoku-level-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(196px, 1fr));
  gap: var(--space-4);
}
.student-sudoku-level-card {
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 74%, var(--bg-panel) 26%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  border-radius: var(--radius-3);
  padding: 18px;
  display: grid;
  gap: 10px;
  min-height: 214px;
  text-align: left;
  color: var(--text-strong);
  text-decoration: none;
  cursor: pointer;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}
.student-sudoku-level-card[data-tone="sage"] {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #dbead8 52%, white 48%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.student-sudoku-level-card[data-tone="gold"] {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #f4e2b2 58%, white 42%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.student-sudoku-level-card[data-tone="slate"] {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #d7deeb 58%, white 42%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.student-sudoku-level-card:hover,
.student-sudoku-level-card:focus-visible,
.student-sudoku-level-card.is-active {
  transform: translateY(-2px);
  border-color: color-mix(
    in srgb,
    var(--brand-600) 34%,
    var(--line-default) 66%
  );
  box-shadow: 0 18px 34px color-mix(in srgb, var(--brand-500) 20%, transparent);
}
.student-sudoku-level-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.student-sudoku-level-card__estimate {
  font-size: 0.8rem;
  color: var(--text-soft);
}
.student-sudoku-level-card__detail {
  color: var(--text-body);
  font-size: 0.9rem;
  line-height: 1.4;
}
.student-sudoku-level-card__map-label {
  color: var(--text-soft);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.student-sudoku-level-card__map {
  color: var(--text-strong);
  font-size: 0.86rem;
  line-height: 1.4;
}
.student-sudoku-level-card__meta {
  margin-top: auto;
  color: var(--text-soft);
  font-size: 0.88rem;
}
@media (max-width: 680px) {
  .student-game-hub-card .student-practice-start-grid,
  .student-game-hub-card .student-practice-start-grid--games,
  .student-sudoku-level-grid {
    grid-template-columns: 1fr;
  }
  .student-hero-preview__frame {
    block-size: auto;
    min-height: 164px;
  }
  .student-sudoku-level-card {
    min-height: auto;
  }
}
.student-sudoku-setup-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(280px, 0.88fr);
  gap: var(--space-5);
  align-items: start;
}
.student-sudoku-setup-form {
  display: grid;
  gap: var(--space-5);
}
.student-sudoku-setup-step {
  display: grid;
  gap: var(--space-4);
}
.student-sudoku-setup-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.student-sudoku-ready {
  display: grid;
  gap: var(--space-4);
}
.student-sudoku-ready__banner {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 68%, var(--bg-panel) 32%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.student-sudoku-ready__visual {
  display: inline-flex;
  flex: 0 0 auto;
}
.student-sudoku-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(280px, 0.72fr);
  gap: var(--space-5);
  align-items: start;
}
.student-sudoku-side-stack {
  display: grid;
  gap: var(--space-4);
}
.student-page-content--sudoku-focus {
  display: grid;
  gap: var(--space-4);
  min-height: 0;
}
.student-sudoku-focus-page {
  width: min(100%, 1440px);
  margin: 0 auto;
  display: grid;
  gap: var(--space-4);
  min-height: 0;
}
.student-sudoku-shell--wizard .student-shell__body {
  padding-bottom: 32px;
}
.student-sudoku-home-actions,
.student-sudoku-home-grid {
  align-items: start;
}
.student-sudoku-wizard-summary-card {
  align-self: start;
  position: sticky;
  top: 92px;
}
.sudoku-wizard-layout .competition-sprint-step {
  border-color: color-mix(
    in srgb,
    var(--competition-border-strong) 68%,
    #f1dca6 32%
  );
  box-shadow:
    inset 0 1px color-mix(in srgb, white 44%, transparent),
    0 22px 42px #5c4a2314;
}
.sudoku-wizard-layout .competition-sprint-choice-grid {
  gap: 14px;
}
.sudoku-wizard-layout .competition-sprint-choice-grid--question {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.sudoku-wizard-choice {
  min-height: 156px;
  padding: 18px 16px;
  gap: 10px;
}
.sudoku-wizard-choice .competition-sprint-choice__content {
  gap: 6px;
}
.sudoku-wizard-choice .competition-sprint-choice__title {
  font-size: 1.06rem;
}
.sudoku-wizard-choice .competition-sprint-choice__detail {
  display: none;
}
.sudoku-wizard-choice.is-selected .competition-sprint-choice__detail {
  color: color-mix(in srgb, var(--competition-selected-text) 74%, white 26%);
}
.sudoku-wizard-layout .competition-sprint-ready__grid {
  gap: 12px;
}
.sudoku-wizard-layout .competition-sprint-ready__tile {
  min-height: 126px;
}
.student-sudoku-wizard-note {
  margin-inline-start: auto;
  align-self: center;
  text-align: right;
}
.student-sudoku-main-grid--focus {
  grid-template-columns: minmax(0, 1.32fr) minmax(280px, 0.68fr);
}
.student-sudoku-empty {
  min-height: 320px;
  display: grid;
  place-items: center;
  gap: 12px;
  text-align: center;
  padding: var(--space-6);
  border-radius: var(--radius-3);
  border: 1px dashed
    color-mix(in srgb, var(--brand-500) 26%, var(--line-default) 74%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 66%, var(--bg-panel) 34%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.student-sudoku-empty__visual {
  display: inline-flex;
  justify-content: center;
}
.student-sudoku-game {
  display: grid;
  gap: var(--space-4);
  min-height: 0;
}
.student-sudoku-game__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.student-sudoku-game__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.student-sudoku-game-card {
  min-height: 0;
}
.student-sudoku-status {
  padding: 10px 12px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: color-mix(in srgb, var(--brand-50) 72%, var(--bg-panel) 28%);
  color: var(--text-body);
}
.student-sudoku-board-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  gap: clamp(12px, 1.5vw, 20px);
  align-items: start;
  --sudoku-board-fit: min(
    100%,
    var(--sudoku-board-max, 760px),
    max(300px, calc(100dvh - 260px))
  );
}
.student-sudoku-board-shell[data-sudoku-size="4"] {
  grid-template-columns: minmax(220px, 360px) minmax(260px, 340px);
  --sudoku-board-fit: min(260px, 100%, var(--sudoku-board-max, 360px));
}
.student-sudoku-board {
  display: grid;
  grid-template-columns: repeat(var(--sudoku-size, 9), minmax(0, 1fr));
  border: 3px solid
    color-mix(in srgb, var(--brand-700) 26%, var(--line-strong) 74%);
  border-radius: 24px;
  overflow: hidden;
  width: var(--sudoku-board-fit, min(100%, var(--sudoku-board-max, 760px)));
  max-width: 100%;
  justify-self: center;
  background: color-mix(in srgb, var(--line-subtle) 80%, transparent);
}
.student-sudoku-cell {
  appearance: none;
  border: 0;
  min-width: 0;
  aspect-ratio: 1 / 1;
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  box-shadow:
    inset 1px 0 color-mix(in srgb, var(--line-default) 70%, transparent),
    inset 0 1px color-mix(in srgb, var(--line-default) 70%, transparent);
  display: grid;
  place-items: center;
  font: 700 clamp(1rem, 2.4vw, 1.36rem) / 1 var(--font-family-sans);
  color: var(--brand-700);
  cursor: pointer;
  transition:
    background 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease,
    box-shadow 0.16s ease;
}
.student-sudoku-cell span {
  pointer-events: none;
}
.student-sudoku-cell--box-top {
  box-shadow:
    inset 1px 0 color-mix(in srgb, var(--line-default) 70%, transparent),
    inset 0 3px color-mix(in srgb, var(--brand-700) 26%, var(--line-strong) 74%);
}
.student-sudoku-cell--box-left {
  box-shadow:
    inset 3px 0 color-mix(in srgb, var(--brand-700) 26%, var(--line-strong) 74%),
    inset 0 1px color-mix(in srgb, var(--line-default) 70%, transparent);
}
.student-sudoku-cell--box-top.student-sudoku-cell--box-left {
  box-shadow:
    inset 3px 0 color-mix(in srgb, var(--brand-700) 26%, var(--line-strong) 74%),
    inset 0 3px color-mix(in srgb, var(--brand-700) 26%, var(--line-strong) 74%);
}
.student-sudoku-cell.is-given {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 44%, white 56%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  color: var(--text-strong);
  font-weight: 800;
}
.student-sudoku-cell.is-related {
  background: color-mix(in srgb, var(--brand-100) 40%, var(--bg-panel) 60%);
}
.student-sudoku-cell.is-matching {
  background: color-mix(in srgb, var(--brand-100) 62%, white 38%);
}
.student-sudoku-cell.is-selected {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 72%, white 28%),
    color-mix(in srgb, var(--brand-50) 72%, white 28%)
  );
  color: var(--brand-800);
  transform: scale(0.98);
  box-shadow: inset 0 0 0 2px
    color-mix(in srgb, var(--brand-600) 42%, white 58%);
}
.student-sudoku-cell.is-conflict {
  background: color-mix(in srgb, var(--danger-100) 86%, white 14%);
  color: var(--danger-700);
}
.student-sudoku-cell.is-valid-entry {
  background: color-mix(in srgb, var(--success-100) 84%, white 16%);
  color: var(--success-700);
}
.student-sudoku-cell.is-invalid-entry {
  background: color-mix(in srgb, var(--danger-100) 88%, white 12%);
  color: var(--danger-700);
}
.student-sudoku-cell.is-valid-entry.is-selected,
.student-sudoku-cell.is-invalid-entry.is-selected {
  transform: scale(0.98);
  box-shadow: inset 0 0 0 2px
    color-mix(in srgb, var(--brand-600) 42%, white 58%);
}
.student-sudoku-cell.is-empty span {
  color: transparent;
}
.student-sudoku-cell:focus-visible {
  outline: none;
  position: relative;
  z-index: 1;
  box-shadow: inset 0 0 0 2px
    color-mix(in srgb, var(--brand-600) 42%, white 58%);
}
.student-sudoku-console {
  display: grid;
  gap: var(--space-3);
}
.student-sudoku-console--play {
  align-content: start;
  gap: 12px;
}
.student-sudoku-selection-strip {
  display: grid;
  gap: 2px;
  padding: 4px 2px 2px;
}
.student-sudoku-tool-row {
  display: grid;
  gap: 8px;
}
.student-sudoku-candidate-strip {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid
    color-mix(in srgb, var(--success-500) 16%, var(--line-default) 84%);
  background: color-mix(in srgb, var(--success-50) 70%, var(--bg-panel) 30%);
}
.student-sudoku-console__card {
  padding: 16px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--brand-50) 42%, var(--bg-panel) 58%)
  );
  display: grid;
  gap: 10px;
}
.student-sudoku-console__card--input {
  position: relative;
}
.student-sudoku-help-actions {
  align-items: stretch;
}
.student-sudoku-help-actions .btn {
  flex: 1 1 138px;
  justify-content: center;
}
.student-sudoku-tool-note {
  padding-inline: 2px;
}
.student-sudoku-numberpad {
  display: grid;
  grid-template-columns: repeat(var(--sudoku-pad-columns, 3), minmax(0, 1fr));
  gap: clamp(10px, 1.1vw, 16px);
}
.student-sudoku-board-shell[data-sudoku-size="4"] .student-sudoku-numberpad {
  gap: clamp(12px, 1.5vw, 20px);
}
.student-sudoku-number {
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 22%, var(--line-default) 78%);
  border-radius: 14px;
  min-height: clamp(56px, 5vw, 72px);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-100) 42%, white 58%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  color: var(--brand-800);
  font: 700 clamp(1.08rem, 1.35vw, 1.18rem) / 1 var(--font-family-sans);
}
.student-sudoku-board-shell[data-sudoku-size="4"] .student-sudoku-number {
  min-height: clamp(46px, 5.8vw, 64px);
  border-radius: 14px;
  font-size: clamp(1.05rem, 1.4vw, 1.18rem);
}
.student-sudoku-number--clear {
  grid-column: 1 / -1;
  font-size: 0.95rem;
}
.student-sudoku-board-shell[data-sudoku-size="4"]
  .student-sudoku-number--clear {
  min-height: clamp(44px, 5.2vw, 56px);
}
.student-sudoku-number:disabled {
  opacity: 0.46;
  cursor: not-allowed;
}
.student-hero-preview__surface--portal-puzzle {
  padding: 0;
}
.student-hero-preview__frame--portal-puzzle {
  min-height: 220px;
  display: grid;
  gap: 12px;
  align-content: center;
  justify-items: start;
  padding: 24px;
}
.student-hero-preview__portal-icon {
  inline-size: 56px;
}
.student-hero-preview__frame--portal-puzzle strong {
  font-size: 1.08rem;
  color: var(--text-strong);
}
.student-hero-preview__frame--portal-puzzle p {
  margin: 0;
  max-width: 28ch;
  color: var(--text-body);
}
.student-hero-preview__portal-band {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-height: 30px;
}
.student-page-content--portal-puzzle-focus {
  display: grid;
  gap: var(--space-4);
}
.student-portal-puzzle-focus-page {
  width: min(100%, 1440px);
  margin: 0 auto;
  display: grid;
  gap: var(--space-4);
}
.student-portal-puzzle-game-card {
  display: grid;
  gap: var(--space-4);
  padding: clamp(14px, 1.8vw, 20px);
}
.portal-puzzle-focus {
  display: grid;
  gap: 14px;
}
.portal-puzzle-focus__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.portal-puzzle-focus__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  gap: 16px;
  align-items: start;
}
.portal-puzzle-focus__surface {
  min-width: 0;
  display: grid;
  gap: 12px;
  align-content: start;
  overflow: auto;
}
.portal-puzzle-focus__console {
  display: grid;
  gap: 12px;
  align-content: start;
}
.portal-puzzle-focus__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.portal-puzzle-focus__stat {
  min-height: 0;
}
.portal-puzzle-focus__stat span {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.portal-puzzle-focus__stat strong {
  font-size: clamp(0.98rem, 1.26vw, 1.08rem);
  color: var(--text-strong);
}
.portal-puzzle-focus__stat small {
  color: var(--text-soft);
}
.portal-puzzle-inline-tools {
  align-items: center;
  flex-wrap: wrap;
}
.portal-puzzle-inline-note {
  color: var(--text-soft);
  font-size: 0.9rem;
}
.portal-puzzle-codebreaker-variants {
  margin-bottom: 10px;
}
.portal-puzzle-codebreaker-variants .student-segmented__button {
  text-decoration: none;
}
.portal-puzzle-setup-note {
  display: grid;
  gap: 8px;
}
.portal-puzzle-codebreaker__current {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
  gap: 10px;
}
.portal-puzzle-codebreaker__slot {
  min-height: 58px;
  padding: 8px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  display: grid;
  place-items: center;
  font-size: 1.26rem;
  font-weight: 900;
  overflow: hidden;
}
.portal-puzzle-codebreaker__slot.is-revealed {
  background: color-mix(in srgb, var(--warning-100) 84%, white 16%);
}
.portal-puzzle-codebreaker__slot.is-exact {
  border-color: color-mix(
    in srgb,
    var(--success-500) 62%,
    var(--brand-500) 38%
  );
  background: color-mix(in srgb, var(--success-100) 74%, white 26%);
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--success-500) 24%, transparent);
}
.portal-puzzle-codebreaker__keys {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  gap: 10px;
}
.portal-puzzle-codebreaker__key {
  min-height: 56px;
  justify-content: center;
}
.portal-puzzle-codebreaker__legend {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.portal-puzzle-codebreaker__legend-chip {
  width: 18px;
  height: 18px;
  border-radius: 8px;
  border: 1px solid
    color-mix(in srgb, var(--line-default) 86%, var(--brand-500) 14%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.portal-puzzle-codebreaker__legend-chip.is-exact {
  border-color: color-mix(
    in srgb,
    var(--success-500) 62%,
    var(--brand-500) 38%
  );
  background: color-mix(in srgb, var(--success-100) 74%, white 26%);
}
.portal-puzzle-codebreaker__history {
  display: grid;
  gap: 8px;
}
.portal-puzzle-codebreaker__guess {
  display: grid;
  grid-template-columns: repeat(
    var(--codebreaker-columns, 4),
    minmax(42px, 1fr)
  );
  gap: 8px;
  min-width: 0;
}
.portal-puzzle-codebreaker__feedback {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}
.portal-puzzle-codebreaker__row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.portal-puzzle-codebreaker__row strong {
  align-self: center;
}
.portal-puzzle-codebreaker-symbol {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  color: color-mix(in srgb, var(--brand-700) 72%, var(--text-strong) 28%);
}
.portal-puzzle-codebreaker-symbol.is-labeled {
  justify-content: flex-start;
}
.portal-puzzle-codebreaker-symbol__text {
  font-size: 1.08rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}
.portal-puzzle-codebreaker-symbol__label {
  min-width: 0;
  font-size: 0.86rem;
  font-weight: 800;
  color: var(--text-body);
}
.portal-puzzle-codebreaker-symbol__placeholder {
  font-size: 1.14rem;
  font-weight: 800;
  color: var(--text-soft);
}
.portal-puzzle-codebreaker-symbol__swatch {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--portal-token-color, var(--brand-500));
  box-shadow:
    inset 0 0 0 1px #ffffff6b,
    0 0 0 1px
      color-mix(
        in srgb,
        var(--portal-token-color, var(--brand-500)) 42%,
        rgba(20, 32, 51, 0.12) 58%
      );
  flex: 0 0 auto;
}
.portal-puzzle-codebreaker-symbol__svg {
  width: 22px;
  height: 22px;
  display: block;
  flex: 0 0 auto;
}
.portal-puzzle-codebreaker-symbol--color {
  color: var(--portal-token-color, var(--brand-500));
}
.portal-puzzle-codebreaker-symbol--shape {
  color: color-mix(in srgb, var(--brand-700) 72%, var(--warning-500) 28%);
}
.portal-puzzle-tangram__svg {
  width: 100%;
  max-width: 640px;
  margin-inline: auto;
  border-radius: 24px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 40%, var(--bg-panel) 60%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
  box-shadow: 0 18px 34px color-mix(in srgb, var(--brand-900) 10%, transparent);
}
.portal-puzzle-tangram__target {
  fill: transparent;
  stroke: color-mix(in srgb, var(--brand-500) 36%, var(--line-default) 64%);
  stroke-width: 2;
  stroke-dasharray: 6 4;
}
.portal-puzzle-tangram__piece {
  fill: color-mix(in srgb, var(--brand-600) 58%, white 42%);
  stroke: color-mix(in srgb, var(--brand-800) 60%, var(--brand-600) 40%);
  stroke-width: 2;
  cursor: grab;
}
.student-portal-puzzle-focus-page .portal-puzzle-codebreaker__history {
  max-height: min(28vh, 220px);
  overflow: auto;
  padding-right: 4px;
}
@media (max-width: 1080px) {
  .portal-puzzle-focus__layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .portal-puzzle-focus__stats {
    grid-template-columns: 1fr;
  }
  .portal-puzzle-focus__head {
    align-items: stretch;
  }
  .portal-puzzle-focus__head .button-row {
    width: 100%;
  }
  .portal-puzzle-focus__head .button-row .btn {
    flex: 1 1 124px;
    justify-content: center;
  }
  .portal-puzzle-codebreaker__row {
    grid-template-columns: 1fr;
  }
  .portal-puzzle-codebreaker__feedback {
    justify-content: flex-start;
  }
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  :is(.student-sudoku-game-card, .student-sudoku-console__card),
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  :is(.student-sudoku-game-card, .student-sudoku-console__card),
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  :is(.student-sudoku-game-card, .student-sudoku-console__card) {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 14%,
        transparent
      ),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(15, 22, 40, 0.97) 84%,
        var(--student-theme-primary, #5a78ff) 16%
      ),
      #080d18fa
    );
  box-shadow: 0 20px 38px #0000003d;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-status,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-status,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-status {
  border-color: var(--student-theme-dark-chip-border);
  background: color-mix(
    in srgb,
    rgba(21, 30, 52, 0.94) 80%,
    var(--student-theme-primary, #5a78ff) 20%
  );
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-board,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-board,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-board {
  border-color: var(--student-theme-dark-border);
  background: color-mix(
    in srgb,
    rgba(8, 12, 24, 0.98) 86%,
    var(--student-theme-primary, #5a78ff) 14%
  );
  box-shadow: 0 24px 44px #0000004d;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell {
  background: color-mix(
    in srgb,
    rgba(18, 25, 44, 0.98) 84%,
    var(--student-theme-secondary, #dce6ff) 16%
  );
  box-shadow:
    inset 1px 0 #bcc6e61f,
    inset 0 1px #bcc6e61f;
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-top,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-top,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-top {
  box-shadow:
    inset 1px 0 #bcc6e61f,
    inset 0 3px
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 34%,
        rgba(206, 216, 244, 0.4)
      );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-left,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-left,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-left {
  box-shadow:
    inset 3px 0
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 34%,
        rgba(206, 216, 244, 0.4)
      ),
    inset 0 1px #bcc6e61f;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-top.student-sudoku-cell--box-left,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-top.student-sudoku-cell--box-left,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell--box-top.student-sudoku-cell--box-left {
  box-shadow:
    inset 3px 0
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 34%,
        rgba(206, 216, 244, 0.4)
      ),
    inset 0 3px
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 34%,
        rgba(206, 216, 244, 0.4)
      );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-given,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-given,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-given {
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(102, 119, 169, 0.72) 74%,
      var(--student-theme-secondary, #dce6ff) 26%
    ),
    color-mix(
      in srgb,
      rgba(39, 51, 84, 0.98) 86%,
      var(--student-theme-primary, #5a78ff) 14%
    )
  );
  color: #fff;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-related,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-related,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-related {
  background: color-mix(
    in srgb,
    rgba(92, 108, 158, 0.52) 72%,
    rgba(18, 25, 44, 0.48) 28%
  );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-matching,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-matching,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-matching {
  background: color-mix(
    in srgb,
    rgba(118, 138, 196, 0.64) 76%,
    rgba(24, 34, 59, 0.36) 24%
  );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-selected,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-selected,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-selected {
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(145, 169, 255, 0.38) 76%,
      rgba(31, 43, 74, 0.62) 24%
    ),
    color-mix(
      in srgb,
      rgba(56, 73, 122, 0.98) 82%,
      var(--student-theme-primary, #5a78ff) 18%
    )
  );
  color: #fff;
  box-shadow: inset 0 0 0 2px
    color-mix(in srgb, white 18%, var(--student-theme-primary, #5a78ff) 82%);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-conflict,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-conflict,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-conflict {
  background: color-mix(
    in srgb,
    rgba(174, 45, 66, 0.64) 78%,
    rgba(33, 11, 18, 0.36) 22%
  );
  color: #fff;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-valid-entry,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-valid-entry,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-valid-entry {
  background: color-mix(
    in srgb,
    rgba(39, 120, 94, 0.64) 76%,
    rgba(11, 28, 23, 0.36) 24%
  );
  color: #fff;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-invalid-entry,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-invalid-entry,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-invalid-entry {
  background: color-mix(
    in srgb,
    rgba(174, 45, 66, 0.74) 80%,
    rgba(33, 11, 18, 0.2) 20%
  );
  color: #fff;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-valid-entry.is-selected,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-valid-entry.is-selected,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-valid-entry.is-selected,
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-invalid-entry.is-selected,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-invalid-entry.is-selected,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell.is-invalid-entry.is-selected {
  box-shadow: inset 0 0 0 2px
    color-mix(in srgb, white 18%, var(--student-theme-primary, #5a78ff) 82%);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell:focus-visible,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell:focus-visible,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-cell:focus-visible {
  box-shadow: inset 0 0 0 2px
    color-mix(in srgb, white 18%, var(--student-theme-primary, #5a78ff) 82%);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-selection-strip
  strong,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-selection-strip
  strong,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-selection-strip
  strong {
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-selection-strip
  .muted,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-selection-strip
  .muted,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-selection-strip
  .muted {
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-number,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-number,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-number {
  border-color: var(--student-theme-dark-chip-border);
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(63, 80, 129, 0.94) 68%,
      var(--student-theme-secondary, #dce6ff) 32%
    ),
    color-mix(
      in srgb,
      rgba(23, 31, 55, 0.98) 88%,
      var(--student-theme-primary, #5a78ff) 12%
    )
  );
  color: var(--student-theme-dark-strong);
  box-shadow: 0 12px 24px #00000038;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-number:disabled,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-number:disabled,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .student-sudoku-number:disabled {
  opacity: 0.34;
}
.student-sudoku-tip-list {
  display: grid;
  gap: 12px;
}
.student-sudoku-tip {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border-radius: var(--radius-2);
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 12%, var(--line-default) 88%);
  background: color-mix(in srgb, var(--brand-50) 68%, var(--bg-panel) 32%);
}
@media (max-width: 1080px) {
  .student-sudoku-hub-grid,
  .student-sudoku-setup-grid,
  .student-sudoku-main-grid,
  .student-sudoku-main-grid--focus {
    grid-template-columns: 1fr;
  }
  .student-sudoku-board {
    width: var(--sudoku-board-fit, min(100%, var(--sudoku-board-max, 760px)));
  }
  .student-sudoku-wizard-summary-card {
    position: static;
  }
  .sudoku-wizard-layout .competition-sprint-choice-grid--question {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-sudoku-console--play {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 820px) {
  .sudoku-wizard-choice {
    min-height: 178px;
    padding: 18px 14px;
  }
  .sudoku-wizard-choice .competition-sprint-choice__detail {
    display: none;
  }
  .student-sudoku-stepper {
    grid-template-columns: 1fr;
  }
  .student-sudoku-overview-row {
    flex-direction: column;
  }
  .student-sudoku-shell--play .student-sudoku-page--play {
    gap: var(--space-4);
  }
  .student-sudoku-shell--play .student-section-hero--action-first,
  .student-sudoku-shell--play .student-sudoku-game-card {
    padding: 12px;
  }
  .student-sudoku-shell--play .student-section-hero__copy--action-first p,
  .student-sudoku-shell--play .student-sudoku-game-card .section-header p {
    display: none;
  }
  .student-sudoku-shell--play .student-sudoku-main-grid,
  .student-sudoku-shell--play .student-sudoku-side-stack {
    gap: var(--space-3);
  }
  .student-sudoku-level-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-sudoku-level-card {
    min-height: 154px;
    padding: 16px;
  }
  .student-sudoku-ready__banner,
  .student-sudoku-console__card {
    padding: 14px;
  }
  .student-sudoku-board-shell {
    grid-template-columns: 1fr;
    --sudoku-board-fit: min(
      100%,
      calc(100dvw - 48px),
      max(260px, calc(100dvh - 545px))
    );
  }
  .student-sudoku-board {
    width: var(--sudoku-board-fit, min(100%, var(--sudoku-board-max, 760px)));
    justify-self: center;
  }
  .student-sudoku-board-shell {
    gap: var(--space-4);
  }
  .student-sudoku-board-shell[data-sudoku-size="4"] {
    grid-template-columns: 1fr;
    --sudoku-board-fit: min(248px, calc(100dvw - 48px));
  }
  .student-sudoku-console--play {
    width: min(100%, var(--sudoku-board-max, 760px));
    justify-self: center;
  }
  .student-page-content--portal-puzzle-focus,
  .student-portal-puzzle-focus-page {
    gap: 12px;
  }
  .student-portal-puzzle-game-card {
    padding: 14px;
  }
  .student-sudoku-status {
    padding: 10px 12px;
  }
  .student-sudoku-console--play {
    gap: 10px;
  }
  .student-sudoku-tool-row {
    grid-template-columns: 1fr;
  }
  .student-sudoku-numberpad {
    gap: 6px;
  }
  .student-sudoku-number {
    min-height: 44px;
  }
  .student-sudoku-tool-note {
    display: none;
  }
  .student-sudoku-selection-strip {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 2px 8px;
    padding: 0 2px;
  }
  .student-sudoku-selection-strip .muted {
    grid-column: 2;
    font-size: 0.8rem;
  }
  .student-sudoku-tool-row {
    gap: 6px;
  }
}
@media (max-width: 720px) {
  .student-sudoku-flow-step,
  .student-sudoku-overview-row {
    padding: 12px 14px;
  }
  .student-sudoku-shell--play .student-section-hero__actions-row--header {
    display: none;
  }
  .student-sudoku-shell--play .student-action-row--hero {
    padding: 10px 12px;
  }
  .student-sudoku-shell--play .student-sudoku-game-card .section-header {
    margin-bottom: 4px;
  }
  .student-sudoku-game__head {
    flex-direction: column;
    align-items: stretch;
  }
  .student-sudoku-shell--wizard .student-shell__body {
    padding-bottom: 148px;
  }
  .student-sudoku-wizard-note {
    width: 100%;
    margin-inline-start: 0;
    text-align: center;
  }
}
@media (max-width: 640px) {
  .sudoku-wizard-layout .competition-sprint-choice-grid--question {
    grid-template-columns: 1fr;
  }
  .sudoku-wizard-layout .competition-sprint-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 8px);
  }
  .sudoku-wizard-layout .competition-sprint-actions .btn {
    width: 100%;
    flex: 0 0 auto;
  }
  .sudoku-wizard-layout .student-sudoku-wizard-note {
    order: 3;
    padding-inline: 4px;
    text-align: left;
  }
  .student-page-content--sudoku-focus,
  .student-sudoku-focus-page,
  .student-page-content--portal-puzzle-focus,
  .student-portal-puzzle-focus-page,
  .student-sudoku-shell--play .student-sudoku-page--play,
  .student-sudoku-shell--play .student-sudoku-main-grid {
    gap: 12px;
  }
  .student-sudoku-shell--play .student-sudoku-game-card,
  .student-sudoku-shell--play .student-sudoku-console__card,
  .student-sudoku-shell--play .student-sudoku-empty {
    padding: 12px;
  }
  .student-sudoku-help-actions .btn {
    width: 100%;
  }
  .student-sudoku-level-grid {
    grid-template-columns: 1fr;
  }
  .student-sudoku-board {
    width: var(--sudoku-board-fit, min(100%, calc(100dvw - 48px)));
  }
  .student-sudoku-console--play {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .student-sudoku-console__card--input {
    position: relative;
    bottom: auto;
    z-index: auto;
    border-color: color-mix(
      in srgb,
      var(--brand-500) 20%,
      var(--line-default) 80%
    );
    box-shadow: none;
  }
  .student-portal-puzzle-focus-page .portal-puzzle-inline-tools .btn {
    flex: 1 1 120px;
    justify-content: center;
  }
  .student-sudoku-cell {
    font-size: clamp(0.94rem, 4.7vw, 1.18rem);
  }
}
.portal-public .homepage-shell--v18-6-14 {
  --public-shell-max: 1400px;
}
.portal-public .page-shell {
  --public-shell-max: 1380px;
}
.portal-public
  :is(
    .homepage-hero__copy--landing h1,
    .homepage-section__title,
    .landing-showcase__browser-copy strong,
    .landing-showcase__slide-meta strong,
    .auth-panel-heading h1,
    .auth-aside--tabbed h2
  ) {
  text-wrap: balance;
}
.portal-public
  :is(
    .homepage-hero__sub--landing,
    .homepage-section__sub,
    .landing-showcase__slide-meta p,
    .auth-panel-heading p,
    .auth-aside-summary
  ) {
  text-wrap: pretty;
}
.portal-public .homepage-hero--landing {
  grid-template-columns: minmax(0, 1.04fr) minmax(420px, 0.96fr);
  gap: clamp(1.15rem, 1.9vw, 1.7rem);
  padding: clamp(1.3rem, 2.3vw, 2rem);
  align-items: center;
}
.portal-public .homepage-hero__copy--landing {
  gap: 0.88rem;
  max-width: 40rem;
  padding-inline-start: 0;
}
.portal-public .homepage-hero__copy--landing h1 {
  max-width: 12.8ch;
  font-size: clamp(3rem, 4.7vw, 4.95rem);
  line-height: 0.94;
  letter-spacing: -0.06em;
}
.portal-public .homepage-hero__sub--landing {
  max-width: 42ch;
  font-size: clamp(1rem, 1.05vw, 1.08rem);
  line-height: 1.5;
}
.portal-public .homepage-hero__actions--landing {
  gap: 0.75rem;
}
.portal-public .homepage-proof-strip--landing,
.portal-public .homepage-proof-strip.homepage-proof-strip--landing {
  max-width: 40rem;
}
.portal-public .homepage-proof-strip--landing .homepage-proof-pill,
.portal-public
  .homepage-proof-strip.homepage-proof-strip--landing
  .homepage-proof-pill {
  min-height: 32px;
  padding: 0.36rem 0.72rem;
  font-size: 0.8rem;
}
.portal-public .landing-showcase__browser {
  gap: 0.82rem;
  padding: 0.98rem;
  border-radius: 28px;
}
.portal-public .landing-showcase__browser-top {
  gap: 0.8rem;
  align-items: flex-start;
}
.portal-public .landing-showcase__browser-copy strong {
  max-width: 18ch;
  font-size: 0.98rem;
}
.portal-public .landing-showcase__stage {
  aspect-ratio: 16 / 9;
}
.portal-public .landing-showcase__slide-frame img {
  object-fit: cover;
  object-position: center top;
}
.portal-public .landing-showcase__slide-frame--contain {
  display: grid;
  place-items: center;
}
.portal-public .landing-showcase__slide-frame--contain img {
  object-fit: contain;
  object-position: center center;
}
.portal-public .landing-showcase__slide-frame--sats {
  background:
    radial-gradient(
      circle at center,
      rgba(247, 243, 236, 0.28),
      transparent 58%
    ),
    linear-gradient(180deg, #2f3754f5, #191f34fa);
}
.portal-public .landing-showcase__slide-meta strong {
  font-size: 0.96rem;
}
.portal-public .landing-showcase__slide-meta p {
  max-width: 40ch;
}
.portal-public .homepage-section--proof,
.portal-public .homepage-section--landing {
  gap: 1.2rem;
}
.portal-public .homepage-section__title {
  max-width: 16ch;
  font-size: clamp(2.3rem, 3.4vw, 3.55rem);
  line-height: 1.02;
}
.portal-public .homepage-section__sub {
  max-width: 50ch;
  line-height: 1.58;
}
.portal-public .homepage-feature-grid--landing,
.portal-public .homepage-journey-grid--landing,
.portal-public .landing-reason-grid {
  gap: 1.1rem;
}
.portal-public .homepage-shell--v18-6-14 .homepage-card,
.portal-public .homepage-shell--v18-6-14 .homepage-journey-card,
.portal-public .landing-reason-card {
  padding: 1.35rem 1.4rem;
  border-radius: 26px;
}
.portal-public .homepage-card__icon,
.portal-public .landing-reason-card__icon {
  width: 50px;
  height: 50px;
  border-radius: 18px;
}
.portal-public .homepage-card__icon svg,
.portal-public .landing-reason-card__icon svg {
  width: 22px;
  height: 22px;
}
.portal-public .landing-final-band {
  padding-block: clamp(1.15rem, 2vw, 1.6rem);
}
.portal-public .auth-split--tabbed {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);
  gap: clamp(0.9rem, 1.5vw, 1.2rem);
  align-items: stretch;
}
.portal-public :is(.auth-panel, .auth-aside) {
  padding: clamp(0.95rem, 1.5vw, 1.1rem);
}
.portal-public .auth-panel--tabbed {
  justify-items: start;
}
.portal-public :is(.auth-tabs, .auth-panel__inner--tabbed) {
  width: min(100%, 38rem);
  max-width: 38rem;
}
.portal-public .auth-tabs {
  gap: 4px;
  padding: 4px;
  margin-bottom: 0.72rem;
}
.portal-public .auth-switch__tab {
  min-height: 40px;
  padding-inline: 0.82rem;
  font-size: 0.89rem;
  font-weight: 700;
}
.portal-public .auth-panel__inner--tabbed {
  min-height: 0;
  gap: 0.78rem;
}
.portal-public .auth-panel-heading h1 {
  max-width: 12ch;
  font-size: clamp(1.95rem, 2.2vw, 2.6rem);
  line-height: 1.05;
}
.portal-public .auth-panel-heading p {
  max-width: 40ch;
  font-size: 0.98rem;
  line-height: 1.55;
}
.portal-public .auth-form-stack {
  gap: 0.68rem;
}
.portal-public .auth-submit-btn {
  min-height: 46px;
}
.portal-public .auth-support-card {
  padding: 0.78rem 0.84rem;
  border-radius: 18px;
}
.portal-public .auth-aside--tabbed .auth-aside-panel {
  gap: 0.7rem;
}
.portal-public .auth-aside--tabbed .auth-illustration--product {
  max-width: 100%;
  max-height: 130px;
}
.portal-public .auth-aside--tabbed .auth-illustration--public-signin {
  max-width: 230px;
  max-height: 132px;
}
.portal-public .auth-aside--tabbed h2 {
  max-width: 15ch;
  font-size: clamp(1.1rem, 1.2vw, 1.32rem);
  line-height: 1.18;
}
.portal-public .auth-points {
  gap: 0.55rem;
}
.portal-public .auth-point {
  padding: 0.7rem 0.75rem;
  border-radius: 16px;
}
.portal-public .auth-aside-highlight {
  padding: 0.62rem 0.7rem;
  border-radius: 15px;
}
.portal-public .auth-point strong {
  line-height: 1.25;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-showcase__slide-frame--theme-invert
  img,
html[data-theme="dark"]
  body.portal-public
  .landing-showcase__slide-frame--theme-invert
  img,
body.theme-dark.portal-public .landing-showcase__slide-frame--theme-invert img {
  filter: invert(1) hue-rotate(180deg) brightness(0.88) saturate(0.84)
    contrast(0.96);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-showcase__slide-frame--sats,
html[data-theme="dark"] body.portal-public .landing-showcase__slide-frame--sats,
body.theme-dark.portal-public .landing-showcase__slide-frame--sats {
  background:
    radial-gradient(
      circle at center,
      rgba(105, 122, 181, 0.2),
      transparent 55%
    ),
    linear-gradient(180deg, #0e1527fa, #080d18fa);
}
@media (max-width: 1280px) {
  .portal-public .homepage-shell--v18-6-14 {
    --public-shell-max: 1340px;
  }
  .portal-public .auth-split--tabbed {
    grid-template-columns: minmax(0, 0.96fr) minmax(340px, 0.42fr);
  }
  .portal-public :is(.auth-tabs, .auth-panel__inner--tabbed) {
    width: min(100%, 37.5rem);
    max-width: 37.5rem;
  }
}
@media (max-width: 1120px) {
  .portal-public .homepage-hero--landing {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.9fr);
  }
  .portal-public .homepage-hero__copy--landing h1 {
    max-width: 11.8ch;
    font-size: clamp(2.8rem, 4.35vw, 4.2rem);
  }
  .portal-public .homepage-section__title {
    max-width: 14ch;
    font-size: clamp(2.1rem, 3vw, 3rem);
  }
}
@media (max-width: 1024px) {
  .portal-public .mp-topbar--public-home .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "left right";
    min-height: 60px;
    padding: 6px 10px;
    align-items: center;
    row-gap: 0;
    column-gap: 8px;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__center,
  .portal-public .mp-topbar--public-home .mp-public-auth-actions {
    display: none;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__left,
  .portal-public .mp-topbar--public-home .mp-topbar__right,
  .portal-public .mp-topbar--public-home .mp-topbar__right--signed-out {
    width: auto;
    min-height: auto;
    align-self: center;
    gap: 0;
    flex-wrap: nowrap;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__left {
    justify-self: start;
    justify-content: flex-start;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__right,
  .portal-public .mp-topbar--public-home .mp-topbar__right--signed-out {
    justify-self: end;
    justify-content: flex-end;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__utility-pill {
    width: auto;
    min-height: auto;
    justify-content: flex-end;
    gap: 0;
    flex-wrap: nowrap;
  }
  .portal-public .mp-topbar--public-home .mp-language-menu,
  .portal-public .mp-topbar--public-home .mp-tool-group {
    width: auto;
    flex: 0 0 auto;
  }
  .portal-public .mp-topbar--public-home .mp-tool-group {
    gap: 0;
  }
  .portal-public .mp-topbar--public-home .topbar-brand-image,
  .portal-public .mp-topbar--public-home .mp-topbar__brand img {
    max-width: min(180px, 100%);
    max-height: 28px;
  }
  .portal-public :is(.homepage-shell--v18-6-14, .page-shell) {
    --public-shell-max: 100%;
  }
  .portal-public :is(.homepage-hero--landing, .auth-split--tabbed) {
    grid-template-columns: 1fr;
  }
  .portal-public .homepage-hero--landing {
    gap: 1.05rem;
    align-items: start;
  }
  .portal-public
    :is(
      .homepage-cockpit,
      .landing-showcase__shell,
      .landing-showcase__browser,
      .auth-tabs,
      .auth-panel__inner--tabbed
    ) {
    width: 100%;
    max-width: none;
  }
  .portal-public .landing-showcase__browser {
    padding: 0.92rem;
  }
  .portal-public .landing-showcase__stage {
    aspect-ratio: 16 / 10;
  }
  .portal-public .auth-split--tabbed {
    gap: 1rem;
  }
  .portal-public :is(.auth-panel, .auth-aside) {
    min-width: 0;
  }
}
@media (max-width: 900px) {
  .portal-public .homepage-feature-grid--landing {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .portal-public :is(.public-shell, .page-shell) {
    gap: 16px;
  }
  .portal-public .homepage-hero--landing {
    padding: 1rem;
    border-radius: 28px;
    gap: 0.95rem;
  }
  .portal-public .homepage-hero__copy--landing {
    gap: 0.72rem;
  }
  .portal-public .homepage-hero__copy--landing h1 {
    max-width: 10.2ch;
    font-size: clamp(2.3rem, 10vw, 3.45rem);
    line-height: 0.96;
  }
  .portal-public .homepage-hero__sub--landing {
    max-width: none;
    font-size: 0.98rem;
    line-height: 1.52;
  }
  .portal-public .homepage-hero__actions--landing {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
  }
  .portal-public .homepage-hero__actions--landing .btn {
    width: 100%;
    justify-content: center;
  }
  .portal-public .homepage-proof-strip--landing,
  .portal-public .homepage-proof-strip.homepage-proof-strip--landing {
    max-width: none;
    gap: 0.42rem;
  }
  .portal-public .homepage-proof-strip--landing .homepage-proof-pill,
  .portal-public
    .homepage-proof-strip.homepage-proof-strip--landing
    .homepage-proof-pill {
    min-height: 30px;
    padding: 0.32rem 0.62rem;
    font-size: 0.77rem;
  }
  .portal-public .landing-showcase__browser {
    gap: 0.72rem;
    padding: 0.82rem;
    border-radius: 24px;
  }
  .portal-public .landing-showcase__browser-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.55rem;
  }
  .portal-public .landing-showcase__browser-copy {
    width: 100%;
  }
  .portal-public .landing-showcase__browser-copy strong {
    max-width: none;
    font-size: 0.95rem;
  }
  .portal-public .landing-showcase__mode-switch {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.42rem;
  }
  .portal-public .landing-showcase__mode-trigger {
    min-width: 0;
    min-height: 40px;
    padding: 0.48rem 0.38rem;
    font-size: 0.78rem;
    line-height: 1.18;
    white-space: normal;
    text-align: center;
  }
  .portal-public .landing-showcase__stage {
    aspect-ratio: 4 / 3;
    border-radius: 18px;
  }
  .portal-public .landing-proof-card__media {
    aspect-ratio: 16 / 10;
  }
  .portal-public .landing-showcase__browser-footer--showcase {
    min-height: 0;
  }
  .portal-public .landing-showcase__slide-meta {
    max-width: none;
  }
  .portal-public .landing-showcase__slide-meta strong {
    font-size: 0.94rem;
  }
  .portal-public .landing-showcase__slide-meta p {
    max-width: none;
    font-size: 0.88rem;
  }
  .portal-public .homepage-section__title {
    max-width: none;
    font-size: clamp(1.9rem, 8vw, 2.55rem);
    line-height: 1.02;
  }
  .portal-public .homepage-section__sub {
    max-width: none;
    font-size: 0.96rem;
    line-height: 1.56;
  }
  .portal-public .homepage-shell--v18-6-14 .homepage-card,
  .portal-public .homepage-shell--v18-6-14 .homepage-journey-card,
  .portal-public .landing-reason-card,
  .portal-public .landing-proof-card {
    padding: 1rem;
    border-radius: 22px;
  }
  .portal-public .landing-final-band {
    padding-block: 1rem;
  }
  .portal-public .auth-split--tabbed {
    gap: 0.75rem;
    padding: 0.15rem;
  }
  .portal-public :is(.auth-panel, .auth-aside) {
    padding: 0.9rem;
    border-radius: 20px;
  }
  .portal-public .auth-tabs {
    gap: 4px;
    padding: 4px;
    margin-bottom: 0.7rem;
  }
  .portal-public .auth-switch__tab {
    min-height: 40px;
    padding-inline: 0.35rem;
    font-size: 0.8rem;
    line-height: 1.12;
    white-space: nowrap;
    text-align: center;
  }
  .portal-public .auth-panel__inner--tabbed {
    gap: 0.74rem;
  }
  .portal-public .auth-panel-heading h1 {
    max-width: 10ch;
    font-size: clamp(1.85rem, 7.6vw, 2.5rem);
    line-height: 1.05;
  }
  .portal-public .auth-panel-heading p {
    max-width: none;
    font-size: 0.95rem;
  }
  .portal-public .auth-chip {
    font-size: 0.74rem;
    padding: 0.26rem 0.48rem;
  }
  .portal-public .auth-submit-btn {
    min-height: 46px;
  }
  .portal-public .auth-support-card {
    padding: 0.76rem 0.78rem;
  }
  .portal-public .auth-aside--tabbed .auth-illustration--product {
    max-width: 210px;
    max-height: 118px;
  }
  .portal-public .auth-aside--tabbed .auth-illustration--public-signin {
    max-width: 210px;
    max-height: 120px;
  }
  .portal-public .auth-aside--tabbed h2 {
    max-width: none;
    font-size: 1.18rem;
  }
  .portal-public .auth-point {
    padding: 0.68rem 0.72rem;
    border-radius: 15px;
  }
  .portal-public .auth-aside-highlight {
    padding: 0.6rem 0.66rem;
    border-radius: 14px;
  }
}
@media (max-width: 560px) {
  .portal-public .homepage-feature-grid--landing,
  .portal-public .homepage-journey-grid--landing {
    grid-template-columns: 1fr;
  }
  .portal-public .homepage-hero__copy--landing h1 {
    max-width: 10ch;
    font-size: clamp(2.15rem, 11vw, 3rem);
  }
  .portal-public .auth-panel-heading h1 {
    max-width: 9.4ch;
  }
  .portal-public .landing-showcase__mode-trigger {
    font-size: 0.74rem;
    padding-inline: 0.3rem;
  }
  .portal-public .auth-switch__tab {
    min-height: 44px;
    font-size: 0.78rem;
    padding-inline: 0.3rem;
  }
}
.portal-public
  :is(
    .homepage-card p,
    .homepage-journey-card p,
    .landing-showcase__slide-meta p,
    .auth-support-card p,
    .step-card p,
    .inline-notice,
    .auth-point .small
  ) {
  text-wrap: pretty;
}
.portal-public
  :is(
    .auth-support-card strong,
    .step-card h3,
    .landing-showcase__slide-meta strong
  ) {
  text-wrap: balance;
}
.portal-public .steps-grid--request-demo {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: clamp(0.9rem, 1.8vw, 1.25rem);
}
.portal-public .steps-grid--request-demo .step-card {
  display: grid;
  align-content: start;
  gap: 0.65rem;
  min-height: 100%;
}
.portal-public .steps-grid--request-demo .step-card h3 {
  margin: 0 !important;
  max-width: 18ch;
}
.portal-public .auth-split--premium > .auth-panel > h1 {
  max-width: 13ch !important;
  line-height: 1.04;
  text-wrap: balance;
}
.portal-public .auth-split--premium > .auth-panel > p.muted {
  line-height: 1.58;
  text-wrap: pretty;
}
@media (max-width: 960px) {
  .student-shell__body,
  .student-shell__body--with-nav,
  .student-shell__body.student-nav-collapsed,
  .student-shell__body--with-nav.student-nav-collapsed {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .student-shell__body > .student-page-content,
  .student-shell__body--with-nav > .student-page-content {
    width: 100%;
    min-width: 0;
    justify-self: stretch;
  }
  .student-shell__body > .student-side-nav--compact,
  .student-shell__body--with-nav > .student-side-nav--compact {
    display: none;
  }
  .student-shell--compact-page .student-game-hub-grid,
  .student-shell--compact-page .student-home-main-grid--v18-8-57,
  .student-shell--compact-page .student-home-lower-grid--v18-8-57,
  .student-shell--compact-page .student-competition-support-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (min-width: 961px) and (max-width: 1180px) {
  .student-shell__body > .student-page-content,
  .student-shell__body--with-nav > .student-page-content,
  .student-shell__body.student-nav-collapsed > .student-page-content,
  .student-shell__body--with-nav.student-nav-collapsed > .student-page-content {
    width: 100%;
    min-width: 0;
    justify-self: stretch;
  }
}
.runner-question-card-v2.runner-question-panel--choice
  .options-grid[data-option-grid],
.runner-question-card-v2.runner-question-panel--shape-choice
  .options-grid[data-option-grid],
.runner-question-card-v2.runner-question-panel--mode-selection-grid
  .options-grid[data-option-grid] {
  grid-auto-rows: minmax(70px, auto);
}
.runner-question-card-v2.runner-question-panel--choice .option-chip--tile,
.runner-question-card-v2.runner-question-panel--choice .option-chip--single,
.runner-question-card-v2.runner-question-panel--shape-choice .option-chip--tile,
.runner-question-card-v2.runner-question-panel--shape-choice
  .option-chip--single,
.runner-question-card-v2.runner-question-panel--mode-selection-grid
  .option-chip--tile,
.runner-question-card-v2.runner-question-panel--mode-selection-grid
  .option-chip--single {
  min-height: 70px;
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid {
  min-height: clamp(184px, 24vh, 340px);
}
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--shape-choice
  .runner-visual-panel-v2,
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--mode-selection-grid
  .runner-visual-panel-v2 {
  min-height: clamp(128px, 16vh, 220px);
  padding: 8px 10px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid] {
  grid-auto-rows: minmax(72px, auto);
  gap: 9px;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile, .option-chip--single),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile, .option-chip--single) {
  min-height: 74px;
}
.visual-scene .visual-shape-label--choice {
  font-size: 16px;
  font-weight: 900;
}
@media (pointer: coarse) and (orientation: landscape) and (min-width: 821px) and (max-width: 1366px) and (min-aspect-ratio: 13 / 10) and (max-aspect-ratio: 3 / 2) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-touch-stage-max: 64rem;
    --runner-touch-visual-max: 80rem;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2 {
    gap: 12px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2 {
    width: min(100%, 64rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2 {
    gap: 10px;
    padding: 14px 14px 16px;
    border-radius: 22px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row {
    gap: 10px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2
    .runner-command-button-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2
    .runner-command-button-v2 {
    min-height: clamp(58px, 8vh, 72px);
    font-size: 1.08rem;
    font-weight: 800;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn[data-runner-key="enter"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn[data-runner-key="enter"] {
    min-height: clamp(62px, 8.6vh, 78px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field {
    gap: 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input] {
    min-height: clamp(62px, 8.6vh, 76px);
    padding-left: 20px;
    font-size: clamp(1.12rem, 2vw, 1.34rem);
  }
}
@media (pointer: coarse) and (orientation: landscape) and (min-width: 1194px) and (min-height: 834px) and (max-width: 1366px) and (max-height: 1024px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-touch-stage-max: 70rem;
    --runner-touch-visual-max: 84rem;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2 {
    gap: 14px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2 {
    width: min(100%, 68rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2 {
    gap: 12px;
    padding: 16px 16px 18px;
    border-radius: 24px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row {
    gap: 12px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2
    .runner-command-button-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2
    .runner-command-button-v2 {
    min-height: clamp(74px, 9vh, 88px);
    font-size: clamp(1.14rem, 1.45vw, 1.28rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn[data-runner-key="enter"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .btn[data-runner-key="enter"] {
    min-height: clamp(80px, 9.8vh, 96px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input] {
    min-height: clamp(80px, 9.8vh, 94px);
    padding-left: 22px;
    font-size: clamp(1.2rem, 1.6vw, 1.42rem);
  }
}
.runner-question-tools-wrap-v2 {
  width: min(100%, var(--runner-content-stage-max, 980px));
  margin-inline: auto;
}
.runner-question-tools-v2 {
  --runner-inline-keypad-max: 31rem;
  --runner-inline-keypad-gap: 6px;
  --runner-inline-keypad-padding: 10px 12px 12px;
  --runner-inline-keypad-radius: 22px;
  --runner-inline-keypad-btn-min: clamp(44px, 5.8vh, 58px);
  --runner-inline-keypad-enter-min: clamp(46px, 6.2vh, 62px);
  width: min(100%, var(--runner-inline-keypad-max));
  margin-inline: auto;
  gap: 10px;
  padding: var(--runner-inline-keypad-padding);
  border-radius: var(--runner-inline-keypad-radius);
}
.runner-question-tools-v2__hint {
  text-align: center;
}
.runner-question-tools-v2 .runner-keyboard-wrap,
.runner-question-tools-v2 .runner-keyboard,
.runner-question-tools-v2 .runner-keyboard-row {
  width: 100%;
}
.runner-question-tools-v2 .runner-keyboard-wrap,
.runner-question-tools-v2 .runner-keyboard {
  gap: var(--runner-inline-keypad-gap);
}
.runner-keyboard--unified {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.runner-keyboard--unified .runner-keyboard-row {
  display: grid;
  grid-template-columns: repeat(var(--runner-keyboard-cols, 4), minmax(0, 1fr));
}
.runner-keyboard--unified .runner-keyboard-row .btn {
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}
.runner-question-tools-v2 .runner-keyboard-row {
  gap: var(--runner-inline-keypad-gap);
}
.runner-question-tools-v2 .btn {
  min-height: var(--runner-inline-keypad-btn-min);
  padding-inline: clamp(6px, 1.8vw, 12px);
  font-size: 1.04rem;
  font-weight: 800;
}
.runner-question-tools-v2 .btn[data-runner-key="enter"] {
  min-height: var(--runner-inline-keypad-enter-min);
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-tools-v2 {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 88%, var(--bg-panel) 12%)
  );
  box-shadow: 0 16px 28px color-mix(in srgb, var(--brand-900) 12%, transparent);
}
html[data-appearance="dark"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-tools-v2,
html[data-theme="dark"]
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-tools-v2,
body.theme-dark
  .runner-question-card-v2.runner-question-panel--official-sats-image
  .runner-question-tools-v2 {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, black 6%),
    color-mix(in srgb, var(--bg-panel-2) 84%, var(--bg-panel) 16%)
  );
}
@media (pointer: fine) and (max-height: 820px) {
  .runner-question-card-v2.runner-question-panel--official-sats-image
    .runner-question-tools-v2 {
    --runner-inline-keypad-padding: 8px 10px 10px;
  }
  .runner-question-card-v2.runner-question-panel--official-sats-image
    .runner-question-tools-v2__hint {
    display: none;
  }
}
.runner-question-card-v2.runner-question-panel--official-sats-image
  [data-image-answer-box][data-runner-keyboard-target] {
  border-color: #2563ebf5;
  box-shadow: inset 0 0 0 1px #2563eb29;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-wrap-v2 {
  width: min(100%, var(--runner-touch-stage-max));
  max-width: 100%;
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2 {
  --runner-inline-keypad-max: 36rem;
  --runner-inline-keypad-gap: 7px;
  --runner-inline-keypad-padding: 10px 10px 12px;
  --runner-inline-keypad-radius: 20px;
  --runner-inline-keypad-btn-min: clamp(54px, 7.8vh, 70px);
  --runner-inline-keypad-enter-min: clamp(58px, 8.2vh, 76px);
  position: sticky;
  bottom: calc(
    var(--safe-area-bottom, env(safe-area-inset-bottom, 0px)) + 76px
  );
  z-index: 7;
  width: min(100%, var(--runner-inline-keypad-max));
  gap: 8px;
  backdrop-filter: blur(14px) saturate(1.04);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .runner-keyboard-wrap,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .runner-keyboard,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .runner-keyboard-row,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .runner-keyboard-wrap,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .runner-keyboard,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .runner-keyboard-row {
  gap: var(--runner-inline-keypad-gap);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .btn,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .btn {
  min-height: var(--runner-inline-keypad-btn-min);
}
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .btn[data-runner-key="enter"],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-tools-v2
  .btn[data-runner-key="enter"] {
  min-height: var(--runner-inline-keypad-enter-min);
}
@media (max-width: 820px) {
  .runner-question-tools-v2 {
    --runner-inline-keypad-max: 29rem;
  }
}
@media (max-width: 640px) {
  .runner-question-tools-v2 {
    --runner-inline-keypad-max: 100%;
    --runner-inline-keypad-padding: 10px 10px 12px;
    --runner-inline-keypad-radius: 18px;
    --runner-inline-keypad-btn-min: 48px;
    --runner-inline-keypad-enter-min: 50px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-wrap-v2 {
    width: 100%;
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2 {
    --runner-inline-keypad-gap: 6px;
    --runner-inline-keypad-padding: 8px 8px 10px;
    --runner-inline-keypad-radius: 18px;
    --runner-inline-keypad-btn-min: 46px;
    --runner-inline-keypad-enter-min: 48px;
    bottom: calc(
      var(--safe-area-bottom, env(safe-area-inset-bottom, 0px)) + 66px
    );
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2__hint,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2__hint {
    font-size: 0.74rem;
    line-height: 1.25;
  }
}
@media (pointer: coarse) and (orientation: landscape) and (max-height: 760px) {
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2 {
    --runner-inline-keypad-max: 28rem;
    --runner-inline-keypad-gap: 6px;
    --runner-inline-keypad-padding: 8px 8px 10px;
    --runner-inline-keypad-radius: 18px;
    --runner-inline-keypad-btn-min: 44px;
    --runner-inline-keypad-enter-min: 46px;
    bottom: calc(
      var(--safe-area-bottom, env(safe-area-inset-bottom, 0px)) + 60px
    );
  }
  .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2__hint,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2__hint {
    display: none;
  }
}
@media (pointer: coarse) and (orientation: landscape) and (min-width: 821px) and (max-width: 1366px) and (min-aspect-ratio: 13 / 10) and (max-aspect-ratio: 3 / 2) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-wrap-v2 {
    width: min(100%, 64rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2 {
    --runner-inline-keypad-max: 40rem;
    --runner-inline-keypad-gap: 10px;
    --runner-inline-keypad-padding: 14px 14px 16px;
    --runner-inline-keypad-radius: 22px;
    --runner-inline-keypad-btn-min: clamp(58px, 8vh, 72px);
    --runner-inline-keypad-enter-min: clamp(62px, 8.6vh, 78px);
    bottom: calc(
      var(--safe-area-bottom, env(safe-area-inset-bottom, 0px)) + 86px
    );
  }
}
@media (pointer: coarse) and (orientation: landscape) and (min-width: 1194px) and (min-height: 834px) and (max-width: 1366px) and (max-height: 1024px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-wrap-v2 {
    width: min(100%, 68rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-tools-v2 {
    --runner-inline-keypad-max: 46rem;
    --runner-inline-keypad-gap: 12px;
    --runner-inline-keypad-padding: 16px 16px 18px;
    --runner-inline-keypad-radius: 24px;
    --runner-inline-keypad-btn-min: clamp(74px, 9vh, 88px);
    --runner-inline-keypad-enter-min: clamp(80px, 9.8vh, 96px);
    bottom: calc(
      var(--safe-area-bottom, env(safe-area-inset-bottom, 0px)) + 104px
    );
  }
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
  --runner-competition-choice-gap: 10px;
  --runner-competition-choice-min-height: 78px;
  --runner-competition-choice-font: clamp(0.98rem, 2.1vw, 1.14rem);
  --runner-competition-keypad-gap: 10px;
  --runner-competition-keypad-padding: 12px 12px 14px;
  --runner-competition-keypad-radius: 20px;
  --runner-competition-keypad-btn-min: 56px;
  --runner-competition-keypad-enter-min: 60px;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2 {
  gap: var(--runner-competition-keypad-gap);
  padding: var(--runner-competition-keypad-padding);
  border-radius: var(--runner-competition-keypad-radius);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row {
  gap: var(--runner-competition-keypad-gap);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-command-button-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-commandbar-wrap-v2
  .runner-command-button-v2 {
  min-height: var(--runner-competition-keypad-btn-min);
  font-size: clamp(1.02rem, 2vw, 1.16rem);
  font-weight: 800;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn[data-runner-key="enter"],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .btn[data-runner-key="enter"] {
  min-height: var(--runner-competition-keypad-enter-min);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid[data-option-grid] {
  grid-template-columns: repeat(
    min(var(--option-grid-cols, 2), 2),
    minmax(0, 1fr)
  );
  grid-auto-rows: minmax(var(--runner-competition-choice-min-height), auto);
  gap: var(--runner-competition-choice-gap);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid--wordy-choice[data-option-grid],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  .options-grid--wordy-choice[data-option-grid] {
  grid-template-columns: minmax(0, 1fr);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile, .option-chip--single),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile, .option-chip--single) {
  min-height: var(--runner-competition-choice-min-height);
  border-radius: clamp(18px, 2.2vw, 22px);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile > span, .option-chip--single > span),
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  :is(
    .runner-answer-panel-v2--single-choice,
    .runner-answer-panel-v2--multi-choice,
    .runner-answer-panel-v2--shape-selection
  )
  :is(.option-chip--tile > span, .option-chip--single > span) {
  padding: 12px 10px;
  font-size: var(--runner-competition-choice-font);
  line-height: 1.2;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.competition-sprint-choice-grid {
  gap: clamp(10px, 1.4vw, 16px);
  align-items: stretch;
}
.competition-sprint-choice-grid--two {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 236px), 1fr));
}
.competition-sprint-choice-grid--grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 108px), 1fr));
}
.competition-sprint-choice-grid--question {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 184px), 1fr));
}
.competition-sprint-choice-grid--duration {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 152px), 1fr));
}
.competition-sprint-choice-grid--range {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 144px), 1fr));
}
.competition-sprint-choice {
  min-height: clamp(118px, 15vw, 148px);
  padding: clamp(14px, 1.5vw, 18px) clamp(12px, 1.4vw, 16px);
  gap: clamp(8px, 1vw, 12px);
}
.competition-sprint-choice:before {
  width: clamp(42px, 4.2vw, 48px);
  height: clamp(42px, 4.2vw, 48px);
}
.competition-sprint-choice:after {
  width: clamp(82px, 7vw, 92px);
  height: clamp(82px, 7vw, 92px);
}
.competition-sprint-choice__visual--icon {
  width: clamp(58px, 5vw, 64px);
  height: clamp(58px, 5vw, 64px);
}
.competition-sprint-choice__icon {
  width: clamp(32px, 2.8vw, 34px);
  height: clamp(32px, 2.8vw, 34px);
}
.competition-sprint-choice__visual--grid {
  width: clamp(64px, 5.6vw, 72px);
  min-height: clamp(56px, 4.8vw, 62px);
}
.competition-sprint-choice__mini-grid {
  max-width: clamp(64px, 5.6vw, 72px);
}
.competition-sprint-choice__visual--timer {
  width: clamp(66px, 5.8vw, 76px);
  height: clamp(66px, 5.8vw, 76px);
}
.competition-sprint-choice__timer-label {
  min-width: clamp(48px, 4.2vw, 54px);
  min-height: clamp(48px, 4.2vw, 54px);
  font-size: clamp(0.92rem, 1vw, 0.98rem);
}
.competition-sprint-choice__title {
  font-size: clamp(0.98rem, 1.1vw, 1.06rem);
}
.sudoku-wizard-layout .competition-sprint-choice-grid--question {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 188px), 1fr));
}
.sudoku-wizard-choice {
  min-height: clamp(156px, 18vw, 186px);
  padding: clamp(18px, 1.8vw, 22px) clamp(14px, 1.8vw, 18px);
}
.student-sudoku-board-shell {
  gap: clamp(12px, 1.8vw, 20px);
}
.student-sudoku-console__card--input {
  overflow: clip;
}
.student-sudoku-numberpad {
  --sudoku-pad-columns-active: var(--sudoku-pad-columns, 3);
  grid-template-columns: repeat(
    var(--sudoku-pad-columns-active),
    minmax(0, 1fr)
  );
  gap: clamp(10px, 1.1vw, 14px);
}
.student-sudoku-number {
  min-height: clamp(56px, 5.6vw, 74px);
  font-size: clamp(1.04rem, 1.35vw, 1.18rem);
}
.student-sudoku-board-shell[data-sudoku-size="4"] .student-sudoku-number {
  min-height: clamp(46px, 5.8vw, 64px);
  border-radius: 14px;
  font-size: clamp(1.05rem, 1.4vw, 1.18rem);
}
@media (min-width: 981px) and (max-width: 1180px) {
  .competition-sprint-choice-grid--question {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .competition-sprint-choice-grid--two,
  .competition-sprint-choice-grid--question,
  .competition-sprint-choice-grid--duration,
  .competition-sprint-ready__grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-choice-gap: 8px;
    --runner-competition-choice-min-height: 70px;
    --runner-competition-choice-font: clamp(0.96rem, 4.3vw, 1.05rem);
    --runner-competition-keypad-gap: 8px;
    --runner-competition-keypad-padding: 10px 10px 12px;
    --runner-competition-keypad-radius: 18px;
    --runner-competition-keypad-btn-min: 50px;
    --runner-competition-keypad-enter-min: 54px;
  }
}
@media (max-width: 767px) {
  .competition-sprint-choice-grid--two,
  .competition-sprint-choice-grid--question,
  .competition-sprint-choice-grid--duration,
  .competition-sprint-ready__grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 520px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    :is(
      .runner-answer-panel-v2--single-choice,
      .runner-answer-panel-v2--multi-choice,
      .runner-answer-panel-v2--shape-selection
    )
    .options-grid--wordy-choice[data-option-grid],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    :is(
      .runner-answer-panel-v2--single-choice,
      .runner-answer-panel-v2--multi-choice,
      .runner-answer-panel-v2--shape-selection
    )
    .options-grid--wordy-choice[data-option-grid] {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 1180px) {
  .sudoku-wizard-layout .competition-sprint-choice-grid--question {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px) {
  .sudoku-wizard-choice {
    min-height: 172px;
    padding: 18px 14px;
  }
}
@media (max-width: 680px) {
  .sudoku-wizard-layout .competition-sprint-choice-grid--question {
    grid-template-columns: 1fr;
  }
}
@media (pointer: coarse) and (orientation: landscape) and (max-height: 760px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-choice-gap: 8px;
    --runner-competition-choice-min-height: 68px;
    --runner-competition-choice-font: clamp(0.94rem, 1.9vw, 1.04rem);
    --runner-competition-keypad-gap: 8px;
    --runner-competition-keypad-padding: 8px 8px 10px;
    --runner-competition-keypad-radius: 18px;
    --runner-competition-keypad-btn-min: 46px;
    --runner-competition-keypad-enter-min: 48px;
  }
  .competition-sprint-choice-grid--two,
  .competition-sprint-choice-grid--question,
  .competition-sprint-choice-grid--duration {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .competition-sprint-choice-grid--range {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .competition-sprint-choice-grid--grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .competition-sprint-choice {
    min-height: 108px;
    padding: 12px 10px;
    gap: 8px;
  }
  .competition-sprint-choice:before {
    inset: 8px auto auto 8px;
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }
  .competition-sprint-choice:after {
    inset: auto -14px -14px auto;
    width: 74px;
    height: 74px;
  }
  .competition-sprint-choice__visual--icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
  }
  .competition-sprint-choice__icon {
    width: 30px;
    height: 30px;
  }
  .competition-sprint-choice__visual--timer {
    width: 62px;
    height: 62px;
  }
  .competition-sprint-choice__timer-label {
    min-width: 46px;
    min-height: 46px;
    font-size: 0.88rem;
  }
  .competition-sprint-choice__title {
    font-size: 0.96rem;
  }
  .sudoku-wizard-layout .competition-sprint-choice-grid--question {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sudoku-wizard-choice {
    min-height: 122px;
    padding: 14px 12px;
  }
  .student-sudoku-board-shell {
    gap: 8px;
  }
  .student-sudoku-console__card {
    padding: 10px;
    gap: 8px;
  }
  .student-sudoku-console__card--input {
    position: relative;
    bottom: auto;
    z-index: auto;
    border-color: color-mix(
      in srgb,
      var(--brand-500) 20%,
      var(--line-default) 80%
    );
    box-shadow: none;
  }
  .student-sudoku-numberpad {
    --sudoku-pad-columns-active: var(--sudoku-pad-columns, 3);
    gap: 8px;
  }
  .student-sudoku-number {
    min-height: 44px;
    border-radius: 13px;
    font-size: 1rem;
  }
  .student-sudoku-board-shell[data-sudoku-size="4"] .student-sudoku-number {
    min-height: clamp(46px, 5.8vw, 64px);
    border-radius: 14px;
    font-size: clamp(1.05rem, 1.4vw, 1.18rem);
  }
  .student-sudoku-cell {
    font-size: clamp(0.9rem, 2.4vw, 1.08rem);
  }
}
@media (pointer: coarse) and (orientation: landscape) and (min-width: 821px) and (max-width: 1366px) and (min-aspect-ratio: 13 / 10) and (max-aspect-ratio: 3 / 2) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-choice-gap: 12px;
    --runner-competition-choice-min-height: clamp(84px, 8vh, 96px);
    --runner-competition-choice-font: clamp(1.04rem, 1.45vw, 1.18rem);
    --runner-competition-keypad-gap: 12px;
    --runner-competition-keypad-padding: 14px 14px 16px;
    --runner-competition-keypad-radius: 22px;
    --runner-competition-keypad-btn-min: clamp(60px, 8vh, 74px);
    --runner-competition-keypad-enter-min: clamp(64px, 8.6vh, 80px);
  }
}
@media (min-width: 1181px) and (max-width: 1366px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-touch-stage-max: 64rem;
    --runner-touch-visual-max: 80rem;
    --runner-competition-choice-gap: 12px;
    --runner-competition-choice-min-height: clamp(84px, 8vh, 98px);
    --runner-competition-choice-font: clamp(1.04rem, 1.45vw, 1.18rem);
    --runner-competition-keypad-gap: 12px;
    --runner-competition-keypad-padding: 14px 14px 16px;
    --runner-competition-keypad-radius: 22px;
    --runner-competition-keypad-btn-min: clamp(64px, 8vh, 80px);
    --runner-competition-keypad-enter-min: clamp(70px, 8.8vh, 88px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2 {
    width: min(100%, 64rem);
  }
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
  --runner-competition-panel-width: min(100%, 60rem);
  --runner-competition-keypad-gap: 10px;
  --runner-competition-keypad-padding: 12px 12px 14px;
  --runner-competition-keypad-radius: 22px;
  --runner-competition-keypad-btn-min: clamp(70px, 9.2vh, 88px);
  --runner-competition-keypad-enter-min: clamp(74px, 9.8vh, 94px);
  height: calc(100dvh - var(--header-height) - 12px);
  max-height: calc(100dvh - var(--header-height) - 12px);
  grid-template-rows: min-content minmax(0, 1fr);
  align-content: start;
  overflow: hidden;
}
body.portal-student:has(
    .student-shell--focus-mode .runner-shell-v2[data-session-kind="competition"]
  ) {
  overflow: hidden;
}
body.portal-student:has(
    .student-shell--focus-mode .runner-shell-v2[data-session-kind="competition"]
  )
  .student-shell__body--runner,
body.portal-student:has(
    .student-shell--focus-mode .runner-shell-v2[data-session-kind="competition"]
  )
  .student-focus-shell__body--runner,
body.portal-student:has(
    .student-shell--focus-mode .runner-shell-v2[data-session-kind="competition"]
  )
  .student-page-content--runner {
  min-height: calc(100dvh - var(--header-height));
  height: calc(100dvh - var(--header-height));
  padding-bottom: 0;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-touch-stack
  .runner-question-card-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-touch-stack
  .runner-question-card-v2 {
  grid-template-rows: minmax(0, 1fr);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-stage-v2 {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(7.5rem, 0.25fr) minmax(0, 1fr);
  gap: 10px;
  height: 100%;
  align-items: stretch;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-card-v2,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-response-zone-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-card-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-response-zone-v2 {
  width: var(--runner-competition-panel-width);
  max-width: 100%;
  margin-inline: auto;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-card-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-card-v2 {
  min-height: 0;
  padding-block: 4px 6px;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-head-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-head-v2,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-meta-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-meta-v2 {
  width: 100%;
  text-align: center;
  justify-content: center;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-body-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-body-v2 {
  align-content: center;
  justify-items: stretch;
  min-height: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2 {
  width: 100%;
  height: 100%;
  min-height: 0;
  align-content: center;
  justify-items: center;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2
  > .runner-prompt,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-stage-v2
  > .runner-prompt {
  position: static;
  top: auto;
  width: 100%;
  min-height: 100%;
  padding-bottom: 0;
  background: none;
  display: grid;
  align-content: center;
  justify-items: center;
  place-items: center;
  text-align: center;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-card-v2
  .runner-prompt__main,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-question-card-v2
  .runner-prompt__main {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  font-size: clamp(3rem, 5.8vw, 4.35rem);
  line-height: 1;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-response-zone-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-response-zone-v2 {
  gap: 0;
  height: 100%;
  min-height: 0;
  align-content: stretch;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-panel-v2 {
  height: 100%;
  min-height: 0;
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-content: stretch;
  gap: 0;
  padding-top: 0;
  border-top: 0;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2 {
  width: 100%;
  max-width: none;
  min-height: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-stack-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-stack-v2 {
  width: 100%;
  min-height: 0;
  height: 100%;
  display: grid;
  align-content: stretch;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field {
  text-align: center;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field
  > span,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field__label,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field
  > span,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field__label {
  text-align: center;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field__control,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field__control {
  grid-template-columns: minmax(0, 1fr);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-stage-v2 {
  gap: clamp(6px, 1.1vh, 10px);
  align-content: stretch;
}
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-touch-stack
  .runner-answer-field--label-hidden,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-touch-stack
  .runner-answer-field--label-hidden,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"]
  .runner-answer-field--label-hidden,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"]
  .runner-answer-field--label-hidden {
  gap: 0;
}
.student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-touch-stack
  .runner-answer-field--label-hidden
  .runner-answer-field__control,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2.runner-shell-v2--competition-touch-stack
  .runner-answer-field--label-hidden
  .runner-answer-field__control,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"]
  .runner-answer-field--label-hidden
  .runner-answer-field__control,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"]
  .runner-answer-field--label-hidden
  .runner-answer-field__control {
  margin-top: 0;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field
  input,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  [data-answer-input],
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-field
  input,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  [data-answer-input] {
  min-height: clamp(72px, 8.4vh, 86px);
  padding-inline: 20px;
  text-align: center;
  font-size: clamp(1.3rem, 2.1vw, 1.62rem);
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-wrap-v2 {
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2 {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  align-content: stretch;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-header-v2,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-header-v2 {
  align-self: start;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-wrap,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard {
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard {
  grid-template-rows: repeat(
    4,
    minmax(var(--runner-competition-keypad-btn-min), 1fr)
  );
  grid-auto-rows: minmax(var(--runner-competition-keypad-btn-min), 1fr);
  align-content: stretch;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row {
  min-height: 0;
  height: 100%;
}
.student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row
  .btn,
.student-shell--focus-mode
  .student-page-content--runner
  .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
  .runner-answer-tools-v2
  .runner-keyboard-row
  .btn {
  height: 100%;
  min-height: var(--runner-competition-keypad-btn-min);
  align-self: stretch;
}
@media (max-width: 560px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-keypad-gap: 8px;
    --runner-competition-keypad-padding: 10px 10px 12px;
    --runner-competition-keypad-radius: 18px;
    --runner-competition-keypad-btn-min: clamp(64px, 8.8vh, 84px);
    --runner-competition-keypad-enter-min: clamp(68px, 9.4vh, 90px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    grid-template-rows: minmax(9rem, 0.32fr) minmax(0, 1fr);
    gap: 6px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input] {
    min-height: clamp(76px, 9.4vh, 92px);
    font-size: clamp(1.22rem, 4.8vw, 1.46rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2
    .runner-prompt__main {
    font-size: clamp(2.7rem, 10.5vw, 4rem);
  }
}
@media (max-height: 760px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-keypad-btn-min: clamp(56px, 8vh, 72px);
    --runner-competition-keypad-enter-min: clamp(60px, 8.8vh, 78px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input] {
    min-height: clamp(68px, 9vh, 84px);
  }
}
@media (min-width: 1025px) {
  .portal-public .homepage-section__title {
    max-width: 28ch;
  }
  .portal-public .homepage-section__sub {
    max-width: 58ch;
  }
  .portal-public :is(.auth-tabs, .auth-panel__inner--tabbed) {
    width: min(100%, 46rem);
    max-width: 46rem;
  }
  .portal-public .auth-panel-heading h1 {
    max-width: 22ch;
    text-wrap: pretty;
  }
  .portal-public .auth-panel-heading p,
  .portal-public .auth-aside-summary {
    max-width: 66ch;
  }
  .portal-public .auth-aside--tabbed h2 {
    max-width: 26ch;
    text-wrap: pretty;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .portal-public .homepage-section--modes {
    grid-template-columns: minmax(340px, 0.52fr) minmax(0, 1fr);
  }
}
@media (min-width: 1281px) {
  .portal-public .homepage-section--modes {
    grid-template-columns: minmax(400px, 0.6fr) minmax(0, 1fr);
  }
}
.portal-public .homepage-hero__copy--landing h1 {
  max-width: 14.6ch;
  text-wrap: pretty;
}
.portal-public .homepage-hero__sub--landing {
  max-width: 52ch;
}
.portal-public .landing-hero-note {
  max-width: 54ch;
}
.portal-public .homepage-proof-strip--landing,
.portal-public .homepage-proof-strip.homepage-proof-strip--landing {
  max-width: 44rem;
}
.portal-public .landing-showcase__browser-footer--showcase {
  min-height: 5.8rem;
}
.portal-public .landing-showcase__slide-frame--mock,
.portal-public .landing-showcase__slide-visual--mock,
.portal-public .landing-proof-card__media--mock {
  width: 100%;
  height: 100%;
}
.portal-public .landing-showcase__slide-frame--mock,
.portal-public .landing-showcase__slide-visual--mock {
  display: flex;
}
.portal-public .landing-proof-card__media--contain,
.portal-public .landing-proof-card__media--mock {
  display: grid;
  place-items: center;
}
.portal-public .landing-proof-card__media--contain img {
  object-fit: contain;
  object-position: center center;
}
.portal-public .landing-proof-card__media--sats {
  background:
    radial-gradient(
      circle at center,
      rgba(247, 243, 236, 0.28),
      transparent 58%
    ),
    linear-gradient(180deg, #2f3754f5, #191f34fa);
}
.portal-public .landing-proof-card__media--theme-invert img {
  filter: invert(0);
}
.portal-public .home-product-mock {
  display: grid;
  gap: 0.9rem;
  width: 100%;
  min-height: 100%;
  padding: clamp(1rem, 1.6vw, 1.2rem);
  border-radius: 22px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background:
    radial-gradient(
      circle at top right,
      rgba(125, 145, 225, 0.18),
      transparent 34%
    ),
    linear-gradient(180deg, #fffffff2, #f5f0e8eb);
  box-shadow: inset 0 1px #ffffffc7;
}
.portal-public .home-product-mock__top,
.portal-public .home-product-mock__footer {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
  justify-content: space-between;
}
.portal-public .home-product-mock__copy,
.portal-public .home-product-mock__metric {
  display: grid;
  gap: 0.18rem;
}
.portal-public .home-product-mock__copy strong,
.portal-public .home-product-mock__metric strong {
  font-size: clamp(1rem, 1.25vw, 1.14rem);
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: var(--text-strong);
}
.portal-public .home-product-mock__eyebrow,
.portal-public .home-product-mock__metric span,
.portal-public .home-product-mock__card span,
.portal-public .home-product-mock__stat span {
  font-size: 0.74rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-muted) 76%, var(--text-body) 24%);
}
.portal-public .home-product-mock__pill {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0.34rem 0.72rem;
  border-radius: 999px;
  border: 1px solid rgba(71, 82, 107, 0.12);
  background: #f2f6ffd6;
  color: var(--text-strong);
  font-size: 0.76rem;
  font-weight: 760;
  white-space: nowrap;
}
.portal-public .home-product-mock__grid,
.portal-public .home-product-mock__stats,
.portal-public .home-product-mock__split,
.portal-public .home-product-mock__sudoku-aside {
  display: grid;
  gap: 0.72rem;
}
.portal-public .home-product-mock__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.portal-public .home-product-mock__stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.portal-public .home-product-mock__split {
  grid-template-columns: minmax(0, 1.18fr) minmax(132px, 0.82fr);
  align-items: stretch;
}
.portal-public .home-product-mock__card,
.portal-public .home-product-mock__stat {
  display: grid;
  gap: 0.26rem;
  padding: 0.82rem;
  border-radius: 18px;
  border: 1px solid rgba(71, 82, 107, 0.1);
  background: #fffbf5db;
}
.portal-public .home-product-mock__card strong,
.portal-public .home-product-mock__stat strong {
  font-size: 1rem;
  line-height: 1.15;
  color: var(--text-strong);
}
.portal-public .home-product-mock__card small,
.portal-public .home-product-mock__footer p,
.portal-public .home-product-mock__stat small {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.45;
  color: color-mix(in srgb, var(--text-body) 88%, white 12%);
}
.portal-public .home-product-mock__bars {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
  align-items: end;
  min-height: 78px;
}
.portal-public .home-product-mock__bars span {
  display: block;
  min-height: 28px;
  height: var(--home-mock-bar, 72%);
  border-radius: 999px 999px 16px 16px;
  background: linear-gradient(180deg, #607ce1f2, #8ea2efa3);
  box-shadow: inset 0 1px #ffffff61;
}
.portal-public .home-product-mock__sudoku-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}
.portal-public .home-product-mock__sudoku-cell {
  display: grid;
  place-items: center;
  min-height: clamp(48px, 4.4vw, 62px);
  border-radius: 16px;
  border: 1px solid rgba(71, 82, 107, 0.12);
  background: #fffbf5eb;
  color: var(--text-strong);
  font-size: clamp(0.98rem, 1.1vw, 1.08rem);
  font-weight: 760;
  box-shadow: inset 0 1px #ffffffc7;
}
.portal-public .home-product-mock__sudoku-cell.is-empty {
  color: transparent;
}
.portal-public .home-product-mock--proof {
  padding: 1rem;
}
.portal-public .homepage-feature-grid--landing,
.portal-public .landing-reason-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
html[data-appearance="dark"]
  body.portal-public
  .landing-proof-card__media--theme-invert
  img,
html[data-theme="dark"]
  body.portal-public
  .landing-proof-card__media--theme-invert
  img,
body.theme-dark.portal-public .landing-proof-card__media--theme-invert img {
  filter: invert(1) hue-rotate(180deg) brightness(0.88) saturate(0.84)
    contrast(0.96);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-proof-card__media--sats,
html[data-theme="dark"] body.portal-public .landing-proof-card__media--sats,
body.theme-dark.portal-public .landing-proof-card__media--sats {
  background:
    radial-gradient(
      circle at center,
      rgba(105, 122, 181, 0.2),
      transparent 55%
    ),
    linear-gradient(180deg, #0e1527fa, #080d18fa);
}
html[data-appearance="dark"] body.portal-public .home-product-mock,
html[data-theme="dark"] body.portal-public .home-product-mock,
body.theme-dark.portal-public .home-product-mock {
  border-color: #bcc6e624;
  background:
    radial-gradient(
      circle at top right,
      rgba(88, 116, 214, 0.22),
      transparent 34%
    ),
    linear-gradient(180deg, #121829f5, #0a0f1cf5);
  box-shadow: inset 0 1px #ffffff08;
}
html[data-appearance="dark"]
  body.portal-public
  :is(.home-product-mock__card, .home-product-mock__stat),
html[data-theme="dark"]
  body.portal-public
  :is(.home-product-mock__card, .home-product-mock__stat),
body.theme-dark.portal-public
  :is(.home-product-mock__card, .home-product-mock__stat) {
  border-color: #bcc6e61f;
  background: #18223adb;
}
html[data-appearance="dark"] body.portal-public .home-product-mock__sudoku-cell,
html[data-theme="dark"] body.portal-public .home-product-mock__sudoku-cell,
body.theme-dark.portal-public .home-product-mock__sudoku-cell {
  border-color: #bcc6e61f;
  background: #18223ad6;
  box-shadow: inset 0 1px #ffffff0a;
}
html[data-appearance="dark"] body.portal-public .home-product-mock__pill,
html[data-theme="dark"] body.portal-public .home-product-mock__pill,
body.theme-dark.portal-public .home-product-mock__pill {
  border-color: #bcc6e61f;
  background: #2a385ed1;
  color: var(--text-body);
}
@media (max-width: 1200px) {
  .portal-public .homepage-feature-grid--landing,
  .portal-public .landing-reason-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-public .homepage-hero__copy--landing h1 {
    max-width: 12.4ch;
  }
}
@media (max-width: 900px) {
  .portal-public .landing-showcase__browser-footer--showcase {
    min-height: 0;
  }
  .portal-public .home-product-mock__grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .portal-public .homepage-feature-grid--landing,
  .portal-public .landing-reason-grid,
  .portal-public .home-product-mock__stats,
  .portal-public .home-product-mock__split {
    grid-template-columns: 1fr;
  }
  .portal-public .home-product-mock {
    padding: 0.92rem;
  }
  .portal-public .home-product-mock__top,
  .portal-public .home-product-mock__footer {
    flex-direction: column;
  }
}
.portal-public .homepage-shell--showcase {
  --public-shell-max: 1440px;
  --landing-line: rgba(71, 82, 107, 0.12);
  --landing-line-strong: rgba(71, 82, 107, 0.18);
  --landing-surface: linear-gradient(
    180deg,
    rgba(255, 253, 249, 0.94),
    rgba(248, 243, 235, 0.92)
  );
  --landing-surface-soft: linear-gradient(
    180deg,
    rgba(255, 251, 245, 0.9),
    rgba(244, 238, 229, 0.92)
  );
  --landing-surface-muted: rgba(255, 251, 245, 0.82);
  --landing-surface-strong: rgba(255, 255, 255, 0.94);
  --landing-shadow: 0 24px 60px rgba(31, 37, 52, 0.08);
  --landing-shadow-soft: 0 18px 40px rgba(31, 37, 52, 0.06);
  --landing-accent: #3f5ea3;
  --landing-accent-soft: rgba(219, 229, 255, 0.86);
  --landing-track: rgba(71, 82, 107, 0.12);
  gap: clamp(1.15rem, 2.2vw, 2rem);
  padding-top: 12px;
}
html[data-appearance="dark"] body.portal-public .homepage-shell--showcase,
html[data-theme="dark"] body.portal-public .homepage-shell--showcase,
body.theme-dark.portal-public .homepage-shell--showcase {
  --landing-line: rgba(188, 198, 230, 0.16);
  --landing-line-strong: rgba(188, 198, 230, 0.24);
  --landing-surface: linear-gradient(
    180deg,
    rgba(20, 27, 45, 0.96),
    rgba(11, 17, 31, 0.96)
  );
  --landing-surface-soft: linear-gradient(
    180deg,
    rgba(26, 35, 57, 0.94),
    rgba(16, 24, 41, 0.96)
  );
  --landing-surface-muted: rgba(24, 34, 58, 0.84);
  --landing-surface-strong: rgba(18, 24, 41, 0.94);
  --landing-shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
  --landing-shadow-soft: 0 18px 40px rgba(0, 0, 0, 0.24);
  --landing-accent: #8ea4ff;
  --landing-accent-soft: rgba(42, 56, 94, 0.82);
  --landing-track: rgba(188, 198, 230, 0.16);
}
.portal-public .homepage-shell--showcase .homepage-hero--showcase {
  display: grid;
  gap: clamp(0.8rem, 1.35vw, 1.05rem);
  align-items: center;
  padding: clamp(1rem, 1.7vw, 1.32rem);
  border-radius: 30px;
  border: 1px solid var(--landing-line);
  background:
    radial-gradient(
      circle at top left,
      rgba(223, 231, 255, 0.32),
      transparent 30%
    ),
    radial-gradient(
      circle at bottom right,
      rgba(241, 229, 202, 0.32),
      transparent 24%
    ),
    var(--landing-surface);
  box-shadow: var(--landing-shadow-soft);
  overflow: hidden;
}
.portal-public .homepage-shell--showcase .homepage-hero__copy--showcase {
  display: grid;
  gap: 0.74rem;
  max-width: 44rem;
}
.portal-public .homepage-shell--showcase .homepage-hero__copy--showcase h1 {
  margin: 0;
  max-width: 13.2ch;
  font-size: clamp(2.4rem, 4.3vw, 4.3rem);
  line-height: 0.95;
  letter-spacing: -0.06em;
  text-wrap: balance;
  color: var(--text-strong);
}
.portal-public .homepage-shell--showcase .homepage-hero__sub--showcase {
  margin: 0;
  max-width: 29ch;
  font-size: clamp(1rem, 1.08vw, 1.08rem);
  line-height: 1.58;
  color: color-mix(in srgb, var(--text-body) 88%, white 12%);
}
.portal-public .homepage-shell--showcase .homepage-hero__actions--showcase {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.7rem;
}
.portal-public .landing-inline-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 0.25rem;
  border: 0;
  background: transparent;
  color: color-mix(in srgb, var(--text-strong) 88%, white 12%);
  font-size: 0.95rem;
  font-weight: 720;
  text-decoration: none;
  cursor: pointer;
  transition:
    color 0.2s ease,
    opacity 0.2s ease;
}
.portal-public .landing-inline-link:hover,
.portal-public .landing-inline-link:focus-visible {
  color: var(--landing-accent);
  opacity: 1;
  outline: none;
}
.portal-public .landing-hero-notes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.8rem;
}
.portal-public .landing-hero-note {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.84rem;
  line-height: 1.45;
}
.portal-public .landing-hero-note:before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #3f5ea3b8;
}
.portal-public .homepage-shell--showcase .homepage-btn--primary {
  background: linear-gradient(180deg, #314569, #253754);
  box-shadow: 0 12px 24px #25365329;
}
.portal-public .landing-hero-card,
.portal-public .landing-journey-row,
.portal-public .landing-route-strip,
.portal-public .landing-access-band,
.portal-public .landing-journey-mock,
.portal-public .landing-final-band--showcase {
  border: 1px solid var(--landing-line);
  background: var(--landing-surface);
  box-shadow: var(--landing-shadow-soft);
}
.portal-public .landing-hero-card {
  display: grid;
  gap: 0.68rem;
  padding: clamp(0.78rem, 1.2vw, 0.98rem);
  border-radius: 24px;
}
.portal-public .landing-hero-card__top,
.portal-public .landing-hero-card__game-top,
.portal-public .landing-journey-mock__head,
.portal-public .landing-journey-mock__footer--practice {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
.portal-public .landing-hero-card__window {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
}
.portal-public .landing-hero-card__window span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #47526b2e;
}
.portal-public .landing-hero-card__status,
.portal-public .landing-hero-card__tab,
.portal-public .landing-journey-mock__badge,
.portal-public .landing-journey-mock__step {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.26rem 0.62rem;
  border-radius: 999px;
  border: 1px solid var(--landing-line);
  background: var(--landing-surface-muted);
  color: var(--text-strong);
  font-size: 0.74rem;
  font-weight: 760;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.portal-public .landing-hero-card__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.42rem;
}
.portal-public .landing-hero-card__tab.is-active {
  border-color: #3f5ea333;
  background: var(--landing-accent-soft);
}
.portal-public .landing-hero-card__layout {
  display: grid;
  gap: 0.7rem;
}
.portal-public .landing-hero-card__rail,
.portal-public .landing-hero-card__sidebar {
  display: grid;
  gap: 0.68rem;
}
.portal-public .landing-hero-card__game,
.portal-public .landing-hero-card__summary,
.portal-public .landing-mini-card,
.portal-public .landing-gauge,
.portal-public .landing-progress-list__item {
  border: 1px solid var(--landing-line);
  background: var(--landing-surface-muted);
  box-shadow: inset 0 1px #ffffffa6;
}
.portal-public .landing-hero-card__game,
.portal-public .landing-hero-card__summary {
  display: grid;
  gap: 0.5rem;
  padding: 0.8rem 0.82rem;
  border-radius: 20px;
}
.portal-public .landing-hero-card__game-copy {
  display: grid;
  gap: 0.16rem;
}
.portal-public .landing-hero-card__game-copy strong,
.portal-public .landing-hero-card__summary strong,
.portal-public .landing-journey-mock__title {
  color: var(--text-strong);
  font-size: clamp(0.96rem, 1.22vw, 1.08rem);
  line-height: 1.14;
  letter-spacing: -0.03em;
}
.portal-public .landing-hero-card__game-copy p,
.portal-public .landing-hero-card__summary p,
.portal-public .landing-hero-card__footnote p,
.portal-public .landing-journey-mock__footer,
.portal-public .landing-progress-list__copy span,
.portal-public .landing-mini-card small,
.portal-public .landing-gauge span {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 90%, white 10%);
  line-height: 1.48;
  font-size: 0.88rem;
}
.portal-public .landing-hero-card__game-top > span,
.portal-public .landing-hero-card__summary span,
.portal-public .landing-progress-list__copy strong,
.portal-public .landing-mini-card span,
.portal-public .landing-gauge strong {
  color: var(--text-strong);
  font-size: 0.82rem;
  font-weight: 760;
}
.portal-public .landing-hero-card__preview {
  display: grid;
  gap: 0.4rem;
}
.portal-public .landing-hero-card__preview--grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.portal-public .landing-hero-card__preview--cross {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.portal-public .landing-hero-card__preview span {
  display: grid;
  place-items: center;
  min-height: 38px;
  border-radius: 16px;
  border: 1px solid var(--landing-line);
  background: var(--landing-surface-strong);
  color: var(--text-strong);
  font-size: 0.8rem;
  font-weight: 760;
}
.portal-public .landing-hero-card__footnote {
  padding: 0.06rem 0.12rem 0;
}
.portal-public .homepage-shell--showcase .homepage-section--showcase-journey,
.portal-public .homepage-shell--showcase .homepage-section--showcase-access {
  display: grid;
  gap: 0.82rem;
}
.portal-public .homepage-shell--showcase .landing-section-head {
  display: grid;
  gap: 0.42rem;
  max-width: 46rem;
}
.portal-public .homepage-shell--showcase .homepage-section__title {
  margin: 0;
  max-width: 16.8ch;
  font-size: clamp(1.78rem, 2.55vw, 2.42rem);
  line-height: 1.02;
  letter-spacing: -0.045em;
  text-wrap: balance;
}
.portal-public .homepage-shell--showcase .homepage-section__sub {
  margin: 0;
  max-width: 42ch;
  font-size: 0.98rem;
  line-height: 1.58;
}
.portal-public .landing-journey-stack {
  display: grid;
  gap: 0.72rem;
}
.portal-public .landing-journey-row {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: clamp(0.88rem, 1.5vw, 1.06rem);
  border-radius: 24px;
}
.portal-public .landing-journey-row__copy {
  display: grid;
  gap: 0.4rem;
  max-width: 24rem;
}
.portal-public .landing-journey-row__copy h3 {
  margin: 0;
  max-width: 15ch;
  font-size: clamp(1.35rem, 1.7vw, 1.82rem);
  line-height: 1.05;
  letter-spacing: -0.038em;
  text-wrap: balance;
}
.portal-public .landing-journey-row__copy p {
  margin: 0;
  max-width: 32ch;
  font-size: 0.9rem;
  line-height: 1.5;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
.portal-public .homepage-hero--showcase .homepage-cockpit,
.portal-public .homepage-hero--showcase .landing-showcase--hero {
  align-self: stretch;
}
.portal-public .homepage-hero--showcase .homepage-cockpit {
  place-items: stretch;
  min-height: 100%;
}
.portal-public .homepage-hero--showcase .landing-showcase__browser {
  height: 100%;
  gap: 0.78rem;
  padding: clamp(0.92rem, 1.25vw, 1.06rem);
  border-radius: 28px;
  background: linear-gradient(180deg, #fffefbf7, #f7f1e7f0);
  box-shadow: 0 22px 54px #1f25341a;
}
html[data-appearance="dark"]
  body.portal-public
  .homepage-hero--showcase
  .landing-showcase__browser,
html[data-theme="dark"]
  body.portal-public
  .homepage-hero--showcase
  .landing-showcase__browser,
body.theme-dark.portal-public
  .homepage-hero--showcase
  .landing-showcase__browser {
  background: linear-gradient(180deg, #12192bf5, #0a101df5);
  box-shadow: 0 24px 58px #0000004d;
}
.portal-public .homepage-hero--showcase .landing-showcase__browser-top {
  align-items: center;
}
.portal-public .homepage-hero--showcase .landing-showcase__browser-copy strong {
  max-width: none;
  font-size: 0.96rem;
}
.portal-public .homepage-hero--showcase .landing-showcase__mode-switch {
  gap: 0.38rem;
}
.portal-public .homepage-hero--showcase .landing-showcase__mode-trigger {
  min-height: 32px;
  padding: 0.32rem 0.68rem;
  font-size: 0.77rem;
}
.portal-public .homepage-hero--showcase .landing-showcase__stage {
  aspect-ratio: 16 / 10.1;
}
.portal-public
  .homepage-hero--showcase
  .landing-showcase__browser-footer--showcase {
  min-height: 4.55rem;
}
.portal-public .landing-journey-row__visual {
  min-width: 0;
}
.portal-public .landing-journey-mock {
  display: grid;
  gap: 0.72rem;
  padding: clamp(0.84rem, 1.2vw, 1rem);
  border-radius: 22px;
}
.portal-public .landing-journey-mock__copy {
  display: grid;
  gap: 0.18rem;
}
.portal-public .landing-journey-mock__eyebrow {
  font-size: 0.74rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 82%, white 18%);
}
.portal-public .landing-numberline {
  position: relative;
  min-height: 70px;
  padding-bottom: 10px;
}
.portal-public .landing-numberline__axis {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 18px;
  height: 2px;
  border-radius: 999px;
  background: var(--landing-track);
}
.portal-public .landing-numberline__tick {
  position: absolute;
  left: var(--landing-tick, 50%);
  bottom: 10px;
  width: 2px;
  height: 18px;
  border-radius: 999px;
  background: #47526b47;
  transform: translate(-50%);
}
.portal-public .landing-numberline__tick.is-focus {
  height: 28px;
  background: var(--landing-accent);
}
.portal-public .landing-numberline__tick.is-focus:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 28px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--landing-accent);
  box-shadow: 0 0 0 5px #5d7ff41f;
  transform: translate(-50%);
}
.portal-public .landing-numberline__labels {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: color-mix(in srgb, var(--text-body) 88%, white 12%);
  font-size: 0.84rem;
  font-weight: 700;
}
.portal-public .landing-progress-list {
  display: grid;
  gap: 0.58rem;
}
.portal-public .landing-progress-list__item {
  display: grid;
  gap: 0.46rem;
  padding: 0.72rem 0.78rem;
  border-radius: 18px;
}
.portal-public .landing-progress-list__copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.portal-public .landing-progress-list__copy span {
  font-size: 0.84rem;
  font-weight: 700;
}
.portal-public .landing-progress-list__bar {
  width: 100%;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--landing-track);
}
.portal-public .landing-progress-list__bar span {
  display: block;
  width: var(--landing-progress, 72%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #607ce1f5, #92a7f5d1);
}
.portal-public .landing-mini-card-grid,
.portal-public .landing-gauge-grid {
  display: grid;
  gap: 0.58rem;
}
.portal-public .landing-mini-card-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.portal-public .landing-mini-card {
  display: grid;
  gap: 0.25rem;
  padding: 0.78rem;
  border-radius: 18px;
}
.portal-public .landing-mini-card strong {
  font-size: 1rem;
  line-height: 1.14;
  color: var(--text-strong);
}
.portal-public .landing-gauge-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.portal-public .landing-gauge {
  display: grid;
  justify-items: center;
  gap: 0.32rem;
  padding: 0.78rem 0.62rem;
  border-radius: 18px;
}
.portal-public .landing-gauge__dial {
  position: relative;
  width: 100%;
  max-width: 96px;
  aspect-ratio: 2 / 1;
  overflow: hidden;
  border-radius: 999px 999px 0 0;
  background: conic-gradient(
    from 180deg at 50% 100%,
    var(--landing-accent) 0deg var(--landing-gauge-angle, 140deg),
    var(--landing-track) var(--landing-gauge-angle, 140deg) 180deg,
    transparent 180deg 360deg
  );
}
.portal-public .landing-gauge__dial:after {
  content: "";
  position: absolute;
  inset: 12px 12px -2px;
  border-radius: 999px 999px 0 0;
  background: var(--landing-surface-strong);
}
.portal-public .landing-gauge strong {
  font-size: 1rem;
  line-height: 1;
}
.portal-public .landing-route-strip {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: clamp(0.74rem, 1.2vw, 0.9rem);
  border-radius: 24px;
}
.portal-public .landing-route-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  min-height: 46px;
  padding: 0 0.85rem;
  border-radius: 999px;
  color: var(--text-strong);
  text-decoration: none;
  font-size: 0.94rem;
  font-weight: 730;
  border: 1px solid transparent;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    color 0.2s ease;
}
.portal-public .landing-route-link:hover,
.portal-public .landing-route-link:focus-visible {
  border-color: var(--landing-line-strong);
  background: var(--landing-surface-muted);
  color: var(--landing-accent);
  outline: none;
}
.portal-public .landing-route-link__arrow {
  font-size: 0.88rem;
}
.portal-public .landing-access-band {
  display: grid;
  gap: 0.9rem;
  padding: clamp(1rem, 1.8vw, 1.35rem);
  border-radius: 28px;
  background: var(--landing-surface-soft);
}
.portal-public .landing-access-band__content {
  display: grid;
  gap: 0.72rem;
}
.portal-public .landing-access-band__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.8rem;
}
.portal-public .landing-access-band__actions .homepage-btn--primary {
  min-width: min(100%, 190px);
}
.portal-public .landing-final-band--showcase {
  padding: clamp(1.5rem, 3vw, 2.6rem);
  border-radius: 30px;
}
.portal-public .landing-final-band__header,
.portal-public .landing-final-band--showcase .section-header {
  justify-content: center;
  text-align: center;
}
.portal-public .landing-final-band--showcase .section-header > div {
  max-width: 42rem;
  margin-inline: auto;
}
.portal-public .landing-final-band--showcase .section-header h2 {
  margin: 0.45rem 0 0.75rem;
  font-size: clamp(2rem, 3.3vw, 3.2rem);
  line-height: 1;
  letter-spacing: -0.052em;
}
.portal-public .landing-final-band--showcase .section-header p {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 90%, white 10%);
}
.portal-public .landing-final-band__actions {
  justify-content: center;
  margin-top: 1rem;
}
.portal-public .landing-final-band__actions > .btn,
.portal-public .landing-final-band__actions > a {
  min-width: min(100%, 220px);
}
.portal-public .landing-hero-card,
.portal-public .landing-journey-row,
.portal-public .landing-access-band,
.portal-public .landing-route-strip,
.portal-public .landing-route-link,
.portal-public .landing-journey-mock {
  transition:
    box-shadow 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease;
}
.portal-public .landing-journey-row:hover,
.portal-public .landing-journey-row:focus-within,
.portal-public .landing-hero-card:hover,
.portal-public .landing-access-band:hover {
  border-color: var(--landing-line-strong);
  box-shadow: var(--landing-shadow-soft);
}
@media (min-width: 768px) {
  .portal-public .landing-hero-card__layout {
    grid-template-columns: minmax(0, 1.06fr) minmax(188px, 0.7fr);
    align-items: stretch;
  }
  .portal-public .landing-route-strip {
    flex-direction: row;
    align-items: center;
    justify-content: stretch;
  }
  .portal-public .landing-access-band__actions,
  .portal-public .landing-final-band__actions {
    flex-direction: row;
  }
}
@media (min-width: 1024px) {
  .portal-public .homepage-shell--showcase .homepage-hero--showcase {
    grid-template-columns: minmax(0, 1.08fr) minmax(380px, 0.92fr);
  }
  .portal-public .landing-journey-row {
    flex-direction: row;
    align-items: center;
    gap: clamp(0.95rem, 2vw, 1.5rem);
  }
  .portal-public .landing-journey-row--reverse {
    flex-direction: row-reverse;
  }
  .portal-public .landing-journey-row__copy,
  .portal-public .landing-journey-row__visual {
    flex: 1 1 0;
  }
  .portal-public .landing-access-band {
    grid-template-columns: minmax(0, 0.96fr) minmax(420px, 1.04fr);
    align-items: center;
    gap: 1.05rem;
  }
}
@media (min-width: 1440px) {
  .portal-public .homepage-shell--showcase {
    gap: clamp(1.4rem, 2.2vw, 2.2rem);
  }
  .portal-public .homepage-shell--showcase .homepage-hero--showcase {
    grid-template-columns: minmax(0, 1.18fr) minmax(450px, 0.82fr);
    padding: 1.24rem 1.36rem;
    gap: clamp(0.82rem, 1vw, 1rem);
  }
  .portal-public .homepage-shell--showcase .homepage-hero__copy--showcase {
    max-width: 46rem;
  }
  .portal-public .homepage-shell--showcase .homepage-hero__copy--showcase h1 {
    max-width: 13.8ch;
    font-size: clamp(3rem, 3.35vw, 4.2rem);
    line-height: 0.94;
  }
  .portal-public .homepage-shell--showcase .homepage-hero__sub--showcase {
    max-width: 30ch;
    font-size: 1.02rem;
  }
  .portal-public .homepage-shell--showcase .landing-section-head {
    max-width: 48rem;
  }
  .portal-public .homepage-shell--showcase .homepage-section__title {
    max-width: 17.2ch;
    font-size: clamp(1.86rem, 2.08vw, 2.34rem);
    line-height: 1.02;
  }
  .portal-public .homepage-shell--showcase .homepage-section__sub {
    max-width: 42ch;
    font-size: 0.98rem;
  }
  .portal-public .landing-journey-stack {
    gap: 0.78rem;
  }
  .portal-public .landing-journey-row {
    padding: 0.95rem 1rem;
    gap: 1rem;
  }
  .portal-public .landing-journey-row__copy h3 {
    max-width: 15ch;
    font-size: clamp(1.42rem, 1.55vw, 1.82rem);
  }
  .portal-public .landing-journey-row__copy p {
    max-width: 32ch;
    font-size: 0.9rem;
  }
  .portal-public .landing-route-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;
    gap: 0.45rem;
    padding: 0.72rem;
    min-height: 76px;
    border-radius: 24px;
  }
  .portal-public .landing-route-link {
    min-height: 50px;
    justify-content: center;
    padding-inline: 0.78rem;
    text-align: center;
  }
  .portal-public .landing-access-band__content {
    gap: 0.68rem;
  }
}
@media (min-width: 1536px) {
  .portal-public .homepage-shell--showcase .homepage-hero--showcase {
    grid-template-columns: minmax(0, 1.2fr) minmax(480px, 0.8fr);
  }
  .portal-public .homepage-shell--showcase .homepage-hero__copy--showcase h1 {
    font-size: 4.26rem;
  }
}
@media (max-width: 900px) {
  .portal-public .landing-gauge-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .portal-public .homepage-shell--showcase .homepage-hero__copy--showcase h1,
  .portal-public .homepage-shell--showcase .homepage-section__title {
    max-width: none;
  }
  .portal-public .landing-hero-card__sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
  .portal-public .landing-hero-card__footnote {
    grid-column: 1 / -1;
  }
  .portal-public .landing-hero-card__preview span {
    min-height: 40px;
  }
  .portal-public .landing-mini-card-grid,
  .portal-public .landing-gauge-grid {
    grid-template-columns: 1fr;
  }
  .portal-public .landing-access-band__actions,
  .portal-public .landing-final-band__actions {
    flex-direction: column;
    align-items: stretch;
  }
}
@media (max-width: 640px) {
  .portal-public .mp-topbar--public-home .mp-topbar__inner {
    grid-template-columns: 1fr;
    row-gap: 10px;
    min-height: auto;
    padding: 10px 10px 12px;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__center,
  .portal-public .mp-topbar--public-home .mp-topbar__utility-pill {
    display: none;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__left {
    justify-self: start;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__right,
  .portal-public .mp-topbar--public-home .mp-topbar__right--signed-out {
    width: 100%;
    justify-self: stretch;
    justify-content: stretch;
  }
  .portal-public .mp-topbar--public-home .mp-public-auth-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 0.55rem;
  }
  .portal-public
    .mp-topbar--public-home
    .mp-public-auth-actions
    .mp-inline-link--button {
    min-height: 42px;
    padding-inline: 0.95rem;
    justify-content: center;
    font-size: 0.92rem;
    border-radius: 999px;
    border: 1px solid var(--landing-line);
    background: var(--landing-surface-muted);
  }
  .portal-public
    .mp-topbar--public-home
    .mp-public-auth-actions
    .mp-inline-link--strong {
    background: linear-gradient(180deg, #314569, #243551);
    border-color: transparent;
    box-shadow: 0 10px 24px #25365329;
    color: #f8f9ff;
  }
  .portal-public .homepage-shell--showcase .homepage-hero__actions--showcase {
    flex-direction: column;
    align-items: stretch;
  }
  .portal-public
    .homepage-shell--showcase
    .homepage-hero__actions--showcase
    > .btn,
  .portal-public
    .homepage-shell--showcase
    .homepage-hero__actions--showcase
    > a,
  .portal-public
    .homepage-shell--showcase
    .homepage-hero__actions--showcase
    > button {
    width: 100%;
  }
  .portal-public .landing-inline-link {
    justify-content: flex-start;
    min-height: 38px;
    padding-inline: 0;
  }
  .portal-public .landing-route-strip {
    border-radius: 22px;
  }
}
@media (max-width: 420px) {
  .portal-public .mp-topbar--public-home .topbar-brand-image,
  .portal-public .mp-topbar--public-home .mp-topbar__brand img {
    height: 22px;
    max-height: 22px;
  }
  .portal-public
    .mp-topbar--public-home
    .mp-public-auth-actions
    .mp-inline-link--button {
    min-height: 40px;
    padding-inline: 0.7rem;
    font-size: 0.88rem;
  }
  .portal-public .landing-hero-card__tabs,
  .portal-public .landing-hero-notes {
    gap: 0.45rem;
  }
}
@media (max-width: 1024px) and (min-width: 641px) {
  .portal-public .mp-topbar--public-home .mp-public-auth-actions {
    display: flex;
    gap: 0.45rem;
  }
  .portal-public
    .mp-topbar--public-home
    .mp-public-auth-actions
    .mp-inline-link--button {
    min-height: 40px;
    padding-inline: 0.82rem;
    font-size: 0.9rem;
    border-radius: 999px;
  }
  .portal-public
    .mp-topbar--public-home
    .mp-public-auth-actions
    .mp-inline-link--strong {
    background: linear-gradient(180deg, #fffffff0, #faf5eceb);
    border: 1px solid rgba(63, 94, 163, 0.18);
    box-shadow: 0 8px 18px #1f25340f;
  }
}
body.portal-public:before {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.24),
    rgba(255, 255, 255, 0.06) 30%,
    transparent 58%
  );
  opacity: 0.44;
}
body.portal-public:after {
  opacity: 0.6;
}
html[data-appearance="dark"] body.portal-public:before,
html[data-theme="dark"] body.portal-public:before,
body.theme-dark.portal-public:before {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.03),
    rgba(255, 255, 255, 0) 30%,
    transparent 58%
  );
  opacity: 0.54;
}
html[data-appearance="dark"] body.portal-public:after,
html[data-theme="dark"] body.portal-public:after,
body.theme-dark.portal-public:after {
  opacity: 0.28;
}
.portal-public .homepage-shell--editorial {
  --public-shell-max: 1400px;
  gap: clamp(1.3rem, 2.5vw, 2.2rem);
  padding-top: 12px;
}
.portal-public .homepage-shell--editorial .homepage-hero--editorial {
  position: relative;
  display: grid;
  gap: clamp(1rem, 2.1vw, 1.7rem);
  align-items: center;
  min-height: clamp(520px, 56vh, 640px);
  padding: clamp(1.4rem, 2.8vw, 2.28rem);
  border-radius: 38px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, transparent);
  background:
    linear-gradient(
      140deg,
      color-mix(in srgb, var(--bg-panel) 94%, white 6%),
      color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%) 58%,
      color-mix(in srgb, var(--bg-panel-2) 84%, var(--bg-panel) 16%)
    ),
    linear-gradient(180deg, #ffffff42, #fff0);
  box-shadow: 0 18px 44px #2b365014;
}
.portal-public .homepage-shell--editorial .homepage-hero__copy--editorial {
  display: grid;
  gap: 0.92rem;
  max-width: 37rem;
}
.portal-public .homepage-shell--editorial .homepage-hero__copy--editorial h1 {
  margin: 0;
  max-width: 10.5ch;
  font-size: clamp(3rem, 5vw, 4.5rem);
  line-height: 0.93;
  letter-spacing: -0.06em;
  font-weight: 700;
  text-wrap: balance;
}
.portal-public .homepage-shell--editorial .homepage-hero__sub--editorial {
  margin: 0;
  max-width: 32ch;
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  line-height: 1.5;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
.portal-public .homepage-shell--editorial .homepage-hero__actions--editorial {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.7rem 1rem;
}
.portal-public
  .homepage-shell--editorial
  .homepage-hero__actions--editorial
  .homepage-btn--primary {
  min-width: min(100%, 190px);
}
.portal-public .homepage-shell--editorial .landing-inline-link {
  min-height: 42px;
  padding-inline: 0;
  font-size: 0.96rem;
  font-weight: 700;
  color: var(--text-strong);
}
.portal-public .landing-proof-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
}
.portal-public .landing-proof-line__item {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 38px;
  padding: 0 0.82rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
  color: var(--text-strong);
  font-size: 0.9rem;
  line-height: 1.45;
  font-weight: 720;
}
.portal-public .landing-proof-line__item:before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-700) 84%, white 16%);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-100) 70%, transparent);
}
.portal-public .landing-hero-proof {
  display: grid;
  gap: 0;
  min-width: 0;
}
.portal-public .landing-hero-proof--carousel {
  align-self: stretch;
}
.portal-public .landing-hero-proof__frame {
  display: grid;
  gap: 0.66rem;
  padding: clamp(0.78rem, 1.35vw, 0.96rem);
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
  box-shadow: var(--shadow-sm);
}
.portal-public .landing-hero-proof__frame--visual-only {
  gap: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.portal-public .landing-hero-proof__carousel {
  align-content: start;
}
.portal-public .landing-hero-proof__meta {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
}
.portal-public .landing-hero-proof__intro {
  display: grid;
  gap: 0.18rem;
}
.portal-public .landing-hero-proof__eyebrow,
.portal-public .landing-routine-step__eyebrow,
.portal-public .landing-progress-signal span,
.portal-public .landing-hero-proof__detail > span {
  font-size: 0.74rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 86%, white 14%);
}
.portal-public .landing-hero-proof__intro strong {
  color: var(--text-strong);
  font-size: 1rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.portal-public .landing-hero-proof__tag {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 0.76rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
  color: var(--text-strong);
  font-size: 0.78rem;
  font-weight: 760;
  white-space: nowrap;
}
.portal-public .landing-hero-proof__screen {
  display: grid;
  place-items: center;
  min-height: 320px;
  padding: clamp(0.78rem, 1.5vw, 1rem);
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 88%, white 12%),
    color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
  );
}
.portal-public .landing-hero-proof__screen img {
  width: 100%;
  max-height: 420px;
  border-radius: 18px;
  object-fit: contain;
  object-position: center;
}
.portal-public .landing-hero-proof__switch {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.portal-public .landing-hero-proof__switch-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 0.8rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
  color: var(--text-body);
  font-size: 0.82rem;
  font-weight: 720;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}
.portal-public .landing-hero-proof__switch-btn.is-active,
.portal-public .landing-hero-proof__switch-btn[aria-selected="true"] {
  border-color: color-mix(
    in srgb,
    var(--brand-700) 28%,
    var(--line-default) 72%
  );
  background: color-mix(in srgb, var(--brand-100) 58%, var(--bg-panel) 42%);
  color: var(--text-strong);
  box-shadow: 0 8px 18px #1f25340f;
}
.portal-public .landing-hero-proof__stage {
  position: relative;
  min-height: 332px;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 88%, white 12%),
    color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
  );
  overflow: hidden;
}
.portal-public
  .landing-hero-proof__frame--visual-only
  .landing-hero-proof__stage {
  min-height: clamp(430px, 34vw, 540px);
  border: 0;
  border-radius: 30px;
  background: transparent;
  box-shadow: none;
}
.portal-public .landing-hero-proof__slide {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(0.36rem, 0.95vw, 0.66rem);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}
.portal-public
  .landing-hero-proof__frame--visual-only
  .landing-hero-proof__slide {
  padding: 0;
}
.portal-public .landing-hero-proof__slide.is-active {
  opacity: 1;
  pointer-events: auto;
}
.portal-public .landing-hero-proof__slide > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 16px;
}
.portal-public
  .landing-hero-proof__frame--visual-only
  .landing-hero-proof__slide
  > img {
  border-radius: 30px;
  object-position: center top;
  box-shadow: 0 18px 36px #313d5814;
}
.portal-public .landing-hero-proof__slide--contain > img {
  object-fit: contain;
}
.portal-public .landing-hero-proof__slide--cover > img {
  object-fit: cover;
}
.portal-public .landing-hero-proof__slide--align-top > img {
  object-position: top center;
}
.portal-public
  .landing-hero-proof__slide--mock
  .landing-showcase__slide-visual--mock {
  display: grid;
  width: 100%;
  height: 100%;
}
.portal-public .landing-hero-proof__slide--mock .home-product-mock {
  min-height: 100%;
  padding: 0.92rem;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock {
  display: grid;
  align-content: stretch;
  width: 100%;
  height: 100%;
  gap: 0.36rem;
  padding: 0;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__brand {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: color-mix(in srgb, var(--text-body) 78%, white 22%);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__brand-dot {
  width: 0.62rem;
  height: 0.62rem;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-500) 92%, white 8%),
    color-mix(in srgb, var(--brand-700) 88%, var(--brand-500) 12%)
  );
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-100) 60%, transparent);
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__badge,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__soft-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0 0.86rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
  color: var(--text-strong);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__surface {
  display: grid;
  align-content: start;
  height: 100%;
  min-height: 0;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  overflow: hidden;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__copy {
  display: grid;
  gap: 0.3rem;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__copy
  > span,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__panel
  > span,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__stat
  > span,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__metric
  > span,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card
  > span {
  color: color-mix(in srgb, var(--text-muted) 86%, white 14%);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__copy
  > strong {
  color: var(--text-strong);
  font-size: 1.02rem;
  line-height: 1.2;
  letter-spacing: -0.03em;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--reasoning {
  display: grid;
  gap: 0.56rem;
  padding: 0.72rem;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 90%, white 10%),
    color-mix(in srgb, var(--brand-100) 20%, var(--bg-panel) 80%)
  );
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__reasoning-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(88px, 0.24fr);
  gap: 0.58rem;
  min-height: 0;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__canvas-card {
  display: grid;
  place-items: center;
  min-height: 224px;
  padding: 0.32rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(180deg, #fffffffa, #f5f7fcf5);
  box-shadow: inset 0 1px #ffffffb8;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__reasoning-svg,
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__graph-svg,
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__solid-svg {
  display: block;
  width: 100%;
  height: auto;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__toolrail {
  display: grid;
  align-content: start;
  gap: 0.42rem;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__tool,
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__rail-note,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__rail-answer {
  display: grid;
  place-items: center;
  padding: 0.6rem 0.52rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 86%, white 14%);
  color: var(--text-strong);
  font-size: 0.8rem;
  font-weight: 700;
  text-align: center;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__tool--active {
  border-color: color-mix(
    in srgb,
    var(--brand-600) 36%,
    var(--line-default) 64%
  );
  background: color-mix(in srgb, var(--brand-100) 68%, var(--bg-panel) 32%);
  color: color-mix(in srgb, var(--brand-900) 84%, var(--text-strong) 16%);
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__rail-note,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__rail-answer {
  place-items: start center;
  padding-block: 0.82rem;
  color: color-mix(in srgb, var(--text-body) 90%, white 10%);
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.35;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game {
  display: grid;
  gap: 0.62rem;
  padding: 0.76rem;
  background:
    radial-gradient(
      circle at top right,
      rgba(111, 134, 216, 0.18),
      transparent 36%
    ),
    radial-gradient(
      circle at bottom left,
      rgba(255, 194, 144, 0.24),
      transparent 38%
    ),
    linear-gradient(180deg, #f7f9ff, #e9effd 72%);
  border-color: #798dc94d;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__equation-card
  > span,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__stat
  > span,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__track-node
  > span {
  color: color-mix(in srgb, var(--text-muted) 86%, white 14%);
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__stat-row,
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__answer-row,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__metric-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__stat,
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__metric {
  display: grid;
  gap: 0.18rem;
  padding: 0.7rem 0.78rem;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat {
  background: #ffffffc7;
  border-color: #8fa0d747;
  box-shadow: inset 0 1px #ffffffb3;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__stat
  strong,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__metric
  strong {
  color: var(--text-strong);
  font-size: 1rem;
  line-height: 1.15;
  letter-spacing: -0.03em;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat
  strong,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__equation-card
  strong,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__answer,
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__track-node {
  color: var(--text-strong);
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card {
  display: grid;
  gap: 0.34rem;
  justify-items: start;
  padding: 0.9rem 1rem;
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffffeb, #f6f9ffd1);
  border: 1px solid rgba(144, 161, 216, 0.26);
  box-shadow: inset 0 1px #ffffffc7;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card
  strong {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  line-height: 1;
  letter-spacing: -0.05em;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card
  small {
  color: color-mix(in srgb, var(--text-body) 82%, white 18%);
  font-size: 0.82rem;
  line-height: 1.45;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__answer {
  display: grid;
  place-items: center;
  min-height: 3rem;
  padding: 0 0.6rem;
  border-radius: 16px;
  border: 1px solid rgba(144, 161, 216, 0.22);
  background: #ffffffb3;
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer--correct {
  background: linear-gradient(180deg, #c7dcffdb, #abc1f4cc);
  border-color: #abc4ff70;
  box-shadow: 0 12px 22px #4a5f9724;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin-top: 0.08rem;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track:before {
  content: "";
  position: absolute;
  inset: 50% 0.8rem auto;
  height: 2px;
  transform: translateY(-50%);
  background: linear-gradient(90deg, #97abe629, #97abe685);
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 2.4rem;
  border-radius: 999px;
  border: 1px solid rgba(144, 161, 216, 0.2);
  background: #fff9;
  font-size: 0.76rem;
  font-weight: 700;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node--active {
  background: linear-gradient(180deg, #ffd5b7db, #ffbc8ecc);
  border-color: #ffb68e6b;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--advanced {
  display: grid;
  gap: 0.6rem;
  padding: 0.72rem;
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 202, 143, 0.18),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 92%, white 8%),
      color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
    );
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__practice-head {
  display: grid;
  gap: 0.24rem;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__practice-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(132px, 0.74fr);
  gap: 0.54rem;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__panel {
  display: grid;
  gap: 0.48rem;
  align-content: start;
  padding: 0.82rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__panel--solid {
  align-items: center;
  justify-items: center;
  text-align: center;
}
.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__panel
  small {
  color: color-mix(in srgb, var(--text-body) 88%, white 12%);
  font-size: 0.8rem;
  line-height: 1.35;
}
.portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__metric {
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
}
@media (max-width: 640px) {
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__reasoning-layout,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__practice-grid {
    grid-template-columns: 1fr;
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__toolrail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__rail-note,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__rail-answer {
    grid-column: 1 / -1;
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__stat-row,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__answer-row,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__metric-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__track {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.portal-public .landing-hero-proof__footer {
  position: relative;
  min-height: 4rem;
}
.portal-public .landing-hero-proof__footer--visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  min-height: 0;
}
.portal-public .landing-hero-proof__footer-copy {
  position: absolute;
  inset: 0;
  display: grid;
  align-content: start;
  gap: 0.22rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.24s ease;
}
.portal-public .landing-hero-proof__footer-copy.is-active {
  opacity: 1;
  pointer-events: auto;
}
.portal-public .landing-hero-proof__footer-copy strong {
  color: var(--text-strong);
  font-size: 1.02rem;
  line-height: 1.22;
  letter-spacing: -0.02em;
}
.portal-public .landing-hero-proof__footer-copy p {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.92rem;
  line-height: 1.55;
}
.portal-public .landing-hero-proof__caption {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.95rem;
  line-height: 1.58;
}
.portal-public .landing-hero-proof__details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}
.portal-public .landing-hero-proof__detail {
  display: grid;
  gap: 0.55rem;
  padding: 0.86rem 0.92rem;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg-canvas) 12%);
}
.portal-public .landing-hero-proof__detail-media {
  display: grid;
  place-items: center;
  min-height: 124px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 92%, white 8%),
    color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
  );
  overflow: hidden;
}
.portal-public .landing-hero-proof__detail-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.portal-public .landing-hero-proof__detail-media--mock {
  place-items: stretch;
}
.portal-public .landing-hero-proof__detail-media--mock .home-product-mock {
  min-height: 0;
  padding: 0.78rem;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.portal-public .landing-hero-proof__detail strong {
  color: var(--text-strong);
  font-size: 1rem;
  line-height: 1.24;
  letter-spacing: -0.02em;
}
.portal-public .landing-hero-proof__detail p {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.88rem;
  line-height: 1.52;
}
.portal-public .homepage-shell--editorial .homepage-section {
  gap: 1rem;
}
.portal-public .homepage-shell--editorial .landing-section-head {
  display: grid;
  gap: 0.34rem;
  max-width: 36rem;
}
.portal-public .homepage-shell--editorial .homepage-section__title {
  margin: 0;
  max-width: 16ch;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1;
  letter-spacing: -0.048em;
  text-wrap: balance;
}
.portal-public .homepage-shell--editorial .homepage-section__sub {
  margin: 0;
  max-width: 34ch;
  font-size: 0.98rem;
  line-height: 1.52;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
.portal-public .homepage-shell--editorial .landing-reason-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
}
.portal-public .homepage-shell--editorial .landing-reason-card {
  display: grid;
  gap: 0.52rem;
  padding: 0.88rem 0.92rem 0.94rem;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 76%, white 24%),
    color-mix(in srgb, var(--bg-panel) 72%, var(--bg-canvas) 28%)
  );
  box-shadow: none;
}
.portal-public .homepage-shell--editorial .landing-reason-card__header {
  display: grid;
  gap: 0.5rem;
  align-items: start;
}
.portal-public .homepage-shell--editorial .landing-reason-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: color-mix(in srgb, var(--brand-100) 56%, var(--bg-panel) 44%);
  box-shadow: none;
}
.portal-public .homepage-shell--editorial .landing-reason-card h3 {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(1.12rem, 1.35vw, 1.3rem);
  line-height: 1.14;
  letter-spacing: -0.03em;
}
.portal-public .homepage-shell--editorial .landing-reason-card__body {
  margin: 0;
  max-width: 26ch;
  font-size: 0.92rem;
  line-height: 1.48;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
.portal-public .landing-routine-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}
.portal-public .landing-routine-step {
  display: grid;
  gap: 0.54rem;
  padding: 0.86rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
}
.portal-public .landing-routine-step__top {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.portal-public .landing-routine-step__number {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 86%, var(--bg-canvas) 14%);
  color: var(--text-strong);
  font-size: 0.88rem;
  font-weight: 760;
}
.portal-public .landing-routine-step h3 {
  margin: 0;
  max-width: 13ch;
  font-size: clamp(1.08rem, 1.28vw, 1.28rem);
  line-height: 1.14;
  letter-spacing: -0.03em;
}
.portal-public .landing-routine-step p {
  margin: 0;
  max-width: 24ch;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.92rem;
  line-height: 1.46;
}
.portal-public .landing-routine-step__detail {
  color: var(--text-strong);
  font-size: 0.8rem;
  line-height: 1.34;
  font-weight: 650;
}
.portal-public .landing-progress-panel {
  display: grid;
  gap: 0.82rem;
  padding: clamp(0.92rem, 1.6vw, 1.12rem);
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--line-default) 78%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 86%, white 14%),
    color-mix(in srgb, var(--bg-panel) 78%, var(--bg-canvas) 22%)
  );
  box-shadow: var(--shadow-sm);
}
.portal-public .landing-progress-panel__copy {
  display: grid;
  gap: 0.78rem;
}
.portal-public .landing-progress-signals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}
.portal-public .landing-progress-signal {
  display: grid;
  gap: 0.22rem;
  padding: 0.72rem 0.78rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
}
.portal-public .landing-progress-signal strong {
  color: var(--text-strong);
  font-size: 0.9rem;
  line-height: 1.34;
  letter-spacing: -0.01em;
}
.portal-public .landing-progress-audience-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}
.portal-public .landing-progress-audience {
  display: grid;
  gap: 0.28rem;
  padding: 0.74rem 0.8rem;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 82%, var(--bg-canvas) 18%);
}
.portal-public .landing-progress-audience h3 {
  margin: 0;
  font-size: 1.14rem;
  line-height: 1.24;
  letter-spacing: -0.02em;
}
.portal-public .landing-progress-audience p {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.9rem;
  line-height: 1.44;
}
.portal-public .landing-progress-panel__visual {
  min-width: 0;
}
.portal-public .landing-progress-panel__visual .landing-journey-mock {
  min-height: 100%;
}
.portal-public .landing-route-band {
  display: grid;
  gap: 0.65rem;
  padding: 0.78rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
}
.portal-public .landing-route-band__copy {
  display: grid;
  gap: 0.28rem;
  max-width: 28rem;
}
.portal-public .landing-route-band__actions {
  display: grid;
  gap: 0.75rem;
}
.portal-public .landing-route-strip--editorial {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  padding: 0;
  border-radius: 0;
  background: none;
}
.portal-public .landing-route-strip--editorial .landing-route-link {
  min-height: 48px;
  padding: 0 0.9rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
}
.portal-public .mp-footer--public-minimal {
  margin-top: 0;
  padding: 8px 0 18px;
  border-top: 0;
}
.portal-public .mp-footer--public-minimal .mp-footer__inner {
  display: grid;
  gap: 0.8rem 1.1rem;
  align-items: start;
  justify-items: start;
  max-width: min(100%, var(--site-width));
  padding-top: 0.95rem;
  border-top: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  text-align: left;
}
.portal-public .mp-footer__brand-block {
  display: grid;
  gap: 0.42rem;
}
.portal-public .mp-footer__tagline {
  margin: 0;
  max-width: 32ch;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  font-size: 0.94rem;
  line-height: 1.52;
}
.portal-public .mp-footer--public-minimal .mp-footer__links {
  justify-content: flex-start;
  gap: 0.65rem 1rem;
  font-size: 0.94rem;
}
.portal-public .mp-footer--public-minimal .mp-footer__legal {
  max-width: 40ch;
  gap: 0.28rem;
  margin-top: 0;
}
.portal-public .auth-split--public-auth {
  gap: clamp(0.85rem, 1.5vw, 1.2rem);
}
.portal-public .auth-panel--tabbed,
.portal-public .auth-aside--public-auth {
  border: 1px solid color-mix(in srgb, var(--line-default) 78%, transparent);
  border-radius: 30px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 90%, white 10%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
  box-shadow: var(--shadow-sm);
}
.portal-public .auth-tabs {
  padding: 5px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
}
.portal-public .auth-tabs .tab-button,
.portal-public .auth-switch__tab {
  color: var(--text-body);
  border-radius: 999px;
}
.portal-public .auth-tabs .tab-button.is-active,
.portal-public .auth-tabs .tab-button[aria-selected="true"],
.portal-public .auth-switch__tab.is-active,
.portal-public .auth-switch__tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  color: var(--text-strong);
  box-shadow: 0 10px 22px #1f253414;
}
.portal-public .auth-panel-heading h1 {
  font-weight: 700;
}
.portal-public .auth-panel .inline-notice,
.portal-public .auth-support-card,
.portal-public .auth-point,
.portal-public .auth-aside-highlight {
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
  box-shadow: none;
}
.portal-public .auth-support-card {
  padding: 0.86rem 0.92rem;
  border-radius: 20px;
}
.portal-public .auth-aside--public-auth {
  gap: 0.9rem;
}
.portal-public .auth-aside-copy {
  display: grid;
  gap: 0.35rem;
}
.portal-public .auth-aside-summary {
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__screen--theme-invert
  img,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__screen--theme-invert
  img,
body.theme-dark.portal-public .landing-hero-proof__screen--theme-invert img {
  filter: invert(1) hue-rotate(180deg) brightness(0.88) saturate(0.86)
    contrast(0.96);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--theme-invert
  > img,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--theme-invert
  > img,
body.theme-dark.portal-public .landing-hero-proof__slide--theme-invert > img {
  filter: invert(1) hue-rotate(180deg) brightness(0.88) saturate(0.86)
    contrast(0.96);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__detail-media--theme-invert
  img,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__detail-media--theme-invert
  img,
body.theme-dark.portal-public
  .landing-hero-proof__detail-media--theme-invert
  img {
  filter: invert(1) hue-rotate(180deg) brightness(0.88) saturate(0.86)
    contrast(0.96);
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game {
  background:
    radial-gradient(
      circle at top right,
      rgba(111, 134, 216, 0.24),
      transparent 34%
    ),
    linear-gradient(180deg, #28314f, #1b2237 72%);
  border-color: #54669a6b;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat {
  background: #f6f8ff14;
  border-color: #90a1d833;
  box-shadow: none;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__equation-card
  > span,
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__stat
  > span,
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__track-node
  > span,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__equation-card
  > span,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__stat
  > span,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__track-node
  > span,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__equation-card
  > span,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__stat
  > span,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock--game
  .hero-showcase-mock__track-node
  > span {
  color: #e8eeffb8;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat
  strong,
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__equation-card
  strong,
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__answer,
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__track-node,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat
  strong,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__equation-card
  strong,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__answer,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__track-node,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__stat
  strong,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__equation-card
  strong,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__answer,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__surface--game
  .hero-showcase-mock__track-node {
  color: #f8faff;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card {
  background: linear-gradient(180deg, #f8faff1f, #ffffff14);
  border: 1px solid rgba(144, 161, 216, 0.24);
  box-shadow: none;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card
  small,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card
  small,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__equation-card
  small {
  color: #e8eeffb8;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer {
  background: #f8faff14;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer--correct,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer--correct,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__answer--correct {
  background: linear-gradient(180deg, #84adff61, #6f86d852);
  box-shadow: 0 14px 24px #111c3a2e;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node {
  border-color: #90a1d82e;
  background: #f8faff0f;
}
html[data-appearance="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node--active,
html[data-theme="dark"]
  body.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node--active,
body.theme-dark.portal-public
  .landing-hero-proof__slide--mock
  .hero-showcase-mock__track-node--active {
  background: linear-gradient(180deg, #ff965e7a, #ff773e66);
}
@media (min-width: 900px) {
  .portal-public .mp-footer--public-minimal .mp-footer__inner {
    grid-template-columns: minmax(0, 1.1fr) auto minmax(220px, 0.9fr);
  }
}
@media (min-width: 1024px) {
  .portal-public .homepage-shell--editorial .homepage-hero--editorial {
    grid-template-columns: minmax(0, 0.72fr) minmax(620px, 1.28fr);
  }
  .portal-public .landing-progress-panel {
    grid-template-columns: minmax(0, 0.96fr) minmax(320px, 0.84fr);
    align-items: center;
  }
  .portal-public .landing-progress-panel__visual {
    max-width: 420px;
    justify-self: end;
  }
  .portal-public .landing-route-band {
    grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr);
    align-items: center;
  }
}
@media (min-width: 1280px) and (max-height: 1100px) {
  .portal-public .mp-topbar--public-home .mp-topbar__inner {
    min-height: 68px;
    padding: 7px 12px;
    border-radius: 28px;
  }
  .portal-public
    .mp-topbar--public-home
    .mp-public-auth-actions
    .mp-inline-link--button {
    min-height: 42px;
    padding-inline: 0.95rem;
  }
  .portal-public .homepage-shell--editorial {
    gap: 1.15rem;
    padding-top: 6px;
  }
  .portal-public .homepage-shell--editorial .homepage-hero--editorial {
    gap: 1.2rem;
    min-height: 625px;
    padding: 1.28rem 1.34rem 1.24rem;
    border-radius: 34px;
  }
  .portal-public .homepage-shell--editorial .homepage-hero__copy--editorial {
    gap: 0.78rem;
    max-width: 34rem;
  }
  .portal-public .homepage-shell--editorial .homepage-hero__eyebrow {
    font-size: 0.78rem;
    letter-spacing: 0.09em;
  }
  .portal-public .homepage-shell--editorial .homepage-hero__copy--editorial h1 {
    max-width: 10ch;
    font-size: clamp(2.7rem, 4.2vw, 3.95rem);
    line-height: 0.92;
  }
  .portal-public .homepage-shell--editorial .homepage-hero__sub--editorial {
    max-width: 29ch;
    font-size: 0.94rem;
    line-height: 1.38;
  }
  .portal-public .homepage-shell--editorial .homepage-hero__actions--editorial {
    gap: 0.55rem 0.9rem;
  }
  .portal-public
    .homepage-shell--editorial
    .homepage-hero__actions--editorial
    .homepage-btn--primary {
    min-width: min(100%, 172px);
    min-height: 44px;
    padding-inline: 1rem;
  }
  .portal-public .homepage-shell--editorial .landing-inline-link {
    min-height: 38px;
    font-size: 0.92rem;
  }
  .portal-public .landing-proof-line {
    gap: 0.45rem 0.6rem;
  }
  .portal-public .landing-proof-line__item {
    min-height: 34px;
    gap: 0.48rem;
    padding: 0 0.72rem;
    font-size: 0.84rem;
  }
  .portal-public .landing-proof-line__item:before {
    width: 6px;
    height: 6px;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-100) 68%, transparent);
  }
  .portal-public .landing-hero-proof__frame {
    gap: 0.5rem;
    padding: 0.76rem 0.8rem 0.68rem;
    border-radius: 28px;
  }
  .portal-public .landing-hero-proof__frame--visual-only {
    padding: 0;
    border-radius: 0;
  }
  .portal-public
    .landing-hero-proof__frame--visual-only
    .landing-hero-proof__stage {
    min-height: 520px;
    border-radius: 28px;
  }
  .portal-public .landing-hero-proof__meta {
    gap: 0.65rem;
  }
  .portal-public .landing-hero-proof__intro strong {
    font-size: 0.94rem;
  }
  .portal-public .landing-hero-proof__tag {
    min-height: 28px;
    padding: 0 0.68rem;
    font-size: 0.74rem;
  }
  .portal-public .landing-hero-proof__switch {
    gap: 0.38rem;
  }
  .portal-public .landing-hero-proof__switch-btn {
    min-height: 44px;
    padding: 0 0.7rem;
    font-size: 0.78rem;
  }
  .portal-public .landing-hero-proof__stage {
    min-height: 286px;
    border-radius: 22px;
  }
  .portal-public .landing-hero-proof__slide {
    padding: 0.48rem;
  }
  .portal-public
    .landing-hero-proof__frame--visual-only
    .landing-hero-proof__slide {
    padding: 0;
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock {
    gap: 0.32rem;
    padding: 0;
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__badge,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__soft-badge {
    min-height: 1.8rem;
    padding: 0 0.76rem;
    font-size: 0.72rem;
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__copy
    > strong {
    font-size: 0.94rem;
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__surface--reasoning,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__surface--game,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__surface--advanced {
    gap: 0.48rem;
    padding: 0.62rem;
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__canvas-card {
    min-height: 194px;
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__tool,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__rail-note,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__rail-answer {
    padding: 0.58rem 0.52rem;
    font-size: 0.74rem;
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__stat,
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__metric,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__equation-card,
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__panel {
    padding: 0.68rem 0.74rem;
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__equation-card
    strong {
    font-size: clamp(1.42rem, 2.4vw, 1.9rem);
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__equation-card
    small,
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__panel
    small {
    font-size: 0.76rem;
    line-height: 1.34;
  }
  .portal-public .landing-hero-proof__slide--mock .hero-showcase-mock__answer {
    min-height: 2.62rem;
    font-size: 0.96rem;
  }
  .portal-public
    .landing-hero-proof__slide--mock
    .hero-showcase-mock__track-node {
    min-height: 2.06rem;
    font-size: 0.72rem;
  }
  .portal-public .landing-hero-proof__footer {
    min-height: 3.1rem;
  }
  .portal-public .landing-hero-proof__footer-copy strong {
    font-size: 0.94rem;
  }
  .portal-public .landing-hero-proof__footer-copy p {
    font-size: 0.84rem;
    line-height: 1.42;
  }
  .portal-public .homepage-shell--editorial .homepage-section {
    gap: 0.78rem;
  }
  .portal-public .homepage-section--reasons {
    gap: 0.92rem;
    padding-bottom: 0.7rem;
  }
  .portal-public .homepage-section--editorial-routine {
    padding-top: clamp(2.4rem, 4.8vh, 3.6rem);
  }
  .portal-public .homepage-shell--editorial .landing-section-head {
    gap: 0.26rem;
    max-width: 30rem;
  }
  .portal-public .homepage-section--reasons .homepage-section__title {
    max-width: none;
    font-size: clamp(1.78rem, 2.35vw, 2.45rem);
    line-height: 0.97;
  }
  .portal-public .homepage-section--reasons .homepage-section__sub {
    max-width: 27ch;
    font-size: 0.88rem;
    line-height: 1.36;
  }
  .portal-public .homepage-shell--editorial .landing-reason-grid {
    gap: 0.62rem;
  }
  .portal-public .homepage-shell--editorial .landing-reason-card {
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.78rem;
    row-gap: 0.2rem;
    align-items: start;
    padding: 0.92rem 0.96rem;
    min-height: 0;
  }
  .portal-public .homepage-shell--editorial .landing-reason-card__header {
    display: contents;
  }
  .portal-public .homepage-shell--editorial .landing-reason-card__icon {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }
  .portal-public .homepage-shell--editorial .landing-reason-card__icon svg {
    width: 18px;
    height: 18px;
  }
  .portal-public .homepage-shell--editorial .landing-reason-card h3 {
    grid-column: 2;
    align-self: center;
    max-width: none;
    font-size: clamp(0.98rem, 1.06vw, 1.12rem);
    line-height: 1.06;
  }
  .portal-public .homepage-shell--editorial .landing-reason-card__body {
    grid-column: 2;
    margin-top: 0.04rem;
    font-size: 0.8rem;
    line-height: 1.34;
  }
}
@media (max-width: 1023px) {
  .portal-public .homepage-shell--editorial .homepage-hero__copy--editorial h1,
  .portal-public .homepage-shell--editorial .homepage-section__title {
    max-width: none;
  }
  .portal-public .homepage-shell--editorial .landing-reason-grid,
  .portal-public .landing-routine-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-public .landing-progress-signals,
  .portal-public .landing-route-strip--editorial {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .portal-public .homepage-shell--editorial .homepage-hero__actions--editorial {
    flex-direction: column;
    align-items: stretch;
  }
  .portal-public
    .homepage-shell--editorial
    .homepage-hero__actions--editorial
    > .btn,
  .portal-public
    .homepage-shell--editorial
    .homepage-hero__actions--editorial
    > a {
    width: 100%;
  }
  .portal-public .landing-hero-proof__details,
  .portal-public .homepage-shell--editorial .landing-reason-grid,
  .portal-public .landing-routine-grid,
  .portal-public .landing-progress-audience-grid {
    grid-template-columns: 1fr;
  }
  .portal-public .landing-route-band__actions {
    justify-items: stretch;
  }
  .portal-public .mp-footer--public-minimal .mp-footer__inner {
    justify-items: start;
  }
}
.student-home-topdeck {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: 14px;
  align-items: stretch;
}
.student-home-topdeck__mission,
.student-home-topdeck__identity {
  min-width: 0;
}
.student-home-topdeck__mission > *,
.student-home-topdeck__identity > * {
  height: 100%;
}
.student-home-topdeck__identity {
  display: grid;
}
.student-home-topdeck__identity-stack {
  display: grid;
  gap: 12px;
  align-content: start;
  min-width: 0;
}
.student-home-mission-dash {
  position: relative;
  display: grid;
  gap: 16px;
  min-height: 100%;
  padding: 21px;
  border-radius: 28px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(31, 47, 82, 0.14)
    );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 13%,
        transparent
      ),
      transparent 40%
    ),
    linear-gradient(
      155deg,
      color-mix(in srgb, white 96%, var(--student-theme-secondary, #dce6ff) 4%),
      color-mix(in srgb, white 90%, var(--student-theme-primary, #5a78ff) 10%)
    );
  box-shadow: 0 14px 30px
    color-mix(
      in srgb,
      rgba(32, 45, 73, 0.09) 76%,
      var(--student-theme-primary, #5a78ff) 24%
    );
  overflow: hidden;
}
.student-home-mission-dash__header,
.student-home-mission-dash__copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.student-home-mission-dash__header {
  gap: 10px;
}
.student-home-mission-dash__headline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  min-width: 0;
}
.student-home-mission-dash__copy h1,
.student-home-mission-dash__headline h1 {
  margin: 0;
  font-size: clamp(2rem, 3.1vw, 2.75rem);
  line-height: 0.96;
  text-wrap: balance;
}
.student-home-mission-dash__copy p,
.student-home-mission-dash__header > p,
.student-home-mission-dash__support {
  margin: 0;
  max-width: 40ch;
  font-size: 0.95rem;
  line-height: 1.45;
}
.student-home-mission-dash__summary-meta {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  max-width: 100%;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 10%,
      rgba(27, 42, 68, 0.06)
    );
  background: #ffffff70;
  color: #1b2a44c2;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.3;
  justify-self: end;
}
.student-home-mission-dash__inline-chips {
  justify-content: flex-start;
}
.student-home-deck-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  padding: 7px 11px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(27, 42, 68, 0.1)
    );
  background: #ffffffc2;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.student-home-deck-chip--theme > span:first-child {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    white 72%,
    var(--student-theme-secondary, #dce6ff) 28%
  );
}
.student-home-status-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-home-mission-dash__hero-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  min-width: 0;
  padding: 12px 15px;
  border-radius: 24px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 10%,
      rgba(27, 42, 68, 0.06)
    );
  background: linear-gradient(180deg, #ffffffa3, #fff6);
  backdrop-filter: blur(8px);
}
.student-home-mission-dash__hero-copy {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}
.student-home-mission-dash__hero-copy h2 {
  margin: 0;
  font-size: clamp(1.22rem, 2vw, 1.6rem);
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.student-home-mission-dash__hero-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  align-self: center;
}
.student-home-mission-dash__cta {
  min-width: 148px;
}
.student-home-mini-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.student-home-status-chip {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 12px 11px;
  border-radius: 20px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 9%,
      rgba(27, 42, 68, 0.06)
    );
  background: linear-gradient(180deg, #ffffff7a, #ffffff42);
}
.student-home-status-chip__label,
.student-home-status-chip__meta {
  font-size: 0.76rem;
  line-height: 1.35;
}
.student-home-status-chip__label {
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #1b2a44b8;
}
.student-home-status-chip__value {
  font-size: 1rem;
  line-height: 1.08;
}
.student-home-status-chip__meta {
  color: #1b2a44b3;
}
.student-home-current-row--competition {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 18%,
    rgba(27, 42, 68, 0.08)
  );
  background: linear-gradient(
    180deg,
    #ffffffeb,
    color-mix(in srgb, white 78%, var(--student-theme-secondary, #dce6ff) 22%)
  );
}
.student-home-identity-card,
.student-home-progress-dash {
  position: relative;
  display: grid;
  gap: 14px;
  min-width: 0;
  overflow: hidden;
}
.student-home-identity-card {
  padding: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(31, 47, 82, 0.14)
    );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 13%,
        transparent
      ),
      transparent 42%
    ),
    linear-gradient(
      160deg,
      color-mix(in srgb, white 97%, var(--student-theme-secondary, #dce6ff) 3%),
      color-mix(in srgb, white 90%, var(--student-theme-primary, #5a78ff) 10%)
    );
  box-shadow: 0 13px 28px
    color-mix(
      in srgb,
      rgba(32, 45, 73, 0.07) 78%,
      var(--student-theme-primary, #5a78ff) 22%
    );
}
.student-home-identity-card:before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 74px;
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(255, 255, 255, 0.86)
    ),
    transparent
  );
  pointer-events: none;
}
.student-home-identity-card > * {
  position: relative;
  z-index: 1;
}
.student-home-identity-card__header,
.student-home-progress-dash__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.student-home-identity-card__header-copy,
.student-home-progress-dash__heading {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-home-identity-card__header h2,
.student-home-progress-dash__heading h2 {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.15;
}
.student-home-inline-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  min-height: 28px;
  color: #1b2a449e;
  font-size: 0.76rem;
  font-weight: 600;
  text-decoration: none;
}
.student-home-inline-action:is(:hover, :focus-visible) {
  color: var(--student-theme-primary, #3558e8);
}
.student-home-inline-action:focus-visible {
  outline: 2px solid
    color-mix(in srgb, var(--student-theme-primary, #5a78ff) 58%, white);
  outline-offset: 3px;
  border-radius: 999px;
}
.student-home-identity-card__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-width: 0;
  padding-block: 2px;
}
.student-home-identity-card__hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
}
.student-home-identity-card__avatar {
  min-width: 0;
}
.student-home-identity-card__avatar-frame {
  width: 62px;
  height: 62px;
  border-radius: 18px;
}
.student-home-identity-card__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-home-identity-card__copy h3 {
  margin: 0;
  font-size: clamp(1.36rem, 2vw, 1.78rem);
  line-height: 1.02;
  overflow-wrap: anywhere;
}
.student-home-identity-card__level {
  font-size: 0.96rem;
  font-weight: 800;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.student-home-identity-card__meta {
  color: #1b2a44b8;
  font-size: 0.88rem;
  line-height: 1.4;
}
.student-home-identity-card__emblem {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px 12px;
  width: clamp(140px, 34%, 188px);
  min-width: 140px;
  min-height: 90px;
  padding: 12px 14px;
  border-radius: 22px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(31, 47, 82, 0.12)
    );
  background: linear-gradient(
    180deg,
    #ffffffbd,
    color-mix(in srgb, white 78%, var(--student-theme-secondary, #dce6ff) 22%)
  );
  text-align: left;
}
.student-home-identity-card__emblem-icon {
  font-size: 1.6rem;
  line-height: 1;
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: color-mix(
    in srgb,
    white 74%,
    var(--student-theme-secondary, #dce6ff) 26%
  );
}
.student-home-identity-card__emblem-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.student-home-identity-card__emblem-label {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #1b2a449e;
}
.student-home-identity-card__emblem-title {
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.12;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.student-home-identity-card__emblem-token {
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.student-home-identity-card__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 10px;
  min-width: 0;
  padding-top: 12px;
  border-top: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 10%,
      rgba(31, 47, 82, 0.08)
    );
}
.student-home-identity-card__theme-chip,
.student-home-identity-card__status-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 12%,
      rgba(31, 47, 82, 0.08)
    );
  font-size: 0.74rem;
  font-weight: 700;
}
.student-home-identity-card__theme-chip {
  background: color-mix(
    in srgb,
    white 82%,
    var(--student-theme-secondary, #dce6ff) 18%
  );
}
.student-home-identity-card__status-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  flex: 1 1 220px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.student-home-identity-card__status-pill {
  background: #ffffffb8;
}
.student-home-progress-dash__header-summary {
  display: grid;
  gap: 3px;
  min-width: 0;
  justify-items: end;
  text-align: right;
}
.student-home-progress-dash__header-summary strong {
  font-size: clamp(1.22rem, 1.7vw, 1.46rem);
  line-height: 0.94;
}
.student-home-progress-dash__header-summary span {
  max-width: 18ch;
  color: #1b2a44b8;
  font-size: 0.8rem;
  line-height: 1.35;
}
.student-home-progress-dash {
  padding: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 14%,
      rgba(31, 47, 82, 0.12)
    );
  background: linear-gradient(
    180deg,
    #fffffffa,
    color-mix(in srgb, white 90%, var(--student-theme-secondary, #dce6ff) 10%)
  );
  box-shadow: 0 11px 24px #1f2f5212;
}
.student-home-progress-dash__meter-block {
  display: grid;
  gap: 10px;
  padding: 13px 14px;
  border-radius: 20px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 8%,
      rgba(31, 47, 82, 0.06)
    );
  background: linear-gradient(
    180deg,
    #ffffff9e,
    color-mix(in srgb, white 86%, var(--student-theme-secondary, #dce6ff) 14%)
  );
}
.student-home-progress-dash__meter-head,
.student-home-progress-dash__journey {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.student-home-progress-dash__meter-head span,
.student-home-progress-dash__journey span,
.student-home-progress-dash__note,
.student-home-progress-dash__stat-meta {
  color: #1b2a44b8;
}
.student-home-progress-dash__meter-head span,
.student-home-progress-dash__stat-label {
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.student-home-progress-dash__meter-head strong {
  font-size: 1rem;
  line-height: 1;
}
.student-home-progress-dash__meter {
  width: 100%;
  height: 11px;
  border: none;
  border-radius: 999px;
  overflow: hidden;
  appearance: none;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 10%,
    rgba(31, 47, 82, 0.08)
  );
}
.student-home-progress-dash__meter::-webkit-progress-bar {
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 10%,
    rgba(31, 47, 82, 0.08)
  );
  border-radius: 999px;
}
.student-home-progress-dash__meter::-webkit-progress-value {
  background: linear-gradient(
    90deg,
    var(--student-theme-primary, #5a78ff),
    color-mix(
      in srgb,
      var(--student-theme-secondary, #dce6ff) 42%,
      var(--student-theme-primary, #5a78ff) 58%
    )
  );
  border-radius: 999px;
}
.student-home-progress-dash__meter::-moz-progress-bar {
  background: linear-gradient(
    90deg,
    var(--student-theme-primary, #5a78ff),
    color-mix(
      in srgb,
      var(--student-theme-secondary, #dce6ff) 42%,
      var(--student-theme-primary, #5a78ff) 58%
    )
  );
  border-radius: 999px;
}
.student-home-progress-dash__journey {
  align-items: start;
  font-size: 0.88rem;
  line-height: 1.4;
}
.student-home-progress-dash__journey span {
  overflow-wrap: anywhere;
}
.student-home-progress-dash__journey span:last-child {
  text-align: right;
}
.student-home-progress-dash__note {
  margin: 0;
}
.student-home-progress-dash__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-home-progress-dash__stat {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 11px 12px;
  border-radius: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 8%,
      rgba(31, 47, 82, 0.06)
    );
  background: linear-gradient(180deg, #ffffff8a, #ffffff57);
}
.student-home-progress-dash__stat-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}
.student-home-progress-dash__stat-label {
  flex: 1 1 96px;
  min-width: 0;
}
.student-home-progress-dash__stat-value {
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 1.06rem;
  line-height: 1.08;
  text-align: right;
  white-space: nowrap;
  overflow-wrap: anywhere;
}
.student-home-console-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}
.student-home-console-grid > .student-card {
  min-height: 100%;
}
.student-home-console-card {
  gap: 12px;
  border: 1px solid rgba(31, 47, 82, 0.08);
  background: linear-gradient(180deg, #fffffffa, #f8faffeb);
  box-shadow: 0 10px 24px #1f2f5212;
}
.student-home-homework-card {
  gap: 12px;
}
.student-home-homework-card__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}
.student-home-homework-card__header-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-home-homework-card__header-copy h2 {
  margin: 0;
  font-size: clamp(1.24rem, 1.8vw, 1.56rem);
}
.student-home-homework-card__note {
  margin: -2px 0 0;
  max-width: 62ch;
}
.student-home-homework-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 12px;
  flex-wrap: wrap;
}
.student-home-console-card__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.78fr);
  align-items: end;
  gap: 14px;
}
.student-home-console-card__header-note {
  margin: 0;
  max-width: 28ch;
  justify-self: end;
  text-align: right;
}
.student-home-start-card .student-practice-start-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.student-home-start-card .student-practice-start-card {
  min-height: 104px;
  padding: 12px 12px 11px;
}
.student-home-start-card .student-practice-start-card__visual {
  transform: scale(0.82);
}
.student-home-start-card .student-practice-start-card__title {
  font-size: 0.94rem;
  line-height: 1.16;
}
.student-home-start-card .student-practice-start-card__detail {
  font-size: 0.81rem;
  line-height: 1.28;
}
.student-home-start-card .student-practice-start-card__cta {
  min-height: 30px;
  padding: 0 10px;
  font-size: 0.76rem;
}
.student-home-start-card .section-header h2,
.student-home-overview-card .section-header h2 {
  font-size: clamp(1.24rem, 1.7vw, 1.52rem);
}
.student-home-overview-card .student-compact-list > :first-child {
  border-radius: 20px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 10%,
      rgba(31, 47, 82, 0.08)
    );
  background: linear-gradient(
    180deg,
    #ffffffe0,
    color-mix(in srgb, white 82%, var(--student-theme-secondary, #dce6ff) 18%)
  );
  box-shadow: none;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-mission-dash,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-mission-dash,
body.theme-dark .student-shell[data-learner-theme] .student-home-mission-dash,
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-identity-card,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-identity-card,
body.theme-dark .student-shell[data-learner-theme] .student-home-identity-card,
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-progress-dash,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-progress-dash,
body.theme-dark .student-shell[data-learner-theme] .student-home-progress-dash,
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-console-card,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-console-card,
body.theme-dark .student-shell[data-learner-theme] .student-home-console-card {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 18%,
        transparent
      ),
      transparent 44%
    ),
    linear-gradient(
      155deg,
      var(--student-theme-dark-surface),
      var(--student-theme-dark-surface-soft)
    );
  box-shadow: 0 22px 48px var(--student-theme-dark-glow);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash__hero-row,
    .student-home-status-chip,
    .student-home-deck-chip,
    .student-home-current-row--competition,
    .student-home-identity-card__theme-chip,
    .student-home-identity-card__status-pill,
    .student-home-identity-card__emblem,
    .student-home-progress-dash__meter-block,
    .student-home-progress-dash__stat,
    .student-home-overview-card .student-compact-list > :first-child,
    .student-home-overview-card .student-home-quick-link
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash__hero-row,
    .student-home-status-chip,
    .student-home-deck-chip,
    .student-home-current-row--competition,
    .student-home-identity-card__theme-chip,
    .student-home-identity-card__status-pill,
    .student-home-identity-card__emblem,
    .student-home-progress-dash__meter-block,
    .student-home-progress-dash__stat,
    .student-home-overview-card .student-compact-list > :first-child,
    .student-home-overview-card .student-home-quick-link
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash__hero-row,
    .student-home-status-chip,
    .student-home-deck-chip,
    .student-home-current-row--competition,
    .student-home-identity-card__theme-chip,
    .student-home-identity-card__status-pill,
    .student-home-identity-card__emblem,
    .student-home-progress-dash__meter-block,
    .student-home-progress-dash__stat,
    .student-home-overview-card .student-compact-list > :first-child,
    .student-home-overview-card .student-home-quick-link
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(188, 198, 230, 0.18)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(19, 28, 48, 0.96) 82%,
      var(--student-theme-primary, #5a78ff) 18%
    ),
    #0a101ef2
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash__copy p,
    .student-home-mission-dash__support,
    .student-home-status-chip__label,
    .student-home-status-chip__meta,
    .student-home-identity-card__meta,
    .student-home-inline-action,
    .student-home-progress-dash__meter-head span,
    .student-home-progress-dash__journey span,
    .student-home-progress-dash__note,
    .student-home-progress-dash__stat-meta
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash__copy p,
    .student-home-mission-dash__support,
    .student-home-status-chip__label,
    .student-home-status-chip__meta,
    .student-home-identity-card__meta,
    .student-home-inline-action,
    .student-home-progress-dash__meter-head span,
    .student-home-progress-dash__journey span,
    .student-home-progress-dash__note,
    .student-home-progress-dash__stat-meta
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash__copy p,
    .student-home-mission-dash__support,
    .student-home-status-chip__label,
    .student-home-status-chip__meta,
    .student-home-identity-card__meta,
    .student-home-inline-action,
    .student-home-progress-dash__meter-head span,
    .student-home-progress-dash__journey span,
    .student-home-progress-dash__note,
    .student-home-progress-dash__stat-meta
  ) {
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash h1,
    .student-home-mission-dash h2,
    .student-home-status-chip__value,
    .student-home-deck-chip,
    .student-home-identity-card h2,
    .student-home-identity-card h3,
    .student-home-identity-card__level,
    .student-home-progress-dash h2,
    .student-home-progress-dash__meter-head strong,
    .student-home-progress-dash__stat-value
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash h1,
    .student-home-mission-dash h2,
    .student-home-status-chip__value,
    .student-home-deck-chip,
    .student-home-identity-card h2,
    .student-home-identity-card h3,
    .student-home-identity-card__level,
    .student-home-progress-dash h2,
    .student-home-progress-dash__meter-head strong,
    .student-home-progress-dash__stat-value
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-mission-dash h1,
    .student-home-mission-dash h2,
    .student-home-status-chip__value,
    .student-home-deck-chip,
    .student-home-identity-card h2,
    .student-home-identity-card h3,
    .student-home-identity-card__level,
    .student-home-progress-dash h2,
    .student-home-progress-dash__meter-head strong,
    .student-home-progress-dash__stat-value
  ) {
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-progress-dash__meter,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-progress-dash__meter,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-progress-dash__meter,
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-progress-dash__meter::-webkit-progress-bar,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-progress-dash__meter::-webkit-progress-bar,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-progress-dash__meter::-webkit-progress-bar {
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 18%,
    rgba(188, 198, 230, 0.12)
  );
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  .student-home-progress-dash {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 26%,
    rgba(188, 198, 230, 0.18)
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 18%,
        transparent
      ),
      transparent 46%
    ),
    linear-gradient(160deg, #10182cfa, #0a0f1dfa);
  box-shadow: 0 18px 34px #0000003d;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  :is(
    .student-home-progress-dash__meter-block,
    .student-home-progress-dash__stat
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(188, 198, 230, 0.16)
  );
  background: linear-gradient(180deg, #141d34f5, #0b1120f5);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  :is(
    .student-home-progress-dash h2,
    .student-home-progress-dash__meter-head strong,
    .student-home-progress-dash__stat-value
  ) {
  color: var(--student-theme-dark-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  :is(
    .student-home-progress-dash__meter-head span,
    .student-home-progress-dash__journey span,
    .student-home-progress-dash__note,
    .student-home-progress-dash__stat-label,
    .student-home-progress-dash__stat-meta
  ) {
  color: var(--student-theme-dark-muted);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  .student-profile-preview-card__progress {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(188, 198, 230, 0.16)
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 14%,
        transparent
      ),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(18, 27, 45, 0.96) 82%,
        var(--student-theme-primary, #5a78ff) 18%
      ),
      #0a101ef5
    );
  box-shadow:
    0 14px 30px #00000038,
    inset 0 1px #ffffff0d;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  :is(
    .student-profile-preview-card__progress-head span,
    .student-profile-preview-card__progress-foot
  ) {
  color: var(--student-theme-dark-muted);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  .student-profile-preview-card__progress-head
  strong {
  color: var(--student-theme-dark-strong);
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  .student-profile-preview-card__avatar {
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 24%,
      rgba(188, 198, 230, 0.16)
    );
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.08),
      transparent 48%
    ),
    linear-gradient(160deg, #141d34fa, #0b111ffa);
  box-shadow:
    0 16px 34px #00000042,
    inset 0 1px #ffffff0f;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .student-profile-page--player-setup
  .student-profile-preview-card__avatar
  .learner-avatar__fallback {
  color: var(--student-theme-dark-strong);
  opacity: 1;
  text-shadow: none;
}
@media (max-width: 1240px) {
  .student-home-topdeck {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.94fr);
  }
}
@media (max-width: 980px) {
  .student-home-topdeck,
  .student-home-mini-status-grid,
  .student-home-console-grid,
  .student-home-progress-dash__stats {
    grid-template-columns: 1fr;
  }
  .student-home-start-card .student-practice-start-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-home-mission-dash__hero-row {
    grid-template-columns: 1fr;
  }
  .student-home-mission-dash__hero-action {
    justify-content: flex-start;
  }
  .student-home-mission-dash__headline,
  .student-home-console-card__header,
  .student-home-homework-card__header {
    grid-template-columns: 1fr;
  }
  .student-home-console-card__header-note {
    justify-self: start;
    text-align: left;
    max-width: none;
  }
  .student-home-mission-dash__summary-meta {
    justify-self: start;
  }
}
@media (max-width: 720px) {
  .student-home-mission-dash,
  .student-home-identity-card,
  .student-home-progress-dash {
    padding: 16px;
  }
  .student-home-mission-dash__copy h1 {
    font-size: clamp(1.76rem, 6.8vw, 2.26rem);
  }
  .student-home-mission-dash__copy p,
  .student-home-mission-dash__support {
    max-width: none;
  }
  .student-home-identity-card__body {
    grid-template-columns: 1fr;
  }
  .student-home-progress-dash__journey {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: flex-start;
  }
  .student-home-progress-dash__journey span:last-child {
    text-align: left;
  }
  .student-home-identity-card__footer {
    gap: 8px;
  }
  .student-home-progress-dash__header-summary {
    justify-items: start;
    text-align: left;
  }
  .student-home-start-card .student-practice-start-grid,
  .student-home-overview-card .student-home-quick-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .student-home-topdeck {
    gap: 10px;
  }
  .student-home-mission-dash {
    gap: 14px;
  }
  .student-home-mission-dash__hero-row {
    padding: 14px;
  }
  .student-home-status-chip {
    padding: 9px 11px 10px;
  }
  .student-home-identity-card__hero {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .student-home-identity-card__body {
    grid-template-columns: 1fr;
  }
  .student-home-identity-card__avatar-frame {
    width: 54px;
    height: 54px;
  }
  .student-home-identity-card__emblem {
    width: 78px;
    min-width: 78px;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    padding: 12px 10px;
    text-align: center;
  }
  .student-home-identity-card__emblem-icon {
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
  }
  .student-home-identity-card__emblem-copy {
    justify-items: center;
  }
  .student-home-identity-card__emblem-label,
  .student-home-identity-card__emblem-title {
    display: none;
  }
  .student-home-identity-card__copy h3 {
    font-size: 1.48rem;
  }
  .student-home-inline-action {
    font-size: 0.74rem;
  }
  .student-home-identity-card__header {
    align-items: flex-start;
  }
  .student-home-start-card .student-practice-start-grid {
    grid-template-columns: 1fr;
  }
}
body.portal-public {
  --public-display-font:
    "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --public-ui-font:
    "Aptos", "Segoe UI Variable", "Segoe UI", "Helvetica Neue", sans-serif;
}
.portal-public .mp-public-page {
  --public-shell-max: var(--site-max);
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.7rem);
  padding-top: clamp(0.8rem, 2vw, 1.2rem);
  padding-bottom: clamp(1.5rem, 3vw, 2.6rem);
}
.portal-public .mp-public-landing {
  gap: clamp(1.7rem, 3vw, 3rem);
}
.portal-public .mp-public-kicker,
.portal-public .mp-public-section__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 760;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 82%, white 18%);
}
.portal-public .mp-public-kicker:before,
.portal-public .mp-public-section__eyebrow:before {
  content: "";
  width: 0.56rem;
  height: 0.56rem;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-500) 88%, white 12%),
    color-mix(in srgb, var(--brand-700) 82%, var(--brand-500) 18%)
  );
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--brand-100) 52%, transparent);
}
.portal-public .mp-public-landing__hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(34rem, 1.1fr);
  gap: clamp(0.72rem, 1.35vw, 1.1rem);
  align-items: stretch;
  padding: clamp(1.15rem, 2.6vw, 2.2rem);
  border-radius: 40px;
  border: 1px solid color-mix(in srgb, var(--line-default) 78%, transparent);
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.82),
      transparent 30%
    ),
    radial-gradient(
      circle at 82% 18%,
      rgba(125, 160, 255, 0.16),
      transparent 32%
    ),
    radial-gradient(
      circle at 58% 92%,
      rgba(255, 220, 172, 0.16),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--bg-panel) 96%, white 4%),
      color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%) 54%,
      color-mix(in srgb, var(--brand-100) 13%, var(--bg-panel-2) 87%)
    );
  box-shadow: 0 24px 58px #1b2a4417;
  overflow: clip;
}
.portal-public .mp-public-landing__copy {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: clamp(1.05rem, 2vw, 1.55rem);
  min-width: 0;
  max-width: 42rem;
  min-height: 100%;
  padding: clamp(0.8rem, 2vw, 1.55rem) clamp(0.55rem, 1.5vw, 1.65rem)
    clamp(0.65rem, 1.6vw, 1.2rem) 0;
}
.portal-public .mp-public-landing__copy-main {
  display: grid;
  gap: 1rem;
  max-width: 41rem;
  align-self: center;
  align-content: center;
}
.portal-public .mp-public-landing__actions {
  display: grid;
  gap: 0.72rem;
  justify-items: start;
  align-self: end;
}
.portal-public .mp-public-landing__copy h1,
.portal-public .mp-public-auth-intro h1 {
  margin: 0;
  max-width: 15.8ch;
  font-family: var(--public-display-font);
  font-size: clamp(2.8rem, 4.5vw, 4.55rem);
  line-height: 0.96;
  letter-spacing: -0.06em;
  font-weight: 700;
  color: var(--text-strong);
  text-wrap: balance;
}
.portal-public .mp-public-lead,
.portal-public .mp-public-auth-intro p {
  margin: 0;
  max-width: clamp(38ch, 36vw, 47ch);
  font-size: clamp(0.98rem, 1.04vw, 1.08rem);
  line-height: 1.5;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
}
.portal-public .mp-public-cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}
.portal-public .mp-public-cta-row .btn {
  width: min(10rem, calc((100% - 0.75rem) / 2));
  justify-content: center;
  text-align: center;
}
.portal-public .mp-public-chip-row,
.portal-public .mp-public-auth-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
.portal-public .mp-public-chip,
.portal-public .mp-public-auth-chip {
  display: inline-flex;
  align-items: center;
  min-height: 2.3rem;
  padding: 0 0.88rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 86%, white 14%);
  color: var(--text-strong);
  font-size: 0.86rem;
  font-weight: 710;
  line-height: 1.25;
}
.portal-public .mp-public-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
  margin-top: 0.35rem;
}
.portal-public .mp-public-metric {
  display: grid;
  gap: 0.28rem;
  min-height: 5.3rem;
  padding: 1rem 1.05rem;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
}
.portal-public .mp-public-metric span {
  font-size: 0.74rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 88%, white 12%);
}
.portal-public .mp-public-metric strong {
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: var(--text-strong);
}
.portal-public .mp-public-showcase {
  display: grid;
  gap: 0.78rem;
  min-width: 0;
  width: 100%;
  max-width: none;
  justify-self: stretch;
  align-self: stretch;
}
.portal-public .mp-public-showcase__frame {
  display: grid;
  gap: 0.8rem;
  min-width: 0;
  max-width: 100%;
  min-height: 100%;
  padding: clamp(0.9rem, 1.5vw, 1.15rem);
  border-radius: 34px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background:
    radial-gradient(
      circle at 86% 14%,
      rgba(125, 160, 255, 0.12),
      transparent 26%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 95%, white 5%),
      color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
    );
  box-shadow: 0 18px 40px #1b2a4416;
}
.portal-public .mp-public-showcase__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.7rem 1rem;
}
.portal-public .mp-public-showcase__controls {
  display: flex;
  align-items: center;
  gap: 0.72rem;
  min-width: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
}
.portal-public .mp-public-showcase__window {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  flex: 0 0 auto;
}
.portal-public .mp-public-showcase__window span {
  width: 0.72rem;
  height: 0.72rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-100) 52%, var(--bg-panel) 48%);
  border: 1px solid color-mix(in srgb, var(--line-default) 60%, transparent);
}
.portal-public .mp-public-showcase__window span:first-child {
  background: #ffb598b8;
}
.portal-public .mp-public-showcase__window span:nth-child(2) {
  background: #ffd28abd;
}
.portal-public .mp-public-showcase__window span:nth-child(3) {
  background: #9edbb4c2;
}
.portal-public .mp-public-showcase__copy {
  display: grid;
  justify-items: end;
  gap: 0.22rem;
  text-align: right;
  flex: 0 1 17.5rem;
  max-width: 17.5rem;
  min-width: 0;
}
.portal-public .mp-public-showcase__copy span,
.portal-public .mp-public-showcase__footer span {
  font-size: 0.73rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 88%, white 12%);
}
.portal-public .mp-public-showcase__copy strong,
.portal-public .mp-public-showcase__footer strong {
  color: var(--text-strong);
  font-size: 1.04rem;
  line-height: 1.26;
  letter-spacing: -0.02em;
}
.portal-public .mp-public-showcase__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.48rem;
  min-width: 0;
  flex: 1 1 17rem;
}
.portal-public .mp-public-showcase__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.24rem;
  padding: 0 0.84rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg-canvas) 12%);
  color: var(--text-body);
  font-size: 0.83rem;
  font-weight: 720;
  white-space: nowrap;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease;
}
.portal-public .mp-public-showcase__tab.is-active,
.portal-public .mp-public-showcase__tab[aria-selected="true"] {
  border-color: color-mix(
    in srgb,
    var(--brand-600) 30%,
    var(--line-default) 70%
  );
  background: color-mix(in srgb, var(--brand-100) 60%, var(--bg-panel) 40%);
  color: var(--text-strong);
  box-shadow: 0 10px 20px #1f25340f;
}
.portal-public .mp-public-showcase__stage {
  position: relative;
  min-height: clamp(300px, 31vw, 470px);
  aspect-ratio: 1366 / 768;
  border-radius: 0;
  border: 0;
  background: transparent;
  overflow: hidden;
}
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark)
  .portal-public
  .mp-public-showcase__stage {
  background: transparent;
}
.portal-public .mp-public-showcase__slide {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: stretch;
  padding: 0;
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}
.portal-public .mp-public-showcase__slide.is-active {
  opacity: 1;
  pointer-events: auto;
}
.portal-public .mp-public-showcase__slide > img,
.portal-public
  .mp-public-showcase__slide
  .landing-showcase__slide-visual--mock {
  width: 100%;
  height: 100%;
}
.portal-public .mp-public-showcase__slide > img {
  object-fit: contain;
  object-position: center center;
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.portal-public .mp-public-showcase__slide--cover > img {
  object-fit: cover;
}
.portal-public .mp-public-showcase__slide--align-top > img {
  object-position: center top;
}
.portal-public .mp-public-showcase__slide--mock .home-product-mock {
  min-height: 100%;
  padding: 1rem;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.portal-public .mp-public-showcase__meta {
  position: relative;
  min-height: 4.8rem;
}
.portal-public .mp-public-showcase__meta-copy {
  position: absolute;
  inset: 0;
  display: grid;
  gap: 0.28rem;
  align-content: start;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}
.portal-public .mp-public-showcase__meta-copy.is-active {
  opacity: 1;
  pointer-events: auto;
}
.portal-public .mp-public-showcase__meta-copy strong {
  color: var(--text-strong);
  font-size: 1.04rem;
  line-height: 1.24;
  letter-spacing: -0.02em;
}
.portal-public .mp-public-showcase__meta-copy p,
.portal-public .mp-public-final-band__copy p,
.portal-public .mp-public-section__head p,
.portal-public .mp-public-reason p,
.portal-public .mp-public-step__copy p,
.portal-public .mp-public-audience-card p,
.portal-public .mp-public-route-card p,
.portal-public .auth-aside-summary,
.portal-public .auth-aside-highlight__body {
  margin: 0;
  color: color-mix(in srgb, var(--text-body) 92%, white 8%);
  line-height: 1.55;
}
.portal-public .mp-public-showcase__footer {
  display: grid;
  gap: 0.2rem;
  padding: 0.15rem 0.15rem 0;
}
@media (min-width: 1181px) {
  .portal-public .mp-public-showcase {
    align-self: stretch;
  }
  .portal-public .mp-public-showcase__frame {
    height: 100%;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: clamp(0.95rem, 1.5vw, 1.2rem);
  }
  .portal-public .mp-public-showcase__meta {
    display: grid;
    align-items: center;
    min-height: 5.4rem;
  }
  .portal-public .mp-public-showcase__meta-copy {
    align-content: center;
    gap: 0.34rem;
  }
}
@media (min-width: 1360px) {
  .portal-public .mp-public-landing__hero {
    align-items: stretch;
  }
  .portal-public .mp-public-landing__actions {
    margin-top: auto;
    padding-top: clamp(1rem, 2.2vw, 1.8rem);
  }
}
.portal-public .mp-public-section {
  display: grid;
  gap: 1.2rem;
}
.portal-public .mp-public-section__head {
  display: grid;
  gap: 0.45rem;
  max-width: 44rem;
}
.portal-public .mp-public-section__head h2 {
  margin: 0;
  font-family: var(--public-display-font);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 0.98;
  letter-spacing: -0.05em;
  color: var(--text-strong);
}
.portal-public .mp-public-reason-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
}
.portal-public .mp-public-reason,
.portal-public .mp-public-support-panel,
.portal-public .mp-public-route-card {
  display: grid;
  gap: 0.75rem;
  min-height: 100%;
  padding: 1.2rem 1.18rem;
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
  box-shadow: 0 14px 32px #1b2a440f;
}
.portal-public .mp-public-reason {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 0.95rem;
  padding: 1rem 1.05rem;
}
.portal-public .mp-public-reason__icon,
.portal-public .mp-public-route-card__icon {
  width: 2.8rem;
  height: 2.8rem;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: color-mix(in srgb, var(--brand-100) 68%, var(--bg-panel) 32%);
  color: color-mix(in srgb, var(--brand-800) 82%, var(--text-strong) 18%);
}
.portal-public .mp-public-reason__icon svg,
.portal-public .mp-public-route-card__icon svg {
  width: 1.28rem;
  height: 1.28rem;
}
.portal-public .mp-public-reason__copy {
  display: grid;
  gap: 0.24rem;
  min-width: 0;
}
.portal-public .mp-public-reason h3,
.portal-public .mp-public-support-panel h3,
.portal-public .mp-public-route-card h3,
.portal-public .mp-public-auth-aside-panel__copy h2,
.portal-public .mp-public-auth-panel__head h1 {
  margin: 0;
  color: var(--text-strong);
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
}
.portal-public .mp-public-section--routine {
  grid-template-columns: minmax(0, 1.14fr) minmax(320px, 0.86fr);
  align-items: start;
}
.portal-public .mp-public-routine {
  display: grid;
  gap: 1.1rem;
}
.portal-public .mp-public-support-panel .mp-public-metric-grid {
  margin-top: 0.05rem;
}
.portal-public .mp-public-step-grid {
  display: grid;
  gap: 0.9rem;
}
.portal-public .mp-public-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.95rem;
  align-items: start;
  padding: 1rem 1.05rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
}
.portal-public .mp-public-step__number {
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-100) 72%, var(--bg-panel) 28%);
  color: color-mix(in srgb, var(--brand-800) 82%, var(--text-strong) 18%);
  font-size: 0.82rem;
  font-weight: 760;
  letter-spacing: 0.08em;
}
.portal-public .mp-public-step__copy {
  display: grid;
  gap: 0.28rem;
}
.portal-public .mp-public-step__copy span,
.portal-public .mp-public-route-card__eyebrow {
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 88%, white 12%);
}
.portal-public .mp-public-step__copy strong,
.portal-public .mp-public-final-band__copy strong {
  color: var(--text-strong);
  font-size: 1.1rem;
  line-height: 1.28;
  letter-spacing: -0.02em;
}
.portal-public .mp-public-audience-grid {
  display: grid;
  gap: 0.8rem;
}
.portal-public .mp-public-audience-card {
  display: grid;
  gap: 0.3rem;
  padding: 0.95rem 1rem;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 86%, white 14%);
}
.portal-public .mp-public-audience-card strong {
  color: var(--text-strong);
  font-size: 1rem;
  line-height: 1.28;
}
.portal-public .mp-public-route-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.portal-public .mp-public-route-card .btn {
  margin-top: 0.35rem;
  width: fit-content;
}
.portal-public .mp-public-signin-route-card {
  grid-template-rows: auto auto auto 1fr auto;
  gap: 0.85rem;
  overflow: hidden;
}
.portal-public .mp-public-signin-route-card__visual {
  display: grid;
  place-items: center;
  min-height: 190px;
  padding: 1rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.84),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--brand-100) 34%, var(--bg-panel) 66%),
      color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
    );
  text-decoration: none;
}
.portal-public .mp-public-signin-route-card__visual img {
  width: min(100%, 260px);
  max-height: 176px;
  object-fit: contain;
  filter: drop-shadow(0 20px 28px rgba(27, 42, 68, 0.1));
}
.portal-public .mp-public-signin-route-card__top {
  display: flex;
  align-items: center;
  gap: 0.72rem;
}
.portal-public .mp-public-signin-route-card h3 {
  font-size: clamp(1.45rem, 1.7vw, 1.92rem);
}
.portal-public .mp-public-signin-route-card .btn {
  width: 100%;
  justify-content: center;
}
.portal-public .mp-public-signin-compact-list {
  display: none;
}
.portal-public .mp-public-signin-compact-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
  padding: 0.9rem 1rem;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
  box-shadow: 0 12px 26px #1b2a440d;
}
.portal-public .mp-public-signin-compact-card__copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}
.portal-public .mp-public-signin-compact-card h3 {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.06;
  color: var(--text-strong);
}
.portal-public .mp-public-signin-compact-card .btn {
  min-width: 5.25rem;
  min-height: 2.65rem;
  padding-inline: 0.9rem;
  justify-content: center;
  white-space: nowrap;
}
.portal-public .mp-public-final-band {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.4rem;
  padding: 1.1rem 1.15rem;
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.8),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--brand-100) 52%, var(--bg-panel) 48%),
      color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
    );
}
.portal-public .mp-public-final-band__copy {
  display: grid;
  gap: 0.25rem;
  max-width: 42rem;
}
.portal-public .mp-public-final-band .mp-public-cta-row {
  flex: 0 0 auto;
}
.portal-public .mp-public-final-band .mp-public-cta-row .btn {
  width: auto;
  min-width: 10rem;
  white-space: nowrap;
}
.portal-public .mp-public-auth-page {
  --public-shell-max: var(--site-max);
  gap: clamp(1rem, 2vw, 1.5rem);
}
.portal-public .mp-public-auth-intro {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  justify-content: space-between;
  gap: 0.85rem 1.25rem;
  padding: clamp(1rem, 1.8vw, 1.2rem) clamp(1rem, 2vw, 1.3rem);
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
}
.portal-public .mp-public-auth-intro__copy {
  display: grid;
  gap: 0.4rem;
  flex: 1 1 44rem;
  min-width: 0;
  max-width: 60rem;
}
.portal-public .mp-public-auth-intro h1 {
  max-width: clamp(18ch, 40vw, 26ch);
  font-size: clamp(2.2rem, 3.55vw, 3.35rem);
  line-height: 0.96;
}
.portal-public .mp-public-auth-intro p {
  max-width: clamp(46ch, 52vw, 68ch);
}
.portal-public .mp-public-auth-intro > .mp-public-auth-chip-row {
  justify-content: flex-end;
  align-self: start;
}
.portal-public .mp-public-auth-layout {
  grid-template-columns: minmax(0, 1fr) minmax(330px, 0.7fr);
  gap: clamp(1rem, 2vw, 1.4rem);
}
.portal-public .mp-public-auth-panel,
.portal-public .mp-public-auth-aside {
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 6%),
    color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
  );
  box-shadow: 0 18px 36px #1b2a440f;
}
.portal-public .mp-public-auth-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  padding: 0.4rem;
  border-radius: 22px;
  background: color-mix(in srgb, var(--bg-panel-2) 90%, white 10%);
}
.portal-public .mp-public-auth-tabs .auth-switch__tab {
  min-height: 2.65rem;
  border-radius: 18px;
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
  color: var(--text-body);
  font-weight: 740;
}
.portal-public .mp-public-auth-tabs .auth-switch__tab.is-active,
.portal-public .mp-public-auth-tabs .auth-switch__tab[aria-selected="true"] {
  border-color: color-mix(
    in srgb,
    var(--brand-600) 28%,
    var(--line-default) 72%
  );
  background: color-mix(in srgb, var(--brand-100) 64%, var(--bg-panel) 36%);
  color: var(--text-strong);
  box-shadow: 0 10px 18px #1b2a440d;
}
.portal-public .mp-public-auth-panel .auth-panel__inner--tabbed {
  gap: 1.1rem;
}
.portal-public .mp-public-auth-panel__head {
  display: grid;
  gap: 0.65rem;
}
.portal-public .mp-public-auth-panel__head h1 {
  font-family: var(--public-display-font);
  font-size: clamp(2rem, 3vw, 2.9rem);
}
.portal-public .mp-public-auth-form {
  gap: 0.85rem;
}
.portal-public .mp-public-auth-form label {
  display: grid;
  gap: 0.42rem;
  color: var(--text-strong);
  font-weight: 650;
}
.portal-public .mp-public-auth-form .inline-notice,
.portal-public .auth-support-card {
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 86%, white 14%);
}
.portal-public .mp-public-auth-aside {
  align-content: start;
}
.portal-public .mp-public-auth-aside-panel {
  display: grid;
  gap: 1rem;
}
.portal-public .mp-public-auth-aside-panel__art {
  display: grid;
  place-items: center;
  min-height: 220px;
  padding: 1rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.82),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--brand-100) 34%, var(--bg-panel) 66%),
      color-mix(in srgb, var(--bg-panel-2) 90%, var(--bg-panel) 10%)
    );
}
.portal-public .mp-public-auth-aside-panel__art img {
  width: min(100%, 440px);
  max-height: 240px;
  object-fit: contain;
}
.portal-public .mp-public-auth-aside-panel__copy {
  display: grid;
  gap: 0.42rem;
}
.portal-public .mp-public-auth-aside-panel__copy h2 {
  font-family: var(--public-display-font);
  font-size: clamp(1.6rem, 2.2vw, 2.2rem);
}
.portal-public .mp-public-auth-aside .auth-aside-highlights {
  gap: 0.75rem;
}
.portal-public .mp-public-auth-aside .auth-aside-highlight {
  padding: 0.95rem 1rem;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 86%, white 14%);
}
.portal-public .mp-public-auth-aside .auth-aside-highlight__title {
  font-size: 0.96rem;
  line-height: 1.3;
  color: var(--text-strong);
}
.portal-public .mp-public-auth-aside .auth-aside-highlight__body {
  margin: 0.2rem 0 0;
  color: var(--text-body);
  font-size: 0.93rem;
  line-height: 1.5;
}
.portal-public .mp-public-auth-page--single .auth-split--public-auth {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
  gap: clamp(1rem, 2vw, 1.4rem);
  align-items: stretch;
}
.portal-public .mp-public-auth-page--single .auth-panel,
.portal-public .mp-public-auth-page--single .auth-aside--public-auth {
  min-height: 100%;
}
.portal-public .mp-public-auth-page--single .mp-public-auth-panel__head {
  gap: 0.72rem;
}
.portal-public .mp-public-auth-page--single .mp-public-auth-aside-panel {
  height: 100%;
  padding: clamp(1.15rem, 1.9vw, 1.5rem);
}
.portal-public .mp-public-auth-page--single .mp-public-auth-aside-panel__art {
  min-height: 280px;
  padding: 1.15rem;
}
.portal-public
  .mp-public-auth-page--single
  .mp-public-auth-aside-panel__art
  img {
  width: min(100%, 520px);
  max-height: 320px;
}
@media (max-width: 900px) {
  .portal-public .mp-public-metric-grid,
  .portal-public .mp-public-reason-grid,
  .portal-public .mp-public-route-grid {
    grid-template-columns: 1fr;
  }
  .portal-public .mp-public-reason {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .portal-public .mp-public-final-band,
  .portal-public .mp-public-auth-intro {
    align-items: start;
  }
}
@media (min-width: 1800px) {
  .portal-public .mp-public-page {
    --public-shell-max: var(--site-max);
  }
  .portal-public .mp-public-landing__hero {
    gap: 1.4rem;
  }
  .portal-public .mp-public-showcase__stage {
    min-height: 540px;
  }
}
.portal-public .mp-public-utility-page,
.portal-public .mp-public-legal-page {
  gap: clamp(1.35rem, 2.5vw, 2rem);
}
.portal-public .mp-public-utility-hero,
.portal-public .mp-public-legal-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: stretch;
}
.portal-public .mp-public-utility-intro,
.portal-public .mp-public-utility-helper,
.portal-public .mp-public-legal-copy,
.portal-public .mp-public-legal-summary,
.portal-public .mp-public-utility-card,
.portal-public .mp-public-legal-card {
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 95%, white 5%),
    color-mix(in srgb, var(--bg-panel-2) 93%, var(--bg-panel) 7%)
  );
  box-shadow: 0 18px 36px #1b2a440f;
}
.portal-public .mp-public-utility-intro,
.portal-public .mp-public-utility-helper,
.portal-public .mp-public-legal-copy,
.portal-public .mp-public-legal-summary {
  padding: clamp(1.25rem, 2.3vw, 2rem);
}
.portal-public .mp-public-utility-intro,
.portal-public .mp-public-utility-helper__copy,
.portal-public .mp-public-legal-copy,
.portal-public .mp-public-legal-summary {
  display: grid;
  gap: 0.8rem;
}
.portal-public .mp-public-utility-intro h1,
.portal-public .mp-public-legal-copy h1 {
  font-family: var(--public-display-font);
  font-size: clamp(2.2rem, 3.8vw, 3.55rem);
  line-height: 0.98;
  color: var(--text-strong);
  max-width: 13ch;
}
.portal-public .mp-public-utility-intro p,
.portal-public .mp-public-utility-helper__copy p,
.portal-public .mp-public-legal-copy p,
.portal-public .mp-public-legal-card p {
  margin: 0;
  color: var(--text-body);
  line-height: 1.72;
}
.portal-public .mp-public-utility-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
}
.portal-public .mp-public-utility-metric {
  display: grid;
  gap: 0.3rem;
  padding: 0.95rem 1rem;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
}
.portal-public .mp-public-utility-metric span {
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.portal-public .mp-public-utility-metric strong {
  font-size: 1rem;
  color: var(--text-strong);
}
.portal-public .mp-public-utility-helper {
  display: grid;
  gap: 1rem;
}
.portal-public .mp-public-utility-helper--signin {
  align-content: start;
}
.portal-public .mp-public-utility-helper__art {
  display: grid;
  place-items: center;
  min-height: 230px;
  padding: 1rem;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.85),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--brand-100) 34%, var(--bg-panel) 66%),
      color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
    );
}
.portal-public .mp-public-utility-helper__art img,
.portal-public .mp-public-utility-visual img {
  width: min(100%, 440px);
  max-height: 280px;
  object-fit: contain;
}
.portal-public .mp-public-signin-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.82rem;
  width: 100%;
}
.portal-public .mp-public-signin-preview-card {
  display: grid;
  gap: 0.65rem;
  align-content: space-between;
  min-height: 216px;
  padding: 0.9rem 0.85rem;
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 68%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
  text-decoration: none;
}
.portal-public .mp-public-signin-preview-card span {
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text-soft) 88%, white 12%);
}
.portal-public .mp-public-signin-preview-card img {
  width: min(100%, 220px);
  max-height: 150px;
  margin-inline: auto;
  object-fit: contain;
  filter: drop-shadow(0 16px 24px rgba(27, 42, 68, 0.1));
}
.portal-public .mp-public-utility-visual {
  display: grid;
  place-items: center;
  padding: clamp(1rem, 2vw, 1.5rem);
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background:
    radial-gradient(
      circle at top left,
      rgba(255, 255, 255, 0.82),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--brand-100) 32%, var(--bg-panel) 68%),
      color-mix(in srgb, var(--bg-panel-2) 92%, var(--bg-panel) 8%)
    );
  box-shadow: 0 18px 36px #1b2a440f;
}
.portal-public .mp-public-utility-grid,
.portal-public .mp-public-legal-stack {
  display: grid;
  gap: 1rem;
}
.portal-public .mp-public-utility-grid,
.portal-public .mp-public-legal-stack {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.portal-public .mp-public-utility-card,
.portal-public .mp-public-legal-card {
  display: grid;
  gap: 0.85rem;
  padding: clamp(1.15rem, 2vw, 1.5rem);
}
.portal-public .mp-public-utility-card h3,
.portal-public .mp-public-legal-card h2 {
  margin: 0;
  font-size: clamp(1.2rem, 1.6vw, 1.55rem);
  line-height: 1.15;
  color: var(--text-strong);
}
.portal-public .mp-public-utility-card--featured {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 22%,
    var(--line-default) 78%
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 42%, transparent) 0%,
      transparent 42%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 92%, white 8%),
      color-mix(in srgb, var(--brand-100) 15%, var(--bg-panel-2) 85%)
    );
}
.portal-public .mp-public-utility-list {
  display: grid;
  gap: 0.55rem;
  margin: 0;
  padding-left: 1.1rem;
  color: var(--text-body);
}
.portal-public .mp-public-utility-list li::marker {
  color: var(--brand-600);
}
.portal-public .mp-public-legal-summary .mp-public-utility-list {
  padding-left: 1rem;
}
.portal-public .mp-public-legal-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
@media (max-width: 1180px) {
  .portal-public .mp-public-landing__hero,
  .portal-public .mp-public-section--routine,
  .portal-public .mp-public-auth-layout {
    grid-template-columns: 1fr;
  }
  .portal-public .mp-public-landing__hero {
    gap: 1rem;
    padding: 1rem;
  }
  .portal-public .mp-public-landing__copy {
    max-width: none;
    padding: 0;
    gap: 0.95rem;
    grid-template-rows: auto auto;
    min-height: auto;
  }
  .portal-public .mp-public-landing__copy-main {
    max-width: none;
    gap: 0.72rem;
    align-self: auto;
  }
  .portal-public .mp-public-landing__copy h1 {
    max-width: 14.6ch;
  }
  .portal-public .mp-public-lead {
    max-width: 40ch;
  }
  .portal-public .mp-public-showcase {
    width: 100%;
    justify-self: stretch;
  }
  .portal-public .mp-public-showcase__copy {
    justify-items: start;
    text-align: left;
    max-width: 24rem;
    flex: none;
  }
  .portal-public .mp-public-showcase__top {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.62rem;
  }
  .portal-public .mp-public-showcase__controls,
  .portal-public .mp-public-showcase__tabs {
    width: 100%;
  }
  .portal-public .mp-public-showcase__tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
  }
  .portal-public .mp-public-showcase__tab {
    min-height: 2.55rem;
    padding: 0.35rem 0.68rem;
    text-align: center;
    white-space: normal;
    line-height: 1.15;
  }
  .portal-public .mp-public-showcase__stage {
    min-height: 0;
    aspect-ratio: 1366 / 768;
  }
  .portal-public .mp-public-utility-hero,
  .portal-public .mp-public-legal-hero,
  .portal-public .mp-public-utility-grid,
  .portal-public .mp-public-legal-stack {
    grid-template-columns: 1fr;
  }
  .portal-public .mp-public-utility-intro h1,
  .portal-public .mp-public-legal-copy h1 {
    max-width: 14ch;
  }
  .portal-public .mp-public-auth-intro__copy {
    max-width: none;
  }
  .portal-public .mp-public-auth-page--single .auth-split--public-auth {
    grid-template-columns: 1fr;
  }
  .portal-public .mp-public-auth-page--single .mp-public-auth-aside-panel__art {
    min-height: 208px;
  }
  .portal-public
    .mp-public-auth-page--single
    .mp-public-auth-aside-panel__art
    img {
    max-height: 224px;
  }
}
@media (max-width: 900px) {
  .portal-public .mp-public-cta-row {
    width: 100%;
  }
  .portal-public .mp-public-cta-row .btn {
    flex: 1 1 calc((100% - 0.75rem) / 2);
    width: calc((100% - 0.75rem) / 2);
    min-width: 0;
  }
  .portal-public .mp-public-chip-row,
  .portal-public .mp-public-auth-chip-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
  }
  .portal-public .mp-public-chip,
  .portal-public .mp-public-auth-chip {
    justify-content: center;
    min-height: 2.55rem;
    padding: 0.45rem 0.55rem;
    text-align: center;
    white-space: normal;
  }
  .portal-public .mp-public-signin-route-card__visual {
    min-height: 164px;
  }
  .portal-public .mp-public-signin-preview-card {
    min-height: 182px;
  }
  .portal-public .mp-public-showcase__meta {
    min-height: 4.45rem;
  }
}
@media (min-width: 721px) and (max-width: 1024px) {
  .portal-public .mp-public-route-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-public .mp-public-route-grid > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
  .portal-public .mp-public-signin-route-card__visual {
    min-height: 154px;
  }
  .portal-public .mp-public-signin-route-card__visual img {
    max-height: 128px;
  }
  .portal-public .mp-public-signin-preview-card {
    min-height: 168px;
  }
  .portal-public .mp-public-signin-preview-card img {
    max-height: 118px;
  }
}
@media (max-width: 720px) {
  .portal-public .mp-public-page {
    --public-shell-max: 100%;
    gap: 1.2rem;
    padding-top: 0.625rem;
  }
  .portal-public .mp-public-landing__hero,
  .portal-public .mp-public-support-panel,
  .portal-public .mp-public-final-band,
  .portal-public .mp-public-auth-intro,
  .portal-public .mp-public-auth-panel,
  .portal-public .mp-public-auth-aside {
    border-radius: 26px;
  }
  .portal-public .mp-public-landing__hero {
    gap: 0.95rem;
    padding: 0.95rem 0.9rem 1rem;
  }
  .portal-public .mp-public-landing__copy {
    gap: 0.82rem;
  }
  .portal-public .mp-public-landing__copy h1,
  .portal-public .mp-public-auth-intro h1 {
    max-width: none;
    font-size: clamp(2.18rem, 9.6vw, 3rem);
  }
  .portal-public .mp-public-lead {
    max-width: none;
    font-size: 0.99rem;
    line-height: 1.48;
  }
  .portal-public .mp-public-landing__actions {
    gap: 0.62rem;
  }
  .portal-public .mp-public-cta-row .btn {
    flex-basis: 100%;
    width: 100%;
    min-height: 46px;
  }
  .portal-public .mp-public-showcase__frame {
    padding: 0.82rem;
    border-radius: 28px;
  }
  .portal-public .mp-public-showcase__stage {
    min-height: 0;
    aspect-ratio: 1366 / 768;
  }
  .portal-public .mp-public-showcase__slide {
    inset: 0;
    border-radius: 0;
  }
  .portal-public .mp-public-showcase__meta {
    min-height: 4.5rem;
  }
  .portal-public .mp-public-utility-intro,
  .portal-public .mp-public-utility-helper,
  .portal-public .mp-public-legal-copy,
  .portal-public .mp-public-legal-summary,
  .portal-public .mp-public-utility-card,
  .portal-public .mp-public-legal-card,
  .portal-public .mp-public-utility-visual {
    border-radius: 26px;
  }
  .portal-public .mp-public-utility-metric-grid,
  .portal-public .mp-public-signin-preview-grid {
    grid-template-columns: 1fr;
  }
  .portal-public .mp-public-utility-intro h1,
  .portal-public .mp-public-legal-copy h1 {
    max-width: none;
    font-size: clamp(2.2rem, 10vw, 3rem);
  }
  .portal-public .mp-public-reason {
    grid-template-columns: 1fr;
    gap: 0.72rem;
  }
}
@media (max-width: 560px) {
  .portal-public .mp-public-landing__copy h1,
  .portal-public .mp-public-auth-intro h1 {
    font-size: clamp(2rem, 9vw, 2.55rem);
  }
  .portal-public .mp-public-chip,
  .portal-public .mp-public-auth-chip {
    font-size: 0.79rem;
  }
  .portal-public .mp-public-showcase__tab {
    min-height: 2.34rem;
    padding: 0.32rem 0.52rem;
    font-size: 0.79rem;
  }
  .portal-public .mp-public-showcase__stage {
    aspect-ratio: 1366 / 768;
  }
}
@media (min-width: 1280px) and (max-height: 1120px) and (hover: hover) and (pointer: fine) {
  .portal-public .mp-public-page {
    gap: 0.95rem;
    padding-top: 0.55rem;
    padding-bottom: 1.15rem;
  }
  .portal-public .mp-public-landing {
    gap: 1.1rem;
  }
  .portal-public .mp-public-landing__hero {
    gap: 0.85rem;
    padding: 1rem 1.15rem;
    border-radius: 32px;
  }
  .portal-public .mp-public-landing__copy {
    padding-right: 0.25rem;
  }
  .portal-public .mp-public-landing__copy h1 {
    max-width: 15.4ch;
    font-size: clamp(2.95rem, 3.95vw, 4.2rem);
    line-height: 0.95;
  }
  .portal-public .mp-public-lead {
    max-width: 46ch;
    font-size: 1rem;
    line-height: 1.54;
  }
  .portal-public .mp-public-chip-row,
  .portal-public .mp-public-metric-grid {
    gap: 0.55rem;
  }
  .portal-public .mp-public-metric {
    padding: 0.8rem 0.9rem;
  }
  .portal-public .mp-public-section {
    gap: 0.95rem;
  }
  .portal-public .mp-public-section__head {
    gap: 0.35rem;
  }
  .portal-public .mp-public-reason-grid {
    gap: 0.75rem;
  }
  .portal-public .mp-public-section--reasons {
    padding-bottom: clamp(5rem, 13.5vh, 9.5rem);
  }
  .portal-public .mp-public-reason {
    gap: 0.8rem;
    min-height: 7.4rem;
    padding: 0.9rem 0.95rem;
  }
  .portal-public .mp-public-reason__icon {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 16px;
  }
  .portal-public .mp-public-reason h3 {
    font-size: clamp(1.12rem, 1.35vw, 1.36rem);
    line-height: 1.08;
  }
  .portal-public .mp-public-reason p,
  .portal-public .mp-public-step p,
  .portal-public .mp-public-audience-card p {
    font-size: 0.94rem;
    line-height: 1.52;
  }
  .portal-public .mp-public-showcase__stage {
    min-height: clamp(320px, 28vw, 410px);
  }
  .portal-public .mp-public-showcase__meta {
    min-height: 4.45rem;
  }
  .portal-public .mp-public-auth-page {
    gap: 0.72rem;
  }
  .portal-public .mp-public-utility-page {
    gap: 0.92rem;
  }
  .portal-public .mp-public-utility-hero {
    gap: 0.85rem;
  }
  .portal-public .mp-public-utility-intro,
  .portal-public .mp-public-utility-helper {
    padding: 0.98rem 1.05rem;
    border-radius: 24px;
  }
  .portal-public .mp-public-utility-intro h1 {
    max-width: 10.4ch;
    font-size: clamp(1.92rem, 2.55vw, 2.75rem);
    line-height: 0.95;
  }
  .portal-public .mp-public-utility-intro p,
  .portal-public .mp-public-utility-helper__copy p {
    font-size: 0.95rem;
    line-height: 1.52;
  }
  .portal-public .mp-public-utility-metric-grid {
    gap: 0.55rem;
  }
  .portal-public .mp-public-utility-metric {
    padding: 0.72rem 0.82rem;
    border-radius: 18px;
  }
  .portal-public .mp-public-utility-helper__art {
    min-height: 176px;
    padding: 0.78rem;
    border-radius: 20px;
  }
  .portal-public .mp-public-signin-preview-grid {
    gap: 0.58rem;
  }
  .portal-public .mp-public-signin-preview-card {
    min-height: 146px;
    padding: 0.7rem 0.68rem;
    border-radius: 18px;
  }
  .portal-public .mp-public-signin-preview-card img {
    width: min(100%, 150px);
    max-height: 102px;
  }
  .portal-public .mp-public-route-grid {
    gap: 0.82rem;
  }
  .portal-public .mp-public-signin-route-card {
    gap: 0.66rem;
    padding: 0.92rem;
    border-radius: 22px;
  }
  .portal-public .mp-public-signin-route-card__visual {
    min-height: 126px;
    padding: 0.72rem;
    border-radius: 18px;
  }
  .portal-public .mp-public-signin-route-card__visual img {
    width: min(100%, 190px);
    max-height: 112px;
  }
  .portal-public .mp-public-signin-route-card h3 {
    font-size: clamp(1.22rem, 1.35vw, 1.45rem);
    line-height: 1.02;
  }
  .portal-public .mp-public-route-card p {
    font-size: 0.94rem;
    line-height: 1.46;
  }
  .portal-public .mp-public-final-band {
    padding: 0.92rem 1rem;
    border-radius: 24px;
  }
  .portal-public .mp-public-auth-intro {
    display: grid;
    grid-template-columns: minmax(0, 1.32fr) auto;
    align-items: start;
    gap: 0.35rem 1rem;
    padding: 0.68rem 0.88rem;
    border-radius: 22px;
  }
  .portal-public .mp-public-auth-intro__copy {
    gap: 0.16rem;
    max-width: 58rem;
  }
  .portal-public .mp-public-auth-intro h1 {
    max-width: 34ch;
    font-size: clamp(1.68rem, 2vw, 2rem);
    line-height: 0.98;
  }
  .portal-public .mp-public-auth-intro p {
    max-width: 72ch;
    font-size: 0.88rem;
    line-height: 1.34;
  }
  .portal-public .mp-public-auth-chip-row {
    gap: 0.4rem;
    justify-content: flex-end;
    align-self: start;
    padding-top: 0.08rem;
  }
  .portal-public .mp-public-auth-chip {
    padding: 0.55rem 0.76rem;
    font-size: 0.8rem;
    line-height: 1.1;
  }
  .portal-public .mp-public-auth-layout {
    gap: 0.8rem;
  }
  .portal-public .mp-public-auth-panel,
  .portal-public .mp-public-auth-aside {
    border-radius: 24px;
  }
  .portal-public .mp-public-auth-panel .auth-panel__inner--tabbed {
    gap: 0.68rem;
  }
  .portal-public .auth-tabs {
    margin-bottom: 0.52rem;
  }
  .portal-public .mp-public-auth-tabs .auth-switch__tab {
    min-height: 2.3rem;
  }
  .portal-public .auth-panel__inner--tabbed > .auth-tab-panel {
    gap: 0.56rem;
  }
  .portal-public .mp-public-auth-panel__head {
    gap: 0.34rem;
  }
  .portal-public .mp-public-auth-panel__head h1 {
    max-width: none;
    font-size: clamp(1.72rem, 2vw, 2.05rem);
    line-height: 0.98;
  }
  .portal-public .mp-public-auth-panel__head p {
    font-size: 0.9rem;
    line-height: 1.34;
  }
  .portal-public .mp-public-auth-form {
    gap: 0.48rem;
  }
  .portal-public .mp-public-auth-form label {
    gap: 0.24rem;
    font-size: 0.92rem;
  }
  .portal-public .mp-public-auth-form .inline-notice,
  .portal-public .auth-support-card {
    border-radius: 18px;
    padding: 0.62rem 0.74rem;
  }
  .portal-public .auth-submit-btn,
  .portal-public .auth-panel :is(input, select) {
    min-height: 44px;
  }
  .portal-public .mp-public-auth-aside-panel {
    gap: 0.68rem;
  }
  .portal-public .mp-public-auth-aside-panel__art {
    min-height: 138px;
    padding: 0.72rem;
  }
  .portal-public .mp-public-auth-aside-panel__art img {
    max-height: 142px;
  }
  .portal-public .mp-public-auth-page--single .auth-panel__inner {
    gap: 0.72rem;
    padding: 0.98rem;
  }
  .portal-public .mp-public-auth-page--single .auth-split--public-auth {
    gap: 0.8rem;
  }
  .portal-public .mp-public-auth-page--single .mp-public-auth-aside-panel {
    padding: 0.98rem;
  }
  .portal-public .mp-public-auth-page--single .mp-public-auth-aside-panel__art {
    min-height: 180px;
    padding: 0.82rem;
  }
  .portal-public
    .mp-public-auth-page--single
    .mp-public-auth-aside-panel__art
    img {
    max-height: 180px;
  }
  .portal-public .mp-public-auth-page--single .auth-support-card {
    padding: 0.7rem 0.78rem;
  }
  .portal-public .mp-public-auth-aside-panel__copy h2 {
    font-size: clamp(1.2rem, 1.4vw, 1.55rem);
  }
  .portal-public .mp-public-auth-aside .auth-aside-highlights {
    gap: 0.48rem;
  }
  .portal-public .mp-public-auth-aside .auth-aside-highlight {
    padding: 0.68rem 0.78rem;
    border-radius: 16px;
  }
  .portal-public .mp-public-auth-aside .auth-aside-highlight__title {
    font-size: 0.88rem;
    line-height: 1.24;
  }
  body.portal-public--auth .mp-footer {
    padding: 6px 0 10px;
  }
  body.portal-public--auth .mp-footer__inner {
    gap: 2px;
  }
  body.portal-public--auth .mp-footer__logo {
    height: 30px;
  }
  body.portal-public--auth .mp-footer__legal {
    font-size: 0.69rem;
    line-height: 1.3;
  }
}
@media (max-width: 720px) {
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__inner {
    min-height: auto;
    padding: 8px 10px;
    gap: 10px;
    border-radius: 24px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
  }
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__center,
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__utility-pill {
    display: none;
  }
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__left {
    min-width: 0;
  }
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .topbar-brand-image,
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__brand
    img {
    max-width: 134px;
    height: auto;
  }
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__right,
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-topbar__right--signed-out {
    width: auto;
    min-width: 0;
    margin-left: auto;
  }
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-public-auth-actions {
    display: flex;
    align-items: center;
    width: auto;
    gap: 0.42rem;
  }
  .portal-public
    :is(.mp-topbar--public-home, .mp-topbar--public-auth)
    .mp-public-auth-actions
    .mp-inline-link--button {
    min-height: 38px;
    padding-inline: 0.82rem;
    justify-content: center;
    white-space: nowrap;
    text-align: center;
    line-height: 1.1;
    font-size: 0.9rem;
    border-radius: 999px;
  }
  .portal-public .mp-public-signin-compact-list {
    display: grid;
    gap: 0.72rem;
  }
  .portal-public .mp-public-utility-hero,
  .portal-public .mp-public-final-band,
  .portal-public .mp-public-utility-page .mp-public-section {
    display: none;
  }
  .portal-public .mp-public-auth-page--single {
    gap: 0.6rem;
  }
  .portal-public .mp-public-auth-page--single .auth-split--public-auth {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.72rem;
  }
  .portal-public .mp-public-auth-page--single .auth-panel,
  .portal-public .mp-public-auth-page--single .auth-aside--public-auth {
    border-radius: 22px;
  }
  .portal-public .mp-public-auth-page--single .auth-panel__inner {
    gap: 0.72rem;
    padding: 0.98rem;
  }
  .portal-public .mp-public-auth-page--single .auth-panel h1 {
    margin: 0 !important;
    font-size: clamp(1.72rem, 7.8vw, 2.3rem);
    line-height: 0.98;
  }
  .portal-public .mp-public-auth-page--single .auth-panel .muted {
    font-size: 0.9rem;
    line-height: 1.36;
  }
  .portal-public .mp-public-auth-page--single .mp-public-auth-form {
    gap: 0.55rem;
  }
  .portal-public .mp-public-auth-page--single .mp-public-auth-form label {
    gap: 0.28rem;
  }
  .portal-public
    .mp-public-auth-page--single
    .mp-public-auth-form
    .inline-notice,
  .portal-public .mp-public-auth-page--single .auth-support-card {
    padding: 0.68rem 0.76rem;
    border-radius: 18px;
  }
  .portal-public .mp-public-auth-page--single .auth-submit-btn,
  .portal-public .mp-public-auth-page--single .auth-panel :is(input, select) {
    min-height: 44px;
  }
  .portal-public .mp-public-auth-page--single .auth-aside--public-auth {
    display: none;
  }
}
@media (max-width: 720px) {
  .student-shell--compact-page .student-shell__body,
  .student-shell--compact-page .student-shell__body--with-nav,
  .student-shell--compact-page .student-page-content {
    gap: 12px;
  }
  .student-shell--compact-page
    :is(.student-home-hero, .student-section-hero--action-first) {
    padding: 14px;
    border-radius: 22px;
    gap: 10px;
  }
  .student-shell--compact-page .student-home-hero .student-licence-card__hero,
  .student-shell--compact-page
    .student-home-hero
    .student-licence-card__status-grid,
  .student-shell--compact-page .student-home-hero .student-inline-metric-strip,
  .student-shell--compact-page
    .student-home-hero
    .student-inline-metric-strip--hero,
  .student-shell--compact-page .student-section-hero__header,
  .student-shell--compact-page .student-section-hero__main--action-first {
    gap: 10px;
  }
  .student-shell--compact-page
    .student-home-hero
    .student-licence-card__title-copy
    h1,
  .student-shell--compact-page .student-section-hero__copy--action-first h1 {
    margin: 0 0 4px;
    font-size: clamp(1.58rem, 7.2vw, 2rem);
    line-height: 1.02;
  }
  .student-shell--compact-page
    .student-home-hero
    .student-licence-card__copy
    .muted,
  .student-shell--compact-page .student-section-hero__copy--action-first p,
  .student-shell--compact-page .student-section-hero__meta-line {
    font-size: 0.9rem;
    line-height: 1.38;
  }
  .student-shell--compact-page .student-section-hero__actions-row--header,
  .student-shell--compact-page .student-section-hero__metrics--status-row {
    gap: 8px;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    min-height: 0;
    padding: 10px 12px;
    gap: 8px;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card__visual {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card__copy {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    gap: 3px;
    align-self: center;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card__title {
    font-size: 1rem;
    line-height: 1.18;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card__detail {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-width: none;
    white-space: normal;
    text-overflow: clip;
    font-size: 0.8rem;
    line-height: 1.26;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card__media {
    display: none;
  }
  :is(
      .student-practice-page--ux-refresh,
      .student-competition-page--v18-8-57,
      .student-sats-page,
      .student-games-page,
      .student-game-hub-page:not(.student-home-page)
    )
    .student-practice-start-card__cta {
    grid-column: 3;
    grid-row: 1;
    min-width: 70px;
    min-height: 44px;
    width: auto;
    margin-top: 0;
    padding-inline: 12px;
    border-radius: 15px;
    justify-content: center;
    align-self: center;
    justify-self: end;
  }
  .student-page-content--runner
    .runner-response-zone-v2
    :is(
      .runner-rail-card-v2--keyboard .btn[data-runner-key="enter"],
      .runner-command-button-v2
    ):not(:disabled),
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-response-zone-v2
    :is(
      .runner-rail-card-v2--keyboard .btn[data-runner-key="enter"],
      .runner-command-button-v2
    ):not(:disabled) {
    border-color: color-mix(in srgb, var(--brand-700) 44%, transparent);
    background: linear-gradient(
      180deg,
      color-mix(in srgb, var(--brand-500) 84%, white 16%),
      color-mix(in srgb, var(--brand-700) 82%, var(--brand-900) 18%)
    );
    color: #fff;
    box-shadow: 0 14px 24px #2a4a9a38;
  }
}
body.portal-student.viewport-short-landscape .student-shell,
body.portal-student.viewport-short-landscape .student-home-shell {
  --student-topbar-height: 50px;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__inner {
  min-height: 50px;
  padding: max(4px, env(safe-area-inset-top)) 10px 6px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  column-gap: 8px;
  row-gap: 0;
  border-radius: 0 0 18px 18px;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__brand
  img,
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .topbar-brand-image {
  height: 24px;
  max-height: 24px;
  max-width: min(136px, 100%);
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-strip {
  gap: 6px;
  padding-block: 0;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-chip {
  flex: 0 0 auto;
  min-width: 0;
  max-width: 148px;
  padding: 4px 7px;
  border-radius: 10px;
  gap: 5px;
  box-shadow: none;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-icon {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  font-size: 0.78rem;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-copy {
  display: flex;
  align-items: center;
  gap: 4px;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-label {
  font-size: 0.58rem;
  letter-spacing: 0.08em;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-meta {
  display: none;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__status-value-compact {
  font-size: 0.84rem;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__right,
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__right--signed-in,
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__right--signed-out {
  gap: 4px;
}
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-topbar__control,
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-profile-trigger,
body.portal-student.viewport-short-landscape
  .mp-topbar--student-dashboard
  .mp-language-menu
  summary {
  min-height: 34px;
}
body.portal-student.viewport-short-landscape .student-shell__body,
body.portal-student.viewport-short-landscape .student-shell__body--with-nav,
body.portal-student.viewport-short-landscape .student-shell__body--compact-page,
body.portal-student.viewport-short-landscape .student-home-page--v18-8-57,
body.portal-student.viewport-short-landscape .student-game-hub-page,
body.portal-student.viewport-short-landscape
  .student-competition-page--v18-8-57,
body.portal-student.viewport-short-landscape .student-home-console-grid,
body.portal-student.viewport-short-landscape .student-home-main-grid--v18-8-57,
body.portal-student.viewport-short-landscape .student-home-lower-grid--v18-8-57,
body.portal-student.viewport-short-landscape .student-game-hub-stack {
  gap: 8px !important;
}
body.portal-student.viewport-short-landscape
  .student-shell__body--compact-page {
  padding-top: 8px;
}
body.portal-student.viewport-short-landscape
  .student-shell--compact-page
  .student-card--compact,
body.portal-student.viewport-short-landscape
  .student-shell--compact-page
  .student-section-hero--action-first {
  padding: 10px 12px;
  border-radius: 18px;
}
body.portal-student.viewport-short-landscape .student-mobile-nav__bar {
  grid-template-columns: repeat(
    var(--student-mobile-nav-columns, 6),
    minmax(0, 1fr)
  );
  gap: 4px;
  padding: 6px;
  border-radius: 18px;
}
body.portal-student.viewport-short-landscape .student-mobile-nav__link {
  min-height: 48px;
  padding: 5px 4px;
  border-radius: 14px;
  gap: 2px;
}
body.portal-student.viewport-short-landscape .student-mobile-nav__icon {
  width: 20px;
  height: 20px;
}
body.portal-student.viewport-short-landscape
  .student-mobile-nav__icon
  .student-side-nav__icon,
body.portal-student.viewport-short-landscape
  .student-mobile-nav__icon
  .student-side-nav__icon-wrap,
body.portal-student.viewport-short-landscape
  .student-mobile-nav__icon
  .student-side-nav__icon
  img {
  width: 18px;
  height: 18px;
}
.mp-brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 0.58rem;
  color: var(--text-strong);
  line-height: 1;
}
.mp-brand-lockup__image {
  display: block;
  width: auto;
  height: 2.25rem;
  max-width: min(172px, 42vw);
  object-fit: contain;
}
.mp-brand-lockup__mark {
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  color: color-mix(in srgb, var(--brand-700) 82%, var(--text-strong) 18%);
}
.mp-brand-lockup__word {
  color: var(--text-strong);
  font-size: 1.08rem;
  font-weight: 780;
  letter-spacing: 0;
}
.mp-brand-lockup--footer .mp-brand-lockup__mark {
  width: 2rem;
  height: 2rem;
  flex-basis: 2rem;
}
.mp-brand-lockup--footer .mp-brand-lockup__image {
  height: 1.45rem;
  max-width: min(132px, 48vw);
}
.mp-topbar__brand .mp-brand-lockup__image {
  height: clamp(24px, calc(var(--header-height) - 36px), 32px);
  max-height: 32px;
  max-width: min(170px, 42vw);
}
.mp-topbar--student-dashboard .mp-topbar__brand .mp-brand-lockup__image {
  height: clamp(30px, calc(var(--header-height) - 30px), 36px);
  max-height: 36px;
  max-width: min(210px, 34vw);
}
@media (max-width: 640px) {
  .mp-topbar__brand .mp-brand-lockup__image {
    height: 22px;
    max-height: 22px;
    max-width: min(128px, 40vw);
  }
  .mp-topbar--student-dashboard .mp-topbar__brand .mp-brand-lockup__image {
    height: 24px;
    max-height: 24px;
    max-width: min(132px, 34vw);
  }
}
.mp-nav-inline-icon,
.sidebar-link__icon,
.sidebar-group__icon,
.student-side-nav__icon {
  color: currentColor;
}
.sidebar-link__icon svg,
.sidebar-group__icon svg,
.student-side-nav__icon svg {
  width: 100%;
  height: 100%;
  display: block;
}
.portal-public .mp-public-lite-proof__frame {
  gap: 0.85rem;
  border-radius: 28px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 96%, white 4%),
    color-mix(in srgb, var(--bg-panel-2) 94%, var(--bg-panel) 6%)
  );
}
.portal-public .mp-public-lite-proof__screen {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "task rail" "signal rail";
  gap: 0.8rem;
  min-height: 238px;
  padding: clamp(0.9rem, 1.6vw, 1.2rem);
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 74%, transparent);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--brand-100) 20%, transparent),
      transparent 44%
    ),
    color-mix(in srgb, var(--bg-panel) 90%, var(--bg-canvas) 10%);
}
.portal-public .mp-public-lite-proof__task {
  grid-area: task;
  display: grid;
  align-content: start;
  gap: 0.55rem;
  min-width: 0;
  padding: 0.95rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
}
.portal-public .mp-public-lite-proof__task span,
.portal-public .mp-public-lite-proof__card span,
.portal-public .mp-public-lite-proof__pill span {
  font-size: 0.72rem;
  font-weight: 760;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-soft);
}
.portal-public .mp-public-lite-proof__task strong,
.portal-public .mp-public-lite-proof__card strong {
  color: var(--text-strong);
  font-size: 1rem;
  line-height: 1.25;
}
.portal-public .mp-public-lite-proof__bar {
  height: 0.58rem;
  width: 64%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--line-default) 72%, transparent);
}
.portal-public .mp-public-lite-proof__bar--wide {
  width: 88%;
  background: color-mix(in srgb, var(--brand-200) 58%, var(--line-default) 42%);
}
.portal-public .mp-public-lite-proof__rail {
  grid-area: rail;
  display: grid;
  gap: 0.55rem;
  align-content: start;
  width: 7.2rem;
}
.portal-public .mp-public-lite-proof__pill {
  display: grid;
  place-items: center;
  min-height: 42px;
  padding-inline: 0.72rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, transparent);
  background: color-mix(in srgb, var(--bg-panel-2) 86%, var(--bg-panel) 14%);
}
.portal-public .mp-public-lite-proof__pill.is-active {
  border-color: color-mix(
    in srgb,
    var(--brand-600) 30%,
    var(--line-default) 70%
  );
  background: color-mix(in srgb, var(--brand-100) 48%, var(--bg-panel) 52%);
}
.portal-public .mp-public-lite-proof__signal {
  grid-area: signal;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  align-self: end;
}
.portal-public .mp-public-lite-proof__signal span {
  min-height: 3.1rem;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 84%, var(--bg-canvas) 16%);
}
.portal-public .mp-public-lite-proof__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}
.portal-public .mp-public-lite-proof__card {
  display: grid;
  gap: 0.28rem;
  min-height: 7.1rem;
  padding: 0.82rem 0.88rem;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--line-default) 70%, transparent);
  background: color-mix(in srgb, var(--bg-panel) 88%, white 12%);
}
.portal-public .mp-public-lite-proof__card p {
  margin: 0;
  color: var(--text-body);
  font-size: 0.88rem;
  line-height: 1.42;
}
.portal-public .mp-public-signin-simple {
  display: grid;
  gap: clamp(1rem, 2vw, 1.35rem);
}
.portal-public .mp-public-signin-simple__intro {
  display: grid;
  gap: 0.55rem;
  max-width: 44rem;
}
.portal-public .mp-public-signin-simple__intro h1 {
  color: var(--text-strong);
  font-family: var(--public-display-font);
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  line-height: 0.98;
}
.portal-public .mp-public-signin-simple__intro p {
  margin: 0;
  color: var(--text-body);
  line-height: 1.55;
}
.portal-public .mp-public-auth-page--simple {
  --public-shell-max: min(760px, calc(100vw - 2rem));
}
.portal-public .mp-public-auth-simple {
  display: grid;
  max-width: 760px;
  margin-inline: auto;
}
.portal-public .mp-public-auth-panel--simple {
  border-radius: 28px;
  box-shadow: 0 14px 32px #1b2a440e;
}
.portal-public .mp-public-auth-panel--simple .auth-panel__inner {
  gap: 1rem;
}
.portal-public .mp-public-auth-panel--simple .mp-public-auth-panel__head h1 {
  font-size: clamp(2rem, 3.1vw, 2.75rem);
  line-height: 1;
}
.portal-public .mp-public-auth-panel--simple .mp-public-auth-form {
  background: transparent;
  border: 0;
  padding: 0;
}
.portal-public .mp-public-auth-support {
  box-shadow: none;
}
html[data-appearance="dark"] .mp-brand-lockup__mark {
  color: color-mix(in srgb, var(--brand-300) 74%, var(--text-strong) 26%);
}
html[data-appearance="dark"] .portal-public .mp-public-lite-proof__frame,
html[data-appearance="dark"] .portal-public .mp-public-auth-panel,
html[data-appearance="dark"] .portal-public .mp-public-final-band,
html[data-appearance="dark"] .portal-public .mp-public-utility-intro {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 94%, white 3%),
    color-mix(in srgb, var(--bg-panel-2) 94%, black 6%)
  );
  border-color: color-mix(in srgb, var(--line-default) 74%, transparent);
  box-shadow: 0 16px 32px #0000002e;
}
html[data-appearance="dark"] .portal-public .mp-public-lite-proof__screen,
html[data-appearance="dark"] .portal-public .mp-public-lite-proof__task,
html[data-appearance="dark"] .portal-public .mp-public-lite-proof__card,
html[data-appearance="dark"] .portal-public .mp-public-lite-proof__signal span,
html[data-appearance="dark"] .portal-public .mp-public-lite-proof__pill,
html[data-appearance="dark"] .portal-public .mp-public-route-card,
html[data-appearance="dark"] .portal-public .mp-public-reason,
html[data-appearance="dark"] .portal-public .auth-support-card {
  background: color-mix(in srgb, var(--bg-panel) 88%, black 12%);
  border-color: color-mix(in srgb, var(--line-default) 70%, transparent);
}
html[data-appearance="dark"]
  .portal-public
  .mp-public-lite-proof__pill.is-active {
  background: color-mix(in srgb, var(--brand-900) 34%, var(--bg-panel) 66%);
  border-color: color-mix(
    in srgb,
    var(--brand-400) 34%,
    var(--line-default) 66%
  );
}
html[data-appearance="dark"] .sidebar-link__icon,
html[data-appearance="dark"] .student-side-nav__icon,
html[data-appearance="dark"] .sidebar-group__icon {
  filter: none;
}
@media (max-width: 720px) {
  .portal-public .mp-public-lite-proof__screen {
    grid-template-columns: 1fr;
    grid-template-areas: "task" "rail" "signal";
    min-height: 0;
  }
  .portal-public .mp-public-lite-proof__rail,
  .portal-public .mp-public-lite-proof__cards {
    width: 100%;
    grid-template-columns: 1fr;
  }
  .portal-public .mp-public-auth-page--simple {
    --public-shell-max: 100%;
  }
}
body.portal-student.viewport-short-landscape .student-mobile-nav__label {
  font-size: 0.57rem;
  line-height: 1.05;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}
body.portal-student.viewport-short-landscape
  .student-mobile-nav__label--compact {
  font-size: 0.54rem;
}
body.portal-student.viewport-short-landscape .student-mobile-nav__sheet {
  width: min(320px, calc(100vw - 20px));
  bottom: calc(100% + 6px);
  padding: 10px;
}
@keyframes adult-loading-shimmer {
  0% {
    background-position: 100% 50%;
  }
  to {
    background-position: -100% 50%;
  }
}
.adult-workspace-loading .section-header p {
  max-width: 42ch;
  color: var(--text-muted);
}
.adult-workspace-metric--loading,
.adult-loading-panel {
  overflow: hidden;
}
.adult-loading-stack {
  display: grid;
  gap: 10px;
}
.adult-loading-bar {
  display: block;
  width: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #e4eaf7d6, #f4f7fff5, #e4eaf7d6);
  background-size: 220% 100%;
  animation: adult-loading-shimmer 1.2s linear infinite;
}
.adult-loading-bar--label {
  height: 10px;
  width: 42%;
}
.adult-loading-bar--value {
  height: 26px;
  width: 36%;
}
.adult-loading-bar--hint {
  height: 10px;
  width: 74%;
}
.adult-loading-bar--row {
  height: 14px;
}
.adult-loading-bar--row-1 {
  width: 84%;
}
.adult-loading-bar--row-2 {
  width: 92%;
}
.adult-loading-bar--row-3 {
  width: 76%;
}
.adult-loading-bar--row-4 {
  width: 68%;
}
body.portal-adult.viewport-short-landscape .app-shell--adult,
body.portal-adult.viewport-short-landscape.sidebar-collapsed .app-shell--adult {
  grid-template-columns: minmax(0, 1fr) !important;
}
body.portal-adult.viewport-short-landscape .drawer-toggle {
  display: inline-flex !important;
}
body.portal-adult.viewport-short-landscape .app-sidebar__togglebar {
  display: none !important;
}
body.portal-adult.viewport-short-landscape .app-sidebar--adult,
body.portal-adult.viewport-short-landscape.sidebar-collapsed
  .app-sidebar--adult {
  position: fixed !important;
  top: 0;
  left: 0;
  bottom: 0;
  width: min(82vw, 320px);
  max-height: none !important;
  overflow-y: auto;
  transform: translate(calc(-100% - 16px));
  z-index: 70;
}
body.portal-adult.viewport-short-landscape.drawer-open .app-sidebar--adult {
  transform: translate(0);
}
body.portal-adult.viewport-short-landscape .app-content--adult {
  gap: 8px !important;
  padding: 8px !important;
}
body.portal-adult.viewport-short-landscape .adult-class-workspace--students {
  gap: 8px !important;
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--students
  .adult-select-field__label,
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--students
  .adult-class-workspace__metrics {
  display: none !important;
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--students
  .adult-class-workspace__selectors {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--students
  .adult-select-field
  select {
  min-height: 40px;
  border-radius: 14px;
}
body.portal-adult.viewport-short-landscape .mp-topbar--adult .mp-topbar__inner {
  min-height: 54px;
  padding: max(6px, env(safe-area-inset-top)) 10px 8px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
}
body.portal-adult.viewport-short-landscape
  .mp-topbar--adult
  .mp-topbar__center {
  display: none !important;
}
body.portal-adult.viewport-short-landscape .mp-topbar--adult .mp-topbar__right,
body.portal-adult.viewport-short-landscape
  .mp-topbar--adult
  .mp-topbar__right--signed-in,
body.portal-adult.viewport-short-landscape
  .mp-topbar--adult
  .mp-topbar__right--signed-out {
  gap: 4px;
}
body.portal-adult.viewport-short-landscape
  .mp-topbar--adult
  .mp-topbar__control,
body.portal-adult.viewport-short-landscape
  .mp-topbar--adult
  .mp-profile-trigger,
body.portal-adult.viewport-short-landscape
  .mp-topbar--adult
  .mp-language-menu
  summary {
  min-height: 34px;
}
body.portal-adult.viewport-short-landscape .section,
body.portal-adult.viewport-short-landscape .card,
body.portal-adult.viewport-short-landscape .adult-list-panel,
body.portal-adult.viewport-short-landscape .adult-detail-panel > .card {
  padding: 10px 12px;
  border-radius: 18px;
}
body.portal-adult.viewport-short-landscape .section-header {
  gap: 6px;
}
body.portal-adult.viewport-short-landscape .section-header h1 {
  font-size: clamp(1.45rem, 4.4vw, 1.95rem);
}
body.portal-adult.viewport-short-landscape .section-header p {
  font-size: 0.92rem;
  line-height: 1.35;
}
@media (max-height: 720px) and (orientation: landscape) {
  body.portal-adult .app-shell--adult,
  body.sidebar-collapsed.portal-adult .app-shell--adult {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.portal-adult .drawer-toggle {
    display: inline-flex !important;
  }
  body.portal-adult .app-sidebar__togglebar {
    display: none !important;
  }
  body.portal-adult .app-sidebar--adult,
  body.sidebar-collapsed.portal-adult .app-sidebar--adult {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(82vw, 320px);
    max-height: none !important;
    overflow-y: auto;
    transform: translate(calc(-100% - 16px));
    z-index: 70;
  }
  body.portal-adult.drawer-open .app-sidebar--adult {
    transform: translate(0);
  }
  body.portal-adult .app-content--adult {
    gap: 10px !important;
    padding: 10px !important;
  }
  body.portal-adult .adult-class-workspace--students {
    gap: 8px !important;
  }
  body.portal-adult .adult-class-workspace--students .adult-select-field__label,
  body.portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__metrics {
    display: none !important;
  }
  body.portal-adult
    .adult-class-workspace--students
    .adult-class-workspace__selectors {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.portal-adult
    .adult-class-workspace--students
    .adult-select-field
    select {
    min-height: 40px;
    border-radius: 14px;
  }
  body.portal-adult .mp-topbar--adult .mp-topbar__inner {
    min-height: 58px;
    padding: max(6px, env(safe-area-inset-top)) 10px 8px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
  }
  body.portal-adult .mp-topbar--adult .mp-topbar__center {
    display: none !important;
  }
  body.portal-adult .mp-topbar--adult .topbar-brand-image,
  body.portal-adult .mp-topbar--adult .mp-topbar__brand img {
    height: 28px;
    max-height: 28px;
    max-width: min(180px, 100%);
  }
  body.portal-adult .mp-topbar--adult .mp-topbar__right,
  body.portal-adult .mp-topbar--adult .mp-topbar__right--signed-in,
  body.portal-adult .mp-topbar--adult .mp-topbar__right--signed-out {
    gap: 4px;
  }
  body.portal-adult .mp-topbar--adult .mp-topbar__control,
  body.portal-adult .mp-topbar--adult .mp-profile-trigger,
  body.portal-adult .mp-topbar--adult .mp-language-menu summary {
    min-height: 44px;
  }
  body.portal-adult .section,
  body.portal-adult .card,
  body.portal-adult .adult-list-panel,
  body.portal-adult .adult-detail-panel > .card {
    padding: 12px 14px;
    border-radius: 20px;
  }
  body.portal-adult .section-header {
    gap: 6px;
  }
  body.portal-adult .section-header h1 {
    font-size: clamp(1.5rem, 4vw, 2rem);
  }
  body.portal-adult .section-header p {
    font-size: 0.93rem;
    line-height: 1.36;
  }
  body.portal-adult .overview-kpi-strip,
  body.portal-adult .overview-workbench,
  body.portal-adult .adult-top-grid {
    gap: 10px;
    margin-bottom: 10px;
  }
}
@media (max-width: 980px) {
  body.portal-adult .adult-mobile-menu-row {
    display: none !important;
  }
  body.portal-adult .adult-mobile-menu-toggle {
    display: inline-flex !important;
  }
  body.portal-adult .app-sidebar__togglebar {
    display: flex !important;
    padding: 4px 8px 2px;
  }
  body.portal-adult .app-sidebar__toggle {
    display: none !important;
  }
}
body.portal-adult.viewport-short-landscape .adult-mobile-menu-row {
  display: none !important;
}
body.portal-adult.viewport-short-landscape .adult-mobile-menu-toggle {
  display: inline-flex !important;
}
body.portal-adult.viewport-short-landscape .app-sidebar__togglebar {
  display: flex !important;
  padding: 4px 8px 2px;
}
body.portal-adult.viewport-short-landscape .app-sidebar__toggle {
  display: none !important;
}
@media (max-width: 760px) {
  .portal-adult
    .adult-class-workspace--student-directory
    .adult-class-workspace__selectors,
  .portal-adult
    .adult-class-workspace--assignment-board
    .adult-class-workspace__selectors,
  .portal-adult
    .adult-class-workspace--insight-board
    .adult-class-workspace__selectors {
    grid-template-columns: 1fr !important;
  }
}
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--student-directory
  .adult-class-workspace__selectors,
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--assignment-board
  .adult-class-workspace__selectors,
body.portal-adult.viewport-short-landscape
  .adult-class-workspace--insight-board
  .adult-class-workspace__selectors {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
@media (max-height: 720px) and (orientation: landscape) {
  body.portal-adult .adult-mobile-menu-row {
    display: none !important;
  }
  body.portal-adult .adult-mobile-menu-toggle {
    display: inline-flex !important;
  }
  body.portal-adult .app-sidebar__togglebar {
    display: flex !important;
    padding: 4px 8px 2px;
  }
  body.portal-adult .app-sidebar__toggle {
    display: none !important;
  }
}
.student-home-page--game-dashboard {
  gap: 14px;
}
.student-home-kid-board {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(330px, 0.82fr);
  gap: 14px;
  align-items: stretch;
  min-width: 0;
}
.student-home-kid-hero,
.student-home-kid-path,
.student-home-kid-action {
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 15%,
      rgba(31, 47, 82, 0.12)
    );
  box-shadow: 0 14px 30px
    color-mix(
      in srgb,
      rgba(31, 47, 82, 0.08) 80%,
      var(--student-theme-primary, #5a78ff) 20%
    );
}
.student-home-kid-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.94fr) minmax(300px, 0.78fr);
  gap: 18px;
  align-items: stretch;
  min-width: 0;
  padding: 22px;
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 94% 4%,
      color-mix(
        in srgb,
        var(--student-theme-secondary, #dce6ff) 42%,
        transparent
      ),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      color-mix(in srgb, white 96%, var(--student-theme-secondary, #dce6ff) 4%),
      color-mix(in srgb, white 88%, var(--student-theme-primary, #5a78ff) 12%)
    );
  overflow: hidden;
}
.student-home-kid-hero__copy {
  display: grid;
  gap: 12px;
  align-content: center;
  min-width: 0;
}
.student-home-kid-hero__topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.student-home-kid-hero__copy h1 {
  margin: 0;
  font-size: clamp(2.25rem, 4vw, 3.35rem);
  line-height: 0.98;
  text-wrap: balance;
}
.student-home-kid-hero__copy p {
  margin: 0;
  max-width: 42ch;
  color: #1b2a44bd;
  font-size: 1rem;
  line-height: 1.5;
}
.student-home-kid-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  min-height: 34px;
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(31, 47, 82, 0.08)
    );
  background: #ffffffb8;
  color: #1b2a44e0;
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.student-home-kid-chip > span:first-child {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    white 72%,
    var(--student-theme-secondary, #dce6ff) 28%
  );
  line-height: 1;
}
.student-home-kid-hero__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.student-home-kid-mission {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: space-between;
  gap: 16px;
  min-width: 0;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 12%,
      rgba(31, 47, 82, 0.08)
    );
  background: linear-gradient(180deg, #ffffffc2, #ffffff7a);
  backdrop-filter: blur(8px);
}
.student-home-kid-mission__copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.student-home-kid-mission__copy h2 {
  margin: 0;
  font-size: clamp(1.55rem, 2.4vw, 2rem);
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.student-home-kid-mission__copy p {
  margin: 0;
  color: #1b2a44b8;
  font-size: 0.96rem;
  line-height: 1.45;
}
.student-home-kid-mission__action {
  display: flex;
  justify-content: stretch;
}
.student-home-kid-mission__cta {
  width: 100%;
  min-height: 46px;
}
.student-home-kid-path {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 18px;
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 100% 0%,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 12%,
        transparent
      ),
      transparent 36%
    ),
    linear-gradient(
      160deg,
      color-mix(in srgb, white 96%, var(--student-theme-secondary, #dce6ff) 4%),
      color-mix(in srgb, white 89%, var(--student-theme-primary, #5a78ff) 11%)
    );
}
.student-home-kid-path__top,
.student-home-kid-path__pilot,
.student-home-kid-path__track-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.student-home-kid-path__top {
  align-items: flex-start;
  flex-wrap: wrap;
}
.student-home-kid-path__top > div {
  display: grid;
  flex: 1 1 180px;
  gap: 6px;
  min-width: 0;
}
.student-home-kid-path__top h2 {
  margin: 0;
  font-size: clamp(1.45rem, 2vw, 1.9rem);
  line-height: 1;
  overflow-wrap: anywhere;
}
.student-home-kid-path__pilot {
  justify-content: flex-start;
  padding: 12px;
  border-radius: 20px;
  background: #ffffff8f;
}
.student-home-kid-path__avatar-frame {
  width: 56px;
  height: 56px;
  border-radius: 17px;
  flex: 0 0 auto;
}
.student-home-kid-path__pilot-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.student-home-kid-path__pilot-copy strong {
  font-size: 1.08rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.student-home-kid-path__pilot-copy span,
.student-home-kid-path__next,
.student-home-kid-path__mini span,
.student-home-kid-path__mini small,
.student-home-kid-path__track-head span {
  color: #1b2a44b8;
  font-size: 0.84rem;
  line-height: 1.35;
}
.student-home-kid-path__track {
  display: grid;
  gap: 10px;
  padding: 13px 14px;
  border-radius: 20px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 10%,
      rgba(31, 47, 82, 0.08)
    );
  background: #ffffff94;
}
.student-home-kid-path__track-head strong {
  font-size: 1.08rem;
}
.student-home-kid-path__rail {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 12%,
    rgba(31, 47, 82, 0.08)
  );
}
.student-home-kid-path__fill {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(
    90deg,
    var(--student-theme-primary, #5a78ff),
    color-mix(
      in srgb,
      var(--student-theme-secondary, #dce6ff) 35%,
      var(--student-theme-primary, #5a78ff) 65%
    )
  );
}
.student-home-kid-path__marker {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 20%,
      rgba(31, 47, 82, 0.1)
    );
  background: #fff;
  box-shadow: 0 8px 16px #1f2f521f;
  font-size: 0.95rem;
  line-height: 1;
}
.student-home-kid-path__mini {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-home-kid-path__mini > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 11px 12px;
  border-radius: 18px;
  background: #ffffff85;
}
.student-home-kid-path__mini strong {
  font-size: 1rem;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.student-home-console-grid--kid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.student-home-kid-moves-card {
  gap: 14px;
}
.student-home-kid-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}
.student-home-kid-action {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "icon copy" "cta cta";
  gap: 10px 12px;
  align-content: space-between;
  min-width: 0;
  min-height: 124px;
  padding: 13px;
  border-radius: 20px;
  background: linear-gradient(180deg, #fffffff0, #f8faffe0);
}
.student-home-kid-action--gold {
  background: linear-gradient(180deg, #fff9e8f5, #ffffffe6);
}
.student-home-kid-action--sage {
  background: linear-gradient(180deg, #f4faf1f5, #ffffffe6);
}
.student-home-kid-action__icon {
  grid-area: icon;
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: color-mix(
    in srgb,
    white 72%,
    var(--student-theme-secondary, #dce6ff) 28%
  );
  font-size: 1.05rem;
  line-height: 1;
}
.student-home-kid-action__copy {
  grid-area: copy;
  display: grid;
  gap: 4px;
  min-width: 0;
}
.student-home-kid-action__copy strong {
  font-size: 1.02rem;
  line-height: 1.14;
  overflow-wrap: anywhere;
}
.student-home-kid-action__copy span:not(.student-home-kid-action__badge) {
  color: #1b2a44b8;
  font-size: 0.82rem;
  line-height: 1.34;
}
.student-home-kid-action__badge {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 3px 7px;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 10%,
    white 90%
  );
  color: #1b2a44c7;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.student-home-kid-action__cta {
  grid-area: cta;
  display: flex;
  align-self: end;
}
.student-home-kid-action__cta--split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.student-home-kid-action__cta .btn {
  width: 100%;
  min-height: 32px;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(.student-home-kid-hero, .student-home-kid-path, .student-home-kid-action),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(.student-home-kid-hero, .student-home-kid-path, .student-home-kid-action),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero,
    .student-home-kid-path,
    .student-home-kid-action
  ) {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 18%,
        transparent
      ),
      transparent 44%
    ),
    linear-gradient(
      155deg,
      var(--student-theme-dark-surface),
      var(--student-theme-dark-surface-soft)
    );
  box-shadow: 0 22px 48px var(--student-theme-dark-glow);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-mission,
    .student-home-kid-chip,
    .student-home-kid-path__pilot,
    .student-home-kid-path__track,
    .student-home-kid-path__mini > div
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-mission,
    .student-home-kid-chip,
    .student-home-kid-path__pilot,
    .student-home-kid-path__track,
    .student-home-kid-path__mini > div
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-mission,
    .student-home-kid-chip,
    .student-home-kid-path__pilot,
    .student-home-kid-path__track,
    .student-home-kid-path__mini > div
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(188, 198, 230, 0.18)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(19, 28, 48, 0.96) 82%,
      var(--student-theme-primary, #5a78ff) 18%
    ),
    #0a101ef2
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero__copy p,
    .student-home-kid-mission__copy p,
    .student-home-kid-path__pilot-copy span,
    .student-home-kid-path__next,
    .student-home-kid-path__mini span,
    .student-home-kid-path__mini small,
    .student-home-kid-path__track-head span,
    .student-home-kid-action__copy span:not(.student-home-kid-action__badge)
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero__copy p,
    .student-home-kid-mission__copy p,
    .student-home-kid-path__pilot-copy span,
    .student-home-kid-path__next,
    .student-home-kid-path__mini span,
    .student-home-kid-path__mini small,
    .student-home-kid-path__track-head span,
    .student-home-kid-action__copy span:not(.student-home-kid-action__badge)
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero__copy p,
    .student-home-kid-mission__copy p,
    .student-home-kid-path__pilot-copy span,
    .student-home-kid-path__next,
    .student-home-kid-path__mini span,
    .student-home-kid-path__mini small,
    .student-home-kid-path__track-head span,
    .student-home-kid-action__copy span:not(.student-home-kid-action__badge)
  ) {
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(.student-home-kid-hero__greeting, .student-home-kid-mission__fact span),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(.student-home-kid-hero__greeting, .student-home-kid-mission__fact span),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(.student-home-kid-hero__greeting, .student-home-kid-mission__fact span) {
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero h1,
    .student-home-kid-chip,
    .student-home-kid-mission h2,
    .student-home-kid-path h2,
    .student-home-kid-path strong,
    .student-home-kid-action strong
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero h1,
    .student-home-kid-chip,
    .student-home-kid-mission h2,
    .student-home-kid-path h2,
    .student-home-kid-path strong,
    .student-home-kid-action strong
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-kid-hero h1,
    .student-home-kid-chip,
    .student-home-kid-mission h2,
    .student-home-kid-path h2,
    .student-home-kid-path strong,
    .student-home-kid-action strong
  ) {
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-kid-mission__fact
  strong,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-kid-mission__fact
  strong,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-kid-mission__fact
  strong {
  color: var(--student-theme-dark-strong);
}
@media (max-width: 1220px) {
  .student-home-kid-board {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.78fr);
  }
  .student-home-kid-hero {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 1060px) {
  .student-home-kid-board {
    grid-template-columns: 1fr;
  }
  .student-home-kid-path {
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
    align-items: stretch;
  }
  .student-home-kid-path__top,
  .student-home-kid-path__pilot {
    grid-column: 1;
  }
  .student-home-kid-path__track,
  .student-home-kid-path__mini {
    grid-column: 2;
  }
  .student-home-kid-path__track {
    align-content: center;
  }
  .student-home-kid-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .student-home-kid-path {
    grid-template-columns: 1fr;
  }
  .student-home-kid-path__top,
  .student-home-kid-path__pilot,
  .student-home-kid-path__track,
  .student-home-kid-path__mini {
    grid-column: auto;
  }
}
@media (max-width: 720px) {
  .student-practice-page--ux-refresh .student-section-hero__aside,
  .student-game-hub-page:not(.student-home-page) .student-section-hero__aside {
    display: none;
  }
  .student-home-kid-hero,
  .student-home-kid-path {
    padding: 15px;
    border-radius: 22px;
  }
  .student-home-kid-hero {
    gap: 13px;
  }
  .student-home-kid-hero__copy {
    gap: 9px;
  }
  .student-home-kid-hero__copy h1 {
    font-size: clamp(1.9rem, 9vw, 2.42rem);
  }
  .student-home-kid-hero__copy p {
    font-size: 0.92rem;
    line-height: 1.42;
  }
  .student-home-kid-hero__chips,
  .student-home-kid-path__pilot,
  .student-home-kid-path__mini,
  .student-home-kid-path .student-home-inline-action {
    display: none;
  }
  .student-home-kid-mission {
    gap: 12px;
    padding: 13px;
    border-radius: 18px;
  }
  .student-home-kid-mission__copy h2 {
    font-size: clamp(1.32rem, 6.2vw, 1.66rem);
  }
  .student-home-kid-mission__copy p {
    font-size: 0.9rem;
  }
  .student-home-kid-mission__cta {
    min-height: 44px;
  }
  .student-home-kid-path {
    gap: 10px;
  }
  .student-home-kid-path__top h2 {
    font-size: 1.34rem;
  }
  .student-home-kid-path__track {
    padding: 11px 12px;
    border-radius: 17px;
  }
}
@media (max-width: 560px) {
  .student-home-page--game-dashboard,
  .student-home-kid-board {
    gap: 10px;
  }
  .student-home-kid-actions {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .student-home-kid-action {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    grid-template-areas: "icon copy cta";
    align-items: center;
    min-height: 0;
    padding: 10px;
    border-radius: 16px;
  }
  .student-home-kid-action__icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
  }
  .student-home-kid-action__copy {
    gap: 2px;
  }
  .student-home-kid-action__copy strong {
    font-size: 0.96rem;
  }
  .student-home-kid-action__copy span:not(.student-home-kid-action__badge) {
    font-size: 0.78rem;
  }
  .student-home-kid-action__badge {
    display: none;
  }
  .student-home-kid-action__cta .btn {
    width: auto;
    min-width: 72px;
    min-height: 34px;
    padding-inline: 10px;
  }
}
.student-home-page--game-dashboard {
  --student-game-stage-gap: clamp(10px, 1.1vw, 16px);
}
.student-home-game-stage {
  grid-template-columns: minmax(0, 1.52fr) minmax(280px, 0.68fr);
  gap: var(--student-game-stage-gap);
}
.student-home-game-console {
  grid-template-columns: minmax(0, 0.98fr) minmax(280px, 0.72fr);
  gap: clamp(14px, 1.6vw, 22px);
  min-height: 310px;
  padding: clamp(18px, 2vw, 28px);
  border-radius: 30px;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(31, 47, 82, 0.1)
  );
  background: linear-gradient(
    135deg,
    color-mix(in srgb, #ffffff 94%, var(--student-theme-secondary, #dce6ff) 6%),
    color-mix(in srgb, #eef4ff 76%, var(--student-theme-primary, #5a78ff) 24%)
  );
  box-shadow:
    0 22px 42px
      color-mix(
        in srgb,
        rgba(30, 41, 68, 0.1) 76%,
        var(--student-theme-primary, #5a78ff) 24%
      ),
    inset 0 1px #ffffffb8;
}
.student-home-game-console .student-home-kid-hero__copy {
  align-content: start;
  gap: clamp(10px, 1.2vw, 16px);
}
.student-home-game-console .student-home-kid-hero__topline {
  align-items: flex-start;
}
.student-home-kid-hero__greeting {
  color: #1b2a44c7;
  font-size: 0.96rem;
  font-weight: 760;
  line-height: 1.25;
  min-width: 0;
}
.student-home-game-console .student-home-kid-hero__copy h1 {
  max-width: 12ch;
  font-size: clamp(2.5rem, 4.6vw, 3.9rem);
  line-height: 1.06;
  text-wrap: balance;
}
.student-home-game-console .student-home-kid-hero__copy p {
  max-width: 34ch;
  font-size: clamp(0.98rem, 1.05vw, 1.08rem);
}
.student-home-game-console .student-home-kid-chip {
  min-height: 36px;
  padding: 7px 12px;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 25%,
    rgba(31, 47, 82, 0.1)
  );
  background: #ffffffd1;
  box-shadow: inset 0 1px #ffffffbd;
}
.student-home-route-map {
  position: relative;
  display: grid;
  gap: 12px;
  width: min(100%, 580px);
  min-width: 0;
  padding: 14px;
  border-radius: 22px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 16%,
      rgba(31, 47, 82, 0.1)
    );
  background: #ffffff94;
  box-shadow: inset 0 1px #ffffffb8;
}
.student-home-route-map__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  color: #1b2a44b8;
  font-size: 0.8rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.student-home-route-map__head strong {
  color: var(--text-strong);
  letter-spacing: 0;
  text-transform: none;
}
.student-home-route-map__rail {
  position: absolute;
  left: 34px;
  right: 34px;
  top: 17px;
  height: 4px;
  z-index: 0;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 18%,
    rgba(31, 47, 82, 0.1)
  );
}
.student-home-route-map__nodes {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  z-index: 1;
}
.student-home-route-node {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 7px;
  min-width: 0;
  text-align: center;
  z-index: 1;
}
.student-home-route-node__dot {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 14px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(31, 47, 82, 0.1)
    );
  background: color-mix(
    in srgb,
    white 72%,
    var(--student-theme-secondary, #dce6ff) 28%
  );
  box-shadow: 0 10px 18px #1f2f521a;
  line-height: 1;
}
.student-home-route-node--current .student-home-route-node__dot,
.student-home-route-node--ready .student-home-route-node__dot {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 42%,
    rgba(31, 47, 82, 0.1)
  );
  background: linear-gradient(
    180deg,
    color-mix(in srgb, white 64%, var(--student-theme-secondary, #dce6ff) 36%),
    color-mix(in srgb, white 48%, var(--student-theme-primary, #5a78ff) 52%)
  );
}
.student-home-route-node--locked .student-home-route-node__dot {
  opacity: 0.78;
  filter: saturate(0.76);
}
.student-home-route-node__copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.student-home-route-node__copy strong {
  color: var(--text-strong);
  font-size: 0.78rem;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.student-home-route-node__copy small {
  color: #1b2a44a8;
  font-size: 0.68rem;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.student-home-kid-mission {
  padding: clamp(16px, 1.8vw, 22px);
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffffdb, #ffffff9e);
  box-shadow:
    inset 0 1px #ffffffbd,
    0 12px 24px #1f2f5214;
}
.student-home-kid-mission__copy h2 {
  font-size: clamp(1.9rem, 2.8vw, 2.45rem);
  line-height: 1.18;
}
.student-home-kid-mission__copy p {
  max-width: 31ch;
}
.student-home-kid-mission__facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  min-width: 0;
}
.student-home-kid-mission__fact {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px 11px;
  border-radius: 16px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 12%,
      rgba(31, 47, 82, 0.08)
    );
  background: #ffffff8f;
  box-shadow: inset 0 1px #ffffffa8;
}
.student-home-kid-mission__fact span {
  color: #1b2a44ad;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: uppercase;
}
.student-home-kid-mission__fact strong {
  color: var(--text-strong);
  font-size: 0.92rem;
  line-height: 1.18;
  overflow-wrap: anywhere;
}
.student-home-player-panel {
  align-content: stretch;
  padding: clamp(14px, 1.4vw, 20px);
  border-radius: 30px;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 22%,
    rgba(31, 47, 82, 0.1)
  );
  background: linear-gradient(
    145deg,
    color-mix(in srgb, #ffffff 92%, var(--student-theme-secondary, #dce6ff) 8%),
    color-mix(in srgb, #eef4ff 72%, var(--student-theme-primary, #5a78ff) 28%)
  );
  box-shadow:
    0 22px 42px
      color-mix(
        in srgb,
        rgba(30, 41, 68, 0.1) 74%,
        var(--student-theme-primary, #5a78ff) 26%
      ),
    inset 0 1px #ffffffb8;
}
.student-home-player-panel .student-home-kid-path__top {
  align-items: flex-start;
}
.student-home-player-panel .student-home-kid-path__pilot,
.student-home-player-panel .student-home-kid-path__track,
.student-home-player-panel .student-home-kid-path__mini > div {
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 13%,
      rgba(31, 47, 82, 0.08)
    );
  background: #ffffff9e;
  box-shadow: inset 0 1px #ffffffad;
}
.student-home-player-panel .student-home-kid-path__track {
  align-self: stretch;
}
.student-home-player-panel .student-home-kid-path__rail {
  height: 14px;
}
.student-home-kid-moves-card {
  border-radius: 26px;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 12%,
    rgba(31, 47, 82, 0.1)
  );
  background: linear-gradient(180deg, #fffffff5, #f7faffeb);
}
.student-home-kid-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.student-home-mode-tile {
  min-height: 126px;
  padding: 14px;
  border-radius: 22px;
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 17%,
    rgba(31, 47, 82, 0.1)
  );
  background: linear-gradient(
    180deg,
    #fffffff0,
    color-mix(
      in srgb,
      rgba(255, 255, 255, 0.88) 82%,
      var(--student-theme-secondary, #dce6ff) 18%
    )
  );
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}
.student-home-mode-tile:hover,
.student-home-mode-tile:focus-within {
  transform: translateY(-2px);
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(31, 47, 82, 0.1)
  );
  box-shadow: 0 16px 30px
    color-mix(
      in srgb,
      rgba(31, 47, 82, 0.11) 70%,
      var(--student-theme-primary, #5a78ff) 30%
    );
}
.student-home-mode-tile .student-home-kid-action__icon {
  width: 42px;
  height: 42px;
  border-radius: 15px;
}
.student-home-mode-tile .student-home-kid-action__button {
  min-height: 34px;
  border-radius: 13px;
}
.student-home-kid-action--dual {
  align-content: stretch;
}
.student-home-kid-action--dual
  .student-home-kid-action__copy
  span:not(.student-home-kid-action__badge) {
  max-width: 28ch;
}
.student-home-mode-group {
  display: grid;
  grid-template-rows: auto 1fr auto;
  align-content: stretch;
  gap: 12px;
}
.student-home-mode-group__header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
}
.student-home-mode-group__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.student-home-mode-group__button {
  width: 100%;
  min-height: 36px;
}
@media (min-width: 1180px) and (max-height: 1040px) {
  .student-home-page--game-dashboard,
  .student-home-game-stage {
    gap: 10px;
  }
  .student-home-game-console {
    min-height: 0;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 24px;
  }
  .student-home-game-console .student-home-kid-hero__copy {
    gap: 8px;
  }
  .student-home-game-console .student-home-kid-hero__copy h1 {
    max-width: 11ch;
    font-size: clamp(2.1rem, 3.3vw, 3rem);
    line-height: 1.02;
  }
  .student-home-game-console .student-home-kid-hero__copy p {
    max-width: 30ch;
    font-size: 0.92rem;
    line-height: 1.34;
  }
  .student-home-game-console .student-home-kid-chip {
    min-height: 32px;
    padding: 5px 10px;
  }
  .student-home-route-map {
    gap: 8px;
    padding: 10px 12px;
    border-radius: 18px;
  }
  .student-home-route-map__head {
    font-size: 0.74rem;
  }
  .student-home-route-map__rail {
    left: 30px;
    right: 30px;
    top: 15px;
  }
  .student-home-route-node {
    gap: 5px;
  }
  .student-home-route-node__dot {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    font-size: 0.88rem;
  }
  .student-home-route-node__copy strong {
    font-size: 0.72rem;
  }
  .student-home-route-node__copy small {
    font-size: 0.62rem;
    line-height: 1.1;
  }
  .student-home-kid-mission {
    gap: 10px;
    padding: 12px;
    border-radius: 20px;
  }
  .student-home-kid-mission__copy {
    gap: 6px;
  }
  .student-home-kid-mission__copy h2 {
    font-size: clamp(1.42rem, 2vw, 1.86rem);
    line-height: 1.02;
  }
  .student-home-kid-mission__copy p {
    font-size: 0.88rem;
    line-height: 1.34;
    max-width: none;
  }
  .student-home-kid-mission__facts {
    gap: 8px;
  }
  .student-home-kid-mission__fact {
    padding: 8px 10px;
    border-radius: 14px;
  }
  .student-home-kid-mission__fact strong {
    font-size: 0.86rem;
  }
  .student-home-kid-mission__cta {
    min-height: 44px;
  }
  .student-home-player-panel {
    gap: 10px;
    padding: 12px;
    border-radius: 24px;
  }
  .student-home-kid-path__top h2 {
    font-size: clamp(1.28rem, 1.7vw, 1.58rem);
  }
  .student-home-kid-path__pilot {
    padding: 10px;
    border-radius: 18px;
  }
  .student-home-kid-path__avatar-frame {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }
  .student-home-kid-path__pilot-copy strong {
    font-size: 1rem;
  }
  .student-home-kid-path__pilot-copy span,
  .student-home-kid-path__next,
  .student-home-kid-path__mini span,
  .student-home-kid-path__mini small,
  .student-home-kid-path__track-head span {
    font-size: 0.8rem;
  }
  .student-home-kid-path__track {
    gap: 8px;
    padding: 10px 12px;
    border-radius: 18px;
  }
  .student-home-kid-path__track-head strong {
    font-size: 1rem;
  }
  .student-home-kid-path__rail {
    height: 12px;
  }
  .student-home-kid-path__marker {
    width: 26px;
    height: 26px;
    font-size: 0.84rem;
  }
  .student-home-kid-path__mini {
    gap: 8px;
  }
  .student-home-kid-path__mini > div {
    padding: 10px;
    border-radius: 16px;
  }
  .student-home-kid-path__mini strong {
    font-size: 0.92rem;
  }
  .student-home-kid-moves-card {
    gap: 10px;
    border-radius: 22px;
  }
  .student-home-console-card__header {
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }
  .student-home-console-card__header > div h2 {
    font-size: clamp(1.12rem, 1.5vw, 1.36rem);
  }
  .student-home-console-card__header-note {
    max-width: 34ch;
    font-size: 0.8rem;
    line-height: 1.3;
  }
  .student-home-kid-actions {
    gap: 10px;
  }
  .student-home-mode-tile {
    min-height: 98px;
    padding: 12px;
    border-radius: 18px;
  }
  .student-home-mode-tile .student-home-kid-action__icon {
    width: 38px;
    height: 38px;
    border-radius: 13px;
  }
  .student-home-mode-tile .student-home-kid-action__copy {
    gap: 2px;
  }
  .student-home-mode-tile .student-home-kid-action__copy strong {
    font-size: 0.96rem;
  }
  .student-home-mode-tile
    .student-home-kid-action__copy
    span:not(.student-home-kid-action__badge) {
    font-size: 0.78rem;
    line-height: 1.28;
  }
  .student-home-kid-action--dual
    .student-home-kid-action__copy
    span:not(.student-home-kid-action__badge) {
    max-width: 24ch;
  }
  .student-home-mode-group {
    gap: 8px;
  }
  .student-home-mode-group__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  .student-home-mode-group__button {
    min-height: 32px;
  }
}
html[data-appearance="dark"] .mp-profile-trigger__avatar,
html[data-theme="dark"] .mp-profile-trigger__avatar,
body.theme-dark .mp-profile-trigger__avatar {
  color: #0f172a;
  background: linear-gradient(180deg, #f7f9ff, #dbe6ff);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 8px 18px #0000003d;
}
html[data-appearance="dark"]
  .mp-profile-trigger__avatar
  :is(.mp-profile-trigger__avatar-text, .learner-avatar__fallback),
html[data-theme="dark"]
  .mp-profile-trigger__avatar
  :is(.mp-profile-trigger__avatar-text, .learner-avatar__fallback),
body.theme-dark
  .mp-profile-trigger__avatar
  :is(.mp-profile-trigger__avatar-text, .learner-avatar__fallback) {
  color: #0f172a;
  opacity: 1;
  text-shadow: none;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-profile-preview-card__avatar
  .learner-avatar__fallback,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-profile-preview-card__avatar
  .learner-avatar__fallback,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-profile-preview-card__avatar
  .learner-avatar__fallback {
  color: #0f172a;
  opacity: 1;
  text-shadow: none;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-game-console,
    .student-home-player-panel,
    .student-home-mode-tile
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-game-console,
    .student-home-player-panel,
    .student-home-mode-tile
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-game-console,
    .student-home-player-panel,
    .student-home-mode-tile
  ) {
  border-color: var(--student-theme-dark-border);
  background: linear-gradient(
    145deg,
    var(--student-theme-dark-surface),
    var(--student-theme-dark-surface-soft)
  );
  box-shadow:
    0 24px 52px var(--student-theme-dark-glow),
    inset 0 1px #ffffff14;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-route-map,
    .student-home-kid-mission,
    .student-home-player-panel .student-home-kid-path__pilot,
    .student-home-player-panel .student-home-kid-path__track,
    .student-home-player-panel .student-home-kid-path__mini > div
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-route-map,
    .student-home-kid-mission,
    .student-home-player-panel .student-home-kid-path__pilot,
    .student-home-player-panel .student-home-kid-path__track,
    .student-home-player-panel .student-home-kid-path__mini > div
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-route-map,
    .student-home-kid-mission,
    .student-home-player-panel .student-home-kid-path__pilot,
    .student-home-player-panel .student-home-kid-path__track,
    .student-home-player-panel .student-home-kid-path__mini > div
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 26%,
    rgba(188, 198, 230, 0.18)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(19, 28, 48, 0.94) 82%,
      var(--student-theme-primary, #5a78ff) 18%
    ),
    #0a101eeb
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-kid-mission__fact,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-kid-mission__fact,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-kid-mission__fact {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 24%,
    rgba(188, 198, 230, 0.18)
  );
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(19, 28, 48, 0.92) 78%,
      var(--student-theme-primary, #5a78ff) 22%
    ),
    #0a101ee6
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(.student-home-route-map__head, .student-home-route-node__copy small),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(.student-home-route-map__head, .student-home-route-node__copy small),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(.student-home-route-map__head, .student-home-route-node__copy small) {
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-route-map__head strong,
    .student-home-route-node__copy strong
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-home-route-map__head strong,
    .student-home-route-node__copy strong
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-home-route-map__head strong,
    .student-home-route-node__copy strong
  ) {
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-home-route-node__dot,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-home-route-node__dot,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-home-route-node__dot {
  background: color-mix(
    in srgb,
    rgba(255, 255, 255, 0.14) 72%,
    var(--student-theme-primary, #5a78ff) 28%
  );
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(188, 198, 230, 0.2)
  );
}
@media (max-width: 1180px) {
  .student-home-game-stage {
    grid-template-columns: 1fr;
  }
  .student-home-player-panel {
    grid-template-columns: minmax(0, 0.8fr) minmax(280px, 1fr);
  }
}
@media (max-width: 1060px) {
  .student-home-kid-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 900px) {
  .student-home-game-console {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .student-home-game-console .student-home-kid-hero__copy h1 {
    max-width: none;
  }
  .student-home-kid-mission__facts,
  .student-home-player-panel {
    grid-template-columns: 1fr;
  }
  .student-home-kid-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .student-home-game-stage {
    gap: 10px;
  }
  .student-home-game-console {
    padding: 15px;
    border-radius: 23px;
  }
  .student-home-game-console .student-home-kid-hero__copy h1 {
    font-size: clamp(2rem, 8.4vw, 2.55rem);
    line-height: 1.1;
  }
  .student-home-game-console .student-home-kid-hero__copy p {
    max-width: none;
    font-size: 0.94rem;
  }
  .student-home-route-map {
    padding: 11px;
    border-radius: 18px;
    gap: 10px;
  }
  .student-home-route-map__head {
    font-size: 0.72rem;
  }
  .student-home-route-map__rail {
    left: 26px;
    right: 26px;
    top: 14px;
  }
  .student-home-route-node__dot {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    font-size: 0.9rem;
  }
  .student-home-route-node__copy strong {
    font-size: 0.7rem;
  }
  .student-home-route-node__copy small {
    display: none;
  }
  .student-home-kid-mission {
    padding: 13px;
    border-radius: 18px;
  }
  .student-home-kid-mission__facts {
    grid-template-columns: 1fr;
  }
  .student-home-kid-mission__copy h2 {
    font-size: clamp(1.38rem, 6vw, 1.72rem);
  }
  .student-home-player-panel {
    display: none;
  }
}
@media (max-width: 560px) {
  .mp-topbar--student-dashboard .mp-topbar__right,
  .mp-topbar--student-dashboard .mp-topbar__right--signed-in,
  .mp-topbar--student-dashboard .mp-topbar__right--signed-out {
    flex: 0 0 auto;
  }
  .student-home-kid-actions {
    grid-template-columns: 1fr;
  }
  .student-home-mode-tile {
    min-height: 0;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    padding: 10px;
    border-radius: 17px;
  }
  .student-home-mode-group {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .student-home-mode-group__actions,
  .student-home-kid-action__cta--split {
    grid-template-columns: 1fr;
  }
  .student-home-mode-tile .student-home-kid-action__icon {
    width: 38px;
    height: 38px;
    border-radius: 13px;
  }
  .student-home-mode-tile .student-home-kid-action__button {
    min-width: 74px;
  }
}
@media (max-width: 560px) {
  .mp-topbar--student-dashboard .mp-profile-trigger {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    flex: 0 0 44px;
  }
  .mp-topbar--student-dashboard .mp-profile-trigger__avatar {
    inline-size: 44px;
    block-size: 44px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    font-size: 0.92rem;
  }
  .student-home-game-console .student-home-kid-hero__topline {
    gap: 10px;
  }
  .student-home-game-console .student-home-kid-hero__greeting {
    font-size: 0.88rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .student-home-game-console .student-home-kid-chip {
    margin-inline-start: auto;
    flex: 0 0 auto;
    min-height: 30px;
    padding: 4px 9px;
    font-size: 0.7rem;
    letter-spacing: 0.045em;
    white-space: nowrap;
  }
  .student-home-game-console .student-home-kid-chip > span:first-child {
    width: 18px;
    height: 18px;
  }
}
@media (max-width: 400px) {
  .student-home-route-map__nodes {
    gap: 4px;
  }
  .student-home-route-node__copy strong {
    font-size: 0.64rem;
  }
}
.student-profile-page--player-setup .student-profile-form--surface {
  width: min(100%, 1160px);
}
.student-profile-page--player-setup {
  gap: clamp(18px, 2vw, 24px);
}
@media (min-width: 900px) {
  .student-profile-page--player-setup .student-profile-form--surface {
    min-height: 0;
    display: grid;
    gap: clamp(12px, 1.6vw, 18px);
  }
  .student-profile-page--player-setup .student-profile-layout--clean {
    min-height: 0;
    align-items: start;
    gap: clamp(16px, 1.8vw, 22px);
  }
  .student-profile-page--player-setup
    .student-profile-layout--clean
    :is(.student-profile-preview-card, .student-theme-preview-panel) {
    height: 100%;
    padding: clamp(24px, 2.2vw, 30px);
  }
  .student-profile-page--player-setup
    .student-profile-layout--clean
    .student-profile-preview-card {
    grid-template-rows: auto auto auto minmax(150px, 1fr);
    gap: clamp(16px, 1.8vw, 22px);
  }
  .student-profile-page--player-setup
    .student-profile-layout--clean
    .student-profile-preview-card__hero {
    min-height: 190px;
    align-items: stretch;
  }
  .student-profile-page--player-setup .student-profile-summary-grid {
    gap: 12px;
    align-content: start;
  }
  .student-profile-page--player-setup .student-profile-preview-card__progress {
    min-height: 150px;
    padding: 16px 18px 18px;
    align-content: space-between;
  }
  .student-profile-page--player-setup
    .student-profile-layout--clean
    .student-theme-preview-panel {
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: clamp(16px, 1.8vw, 22px);
  }
  .student-profile-page--player-setup .student-theme-scene {
    align-content: stretch;
  }
  .student-profile-page--player-setup .student-theme-scene__route {
    padding: 16px 14px 14px;
  }
  .student-profile-page--player-setup .student-theme-scene__mission {
    min-height: 150px;
    align-content: start;
  }
  .student-profile-page--player-setup .student-theme-preview-panel__stats {
    gap: 12px;
    align-self: end;
  }
}
.student-profile-preview-card--player {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 20%,
    rgba(27, 42, 68, 0.08)
  );
  background: linear-gradient(
    145deg,
    color-mix(
      in srgb,
      #ffffff 90%,
      var(--student-theme-secondary, #dce6ff) 10%
    ),
    #f7fafff0
  );
  box-shadow:
    0 22px 42px
      color-mix(
        in srgb,
        rgba(27, 42, 68, 0.1) 72%,
        var(--student-theme-primary, #5a78ff) 28%
      ),
    inset 0 1px #ffffffbd;
}
.student-profile-preview-card__ready {
  margin: 0;
  width: fit-content;
  max-width: 100%;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(27, 42, 68, 0.08)
    );
  background: #ffffffb8;
  color: var(--student-theme-strong, #274694);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.15;
}
.student-profile-preview-card__context {
  margin: -2px 0 0;
  color: #1b2a44bd;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.35;
}
.student-profile-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.student-profile-summary-card {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 16%,
      rgba(27, 42, 68, 0.08)
    );
  background: linear-gradient(
    180deg,
    #fffc,
    color-mix(
      in srgb,
      rgba(255, 255, 255, 0.86) 84%,
      var(--student-theme-secondary, #dce6ff) 16%
    )
  );
  box-shadow: inset 0 1px #ffffffb3;
}
.student-profile-summary-card span {
  color: #1b2a44ad;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.15;
  text-transform: uppercase;
}
.student-profile-summary-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--student-theme-strong, #274694);
  font-size: 1rem;
  line-height: 1.15;
}
.student-profile-summary-card small {
  color: #1b2a44b8;
  font-size: 0.84rem;
  line-height: 1.3;
}
.student-profile-command-strip,
.student-theme-command-preview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.student-profile-command-token,
.student-theme-command-tile {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 11px 12px;
  border-radius: 16px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 16%,
      rgba(27, 42, 68, 0.08)
    );
  background: linear-gradient(
    180deg,
    #ffffffc7,
    color-mix(
      in srgb,
      rgba(255, 255, 255, 0.82) 86%,
      var(--student-theme-secondary, #dce6ff) 14%
    )
  );
  box-shadow: inset 0 1px #ffffffb3;
}
.student-profile-command-token small,
.student-theme-command-tile span {
  color: #1b2a44ad;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.15;
  text-transform: uppercase;
}
.student-profile-command-token strong,
.student-theme-command-tile strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--student-theme-strong, #274694);
  font-size: 0.96rem;
  line-height: 1.15;
}
.student-theme-scene {
  display: grid;
  gap: 12px;
}
.student-theme-scene__route,
.student-theme-scene__mission {
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 16%,
      rgba(27, 42, 68, 0.08)
    );
  background: linear-gradient(
    180deg,
    #fffc,
    color-mix(
      in srgb,
      rgba(255, 255, 255, 0.86) 84%,
      var(--student-theme-secondary, #dce6ff) 16%
    )
  );
  box-shadow: inset 0 1px #ffffffb3;
}
.student-theme-scene__route {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 14px 12px 12px;
  border-radius: 20px;
}
.student-theme-scene__line {
  position: absolute;
  left: 44px;
  right: 44px;
  top: 33px;
  height: 4px;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 22%,
    rgba(27, 42, 68, 0.1)
  );
}
.student-theme-scene__step {
  position: relative;
  z-index: 1;
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 6px;
  text-align: center;
}
.student-theme-scene__dot {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      rgba(27, 42, 68, 0.08)
    );
  background: #ffffffeb;
  box-shadow: 0 10px 22px
    color-mix(
      in srgb,
      rgba(27, 42, 68, 0.08) 72%,
      var(--student-theme-primary, #5a78ff) 28%
    );
  font-size: 1rem;
}
.student-theme-scene__step--active .student-theme-scene__dot,
.student-theme-scene__step--current .student-theme-scene__dot {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(27, 42, 68, 0.08)
  );
  background: color-mix(
    in srgb,
    rgba(255, 255, 255, 0.88) 54%,
    var(--student-theme-secondary, #dce6ff) 46%
  );
}
.student-theme-scene__step strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text-strong);
  font-size: 0.82rem;
  line-height: 1.15;
}
.student-theme-scene__step small {
  color: #1b2a44ad;
  font-size: 0.72rem;
  line-height: 1.25;
}
.student-theme-scene__mission {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-radius: 20px;
}
.student-theme-scene__mission strong {
  color: var(--text-strong);
  font-size: 1.16rem;
  line-height: 1.15;
}
.student-theme-scene__mission p {
  margin: 0;
  color: #1b2a44bd;
  font-size: 0.92rem;
  line-height: 1.4;
}
.student-theme-scene__cta {
  width: fit-content;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--student-theme-primary, #5a78ff);
  color: #fff;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1;
}
.student-theme-mode-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 16%,
      rgba(27, 42, 68, 0.08)
    );
  background: #ffffffa8;
}
.student-theme-mode-preview span {
  min-width: 0;
  color: #1b2a44c2;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.25;
}
.student-theme-mode-preview strong {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--student-theme-primary, #5a78ff);
  color: #fff;
  font-size: 0.86rem;
  line-height: 1;
}
.student-profile-command-strip--modal {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.student-profile-preview-card--modal .student-profile-preview-card__ready {
  display: inline-flex;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token,
    .student-theme-command-tile,
    .student-theme-mode-preview,
    .student-profile-preview-card__ready,
    .student-profile-summary-card,
    .student-theme-scene__route,
    .student-theme-scene__mission
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token,
    .student-theme-command-tile,
    .student-theme-mode-preview,
    .student-profile-preview-card__ready,
    .student-profile-summary-card,
    .student-theme-scene__route,
    .student-theme-scene__mission
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token,
    .student-theme-command-tile,
    .student-theme-mode-preview,
    .student-profile-preview-card__ready,
    .student-profile-summary-card,
    .student-theme-scene__route,
    .student-theme-scene__mission
  ) {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 28%,
    rgba(188, 198, 230, 0.16)
  );
  background: color-mix(
    in srgb,
    rgba(15, 23, 42, 0.88) 78%,
    var(--student-theme-primary, #5a78ff) 22%
  );
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token small,
    .student-theme-command-tile span,
    .student-theme-mode-preview span,
    .student-profile-summary-card span,
    .student-profile-summary-card small,
    .student-theme-scene__step small,
    .student-theme-scene__mission p,
    .student-profile-preview-card__context
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token small,
    .student-theme-command-tile span,
    .student-theme-mode-preview span,
    .student-profile-summary-card span,
    .student-profile-summary-card small,
    .student-theme-scene__step small,
    .student-theme-scene__mission p,
    .student-profile-preview-card__context
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token small,
    .student-theme-command-tile span,
    .student-theme-mode-preview span,
    .student-profile-summary-card span,
    .student-profile-summary-card small,
    .student-theme-scene__step small,
    .student-theme-scene__mission p,
    .student-profile-preview-card__context
  ) {
  color: var(--student-theme-dark-muted);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token strong,
    .student-theme-command-tile strong,
    .student-profile-preview-card__ready,
    .student-profile-summary-card strong,
    .student-theme-scene__step strong,
    .student-theme-scene__mission strong
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token strong,
    .student-theme-command-tile strong,
    .student-profile-preview-card__ready,
    .student-profile-summary-card strong,
    .student-theme-scene__step strong,
    .student-theme-scene__mission strong
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-profile-command-token strong,
    .student-theme-command-tile strong,
    .student-profile-preview-card__ready,
    .student-profile-summary-card strong,
    .student-theme-scene__step strong,
    .student-theme-scene__mission strong
  ) {
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-theme-scene__dot,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-theme-scene__dot,
body.theme-dark .student-shell[data-learner-theme] .student-theme-scene__dot {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 32%,
    rgba(188, 198, 230, 0.16)
  );
  background: color-mix(
    in srgb,
    rgba(255, 255, 255, 0.1) 54%,
    var(--student-theme-primary, #5a78ff) 46%
  );
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-theme-scene__line,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-theme-scene__line,
body.theme-dark .student-shell[data-learner-theme] .student-theme-scene__line {
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 34%,
    rgba(188, 198, 230, 0.16)
  );
}
@media (max-width: 1080px) {
  .student-profile-command-strip,
  .student-theme-command-preview,
  .student-profile-summary-grid,
  .student-theme-scene__route {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-theme-scene__line {
    display: none;
  }
}
@media (max-width: 720px) {
  .student-profile-page--player-setup {
    gap: 12px;
  }
  .student-profile-page--player-setup
    .student-profile-layout--clean
    .student-profile-preview-card {
    padding: 16px;
    border-radius: 24px;
  }
  .student-profile-page--player-setup
    .student-profile-layout--clean
    .student-profile-preview-card__avatar {
    width: 112px;
    justify-self: start;
  }
  .student-profile-command-strip,
  .student-theme-command-preview,
  .student-profile-command-strip--modal,
  .student-profile-summary-grid,
  .student-theme-scene__route {
    grid-template-columns: 1fr;
  }
  .student-profile-command-token,
  .student-theme-command-tile {
    grid-template-columns: minmax(70px, 0.34fr) minmax(0, 1fr);
    align-items: center;
    padding: 10px;
  }
  .student-theme-mode-preview {
    align-items: stretch;
    flex-direction: column;
  }
  .student-theme-mode-preview strong {
    align-self: flex-start;
  }
}
@media (max-width: 520px) {
  .student-profile-page--player-setup .student-profile-preview-card__copy h2 {
    font-size: 1.68rem;
    line-height: 1.18;
  }
  .student-profile-page--player-setup .student-profile-preview-card__chips {
    gap: 6px;
  }
}
.student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .student-section-hero--action-first,
.student-shell[data-learner-theme] .student-live-queue-card,
.student-shell[data-learner-theme] .student-game-hub-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 16%,
    rgba(27, 42, 68, 0.08)
  );
}
.student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .student-practice-start-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 14%,
    var(--practice-border-strong) 86%
  );
}
@media (max-width: 720px) {
  .portal-puzzle-focus__summary-head {
    align-items: stretch;
  }
  .portal-puzzle-focus__summary-badge {
    width: fit-content;
    max-width: 100%;
  }
  .portal-puzzle-focus__summary-grid {
    grid-template-columns: 1fr;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-section-hero--action-first {
    padding: 16px;
    border-radius: 22px;
    gap: 10px;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-section-hero__copy--action-first
    h1 {
    font-size: clamp(1.78rem, 8vw, 2.2rem);
    line-height: 1.08;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-section-hero__copy--action-first
    p {
    max-width: none;
    font-size: 0.9rem;
    line-height: 1.35;
  }
  .student-practice-page--ux-refresh .student-section-hero__metrics--status-row,
  .student-game-hub-page:not(.student-home-page)
    .student-section-hero__metrics--status-row {
    display: none;
  }
  .student-game-hub-page:not(.student-home-page) .student-game-hub-stack {
    gap: 10px;
  }
  .student-game-hub-page:not(.student-home-page) .student-game-hub-card {
    padding: 12px;
    border-radius: 22px;
  }
  .student-game-hub-page:not(.student-home-page) .student-practice-start-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .student-game-hub-page:not(.student-home-page) .student-practice-start-card {
    min-height: 0;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    padding: 10px 12px;
    border-radius: 18px;
    gap: 8px;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card:after {
    display: none;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card:before {
    inset: 8px auto auto 8px;
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card__visual {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card__copy {
    grid-column: 2;
    grid-row: 1;
    gap: 3px;
    align-self: center;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card__title {
    font-size: 0.96rem;
    line-height: 1.15;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card__detail {
    font-size: 0.8rem;
    line-height: 1.26;
    max-height: none;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    white-space: normal;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-practice-start-card__cta {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    width: auto;
    min-width: 70px;
    min-height: 44px;
    justify-content: center;
    margin-top: 0;
    padding: 0 12px;
    border-radius: 15px;
    align-self: center;
  }
}
@media (max-width: 420px) {
  .mp-topbar--student-dashboard .mp-topbar__status-chip--tasks,
  .mp-topbar--student-dashboard .mp-topbar__status-chip--points {
    display: none;
  }
  .student-game-hub-page:not(.student-home-page) .student-practice-start-card {
    grid-template-columns: 40px minmax(0, 1fr);
  }
}
.student-shell[data-learner-theme] .student-competition-header-card,
.student-shell[data-learner-theme] .student-competition-scoreboard-card,
.student-shell[data-learner-theme] .student-competition-launch-card,
.student-shell[data-learner-theme] .student-sats-featured-card,
.student-shell[data-learner-theme] .student-sats-archive-card {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 16%,
    var(--line-default) 84%
  );
}
.student-competition-header__copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.student-competition-header__copy .eyebrow {
  width: max-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid
    color-mix(
      in srgb,
      var(--student-theme-primary, #5a78ff) 18%,
      var(--line-default) 82%
    );
  background: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 8%,
    var(--bg-panel) 92%
  );
  color: var(--text-strong);
}
.student-competition-header__main h1 {
  letter-spacing: 0;
}
.student-competition-header__copy p {
  margin: 0;
  max-width: 42ch;
  line-height: 1.35;
}
.student-competition-launch-grid__label h2 {
  letter-spacing: 0;
}
.theme-dark .student-competition-header__copy .eyebrow,
.theme-dark .student-competition-header__metric,
.theme-dark .student-sats-archive-completed-summary__value {
  border-color: #e2ebff29;
  background: #ffffff0f;
  color: var(--text-strong);
}
@media (max-width: 720px) {
  .student-competition-page--v18-8-57 .student-competition-header-card,
  .student-competition-page--v18-8-57 .student-competition-scoreboard-card,
  .student-competition-page--v18-8-57 .student-competition-launch-card,
  .student-sats-page .student-card {
    border-radius: 22px;
  }
  .student-competition-header-card,
  .student-competition-scoreboard-card,
  .student-competition-launch-card {
    padding: 12px;
  }
  .student-competition-header__main {
    align-items: flex-start;
    gap: 8px;
  }
  .student-competition-header__main h1 {
    font-size: clamp(1.78rem, 8vw, 2.18rem);
    line-height: 1.06;
  }
  .student-competition-header__metrics {
    display: none;
  }
  .student-competition-page--v18-8-57 .student-competition-header__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
    width: 100%;
    justify-items: stretch;
  }
  .student-competition-page--v18-8-57
    .student-competition-header__actions
    .student-competition-storage-mode {
    grid-column: 1 / -1;
    min-width: 0;
    max-width: none;
    width: 100%;
    padding: 8px 10px;
    gap: 5px;
  }
  .student-competition-page--v18-8-57
    .student-competition-storage-mode__detail {
    display: none;
  }
  .student-competition-page--v18-8-57
    .student-competition-header__actions
    .btn {
    justify-self: stretch;
    width: 100%;
    min-height: 44px;
  }
  .student-competition-page--v18-8-57 .student-competition-launch-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid__label--play,
  .student-competition-page--v18-8-57
    .student-competition-launch-grid__label--custom {
    grid-column: 1 / -1;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid__label--custom {
    display: none;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card {
    min-height: 106px;
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    align-items: center;
    padding: 10px;
    border-radius: 18px;
    gap: 7px 8px;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card:after {
    display: none;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card__visual {
    grid-column: 1;
    grid-row: 1;
    width: 34px;
    height: 34px;
    align-self: center;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card__copy {
    grid-column: 2;
    grid-row: 1;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card__cta {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    justify-content: center;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin-top: 0;
    padding-inline: 10px;
  }
  .student-sats-page .student-section-hero--action-first {
    padding: 16px;
    border-radius: 22px;
  }
  .student-sats-page .student-section-hero__metrics--status-row {
    display: none;
  }
  .student-sats-page .student-section-hero__header {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .student-sats-page .student-section-hero__actions-row--header {
    justify-content: flex-start;
  }
  .student-sats-page .student-sats-hub__utility {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
  }
  .student-sats-page .student-sats-hub__metrics {
    display: none;
  }
  .student-sats-page
    .student-sats-hub__utility-action
    .student-official-licence-trigger {
    height: auto;
    min-height: 42px;
  }
  .student-sats-page .student-sats-featured-card,
  .student-sats-page .student-sats-continue-card,
  .student-sats-page .student-sats-paper-row,
  .student-sats-page .student-sats-resource-buttons {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 420px) {
  .student-competition-launch-note .muted.small {
    display: none;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card {
    grid-template-columns: 32px minmax(0, 1fr);
    grid-template-rows: auto auto;
    min-height: 102px;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card__visual {
    width: 32px;
    height: 32px;
  }
  .student-competition-page--v18-8-57
    .student-competition-launch-grid
    .student-practice-start-card__cta {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    width: 100%;
    min-width: 0;
    min-height: 44px;
  }
}
@media (min-width: 821px) and (max-width: 1180px) {
  .student-game-hub-card .student-practice-start-grid,
  .student-practice-page--ux-refresh .student-practice-start-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-game-hub-card
    .student-practice-start-grid
    > :nth-child(odd):last-child,
  .student-practice-page--ux-refresh
    .student-practice-start-grid
    > :nth-child(odd):last-child {
    grid-column: 1 / -1;
  }
  .portal-public .mp-public-auth-layout {
    gap: 0.95rem;
  }
  .portal-public .mp-public-auth-panel,
  .portal-public .mp-public-auth-aside {
    padding: 1rem;
  }
}
@media (min-width: 961px) and (max-width: 1450px) {
  .portal-adult .adult-home-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-adult .adult-home-board > .adult-home-board-card:nth-child(3) {
    grid-column: 1 / -1;
  }
  .portal-adult .adult-home-board .adult-home-list-row {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
  .portal-adult .adult-home-board .adult-home-list-row__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px 10px;
    min-width: 0;
    text-align: right;
  }
  .portal-adult .adult-home-board .adult-home-list-row__meta > .btn {
    margin-inline-start: auto;
  }
}
@media (min-width: 761px) and (max-width: 1366px) {
  .portal-adult
    .adult-class-workspace--assignment-board
    .adult-class-workspace__selectors,
  .portal-adult
    .adult-class-workspace--insight-board
    .adult-class-workspace__selectors {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (orientation: landscape) and (min-width: 961px) and (max-width: 1180px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    ),
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    ) {
    --runner-shell-max-width: 1180px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 340px);
    gap: 14px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2 {
    position: sticky;
    top: 82px;
    gap: 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2 {
    gap: 8px;
    padding: 10px;
    border-radius: 18px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .runner-keyboard,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .runner-keyboard-row,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-actions-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .runner-keyboard,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .runner-keyboard-row,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-actions-v2 {
    gap: 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-actions-v2
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-actions-v2
    .btn {
    min-height: 44px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn[data-runner-key="enter"],
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-command-button-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-rail-card-v2--keyboard
    .btn[data-runner-key="enter"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-response-zone-v2
    .runner-command-button-v2 {
    min-height: 48px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--mode-selection-grid,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--mode-selection-grid {
    min-height: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--mode-diagram-fixed-frame {
    min-height: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="standard"]:not(
      [data-runner-form-factor="touch-stack"]
    )
    .runner-question-card-v2.runner-question-panel--mode-diagram-interactive-grid {
    min-height: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-panel-width: min(100%, 64rem);
    --runner-competition-keypad-gap: 10px;
    --runner-competition-keypad-padding: 12px 12px 14px;
    --runner-competition-keypad-radius: 20px;
    --runner-competition-keypad-btn-min: clamp(74px, 9.2vh, 92px);
    --runner-competition-keypad-enter-min: clamp(78px, 9.8vh, 98px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    grid-template-rows: minmax(9rem, 0.34fr) minmax(0, 1fr);
    gap: 8px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2 {
    padding-block: 8px 10px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2
    .runner-prompt__main {
    font-size: clamp(3rem, 5.4vw, 4.35rem);
  }
  .student-page-content--sudoku-focus,
  .student-sudoku-focus-page,
  .student-page-content--portal-puzzle-focus,
  .student-portal-puzzle-focus-page,
  .student-sudoku-game__head {
    gap: 10px;
  }
  .student-sudoku-board-shell {
    grid-template-columns: minmax(0, 1.08fr) minmax(280px, 320px);
    gap: 12px;
  }
  .student-sudoku-board-shell[data-sudoku-size="4"] {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
  }
  .student-sudoku-board {
    width: var(--sudoku-board-fit, min(100%, 680px));
  }
  .student-sudoku-console--play {
    gap: 10px;
  }
  .student-sudoku-console__card {
    padding: 12px;
  }
  .portal-puzzle-focus__layout {
    grid-template-columns: minmax(0, 1.18fr) minmax(220px, 0.82fr);
    gap: 12px;
  }
  .portal-puzzle-focus__surface {
    gap: 8px;
    align-content: start;
    overflow: visible;
  }
}
@media (min-width: 821px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-panel-width: min(100%, 62rem);
    --runner-competition-keypad-gap: 10px;
    --runner-competition-keypad-padding: 10px 10px 12px;
    --runner-competition-keypad-radius: 22px;
    --runner-competition-keypad-btn-min: clamp(68px, 7.8vh, 82px);
    --runner-competition-keypad-enter-min: clamp(72px, 8.6vh, 90px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    > .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    > .runner-stage-v2 {
    grid-row: 1 / -1;
    min-height: 0;
    height: 100%;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    grid-template-rows: minmax(9rem, 0.28fr) minmax(0, 0.72fr);
    gap: 10px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2 {
    padding-block: 4px 6px;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2
    .runner-prompt__main,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-question-card-v2
    .runner-prompt__main {
    font-size: clamp(3rem, 5.4vw, 4.35rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-response-zone-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stack-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-response-zone-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stack-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-wrap-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-wrap,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard {
    height: 100%;
    min-height: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2 {
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 0;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-stage-v2 {
    gap: 10px;
    align-content: stretch;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-field
    input,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    [data-answer-input] {
    min-height: clamp(64px, 7.2vh, 76px);
    font-size: clamp(1.18rem, 1.7vw, 1.42rem);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard {
    grid-template-rows: repeat(
      4,
      minmax(var(--runner-competition-keypad-btn-min), 1fr)
    );
    grid-auto-rows: minmax(var(--runner-competition-keypad-btn-min), 1fr);
    align-content: stretch;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row {
    min-height: 0;
    height: 100%;
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row
    .btn,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-answer-tools-v2
    .runner-keyboard-row
    .btn {
    height: 100%;
    min-height: var(--runner-competition-keypad-btn-min);
  }
  .student-sudoku-focus-page {
    width: min(100%, 1640px);
  }
  .student-sudoku-board-shell {
    grid-template-columns: minmax(0, 1.3fr) minmax(
        320px,
        clamp(320px, 25vw, 400px)
      );
    gap: clamp(16px, 2vw, 26px);
  }
  .student-sudoku-board-shell[data-sudoku-size="4"] {
    grid-template-columns: minmax(0, 1fr) minmax(
        360px,
        clamp(360px, 29vw, 460px)
      );
  }
  .student-sudoku-board {
    width: var(--sudoku-board-fit, min(100%, var(--sudoku-board-max, 760px)));
  }
  .student-sudoku-console__card {
    padding: 14px;
  }
  .student-sudoku-number {
    min-height: clamp(64px, 5.6vw, 84px);
    border-radius: 16px;
    font-size: clamp(1.12rem, 1.45vw, 1.26rem);
  }
  .student-sudoku-board-shell[data-sudoku-size="4"] .student-sudoku-number {
    min-height: clamp(46px, 5.8vw, 64px);
    border-radius: 14px;
    font-size: clamp(1.05rem, 1.4vw, 1.18rem);
  }
  .student-sudoku-console--play {
    align-self: start;
  }
  .student-portal-puzzle-focus-page {
    width: min(100%, 1600px);
  }
  .portal-puzzle-focus__layout {
    grid-template-columns: minmax(0, 1.36fr) minmax(320px, 0.64fr);
    gap: 20px;
  }
  .portal-puzzle-focus__surface {
    gap: 10px;
  }
  .portal-puzzle-codebreaker__current {
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
    gap: 12px;
  }
  .portal-puzzle-codebreaker__keys {
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
    gap: 12px;
  }
  .portal-puzzle-codebreaker__key {
    min-height: 62px;
  }
  .portal-puzzle-tangram__svg {
    max-width: 780px;
  }
}
@media (min-width: 821px) and (max-height: 760px) {
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"],
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"] {
    --runner-competition-panel-width: min(100%, 58rem);
    --runner-competition-keypad-btn-min: clamp(60px, 7.1vh, 72px);
    --runner-competition-keypad-enter-min: clamp(64px, 7.8vh, 78px);
  }
  .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2,
  .student-shell--focus-mode
    .student-page-content--runner
    .runner-shell-v2[data-session-kind="competition"][data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    grid-template-rows: minmax(8rem, 0.27fr) minmax(0, 0.73fr);
  }
}
@media (min-width: 821px) and (max-height: 900px) {
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__inner {
    min-height: 46px;
    padding: 4px 12px 6px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__brand
    img,
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .topbar-brand-image {
    height: 24px;
    max-height: 24px;
    max-width: min(148px, 100%);
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-runner-topbar-slot {
    gap: 8px;
  }
  .student-page-content--sudoku-focus,
  .student-sudoku-focus-page {
    gap: 8px;
  }
  .student-sudoku-game,
  .student-sudoku-game__head {
    gap: 10px;
  }
  .student-sudoku-game-card {
    padding: 12px;
  }
}
@media (orientation: landscape) and (min-width: 961px) and (max-width: 1180px) {
  .student-sudoku-board-shell {
    grid-template-columns: minmax(0, 1.22fr) minmax(300px, 360px);
    gap: 16px;
  }
  .student-sudoku-board-shell[data-sudoku-size="4"] {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 400px);
  }
  .student-sudoku-board {
    width: var(--sudoku-board-fit, min(100%, 760px));
  }
}
.student-game-hub-utility-row {
  display: flex;
  justify-content: flex-start;
  margin: 0 0 10px;
}
.student-game-hub-utility-row .btn {
  min-height: 44px;
}
.portal-puzzle-variant-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.portal-puzzle-variant-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-radius: 24px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 48%, transparent),
      transparent 52%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 97%, white 3%),
      color-mix(in srgb, var(--bg-panel) 92%, var(--brand-50) 8%)
    );
  text-decoration: none;
  color: inherit;
  box-shadow: 0 16px 30px #14203314;
  transition:
    transform 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease;
}
.portal-puzzle-variant-card:hover,
.portal-puzzle-variant-card:focus-visible,
.portal-puzzle-variant-card.is-active {
  transform: translateY(-2px);
  border-color: color-mix(
    in srgb,
    var(--brand-500) 32%,
    var(--line-default) 68%
  );
  box-shadow: 0 20px 34px #1420331f;
}
.portal-puzzle-variant-card__preview {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.portal-puzzle-variant-card__token {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 16px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
}
.portal-puzzle-variant-card__detail,
.portal-puzzle-variant-card__meta {
  color: var(--text-soft);
  font-size: 0.88rem;
  line-height: 1.35;
}
.student-portal-puzzle-game-card {
  padding: clamp(14px, 1.8vw, 22px);
  border-radius: 28px;
}
.portal-puzzle-focus {
  gap: 16px;
}
.portal-puzzle-focus__head {
  display: grid;
  gap: 12px;
}
.portal-puzzle-focus__title-line {
  padding: 14px 18px;
  border-radius: 20px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 32%, transparent),
      transparent 56%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 98%, white 2%),
      color-mix(in srgb, var(--bg-panel) 90%, var(--brand-50) 10%)
    );
  color: var(--text-strong);
  font-size: clamp(0.88rem, 1vw, 1rem);
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.35;
}
.portal-puzzle-focus__actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
.portal-puzzle-focus__actions .btn {
  min-width: 0;
  min-height: 42px;
  justify-content: center;
}
.portal-puzzle-focus__surface {
  display: grid;
  gap: 12px;
  min-width: 0;
  overflow: visible;
}
.portal-puzzle-focus__summary {
  display: grid;
  gap: 10px;
}
.portal-puzzle-focus__summary-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.portal-puzzle-focus__summary-title {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.portal-puzzle-focus__summary-title strong {
  font-size: clamp(1rem, 1.18vw, 1.16rem);
  line-height: 1.15;
  color: var(--text-strong);
}
.portal-puzzle-focus__summary-title span {
  color: var(--text-soft);
  font-size: 0.9rem;
  line-height: 1.36;
}
.portal-puzzle-focus__summary-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background: color-mix(in srgb, var(--brand-50) 68%, white 32%);
  color: var(--brand-700);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.1;
}
.portal-puzzle-focus__summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.portal-puzzle-focus__summary-card,
.portal-puzzle-focus__summary-note {
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 24%, transparent),
      transparent 58%
    ),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%);
}
.portal-puzzle-focus__summary-card {
  display: grid;
  gap: 4px;
}
.portal-puzzle-focus__summary-card span {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.portal-puzzle-focus__summary-card strong {
  font-size: clamp(0.98rem, 1.1vw, 1.08rem);
  line-height: 1.2;
  color: var(--text-strong);
}
.portal-puzzle-focus__summary-note {
  color: var(--text-soft);
  font-size: 0.9rem;
  line-height: 1.42;
}
.student-sudoku-status.is-alert {
  border-color: color-mix(
    in srgb,
    var(--warning-500) 38%,
    var(--line-default) 62%
  );
  background: color-mix(in srgb, var(--warning-100) 78%, white 22%);
  color: color-mix(in srgb, var(--warning-900) 74%, var(--text-strong) 26%);
}
.student-sudoku-status.is-complete {
  border-color: color-mix(
    in srgb,
    var(--success-500) 34%,
    var(--line-default) 66%
  );
  background: color-mix(in srgb, var(--success-100) 78%, white 22%);
  color: color-mix(in srgb, var(--success-900) 72%, var(--text-strong) 28%);
}
.portal-puzzle-codebreaker {
  display: grid;
  gap: 14px;
}
.portal-puzzle-codebreaker__secret-row,
.portal-puzzle-codebreaker__row {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 92px;
  gap: 10px;
  align-items: center;
}
.portal-puzzle-codebreaker__secret-row {
  padding: 10px 12px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 38%, var(--bg-panel) 62%),
    color-mix(in srgb, var(--bg-panel) 95%, white 5%)
  );
}
.portal-puzzle-codebreaker__secret-meta {
  display: flex;
  justify-content: flex-end;
  color: var(--text-soft);
  font-size: 0.82rem;
  font-weight: 700;
}
.portal-puzzle-codebreaker__board {
  display: grid;
  gap: 6px;
  padding-right: 0;
  max-height: none;
  overflow: visible;
}
.portal-puzzle-codebreaker__row {
  padding: 10px 12px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: color-mix(in srgb, var(--bg-panel) 97%, white 3%);
}
.portal-puzzle-codebreaker__row.is-active {
  border-color: color-mix(
    in srgb,
    var(--brand-500) 34%,
    var(--line-default) 66%
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 34%, transparent),
      transparent 60%
    ),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  box-shadow: 0 18px 28px #14203314;
}
.portal-puzzle-codebreaker__row.is-empty {
  opacity: 0.72;
}
.portal-puzzle-codebreaker__row-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 6px 10px;
  border-radius: 14px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  color: var(--text-soft);
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.portal-puzzle-codebreaker__guess {
  display: grid;
  grid-template-columns: repeat(var(--codebreaker-columns, 4), minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}
.portal-puzzle-codebreaker__slot {
  min-height: 58px;
  padding: 8px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.portal-puzzle-codebreaker__slot.is-secret {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 92%, var(--brand-50) 8%),
    color-mix(in srgb, var(--bg-panel) 98%, white 2%)
  );
}
.portal-puzzle-codebreaker__slot.is-secret:not(.is-revealed)
  .portal-puzzle-codebreaker-symbol__placeholder {
  opacity: 0.55;
}
.portal-puzzle-codebreaker__feedback {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  justify-self: stretch;
  align-content: center;
}
.portal-puzzle-codebreaker__peg {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--line-default) 82%, var(--brand-500) 18%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  justify-self: center;
}
.portal-puzzle-codebreaker__peg.is-exact {
  border-color: color-mix(
    in srgb,
    var(--success-500) 62%,
    var(--brand-500) 38%
  );
  background: color-mix(in srgb, var(--success-100) 76%, white 24%);
}
.portal-puzzle-codebreaker__peg.is-partial {
  border-color: color-mix(
    in srgb,
    var(--warning-500) 56%,
    var(--brand-500) 44%
  );
  background: color-mix(in srgb, var(--warning-100) 76%, white 24%);
}
.portal-puzzle-codebreaker__palette {
  display: grid;
  grid-template-columns: repeat(
    var(--codebreaker-palette-columns, 4),
    minmax(0, 1fr)
  );
  gap: 10px;
}
.portal-puzzle-codebreaker__key {
  min-height: 60px;
  justify-content: center;
}
.portal-puzzle-codebreaker__composer {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.portal-puzzle-codebreaker__composer .btn {
  min-height: 42px;
  justify-content: center;
}
.portal-puzzle-codebreaker-symbol {
  color: color-mix(in srgb, var(--brand-700) 72%, var(--text-strong) 28%);
}
.portal-puzzle-codebreaker-symbol__text {
  font-size: 1.12rem;
  font-weight: 900;
}
.portal-puzzle-codebreaker-symbol__swatch,
.portal-puzzle-codebreaker-symbol__svg {
  width: 24px;
  height: 24px;
}
.portal-puzzle-tangram {
  display: grid;
  gap: 14px;
}
.portal-puzzle-tangram__stage {
  padding: 10px;
  border-radius: 24px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 34%, transparent),
      transparent 56%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 98%, white 2%),
      color-mix(in srgb, var(--bg-panel) 92%, var(--brand-50) 8%)
    );
  box-shadow: 0 20px 34px #1420331a;
}
.portal-puzzle-tangram__svg {
  display: block;
  width: 100%;
  max-width: none;
  margin-inline: auto;
  border-radius: 20px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-50) 40%, var(--bg-panel) 60%),
    color-mix(in srgb, var(--bg-panel) 96%, white 4%)
  );
}
.portal-puzzle-tangram__target-fill {
  fill: color-mix(in srgb, var(--brand-100) 32%, transparent);
}
.portal-puzzle-tangram__target-outline {
  fill: none;
  stroke: color-mix(in srgb, var(--brand-700) 52%, var(--line-default) 48%);
  stroke-width: 4;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.portal-puzzle-tangram__piece {
  --portal-tangram-piece-stroke-width: 2.8;
  fill: color-mix(in srgb, var(--brand-500) 68%, white 32%);
  stroke: color-mix(in srgb, var(--brand-900) 56%, var(--brand-500) 44%);
  stroke-width: var(--portal-tangram-piece-stroke-width);
  cursor: grab;
  filter: drop-shadow(0 8px 12px rgba(20, 32, 51, 0.14));
  will-change: transform;
  transition:
    stroke 0.16s ease,
    filter 0.16s ease,
    opacity 0.16s ease;
}
.portal-puzzle-tangram__piece:nth-child(2n) {
  fill: color-mix(in srgb, var(--warning-100) 78%, var(--brand-100) 22%);
}
.portal-puzzle-tangram__piece:nth-child(3n) {
  fill: color-mix(in srgb, var(--success-100) 76%, var(--brand-100) 24%);
}
.portal-puzzle-tangram__piece.is-selected {
  stroke: color-mix(in srgb, var(--brand-700) 72%, white 28%);
  stroke-width: var(--portal-tangram-piece-stroke-width);
  filter: drop-shadow(0 0 10px rgba(90, 120, 255, 0.18))
    drop-shadow(0 8px 12px rgba(20, 32, 51, 0.14));
}
.portal-puzzle-tangram__piece.is-dragging {
  cursor: grabbing;
  filter: none;
}
.portal-puzzle-tangram__meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  flex-wrap: wrap;
  color: var(--text-soft);
  font-size: 0.9rem;
}
.portal-puzzle-tangram__controls {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.portal-puzzle-tangram__controls .btn {
  min-width: 0;
  min-height: 42px;
  justify-content: center;
}
.student-portal-puzzle-focus-page .portal-puzzle-inline-note {
  display: block;
}
@media (max-width: 1180px) {
  .portal-puzzle-variant-grid,
  .portal-puzzle-focus__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px) {
  .student-game-hub-utility-row {
    margin-bottom: 8px;
  }
  .portal-puzzle-focus__title-line {
    padding: 12px 14px;
    font-size: 0.84rem;
  }
  .portal-puzzle-codebreaker__secret-row,
  .portal-puzzle-codebreaker__row {
    grid-template-columns: 46px minmax(0, 1fr) 72px;
    gap: 8px;
  }
  .portal-puzzle-codebreaker__slot {
    min-height: 50px;
    padding: 6px;
    border-radius: 15px;
  }
  .portal-puzzle-codebreaker__peg {
    width: 12px;
    height: 12px;
  }
  .portal-puzzle-tangram__controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .portal-puzzle-variant-grid {
    grid-template-columns: 1fr;
  }
  .portal-puzzle-focus__actions,
  .portal-puzzle-codebreaker__composer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-focus__actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-focus__actions
    .btn {
    min-height: 40px;
    padding-inline: 8px;
    font-size: 0.76rem;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__board {
    gap: 5px;
    max-height: none;
    overflow: visible;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__key {
    min-height: 52px;
  }
  .portal-puzzle-codebreaker__composer .btn:last-child {
    grid-column: 1 / -1;
  }
  .portal-puzzle-codebreaker__palette {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .portal-puzzle-codebreaker__legend {
    gap: 10px;
    font-size: 0.82rem;
  }
  .portal-puzzle-tangram__stage {
    padding: 8px;
  }
}
@media (max-width: 520px) {
  .portal-puzzle-focus__actions {
    grid-template-columns: 1fr 1fr;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-focus__title-line {
    padding: 10px 12px;
    font-size: 0.76rem;
    letter-spacing: 0.07em;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-focus__actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-focus__actions
    .btn {
    min-height: 38px;
    padding-inline: 6px;
    border-radius: 12px;
    font-size: 0.68rem;
  }
  .portal-puzzle-codebreaker__secret-row,
  .portal-puzzle-codebreaker__row {
    grid-template-columns: 40px minmax(0, 1fr) 58px;
    gap: 6px;
    padding: 8px 9px;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__secret-row,
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row {
    grid-template-columns: 34px minmax(0, 1fr) 46px;
    gap: 4px;
    padding: 6px 7px;
  }
  .portal-puzzle-codebreaker__row-label {
    min-height: 36px;
    padding: 4px 6px;
    font-size: 0.72rem;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row-label {
    min-height: 30px;
    padding: 3px 4px;
    font-size: 0.64rem;
    letter-spacing: 0.05em;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__slot {
    min-height: 42px;
    padding: 4px;
    border-radius: 13px;
  }
  .portal-puzzle-codebreaker__feedback {
    gap: 4px;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__feedback {
    gap: 3px;
  }
  .portal-puzzle-codebreaker__peg {
    width: 10px;
    height: 10px;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__peg {
    width: 8px;
    height: 8px;
  }
  .portal-puzzle-codebreaker__secret-meta {
    font-size: 0.72rem;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__secret-meta {
    font-size: 0.66rem;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__board {
    max-height: none;
    overflow: visible;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__key {
    min-height: 46px;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__text {
    font-size: 0.94rem;
  }
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__swatch,
  .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__svg {
    width: 18px;
    height: 18px;
  }
  .portal-puzzle-tangram__meta-row {
    font-size: 0.82rem;
  }
}
.mp-game-topbar-slot {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
}
.mp-game-topbar__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
}
.mp-game-topbar__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 34%, transparent),
      transparent 58%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 98%, white 2%),
      color-mix(in srgb, var(--bg-panel) 93%, var(--brand-50) 7%)
    );
  color: var(--text-strong);
  text-decoration: none;
  font-size: 0.84rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  transition:
    transform 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease,
    opacity 0.14s ease;
  white-space: nowrap;
}
.mp-game-topbar__action:hover,
.mp-game-topbar__action:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(
    in srgb,
    var(--brand-500) 34%,
    var(--line-default) 66%
  );
  box-shadow: 0 12px 22px #1420331f;
}
.mp-game-topbar__action:disabled,
.mp-game-topbar__action[aria-disabled="true"] {
  opacity: 0.42;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.mp-game-topbar__action-icon,
.mp-game-topbar__action-icon svg {
  width: 18px;
  height: 18px;
  display: block;
  flex: 0 0 auto;
}
.mp-game-topbar__timer {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: color-mix(in srgb, var(--bg-panel) 96%, white 4%);
  color: var(--text-strong);
  font-size: 0.84rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.portal-puzzle-variant-card__token--glyph {
  color: color-mix(in srgb, var(--brand-700) 72%, var(--warning-500) 28%);
}
.portal-puzzle-variant-card__token--glyph svg {
  width: 22px;
  height: 22px;
}
.portal-puzzle-variant-card__palette-preview {
  display: grid;
  grid-template-columns: repeat(4, 28px);
  gap: 8px;
}
.portal-puzzle-variant-card__palette-piece {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background: var(
    --portal-tangram-preview,
    color-mix(in srgb, var(--brand-500) 72%, white 28%)
  );
}
.portal-puzzle-variant-card__palette-piece.piece-a {
  --portal-tangram-preview: #5a78ff;
}
.portal-puzzle-variant-card__palette-piece.piece-b {
  --portal-tangram-preview: #ef9b5d;
}
.portal-puzzle-variant-card__palette-piece.piece-c {
  --portal-tangram-preview: #50b68e;
}
.portal-puzzle-variant-card__palette-piece.piece-d {
  --portal-tangram-preview: #d96cc6;
}
.portal-puzzle-variant-card__palette-preview.is-mono
  .portal-puzzle-variant-card__palette-piece.piece-a {
  --portal-tangram-preview: #3559df;
}
.portal-puzzle-variant-card__palette-preview.is-mono
  .portal-puzzle-variant-card__palette-piece.piece-b {
  --portal-tangram-preview: #5274eb;
}
.portal-puzzle-variant-card__palette-preview.is-mono
  .portal-puzzle-variant-card__palette-piece.piece-c {
  --portal-tangram-preview: #6f91f6;
}
.portal-puzzle-variant-card__palette-preview.is-mono
  .portal-puzzle-variant-card__palette-piece.piece-d {
  --portal-tangram-preview: #93b3ff;
}
.student-portal-puzzle-game-card {
  padding: clamp(10px, 1.4vw, 16px);
}
.portal-puzzle-focus {
  display: grid;
  gap: 10px;
}
.portal-puzzle-focus__surface {
  gap: 0;
}
.portal-puzzle-focus__title-line,
.portal-puzzle-focus__head,
.portal-puzzle-focus__actions,
.portal-puzzle-focus__console,
.portal-puzzle-focus__stats {
  display: none;
}
.student-portal-puzzle-focus-page .student-sudoku-status {
  margin-bottom: 2px;
}
.student-portal-puzzle-focus-page .portal-puzzle-inline-note {
  display: none;
}
.student-portal-puzzle-focus-page .portal-puzzle-codebreaker__board {
  max-height: none;
  overflow: visible;
  padding-right: 0;
}
.portal-puzzle-codebreaker {
  display: grid;
  gap: 10px;
}
.portal-puzzle-codebreaker__secret-row {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 28%, transparent),
      transparent 58%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 97%, white 3%),
      color-mix(in srgb, var(--bg-panel) 92%, var(--brand-50) 8%)
    );
}
.portal-puzzle-codebreaker__board {
  display: grid;
  gap: 6px;
}
.portal-puzzle-codebreaker__row {
  grid-template-columns: 34px minmax(0, 1fr) 58px;
  gap: 6px;
  align-items: center;
  padding: 4px 6px;
  border-radius: 12px;
}
.portal-puzzle-codebreaker__row-label {
  min-height: 32px;
  padding: 4px 6px;
  border-radius: 12px;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}
.portal-puzzle-codebreaker__guess {
  gap: 6px;
}
.portal-puzzle-codebreaker__slot {
  min-height: 36px;
  padding: 4px;
  border-radius: 12px;
}
.portal-puzzle-codebreaker__feedback {
  gap: 4px;
  justify-self: end;
}
.portal-puzzle-codebreaker__peg {
  width: 10px;
  height: 10px;
}
.portal-puzzle-codebreaker__controls {
  display: grid;
  gap: 10px;
}
.portal-puzzle-codebreaker__palette {
  gap: 8px;
}
.portal-puzzle-codebreaker__key {
  min-height: 52px;
  padding: 0;
  border-radius: 15px;
}
.portal-puzzle-codebreaker__composer {
  gap: 8px;
}
.portal-puzzle-codebreaker__composer .btn {
  min-height: 44px;
}
.portal-puzzle-codebreaker-symbol__text {
  font-size: clamp(1rem, 0.78rem + 0.54vw, 1.34rem);
}
.portal-puzzle-codebreaker-symbol__swatch,
.portal-puzzle-codebreaker-symbol__svg {
  width: clamp(20px, 1.4vw, 24px);
  height: clamp(20px, 1.4vw, 24px);
}
.portal-puzzle-tangram {
  display: grid;
  gap: 0;
}
.portal-puzzle-tangram__stage {
  position: relative;
  display: grid;
  align-items: start;
  justify-items: stretch;
  align-content: start;
  padding: clamp(8px, 1.2vw, 12px);
  border-radius: 24px;
}
.portal-puzzle-tangram__svg {
  width: 100%;
  max-width: none;
  aspect-ratio: 560 / 500;
  touch-action: none;
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-50) 48%, transparent),
      transparent 62%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 98%, white 2%),
      color-mix(in srgb, var(--bg-panel) 95%, var(--brand-50) 5%)
    );
}
.portal-puzzle-tangram__target-fill {
  fill: color-mix(in srgb, var(--brand-100) 26%, transparent);
}
.portal-puzzle-tangram__target-outline {
  stroke-width: 3.2;
}
.portal-puzzle-tangram__target-image {
  opacity: 0.18;
  image-rendering: auto;
  pointer-events: none;
}
.portal-puzzle-tangram__piece {
  --portal-tangram-piece-stroke-width: 2.6;
  stroke-width: var(--portal-tangram-piece-stroke-width);
  touch-action: none;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 1) {
  fill: #5a78ff;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 2) {
  fill: #8fa4ff;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 3) {
  fill: #efc785;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 4) {
  fill: #c7d7df;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 5) {
  fill: #7cb7a8;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 6) {
  fill: #d4b38d;
}
.portal-puzzle-tangram[data-palette="classic"]
  .portal-puzzle-tangram__piece:nth-child(7n + 7) {
  fill: #d9e9f1;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 1) {
  fill: #2d50d6;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 2) {
  fill: #4567e2;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 3) {
  fill: #5c7df0;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 4) {
  fill: #7a99fb;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 5) {
  fill: #92b0ff;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 6) {
  fill: #adc4ff;
}
.portal-puzzle-tangram[data-palette="mono"]
  .portal-puzzle-tangram__piece:nth-child(7n + 7) {
  fill: #c8d8ff;
}
.portal-puzzle-tangram__piece-tools {
  position: absolute;
  right: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 999px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  background: color-mix(in srgb, var(--bg-panel) 94%, white 6%);
  box-shadow: 0 12px 22px #14203324;
}
.portal-puzzle-tangram__tool {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 18%, var(--line-default) 82%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel) 98%, white 2%);
  color: var(--text-strong);
  font-size: 1rem;
  font-weight: 900;
}
.portal-puzzle-tangram__tool:hover,
.portal-puzzle-tangram__tool:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(
    in srgb,
    var(--brand-500) 34%,
    var(--line-default) 66%
  );
}
@media (min-width: 900px) {
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker {
    gap: 14px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__secret-row {
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 12px;
    padding: 12px 14px;
    border-radius: 20px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__board {
    gap: 5px;
    min-height: 0;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row {
    grid-template-columns: 50px minmax(0, 1fr) 84px;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 18px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row-label {
    min-height: 42px;
    padding: 6px 8px;
    font-size: 0.74rem;
    letter-spacing: 0.07em;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__slot {
    min-height: 52px;
    padding: 6px;
    border-radius: 16px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__feedback {
    gap: 5px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__peg {
    width: 11px;
    height: 11px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__secret-meta {
    font-size: 0.76rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__palette {
    gap: 10px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__key {
    min-height: 64px;
    border-radius: 18px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__composer {
    gap: 10px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__composer
    .btn {
    min-height: 50px;
    font-size: 0.9rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__text {
    font-size: 1.08rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    :is(
      .portal-puzzle-codebreaker-symbol__swatch,
      .portal-puzzle-codebreaker-symbol__svg
    ) {
    width: 22px;
    height: 22px;
  }
}
@media (min-width: 1400px) {
  .portal-puzzle-codebreaker__slot {
    min-height: 48px;
  }
  .portal-puzzle-codebreaker__key {
    min-height: 58px;
  }
}
@media (max-width: 820px) {
  .mp-game-topbar__action {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 14px;
  }
  .mp-game-topbar__action-label {
    display: none;
  }
  .mp-game-topbar__actions {
    gap: 6px;
    flex: 0 0 auto;
  }
  .mp-game-topbar__timer {
    min-height: 34px;
    padding-inline: 10px;
    font-size: 0.78rem;
    letter-spacing: 0.07em;
  }
  .portal-puzzle-codebreaker__secret-row {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 8px;
    padding: 7px 8px;
  }
  .portal-puzzle-codebreaker__row {
    grid-template-columns: 36px minmax(0, 1fr) 54px;
    gap: 6px;
    padding: 6px 7px;
  }
  .portal-puzzle-codebreaker__row-label {
    min-height: 28px;
    padding: 3px 4px;
    font-size: 0.64rem;
  }
  .portal-puzzle-codebreaker__slot {
    min-height: 38px;
    padding: 4px;
    border-radius: 12px;
  }
  .portal-puzzle-codebreaker__peg {
    width: 8px;
    height: 8px;
  }
  .portal-puzzle-codebreaker__key {
    min-height: 46px;
    border-radius: 13px;
  }
  .portal-puzzle-codebreaker__composer .btn {
    min-height: 44px;
    font-size: 0.8rem;
  }
  .portal-puzzle-tangram__piece-tools {
    right: 10px;
    bottom: 10px;
    gap: 6px;
    padding: 6px;
  }
  .portal-puzzle-tangram__tool {
    width: 44px;
    height: 44px;
  }
}
@media (max-width: 640px) {
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__brand
    img,
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .topbar-brand-image {
    max-width: min(118px, 100%);
    height: 22px;
    max-height: 22px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__left {
    gap: 8px;
  }
  .mp-game-topbar-slot {
    gap: 8px;
  }
  .mp-game-topbar__action {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
  }
  .mp-game-topbar__action-icon,
  .mp-game-topbar__action-icon svg {
    width: 16px;
    height: 16px;
  }
  .mp-game-topbar__timer {
    min-height: 32px;
    padding-inline: 8px;
    font-size: 0.72rem;
  }
  .portal-puzzle-codebreaker {
    gap: 8px;
  }
  .portal-puzzle-codebreaker__board {
    gap: 4px;
  }
  .portal-puzzle-codebreaker__secret-row {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 6px;
    padding: 6px;
  }
  .portal-puzzle-codebreaker__row {
    grid-template-columns: 28px minmax(0, 1fr) 38px;
    gap: 3px;
    padding: 3px 4px;
  }
  .portal-puzzle-codebreaker__slot {
    min-height: 28px;
    border-radius: 10px;
  }
  .portal-puzzle-codebreaker__palette {
    gap: 6px;
  }
  .portal-puzzle-codebreaker__key {
    min-height: 44px;
  }
  .portal-puzzle-codebreaker__composer {
    gap: 6px;
  }
  .portal-puzzle-codebreaker__composer .btn {
    min-height: 44px;
    padding-inline: 8px;
    font-size: 0.74rem;
  }
  .portal-puzzle-codebreaker-symbol__swatch,
  .portal-puzzle-codebreaker-symbol__svg {
    width: 16px;
    height: 16px;
  }
  .portal-puzzle-tangram__stage {
    padding: 6px;
  }
  .portal-puzzle-tangram__target-outline {
    stroke-width: 2.4;
  }
  .portal-puzzle-tangram__piece {
    --portal-tangram-piece-stroke-width: 2.2;
    stroke-width: var(--portal-tangram-piece-stroke-width);
  }
}
.student-portal-puzzle-focus-page
  .portal-puzzle-focus[data-game-id="codebreaker"]
  .portal-puzzle-codebreaker__board {
  max-height: none !important;
  overflow: visible !important;
}
@media (max-width: 640px) {
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker {
    gap: 6px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__secret-row {
    padding: 3px 4px;
    gap: 3px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__board {
    gap: 2px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row {
    grid-template-columns: 26px minmax(0, 1fr) 34px;
    gap: 3px;
    padding: 2px 4px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row-label {
    min-height: 22px;
    padding: 1px 3px;
    font-size: 0.58rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__slot {
    min-height: 25px;
    padding: 2px;
    border-radius: 9px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__peg {
    width: 6px;
    height: 6px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__key {
    min-height: 44px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__composer {
    gap: 4px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__composer
    .btn {
    min-height: 44px;
    padding-inline: 6px;
    font-size: 0.72rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__text {
    font-size: 0.88rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__swatch,
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker-symbol__svg {
    width: 16px;
    height: 16px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__legend {
    display: none;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__controls {
    gap: 6px;
  }
}
.student-portal-puzzle-focus-page .portal-puzzle-focus[data-game-id="tangram"] {
  --portal-tangram-stage-max-height: clamp(340px, calc(100dvh - 248px), 760px);
}
.student-portal-puzzle-focus-page
  .portal-puzzle-focus[data-game-id="tangram"]
  .portal-puzzle-tangram__svg {
  aspect-ratio: var(--portal-tangram-board-width, 560) /
    var(--portal-tangram-board-height, 500);
  width: min(
    100%,
    calc(
      var(--portal-tangram-stage-max-height) *
        var(--portal-tangram-board-width, 560) /
        var(--portal-tangram-board-height, 500)
    )
  );
  max-height: var(--portal-tangram-stage-max-height);
  height: auto;
  justify-self: center;
}
@media (max-width: 820px) {
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="tangram"] {
    --portal-tangram-stage-max-height: clamp(
      300px,
      calc(100dvh - 168px),
      760px
    );
  }
}
@media (min-width: 1181px) and (min-height: 820px) {
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="tangram"] {
    --portal-tangram-stage-max-height: clamp(
      360px,
      calc(100dvh - 276px),
      720px
    );
  }
}
@media (min-width: 1400px) and (min-height: 900px) {
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="tangram"] {
    --portal-tangram-stage-max-height: clamp(
      380px,
      calc(100dvh - 300px),
      700px
    );
  }
}
.student-hero-preview-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  height: 100%;
}
.student-hero-preview-gallery__card {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 12px;
  border-radius: 20px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 28%, transparent),
      transparent 58%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 98%, white 2%),
      color-mix(in srgb, var(--bg-panel) 94%, var(--brand-50) 6%)
    );
  box-shadow: inset 0 1px #ffffffb8;
}
.student-hero-preview-gallery__label {
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-soft);
}
.student-hero-preview-switcher__dot[data-games-preview-target="codebreaker"]:after {
  background: #6278ee7a;
}
.student-hero-preview-switcher__dot[data-games-preview-target="tangram"]:after {
  background: #6ea88d75;
}
.student-hero-preview-switcher__dot.is-active[data-games-preview-target="codebreaker"]:after {
  background: #536eef;
}
.student-hero-preview-switcher__dot.is-active[data-games-preview-target="tangram"]:after {
  background: #6ea88d;
}
.student-games-preview-card__art {
  display: grid;
  width: 100%;
  aspect-ratio: 1 / 0.82;
  border-radius: 16px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel) 98%, white 2%),
    color-mix(in srgb, var(--bg-panel) 94%, var(--brand-50) 6%)
  );
  overflow: hidden;
  box-shadow:
    inset 0 0 0 1px #53658e14,
    0 8px 18px #1d2b470a;
}
.student-games-preview-card__art--sudoku {
  aspect-ratio: 1;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  align-content: stretch;
  padding: 8px;
  gap: 0;
}
.student-games-preview-card__cell {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  border-radius: 8px;
  background: #fffffff5;
  color: var(--text-strong);
  font-size: 0.78rem;
  font-weight: 800;
  box-shadow: inset 0 0 0 1px #5869912e;
}
.student-games-preview-card__art--sudoku .student-games-preview-card__cell {
  border-radius: 0;
  border-right: 1px solid rgba(147, 160, 192, 0.42);
  border-bottom: 1px solid rgba(147, 160, 192, 0.42);
  background: #ffffffd1;
  font-size: clamp(0.42rem, 1.1vw, 0.72rem);
  line-height: 1;
  box-shadow: none;
}
.student-games-preview-card__art--sudoku
  .student-games-preview-card__cell:nth-child(9n) {
  border-right: 0;
}
.student-games-preview-card__art--sudoku
  .student-games-preview-card__cell:nth-last-child(-n + 9) {
  border-bottom: 0;
}
.student-games-preview-card__art--sudoku
  .student-games-preview-card__cell:nth-child(3n):not(:nth-child(9n)) {
  border-right-width: 2px;
  border-right-color: #6d7ea69e;
}
.student-games-preview-card__art--sudoku
  .student-games-preview-card__cell:nth-child(n + 19):nth-child(-n + 27),
.student-games-preview-card__art--sudoku
  .student-games-preview-card__cell:nth-child(n + 46):nth-child(-n + 54) {
  border-bottom-width: 2px;
  border-bottom-color: #6d7ea69e;
}
.student-games-preview-card__art--sudoku
  .student-games-preview-card__cell.is-focus {
  background: #e8effffa;
  box-shadow: inset 0 0 0 2px #607eff70;
}
.student-practice-start-card--with-media {
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas: "visual copy" "media media" "cta cta";
  align-items: start;
  min-height: 0;
}
.student-practice-start-card--with-media .student-practice-start-card__visual {
  grid-area: visual;
}
.student-practice-start-card--with-media .student-practice-start-card__copy {
  grid-area: copy;
}
.student-practice-start-card--with-media .student-practice-start-card__media {
  grid-area: media;
  display: block;
  width: 100%;
  margin-top: 2px;
}
.student-practice-start-card--with-media .student-practice-start-card__cta {
  grid-area: cta;
  margin-top: 0;
  justify-self: end;
}
.student-practice-start-card--hub-game {
  min-height: 0;
}
.student-games-page .student-game-hub-stack,
.student-games-page .student-section-hero--action-first,
.student-games-page .student-guided-card {
  gap: 10px;
}
.student-games-page
  .student-games-overview-card
  .student-practice-section-note {
  display: none;
}
.student-games-page .student-hero-preview-switcher--games,
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__stage {
  min-height: 208px;
}
.student-games-page .student-hero-preview--games-rotator {
  height: 100%;
}
.student-games-page .student-hero-preview__frame--games-rotator {
  min-height: 208px;
  padding: 14px;
  gap: 10px;
  align-content: start;
}
.student-games-page .student-hero-preview__games-label {
  font-size: 0.74rem;
  letter-spacing: 0.08em;
}
.student-games-page
  .student-hero-preview__frame--games-rotator
  .student-games-preview-card__art,
.student-games-page
  .student-hero-preview__frame--games-rotator
  .portal-puzzle-preview-codebreaker,
.student-games-page
  .student-hero-preview__frame--games-rotator
  .portal-puzzle-preview-tangram {
  max-height: 176px;
}
.student-games-page .student-games-overview-card,
.student-games-page .student-practice-start-grid--games {
  gap: 10px;
}
.student-games-page .student-practice-start-card--hub-game {
  padding: 12px 12px 10px;
  gap: 8px;
  border-radius: 20px;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__copy {
  gap: 2px;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__detail {
  display: none;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__media,
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__cta {
  margin-top: 0;
}
.student-games-page .student-practice-start-card--hub-game .btn {
  min-height: 44px;
  padding-inline: 14px;
}
.student-games-page
  .student-practice-start-card__media
  .student-games-preview-card__art,
.student-games-page
  .student-practice-start-card__media
  .portal-puzzle-preview-codebreaker,
.student-games-page
  .student-practice-start-card__media
  .portal-puzzle-preview-tangram {
  aspect-ratio: 1 / 0.58;
}
.student-games-page
  .student-practice-start-card__media
  .portal-puzzle-preview-codebreaker,
.student-games-page
  .student-practice-start-card__media
  .portal-puzzle-preview-tangram {
  padding: 8px 10px;
}
.portal-puzzle-variant-card--media .portal-puzzle-variant-card__preview--media {
  display: block;
  width: 100%;
}
.portal-puzzle-preview-tangram-sample,
.portal-puzzle-preview-tangram,
.portal-puzzle-preview-codebreaker {
  display: block;
  width: 100%;
  border-radius: 18px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background:
    radial-gradient(
      circle at top right,
      color-mix(in srgb, var(--brand-100) 24%, transparent),
      transparent 58%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-panel) 99%, white 1%),
      color-mix(in srgb, var(--bg-panel) 95%, var(--brand-50) 5%)
    );
  box-shadow: inset 0 1px #ffffffb8;
}
.portal-puzzle-preview-tangram-sample {
  aspect-ratio: 1.48 / 1;
  overflow: hidden;
}
.portal-puzzle-preview-tangram-sample img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px 12px;
}
.portal-puzzle-preview-tangram {
  aspect-ratio: 1.48 / 1;
  padding: 10px 12px;
}
.portal-puzzle-preview-tangram__svg {
  width: 100%;
  height: 100%;
}
.portal-puzzle-preview-tangram .piece {
  stroke: #3c5493e6;
  stroke-width: 3;
  stroke-linejoin: round;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-1 {
  fill: #5a78ff;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-2 {
  fill: #8fa4ff;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-3 {
  fill: #efc785;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-4 {
  fill: #c7d7df;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-5 {
  fill: #7cb7a8;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-6 {
  fill: #d4b38d;
}
.portal-puzzle-preview-tangram[data-palette="classic"] .piece-7 {
  fill: #d9e9f1;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-1 {
  fill: #2d50d6;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-2 {
  fill: #4567e2;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-3 {
  fill: #5c7df0;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-4 {
  fill: #7a99fb;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-5 {
  fill: #92b0ff;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-6 {
  fill: #adc4ff;
}
.portal-puzzle-preview-tangram[data-palette="mono"] .piece-7 {
  fill: #c8d8ff;
}
.portal-puzzle-preview-codebreaker {
  padding: 10px;
}
.portal-puzzle-preview-codebreaker__board,
.portal-puzzle-preview-codebreaker__row {
  display: grid;
  gap: 8px;
}
.portal-puzzle-preview-codebreaker__row.is-secret {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.portal-puzzle-preview-codebreaker__row:not(.is-secret) {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.portal-puzzle-preview-codebreaker__guess {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.portal-puzzle-preview-codebreaker__slot {
  min-height: 34px;
  display: grid;
  place-items: center;
  padding: 4px;
  border-radius: 12px;
  border: 1px solid
    color-mix(in srgb, var(--brand-500) 16%, var(--line-default) 84%);
  background: #ffffffc7;
}
.portal-puzzle-preview-codebreaker__feedback {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  min-width: 30px;
}
.portal-puzzle-preview-codebreaker__peg {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 1.5px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: #ffffffe0;
}
.portal-puzzle-preview-codebreaker__peg.is-exact {
  background: #3557df;
  border-color: #2740a2;
}
.portal-puzzle-preview-codebreaker__peg.is-partial {
  background: #efc24d;
  border-color: #a57b16;
}
.portal-puzzle-preview-codebreaker.is-compact,
.portal-puzzle-preview-tangram.is-compact,
.portal-puzzle-preview-tangram-sample.is-compact {
  aspect-ratio: 1.36 / 1;
}
.portal-puzzle-preview-codebreaker.is-compact {
  padding: 8px;
}
.portal-puzzle-preview-codebreaker.is-compact
  .portal-puzzle-preview-codebreaker__slot {
  min-height: 28px;
  border-radius: 10px;
}
.portal-puzzle-preview-codebreaker.is-compact
  .portal-puzzle-preview-codebreaker__guess,
.portal-puzzle-preview-codebreaker.is-compact
  .portal-puzzle-preview-codebreaker__row {
  gap: 6px;
}
.portal-puzzle-preview-codebreaker.is-compact
  .portal-puzzle-preview-codebreaker__peg {
  width: 8px;
  height: 8px;
}
.student-hero-preview__frame--portal-puzzle {
  min-height: 206px;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 10px;
  align-content: stretch;
  overflow: hidden;
  padding: 18px;
}
.student-hero-preview__portal-art {
  min-height: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.student-hero-preview__frame--portal-puzzle .portal-puzzle-preview-tangram,
.student-hero-preview__frame--portal-puzzle .portal-puzzle-preview-codebreaker {
  width: min(100%, 270px);
  height: auto;
  max-height: 142px;
  margin-inline: auto;
}
.portal-puzzle-variant-card--media {
  gap: 12px;
}
.portal-puzzle-codebreaker__legend {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  color: var(--text-soft);
  font-size: 0.88rem;
}
.portal-puzzle-codebreaker__legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.portal-puzzle-codebreaker__legend-chip {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 1.5px solid
    color-mix(in srgb, var(--brand-500) 14%, var(--line-default) 86%);
  background: #ffffffe0;
  box-shadow: 0 3px 8px #1420331a;
}
.portal-puzzle-codebreaker__legend-chip.is-exact {
  background: #3557df;
  border-color: #2740a2;
}
.portal-puzzle-codebreaker__legend-chip.is-partial {
  background: #efc24d;
  border-color: #a57b16;
}
.portal-puzzle-codebreaker__feedback {
  min-width: 72px;
  justify-self: end;
  align-content: center;
  justify-items: center;
  gap: 5px;
}
.portal-puzzle-codebreaker__peg {
  width: 12px;
  height: 12px;
  border-width: 1.5px;
  box-shadow: 0 3px 8px #14203314;
}
.portal-puzzle-codebreaker__peg.is-exact {
  background: #3557df;
  border-color: #2740a2;
}
.portal-puzzle-codebreaker__peg.is-partial {
  background: #efc24d;
  border-color: #a57b16;
}
@media (max-width: 820px) {
  .student-hero-preview-gallery {
    gap: 10px;
  }
  .student-hero-preview-gallery__card {
    padding: 10px;
  }
}
@media (max-width: 680px) {
  .portal-puzzle-codebreaker__palette[data-variant="colors"][data-symbol-count="6"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .portal-puzzle-codebreaker__feedback {
    min-width: 52px;
    gap: 4px;
  }
  .portal-puzzle-codebreaker__peg {
    width: 10px;
    height: 10px;
  }
  .portal-puzzle-codebreaker__legend {
    gap: 10px;
    font-size: 0.8rem;
  }
  .student-games-page .student-hero-preview-switcher--games,
  .student-games-page
    .student-hero-preview-switcher--games
    .student-hero-preview-switcher__stage,
  .student-games-page .student-hero-preview__frame--games-rotator {
    min-height: 180px;
  }
}
@media (max-width: 640px) {
  .student-practice-start-card--with-media .student-practice-start-card__media {
    margin-top: 0;
  }
  .student-games-preview-card__cell {
    font-size: 0.72rem;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__row {
    grid-template-columns: 26px minmax(0, 1fr) 34px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__feedback {
    min-width: 34px;
    gap: 3px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="codebreaker"]
    .portal-puzzle-codebreaker__peg {
    width: 6px;
    height: 6px;
  }
  .student-games-page
    .student-practice-start-card__media
    .student-games-preview-card__art,
  .student-games-page
    .student-practice-start-card__media
    .portal-puzzle-preview-codebreaker,
  .student-games-page
    .student-practice-start-card__media
    .portal-puzzle-preview-tangram {
    aspect-ratio: 1 / 0.72;
  }
}
@media (max-width: 900px) {
  .student-games-page .student-section-hero--action-first,
  .student-games-page .student-games-overview-card,
  .student-game-hub-page:not(.student-home-page) .student-game-hub-card {
    padding: 12px;
    gap: 8px;
  }
  .student-games-page .student-game-hub-stack,
  .student-game-hub-page:not(.student-home-page) .student-game-hub-stack {
    gap: 8px;
  }
  .student-games-page .student-practice-start-grid--games,
  .student-game-hub-page:not(.student-home-page) .portal-puzzle-variant-grid,
  .student-game-hub-page:not(.student-home-page) .student-sudoku-level-grid {
    gap: 8px;
  }
  .student-games-page .student-hero-preview-switcher--games,
  .student-games-page
    .student-hero-preview-switcher--games
    .student-hero-preview-switcher__stage,
  .student-games-page .student-hero-preview__frame--games-rotator {
    min-height: 188px;
  }
  .student-games-page .student-hero-preview__frame--games-rotator {
    padding: 12px;
    gap: 8px;
  }
  .student-games-page .student-practice-start-card--hub-game,
  .student-game-hub-page:not(.student-home-page) .portal-puzzle-variant-card {
    padding: 11px;
    gap: 7px;
    border-radius: 18px;
  }
  .student-game-hub-page:not(.student-home-page) .student-sudoku-level-card {
    min-height: 0;
    padding: 14px 14px 12px;
    gap: 6px;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-sudoku-level-card__detail {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .student-game-hub-page:not(.student-home-page)
    .portal-puzzle-variant-card__meta {
    font-size: 0.78rem;
    line-height: 1.2;
  }
  .student-game-hub-page:not(.student-home-page)
    .portal-puzzle-preview-codebreaker,
  .student-game-hub-page:not(.student-home-page) .portal-puzzle-preview-tangram,
  .student-game-hub-page:not(.student-home-page)
    .portal-puzzle-preview-tangram-sample {
    aspect-ratio: 1.62 / 1;
  }
}
@media (max-width: 520px) {
  .student-games-page .student-section-hero--action-first,
  .student-games-page .student-games-overview-card,
  .student-game-hub-page:not(.student-home-page) .student-game-hub-card {
    padding: 10px 11px;
    border-radius: 18px;
  }
  .student-games-page .student-hero-preview-switcher--games,
  .student-games-page
    .student-hero-preview-switcher--games
    .student-hero-preview-switcher__stage,
  .student-games-page .student-hero-preview__frame--games-rotator {
    min-height: 170px;
  }
  .student-games-page .student-hero-preview__frame--games-rotator {
    padding: 10px;
  }
  .student-games-page .student-practice-start-card--hub-game {
    padding: 10px;
    gap: 6px;
  }
  .student-games-page .student-practice-start-card__title,
  .student-game-hub-page:not(.student-home-page)
    .portal-puzzle-variant-card
    strong {
    font-size: 0.95rem;
  }
  .student-games-page
    .student-practice-start-card__media
    .student-games-preview-card__art,
  .student-games-page
    .student-practice-start-card__media
    .portal-puzzle-preview-codebreaker,
  .student-games-page
    .student-practice-start-card__media
    .portal-puzzle-preview-tangram {
    aspect-ratio: 1 / 0.64;
  }
  .student-game-hub-page:not(.student-home-page)
    .portal-puzzle-variant-card__meta,
  .student-game-hub-page:not(.student-home-page)
    .student-sudoku-level-card__detail,
  .student-game-hub-page:not(.student-home-page)
    .section-header
    .student-practice-section-note {
    display: none;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-sudoku-level-card__meta {
    font-size: 0.76rem;
  }
}
.student-shell--focus-mode .student-page-content--portal-puzzle-focus {
  min-height: max(
    0px,
    calc(var(--app-height) - var(--header-height) - var(--safe-area-top))
  );
  align-content: start;
  padding-bottom: max(18px, var(--student-mobile-bottom-clearance));
}
.student-shell--focus-mode .student-portal-puzzle-focus-page,
.student-shell--focus-mode .student-portal-puzzle-game-card,
.student-shell--focus-mode
  .student-portal-puzzle-game-card
  > [data-portal-puzzle-host],
.student-shell--focus-mode .portal-puzzle-focus,
.student-shell--focus-mode .portal-puzzle-focus__surface {
  min-height: 0;
}
.student-shell--focus-mode
  .portal-puzzle-focus[data-game-id="tangram"]
  .portal-puzzle-focus__surface {
  min-height: 0;
  align-content: start;
}
.student-shell--focus-mode
  .portal-puzzle-focus[data-game-id="tangram"]
  .portal-puzzle-tangram,
.student-shell--focus-mode
  .portal-puzzle-focus[data-game-id="tangram"]
  .portal-puzzle-tangram__stage {
  min-height: 0;
}
.student-shell--focus-mode
  .portal-puzzle-focus[data-game-id="tangram"]
  .portal-puzzle-tangram__stage {
  align-items: start;
  justify-items: stretch;
  align-content: start;
  padding: clamp(8px, 1.2vw, 12px);
}
@media (max-width: 820px) {
  .student-shell--focus-mode .student-page-content--portal-puzzle-focus {
    min-height: max(
      0px,
      calc(var(--app-height) - var(--header-height) - var(--safe-area-top))
    );
    padding-bottom: max(
      18px,
      calc(var(--student-mobile-bottom-clearance) + 4px)
    );
  }
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-games-preview-card__art,
    .portal-puzzle-preview-codebreaker,
    .portal-puzzle-preview-tangram,
    .portal-puzzle-preview-tangram-sample,
    .portal-puzzle-variant-card,
    .student-games-page .student-practice-start-card--hub-game
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-games-preview-card__art,
    .portal-puzzle-preview-codebreaker,
    .portal-puzzle-preview-tangram,
    .portal-puzzle-preview-tangram-sample,
    .portal-puzzle-variant-card,
    .student-games-page .student-practice-start-card--hub-game
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-games-preview-card__art,
    .portal-puzzle-preview-codebreaker,
    .portal-puzzle-preview-tangram,
    .portal-puzzle-preview-tangram-sample,
    .portal-puzzle-variant-card,
    .student-games-page .student-practice-start-card--hub-game
  ) {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 16%,
        transparent
      ),
      transparent 44%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(18, 25, 44, 0.98) 86%,
        var(--student-theme-primary, #5a78ff) 14%
      ),
      #0a0f1dfa
    );
  box-shadow: 0 18px 32px #0000002e;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .portal-puzzle-preview-tangram-sample
  img,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .portal-puzzle-preview-tangram-sample
  img,
body.theme-dark
  .student-shell[data-learner-theme]
  .portal-puzzle-preview-tangram-sample
  img {
  opacity: 0.98;
  filter: brightness(1.18) contrast(1.12) saturate(1.06)
    drop-shadow(0 10px 18px rgba(8, 12, 24, 0.34));
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .portal-puzzle-preview-tangram-sample,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .portal-puzzle-preview-tangram-sample,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .portal-puzzle-preview-tangram-sample {
  border-color: color-mix(
    in srgb,
    var(--student-theme-primary, #5a78ff) 26%,
    rgba(188, 198, 230, 0.18)
  );
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 24%,
        transparent
      ),
      transparent 46%
    ),
    linear-gradient(180deg, #2a385cfa, #161f36fa);
  box-shadow:
    inset 0 1px #ffffff14,
    0 12px 24px #0000002e;
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .portal-puzzle-preview-tangram-sample
  img,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .portal-puzzle-preview-tangram-sample
  img,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-game-hub-page:not(.student-home-page)
  .portal-puzzle-preview-tangram-sample
  img {
  opacity: 1;
  filter: brightness(0) saturate(100%) invert(95%) sepia(8%) saturate(564%)
    hue-rotate(183deg) brightness(110%) contrast(102%)
    drop-shadow(0 10px 18px rgba(6, 10, 20, 0.34));
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__frame--portal-puzzle
  .portal-puzzle-preview-tangram,
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  .student-hero-preview__frame--portal-puzzle
  .portal-puzzle-preview-tangram,
body.theme-dark
  .student-shell[data-learner-theme]
  .student-hero-preview__frame--portal-puzzle
  .portal-puzzle-preview-tangram {
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 22%,
        transparent
      ),
      transparent 48%
    ),
    linear-gradient(180deg, #1e2a4afa, #0e1526fa);
}
html[data-appearance="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-games-preview-card__cell,
    .portal-puzzle-preview-codebreaker__slot
  ),
html[data-theme="dark"]
  .student-shell[data-learner-theme]
  :is(
    .student-games-preview-card__cell,
    .portal-puzzle-preview-codebreaker__slot
  ),
body.theme-dark
  .student-shell[data-learner-theme]
  :is(
    .student-games-preview-card__cell,
    .portal-puzzle-preview-codebreaker__slot
  ) {
  background: color-mix(
    in srgb,
    rgba(22, 31, 54, 0.98) 86%,
    var(--student-theme-secondary, #dce6ff) 14%
  );
  box-shadow: inset 0 0 0 1px #b8c4e424;
  color: var(--student-theme-dark-strong);
}
.student-games-page {
  --games-hero-stage-block: 250px;
  --games-hero-art-inline: 292px;
  --games-card-preview-block: 156px;
  --games-preview-ratio: 16 / 10;
}
.student-games-page .student-section-hero--with-aside {
  align-items: stretch;
}
.student-games-page
  .student-section-hero--with-aside
  .student-section-hero__aside--compact {
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  min-width: 0;
}
.student-games-page
  .student-section-hero--with-aside
  .student-section-hero__aside--compact
  > .student-hero-preview-switcher--games {
  flex: 1 1 auto;
  width: 100%;
}
@media (min-width: 1024px) {
  .student-games-page {
    --games-hero-stage-block: 272px;
    --games-hero-art-inline: 320px;
    --games-card-preview-block: 168px;
  }
  .student-games-page .student-section-hero--with-aside {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr);
  }
}
@media (max-width: 1023px) {
  .student-games-page .student-section-hero--with-aside {
    grid-template-columns: 1fr;
  }
}
.student-games-page .student-hero-preview-switcher--games {
  display: grid;
  grid-template-rows: var(--games-hero-stage-block) auto;
  gap: 10px;
  min-height: 0;
  height: auto;
}
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__stage {
  position: relative;
  min-height: 0;
  min-block-size: var(--games-hero-stage-block);
  block-size: var(--games-hero-stage-block);
  overflow: visible;
}
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__panel {
  visibility: hidden;
  opacity: 0;
  transform: translateY(4px);
}
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__panel.is-active {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__panel
  > .student-hero-preview,
.student-games-page .student-hero-preview--games-rotator {
  min-height: 0;
  min-block-size: 100%;
  block-size: 100%;
  height: 100%;
}
.student-games-page
  .student-hero-preview--games-rotator
  .student-hero-preview__surface {
  display: grid;
  place-items: stretch;
  align-content: stretch;
  height: 100%;
  padding: 14px;
}
.student-games-page .student-hero-preview__frame--games-rotator {
  inline-size: 100%;
  max-inline-size: none;
  min-height: 0;
  min-block-size: 0;
  block-size: 100%;
  max-height: none;
  max-block-size: none;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
  justify-items: stretch;
  gap: 10px;
  padding: 14px;
  overflow: hidden;
}
.student-games-page .student-hero-preview__games-label {
  line-height: 1.2;
  white-space: nowrap;
}
.student-games-page .student-hero-preview__art-stage {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.student-games-page
  .student-hero-preview__art-stage
  > :is(
    .student-games-preview-card__art,
    .portal-puzzle-preview-codebreaker,
    .portal-puzzle-preview-tangram,
    .portal-puzzle-preview-tangram-sample
  ) {
  inline-size: min(100%, var(--games-hero-art-inline));
  block-size: auto;
  max-height: none;
  max-block-size: 100%;
}
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__controls {
  position: static;
  left: auto;
  bottom: auto;
  transform: none;
  justify-self: center;
  align-self: center;
  min-height: 44px;
  padding: 4px 8px;
}
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__dot {
  inline-size: 44px;
  block-size: 44px;
}
.student-games-page
  :is(
    .student-games-preview-card__art,
    .portal-puzzle-preview-codebreaker,
    .portal-puzzle-preview-tangram,
    .portal-puzzle-preview-tangram-sample
  ) {
  box-sizing: border-box;
  display: grid;
  place-items: center;
  inline-size: 100%;
  max-inline-size: 100%;
  aspect-ratio: var(--games-preview-ratio);
  min-height: 0;
  min-block-size: 0;
  overflow: hidden;
}
.student-games-page .student-games-preview-card__art--sudoku {
  grid-template-columns: 1fr;
  padding: 12px;
}
.student-games-page .student-games-preview-card__sudoku-board {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  inline-size: min(100%, 144px);
  aspect-ratio: 1;
  border: 2px solid rgba(109, 126, 166, 0.62);
  background: #ffffffad;
  overflow: hidden;
}
.student-games-page
  .student-games-preview-card__art--sudoku
  .student-games-preview-card__cell {
  border-radius: 0;
}
.student-games-page .portal-puzzle-preview-tangram__svg,
.student-games-page .portal-puzzle-preview-tangram-sample img {
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: 100%;
  max-block-size: 100%;
  object-fit: contain;
}
.student-games-page .portal-puzzle-preview-codebreaker__board {
  inline-size: min(100%, 244px);
  margin-inline: auto;
}
.student-games-page .student-practice-start-grid--games {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
}
.student-games-page
  .student-practice-start-grid--games
  > :nth-child(odd):last-child {
  grid-column: auto;
}
.student-games-page .student-practice-start-card--hub-game {
  grid-template-columns: 48px minmax(0, 1fr);
  grid-template-areas: "visual copy" "media media" "cta cta";
  grid-template-rows: auto var(--games-card-preview-block) auto;
  align-content: stretch;
  min-height: calc(var(--games-card-preview-block) + 126px);
  height: 100%;
  padding: 14px;
  gap: 10px 12px;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__visual {
  grid-area: visual;
  align-self: center;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__copy {
  grid-area: copy;
  align-self: center;
  min-width: 0;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__media {
  grid-area: media;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  block-size: var(--games-card-preview-block);
  margin-top: 0;
  overflow: hidden;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__media
  > :is(
    .student-games-preview-card__art,
    .portal-puzzle-preview-codebreaker,
    .portal-puzzle-preview-tangram,
    .portal-puzzle-preview-tangram-sample
  ) {
  block-size: 100%;
  max-height: none;
  max-block-size: 100%;
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-games-preview-card__sudoku-board {
  inline-size: min(100%, 126px);
}
.student-games-page
  .student-practice-start-card--hub-game
  .student-practice-start-card__cta {
  grid-area: cta;
  justify-self: stretch;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  margin-top: auto;
  padding: 0 14px;
  border-radius: 16px;
}
.student-games-page .student-practice-start-card--hub-game:hover,
.student-games-page .student-practice-start-card--hub-game:focus-visible,
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__dot:hover,
.student-games-page
  .student-hero-preview-switcher--games
  .student-hero-preview-switcher__dot:focus-visible {
  outline: none;
}
.student-games-page .student-practice-start-card--hub-game:focus-visible {
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, white 52%, transparent),
    0 0 0 4px
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 22%, transparent),
    0 18px 34px
      color-mix(in srgb, var(--practice-accent, #5d8ef7) 16%, transparent);
}
@media (max-width: 900px) {
  .student-games-page {
    --games-hero-stage-block: 238px;
    --games-hero-art-inline: 286px;
    --games-card-preview-block: 146px;
    --games-mobile-action-clearance: max(
      var(--student-mobile-bottom-clearance, 0px),
      112px
    );
  }
  .student-games-page.student-shell__body--with-nav {
    padding-bottom: calc(var(--games-mobile-action-clearance) + 24px);
    scroll-padding-bottom: calc(var(--games-mobile-action-clearance) + 24px);
  }
  .student-games-page .student-practice-start-grid--games {
    grid-template-columns: 1fr;
  }
  .student-games-page .student-practice-start-card--hub-game,
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__cta {
    scroll-margin-bottom: calc(var(--games-mobile-action-clearance) + 24px);
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__cta {
    justify-self: center;
    inline-size: clamp(136px, 42%, 168px);
    width: clamp(136px, 42%, 168px);
    padding-inline: 18px;
  }
}
@media (max-width: 520px) {
  .student-games-page {
    --games-hero-stage-block: 230px;
    --games-hero-art-inline: 270px;
    --games-card-preview-block: 138px;
  }
  .student-games-page
    .student-hero-preview--games-rotator
    .student-hero-preview__surface,
  .student-games-page .student-hero-preview__frame--games-rotator,
  .student-games-page .student-practice-start-card--hub-game {
    padding: 12px;
  }
  .student-games-page .student-practice-start-card--hub-game {
    grid-template-columns: 44px minmax(0, 1fr);
    min-height: calc(var(--games-card-preview-block) + 118px);
  }
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  :is(
    .student-portal-puzzle-game-card,
    .portal-puzzle-tangram__stage,
    .portal-puzzle-codebreaker__secret-row,
    .portal-puzzle-codebreaker__row,
    .mp-game-topbar__action,
    .mp-game-topbar__timer
  ),
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  :is(
    .student-portal-puzzle-game-card,
    .portal-puzzle-tangram__stage,
    .portal-puzzle-codebreaker__secret-row,
    .portal-puzzle-codebreaker__row,
    .mp-game-topbar__action,
    .mp-game-topbar__timer
  ),
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  :is(
    .student-portal-puzzle-game-card,
    .portal-puzzle-tangram__stage,
    .portal-puzzle-codebreaker__secret-row,
    .portal-puzzle-codebreaker__row,
    .mp-game-topbar__action,
    .mp-game-topbar__timer
  ) {
  border-color: var(--student-theme-dark-border);
  background:
    radial-gradient(
      circle at top right,
      color-mix(
        in srgb,
        var(--student-theme-primary, #5a78ff) 12%,
        transparent
      ),
      transparent 38%
    ),
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        rgba(17, 24, 42, 0.98) 86%,
        var(--student-theme-primary, #5a78ff) 14%
      ),
      #080d18fc
    );
  color: var(--student-theme-dark-strong);
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-codebreaker__slot,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-codebreaker__slot,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-codebreaker__slot {
  border-color: var(--student-theme-dark-chip-border);
  background: color-mix(
    in srgb,
    rgba(21, 30, 52, 0.96) 84%,
    var(--student-theme-secondary, #dce6ff) 16%
  );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__svg,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__svg,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__svg {
  background: linear-gradient(
    180deg,
    color-mix(
      in srgb,
      rgba(33, 46, 78, 0.98) 76%,
      var(--student-theme-primary, #5a78ff) 24%
    ),
    #10182afa
  );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-fill,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-fill,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-fill {
  fill: color-mix(
    in srgb,
    rgba(236, 244, 255, 0.46) 80%,
    var(--student-theme-primary, #5a78ff) 20%
  );
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-outline,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-outline,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-outline {
  stroke: color-mix(
    in srgb,
    rgba(239, 246, 255, 0.92) 74%,
    var(--student-theme-primary, #5a78ff) 26%
  );
  opacity: 0.98;
}
html[data-appearance="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-image,
html[data-theme="dark"]
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-image,
body.theme-dark
  .student-shell--focus-mode[data-learner-theme]
  .portal-puzzle-tangram__target-image {
  opacity: 0.42;
  filter: brightness(0) saturate(100%) invert(95%) sepia(8%) saturate(564%)
    hue-rotate(183deg) brightness(110%) contrast(102%)
    drop-shadow(0 10px 16px rgba(8, 12, 24, 0.22));
}
.student-mobile-card-row {
  display: none;
}
@media (max-width: 1100px), (hover: none) and (pointer: coarse) {
  .student-game-hub-page:not(.student-home-page) .student-mobile-card-row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: start;
    gap: 10px 12px;
    width: 100%;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-mobile-card-row__visual {
    grid-column: 1;
    grid-row: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-mobile-card-row__visual
    .practice-icon {
    width: 50px;
    height: 50px;
    border-radius: 16px;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-mobile-card-row__header {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    display: grid;
    gap: 2px;
    align-self: center;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-mobile-card-row__title {
    color: var(--text-strong);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-mobile-card-row__detail {
    grid-column: 1 / -1;
    grid-row: 2;
    color: var(--text-soft);
    font-size: 0.84rem;
    line-height: 1.36;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .student-game-hub-page:not(.student-home-page) .student-mobile-card-row__cta {
    grid-column: 1 / -1;
    grid-row: 3;
    min-height: 44px;
    width: 100%;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid
      color-mix(in srgb, var(--brand-500) 28%, var(--line-default) 72%);
    background: color-mix(in srgb, var(--brand-50) 72%, white 28%);
    color: var(--brand-700);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.84rem;
    font-weight: 800;
    white-space: normal;
  }
  .student-game-hub-page:not(.student-home-page) .student-sudoku-level-card,
  .student-game-hub-page:not(.student-home-page) .portal-puzzle-variant-card {
    min-height: 0;
    padding: 12px 14px;
    gap: 0;
  }
  .student-game-hub-page:not(.student-home-page)
    .student-sudoku-level-card
    > :not(.student-mobile-card-row),
  .student-game-hub-page:not(.student-home-page)
    .portal-puzzle-variant-card
    > :not(.student-mobile-card-row) {
    display: none !important;
  }
}
@media (max-width: 680px) {
  .student-games-page .student-practice-start-card--hub-game {
    grid-template-columns: 44px minmax(0, 1fr);
    grid-template-areas: "visual copy" "media media" "cta cta";
    grid-template-rows: auto var(--games-card-preview-block) auto;
    align-items: start;
    align-content: stretch;
    min-height: calc(var(--games-card-preview-block) + 118px);
    padding: 12px 13px;
    gap: 10px 12px;
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__visual {
    grid-area: visual;
    align-self: center;
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__copy {
    grid-area: copy;
    min-width: 0;
    gap: 3px;
    align-self: center;
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__title {
    font-size: 1rem;
    line-height: 1.2;
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__detail {
    display: none;
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__media {
    grid-area: media;
    display: grid;
    block-size: var(--games-card-preview-block);
    min-height: 0;
    overflow: hidden;
  }
  .student-games-page
    .student-practice-start-card--hub-game
    .student-practice-start-card__cta {
    grid-area: cta;
    margin-top: 0;
    min-height: 44px;
    justify-self: center;
    inline-size: clamp(136px, 42%, 168px);
    width: clamp(136px, 42%, 168px);
    border-radius: 16px;
    align-self: stretch;
    justify-content: center;
    padding-inline: 18px;
  }
}
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt--sequence:not(.runner-prompt--raw),
.student-page-content--runner
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt--sequence:not(.runner-prompt--raw),
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt--sequence:not(.runner-prompt--raw) {
  width: min(100%, 54rem);
  max-width: 100%;
  gap: 14px;
}
.runner-prompt--sequence .runner-prompt__context {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: min(100%, 42rem);
  margin-inline: auto;
  padding: 8px 14px;
  border: 1px solid color-mix(in srgb, var(--line-default) 72%, white 28%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--student-100) 12%);
  color: var(--text-strong);
  font-size: clamp(1rem, 1.35vw, 1.2rem);
  font-weight: 760;
  line-height: 1.3;
}
.runner-shell .runner-prompt--sequence .runner-prompt__main,
.student-page-content--runner
  .runner-question-card-v2
  .runner-prompt--sequence
  .runner-prompt__main,
.student-page-content--runner
  .runner-shell-v2[data-runner-form-factor="touch-stack"]
  .runner-question-card-v2.runner-question-panel--compact-short
  .runner-prompt--sequence
  .runner-prompt__main {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  padding: clamp(14px, 2vw, 20px);
  border: 1px solid color-mix(in srgb, var(--line-default) 80%, white 20%);
  border-radius: 20px;
  background: color-mix(in srgb, var(--bg-panel) 92%, white 8%);
  box-shadow: inset 0 1px #ffffff85;
  color: var(--text-strong);
  font-size: clamp(1.7rem, 2.45vw, 2.65rem);
  line-height: 1.28;
  letter-spacing: 0;
  text-wrap: wrap;
}
.runner-sequence-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.28em 0.42em;
}
.runner-sequence-term {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.runner-sequence-separator {
  margin-left: 0.12em;
  color: var(--text-body);
  opacity: 0.72;
}
.runner-prompt--sequence .runner-blank-slot--sequence {
  position: relative;
  width: 2.55em;
  min-width: 2.55em;
  height: 1.32em;
  margin: 0 0.08em;
  border: 2px dashed
    color-mix(in srgb, var(--student-700) 78%, var(--text-strong) 22%);
  border-radius: 0.38em;
  background: color-mix(in srgb, var(--student-100) 74%, white 26%);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--student-100) 42%, transparent);
  vertical-align: middle;
}
.runner-prompt--sequence .runner-blank-slot--sequence:after {
  content: "?";
  color: color-mix(in srgb, var(--student-700) 76%, var(--text-strong) 24%);
  font-size: 0.66em;
  font-weight: 900;
  line-height: 1;
}
@media (max-width: 720px) {
  .runner-prompt--sequence .runner-prompt__context {
    width: 100%;
    border-radius: 16px;
  }
  .runner-shell .runner-prompt--sequence .runner-prompt__main,
  .student-page-content--runner
    .runner-question-card-v2
    .runner-prompt--sequence
    .runner-prompt__main {
    padding: 12px;
    font-size: clamp(1.42rem, 6vw, 2.05rem);
  }
}
.mp-public-static a,
.public-header a,
.public-header button,
.public-nav-right a,
.public-nav-right button,
.public-header__nav a,
.public-header__controls a,
.public-header__controls button,
.footer a,
.mp-footer a,
.student-topbar .nav-pill,
.student-topbar__actions .btn,
.student-topbar a,
.student-topbar button,
.student-profile-summary-grid a,
.student-profile-summary-grid button,
.mp-topbar__brand,
.mp-inline-link--button {
  min-width: 44px;
  min-height: 44px;
}
.mp-public-static a,
.public-header a,
.public-header button,
.public-nav-right a,
.public-nav-right button,
.public-header__nav a,
.public-header__controls a,
.public-header__controls button,
.footer a,
.mp-footer a,
.mp-topbar__brand,
.mp-inline-link--button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.mp-public-static p a {
  padding: 10px 12px;
}
.portal-public .mp-public-auth-actions .mp-inline-link--button,
.portal-public
  .mp-topbar--public-home
  .mp-public-auth-actions
  .mp-inline-link--button,
.portal-public
  .mp-topbar--public-auth
  .mp-public-auth-actions
  .mp-inline-link--button,
.portal-public
  :is(.mp-topbar--public-home, .mp-topbar--public-auth)
  .mp-public-auth-actions
  .mp-inline-link--button,
.student-home-player-panel .student-home-inline-action,
.student-home-kid-path .student-home-inline-action,
.student-segmented__button,
.app-sidebar__toggle,
.scope-switcher .pill,
.tab-button {
  min-width: 44px;
  min-height: 44px;
}
.student-home-player-panel .student-home-inline-action,
.student-home-kid-path .student-home-inline-action {
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
}
body.portal-public {
  overflow-x: hidden;
}
.portal-public .mp-public-brand-signature {
  color: var(--text-soft);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.portal-public .mp-topbar--public-home .mp-topbar__inner {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "left right";
  min-height: 68px;
}
.portal-public .mp-topbar--public-home .mp-topbar__left {
  grid-area: left;
  gap: 12px;
}
.portal-public .mp-topbar--public-home .mp-topbar__center {
  display: none;
}
.portal-public .mp-topbar--public-home .mp-topbar__right {
  grid-area: right;
}
.portal-public .mp-quiet-public {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
  padding: 28px 0 46px;
}
.portal-public .mp-quiet-home-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 410px);
  gap: 54px;
  align-content: center;
  align-items: start;
  min-height: calc(100svh - 176px);
}
.portal-public .mp-quiet-hero {
  display: grid;
  gap: 24px;
  align-content: center;
  max-width: 700px;
  min-width: 0;
}
.portal-public .mp-quiet-brand-line {
  margin: 0;
  color: color-mix(in srgb, var(--text-soft) 88%, var(--text-strong) 12%);
  font-size: 0.95rem;
  font-weight: 760;
  line-height: 1.35;
}
.portal-public .mp-quiet-hero h1,
.portal-public .mp-quiet-demo h1,
.portal-public .mp-quiet-legal h1 {
  margin: 0;
  color: var(--text-strong);
  font-family: var(--public-display-font, Georgia, serif);
  font-size: 4.5rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.02;
  overflow-wrap: anywhere;
}
.portal-public .mp-quiet-hero h1 span {
  display: block;
}
.portal-public .mp-quiet-demo h1,
.portal-public .mp-quiet-legal h1 {
  font-size: 3.2rem;
}
.portal-public .mp-quiet-subline {
  margin: 0;
  max-width: 42rem;
  color: var(--text-body);
  font-size: 1.18rem;
  line-height: 1.55;
}
.portal-public .mp-quiet-actions,
.portal-public .mp-quiet-demo__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
.portal-public .mp-quiet-actions .btn,
.portal-public .mp-quiet-demo__actions .btn,
.portal-public .mp-embedded-signin .btn {
  min-height: 44px;
  justify-content: center;
}
.portal-public .mp-quiet-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  max-width: 42rem;
}
.portal-public .mp-quiet-chip {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid color-mix(in srgb, var(--line-default) 82%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg-canvas) 12%);
  color: var(--text-strong);
  font-size: 0.9rem;
  font-weight: 720;
  line-height: 1.2;
}
.portal-public .mp-embedded-signin {
  display: grid;
  gap: 18px;
  width: 100%;
  max-width: 410px;
  justify-self: end;
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--bg-canvas) 6%);
  box-shadow: 0 18px 46px #1b2a4414;
}
.portal-public .mp-embedded-signin__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.portal-public .mp-embedded-signin__head h2 {
  margin: 0;
  color: var(--text-strong);
  font-size: 1.45rem;
  line-height: 1.15;
  letter-spacing: 0;
}
.portal-public .mp-embedded-signin__tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border: 1px solid color-mix(in srgb, var(--line-default) 76%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-panel-2) 78%, var(--bg-canvas) 22%);
}
.portal-public .mp-embedded-signin__tab {
  min-width: 0;
  min-height: 44px;
  padding: 8px 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text-body);
  cursor: pointer;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 760;
  line-height: 1.15;
}
.portal-public .mp-embedded-signin__tab[aria-selected="true"] {
  background: var(--bg-panel);
  color: var(--text-strong);
  box-shadow: 0 6px 14px #1f253414;
}
.portal-public .mp-embedded-signin__tab:focus-visible,
.portal-public .mp-embedded-signin__form :is(input, button, a):focus-visible,
.portal-public
  .mp-quiet-demo__form
  :is(input, select, textarea, button, a):focus-visible,
.portal-public .mp-quiet-actions .btn:focus-visible,
.portal-public .mp-quiet-actions button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand-500) 58%, white 42%);
  outline-offset: 2px;
}
.portal-public .mp-embedded-signin__panels {
  min-width: 0;
}
.portal-public .mp-embedded-signin__panel[hidden] {
  display: none;
}
.portal-public .mp-embedded-signin__form,
.portal-public .mp-quiet-demo__form {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.portal-public .mp-embedded-signin__form label,
.portal-public .mp-quiet-demo__form label {
  display: grid;
  gap: 7px;
  color: var(--text-strong);
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.25;
}
.portal-public .mp-embedded-signin__form input,
.portal-public .mp-quiet-demo__form input,
.portal-public .mp-quiet-demo__form select,
.portal-public .mp-quiet-demo__form textarea {
  width: 100%;
  min-height: 44px;
  padding: 11px 12px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  border-radius: 8px;
  background: var(--bg-panel-2);
  color: var(--text-strong);
  font: inherit;
}
.portal-public .mp-quiet-demo__form textarea {
  min-height: 108px;
  resize: vertical;
}
.portal-public .mp-embedded-signin__note,
.portal-public .mp-embedded-signin__links,
.portal-public .mp-quiet-demo__actions p {
  margin: 0;
  color: var(--text-soft);
  font-size: 0.9rem;
  line-height: 1.45;
}
.portal-public .mp-embedded-signin__links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
}
.portal-public .mp-embedded-signin__links a,
.portal-public .mp-embedded-signin__link-button,
.portal-public .mp-quiet-demo__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-strong);
  cursor: pointer;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 760;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.portal-public .mp-embedded-signin__status {
  padding: 11px 12px;
  border-radius: 8px;
  font-size: 0.92rem;
  line-height: 1.45;
}
.portal-public .mp-embedded-signin__status.is-error {
  background: #be43431f;
  color: #8f2d2d;
}
.portal-public .mp-embedded-signin__status.is-success {
  background: #45915f24;
  color: #1f5e42;
}
.portal-public .mp-quiet-demo,
.portal-public .mp-quiet-legal {
  display: grid;
  gap: 22px;
  max-width: 760px;
  margin-inline: auto;
}
.portal-public .mp-quiet-demo__intro,
.portal-public .mp-quiet-legal {
  display: grid;
  gap: 14px;
}
.portal-public .mp-quiet-demo__intro p,
.portal-public .mp-quiet-legal > p,
.portal-public .mp-quiet-legal__section p {
  margin: 0;
  color: var(--text-body);
  font-size: 1rem;
  line-height: 1.55;
}
.portal-public .mp-quiet-demo__form {
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--line-default) 84%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-panel) 94%, var(--bg-canvas) 6%);
  box-shadow: 0 16px 36px #1b2a4412;
}
.portal-public .mp-quiet-legal h2 {
  margin: 0;
  color: var(--text-strong);
  font-size: 1.15rem;
  line-height: 1.25;
  letter-spacing: 0;
}
.portal-public .mp-quiet-legal__stack {
  display: grid;
  gap: 18px;
}
.portal-public .mp-quiet-legal__section {
  display: grid;
  gap: 8px;
}
:is(html[data-appearance="dark"], html[data-theme="dark"])
  body.portal-public
  .mp-embedded-signin,
body.theme-dark.portal-public .mp-embedded-signin,
:is(html[data-appearance="dark"], html[data-theme="dark"])
  body.portal-public
  .mp-quiet-demo__form,
body.theme-dark.portal-public .mp-quiet-demo__form {
  background: color-mix(in srgb, var(--bg-panel) 92%, black 8%);
  box-shadow: 0 18px 46px #0000003d;
}
:is(html[data-appearance="dark"], html[data-theme="dark"])
  body.portal-public
  .mp-embedded-signin__tab[aria-selected="true"],
body.theme-dark.portal-public .mp-embedded-signin__tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--bg-panel) 82%, white 8%);
}
@media (min-width: 761px) {
  .portal-public .mp-quiet-demo__form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .portal-public .mp-quiet-demo__form label:nth-of-type(5),
  .portal-public .mp-quiet-demo__status,
  .portal-public .mp-quiet-demo__actions {
    grid-column: 1 / -1;
  }
}
@media (max-width: 1240px) {
  .portal-public .mp-public-brand-signature {
    display: none;
  }
}
@media (max-width: 1020px) {
  .portal-public .mp-quiet-home-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
    min-height: auto;
    align-items: start;
  }
  .portal-public .mp-embedded-signin {
    max-width: 560px;
    justify-self: stretch;
  }
}
@media (max-width: 760px) {
  .portal-public .mp-public-brand-signature {
    display: none;
  }
  .portal-public .mp-quiet-public {
    width: min(100% - 24px, 620px);
    padding-top: 18px;
  }
  .portal-public .mp-quiet-hero {
    gap: 18px;
  }
  .portal-public .mp-quiet-hero h1,
  .portal-public .mp-quiet-demo h1,
  .portal-public .mp-quiet-legal h1 {
    font-size: 3rem;
    line-height: 1.04;
  }
  .portal-public .mp-quiet-subline {
    font-size: 1.05rem;
  }
  .portal-public .mp-quiet-scroll-signin {
    order: -1;
  }
  .portal-public .mp-quiet-actions .btn,
  .portal-public .mp-quiet-actions button,
  .portal-public .mp-quiet-demo__actions .btn {
    flex: 1 1 10rem;
  }
  .portal-public .mp-embedded-signin,
  .portal-public .mp-quiet-demo__form {
    padding: 18px;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "left right";
    row-gap: 0;
    padding: 8px 12px;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__center,
  .portal-public .mp-topbar--public-home .mp-public-auth-actions {
    display: none;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__utility-pill {
    display: flex;
    width: auto;
  }
  .portal-public .mp-topbar--public-home .mp-topbar__control,
  .portal-public .mp-topbar--public-home .mp-language-menu summary {
    min-width: 44px;
    min-height: 44px;
  }
}
@media (max-width: 420px) {
  .portal-public .mp-quiet-public {
    width: min(100% - 20px, 390px);
  }
  .portal-public .mp-quiet-hero h1,
  .portal-public .mp-quiet-demo h1,
  .portal-public .mp-quiet-legal h1 {
    font-size: 2.55rem;
  }
  .portal-public .mp-embedded-signin__tab {
    font-size: 0.84rem;
  }
  .portal-public .mp-quiet-chip {
    width: 100%;
    justify-content: center;
  }
}
.student-storage-mode-switch--wizard {
  width: min(100%, 360px);
  margin: 0;
}
.student-storage-mode-switch--hero {
  align-self: start;
}
.student-sats-full-papers-header__tools .student-storage-mode-switch {
  min-width: 260px;
}
@media (max-width: 900px) {
  .student-sats-full-papers-header {
    grid-template-columns: 1fr;
  }
  .student-sats-full-papers-header__copy {
    grid-template-columns: 1fr;
  }
  .student-sats-full-papers-header__copy > a {
    width: max-content;
  }
  .student-sats-full-papers-header__tools {
    justify-self: stretch;
  }
  .student-sats-full-papers-header__tools .student-storage-mode-switch {
    width: 100%;
    min-width: 0;
    max-width: none;
    justify-content: stretch;
  }
  .student-sats-full-papers-header__tools
    .student-storage-mode-switch__control.student-segmented--views {
    min-width: 0;
    flex: 1;
  }
}
.assignment-mode-field {
  display: grid;
  gap: 12px;
}
.assignment-mode-field > label {
  display: grid;
  gap: 8px;
}
.assignment-mode-native {
  max-width: 340px;
}
.assignment-mode-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
  gap: 10px;
}
.assignment-mode-choice {
  min-width: 0;
  min-height: 78px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line-default);
  border-radius: 12px;
  background: var(--bg-panel);
  color: var(--text-strong);
  text-align: left;
  box-shadow: var(--surface-shadow-ui);
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}
.assignment-mode-choice:hover {
  border-color: var(--line-strong);
  background: var(--bg-hover);
}
.assignment-mode-choice:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px var(--focus-ring),
    var(--surface-shadow-ui);
}
.assignment-mode-choice.is-selected {
  border-color: var(--brand-600);
  background: var(--bg-selected);
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--brand-600) 18%, transparent),
    var(--surface-shadow-ui);
}
.assignment-mode-choice span {
  display: block;
  font-weight: 850;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.assignment-mode-choice small {
  display: block;
  color: var(--text-body);
  font-size: 0.78rem;
  font-weight: 750;
  line-height: 1.22;
  overflow-wrap: anywhere;
}
.assignment-mode-choice.is-selected small {
  color: color-mix(in srgb, var(--brand-700) 72%, var(--text-body) 28%);
}
@media (max-width: 640px) {
  .assignment-mode-choice-grid {
    grid-template-columns: 1fr;
  }
  .assignment-mode-choice {
    min-height: 64px;
  }
}
.assignment-target-panel
  :is([data-use-class-targets], [data-open-target-picker]) {
  position: relative;
  min-height: 44px;
}
.assignment-target-panel
  :is([data-use-class-targets], [data-open-target-picker]).is-selected {
  border-color: var(--brand-600);
  background: var(--bg-selected);
  color: var(--text-strong);
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--brand-600) 18%, transparent),
    var(--surface-shadow-ui);
  padding-inline-end: 34px;
}
.assignment-target-panel
  :is([data-use-class-targets], [data-open-target-picker]).is-selected:after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--brand-600);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-600) 14%, transparent);
  transform: translateY(-50%);
}
.assignment-target-picker-overlay {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(20, 25, 38, 0.28);
  backdrop-filter: blur(2px);
}
.assignment-target-picker-card {
  width: min(720px, calc(100vw - 32px));
  max-height: min(82vh, 720px);
  overflow: auto;
}
.assignment-target-picker-card .data-list {
  max-height: min(42vh, 360px);
  overflow: auto;
}
.assignment-target-picker-card .section-header {
  margin-bottom: 16px;
}
@media (max-width: 640px) {
  .assignment-target-picker-overlay {
    padding: 12px;
    align-items: end;
  }
  .assignment-target-picker-card {
    width: 100%;
    max-height: 86vh;
  }
}
@media (max-width: 640px) {
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__brand {
    display: none;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__left {
    width: 100%;
    gap: 0;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-topbar__left-slot {
    width: 100%;
    flex: 1 1 auto;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-game-topbar-slot {
    width: 100%;
    justify-content: space-between;
    gap: 8px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-game-topbar__actions {
    flex: 0 0 auto;
  }
  .student-segmented__button {
    min-height: 44px;
  }
}
@media (max-width: 380px) {
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-game-topbar-slot {
    gap: 6px;
  }
  .student-shell--focus-mode
    > .mp-topbar.mp-topbar--runner-focus:first-child
    .mp-game-topbar__timer {
    display: none;
  }
}
@media (max-width: 640px) {
  .student-storage-mode-switch__control .student-segmented__button,
  .student-competition-storage-mode__control .student-segmented__button {
    min-height: 44px;
  }
  .student-portal-puzzle-focus-page
    .portal-puzzle-focus[data-game-id="tangram"]
    .portal-puzzle-tangram__piece {
    --portal-tangram-piece-stroke-width: 4;
    stroke-width: var(--portal-tangram-piece-stroke-width);
    pointer-events: visiblePainted;
  }
}

/* MP 19.9.4 learner presentation contracts: edit at component layer, not an EOF override. */
:is(.runner-shell,[data-runner-shell],.student-profile,.completion-view,.mp-detailed-summary) :is(button,a,input,select,textarea){min-width:44px;min-height:44px}
.mp-fraction{display:inline-grid;grid-template-rows:auto 1px auto;align-items:center;justify-items:center;vertical-align:-.5em;min-width:1.35em;margin-inline:.08em;line-height:1}.mp-fraction__top,.mp-fraction__bottom{padding-inline:.12em}.mp-fraction__bar{width:100%;border-top:1.5px solid currentColor}.mp-fraction-sign{display:inline-block;margin-right:.05em}
.runner-structured-prompt{display:grid;gap:.75rem;max-width:46rem;margin-inline:auto}.runner-prompt-context,.runner-prompt-question{text-align:left}.runner-prompt-context p{margin:.2rem 0}.runner-prompt-facts{display:grid;gap:.5rem}.runner-prompt-fact{padding:.65rem .8rem;border-radius:.75rem;background:var(--surface-soft,rgba(127,127,127,.08));font-weight:700}.runner-prompt-question{font-size:clamp(1.2rem,1rem + .65vw,1.65rem);font-weight:800;line-height:1.35}
.runner-mode-compact-numeric .runner-structured-prompt,.runner-mode-compact-choice .runner-structured-prompt{place-items:center;text-align:center}.runner-mode-compact-numeric .runner-prompt-question{font-size:clamp(2.4rem,1.7rem + 2.4vw,4rem);line-height:1.08;text-align:center}.runner-mode-text-problem .runner-prompt-context,.runner-mode-text-problem .runner-prompt-facts,.runner-mode-text-problem .runner-prompt-question{width:100%;text-align:left}
.runner-mode-compact-numeric :is(.runner-stimulus,.question-card,.stimulus-card),.runner-mode-compact-choice :is(.runner-stimulus,.question-card,.stimulus-card){min-height:0;height:auto;padding-block:clamp(1.25rem,3vh,2.4rem)}.runner-mode-compact-numeric :is(.answer-panel,.answer-dock),.runner-mode-compact-choice :is(.answer-panel,.answer-dock){min-height:0;height:max-content;align-self:start}
:is(.single-choice,.runner-answer-options,.answer-options,.choice-grid)[role="radiogroup"] :is([role="radio"],[data-answer-option],.answer-option,.choice-tile){min-height:44px;position:relative;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}:is(.single-choice,.runner-answer-options,.answer-options,.choice-grid)[role="radiogroup"] :is([role="radio"],[data-answer-option],.answer-option,.choice-tile):hover{background:var(--surface-hover,rgba(37,99,235,.06))}:is(.single-choice,.runner-answer-options,.answer-options,.choice-grid)[role="radiogroup"] :is([role="radio"],[data-answer-option],.answer-option,.choice-tile):focus{outline:none}:is(.single-choice,.runner-answer-options,.answer-options,.choice-grid)[role="radiogroup"] :is([role="radio"],[data-answer-option],.answer-option,.choice-tile):focus-visible{outline:3px solid var(--focus-ring,#f59e0b);outline-offset:3px}:is(.single-choice,.runner-answer-options,.answer-options,.choice-grid)[role="radiogroup"] [role="radio"][aria-checked="true"]{background:var(--selected-surface,rgba(37,99,235,.14));border-color:var(--selected-border,#2563eb);box-shadow:inset 0 0 0 2px var(--selected-border,#2563eb)}:is(.single-choice,.runner-answer-options,.answer-options,.choice-grid)[role="radiogroup"] [role="radio"][aria-checked="true"]::after{content:"✓";position:absolute;right:.65rem;top:.5rem;font-weight:900;color:var(--selected-border,#2563eb)}
.mp-dynamic-visual{width:min(100%,46rem);margin-inline:auto}svg.mp-dynamic-visual{display:block;height:auto;max-height:min(60vh,34rem);max-width:100%;overflow:visible}.mp-equation-rows{display:grid;gap:1rem}.mp-equation-row{display:flex;align-items:center;justify-content:center;gap:.65rem;min-height:3.5rem;font-size:clamp(1.5rem,1.15rem + 1vw,2.25rem);font-weight:800}.mp-visual-symbol{display:inline-grid;place-items:center;min-width:1.2em;font-size:1.25em}.mp-visual-operator,.mp-visual-equals{font-weight:500}.mp-rule-box{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap}.mp-rule-node,.mp-rule-operation{display:grid;place-items:center;min-height:3rem;padding:.55rem .9rem;border:2px solid currentColor;border-radius:.75rem;font-weight:800}.mp-rule-operation{background:var(--surface-soft,rgba(127,127,127,.08))}.mp-rule-arrow{font-size:1.6rem}.mp-sequence-row{display:flex;justify-content:center;gap:.55rem;flex-wrap:wrap}.mp-sequence-item{display:grid;place-items:center;min-width:2.5rem;min-height:2.5rem;border:2px solid currentColor;border-radius:999px;font-weight:800}.mp-sequence-item.is-white{background:#fff;color:#111}.mp-sequence-item.is-black{background:#111;color:#fff}.mp-dual-scale{display:grid;gap:1rem}.mp-scale{display:grid;grid-template-columns:minmax(5rem,auto) 1fr auto;align-items:center;gap:.75rem}.mp-scale-track{height:1rem;border:1px solid currentColor;border-radius:999px;overflow:hidden}.mp-scale-fill{height:100%;background:currentColor;opacity:.7}.mp-equal-length-bars{display:grid;gap:.8rem}.mp-equal-bar-row{display:grid;grid-template-columns:minmax(4rem,auto) 1fr;align-items:center;gap:.75rem}.mp-equal-bar-track{display:flex}.mp-equal-bar-segment{min-height:2.5rem;border:2px solid currentColor;display:grid;place-items:center}.mp-coordinate-grid,.mp-angle-diagram,.mp-polygon,.mp-range-chart{display:block;max-width:min(100%,28rem);max-height:min(52vh,31rem);margin-inline:auto}.mp-grid-background{fill:var(--surface,#fff)}.mp-svg-grid{stroke:currentColor;stroke-opacity:.16;stroke-width:1}.mp-svg-axis{stroke:currentColor;stroke-width:2.5}.mp-svg-marker,.mp-svg-shape{stroke:currentColor;stroke-width:3;fill:none}.mp-svg-angle-arc{stroke:currentColor;stroke-width:2;fill:none}.mp-svg-polygon{fill:var(--surface-soft,rgba(37,99,235,.12));stroke:currentColor;stroke-width:3}.mp-grid-target circle{fill:transparent;stroke:var(--accent,#2563eb);stroke-width:3}.mp-grid-point circle{fill:var(--accent,#2563eb)}
.runner-mode-competition-sprint :is(.competition-stage,.competition-runner,.competition-question-stage){width:min(100%,46rem);margin-inline:auto;display:grid;align-content:start;gap:clamp(.7rem,1.7vh,1.25rem)}.runner-mode-competition-sprint :is(.competition-expression,.sprint-expression){min-height:0;padding:clamp(.8rem,2vh,1.4rem);font-size:clamp(2rem,1.5rem + 2vw,3.5rem)}.runner-mode-competition-sprint :is(.competition-answer-grid,.keypad,.choice-grid){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.45rem,1.1vw,.8rem);width:min(100%,32rem);margin-inline:auto}.runner-mode-competition-sprint :is(.competition-answer-grid,.keypad,.choice-grid)>*{height:clamp(3.25rem,8.5vh,5.2rem);min-height:44px;font-size:clamp(1.25rem,1rem + 1vw,2rem);display:grid;place-items:center}.runner-mode-competition-sprint :is(input,.typed-answer){width:min(100%,32rem);margin-inline:auto}
.mp-profile-compact{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem;align-items:start}.mp-profile-compact>[data-profile-section="identity"]{grid-column:span 7}.mp-profile-compact>[data-profile-section="theme"]{grid-column:span 5}.mp-profile-compact>[data-profile-section="progress"]{grid-column:1/-1}.mp-profile-compact [data-profile-section]{margin:0;min-height:0}.mp-completion-child-view .completion-primary-actions{display:flex;gap:.75rem;flex-wrap:wrap}.completion-action-primary,.completion-action-secondary{min-height:44px}.completion-more-actions{margin-top:.75rem}.completion-more-actions>summary{cursor:pointer;min-height:44px;display:inline-flex;align-items:center}.completion-more-actions :is(a,button){display:block;margin:.4rem 0}.mp-detailed-summary{width:min(94vw,72rem);max-width:72rem}.mp-detailed-summary :is([data-response-record],.question-review,.summary-question){padding:1rem;border-bottom:1px solid var(--border-subtle,rgba(127,127,127,.25))}.mp-detailed-summary :is([data-response-record],.question-review,.summary-question) :is(.card,.panel) :is(.card,.panel){border:0;padding:0;box-shadow:none}
@media (max-width:760px){.runner-structured-prompt{gap:.6rem}.runner-mode-compact-numeric .runner-prompt-question{font-size:clamp(2rem,9vw,3rem)}.mp-profile-compact{grid-template-columns:1fr}.mp-profile-compact>[data-profile-section]{grid-column:1}.mp-rule-box{gap:.4rem}.mp-rule-arrow{font-size:1.25rem}.runner-mode-competition-sprint :is(.competition-answer-grid,.keypad,.choice-grid)>*{height:clamp(3.25rem,13vw,4.5rem)}.mp-detailed-summary{width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem)}}

/* W18C-FIX-R1: keep the practice runner root as the mobile scroll container below the focus topbar. */
@media (max-width: 1100px) {
  .student-shell--runner-shell > .student-shell__body--runner {
    padding-block-start: calc(
      var(--header-height, 52px) + env(safe-area-inset-top, 0px) + 8px
    );
  }
  .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    min-height: 0;
    height: auto;
    max-height: calc(
      100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) - 12px
    );
    overflow-x: clip;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-padding-top: 12px;
    scroll-padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
}
/* W18C-FIX-R1: terminal mobile runner shell ownership after all readable sizing branches. */
@media (max-width: 1100px) {
  body.portal-student .student-shell--runner-shell {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    align-content: stretch;
    align-items: stretch;
    min-height: 100vh;
    min-height: 100svh;
    min-height: 100dvh;
    height: 100vh;
    height: 100svh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100svh;
    max-height: 100dvh;
    padding-block: 0;
    overflow: hidden;
  }
  body.portal-student
    .student-shell--runner-shell
    > .student-shell__body--runner {
    min-height: 0;
    height: auto;
    max-height: none;
    padding-block-start: 8px;
    overflow: hidden;
  }
  body.portal-student
    .student-shell--runner-shell
    .student-page-content--focus-shell,
  body.portal-student
    .student-shell--runner-shell
    .student-focus-shell__body--runner,
  body.portal-student .student-shell--runner-shell .student-focus-shell__runner,
  body.portal-student
    .student-shell--runner-shell
    .student-page-content--runner {
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: visible;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    min-height: 0;
    height: auto;
    max-height: calc(
      100dvh - var(--mp-runner-topbar-height, var(--header-height, 52px)) -
        env(safe-area-inset-top, 0px) - 16px
    );
    overflow-x: clip;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-padding-top: 12px;
    scroll-padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
}

/* W18C-FIX-R1: keep EYFS visual-shape actions inside short landscape viewports. */
@media (max-width: 1100px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"] {
    gap: 4px !important;
    padding: 4px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    scroll-padding-bottom: calc(
      72px + env(safe-area-inset-bottom, 0px)
    ) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    gap: 4px !important;
    min-height: 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-question-card-v2 {
    padding: 6px 8px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    :is(
      .runner-question-head-v2,
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-answer-body-v2,
      .runner-answer-panel-v2,
      .visual-answer-shell
    ) {
    gap: 4px !important;
    min-height: 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-prompt__main {
    font-size: clamp(1rem, 4.5dvh, 1.22rem) !important;
    line-height: 1.05 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2 {
    max-height: 132px !important;
    overflow: visible !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2
    :is(.visual-scene, .visual-svg, svg) {
    height: 132px !important;
    max-height: 132px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-answer-body-v2,
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2 {
    padding: 4px 6px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .visual-answer-shell__helper {
    font-size: 0.82rem !important;
    line-height: 1.15 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2 {
    padding: 4px 0 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-commandbar-v2 {
    gap: 6px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-command-button-v2 {
    min-height: 48px !important;
    padding: 4px 8px !important;
  }
}

/* MP 19.9.02: render exactly one theme-appropriate brand lockup globally. */
.mp-brand-lockup .mp-brand-lockup__image--dark {
  display: none;
}

html[data-appearance="dark"] .mp-brand-lockup .mp-brand-lockup__image--light {
  display: none;
}

html[data-appearance="dark"] .mp-brand-lockup .mp-brand-lockup__image--dark {
  display: block;
}
/* W40B R6.1: typed-keypad runners keep keypad rows separate from command navigation. */
@media (max-width: 380px) and (max-height: 680px) and (orientation: portrait) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    ) {
    gap: 2px !important;
    padding-bottom: calc(2px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-stage-v2 {
    grid-template-rows: minmax(44px, 0.14fr) minmax(0, 0.86fr) !important;
    gap: 2px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-answer-panel-v2 {
    grid-template-rows: minmax(24px, auto) minmax(0, 1fr) !important;
    padding: 4px 6px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    :is(
      .runner-answer-body-v2,
      .runner-answer-tools-v2,
      .runner-keyboard,
      .runner-keyboard-wrap,
      .runner-keyboard-row
    ) {
    gap: 2px !important;
    min-height: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard {
    grid-template-rows: repeat(4, minmax(30px, 1fr)) !important;
    max-height: 132px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard-row
    .btn {
    min-height: 0 !important;
    height: 30px !important;
    max-height: 30px !important;
    padding: 2px 6px !important;
    line-height: 1 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-commandbar-wrap-v2 {
    padding-top: 5px !important;
  }
}

@media (min-width: 701px) and (max-width: 900px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    ) {
    gap: 2px !important;
    padding-top: 2px !important;
    padding-bottom: calc(2px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(230px, 0.52fr) !important;
    gap: 4px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-answer-panel-v2 {
    grid-template-rows: minmax(24px, auto) minmax(0, 1fr) !important;
    padding: 4px 6px !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    :is(
      .runner-answer-body-v2,
      .runner-answer-tools-v2,
      .runner-keyboard,
      .runner-keyboard-wrap,
      .runner-keyboard-row
    ) {
    gap: 2px !important;
    min-height: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard {
    grid-template-rows: repeat(4, minmax(28px, 1fr)) !important;
    max-height: 126px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard-row
    .btn {
    min-height: 0 !important;
    height: 28px !important;
    max-height: 28px !important;
    padding: 2px 5px !important;
    line-height: 1 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-commandbar-wrap-v2 {
    padding-top: 0 !important;
    transform: translateY(-12px) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-command-button-v2 {
    min-height: 34px !important;
    padding: 3px 7px !important;
    line-height: 1.05 !important;
  }
}
/* W18C-FIX-R1: keep visual choice runners actionable in short-wide landscape. */
@media (min-width: 701px) and (max-width: 900px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice]) {
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    gap: 4px !important;
    height: calc(
      100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) - 10px
    ) !important;
    max-height: calc(
      100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) - 10px
    ) !important;
    overflow: hidden !important;
    padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-status-v2 {
    min-height: 28px !important;
    padding: 2px 6px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.6fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    gap: 5px !important;
    align-items: stretch !important;
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    :is(
      .runner-question-card-v2,
      .runner-answer-panel-v2,
      .runner-answer-body-v2
    ) {
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: auto !important;
    padding: 5px 7px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    :is(
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2
    ) {
    gap: 4px !important;
    min-height: 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-prompt__main {
    font-size: clamp(1rem, 4.4dvh, 1.2rem) !important;
    line-height: 1.08 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    :is(
      .runner-visual-panel-v2,
      .visual-scene,
      .visual-scene__stage,
      .visual-svg,
      svg
    ) {
    max-height: 150px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    :is(.options-grid, [data-option-grid]) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(34px, auto) !important;
    gap: 4px !important;
    max-height: none !important;
    overflow: visible !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    :is(.option-chip, .option-chip--tile, .runner-answer-button-v2) {
    min-height: 34px !important;
    padding: 4px 6px !important;
    font-size: 0.84rem !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-commandbar-wrap-v2 {
    padding: 2px 0 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-commandbar-v2 {
    gap: 4px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-command-button-v2 {
    min-height: 32px !important;
    padding: 3px 6px !important;
    font-size: 0.82rem !important;
  }
}
/* W18C-FIX-R1: keep visual typed-keypad runners actionable in short-wide landscape. */
@media (min-width: 701px) and (max-width: 900px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"] {
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    gap: 4px !important;
    height: calc(
      100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) - 10px
    ) !important;
    max-height: calc(
      100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) - 10px
    ) !important;
    overflow: hidden !important;
    padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-status-v2 {
    min-height: 28px !important;
    padding: 2px 6px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(226px, 0.58fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    gap: 5px !important;
    align-items: stretch !important;
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    :is(.runner-question-card-v2, .runner-answer-panel-v2) {
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: auto !important;
    padding: 5px 7px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    :is(
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2
    ) {
    gap: 3px !important;
    min-height: 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-prompt__main {
    font-size: clamp(1rem, 4.4dvh, 1.2rem) !important;
    line-height: 1.08 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    :is(
      .runner-visual-panel-v2,
      .visual-scene,
      .visual-scene__stage,
      .visual-svg
    ) {
    max-height: 150px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-answer-panel-v2 {
    grid-template-rows: 28px minmax(0, 1fr) auto !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-answer-dock-head-v2 {
    min-height: 28px !important;
    padding: 2px 5px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    :is(.runner-answer-field input, [data-answer-input]) {
    min-height: 34px !important;
    padding: 3px 7px !important;
    font-size: 0.94rem !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2 {
    gap: 3px !important;
    padding: 3px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2
    :is(.runner-keyboard, .runner-keyboard-wrap, .runner-keyboard-row) {
    gap: 3px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2
    .runner-keyboard {
    grid-template-rows: repeat(4, minmax(28px, 1fr)) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    :is(
      .runner-answer-tools-v2 .runner-keyboard-row .btn,
      .runner-command-button-v2
    ) {
    min-height: 30px !important;
    padding: 3px 6px !important;
    font-size: 0.8rem !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-commandbar-wrap-v2 {
    padding: 2px 0 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:not(
      [data-stimulus-variant="none"]
    )[data-dock-variant="typed-keypad"]
    .runner-commandbar-v2 {
    gap: 4px !important;
  }
}
/* W18C-FIX-R1: short landscape EYFS visual tasks use side-by-side flow. */
@media (max-width: 1100px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"] {
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-eyfs-progress {
    display: none !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.58fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    :is(.runner-question-card-v2, .runner-answer-body-v2) {
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    :is(.runner-question-body-v2, .runner-question-stage-v2) {
    align-content: center !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2 {
    display: grid !important;
    place-items: center !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2
    :is(.visual-scene, .visual-svg, svg) {
    width: 100% !important;
    height: min(190px, 51dvh) !important;
    max-height: 100% !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-answer-body-v2 {
    align-self: stretch !important;
    overflow-y: auto !important;
  }
}
@media (max-width: 640px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(172px, 0.72fr) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--eyfs[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2
    :is(.visual-scene, .visual-svg, svg) {
    height: min(142px, 44dvh) !important;
  }
}
/* W18C-FIX-R1: Year 1 young-kids visual tasks need the same short landscape flow. */
@media (max-width: 1100px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"] {
    grid-template-rows: minmax(0, 1fr) auto !important;
    gap: 4px !important;
    padding: 4px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.58fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    gap: 4px !important;
    align-items: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    :is(.runner-question-card-v2, .runner-answer-body-v2) {
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    :is(.runner-question-body-v2, .runner-question-stage-v2) {
    align-content: center !important;
    gap: 4px !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-question-card-v2,
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-answer-body-v2,
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-answer-panel-v2 {
    padding: 4px 6px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-prompt__main {
    font-size: clamp(1rem, 4.5dvh, 1.22rem) !important;
    line-height: 1.05 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-visual-panel-v2 {
    display: grid !important;
    place-items: center !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-visual-panel-v2
    :is(.visual-scene, .visual-svg, svg) {
    width: 100% !important;
    height: min(190px, 51dvh) !important;
    max-height: 100% !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-answer-body-v2 {
    align-self: stretch !important;
    overflow-y: auto !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-commandbar-wrap-v2 {
    padding: 4px 0 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-command-button-v2 {
    min-height: 48px !important;
    padding: 4px 8px !important;
  }
}
@media (max-width: 640px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(172px, 0.72fr) !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2--kids-view[data-runner-form-factor="touch-stack"][data-answer-mode="interactive"]
    .runner-visual-panel-v2
    :is(.visual-scene, .visual-svg, svg) {
    height: min(142px, 44dvh) !important;
  }
}
/* W18C-FIX-R1: keep non-visual choice runners reachable in phone landscape. */
@media (max-width: 700px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    ) {
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    gap: 4px !important;
    padding: 4px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    .runner-status-v2 {
    min-height: 30px !important;
    padding: 2px 6px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    .runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(172px, 0.72fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    gap: 4px !important;
    align-items: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    :is(.runner-question-card-v2, .runner-answer-body-v2) {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: auto !important;
    padding: 5px 7px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    :is(
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-answer-panel-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2
    ) {
    gap: 4px !important;
    min-height: 0 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    .runner-prompt__main {
    font-size: clamp(1rem, 4.7dvh, 1.18rem) !important;
    line-height: 1.08 !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    :is(.option-chip, .runner-command-button-v2) {
    min-height: 44px !important;
    padding: 4px 8px !important;
  }
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-stimulus-variant="none"]:is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    .runner-commandbar-wrap-v2 {
    padding: 4px 0 0 !important;
  }
}
/* W40B R6.1 terminal cascade: loaded runtime CSS must keep typed keypads out of command bars. */
@media (max-width: 380px) and (max-height: 680px) and (orientation: portrait) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    :is(
      .runner-answer-body-v2,
      .runner-answer-tools-v2,
      .runner-keyboard,
      .runner-keyboard-wrap,
      .runner-keyboard-row
    ) {
    gap: 2px !important;
    min-height: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard {
    grid-template-rows: repeat(4, minmax(30px, 1fr)) !important;
    max-height: 132px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard-row
    .btn {
    min-height: 0 !important;
    height: 30px !important;
    max-height: 30px !important;
    padding: 2px 6px !important;
    line-height: 1 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-commandbar-wrap-v2 {
    padding-top: 5px !important;
  }
}

@media (min-width: 701px) and (max-width: 900px) and (max-height: 430px) and (orientation: landscape) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    :is(
      .runner-answer-body-v2,
      .runner-answer-tools-v2,
      .runner-keyboard,
      .runner-keyboard-wrap,
      .runner-keyboard-row
    ) {
    gap: 2px !important;
    min-height: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard {
    grid-template-rows: repeat(4, minmax(28px, 1fr)) !important;
    max-height: 126px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-keyboard-row
    .btn {
    min-height: 0 !important;
    height: 28px !important;
    max-height: 28px !important;
    padding: 2px 5px !important;
    line-height: 1 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-commandbar-wrap-v2 {
    padding-top: 0 !important;
    transform: translateY(-12px) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2:not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:has(
      [data-runner-keyboard]
    )
    .runner-command-button-v2 {
    min-height: 34px !important;
    padding: 3px 7px !important;
    line-height: 1.05 !important;
  }
}
/* W41G: standard practice/assignment runner no-jump viewport shell. */
body.portal-student .student-shell--runner-shell {
  --mp-runner-no-jump-height: calc(
    100dvh - var(--mp-runner-topbar-height, var(--header-height, 72px)) -
      env(safe-area-inset-top, 0px) - 16px
  );
}

body.portal-student
  .student-shell--runner-shell
  :is(
    .student-shell__body--runner,
    .student-page-content--focus-shell,
    .student-focus-shell__body--runner,
    .student-focus-shell__runner,
    .student-page-content--runner
  ) {
  min-height: 0;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]) {
  min-height: 0;
  height: var(--mp-runner-no-jump-height);
  max-height: var(--mp-runner-no-jump-height);
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  contain: layout paint;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  :is(
    .runner-stage-v2,
    .runner-question-card-v2,
    .runner-question-body-v2,
    .runner-question-stage-v2,
    .runner-response-zone-v2,
    .runner-answer-panel-v2,
    .runner-answer-body-v2,
    .runner-answer-stage-v2,
    .runner-answer-stack-v2
  ) {
  min-height: 0;
  max-height: 100%;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-stage-v2 {
  height: 100%;
  overflow: hidden;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  :is(.runner-question-card-v2, .runner-answer-panel-v2) {
  overflow: auto;
  overscroll-behavior: contain;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-visual-panel-v2 {
  display: grid;
  place-items: center;
  min-height: 0;
  overflow: hidden;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-visual-panel-v2
  :is(.visual-scene, .visual-scene__stage, .visual-svg, svg) {
  max-width: 100%;
  max-height: min(var(--runner-visual-max-h, 54dvh), 100%);
}

/* W41G-R2: keep standard touch-stack runner commands inside the required viewports. */
@media (max-width: 820px) {
  body.portal-student .student-shell--runner-shell {
    --mp-runner-no-jump-height: calc(
      100dvh - var(--mp-runner-topbar-height, var(--header-height, 72px)) -
        env(safe-area-inset-top, 0px) - 8px
    );
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"] {
    gap: 6px !important;
    padding: 5px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    --runner-mobile-command-height: 42px;
    --runner-visual-max-h: min(48dvh, 520px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    display: grid !important;
    grid-template-rows: minmax(0, 0.64fr) minmax(0, 0.36fr) !important;
    gap: 6px !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    :is(.runner-question-card-v2, .runner-answer-panel-v2) {
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
    padding: 7px 8px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    :is(
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2
    ) {
    min-height: 0 !important;
    gap: 5px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-question-body-v2,
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-answer-body-v2 {
    overflow: auto !important;
    overscroll-behavior: contain !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-answer-panel-v2 {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) var(--runner-mobile-command-height) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-commandbar-wrap-v2 {
    align-self: end !important;
    min-height: var(--runner-mobile-command-height) !important;
    padding: 3px 0 0 !important;
    overflow: visible !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-commandbar-v2 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 5px !important;
    min-height: 38px !important;
    height: 38px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-command-button-v2 {
    min-width: 0 !important;
    min-height: 38px !important;
    height: 38px !important;
    padding: 2px 5px !important;
    font-size: 0.78rem !important;
    line-height: 1.05 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-command-icon-v2 {
    width: 14px !important;
    height: 14px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-prompt__main {
    line-height: 1.12 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"] {
    --runner-mobile-command-height: 40px;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]
    :is(.runner-answer-field input, [data-answer-input]) {
    min-height: 40px !important;
    padding: 5px 8px !important;
    font-size: 0.92rem !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2 {
    gap: 3px !important;
    padding: 3px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2
    :is(.runner-keyboard, .runner-keyboard-wrap, .runner-keyboard-row) {
    gap: 3px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2
    .runner-keyboard {
    grid-template-rows: repeat(4, minmax(26px, 1fr)) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]
    .runner-answer-tools-v2
    .runner-keyboard-row
    .btn {
    min-height: 26px !important;
    height: 26px !important;
    padding: 1px 4px !important;
    font-size: 0.76rem !important;
  }
}

@media (max-width: 380px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"] {
    gap: 5px !important;
    padding-inline: 6px !important;
    --runner-visual-max-h: min(34dvh, 190px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 0.46fr) minmax(0, 0.54fr) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-prompt__main {
    font-size: 0.98rem !important;
  }
}

/* W41G-R3: enforce command hit targets on every standard mobile runner form factor. */
@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --runner-mobile-command-height: 46px;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-answer-panel-v2 {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) var(--runner-mobile-command-height) !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-answer-body-v2 {
    min-height: 0 !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-commandbar-wrap-v2 {
    align-self: end !important;
    min-height: var(--runner-mobile-command-height) !important;
    padding: 3px 0 0 !important;
    overflow: visible !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-commandbar-v2 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    min-height: 42px !important;
    height: 42px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-command-button-v2 {
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 2px 4px !important;
    font-size: 0.74rem !important;
    line-height: 1.05 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-command-button-v2
    span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

/* W41G-R4: override legacy choice-runner compression that made command buttons too short. */
@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-commandbar-v2
    > button.runner-command-button-v2,
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]:has([data-answer-choice])
    .runner-commandbar-v2
    > .runner-command-button-v2:is(
      [data-runner-prev],
      [data-runner-previous],
      [data-runner-skip],
      [data-runner-next],
      [data-runner-submit]
    ) {
    min-height: 40px !important;
    height: 40px !important;
    min-block-size: 40px !important;
    block-size: 40px !important;
    max-height: none !important;
    padding: 2px 4px !important;
    align-self: stretch !important;
  }
}

/* W41G-R5: keep generated geometry visuals contained inside the question card. */
@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-question-card-v2 {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    :is(.runner-question-body-v2, .runner-question-stage-v2) {
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-question-stage-v2 {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2 {
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not(
      [data-session-kind="competition"]
    )[data-runner-form-factor="touch-stack"]
    .runner-visual-panel-v2
    :is(.visual-card, .visual-scene, .visual-scene__stage, .visual-svg, svg) {
    max-height: 100% !important;
    min-height: 0 !important;
  }
}

/* W41G-R6: prevent narrow answer choices from collapsing into letter-by-letter labels. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(.options-grid, [data-option-grid]) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(
      .option-chip,
      .option-chip--tile,
      .option-chip--single,
      .runner-answer-button-v2
    ) {
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 5px 6px !important;
    font-size: 0.76rem !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(
      .option-chip,
      .option-chip--tile,
      .option-chip--single,
      .runner-answer-button-v2
    )
    > span {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    text-wrap: balance !important;
  }
}

/* W41G-R7: keep narrow choice grids out of the runner command row. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    :is(
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2
    ) {
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(.options-grid, [data-option-grid]) {
    height: 100% !important;
    max-height: 100% !important;
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(0, 1fr) !important;
    align-content: stretch !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(
      .option-chip,
      .option-chip--tile,
      .option-chip--single,
      .runner-answer-button-v2
    ) {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}

/* W41G-R8: use a compact fixed-height choice grid above the commandbar on 320px-class screens. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(.options-grid, [data-option-grid]) {
    height: auto !important;
    max-height: 90px !important;
    grid-template-rows: repeat(2, minmax(0, 42px)) !important;
    grid-auto-rows: minmax(0, 42px) !important;
    align-content: start !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2
    :is(
      .option-chip,
      .option-chip--tile,
      .option-chip--single,
      .runner-answer-button-v2
    ) {
    height: 42px !important;
    min-height: 0 !important;
    max-height: 42px !important;
    padding: 3px 5px !important;
    font-size: 0.72rem !important;
    line-height: 1.04 !important;
  }
}

/* W41G-R9: reserve stable narrow choice-panel height so options never sit under commands. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2 {
    min-height: 201px !important;
  }
}

/* W41G-R10: reserve the answer row at the stage level for narrow choice runners. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) 201px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):has([data-answer-choice])
    .runner-answer-panel-v2 {
    height: 201px !important;
    min-height: 201px !important;
    max-height: 201px !important;
  }
}

/* W41G-R11: apply narrow choice-row reservation to every option-grid renderer. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):is(
      :has(.options-grid),
      :has([data-option-grid])
    )
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) 201px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):is(
      :has(.options-grid),
      :has([data-option-grid])
    )
    .runner-answer-panel-v2 {
    height: 201px !important;
    min-height: 201px !important;
    max-height: 201px !important;
  }
}

/* W41G-R12: answer-mode fallback for standard narrow choice runners. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) 201px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):is(
      [data-answer-mode="select"],
      [data-answer-mode="pick-grid"]
    )
    .runner-answer-panel-v2 {
    height: 201px !important;
    min-height: 201px !important;
    max-height: 201px !important;
  }
}

/* W41G-R13: default 320px-class standard runners to a reserved answer row. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) 201px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-answer-panel-v2 {
    height: 201px !important;
    min-height: 201px !important;
    max-height: 201px !important;
  }
}

/* W41G-R14: specificity match for touch-stack stage row reservation. */
@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) 201px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-answer-panel-v2 {
    height: 201px !important;
    min-height: 201px !important;
    max-height: 201px !important;
  }
}

/* W41G-R15: keep desktop answer choices above the command row. */
@media (min-width: 821px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):is([data-answer-mode="select"], [data-answer-mode="pick-grid"]):has(
      [data-answer-choice]
    )
    .runner-answer-panel-v2 {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):is([data-answer-mode="select"], [data-answer-mode="pick-grid"]):has(
      [data-answer-choice]
    )
    :is(
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2
    ) {
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):is([data-answer-mode="select"], [data-answer-mode="pick-grid"]):has(
      [data-answer-choice]
    )
    .runner-answer-panel-v2
    :is(.options-grid, [data-option-grid]) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: repeat(
      var(--option-grid-rows, 4),
      minmax(0, 1fr)
    ) !important;
    grid-auto-rows: minmax(0, 1fr) !important;
    gap: clamp(8px, 1.2dvh, 12px) !important;
    align-content: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
    padding: 0 !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):is([data-answer-mode="select"], [data-answer-mode="pick-grid"]):has(
      [data-answer-choice]
    )
    .runner-answer-panel-v2
    :is(
      .option-chip,
      .option-chip--tile,
      .option-chip--single,
      .runner-answer-button-v2
    ) {
    display: grid !important;
    place-items: center !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 8px 10px !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):is([data-answer-mode="select"], [data-answer-mode="pick-grid"]):has(
      [data-answer-choice]
    )
    .runner-answer-panel-v2
    :is(
      .option-chip,
      .option-chip--tile,
      .option-chip--single,
      .runner-answer-button-v2
    )
    > span {
    min-height: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    line-height: 1.08 !important;
  }
}

/* W41I: center and scale simple arithmetic prompts in the shared runner shell. */
body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-question-card-v2 {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  overflow: hidden !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  :is(.runner-question-body-v2, .runner-question-stage-v2) {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  align-content: center !important;
  align-items: center !important;
  justify-content: center !important;
  justify-items: center !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-prompt {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: clamp(12px, 3dvh, 32px) !important;
  text-align: center !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-prompt__main {
  display: block !important;
  width: 100% !important;
  max-width: min(100%, 18ch) !important;
  margin: 0 auto !important;
  text-align: center !important;
  font-size: clamp(2rem, 7dvh, 4.75rem) !important;
  line-height: 1.04 !important;
  font-weight: 850 !important;
}

@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) 201px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-prompt__main {
    font-size: clamp(1.85rem, 6.4dvh, 4rem) !important;
  }
}

@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-prompt__main {
    font-size: clamp(2.375rem, 7dvh, 5.25rem) !important;
  }
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  ) {
  min-height: calc(
    100dvh - var(--mp-runner-topbar-height, var(--header-height, 72px)) -
      env(safe-area-inset-top, 0px) - 8px
  ) !important;
  height: calc(
    100dvh - var(--mp-runner-topbar-height, var(--header-height, 72px)) -
      env(safe-area-inset-top, 0px) - 8px
  ) !important;
  align-content: stretch !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-stage-v2 {
  min-height: 0 !important;
  height: 100% !important;
  align-items: stretch !important;
}

@media (max-width: 430px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-question-card-v2 {
    min-height: 0 !important;
    height: 100% !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    ) {
    --w41i-equation-keypad-panel-height: clamp(302px, 38dvh, 332px);
    --runner-mobile-command-height: 42px;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-stage-v2 {
    grid-template-rows: minmax(120px, 1fr) var(
        --w41i-equation-keypad-panel-height
      ) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-question-card-v2 {
    min-height: 120px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-answer-panel-v2 {
    height: var(--w41i-equation-keypad-panel-height) !important;
    min-height: var(--w41i-equation-keypad-panel-height) !important;
    max-height: var(--w41i-equation-keypad-panel-height) !important;
    grid-template-rows: auto minmax(0, 1fr) var(--runner-mobile-command-height) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    :is(
      .runner-answer-stage-v2,
      .runner-answer-stack-v2,
      .runner-answer-tools-v2,
      .runner-keyboard-wrap,
      .runner-keyboard
    ) {
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-keyboard {
    display: grid !important;
    grid-template-rows: repeat(4, minmax(28px, 1fr)) !important;
    gap: 4px !important;
  }
}

/* W41I-R2: keep simple arithmetic typed keypads fully visible on tablet and desktop runner shells. */
body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-question-card-v2 {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-question-stage-v2 {
  display: grid !important;
  min-height: 0 !important;
  height: 100% !important;
  place-items: center !important;
  overflow: hidden !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-prompt {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  place-items: center !important;
  margin: 0 !important;
  text-align: center !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root].runner--prompt-equation:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]):not(.runner--geometry):not(
    .runner--coordinates
  )
  .runner-prompt__main {
  width: 100% !important;
  max-width: min(100%, 18ch) !important;
  margin: 0 auto !important;
  text-align: center !important;
  font-size: clamp(2.2rem, 7dvh, 5.25rem) !important;
  line-height: 1.04 !important;
  font-weight: 850 !important;
}

@media (min-width: 431px) and (max-width: 820px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    ) {
    --w41i-equation-keypad-panel-height: clamp(340px, 34dvh, 390px);
    --runner-mobile-command-height: 54px;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-stage-v2 {
    grid-template-rows: minmax(260px, 1fr) var(
        --w41i-equation-keypad-panel-height
      ) !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-answer-panel-v2 {
    height: var(--w41i-equation-keypad-panel-height) !important;
    min-height: var(--w41i-equation-keypad-panel-height) !important;
    max-height: var(--w41i-equation-keypad-panel-height) !important;
    grid-template-rows: auto minmax(0, 1fr) var(--runner-mobile-command-height) !important;
  }
}

@media (min-width: 821px) and (orientation: portrait) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(360px, 1fr) clamp(540px, 40dvh, 620px) !important;
    gap: 10px !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root].runner--prompt-equation[data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]):not(.runner--geometry):not(
      .runner--coordinates
    )
    .runner-answer-panel-v2 {
    width: 100% !important;
    max-width: none !important;
    height: clamp(540px, 40dvh, 620px) !important;
    min-height: clamp(540px, 40dvh, 620px) !important;
    max-height: clamp(540px, 40dvh, 620px) !important;
  }
}

/* W41J: restore stable outer runner slots across normal practice/assignment question families. */
body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"]) {
  --w41j-answer-slot-height: clamp(302px, 38dvh, 332px);
  --w41j-commandbar-slot-height: 46px;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-stage-v2 {
  display: grid !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  align-items: stretch !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  :is(.runner-question-card-v2, .runner-answer-panel-v2) {
  align-self: stretch !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-answer-panel-v2 {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) var(--w41j-commandbar-slot-height) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  :is(
    .runner-answer-body-v2,
    .runner-answer-stage-v2,
    .runner-answer-stack-v2,
    .runner-answer-tools-v2,
    .runner-keyboard-wrap,
    .runner-keyboard
  ) {
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-commandbar-wrap-v2 {
  align-self: end !important;
  min-height: var(--w41j-commandbar-slot-height) !important;
  height: var(--w41j-commandbar-slot-height) !important;
  max-height: var(--w41j-commandbar-slot-height) !important;
  padding: 3px 0 0 !important;
  overflow: visible !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-commandbar-v2 {
  min-height: calc(var(--w41j-commandbar-slot-height) - 6px) !important;
  height: calc(var(--w41j-commandbar-slot-height) - 6px) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-question-card-v2 {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  :is(.runner-question-body-v2, .runner-question-stage-v2) {
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-question-stage-v2 {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  align-items: stretch !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2[data-runner-root]:not(
    .runner-shell-v2--competition-sprint
  ):not([data-session-kind="competition"])
  .runner-visual-panel-v2 {
  display: grid !important;
  place-items: center !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --w41j-answer-slot-height: clamp(302px, 38dvh, 390px);
    --w41j-commandbar-slot-height: 46px;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) var(--w41j-answer-slot-height) !important;
    gap: 6px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-answer-panel-v2 {
    height: var(--w41j-answer-slot-height) !important;
    min-height: var(--w41j-answer-slot-height) !important;
    max-height: var(--w41j-answer-slot-height) !important;
  }
}

@media (min-width: 431px) and (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --w41j-answer-slot-height: clamp(340px, 34dvh, 390px);
    --w41j-commandbar-slot-height: 54px;
  }
}

@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --w41j-commandbar-slot-height: 58px;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-stage-v2 {
    grid-template-rows: minmax(0, 1fr) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    :is(.runner-question-card-v2, .runner-answer-panel-v2) {
    height: 100% !important;
    max-height: 100% !important;
  }
}

@media (min-width: 821px) and (orientation: portrait) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --w41j-answer-slot-height: clamp(540px, 40dvh, 620px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) var(--w41j-answer-slot-height) !important;
    gap: 10px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-answer-panel-v2 {
    width: 100% !important;
    max-width: none !important;
    height: var(--w41j-answer-slot-height) !important;
    min-height: var(--w41j-answer-slot-height) !important;
    max-height: var(--w41j-answer-slot-height) !important;
  }
}

/* W41J: keep the normal runner shell height stable so short prompt families cannot collapse the outer slots. */
@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2[data-runner-root]:not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --w41j-runner-root-height: calc(
      100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) - 16px
    );
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    height: var(--w41j-runner-root-height) !important;
    min-height: var(--w41j-runner-root-height) !important;
    max-height: var(--w41j-runner-root-height) !important;
    align-content: stretch !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }
}
/* W41L viewport-filling runner layout and geometry clarity fix. */
body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ) {
  --w41l-runner-usable-height: calc(
    100dvh - var(--mp-runner-topbar-height, var(--header-height, 64px)) - 18px -
      env(safe-area-inset-bottom, 0px)
  );
  --w41l-runner-fill-height: min(
    960px,
    max(560px, var(--w41l-runner-usable-height))
  );
}

@media (min-width: 821px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41j-runner-root-height: var(--w41l-runner-fill-height);
    --w41j-desktop-card-slot-height: min(
      900px,
      max(560px, calc(var(--w41j-runner-root-height) - 76px))
    );
    --w41j-desktop-visual-prompt-slot-height: clamp(70px, 9dvh, 118px);
    --w41j-desktop-visual-slot-height: min(
      700px,
      max(
        360px,
        calc(
          var(--w41j-desktop-card-slot-height) -
            var(--w41j-desktop-visual-prompt-slot-height) - 28px
        )
      )
    );
    height: var(--w41j-runner-root-height) !important;
    min-height: var(--w41j-runner-root-height) !important;
    max-height: var(--w41j-runner-root-height) !important;
    align-content: stretch !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-stage-v2.runner-stage-v2 {
    grid-template-rows: var(--w41j-desktop-card-slot-height) !important;
    align-content: start !important;
    align-items: stretch !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    :is(.runner-question-card-v2, .runner-answer-panel-v2) {
    height: var(--w41j-desktop-card-slot-height) !important;
    min-height: var(--w41j-desktop-card-slot-height) !important;
    max-height: var(--w41j-desktop-card-slot-height) !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-question-stage-v2.runner-question-stage-v2 {
    grid-template-rows: var(--w41j-desktop-visual-prompt-slot-height) minmax(
        0,
        var(--w41j-desktop-visual-slot-height)
      ) !important;
    align-content: stretch !important;
    align-items: stretch !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-visual-panel-v2.runner-visual-panel-v2 {
    height: var(--w41j-desktop-visual-slot-height) !important;
    min-height: var(--w41j-desktop-visual-slot-height) !important;
    max-height: var(--w41j-desktop-visual-slot-height) !important;
    overflow: visible !important;
    display: grid !important;
    place-items: center !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="desktop-rail"][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.visual-svg--grid) {
    --runner-coordinate-board-size: min(
      680px,
      100%,
      calc(var(--w41j-desktop-visual-slot-height) - 4px)
    );
  }
}

@media (max-width: 820px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41j-runner-root-height: max(
      560px,
      calc(
        100dvh - var(--header-height, 52px) - env(safe-area-inset-top, 0px) -
          14px - env(safe-area-inset-bottom, 0px)
      )
    );
    --w41j-answer-slot-height: clamp(300px, 39dvh, 410px);
    --w41l-question-slot-height: max(
      196px,
      calc(
        var(--w41j-runner-root-height) - var(--w41j-answer-slot-height) - 58px
      )
    );
    height: var(--w41j-runner-root-height) !important;
    min-height: var(--w41j-runner-root-height) !important;
    max-height: var(--w41j-runner-root-height) !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-stage-v2.runner-stage-v2 {
    grid-template-rows: minmax(var(--w41l-question-slot-height), 1fr) var(
        --w41j-answer-slot-height
      ) !important;
    align-content: stretch !important;
    align-items: stretch !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2) {
    --w41j-visual-prompt-slot-height: clamp(50px, 8dvh, 86px);
    --w41j-visual-slot-height: max(
      160px,
      min(
        520px,
        calc(
          var(--w41l-question-slot-height) -
            var(--w41j-visual-prompt-slot-height) - 14px
        )
      )
    );
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-question-stage-v2.runner-question-stage-v2 {
    grid-template-rows: var(--w41j-visual-prompt-slot-height) minmax(
        0,
        var(--w41j-visual-slot-height)
      ) !important;
    align-content: stretch !important;
    align-items: stretch !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-visual-panel-v2.runner-visual-panel-v2 {
    height: var(--w41j-visual-slot-height) !important;
    min-height: var(--w41j-visual-slot-height) !important;
    max-height: var(--w41j-visual-slot-height) !important;
    display: grid !important;
    place-items: center !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.visual-svg--grid) {
    --runner-coordinate-board-size: min(
      620px,
      calc(100vw - 32px),
      calc(var(--w41j-visual-slot-height) - 4px)
    );
  }
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has(.visual-svg--grid)
  .visual-card--grid {
  width: min(100%, var(--runner-coordinate-board-size)) !important;
  height: min(100%, var(--runner-coordinate-board-size)) !important;
  aspect-ratio: 1 / 1 !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has(.visual-svg--grid)
  .visual-svg--grid {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has(.runner-visual-panel-v2)
  .runner-visual-panel-v2
  :is(.visual-card, .visual-scene, .visual-scene__stage, .visual-svg, svg) {
  max-width: 100% !important;
  max-height: 100% !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root]
  :is(.visual-circle-arc-highlight, .visual-circle-edge-highlight) {
  fill: none !important;
  opacity: 1 !important;
  stroke: #5267df !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 10px !important;
  vector-effect: non-scaling-stroke !important;
}
/* W41L short-landscape visual runner fill. */
@media (min-width: 700px) and (max-height: 760px) and (orientation: landscape) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2) {
    --w41j-runner-root-height: calc(
      100dvh - 16px - env(safe-area-inset-bottom, 0px)
    );
    --w41j-commandbar-slot-height: 50px;
    --w41l-short-landscape-card-height: max(
      300px,
      calc(var(--w41j-runner-root-height) - 62px)
    );
    --w41l-short-landscape-visual-prompt-slot-height: clamp(42px, 12dvh, 58px);
    --w41l-short-landscape-visual-slot-height: max(
      170px,
      calc(
        var(--w41l-short-landscape-card-height) -
          var(--w41l-short-landscape-visual-prompt-slot-height) - 18px
      )
    );
    height: var(--w41j-runner-root-height) !important;
    min-height: var(--w41j-runner-root-height) !important;
    max-height: var(--w41j-runner-root-height) !important;
    overflow: hidden !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-stage-v2.runner-stage-v2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.62fr) !important;
    grid-template-rows: var(--w41l-short-landscape-card-height) !important;
    gap: 10px !important;
    height: var(--w41l-short-landscape-card-height) !important;
    min-height: var(--w41l-short-landscape-card-height) !important;
    max-height: var(--w41l-short-landscape-card-height) !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    :is(.runner-question-card-v2, .runner-answer-panel-v2) {
    align-self: stretch !important;
    height: var(--w41l-short-landscape-card-height) !important;
    min-height: var(--w41l-short-landscape-card-height) !important;
    max-height: var(--w41l-short-landscape-card-height) !important;
    overflow: hidden !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-question-stage-v2.runner-question-stage-v2 {
    display: grid !important;
    grid-template-rows: var(
        --w41l-short-landscape-visual-prompt-slot-height
      ) minmax(0, var(--w41l-short-landscape-visual-slot-height)) !important;
    gap: 8px !important;
    align-content: stretch !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-visual-panel-v2)
    .runner-visual-panel-v2.runner-visual-panel-v2 {
    height: var(--w41l-short-landscape-visual-slot-height) !important;
    min-height: var(--w41l-short-landscape-visual-slot-height) !important;
    max-height: var(--w41l-short-landscape-visual-slot-height) !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.visual-svg--grid) {
    --runner-coordinate-board-size: min(
      360px,
      100%,
      calc(100vw - 380px),
      calc(var(--w41l-short-landscape-visual-slot-height) - 4px)
    );
  }
}
/* W41M premium answer panel and commandbar polish. */
body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ) {
  --w41m-action-rise: clamp(8px, 1.3dvh, 14px);
  --w41m-keypad-drop: clamp(6px, 0.9dvh, 10px);
  --w41m-soft-line: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 52%,
    transparent
  );
  --w41m-soft-panel: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 88%,
    var(--bg-canvas, #f4efe5) 12%
  );
  --w41m-soft-hover: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 64%,
    var(--bg-panel, #fffdf9) 36%
  );
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-panel-v2 {
  background: var(--w41m-soft-panel) !important;
  border-color: var(--w41m-soft-line) !important;
  box-shadow: 0 16px 34px rgba(31, 39, 65, 0.045) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-dock-head-v2 {
  border-bottom-color: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 38%,
    transparent
  ) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  :is(.runner-answer-kind-chip-v2, .runner-answer-format) {
  background: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 74%,
    transparent
  ) !important;
  border-color: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 48%,
    transparent
  ) !important;
  box-shadow: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-field__control {
  background: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 88%,
    #ffffff 12%
  ) !important;
  border-color: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 64%,
    transparent
  ) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-field__control:focus-within {
  border-color: var(--student-500, #7b95ff) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 0 0 3px rgba(123, 149, 255, 0.22) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-answer-tools-v2 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin-top: clamp(8px, 1.2dvh, 15px) !important;
  padding: 2px 8px 0 !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  :is(.runner-keyboard-wrap, .runner-keyboard) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard {
  gap: clamp(8px, 1.2dvh, 12px) !important;
  transform: translateY(var(--w41m-keypad-drop)) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row {
  gap: clamp(8px, 1.15dvh, 11px) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  .btn {
  isolation: isolate !important;
  overflow: hidden !important;
  position: relative !important;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel, #fffdf9) 92%, #ffffff 8%),
    color-mix(in srgb, var(--bg-panel-2, #f7f1e8) 90%, #ffffff 10%)
  ) !important;
  border: 1px solid
    color-mix(
      in srgb,
      var(--line-default, rgba(55, 66, 99, 0.2)) 68%,
      transparent
    ) !important;
  border-radius: 14px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 8px 16px rgba(31, 39, 65, 0.055) !important;
  color: var(--text-strong, #223047) !important;
  transition:
    background-color 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease,
    transform 0.14s ease !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  .btn::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--student-100, #eff3ff) 82%, #ffffff 18%),
    color-mix(
      in srgb,
      var(--student-200, #d9e2ff) 62%,
      var(--bg-panel, #fffdf9) 38%
    )
  );
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.14s ease;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  .btn:is(:hover, :focus-visible)::before {
  opacity: 1;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  .btn:is(:hover, :focus-visible) {
  border-color: color-mix(
    in srgb,
    var(--student-500, #7b95ff) 76%,
    var(--line-default, rgba(55, 66, 99, 0.2)) 24%
  ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 0 0 3px rgba(123, 149, 255, 0.17),
    0 10px 20px rgba(63, 94, 163, 0.13) !important;
  transform: translateY(-1px) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  .btn:active {
  transform: translateY(0) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  .btn
  > * {
  position: relative;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-wrap-v2 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 0 max(6px, env(safe-area-inset-bottom, 0px)) !important;
  transform: translateY(calc(-1 * var(--w41m-action-rise))) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  gap: clamp(8px, 1.2dvh, 12px) !important;
  padding: 0 !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > .runner-command-button-v2 {
  border: 0 !important;
  box-shadow: none !important;
  min-width: 0 !important;
  text-decoration: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > :is(.runner-command-button-v2--prev, .runner-command-button-v2--skip) {
  background: transparent !important;
  color: var(--text-strong, #223047) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > :is(.runner-command-button-v2--prev, .runner-command-button-v2--skip):is(
    :hover,
    :focus-visible
  ) {
  background: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 58%,
    transparent
  ) !important;
  box-shadow: 0 0 0 3px rgba(123, 149, 255, 0.12) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > .runner-command-button-v2--next {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--student-500, #7b95ff) 92%, #ffffff 8%),
    var(--student-700, #4e64a8)
  ) !important;
  border: 0 !important;
  box-shadow: 0 10px 18px rgba(63, 94, 163, 0.2) !important;
  color: #ffffff !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > .runner-command-button-v2--next:is(
    :disabled,
    [disabled],
    [aria-disabled="true"]
  ) {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--student-500, #7b95ff) 76%, #ffffff 24%),
    color-mix(
      in srgb,
      var(--student-700, #4e64a8) 84%,
      var(--bg-panel, #fffdf9) 16%
    )
  ) !important;
  border: 0 !important;
  color: #ffffff !important;
  opacity: 0.92 !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  :is(
    .option-chip,
    .option-chip--tile,
    .option-chip--single,
    .runner-answer-button-v2
  ) {
  background: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 78%,
    transparent
  ) !important;
  border-color: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 56%,
    transparent
  ) !important;
  box-shadow: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  :is(
    .option-chip,
    .option-chip--tile,
    .option-chip--single,
    .runner-answer-button-v2
  ):is(:hover, :focus-visible, :focus-within) {
  background: var(--w41m-soft-hover) !important;
  border-color: color-mix(
    in srgb,
    var(--student-500, #7b95ff) 72%,
    var(--line-default, rgba(55, 66, 99, 0.2)) 28%
  ) !important;
  box-shadow: 0 0 0 3px rgba(123, 149, 255, 0.15) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  :is(.option-chip, .option-chip--tile, .option-chip--single):has(:checked) {
  background: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 76%,
    var(--bg-panel, #fffdf9) 24%
  ) !important;
  border-color: var(--student-500, #7b95ff) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    0 0 0 3px rgba(123, 149, 255, 0.16) !important;
}

@media (max-width: 820px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41m-action-rise: clamp(5px, 1dvh, 9px);
    --w41m-keypad-drop: clamp(3px, 0.7dvh, 6px);
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-commandbar-v2 {
    gap: 6px !important;
  }
}
/* W41M.2: override older important button/card paint for the premium runner surface. */
body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2 {
  appearance: none !important;
  border: 0 !important;
  border-color: transparent !important;
  border-style: none !important;
  border-width: 0 !important;
  outline: 0 !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2:is(
    .runner-command-button-v2--prev,
    .runner-command-button-v2--skip
  ) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2:is(
    .runner-command-button-v2--prev,
    .runner-command-button-v2--skip
  ):is(:hover, :focus-visible) {
  background: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 58%,
    transparent
  ) !important;
  background-image: none !important;
  box-shadow: 0 0 0 3px rgba(123, 149, 255, 0.12) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2.runner-command-button-v2--next {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--student-500, #7b95ff) 92%, #ffffff 8%),
    var(--student-700, #4e64a8)
  ) !important;
  background-color: var(--student-600, #6178d4) !important;
  border: 0 !important;
  border-color: transparent !important;
  border-style: none !important;
  border-width: 0 !important;
  box-shadow: 0 10px 18px rgba(63, 94, 163, 0.2) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  section.runner-answer-tools-v2.runner-answer-tools-v2--keypad[data-runner-tools-card] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-color: transparent !important;
  border-style: none !important;
  border-width: 0 !important;
  box-shadow: none !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row.runner-keyboard-row
  > button.btn[data-runner-key] {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--bg-panel, #fffdf9) 92%, #ffffff 8%),
    color-mix(in srgb, var(--bg-panel-2, #f7f1e8) 90%, #ffffff 10%)
  ) !important;
  border-color: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 68%,
    transparent
  ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 8px 16px rgba(31, 39, 65, 0.055) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row.runner-keyboard-row
  > button.btn[data-runner-key]:is(:hover, :focus-visible) {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--student-100, #eff3ff) 82%, #ffffff 18%),
    color-mix(
      in srgb,
      var(--student-200, #d9e2ff) 62%,
      var(--bg-panel, #fffdf9) 38%
    )
  ) !important;
  border-color: color-mix(
    in srgb,
    var(--student-500, #7b95ff) 76%,
    var(--line-default, rgba(55, 66, 99, 0.2)) 24%
  ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 0 0 3px rgba(123, 149, 255, 0.17),
    0 10px 20px rgba(63, 94, 163, 0.13) !important;
}
/* W41M.3: close the vertical dead zone between keypad and runner actions. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard]) {
    --w41m-action-rise: clamp(48px, 8dvh, 76px);
    --w41m-keypad-drop: clamp(12px, 2dvh, 20px);
  }
}

@media (max-width: 430px) and (min-height: 700px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard]) {
    --w41j-answer-slot-height: clamp(318px, 40dvh, 356px);
    --w41j-commandbar-slot-height: 54px;
    --w41m-action-rise: 0px;
    --w41m-keypad-drop: 0px;
    height: calc(100dvh - 18px - env(safe-area-inset-bottom, 0px)) !important;
    min-height: calc(
      100dvh - 18px - env(safe-area-inset-bottom, 0px)
    ) !important;
    max-height: calc(
      100dvh - 18px - env(safe-area-inset-bottom, 0px)
    ) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-stage-v2.runner-stage-v2 {
    gap: 8px !important;
    grid-template-rows: minmax(0, 1fr) var(--w41j-answer-slot-height) !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-panel-v2.runner-answer-panel-v2 {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) var(--w41j-commandbar-slot-height) !important;
    height: var(--w41j-answer-slot-height) !important;
    min-height: var(--w41j-answer-slot-height) !important;
    max-height: var(--w41j-answer-slot-height) !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    :is(
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2,
      .runner-answer-tools-v2,
      .runner-keyboard-wrap,
      .runner-keyboard
    ) {
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    margin-top: 4px !important;
    padding: 0 8px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard.runner-keyboard {
    gap: 6px !important;
    transform: none !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard-row.runner-keyboard-row {
    gap: 6px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard-row.runner-keyboard-row
    > button.btn[data-runner-key] {
    height: 34px !important;
    min-height: 34px !important;
    padding-block: 4px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-commandbar-wrap-v2.runner-commandbar-wrap-v2 {
    height: var(--w41j-commandbar-slot-height) !important;
    min-height: var(--w41j-commandbar-slot-height) !important;
    padding: 5px 0 0 !important;
    transform: none !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-commandbar-v2.runner-commandbar-v2 {
    height: 44px !important;
    min-height: 44px !important;
  }
}
/* W41M.4: keep desktop actions above the panel edge for every standard answer type. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41m-action-rise: clamp(48px, 8dvh, 76px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-commandbar-wrap-v2.runner-commandbar-wrap-v2 {
    position: relative !important;
    z-index: 30 !important;
  }
}
/* W41M.5: keep every keypad row visible after vertical polish. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    :is(
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2,
      .runner-answer-tools-v2,
      .runner-keyboard-wrap,
      .runner-keyboard
    ) {
    max-height: none !important;
    overflow: visible !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    min-height: clamp(226px, 27dvh, 254px) !important;
  }
}

@media (max-width: 430px) and (min-height: 700px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    height: 158px !important;
    min-height: 158px !important;
    max-height: 158px !important;
    overflow: visible !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    :is(.runner-keyboard-wrap, .runner-keyboard) {
    height: 154px !important;
    min-height: 154px !important;
    max-height: 154px !important;
    overflow: visible !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard.runner-keyboard {
    grid-template-rows: repeat(4, 34px) !important;
  }
}
/* W41M.6: final keypad fit tuning for desktop metrics and narrow phones. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    min-height: clamp(264px, 30dvh, 286px) !important;
  }
}

@media (max-width: 430px) and (min-height: 700px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard]) {
    --w41j-answer-slot-height: clamp(350px, 44dvh, 390px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    height: 127px !important;
    min-height: 127px !important;
    max-height: 127px !important;
    margin-top: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    :is(.runner-keyboard-wrap, .runner-keyboard) {
    height: 127px !important;
    min-height: 127px !important;
    max-height: 127px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard.runner-keyboard {
    gap: 5px !important;
    grid-template-rows: repeat(4, 28px) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard-row.runner-keyboard-row {
    gap: 5px !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-runner-form-factor="touch-stack"][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard-row.runner-keyboard-row
    > button.btn[data-runner-key] {
    height: 28px !important;
    min-height: 28px !important;
    padding-block: 2px !important;
  }
}

/* W41M.7: full-height runner polish across standard answer surfaces. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41m-action-rise: clamp(92px, 12dvh, 128px);
    --w41m-keypad-drop: clamp(18px, 2.8dvh, 28px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    :is(.runner-question-body-v2, .runner-question-stage-v2) {
    align-content: center !important;
    display: grid !important;
    justify-content: stretch !important;
    min-height: 100% !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-prompt {
    align-self: center !important;
    margin-block: auto !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    :is(.runner-answer-body-v2, .runner-answer-stage-v2) {
    align-content: center !important;
    display: grid !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-stack-v2.runner-answer-stack-v2 {
    align-self: center !important;
    transform: translateY(clamp(8px, 1.2dvh, 14px)) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    min-height: clamp(292px, 34dvh, 326px) !important;
    padding-bottom: 0 !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="choice"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    :is(
      .runner-answer-body-v2,
      .runner-answer-stage-v2,
      .runner-answer-stack-v2,
      .options-grid
    ) {
    align-content: center !important;
  }
}

@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41m-action-rise: clamp(3px, 0.7dvh, 6px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    :is(.runner-question-body-v2, .runner-question-stage-v2) {
    align-content: center !important;
    display: grid !important;
    min-height: 100% !important;
  }
}

/* W41M.8: keep the lowered desktop keypad fully inside its transparent tool slot. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    min-height: clamp(322px, 38dvh, 356px) !important;
  }
}

/* W41M.9: balance the raised commandbar against the lowered keypad. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ) {
    --w41m-action-rise: clamp(72px, 9.5dvh, 96px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    min-height: clamp(350px, 40.5dvh, 386px) !important;
  }
}

/* W41M.10: cap desktop keypad growth while keeping the controls balanced. */
@media (min-width: 821px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard]) {
    --w41m-action-rise: clamp(48px, 7dvh, 70px);
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-tools-v2.runner-answer-tools-v2 {
    min-height: clamp(348px, 41dvh, 372px) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-keyboard.runner-keyboard {
    height: clamp(304px, 37dvh, 340px) !important;
    min-height: clamp(304px, 37dvh, 340px) !important;
    max-height: clamp(304px, 37dvh, 340px) !important;
    grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* W41M.11: center simple mobile prompts inside their full question slot. */
@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    :is(.runner-question-body-v2, .runner-question-stage-v2) {
    align-content: center !important;
    align-items: center !important;
    display: grid !important;
    height: 100% !important;
    justify-items: stretch !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-prompt {
    align-self: center !important;
    margin-block: auto !important;
  }
}

/* W41M.12: let simple mobile question bodies occupy the full card. */
@media (max-width: 820px) {
  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-question-card-v2.runner-question-card-v2 {
    grid-template-rows: minmax(0, 1fr) !important;
  }

  body.portal-student
    .student-shell--runner-shell
    .runner-shell-v2.runner-shell-v2[data-runner-root][data-stimulus-variant="none"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-question-body-v2.runner-question-body-v2 {
    height: 100% !important;
    min-height: 100% !important;
  }
}

/* W41N: calm nested answer frames, stabilize answer slots, and make the keypad read like a numpad. */
body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ) {
  --w41n-frame-line: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 20%,
    transparent
  );
  --w41n-key-line: color-mix(
    in srgb,
    var(--line-default, rgba(55, 66, 99, 0.2)) 26%,
    transparent
  );
  --w41n-key-fill: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 82%,
    #ffffff 18%
  );
  --w41n-key-function-fill: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 42%,
    var(--bg-panel, #fffdf9) 58%
  );
  --w41n-key-hover-fill: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 72%,
    #ffffff 28%
  );
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-panel-v2 {
  border-color: var(--w41n-frame-line) !important;
  box-shadow: 0 18px 42px rgba(31, 39, 65, 0.052) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-dock-head-v2 {
  border-bottom-color: transparent !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-format {
  align-items: flex-start !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  margin: 0 !important;
  min-height: 48px !important;
  padding: 0 10px !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-kind-chip-v2 {
  background: transparent !important;
  border-color: var(--w41n-frame-line) !important;
  box-shadow: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-field__control {
  background: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 86%,
    #ffffff 14%
  ) !important;
  border-color: transparent !important;
  box-shadow: inset 0 0 0 1px
    color-mix(
      in srgb,
      var(--line-default, rgba(55, 66, 99, 0.2)) 36%,
      transparent
    ) !important;
  min-height: 58px !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-field__control:focus-within {
  border-color: transparent !important;
  box-shadow:
    inset 0 0 0 1px
      color-mix(in srgb, var(--student-500, #7b95ff) 62%, transparent),
    0 0 0 3px rgba(123, 149, 255, 0.2) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-input-row
  :is(.runner-answer-field__prefix, .runner-answer-field__suffix) {
  border-color: transparent !important;
  box-shadow: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  :is(.runner-answer-body-v2, .runner-answer-stage-v2) {
  align-content: center !important;
  display: grid !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-answer-stack-v2 {
  align-content: center !important;
  display: grid !important;
  gap: clamp(14px, 1.8dvh, 20px) !important;
  min-height: clamp(154px, 22dvh, 218px) !important;
  transform: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-answer-tools-v2 {
  margin-top: clamp(14px, 2dvh, 22px) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row[style*="--runner-keyboard-cols:3"] {
  grid-template-columns: 2fr 1fr 1fr !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  > button.btn[data-runner-key] {
  background: var(--w41n-key-fill) !important;
  border-color: var(--w41n-key-line) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 9px 18px rgba(31, 39, 65, 0.045) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  > button.btn:is(
    [data-runner-key="backspace"],
    [data-runner-key="clear"],
    [data-runner-key="enter"]
  ) {
  background: var(--w41n-key-function-fill) !important;
  color: var(--text-strong, #223047) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  > button.btn[data-runner-key]::before {
  display: none !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  ):has([data-runner-keyboard])
  .runner-keyboard-row
  > button.btn[data-runner-key]:is(:hover, :focus-visible) {
  background: var(--w41n-key-hover-fill) !important;
  border-color: color-mix(
    in srgb,
    var(--student-500, #7b95ff) 54%,
    transparent
  ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 0 0 3px rgba(123, 149, 255, 0.17),
    0 10px 18px rgba(63, 94, 163, 0.1) !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-dock-variant="choice"]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-stack-v2 {
  align-content: center !important;
  display: grid !important;
  min-height: clamp(176px, 34dvh, 340px) !important;
}

@media (max-width: 820px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-answer-mode]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    )
    .runner-answer-format {
    min-height: 42px !important;
    padding-inline: 2px !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2[data-runner-root][data-dock-variant="typed-keypad"]:not(
      .runner-shell-v2--eyfs
    ):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has([data-runner-keyboard])
    .runner-answer-stack-v2 {
    gap: 10px !important;
    min-height: 132px !important;
  }
}

/* W41N.1: remove residual framed states from secondary navigation and answer chips. */
body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-answer-kind-chip-v2 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-inline: 0 !important;
}

body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > :is(.runner-command-button-v2--prev, .runner-command-button-v2--skip),
body.portal-student
  :is(.student-shell--runner-shell, .student-page-content--runner)
  .runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2
  > :is(.runner-command-button-v2--prev, .runner-command-button-v2--skip):is(
    :hover,
    :focus,
    :focus-visible
  ) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2:is(
    .runner-command-button-v2--prev,
    .runner-command-button-v2--skip
  ),
body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2:is(
    .runner-command-button-v2--prev,
    .runner-command-button-v2--skip
  ):is(:hover, :focus, :focus-visible) {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* W41N.2: restore visible secondary button surfaces without reintroducing framed borders. */
body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2:is(
    .runner-command-button-v2--prev,
    .runner-command-button-v2--skip
  ) {
  background: color-mix(
    in srgb,
    var(--bg-panel, #fffdf9) 78%,
    var(--student-100, #eff3ff) 22%
  ) !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    0 8px 16px rgba(31, 39, 65, 0.055) !important;
  min-height: clamp(48px, 5.4dvh, 56px) !important;
  padding-inline: clamp(14px, 1.7vw, 22px) !important;
}

body.portal-student
  .student-shell--runner-shell
  .runner-shell-v2.runner-shell-v2[data-runner-root][data-answer-mode]:not(
    .runner-shell-v2--eyfs
  ):not(.runner-shell-v2--competition-sprint):not(
    [data-session-kind="competition"]
  )
  .runner-commandbar-v2.runner-commandbar-v2
  > button.btn.runner-command-button-v2.runner-command-button-v2:is(
    .runner-command-button-v2--prev,
    .runner-command-button-v2--skip
  ):is(:hover, :focus, :focus-visible) {
  background: color-mix(
    in srgb,
    var(--student-100, #eff3ff) 64%,
    #ffffff 36%
  ) !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 0 0 3px rgba(123, 149, 255, 0.13),
    0 10px 18px rgba(63, 94, 163, 0.1) !important;
}

/* W41S.1: the response-zone grid track is the measured no-jump answer slot. */
@media (min-width: 960px) and (max-width: 1366px) and (orientation: landscape) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-stimulus-variant="generated-visual"]
    ):not([data-stimulus-variant="geometry"]):not(
      [data-stimulus-variant="fraction-model"]
    ):not([data-stimulus-variant="grid"]):not(.runner-shell-v2--eyfs):not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"]) {
    --w41s-no-jump-answer-slot: clamp(333px, 41.4dvh, 336px);
    --w41s-commandbar-row: 64px;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-stimulus-variant="generated-visual"]
    ):not([data-stimulus-variant="geometry"]):not(
      [data-stimulus-variant="fraction-model"]
    ):not([data-stimulus-variant="grid"]):not(.runner-shell-v2--eyfs):not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-response-zone-v2.runner-response-zone-v2 {
    align-self: start !important;
    block-size: var(--w41s-no-jump-answer-slot) !important;
    display: grid !important;
    grid-template-rows: var(--w41s-no-jump-answer-slot) !important;
    height: var(--w41s-no-jump-answer-slot) !important;
    max-block-size: var(--w41s-no-jump-answer-slot) !important;
    max-height: var(--w41s-no-jump-answer-slot) !important;
    min-block-size: var(--w41s-no-jump-answer-slot) !important;
    min-height: var(--w41s-no-jump-answer-slot) !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-stimulus-variant="generated-visual"]
    ):not([data-stimulus-variant="geometry"]):not(
      [data-stimulus-variant="fraction-model"]
    ):not([data-stimulus-variant="grid"]):not(.runner-shell-v2--eyfs):not(
      .runner-shell-v2--competition-sprint
    ):not([data-session-kind="competition"])
    .runner-response-zone-v2.runner-response-zone-v2
    > .runner-answer-panel-v2.runner-answer-panel-v2 {
    align-self: start !important;
    block-size: var(--w41s-no-jump-answer-slot) !important;
    grid-template-rows: minmax(30px, auto) minmax(0, 1fr) var(
        --w41s-commandbar-row
      ) !important;
    height: var(--w41s-no-jump-answer-slot) !important;
    max-block-size: var(--w41s-no-jump-answer-slot) !important;
    max-height: var(--w41s-no-jump-answer-slot) !important;
    min-block-size: var(--w41s-no-jump-answer-slot) !important;
    min-height: var(--w41s-no-jump-answer-slot) !important;
  }
}

/* Controlled beta: source-backed SAT paper crops must remain fully readable on touch layouts. */
@media (max-width: 1180px) {
  body.portal-student
    .student-shell--runner-shell:has(
      .runner-question-panel--official-sats-image
    ),
  body.portal-student
    .student-shell__body--runner:has(
      .runner-question-panel--official-sats-image
    ) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:has(
      .runner-question-panel--official-sats-image
    ) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:has(
      .runner-question-panel--official-sats-image
    )
    .runner-stage-v2.runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:has(
      .runner-question-panel--official-sats-image
    )
    :is(
      .runner-question-card-v2,
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-visual-panel-v2,
      .visual-card--image-overlay,
      .image-overlay
    ) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:has(
      .runner-question-panel--official-sats-image
    )
    .runner-question-stage-v2.runner-question-stage-v2 {
    grid-template-rows: auto !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode]:has(
      .runner-question-panel--official-sats-image
    )
    .image-overlay__image {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin-inline: auto !important;
    object-fit: contain !important;
  }
}

@media (max-width: 820px) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image)
    .runner-stage-v2.runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image)
    :is(
      .runner-question-card-v2,
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-visual-panel-v2,
      .visual-card--image-overlay,
      .image-overlay
    ) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image)
    .runner-question-stage-v2.runner-question-stage-v2 {
    grid-template-rows: auto !important;
  }
}

@media (min-width: 700px) and (max-height: 760px) and (orientation: landscape) {
  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image)
    .runner-stage-v2.runner-stage-v2 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image)
    :is(
      .runner-question-card-v2,
      .runner-question-body-v2,
      .runner-question-stage-v2,
      .runner-visual-panel-v2,
      .visual-card--image-overlay,
      .image-overlay
    ) {
    block-size: auto !important;
    height: auto !important;
    min-block-size: 0 !important;
    min-height: 0 !important;
    max-block-size: none !important;
    max-height: none !important;
    contain: none !important;
    overflow: visible !important;
  }

  body.portal-student
    :is(.student-shell--runner-shell, .student-page-content--runner)
    .runner-shell-v2.runner-shell-v2.runner-shell-v2--touch-stack[data-runner-root][data-runner-form-factor="touch-stack"][data-answer-mode][data-answer-mode]:not(
      [data-dock-variant="typed-keypad"]
    ):not(.runner-shell-v2--eyfs):not(.runner-shell-v2--competition-sprint):not(
      [data-session-kind="competition"]
    ):has(.runner-question-panel--official-sats-image)
    .runner-question-stage-v2.runner-question-stage-v2 {
    grid-template-rows: auto !important;
  }
}

/* MathsPilot 19.9.4 learner UX hotfix — 2026-09-03 */
.mp-profile-menu__panel {
  width: min(286px, calc(100vw - 24px));
  min-width: min(248px, calc(100vw - 24px));
  padding: 10px;
  gap: 5px;
}
.mp-profile-menu__label {
  display: grid;
  gap: 2px;
  padding-block: 9px 10px;
}
.mp-profile-menu__label strong,
.mp-profile-menu__label small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.mp-profile-menu__label small {
  color: var(--text-muted);
  font-size: 0.76rem;
  font-weight: 650;
}
.mp-profile-menu__item--profile,
.mp-profile-menu__item--danger {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
}
.mp-profile-menu__item--profile > span:first-child,
.mp-profile-menu__item--danger > span:first-child {
  width: 22px;
  text-align: center;
  flex: 0 0 22px;
}
/* Desktop already exposes language, text size and appearance in the top bar. */
.mp-profile-menu__mobile-utilities {
  display: none;
}

.student-profile-guide {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 20px 22px;
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 18%, var(--line-default) 82%);
  border-radius: 24px;
  background:
    radial-gradient(circle at 96% 0%, color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 48%, transparent) 0 24%, transparent 25%),
    linear-gradient(180deg, color-mix(in srgb, white 94%, var(--student-theme-secondary, #dce6ff) 6%), var(--bg-panel));
  box-shadow: var(--shadow-sm);
}
.student-profile-guide__copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.student-profile-guide__copy h1,
.student-profile-guide__copy p {
  margin: 0;
}
.student-profile-guide__copy h1 {
  font-size: clamp(1.55rem, 2.6vw, 2.25rem);
  line-height: 1.08;
}
.student-profile-guide__copy p {
  max-width: 62ch;
  color: var(--text-muted);
  line-height: 1.5;
}
.student-profile-guide__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}
.student-profile-guide__actions .btn {
  min-height: 46px;
}
.student-profile-save-status {
  min-height: 24px;
  margin: -4px 4px 0;
  color: var(--text-muted);
  font-size: 0.9rem;
  font-weight: 650;
}
.student-profile-preview-card__edit {
  min-height: 46px;
  min-width: 0;
  padding: 10px 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  align-self: start;
}
.student-profile-preview-card__edit > span:last-child {
  display: inline;
}

.student-profile-appearance-modal__controls {
  grid-template-rows: auto auto auto auto;
  align-content: start;
  min-height: 0;
}
.student-profile-modal-guide {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--student-theme-primary, #5a78ff) 16%, var(--line-default) 84%);
  background: color-mix(in srgb, var(--student-theme-secondary, #dce6ff) 24%, var(--bg-panel) 76%);
}
.student-profile-modal-guide__icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: color-mix(in srgb, var(--student-theme-primary, #5a78ff) 14%, white 86%);
  font-size: 1.15rem;
}
.student-profile-modal-guide div {
  display: grid;
  gap: 3px;
}
.student-profile-modal-guide strong {
  color: var(--text-strong);
}
.student-profile-modal-guide small {
  color: var(--text-muted);
  line-height: 1.4;
}
.student-profile-modal-save-top {
  min-height: 50px;
}
.student-profile-modal-save-status {
  min-height: 20px;
  margin: 0 4px;
  font-size: 0.82rem;
  line-height: 1.35;
}
.student-avatar-library-intro--simple {
  display: grid;
  gap: 3px;
  margin-bottom: 12px;
}
.student-avatar-library-intro--simple span {
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1.4;
}
.student-avatar-library-chunk {
  display: grid;
  gap: 12px;
}
.student-avatar-show-more {
  justify-self: center;
  min-height: 44px;
  min-width: min(280px, 100%);
}
.student-avatar-group-placeholder {
  min-height: 132px;
  display: grid;
  place-items: center;
  padding: 20px;
  border: 1px dashed color-mix(in srgb, var(--student-theme-primary, #5a78ff) 24%, var(--line-default) 76%);
  border-radius: 20px;
  color: var(--text-muted);
  text-align: center;
}
.student-profile-appearance-modal [data-view-panel="profile-appearance"][data-view-value="avatar"] {
  max-height: min(56vh, 660px);
  overflow: auto;
  padding-right: 6px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.student-profile-appearance-modal .student-avatar-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.student-profile-appearance-modal-card .modal-card__body {
  overflow-x: hidden;
}

:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark) .student-profile-guide,
:is(html[data-appearance="dark"], html[data-theme="dark"], body.theme-dark) .student-profile-modal-guide {
  background: color-mix(in srgb, var(--bg-panel) 90%, var(--student-theme-primary, #5a78ff) 10%);
}

@media (max-width: 920px) {
  .student-profile-guide {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .student-profile-guide__actions {
    justify-content: flex-start;
  }
  .student-profile-appearance-modal .student-avatar-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .mp-profile-menu__panel,
  .mp-topbar--student-dashboard .mp-profile-menu__panel {
    width: min(292px, calc(100vw - 16px));
    min-width: min(292px, calc(100vw - 16px));
    max-width: min(292px, calc(100vw - 16px));
    max-height: min(74dvh, 560px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  /* The top-bar controls collapse on narrow screens, so expose one compact copy here. */
  .mp-profile-menu__mobile-utilities {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 7px 0 8px;
    border-bottom: 1px solid var(--line-subtle);
  }
  .mp-profile-menu__language-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    grid-column: 1 / -1;
  }
  .mp-profile-menu__mobile-utilities .mp-profile-menu__item {
    min-height: 44px;
    padding: 8px 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    text-align: center;
    border: 1px solid var(--line-subtle);
    background: color-mix(in srgb, var(--bg-panel) 92%, var(--brand-100) 8%);
  }
  .mp-profile-menu__mobile-utilities .mp-profile-menu__item.is-active {
    border-color: color-mix(in srgb, var(--brand-500) 32%, var(--line-default) 68%);
    background: color-mix(in srgb, var(--brand-100) 34%, var(--bg-panel) 66%);
  }
  .mp-profile-menu__mobile-utilities .mp-icon {
    width: 19px;
    height: 19px;
  }
  .student-profile-guide {
    padding: 17px;
    border-radius: 21px;
  }
  .student-profile-guide__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
  .student-profile-guide__actions .btn {
    width: 100%;
  }
  .student-profile-preview-card__edit {
    width: auto;
    min-width: 0;
    height: auto;
    min-height: 46px;
  }
  .student-profile-appearance-modal .student-avatar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .student-profile-appearance-modal [data-view-panel="profile-appearance"][data-view-value="avatar"] {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

@media (max-width: 460px) {
  .student-profile-guide__actions {
    grid-template-columns: 1fr;
  }
  .student-profile-preview-card__edit {
    width: 100%;
  }
  .student-profile-appearance-modal .student-avatar-option {
    min-height: 112px;
  }
  .student-profile-appearance-modal .student-avatar-option__preview {
    width: 82px;
    min-width: 82px;
    height: 82px;
    min-height: 82px;
  }
}

/* Fractions in teaching copy must stay readable, including calculation rows. */
.runner-worked .frac, .runner-hint .frac, [data-runner-hint-panel] .frac {
  margin: .15em .12em;
  width: max-content;
  justify-self: start;
}
.runner-worked .frac__top, .runner-worked .frac__bottom,
.runner-hint .frac__top, .runner-hint .frac__bottom,
[data-runner-hint-panel] .frac__top, [data-runner-hint-panel] .frac__bottom {
  font-size: .95em;
  line-height: 1.2;
  white-space: nowrap;
}
/* 19.9.6: visual probability and proportion families need explicit SVG paint. */
.scene-el.probability-branch,
.scene-el.graph-axis,
.scene-el.graph-line {
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  vector-effect: non-scaling-stroke;
}
.scene-el.graph-line { stroke-width: 3; }
.scene-el.graph-point { fill: currentColor; }
.scene-el.probability-cell {
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1;
}
.scene-el.probability-ball { stroke: currentColor; stroke-width: 1.5; fill: transparent; }
.scene-el.probability-ball--red { stroke: #d45369; stroke-width: 3; }
.scene-el.probability-ball--blue { stroke: #4281c7; stroke-width: 3; }