:root {
  --neet-bg: #0d1117;
  --neet-panel: #111827;
  --neet-panel-soft: #172033;
  --neet-line: #263244;
  --neet-text: #f8fafc;
  --neet-muted: #94a3b8;
  --neet-emerald: #22c55e;
  --neet-cyan: #38bdf8;
  --neet-amber: #f59e0b;
  --neet-rose: #fb7185;
  --neet-violet: #a78bfa;
  --neet-radius: 8px;
}

* {
  box-sizing: border-box;
}

body {
  background:
    radial-gradient(circle at 10% 8%, rgba(34, 197, 94, 0.16), transparent 28rem),
    radial-gradient(circle at 88% 18%, rgba(56, 189, 248, 0.14), transparent 26rem),
    linear-gradient(180deg, var(--neet-bg) 0%, #0b1020 46%, var(--neet-bg) 100%);
  color: var(--neet-text);
}

.glass,
.workspace-panel,
.scorecard-panel,
.subject-card,
.quiz-card,
.cutoff-card {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.94), rgba(13, 17, 23, 0.94));
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: var(--neet-radius);
  box-shadow: 0 18px 70px rgba(0, 0, 0, 0.32);
}

.workspace-panel,
.scorecard-panel {
  padding: 1.25rem;
}

.subject-card {
  padding: 1rem;
}

.subject-card input,
.neet-input,
.neet-select {
  width: 100%;
  border: 1px solid #334155;
  border-radius: var(--neet-radius);
  background: #020617;
  color: var(--neet-text);
  outline: none;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.subject-card input:focus,
.neet-input:focus,
.neet-select:focus {
  border-color: rgba(34, 197, 94, 0.86);
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.14);
}

.meter-track {
  height: 0.5rem;
  overflow: hidden;
  border-radius: 999px;
  background: #1e293b;
}

.meter-fill,
#scoreBar {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--neet-emerald), var(--neet-cyan));
  transition: width 220ms ease;
}

.metric-ring {
  background: conic-gradient(var(--ring-color, var(--neet-emerald)) calc(var(--ring-value, 0) * 1%), rgba(148, 163, 184, 0.18) 0);
  transition: background 220ms ease;
}

.rank-badge,
.percentile-badge,
.cutoff-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border-radius: var(--neet-radius);
  padding: 0.35rem 0.65rem;
  font-size: 0.8rem;
  font-weight: 800;
}

.rank-badge {
  border: 1px solid rgba(34, 197, 94, 0.34);
  background: rgba(34, 197, 94, 0.12);
  color: #bbf7d0;
}

.percentile-badge {
  border: 1px solid rgba(56, 189, 248, 0.34);
  background: rgba(56, 189, 248, 0.12);
  color: #bae6fd;
}

.cutoff-badge {
  border: 1px solid rgba(245, 158, 11, 0.34);
  background: rgba(245, 158, 11, 0.12);
  color: #fde68a;
}

.tool-tab {
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
}

.tool-tab.tab-active,
.tool-tab[aria-selected="true"] {
  border-color: rgba(34, 197, 94, 0.48);
  background: rgba(34, 197, 94, 0.13);
  color: #dcfce7;
}

.tab-panel {
  display: none;
}

.tab-panel.active,
.tab-panel[data-active="true"] {
  display: block;
}

.cutoff-table,
.cutoff-comparison-table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: var(--neet-radius);
}

.cutoff-table th,
.cutoff-table td,
.cutoff-comparison-table th,
.cutoff-comparison-table td {
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
  padding: 0.85rem 1rem;
  text-align: left;
}

.cutoff-table th,
.cutoff-comparison-table th {
  background: rgba(15, 23, 42, 0.9);
  color: var(--neet-muted);
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.cutoff-table tr:hover td,
.cutoff-comparison-table tr:hover td {
  background: rgba(30, 41, 59, 0.42);
}

.quiz-option {
  cursor: pointer;
  border: 1px solid #334155;
  border-radius: var(--neet-radius);
  background: rgba(2, 6, 23, 0.58);
  color: #e2e8f0;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.quiz-option:hover:not(:disabled) {
  border-color: rgba(167, 139, 250, 0.8);
  background: rgba(167, 139, 250, 0.1);
  transform: translateY(-1px);
}

.quiz-option:disabled {
  cursor: default;
}

.quiz-option.is-correct,
.quiz-option.correct,
.quiz-option.border-emerald-400 {
  border-color: rgba(34, 197, 94, 0.9) !important;
  background: rgba(34, 197, 94, 0.14) !important;
  color: #dcfce7 !important;
}

.quiz-option.is-wrong,
.quiz-option.wrong,
.quiz-option.border-rose-400 {
  border-color: rgba(251, 113, 133, 0.9) !important;
  background: rgba(251, 113, 133, 0.14) !important;
  color: #ffe4e6 !important;
}

.quiz-rationale,
.answer-rationale {
  border-left: 3px solid rgba(56, 189, 248, 0.7);
  padding-left: 0.85rem;
}

.history-item {
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: var(--neet-radius);
  background: rgba(2, 6, 23, 0.52);
  padding: 0.75rem;
}

.toast-root {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 9999;
  display: grid;
  width: min(24rem, calc(100vw - 2rem));
  gap: 0.75rem;
  pointer-events: none;
}

.toast {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-left: 4px solid var(--neet-emerald);
  border-radius: var(--neet-radius);
  background: rgba(15, 23, 42, 0.96);
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.38);
  color: var(--neet-text);
  padding: 0.85rem 1rem;
  pointer-events: auto;
  transform: translateY(0);
  animation: toast-in 180ms ease-out;
}

.toast[data-type="success"] {
  border-left-color: var(--neet-emerald);
}

.toast[data-type="info"] {
  border-left-color: var(--neet-cyan);
}

.toast[data-type="warning"] {
  border-left-color: var(--neet-amber);
}

.toast[data-type="error"] {
  border-left-color: var(--neet-rose);
}

.toast-title {
  font-weight: 800;
  line-height: 1.2;
}

.toast-message {
  margin-top: 0.2rem;
  color: #cbd5e1;
  font-size: 0.9rem;
  line-height: 1.45;
}

.toast-close {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: #94a3b8;
  cursor: pointer;
}

@keyframes toast-in {
  from {
    opacity: 0;
    transform: translateY(0.75rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media print {
  header,
  footer,
  .tool-tab,
  .toast-root,
  #mobileMenuButton,
  #mobileMenu,
  button {
    display: none !important;
  }

  body {
    background: #fff;
    color: #111827;
  }

  .glass,
  .workspace-panel,
  .scorecard-panel,
  .subject-card {
    box-shadow: none;
    border-color: #d1d5db;
  }
}
