/* Deck catalogue — generated by flashcard-bank/tools/build_site.py */
.deck-crumb{ max-width:880px; margin-inline:auto; }
.deck-head{ max-width:880px; margin:0 auto 28px; }
.deck-head h1{ font-size:clamp(32px,4.4vw,46px); margin:6px 0 10px; }
.deck-head .lede{ font-size:18px; color:var(--muted); margin-bottom:14px; }
.deck-head p{ max-width:68ch; }
.deck-ctas{ display:flex; flex-wrap:wrap; gap:12px; margin:18px 0 14px; }
.fine{ font-size:13.5px; color:var(--faint); }
.muted{ color:var(--muted); }
.seg-badge{ display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:var(--ocean-ink); background:var(--ocean-wash); border-radius:999px; padding:4px 11px; }
.deck-body{ max-width:880px; margin-inline:auto; background:var(--surface); border:1px solid var(--hairline);
  border-radius:var(--r-xl); box-shadow:var(--sh-card); padding:clamp(22px,4.5vw,48px); }
.deck-body h2{ font-family:var(--font-ui); font-size:22px; font-weight:700; margin:36px 0 12px;
  padding-top:26px; border-top:1px solid var(--hairline); }
.deck-body h2:first-child{ margin-top:0; padding-top:0; border-top:none; }
.deck-body h3{ font-family:var(--font-ui); font-size:16.5px; font-weight:700; margin:22px 0 10px; }
.deck-body p, .deck-body li{ font-size:16px; }
.deck-body p{ margin-bottom:14px; }
/* Sample cards as a list (the page without JS, and the viewer's source) */
.sample-list{ margin:18px 0 6px; }
.sample-list > summary{ font-family:var(--font-ui); font-size:15px; font-weight:700; cursor:pointer; padding:10px 0;
  list-style:none; display:flex; align-items:center; gap:8px; color:var(--muted); }
.sample-list > summary::-webkit-details-marker{ display:none; }
.sample-list > summary::before{ content:"›"; display:inline-block; font-size:19px; line-height:1; transition:transform .15s; }
.sample-list[open] > summary::before{ transform:rotate(90deg); }
.flash-list{ list-style:none; margin:8px 0 0; padding:0; display:grid; gap:14px; }
.flash{ margin:0; border:1px solid var(--hairline-strong); border-radius:var(--r-lg); background:var(--bg);
  display:flex; flex-direction:column; overflow:hidden; }
