/* Slide decks inside a chapter (the diary's model), in the blog's light article palette. */
.deck {
  --d-bg: #ece6d8; --d-paper: #fffdf8; --d-ink: #101828; --d-muted: #4a5468; --d-rule: rgba(16, 24, 40, 0.18);
  --d-accent: #b26b00; --d-soft-accent: #fbecd0; --d-teal: #127a70; --d-soft-teal: #d9f1ee;
  --d-ok: #2f7d4f; --d-soft-ok: #e0f0e6; --d-bad: #b4382f; --d-soft-bad: #f6e0dd;
  background: var(--d-paper); border: 1px solid var(--d-rule); border-radius: 10px;
  padding: 16px 18px; margin: 28px 0; display: flex; flex-direction: column; gap: 10px;
}
.deck:focus-visible { outline: 2px solid var(--d-teal); outline-offset: 2px; }
.deck-head { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.deck-pos { font: 600 .8rem/1 var(--mono, monospace); color: var(--d-accent); }
.deck-title { font: 700 1.1rem/1.3 var(--display, sans-serif); color: var(--d-ink); }
.deck svg { width: 100%; height: auto; display: block; }
.deck svg.fade { animation: deckfade .35s ease; }
@keyframes deckfade { from { opacity: .25; } to { opacity: 1; } }
.deck-desc { font-size: .98rem; min-height: 3em; margin: 0; color: var(--d-ink); }
.deck-nav { display: flex; align-items: center; gap: 12px; }
.deck-nav > button { appearance: none; border: 1px solid var(--d-rule); background: var(--d-bg); color: var(--d-ink); width: 40px; height: 34px; border-radius: 6px; font: 600 1rem/1 sans-serif; cursor: pointer; }
.deck-nav > button:hover:not(:disabled) { border-color: var(--d-accent); color: var(--d-accent); }
.deck-nav > button:disabled { opacity: .35; cursor: default; }
.deck-dots { display: flex; gap: 6px; flex-wrap: wrap; }
.deck-dots button { appearance: none; border: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--d-rule); cursor: pointer; padding: 0; }
.deck-dots button[aria-current="step"] { background: var(--d-accent); }
@media (prefers-reduced-motion: reduce) { .deck svg.fade { animation: none; } }

/* Chapter top: reading time and the "what you will learn" box */
.reading-time { font: 600 .85rem/1 var(--mono, monospace); letter-spacing: .04em; color: #4a5468; margin: 0 0 16px; }
.learn-box { background: #fffdf8; border: 1px solid rgba(16, 24, 40, 0.18); border-left: 4px solid #b26b00; border-radius: 10px; padding: 16px 20px; margin: 0 0 28px; }
.learn-box b { display: block; font: 700 1rem/1.3 var(--display, sans-serif); color: #101828; margin-bottom: 8px; }
.learn-box ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; }
.learn-box p { margin: 0; }