/* StudyConcept's shared, contrast-aware color foundation. */
:root {
  --sc-app-canvas: #f8fafc;
  --sc-app-paper: #ffffff;
  --sc-app-mist: #eef4f8;
  --sc-app-line: #e1e8ef;
  --sc-app-ink: #142a43;
  --sc-app-slate: #52677d;
  --sc-app-muted: #52677d;
  --sc-app-blue: var(--sc-theme-primary, #176dce);
  --sc-app-action: #176dce;
  --sc-app-action-hover: #125cad;
  --sc-app-blue-tint: #eaf4ff;
  --sc-app-teal: #16877f;
  --sc-app-teal-strong: #0c6f68;
  --sc-app-aqua: #e2f7f7;
  --sc-app-amber: #f4b740;
  --sc-app-warning: #805000;
  --sc-app-danger: #c84b4b;
  --sc-theme-bg: var(--sc-app-canvas);
  --sc-theme-surface: var(--sc-app-paper);
  --sc-theme-soft: var(--sc-app-mist);
  --sc-theme-text: var(--sc-app-ink);
  --sc-theme-muted: var(--sc-app-slate);
  --sc-theme-faint: #65788d;
  --sc-theme-border: var(--sc-app-line);
  --sc-theme-primary: var(--sc-app-action);
  --sc-theme-primary-hover: var(--sc-app-action-hover);
  --sc-theme-accent: var(--sc-app-teal);
  --sc-theme-secondary: var(--sc-app-teal-strong);
  --sc-theme-on-primary: #ffffff;
  --sc-theme-on-secondary: #ffffff;
  --sc-theme-primary-soft: var(--sc-app-blue-tint);
  --sc-intelligence: var(--sc-app-action);
  --sc-progress: var(--sc-app-teal);
  --sc-action: var(--sc-app-action);
  --sc-achievement: var(--sc-app-amber);
  --sc-connection: var(--sc-app-blue);
  --sc-discovery: var(--sc-app-teal);
}

html:not([data-sc-color-scheme="midnight"]) {
  color-scheme: light;
  background-color: var(--sc-app-canvas);
}

html:not([data-sc-color-scheme="midnight"]) body {
  color: var(--sc-theme-text);
}

html:not([data-sc-color-scheme="midnight"]) :where(.bg-background) {
  background-color: var(--sc-theme-bg) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where(.bg-surface, .bg-surface-bright, .bg-surface-container-lowest, .bg-white) {
  background-color: var(--sc-theme-surface) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where(.bg-surface-container, .bg-surface-container-low, .bg-surface-container-high, .bg-gray-50, .bg-gray-100, .bg-slate-50, .bg-slate-100) {
  background-color: var(--sc-theme-soft) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where([class~="bg-primary"]) {
  background-color: var(--sc-theme-primary) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where([class~="bg-secondary"]) {
  background-color: var(--sc-theme-secondary) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where([class~="text-primary"]) {
  color: var(--sc-theme-primary) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where([class~="text-secondary"]) {
  color: var(--sc-theme-secondary) !important;
}
html:not([data-sc-color-scheme="midnight"]) [class~="text-[#2383e2]"],
html:not([data-sc-color-scheme="midnight"]) [class~="hover:text-[#2383e2]"]:hover {
  color: var(--sc-theme-primary) !important;
}
html:not([data-sc-color-scheme="midnight"]) [class~="bg-[#2383e2]"] {
  background-color: var(--sc-theme-primary) !important;
}
html:not([data-sc-color-scheme="midnight"]) [class~="border-[#2383e2]"] {
  border-color: var(--sc-theme-primary) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where(.text-on-background, .text-on-surface, .text-gray-900, .text-gray-800, .text-slate-900, .text-slate-800, .text-black) {
  color: var(--sc-theme-text) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where(.text-on-surface-variant, .text-outline, .text-gray-700, .text-gray-600, .text-slate-700, .text-slate-600, .text-gray-500, .text-slate-500) {
  color: var(--sc-theme-muted) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where(.border-outline-variant, .border-gray-100, .border-gray-200, .border-gray-300, .border-slate-100, .border-slate-200, .border-slate-300) {
  border-color: var(--sc-theme-border) !important;
}
html:not([data-sc-color-scheme="midnight"]) :where(button, a, input, select, textarea):focus-visible {
  outline-color: var(--sc-theme-primary) !important;
}
html:not([data-sc-color-scheme="midnight"]) ::selection {
  background: #d9eaff;
  color: var(--sc-app-ink);
}

html[data-sc-color-scheme="midnight"] {
  --sc-app-canvas: #101923;
  --sc-app-paper: #172330;
  --sc-app-mist: #202f3d;
  --sc-app-line: #344454;
  --sc-app-ink: #f3f7fb;
  --sc-app-slate: #a7b5c4;
  --sc-app-muted: #a7b5c4;
  --sc-app-blue: #65aeff;
  --sc-app-action: #65aeff;
  --sc-app-action-hover: #8ac1ff;
  --sc-app-blue-tint: #203650;
  --sc-app-teal: #57c6bc;
  --sc-app-teal-strong: #57c6bc;
  --sc-app-aqua: #203d43;
  --sc-app-amber: #f4b740;
  --sc-app-warning: #f4c56e;
  --sc-app-danger: #ff8580;
  --sc-theme-bg: var(--sc-app-canvas);
  --sc-theme-surface: var(--sc-app-paper);
  --sc-theme-soft: var(--sc-app-mist);
  --sc-theme-text: var(--sc-app-ink);
  --sc-theme-muted: var(--sc-app-slate);
  --sc-theme-faint: #8c9bac;
  --sc-theme-border: var(--sc-app-line);
  --sc-theme-primary: var(--sc-app-action);
  --sc-theme-primary-hover: var(--sc-app-action-hover);
  --sc-theme-accent: var(--sc-app-teal);
  --sc-theme-secondary: var(--sc-app-teal);
  --sc-theme-on-primary: #101923;
  --sc-theme-on-secondary: #101923;
  --sc-theme-primary-soft: rgba(101, 174, 255, .16);
  --sc-intelligence: var(--sc-app-blue);
  --sc-progress: var(--sc-app-teal);
  --sc-action: var(--sc-app-blue);
  --sc-achievement: var(--sc-app-amber);
  --sc-connection: var(--sc-app-blue);
  --sc-discovery: var(--sc-app-teal);
}

html[data-sc-color-scheme="midnight"].sc-mobile-remake-root {
  color-scheme: dark;
}

html[data-sc-color-scheme="midnight"].sc-mobile-remake-root,
body[data-sc-color-scheme="midnight"].sc-mobile-remake {
  --sc-mobile-canvas: var(--sc-theme-bg);
  --sc-mobile-surface: var(--sc-theme-surface);
  --sc-mobile-surface-low: var(--sc-theme-surface);
  --sc-mobile-surface-soft: var(--sc-theme-soft);
  --sc-mobile-surface-high: #203650;
  --sc-mobile-surface-highest: #344454;
  --sc-mobile-ink: var(--sc-theme-text);
  --sc-mobile-muted: var(--sc-theme-muted);
  --sc-mobile-outline: var(--sc-theme-muted);
  --sc-mobile-outline-variant: var(--sc-theme-border);
  --sc-mobile-green: var(--sc-theme-primary);
  --sc-mobile-green-2: var(--sc-theme-primary-hover);
  --sc-mobile-tint: var(--sc-theme-primary);
  --sc-mobile-primary-fixed: #203650;
  --sc-mobile-orange: var(--sc-theme-accent);
  --sc-mobile-orange-container: var(--sc-theme-primary-soft);
  --sc-mobile-line: var(--sc-theme-border);
  --sc-mv2-bg: var(--sc-mobile-canvas);
  --sc-mv2-surface: var(--sc-mobile-surface);
  --sc-mv2-soft: var(--sc-mobile-surface-soft);
  --sc-mv2-green: var(--sc-mobile-green);
  --sc-mv2-orange: var(--sc-mobile-orange);
  --sc-mv2-line: var(--sc-mobile-line);
}

html[data-sc-color-scheme="midnight"] :where(.bg-background, .bg-surface, .bg-surface-bright, .bg-surface-container-lowest, .bg-white) {
  background-color: var(--sc-theme-surface) !important;
}
html[data-sc-color-scheme="midnight"] :where(.bg-surface-container, .bg-surface-container-low, .bg-surface-container-high, .bg-gray-50, .bg-gray-100, .bg-slate-50, .bg-slate-100) {
  background-color: var(--sc-theme-soft) !important;
}
html[data-sc-color-scheme="midnight"] :where(.text-on-background, .text-on-surface, .text-gray-900, .text-gray-800, .text-slate-900, .text-slate-800, .text-black) {
  color: var(--sc-theme-text) !important;
}
html[data-sc-color-scheme="midnight"] :where(.text-on-surface-variant, .text-outline, .text-gray-700, .text-gray-600, .text-slate-700, .text-slate-600, .text-gray-500, .text-slate-500) {
  color: var(--sc-theme-muted) !important;
}
html[data-sc-color-scheme="midnight"] :where(.border-outline-variant, .border-gray-100, .border-gray-200, .border-gray-300, .border-slate-100, .border-slate-200, .border-slate-300) {
  border-color: var(--sc-theme-border) !important;
}
html[data-sc-color-scheme="midnight"] [class~="text-[#2383e2]"],
html[data-sc-color-scheme="midnight"] [class~="hover:text-[#2383e2]"]:hover {
  color: var(--sc-theme-primary) !important;
}
html[data-sc-color-scheme="midnight"] [class~="bg-[#2383e2]"] {
  background-color: var(--sc-theme-primary) !important;
  color: #101923 !important;
}
html[data-sc-color-scheme="midnight"] [class~="border-[#2383e2]"] {
  border-color: var(--sc-theme-primary) !important;
}

/* Shared interaction states retain utility opacity and native hidden semantics. */
[hidden]:not([hidden="until-found"]) { display: none !important; }
:is(button,a,input,select,textarea,[tabindex]):focus-visible { outline: 2px solid var(--sc-theme-primary); outline-offset: 3px; }
.material-symbols-outlined { vertical-align: middle; flex-shrink: 0; }
[class~="bg-primary/5"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 5%, transparent) !important; }
[class~="bg-primary/10"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 10%, transparent) !important; }
[class~="bg-primary/15"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 15%, transparent) !important; }
[class~="bg-primary/20"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 20%, transparent) !important; }
[class~="bg-primary/25"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 25%, transparent) !important; }
[class~="bg-primary/30"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 30%, transparent) !important; }
[class~="bg-primary/40"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 40%, transparent) !important; }
[class~="bg-primary/50"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 50%, transparent) !important; }
[class~="bg-primary/60"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 60%, transparent) !important; }
[class~="bg-primary/70"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 70%, transparent) !important; }
[class~="bg-primary/80"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 80%, transparent) !important; }
[class~="bg-primary/90"] { background-color: color-mix(in srgb, var(--sc-theme-primary) 90%, transparent) !important; }
[class~="bg-secondary/5"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 5%, transparent) !important; }
[class~="bg-secondary/10"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 10%, transparent) !important; }
[class~="bg-secondary/15"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 15%, transparent) !important; }
[class~="bg-secondary/20"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 20%, transparent) !important; }
[class~="bg-secondary/25"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 25%, transparent) !important; }
[class~="bg-secondary/30"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 30%, transparent) !important; }
[class~="bg-secondary/40"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 40%, transparent) !important; }
[class~="bg-secondary/50"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 50%, transparent) !important; }
[class~="bg-secondary/60"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 60%, transparent) !important; }
[class~="bg-secondary/70"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 70%, transparent) !important; }
[class~="bg-secondary/80"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 80%, transparent) !important; }
[class~="bg-secondary/90"] { background-color: color-mix(in srgb, var(--sc-theme-secondary) 90%, transparent) !important; }