:root {
  --hero-glow: #2a4f83;
  --hero-text: #e0ebff;
  --field: #fff;
  --soft: #f1f4f9;
  --correct-bg: #eaf6ee;
  --wrong-bg: #fdf0f2;
}
:root[data-theme="ocean"] {
  --page: #eaf7f9; --paper: #fff; --navy: #093744; --ink: #103b48; --muted: #40646c;
  --line: #c8e4e8; --blue: #086c77; --blue-soft: #e3f7f8; --amber: #80eaeb; --hero-glow: #186d7e; --hero-text: #d9f7fc;
  --soft: #e9f5f6; --field: #fff;
}
:root[data-theme="forest"] {
  --page: #f1f5eb; --paper: #fffefa; --navy: #173b2d; --ink: #213c30; --muted: #4a6452;
  --line: #d7e4d6; --blue: #226544; --blue-soft: #e8f4e7; --amber: #cfe69c; --hero-glow: #366953; --hero-text: #e6f2dd;
  --soft: #edf2e8; --field: #fffefa;
}
:root[data-theme="sunset"] {
  --page: #fff2ea; --paper: #fffaf7; --navy: #51283b; --ink: #492638; --muted: #735061;
  --line: #edd6ce; --blue: #9e3453; --blue-soft: #fbe8e9; --amber: #ffc19a; --hero-glow: #9a4e56; --hero-text: #ffe5dc;
  --soft: #f9ebe6; --field: #fffaf7;
}
:root[data-theme="galaxy"] {
  color-scheme: dark;
  --page: #151329; --paper: #211e39; --navy: #241b47; --ink: #f1ebff; --muted: #c5bbdc;
  --line: #484166; --blue: #c0aaff; --blue-soft: #372759; --amber: #e1c6ff; --hero-glow: #503785; --hero-text: #ece0ff;
  --soft: #302847; --field: #292142; --green: #9be8bf; --red: #ffc0ca; --correct-bg: #20392f; --wrong-bg: #472739;
}
:root[data-theme="amber"] {
  color-scheme: dark;
  --page: #201a17; --paper: #2d241f; --navy: #3a2822; --ink: #fff0e0; --muted: #ddc1ab;
  --line: #614636; --blue: #ffbe73; --blue-soft: #523725; --amber: #ffd192; --hero-glow: #764b31; --hero-text: #ffe3c8;
  --soft: #3c2c23; --field: #392a22; --green: #b5e7b8; --red: #ffc5b8; --correct-bg: #293c2c; --wrong-bg: #4a2c28;
}
a { color: var(--blue); }
a.brand { color: var(--ink); text-decoration: none; }
.hero { background: radial-gradient(ellipse at 85% 42%, var(--hero-glow), transparent 60%), var(--navy); }
.hero p { color: var(--hero-text); }
.question-prompt, .solution li { color: var(--muted); }
.topic-tag, .option-letter { background: var(--soft); color: var(--muted); }
.exam-tag, .solution-button, .solution { background: var(--blue-soft); color: var(--blue); border-color: var(--line); }
.hero-primary { color: #1d212e; background: var(--amber); }
.hero-secondary { color: #fff; border-color: #ffffff60; background: #ffffff10; }
.hero-primary:hover, .hero-secondary:hover { filter: brightness(.93); }
[data-theme="galaxy"] .check-button:not(:disabled), [data-theme="amber"] .check-button:not(:disabled),
[data-theme="galaxy"] .exam-switch input:checked + span, [data-theme="amber"] .exam-switch input:checked + span,
[data-theme="galaxy"] .option input:checked + .option-content .option-letter,
[data-theme="amber"] .option input:checked + .option-content .option-letter { color: #201a26; background: var(--blue); }
[data-theme="galaxy"] .option.is-correct .option-letter, [data-theme="galaxy"] .option.is-incorrect .option-letter,
[data-theme="amber"] .option.is-correct .option-letter, [data-theme="amber"] .option.is-incorrect .option-letter { color: #211a20; }
.check-button:not(:disabled):hover { background: var(--blue); filter: brightness(.89); }
.check-button:disabled, .exam-switch { background: var(--soft); color: var(--muted); border-color: var(--line); }
select, .map-button, .study-card input:not([type="checkbox"]), .study-card textarea { background: var(--field); color: var(--ink); }
progress, progress::-webkit-progress-bar { background: var(--soft); }
.map-button.is-answered, .feedback { background: var(--correct-bg); color: var(--green); }
.feedback.is-incorrect { background: var(--wrong-bg); color: var(--red); }
.option.is-correct .option-content { background: var(--correct-bg) !important; }
.option.is-incorrect .option-content { background: var(--wrong-bg) !important; }
.question-navigation { border-top-color: var(--line); }
.nav-button:disabled { color: var(--muted); }
.study-home { padding-bottom: 6px; }
.home-hero { min-height: 244px; }
.hero-kicker { display: block; color: var(--amber); font-size: .76rem; letter-spacing: .14em; font-weight: 800; margin-bottom: 9px; }
.button-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.button-row .button, .study-list-row .button { text-decoration: none; }
.hero .button-row { margin-top: 18px; }
.study-metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 13px; margin: 0 0 16px; }
.study-metric { display: grid; gap: 4px; padding: 15px 17px; }
.study-metric > span { font-size: .83rem; color: var(--muted); font-weight: 700; }
.study-metric > strong { font-size: clamp(1.2rem,3vw,1.8rem); color: var(--blue); letter-spacing: -.045em; }
.study-metric small, .study-list-row small, .muted { color: var(--muted); line-height: 1.45; }
.study-metric small, .study-list-row small { font-size: .77rem; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); gap: 15px; }
.dashboard-column, .exam-layout, .teacher-manage, .manage-form { display: grid; gap: 14px; align-content: start; }
.study-card { padding: 18px 19px; min-width: 0; }
.study-card h2, .study-card h3 { margin: 0 0 10px; letter-spacing: -.03em; }
.study-card h2 { font-size: 1.15rem; }
.study-card p { line-height: 1.55; }
.card-heading, .study-line, .study-list-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.card-heading a, .text-link { font-size: .82rem; font-weight: 700; }
.topic-row { margin: 11px 0; font-size: .82rem; }
.topic-row progress { margin-top: 6px; height: 5px; }
.topic-row .study-line span { white-space: nowrap; flex-shrink: 0; color: var(--muted); }
.study-list-row { align-items: center; padding-block: 10px; border-bottom: 1px solid var(--line); }
.study-list-row:last-child { border-bottom: 0; }
.study-list-row strong, .study-list-row small { display: block; }
.study-list-row strong { overflow-wrap: anywhere; }
.study-list-row .button { flex-shrink: 0; }
.login-card p, .question-prompt, .question-ask, .option-content { overflow-wrap: anywhere; }
.study-card form label:not(.check-line) { display: grid; gap: 5px; color: var(--muted); font-weight: 650; font-size: .84rem; }
.study-card :is(input:not([type="checkbox"]), textarea) { width: 100%; min-height: 44px; padding: 8px 10px; font: inherit; border: 1px solid var(--line); border-radius: 8px; }
.study-card textarea { resize: vertical; }
#join-form { display: grid; gap: 9px; }
#join-form button, .manage-form > button { justify-self: start; }
#nickname-form { margin-top: 10px; align-items: end; }
.theme-picker { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.theme-option { min-height: 66px; padding: 7px 4px; display: grid; justify-items: center; align-content: center; gap: 4px; border: 1px solid var(--line); border-radius: 9px; background: var(--field); color: var(--ink); font-size: .75rem; font-weight: 700; }
.theme-option[aria-pressed="true"] { border-color: var(--blue); box-shadow: inset 0 0 0 1px var(--blue); background: var(--blue-soft); }
.theme-swatch { width: 29px; height: 22px; border-radius: 6px; }
.study-status { color: var(--blue); font-size: .86rem; font-weight: 650; }
.study-status.status-error { color: var(--red); }
.exam-start, .manage-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.exam-start { grid-template-columns: 1fr 1.5fr auto; }
.exam-attempt-layout { display: grid; grid-template-columns: minmax(165px,.35fr) minmax(0,1fr); align-items: start; gap: 14px; }
.exam-kicker { color: var(--blue); text-transform: uppercase; font-size: .74rem; font-weight: 800; margin-bottom: 7px; }
.exam-controls { margin-top: 14px; }
.exam-controls .check-button { margin-inline-start: auto; }
.finish-dialog { width: min(440px,calc(100% - 30px)); color: var(--ink); }
.finish-dialog::backdrop { background: #10132399; }
.result-metrics:not(:last-child) { border-bottom: 1px solid var(--line); }
.result-metrics .study-metric { padding-inline: 0; }
.rank-message { font-weight: 780; color: var(--blue); }
.rank-list { padding: 0; }
.rank-list li { padding: 8px 0; border-bottom: 1px solid var(--line); }
.exam-review, .teacher-manage details { margin-block: 4px; }
.exam-review { padding-block: 10px; border-bottom: 1px solid var(--line); }
.exam-review summary, .teacher-manage summary { cursor: pointer; font-weight: 750; }
.teacher-manage { margin-bottom: 16px; }
.manage-form { margin-top: 14px; }
.manage-form + .manage-form { border-top: 1px solid var(--line); padding-top: 14px; }
.check-line { display: flex; align-items: center; gap: 8px; min-height: 32px; font-size: .87rem; }
.check-line input { flex: none; accent-color: var(--blue); }
.group-question-choices { border: 1px solid var(--line); border-radius: 8px; min-width: 0; }
.question-preview { margin-top: 12px; border-radius: 9px; padding: 14px; background: var(--blue-soft); }
.question-image { width: auto; max-width: 100%; max-height: 360px; border-radius: 8px; object-fit: contain; margin: 5px 0 10px; display: block; }
.privacy-card { max-width: 740px; }
@media(max-width: 680px) {
  .dashboard-grid, .exam-attempt-layout { grid-template-columns: 1fr; gap: 10px; }
  .study-card { padding: 14px; }
  .home-hero { min-height: 188px; }
  .study-metrics { gap: 6px; }
  .study-metric { padding: 10px 8px; }
  .study-metric > span { font-size: .75rem; }
  .study-metric small { font-size: .68rem; }
  .exam-start { grid-template-columns: 1fr 1.4fr; }
  .exam-start button { grid-column: 1/-1; justify-self: start; }
  .exam-controls .check-button { margin-inline-start: 0; }
}