.flash-q{ padding:16px 18px 12px; font-weight:600; font-size:15.5px; }
.flash-a{ padding:12px 18px 14px; border-top:1px dashed var(--hairline-strong); font-size:15px; color:var(--ink); flex:1; }
.flash-img{ display:block; width:100%; height:auto; margin:0 0 12px; border-radius:var(--r-sm); background:#fcfcfb; }
.flash-img.small{ width:auto; max-width:45%; max-height:120px; margin:0 auto 12px; background:transparent; }
.flash-tag{ padding:6px 18px 12px; font-size:12.5px; color:var(--faint); }
.flash ul, .vq ul, .va ul{ margin:6px 0 0 18px; }
.flash code, .deck-body code{ font-size:.92em; background:var(--ocean-wash); border-radius:6px; padding:1px 5px;
  overflow-wrap:anywhere; }
.katex{ font-size:1.1em; }
strong .katex{ color:var(--ocean-ink); }  /* KaTeX glyphs take no bold weight: a bold formula is tinted instead */
.blank{ color:var(--ocean); border-bottom:2px solid var(--ocean); padding:0 .45em; letter-spacing:.12em; font-weight:700; }
.katex-display{ overflow-x:auto; }
/* The viewer: flip card, topic chips, grading (decks.js). Hidden until the script runs. */
.viewer{ margin:14px 0 8px; }
.viewer-tags{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.vtag{ font:inherit; font-family:var(--font-ui); font-size:13px; font-weight:600; color:var(--muted); cursor:pointer;
  background:var(--bg); border:1px solid var(--hairline-strong); border-radius:999px; padding:5px 11px; transition:.12s; }
.vtag:hover{ color:var(--ink); border-color:var(--ocean); }
.vtag.on{ color:#fff; background:var(--ocean); border-color:var(--ocean); }
.viewer-stage{ perspective:1400px; margin-bottom:14px; }
.vcard{ position:relative; width:100%; min-height:300px; cursor:pointer; border-radius:var(--r-xl);
  transform-style:preserve-3d; transition:transform .5s cubic-bezier(.3,.8,.3,1); outline-offset:4px; }
.vcard.flipped{ transform:rotateY(180deg); }
.vface{ position:absolute; inset:0; display:flex; flex-direction:column; overflow:auto;
  padding:24px 26px 22px; border-radius:var(--r-xl); background:var(--bg); border:1px solid var(--hairline-strong);
  backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.vface.back{ transform:rotateY(180deg); }
.vface .face-label{ font-family:var(--font-ui); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--faint); margin-bottom:14px; display:flex; align-items:center; gap:8px; }
.vface .face-label .tab{ width:18px; height:4px; border-radius:2px; background:var(--amber); flex:none; }
/* Index card: a short question in Fraunces, centred on the front; a long or multi-line one
   (a practice stem with its options) reads left-aligned and smaller. decks.js sets .long. */
.vq{ font-family:var(--font-display); font-size:clamp(22px,3.2vw,28px); font-weight:600; line-height:1.25;
  letter-spacing:-0.012em; text-align:center; text-wrap:balance; max-width:28ch; margin:auto; padding-block:8px; }
.vq.long{ font-size:clamp(19px,2.2vw,21px); line-height:1.4; text-align:left; text-wrap:pretty; max-width:62ch;
  margin:0; padding-block:0; }
.vq ul{ text-align:left; }
.va{ font-size:18px; line-height:1.6; max-width:60ch; }
.vhint{ padding-top:14px; font-size:13.5px; color:var(--faint); text-align:center; }
.vq.long + .vhint{ margin-top:auto; text-align:left; }
.vq .flash-img, .va .flash-img{ max-height:220px; width:auto; max-width:100%; }
.vq .flash-img{ margin-inline:auto; }
.viewer-controls{ display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; margin-bottom:10px; }
.vnav{ font:inherit; font-family:var(--font-ui); font-size:14.5px; font-weight:700; color:var(--muted); cursor:pointer;
  background:var(--bg); border:1px solid var(--hairline-strong); border-radius:999px; padding:10px 16px; white-space:nowrap; }
.vnav:hover{ color:var(--ink); border-color:var(--ocean); }
.viewer-rate{ display:flex; gap:9px; justify-content:center; }
.viewer-rate .vshow{ width:100%; max-width:320px; }
.viewer-rate .rate-btn{ flex:1; max-width:140px; padding:12px 6px; }
.viewer-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; font-size:13.5px; color:var(--muted);
  font-variant-numeric:tabular-nums; }
.viewer-meta button{ font:inherit; font-size:13.5px; color:var(--muted); background:none; border:none; cursor:pointer;
  text-decoration:underline; text-underline-offset:3px; padding:0; }
.viewer-meta button:first-of-type{ margin-left:auto; }
.viewer-meta button:hover{ color:var(--ink); }
/* Calls to action and the chip row of sibling decks */
.app-cta{ margin:28px 0 8px; padding:22px 24px; background:var(--ocean-wash); border:1px solid var(--hairline);
  border-radius:var(--r-lg); }
.app-cta h3{ margin:0 0 8px; }
.app-cta p{ margin-bottom:12px; }
.app-cta .deck-ctas{ margin:4px 0 12px; }
.app-cta .fine{ margin:0; }
.chip-row{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.chip-link{ font-family:var(--font-ui); font-size:14px; font-weight:600; text-decoration:none; color:var(--ink);
  background:var(--bg); border:1px solid var(--hairline-strong); border-radius:999px; padding:7px 13px; transition:.12s; }
.chip-link:hover{ border-color:var(--ocean); color:var(--ocean); }
/* Exam page: decks grouped Learn / Drills / Practice */
.deck-group{ margin:22px 0 8px; }
.deck-group h3 span{ font-weight:600; color:var(--faint); }
.deck-group > .muted{ margin-bottom:12px; font-size:15px; }
.deck-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.deck-card{ display:flex; flex-direction:column; gap:7px; padding:15px 16px 14px; text-decoration:none; color:var(--ink);
  background:var(--bg); border:1px solid var(--hairline-strong); border-radius:var(--r-md); transition:border-color .15s, transform .12s; }
.deck-card:hover{ border-color:var(--shelf, var(--ocean)); transform:translateY(-1px); }
.deck-card strong{ font-family:var(--font-ui); font-size:15.5px; font-weight:700; line-height:1.3; }
.deck-card-desc{ font-size:13.5px; color:var(--muted); line-height:1.45; display:-webkit-box; -webkit-line-clamp:3;
  -webkit-box-orient:vertical; overflow:hidden; }
.deck-card-meta{ margin-top:auto; font-size:13px; color:var(--faint); font-variant-numeric:tabular-nums; }
.deck-card-meta b{ color:var(--ocean); }
.outline{ margin:0 0 12px 20px; }
.outline .outline{ margin:6px 0 4px 18px; font-size:15px; }
.outline li{ margin-bottom:6px; }
.count{ font-size:12.5px; color:var(--faint); margin-left:4px; }
.steps{ margin:0 0 14px 22px; }
.steps li{ margin-bottom:10px; }
.plan, .sources{ margin:0 0 14px 22px; }
.sources li{ font-size:14.5px; color:var(--muted); margin-bottom:6px; }
a.seg-badge{ text-decoration:none; color:var(--ink); background:color-mix(in srgb, var(--shelf, var(--ocean)) 16%, transparent); }
a.seg-badge:hover{ background:color-mix(in srgb, var(--shelf, var(--ocean)) 26%, transparent); }
/* Catalogue: shelves -> sections -> exam tiles. --shelf is set per shelf. */
.catalog .deck-crumb{ max-width:none; }
.catalog-head{ max-width:none; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
  gap:20px 48px; margin-bottom:32px; }
.catalog-head > div{ flex:1 1 520px; min-width:0; }
.catalog-head h1{ font-size:clamp(34px,5vw,54px); }
.catalog-stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); flex:0 1 520px; margin:0;
  background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-lg); box-shadow:var(--sh-card); overflow:hidden; }
