* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.5;
    color: #172033;
    background: #f7f9fc;
}

a {
    color: #1d4ed8;
}

.site-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem;
    background: #ffffff;
    border-bottom: 1px solid #dbe3ef;
}

.site-logo {
    font-weight: 800;
    font-size: 1.3rem;
    text-decoration: none;
    color: #172033;
}

.site-nav {
    display: flex;
    gap: 1rem;
}

.site-main {
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem 1.25rem;
}

.hero,
.panel {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    padding: 2rem;
    margin-bottom: 1.5rem;
}

.hero h1 {
    font-size: 3rem;
    margin-top: 0;
}

.button {
    display: inline-block;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    background: #1d4ed8;
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
}

.site-footer {
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem 1.25rem;
    color: #526070;
}

/* LingEx context-aware theming foundation. */
:root,
body[data-lx-theme="default"] {
  --lx-surface: #ffffff;
  --lx-surface-soft: #f6f7fb;
  --lx-text: #172033;
  --lx-muted-text: #5f6b7a;
  --lx-accent: #2957d9;
  --lx-border: #d9deea;
  --lx-panel-radius: 1rem;
  --lx-density-scale: 1;
}

body[data-lx-theme="learner-bright"] {
  --lx-surface: #ffffff;
  --lx-surface-soft: #fff8dc;
  --lx-text: #162033;
  --lx-muted-text: #596575;
  --lx-accent: #287a44;
  --lx-border: #e4dca8;
  --lx-panel-radius: 1.25rem;
  --lx-density-scale: 1;
}

body[data-lx-theme="admin-compact"] {
  --lx-surface: #ffffff;
  --lx-surface-soft: #f2f4f7;
  --lx-text: #101828;
  --lx-muted-text: #475467;
  --lx-accent: #344054;
  --lx-border: #d0d5dd;
  --lx-panel-radius: .5rem;
  --lx-density-scale: .875;
}

body {
  background: var(--lx-surface-soft);
  color: var(--lx-text);
}

.panel,
.card,
main > section {
  border-color: var(--lx-border);
  border-radius: var(--lx-panel-radius);
}

a {
  color: var(--lx-accent);
}

body[data-lx-theme="admin-compact"] .panel,
body[data-lx-theme="admin-compact"] .card,
body[data-lx-theme="admin-compact"] main > section {
  padding-block: calc(1rem * var(--lx-density-scale));
}

/* Account settings form. */
.lingex-account-settings {
  margin-top: 2rem;
}

.lingex-account-settings__form {
  display: grid;
  gap: .9rem;
  max-width: 34rem;
}

.lingex-account-settings__form label {
  display: grid;
  gap: .25rem;
}

.lingex-account-settings__form select,
.lingex-account-settings__form button {
  max-width: 22rem;
}

