.flashcards-page {
  --cards-sage:#e8f0e9;
  --cards-sand:#f4efe5;
  --cards-border:#a7bab0;
  --cards-surface:#fcfdfb;
  --cards-focus:#246661;
  --cards-canvas:#f3f6f2;
  font-family:"Trebuchet MS","Aptos","Segoe UI",sans-serif;
}
body.flashcards-page:not(.auth-page) { background-color:var(--cards-canvas); }
.flashcards-page :is(h1,h2,h3) { font-family:inherit; }
.flashcards-page :is(.siteheader,.cardbox,.bubble,.card-item,.stats span) { background:var(--cards-surface); }
.flashcards-page .cardbox { box-shadow:none; }
.flashcards-page :is(.introbox,.loginwrap .cardbox,.deck.active) { background:var(--cards-sage); }
.flashcards-page .bubble { box-shadow:none; }
.flashcards-page :is(.notice,.empty) {
  background:var(--cards-sand); color:var(--ink); border-color:var(--cards-border);
}
.flashcards-page .deck { background:var(--cards-surface); border-color:var(--line); }
.flashcards-page .deck.active { background:var(--cards-sage); border-color:var(--cards-focus); }
.flashcards-page :is(input[type=text],textarea,select,#typedAnswer) {
  background:var(--cards-surface); border-color:var(--cards-border); color:var(--ink);
}
.flashcards-page .study-card {
  background:var(--cards-sand); border-color:var(--cards-border);
  box-shadow:0 3px 0 var(--line); color:var(--ink);
}
.flashcards-page .study-card.flipped { background:var(--cards-sage); }
.flashcards-page .study-card .side { color:var(--muted); }
.flashcards-page .progress { background:var(--line); }
.flashcards-page .progress > span { background:var(--cards-focus); }
.flashcards-page .flashcards-guide { display:inline-flex; align-items:center; text-decoration:none; }
.flashcards-page .mode-buttons [aria-pressed="true"] { border-color:var(--cards-focus); box-shadow:inset 0 0 0 1px var(--cards-focus); }
body.flashcards-page:not(.auth-page) .btn.soft { background:var(--cards-sage); color:var(--ink); border-color:var(--cards-border); }
.flashcards-page #studySection:is(.expanded,:fullscreen) { background:var(--cards-canvas); }
.flashcards-page #studySection:is(.expanded,:fullscreen).quiz-mode #quizForm { background:var(--cards-sage); }
.flashcards-page :focus-visible { outline-color:var(--cards-focus); }
html[data-planit-theme=dark] .flashcards-page {
  --cards-sage:#263e36;
  --cards-sand:#3b362e;
  --cards-border:#778c84;
  --cards-surface:#252b3b;
  --cards-focus:#9fd9c5;
  --cards-canvas:#171b28;
}
.flashcards-shell {
  max-width:1350px;
  margin:auto;
  padding:16px 20px;
  display:grid;
  grid-template-columns:205px minmax(0,1fr);
  gap:20px;
  align-items:start;
}
.flashcards-nav { position:sticky; top:16px; display:flex; flex-direction:column; gap:8px; }
.flashcards-nav a {
  display:flex; align-items:center; min-height:44px;
  padding:9px 12px; border:1px solid var(--line); border-left:4px solid transparent;
  border-radius:5px; background:var(--cards-surface); color:var(--ink); font-weight:700; text-decoration:none;
}
.flashcards-nav a:hover,.flashcards-nav .flashcards-current-section {
  background:var(--cards-sage); color:var(--ink); border-left-color:var(--cards-focus);
}
.flashcards-content { min-width:0; }
.flashcards-content .wrap { width:100%; }
.flashcards-content .intro { padding-top:0; }
@media(max-width:1050px) {
  .flashcards-content .layout { grid-template-columns:1fr; }
}
@media(max-width:760px) {
  .flashcards-shell { grid-template-columns:1fr; padding:12px 16px; }
  .flashcards-nav { position:static; flex-direction:row; flex-wrap:wrap; }
}