.catalog-stats div{ padding:14px 18px; border-left:1px solid var(--hairline); }
.catalog-stats div:first-child{ border-left:none; }
.catalog-stats dt{ font-size:13px; color:var(--muted); }
.catalog-stats dd{ margin:0; font-family:var(--font-display); font-size:28px; font-weight:660; line-height:1.2; }
.shelf-icon{ display:inline-flex; align-items:center; justify-content:center; flex:none; width:36px; height:36px;
  border-radius:10px; color:var(--shelf); background:color-mix(in srgb, var(--shelf) 15%, transparent); }
.shelf-nav{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin-bottom:56px; }
.shelf-card{ display:flex; flex-direction:column; gap:8px; padding:16px; text-decoration:none; color:var(--ink);
  background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-lg); box-shadow:var(--sh-card);
  transition:border-color .15s, transform .12s; }
.shelf-card:hover{ border-color:var(--shelf); transform:translateY(-1px); }
.shelf-card strong{ font-family:var(--font-ui); font-size:15.5px; line-height:1.25; }
.shelf-card > span:last-child{ font-size:13px; color:var(--muted); line-height:1.35; }
.shelf{ margin:0 0 64px; scroll-margin-top:24px; }
.shelf-head{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; padding-bottom:14px; margin-bottom:10px;
  border-bottom:2px solid var(--shelf, var(--hairline)); }
.shelf-head .shelf-icon{ width:44px; height:44px; border-radius:12px; }
.shelf-head h2{ flex:1 1 auto; font-size:clamp(26px,3.4vw,32px); }
.shelf-meta{ font-family:var(--font-ui); font-size:14px; font-weight:600; color:var(--muted); }
.shelf > .muted{ max-width:70ch; margin-bottom:22px; }
.shelf-sec{ margin-bottom:26px; }
.shelf-sec h3{ font-family:var(--font-ui); font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); margin-bottom:10px; }
.shelf-sec h3 span{ font-weight:600; letter-spacing:0; color:var(--faint); }
.exam-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px; }
.exam-tile{ position:relative; overflow:hidden; display:flex; flex-direction:column; gap:6px; padding:14px 16px 14px 19px;
  text-decoration:none; color:var(--ink); background:var(--surface); border:1px solid var(--hairline);
  border-radius:var(--r-md); box-shadow:var(--sh-card); transition:border-color .15s, transform .12s; }
.exam-tile::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--shelf, var(--ocean)); }
.exam-tile:hover{ border-color:var(--shelf, var(--ocean)); transform:translateY(-1px); }
.exam-tile strong{ font-size:15.5px; font-weight:650; line-height:1.3; }
.tile-meta{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto;
  font-size:13px; color:var(--muted); }
.tile-meta > span:first-child{ white-space:nowrap; }
.pips{ display:flex; flex:none; gap:2px; }  /* one per deck, at most ten */
.pips i{ width:5px; height:14px; border-radius:2px; background:var(--shelf, var(--ocean)); opacity:.55; }
@media (max-width:520px){ .catalog-stats{ flex-basis:100%; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .catalog-stats div:nth-child(3){ border-left:none; } .catalog-stats div:nth-child(n+3){ border-top:1px solid var(--hairline); }
  .shelf-nav{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .deck-ctas .btn{ width:100%; } .viewer-controls{ grid-template-columns:1fr; } .vnav{ display:none; }
  .vface{ padding:18px 18px 16px; } .vcard{ min-height:280px; } .vq{ font-size:22px; } .vq.long{ font-size:18.5px; }
  .va{ font-size:17px; } .viewer-rate .rate-btn{ max-width:none; } }
@media (prefers-reduced-motion: reduce){ .vcard{ transition:none; } }