.lingex-account-settings__notice {
  border: 1px solid var(--lx-border, #d9deea);
  border-radius: .75rem;
  background: var(--lx-surface-soft, #f6f7fb);
  padding: .6rem .8rem;
}

.lingex-account-settings__warning,
.lingex-account-settings__error {
  border: 1px solid var(--lx-border, #d9deea);
  border-radius: .75rem;
  padding: .6rem .8rem;
}

.lingex-account-settings__error {
  font-weight: 600;
}

/* Admin users page. */
.lingex-admin-users__search {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: .75rem;
  margin: 1rem 0 1.25rem;
}

.lingex-admin-users__search label {
  display: grid;
  gap: .25rem;
  min-width: min(24rem, 100%);
}

.lingex-admin-users__search input {
  padding: .45rem .55rem;
  border: 1px solid var(--lx-border, #d9deea);
  border-radius: .5rem;
}

.lingex-admin-users__table-wrap {
  overflow-x: auto;
}

.lingex-admin-users__table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9rem;
}

.lingex-admin-users__table th,
.lingex-admin-users__table td {
  vertical-align: top;
  text-align: left;
  border-bottom: 1px solid var(--lx-border, #d9deea);
  padding: .55rem .6rem;
}

.lingex-admin-users__context {
  display: grid;
  gap: .15rem;
  margin: 0;
}

.lingex-admin-users__context div {
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  gap: .4rem;
}

.lingex-admin-users__context dt {
  color: var(--lx-muted-text, #5f6b7a);
}

.lingex-admin-users__context dd {
  margin: 0;
}

.lingex-admin-users__roles {
  display: grid;
  gap: .35rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.lingex-admin-users__roles li,
.lingex-admin-users__role-form,
.lingex-admin-users__inline-form {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
}

.lingex-admin-users__role-form select {
  max-width: 11rem;
}

.lingex-admin-users__notice,
.lingex-admin-users__warning,
.lingex-admin-users__error {
  border: 1px solid var(--lx-border, #d9deea);
  border-radius: .75rem;
  padding: .6rem .8rem;
}

.lingex-admin-users__notice {
  background: var(--lx-surface-soft, #f6f7fb);
}

.lingex-admin-users__error {
  font-weight: 600;
}

.lingex-admin-users__muted {
  color: var(--lx-muted-text, #5f6b7a);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

/* Stronger CSS-variable theme application. */
body[data-lx-theme="default"] {
  --lx-surface: #ffffff;
  --lx-surface-soft: #f6f7fb;
  --lx-surface-strong: #eef2f7;
  --lx-text: #172033;
  --lx-muted-text: #5f6b7a;
  --lx-accent: #2358d8;
  --lx-accent-soft: #e8efff;
  --lx-border: #d9deea;
  --lx-panel-radius: 1rem;
  --lx-density-scale: 1;
}

body[data-lx-theme="learner-bright"] {
  --lx-surface: #fffdf7;
  --lx-surface-soft: #fff3cf;
  --lx-surface-strong: #ffe39a;
  --lx-text: #1e2630;
  --lx-muted-text: #6f5d2e;
  --lx-accent: #b45309;
  --lx-accent-soft: #ffedd5;
  --lx-border: #f2c86b;
  --lx-panel-radius: 1.25rem;
  --lx-density-scale: 1.08;
}

body[data-lx-theme="admin-compact"] {
  --lx-surface: #f8fafc;
  --lx-surface-soft: #e5e7eb;
  --lx-surface-strong: #cbd5e1;
  --lx-text: #111827;
  --lx-muted-text: #4b5563;
  --lx-accent: #334155;
  --lx-accent-soft: #e2e8f0;
  --lx-border: #94a3b8;
  --lx-panel-radius: .45rem;
  --lx-density-scale: .86;
}

body {
  background:
    radial-gradient(circle at top left, var(--lx-accent-soft, transparent), transparent 24rem),
    var(--lx-surface);
  color: var(--lx-text);
}

body a {
  color: var(--lx-accent);
}

body main,
body .panel,
body .card,
body main > section {
  background: var(--lx-surface);
  color: var(--lx-text);
  border-color: var(--lx-border);
  border-radius: var(--lx-panel-radius);
}

body main > section,
body .panel,
body .card {
  box-shadow: 0 .6rem 1.8rem rgba(15, 23, 42, .06);
}

body button,
body input[type="submit"],
body input[type="button"] {
  border-radius: calc(var(--lx-panel-radius, 1rem) * .55);
}

body[data-lx-theme="learner-bright"] .lingex-top-bar {
  box-shadow: 0 .8rem 2rem rgba(180, 83, 9, .12);
}

body[data-lx-theme="learner-bright"] h1,
body[data-lx-theme="learner-bright"] h2 {
  letter-spacing: -.02em;
}

body[data-lx-theme="admin-compact"] {
  font-size: calc(1rem * var(--lx-density-scale));
}

body[data-lx-theme="admin-compact"] main,
body[data-lx-theme="admin-compact"] .lingex-top-bar {
  padding-top: .55rem;
  padding-bottom: .55rem;
}

body[data-lx-theme="admin-compact"] .lingex-top-bar,
body[data-lx-theme="admin-compact"] main > section,
body[data-lx-theme="admin-compact"] .panel,
body[data-lx-theme="admin-compact"] .card {
  box-shadow: none;
}

body[data-lx-theme="admin-compact"] table {
  font-size: .9em;
}

body[data-lx-theme="admin-compact"] th,
body[data-lx-theme="admin-compact"] td {
  padding-top: .35rem;
  padding-bottom: .35rem;
}

/* Lingex corporate theme.
   Clean parent-brand theme for the main site, account surfaces,
   public corporate pages, and platform documentation. */
body[data-lx-theme="lingex-corporate"] {
  --lx-surface: #ffffff;
  --lx-surface-soft: #f8fafc;
  --lx-surface-strong: #eef2f7;
  --lx-text: #111827;
  --lx-muted-text: #4b5563;
  --lx-accent: #2563eb;
  --lx-accent-soft: #dbeafe;
  --lx-border: #d7dde8;
  --lx-panel-radius: 1.1rem;
  --lx-density-scale: 1;
}

body[data-lx-theme="lingex-corporate"] {
  background:
    radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .10), transparent 30rem),
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  color: var(--lx-text);
}

body[data-lx-theme="lingex-corporate"] .lingex-top-bar {
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid rgba(17, 24, 39, .08);
  box-shadow: 0 .75rem 2rem rgba(15, 23, 42, .06);
  backdrop-filter: blur(12px);
}

body[data-lx-theme="lingex-corporate"] main,
body[data-lx-theme="lingex-corporate"] main > section,
body[data-lx-theme="lingex-corporate"] .panel,
body[data-lx-theme="lingex-corporate"] .card,
body[data-lx-theme="lingex-corporate"] .lingex-account-settings,
body[data-lx-theme="lingex-corporate"] .lingex-admin-users__table-wrap {
  background: rgba(255, 255, 255, .96);
  border: 1px solid var(--lx-border);
  box-shadow: 0 1rem 2.5rem rgba(15, 23, 42, .07);
}

body[data-lx-theme="lingex-corporate"] h1,
body[data-lx-theme="lingex-corporate"] h2,
body[data-lx-theme="lingex-corporate"] h3 {
  color: #050505;
  letter-spacing: -.035em;
}

body[data-lx-theme="lingex-corporate"] p,
body[data-lx-theme="lingex-corporate"] li,
body[data-lx-theme="lingex-corporate"] td,
body[data-lx-theme="lingex-corporate"] dd {
  color: var(--lx-text);
}

body[data-lx-theme="lingex-corporate"] small,
body[data-lx-theme="lingex-corporate"] .lingex-admin-users__muted,
body[data-lx-theme="lingex-corporate"] .lingex-theme-control__label-text,
body[data-lx-theme="lingex-corporate"] .lingex-admin-users__context dt {
  color: var(--lx-muted-text);
}

body[data-lx-theme="lingex-corporate"] button,
body[data-lx-theme="lingex-corporate"] input[type="submit"],
body[data-lx-theme="lingex-corporate"] input[type="button"] {
  background: var(--lx-accent);
  border: 1px solid rgba(37, 99, 235, .18);
  color: #ffffff;
  box-shadow: 0 .55rem 1.3rem rgba(37, 99, 235, .18);
  font-weight: 700;
}

body[data-lx-theme="lingex-corporate"] button:hover,
body[data-lx-theme="lingex-corporate"] input[type="submit"]:hover,
body[data-lx-theme="lingex-corporate"] input[type="button"]:hover {
  filter: brightness(1.04);
}

body[data-lx-theme="lingex-corporate"] input,
body[data-lx-theme="lingex-corporate"] select,
body[data-lx-theme="lingex-corporate"] textarea,
body[data-lx-theme="lingex-corporate"] .lingex-theme-control__select {
  background: #ffffff;
  border: 1px solid var(--lx-border);
  color: var(--lx-text);
}

body[data-lx-theme="lingex-corporate"] table {
  background: #ffffff;
  color: var(--lx-text);
}

body[data-lx-theme="lingex-corporate"] th {
  background: var(--lx-surface-soft);
  color: #111827;
}

body[data-lx-theme="lingex-corporate"] th,
body[data-lx-theme="lingex-corporate"] td {
  border-color: var(--lx-border);
}

body[data-lx-theme="lingex-corporate"] code {
  background: var(--lx-surface-soft);
  color: #1f2937;
  border-radius: .35rem;
  padding: .08rem .28rem;
}


/* Arcade-inspired dark arcade theme.
   Original LingEx theme: dark arcade canvas, elevated game-card panels,
   purple/blue accent glow, compact game-portal feel. */
body[data-lx-theme="arcade-dark"] {
  --lx-surface: #10131d;
  --lx-surface-soft: #171b29;
  --lx-surface-strong: #22283a;
  --lx-text: #f4f7ff;
  --lx-muted-text: #aab3c7;
  --lx-accent: #7c5cff;
  --lx-accent-soft: rgba(124, 92, 255, .18);
  --lx-border: #30384f;
  --lx-panel-radius: 1rem;
  --lx-density-scale: .96;
}

body[data-lx-theme="arcade-dark"] {
  background:
    radial-gradient(circle at 10% 0%, rgba(124, 92, 255, .26), transparent 28rem),
    radial-gradient(circle at 90% 8%, rgba(35, 149, 255, .18), transparent 26rem),
    linear-gradient(180deg, #090b12 0%, #10131d 42%, #0c0f18 100%);
  color: var(--lx-text);
}

body[data-lx-theme="arcade-dark"] .lingex-top-bar {
  background: rgba(13, 16, 26, .92);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .35);
  backdrop-filter: blur(12px);
}

body[data-lx-theme="arcade-dark"] .lingex-top-bar a,
body[data-lx-theme="arcade-dark"] a {
  color: #dbe3ff;
}

body[data-lx-theme="arcade-dark"] .lingex-top-bar a:hover,
body[data-lx-theme="arcade-dark"] a:hover {
  color: #ffffff;
}

body[data-lx-theme="arcade-dark"] main,
body[data-lx-theme="arcade-dark"] main > section,
body[data-lx-theme="arcade-dark"] .panel,
body[data-lx-theme="arcade-dark"] .card,
body[data-lx-theme="arcade-dark"] .lingex-account-settings,
body[data-lx-theme="arcade-dark"] .lingex-admin-users__table-wrap {
  background: linear-gradient(180deg, rgba(28, 33, 50, .96), rgba(18, 22, 35, .96));
  border: 1px solid rgba(255, 255, 255, .08);
  box-shadow:
    0 1.2rem 3rem rgba(0, 0, 0, .32),
    inset 0 1px 0 rgba(255, 255, 255, .04);
}

body[data-lx-theme="arcade-dark"] h1,
body[data-lx-theme="arcade-dark"] h2,
body[data-lx-theme="arcade-dark"] h3 {
  color: #ffffff;
  letter-spacing: -.03em;
}

body[data-lx-theme="arcade-dark"] p,
body[data-lx-theme="arcade-dark"] li,
body[data-lx-theme="arcade-dark"] td,
body[data-lx-theme="arcade-dark"] dd {
  color: var(--lx-text);
}

body[data-lx-theme="arcade-dark"] small,
body[data-lx-theme="arcade-dark"] .lingex-admin-users__muted,
body[data-lx-theme="arcade-dark"] .lingex-theme-control__label-text,
body[data-lx-theme="arcade-dark"] .lingex-admin-users__context dt {
  color: var(--lx-muted-text);
}

body[data-lx-theme="arcade-dark"] button,
body[data-lx-theme="arcade-dark"] input[type="submit"],
body[data-lx-theme="arcade-dark"] input[type="button"] {
  background: linear-gradient(180deg, #8a70ff, #6547ea);
  border: 1px solid rgba(255, 255, 255, .12);
  color: #ffffff;
  box-shadow: 0 .6rem 1.4rem rgba(101, 71, 234, .28);
  font-weight: 700;
}

body[data-lx-theme="arcade-dark"] button:hover,
body[data-lx-theme="arcade-dark"] input[type="submit"]:hover,
body[data-lx-theme="arcade-dark"] input[type="button"]:hover {
  filter: brightness(1.08);
}

body[data-lx-theme="arcade-dark"] button:disabled,
body[data-lx-theme="arcade-dark"] select:disabled {
  opacity: .55;
  cursor: not-allowed;
}

body[data-lx-theme="arcade-dark"] input,
body[data-lx-theme="arcade-dark"] select,
body[data-lx-theme="arcade-dark"] textarea,
body[data-lx-theme="arcade-dark"] .lingex-theme-control__select {
  background: #0d101a;
  border: 1px solid var(--lx-border);
  color: var(--lx-text);
}

body[data-lx-theme="arcade-dark"] input::placeholder,
body[data-lx-theme="arcade-dark"] textarea::placeholder {
  color: #7f8aa3;
}

body[data-lx-theme="arcade-dark"] table {
  background: transparent;
  color: var(--lx-text);
}

body[data-lx-theme="arcade-dark"] th {
  background: rgba(124, 92, 255, .12);
  color: #ffffff;
}

body[data-lx-theme="arcade-dark"] th,
body[data-lx-theme="arcade-dark"] td {
  border-color: rgba(255, 255, 255, .08);
}

body[data-lx-theme="arcade-dark"] tr:hover td {
  background: rgba(255, 255, 255, .035);
}

body[data-lx-theme="arcade-dark"] code {
  background: rgba(255, 255, 255, .08);
  color: #e6eaff;
  border-radius: .35rem;
  padding: .08rem .28rem;
}

body[data-lx-theme="arcade-dark"] .lingex-admin-users__notice,
body[data-lx-theme="arcade-dark"] .lingex-admin-users__warning,
body[data-lx-theme="arcade-dark"] .lingex-admin-users__error {
  background: rgba(124, 92, 255, .12);
  border-color: rgba(124, 92, 255, .32);
  color: var(--lx-text);
}

body[data-lx-theme="arcade-dark"] .card {
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

body[data-lx-theme="arcade-dark"] .card:hover {
  transform: translateY(-2px);
  border-color: rgba(124, 92, 255, .45);
  box-shadow:
    0 1.4rem 3.2rem rgba(0, 0, 0, .38),
    0 0 0 1px rgba(124, 92, 255, .16);
}

.lingex-footer__version {
  margin-top: .75rem;
  font-size: .75rem;
  line-height: 1.2;
  color: var(--lx-muted-text, #666);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  opacity: .78;
  text-align: left;
}


/* Stable page-surface themes. Whole-site chrome is selected by page surface,
   not by an individual account's stored theme preference. */
body[data-lx-theme="lingex-corporate"] {
  --lx-chrome-bg: rgba(255, 255, 255, .94);
  --lx-chrome-text: #172033;
  --lx-chrome-muted: #526070;
  --lx-chrome-link: #1d4ed8;
  --lx-chrome-border: rgba(17, 24, 39, .10);
  --lx-chrome-control-bg: #ffffff;
  --lx-chrome-control-text: #172033;
  --lx-chrome-control-border: #cbd5e1;
  --lx-menu-shadow: 0 1.2rem 3rem rgba(15, 23, 42, .16);
}

body[data-lx-theme="arcade-dark"] {
  --lx-chrome-bg: rgba(13, 16, 26, .94);
  --lx-chrome-text: rgba(241, 245, 249, .96);
  --lx-chrome-muted: rgba(203, 213, 225, .94);
  --lx-chrome-link: rgba(241, 245, 249, .96);
  --lx-chrome-border: rgba(255, 255, 255, .10);
  --lx-chrome-control-bg: #111827;
  --lx-chrome-control-text: rgba(241, 245, 249, .96);
  --lx-chrome-control-border: rgba(148, 163, 184, .45);
  --lx-menu-shadow: 0 1.2rem 3rem rgba(0, 0, 0, .38);
}

/* Dedicated light administration surface. */
body[data-lx-theme="lingex-admin"] {
  --lx-surface: #ffffff;
  --lx-surface-soft: #eaf3ff;
  --lx-surface-strong: #d8e9ff;
  --lx-text: #172033;
  --lx-muted-text: #526070;
  --lx-accent: #1d4ed8;
  --lx-accent-soft: #dbeafe;
  --lx-border: #cbd5e1;
  --lx-panel-radius: .85rem;
  --lx-density-scale: .94;
  --lx-chrome-bg: #172033;
  --lx-chrome-text: #f8fafc;
  --lx-chrome-muted: #cbd5e1;
  --lx-chrome-link: #ffffff;
  --lx-chrome-border: rgba(255, 255, 255, .12);
  --lx-chrome-control-bg: #ffffff;
  --lx-chrome-control-text: #172033;
  --lx-chrome-control-border: rgba(255, 255, 255, .28);
  --lx-menu-shadow: 0 1.2rem 3rem rgba(15, 23, 42, .34);
  background:
    radial-gradient(circle at 10% 0%, rgba(59, 130, 246, .12), transparent 30rem),
    linear-gradient(180deg, #f3f8ff 0%, #e7f1ff 100%);
  color: var(--lx-text);
}

body[data-lx-theme="lingex-admin"] main,
body[data-lx-theme="lingex-admin"] main > section,
body[data-lx-theme="lingex-admin"] .panel,
body[data-lx-theme="lingex-admin"] .card {
  background: rgba(255, 255, 255, .94);
  color: var(--lx-text);
  border-color: var(--lx-border);
  border-radius: var(--lx-panel-radius);
  box-shadow: 0 .55rem 1.4rem rgba(15, 23, 42, .06);
}

body[data-lx-theme="lingex-admin"] h1,
body[data-lx-theme="lingex-admin"] h2,
body[data-lx-theme="lingex-admin"] h3,
body[data-lx-theme="lingex-admin"] p,
body[data-lx-theme="lingex-admin"] li,
body[data-lx-theme="lingex-admin"] td,
body[data-lx-theme="lingex-admin"] dd {
  color: var(--lx-text);
}

body[data-lx-theme="lingex-admin"] small,
body[data-lx-theme="lingex-admin"] dt,
body[data-lx-theme="lingex-admin"] .lingex-admin-users__muted {
  color: var(--lx-muted-text);
}

body[data-lx-theme="lingex-admin"] input,
body[data-lx-theme="lingex-admin"] select,
body[data-lx-theme="lingex-admin"] textarea {
  background: #ffffff;
  border: 1px solid var(--lx-border);
  color: var(--lx-text);
}

body[data-lx-theme="lingex-admin"] th {
  background: #e8eef7;
  color: #172033;
}

body[data-lx-theme="lingex-admin"] th,
body[data-lx-theme="lingex-admin"] td {
  border-color: var(--lx-border);
}

.lingex-footer {
  color: var(--lx-chrome-muted, var(--lx-muted-text, #526070));
  background: var(--lx-chrome-bg, transparent);
  border-top: 1px solid var(--lx-chrome-border, transparent);
}

.lingex-footer a {
  color: var(--lx-chrome-link, var(--lx-accent, #1d4ed8));
}
