/* Learn Koine Greek in the Hope look. Overrides greek.css under body.hope-guide.
   Greek text keeps EB Garamond (it carries polytonic Greek; the Hope font does not). */

body.hope-guide main .gk-greek, body.hope-guide main .gk-greek * { font-family: 'EB Garamond', 'Palatino Linotype', 'Times New Roman', serif; }
body.hope-guide .gk-page { color: var(--hg-text); }

/* Header card */
body.hope-guide .gk-head { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius); box-shadow: var(--hg-shadow); padding: clamp(20px, 4vw, 36px); }
body.hope-guide .gk-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; color: var(--hg-primary); }
body.hope-guide .gk-title { font-weight: 800; font-size: clamp(30px, 5vw, 42px); }
body.hope-guide .gk-sub { font-size: 18px; font-style: normal; font-weight: 600; color: var(--hg-body); }
body.hope-guide .gk-intro { font-size: 16px; line-height: 1.65; color: var(--hg-muted); }
body.hope-guide .gk-fineprint { font-size: 15px; font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-fineprint a { color: var(--hg-primary); }

/* Stat pills */
body.hope-guide .gk-stat { font-size: 14px; font-weight: 600; letter-spacing: 0; color: var(--hg-muted); background: var(--hg-surface); border-color: var(--hg-border); padding: 8px 14px; }
body.hope-guide .gk-stat b { color: var(--hg-text); }
body.hope-guide .gk-stat--due { background: var(--hg-primary); border-color: var(--hg-primary); color: #fff; }
body.hope-guide .gk-stat--due b { color: #fff; }
body.hope-guide .gk-stat--due:hover { background: var(--hg-primary-hover); }
body.hope-guide .gk-stat--zen { font-style: normal; color: var(--hg-develop); background: var(--hg-develop-bg); border-color: transparent; }

/* Units + lessons */
body.hope-guide .gk-unit-head { border-bottom-color: var(--hg-border-strong); }
body.hope-guide .gk-unit-glyph { background: var(--hg-primary-soft); border-color: transparent; color: var(--hg-primary); box-shadow: none; }
body.hope-guide .gk-unit-title { font-size: 21px; font-weight: 800; color: var(--hg-text); }
body.hope-guide .gk-unit-blurb { font-size: 15px; color: var(--hg-muted); }
body.hope-guide .gk-unit-count { font-size: 13px; font-weight: 700; letter-spacing: 0; color: var(--hg-primary); background: var(--hg-primary-soft); border-color: transparent; white-space: nowrap; }
body.hope-guide .gk-lesson { background: var(--hg-surface); border-color: var(--hg-border); box-shadow: var(--hg-shadow-sm); min-height: 64px; }
body.hope-guide .gk-lesson:hover { transform: none; border-color: var(--hg-primary); box-shadow: var(--hg-shadow-sm); }
body.hope-guide .gk-lesson-num { font-size: 15px; width: 36px; height: 36px; }
body.hope-guide .gk-lesson.is-done .gk-lesson-num { background: var(--hg-develop); border-color: var(--hg-develop); }
body.hope-guide .gk-lesson-title { font-size: 16px; font-weight: 700; color: var(--hg-text); }
body.hope-guide .gk-lesson-blurb { font-size: 15px; color: var(--hg-muted); line-height: 1.45; }
body.hope-guide .gk-lesson-tag { font-size: 12.5px; letter-spacing: 0.02em; text-transform: none; }
body.hope-guide .gk-lesson-min { font-size: 13px; letter-spacing: 0; text-transform: none; color: var(--hg-muted); }

/* Player */
body.hope-guide .gk-back { width: 44px; height: 44px; color: var(--hg-primary); background: var(--hg-primary-soft); border-color: transparent; }
body.hope-guide .gk-progress { background: var(--hg-primary-soft); }
body.hope-guide .gk-progress > span { background: var(--hg-primary); }
body.hope-guide .gk-player-lesson { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; color: var(--hg-muted); }
body.hope-guide .gk-card { background: var(--hg-surface); border-color: var(--hg-border); box-shadow: var(--hg-shadow); }
body.hope-guide :is(.gk-card-h, .gk-teach h2, .gk-reading h2, .gk-finish h2) { font-weight: 800; color: var(--hg-text) !important; }
body.hope-guide .gk-teach-body { font-size: 17px; color: var(--hg-body); }
body.hope-guide .gk-teach-body b { color: var(--hg-text); }
body.hope-guide .gk-teach-body table.gk-para { background: var(--hg-surface); }
body.hope-guide .gk-teach-body table.gk-para caption { font-size: 14px; font-weight: 700; color: var(--hg-primary); }
body.hope-guide .gk-teach-body table.gk-para :is(th, td) { border-color: var(--hg-border); }
body.hope-guide .gk-teach-body table.gk-para :is(thead th, tbody th) { background: var(--hg-surface-2); font-size: 14px; color: var(--hg-text); }
body.hope-guide .gk-teach-body table.gk-para td small { font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-eg { background: var(--hg-surface-2); border-left-color: var(--hg-primary); }
body.hope-guide .gk-eg-tr { font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-note-box { background: var(--hg-primary-soft); border-left-color: var(--hg-primary); color: var(--hg-body); font-size: 16px; }
body.hope-guide .gk-note-box b { color: var(--hg-introduce); }

/* Buttons */
body.hope-guide .gk-btn { min-height: 44px; font-size: 16px; font-weight: 700; letter-spacing: 0; }
body.hope-guide .gk-btn--primary { background: var(--hg-primary); color: #fff; box-shadow: none; }
body.hope-guide .gk-btn--primary:hover { background: var(--hg-primary-hover); filter: none; transform: none; }
body.hope-guide .gk-btn--primary:disabled { opacity: 1; background: #d6dbe7; color: var(--hg-muted); }
body.hope-guide .gk-btn--ghost { background: var(--hg-primary-soft); color: var(--hg-primary); border-color: transparent; }
body.hope-guide .gk-btn--ghost:hover { background: #e0e6fc; }

/* Letters + audio */
body.hope-guide .gk-letter { background: var(--hg-surface-2); border-color: var(--hg-border); }
body.hope-guide .gk-letter-glyph { color: var(--hg-text); }
body.hope-guide .gk-letter-name { font-size: 15px; color: var(--hg-primary); }
body.hope-guide .gk-letter-sound, body.hope-guide .gk-letter-ex { font-size: 15px; color: var(--hg-body); }
body.hope-guide .gk-letter-note { font-size: 14px; font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-audio { width: 36px; height: 36px; min-height: 36px; background: var(--hg-primary-soft); border-color: transparent; color: var(--hg-primary); }
body.hope-guide .gk-audio svg { width: 16px; height: 16px; }
body.hope-guide .gk-audio.is-playing { background: var(--hg-primary); color: #fff; }

/* Options, matching, tiles: state shown by text + colour */
body.hope-guide .gk-mcq-gr { color: var(--hg-text); }
body.hope-guide .gk-opt { min-height: 52px; background: var(--hg-surface); border-color: var(--hg-border-strong); color: var(--hg-text); font-size: 17px; display: flex; align-items: center; gap: 10px; }
body.hope-guide .gk-opt--greek { justify-content: center; font-size: 1.45rem; }
body.hope-guide .gk-opt:hover:not(:disabled) { border-color: var(--hg-primary); background: var(--hg-primary-soft); }
body.hope-guide .gk-opt:disabled { color: var(--hg-text); }
body.hope-guide .gk-opt.is-correct { border-color: var(--hg-develop); background: var(--hg-develop-bg); color: var(--hg-text); }
body.hope-guide .gk-opt.is-wrong { border-color: var(--hg-reverse); background: var(--hg-reverse-bg); color: var(--hg-text); }
body.hope-guide .gk-opt.is-correct::after, body.hope-guide .gk-opt.is-wrong::after {
  margin-left: auto; flex: 0 0 auto; font: 700 14px var(--hg-font); padding: 3px 10px; border-radius: 999px; background: #fff;
}
body.hope-guide .gk-opt.is-correct::after { content: "\2713  Correct"; color: var(--hg-develop); }
body.hope-guide .gk-opt.is-wrong::after { content: "\2717  Not this one"; color: var(--hg-reverse); }
body.hope-guide .gk-match-item.is-correct { opacity: 1; }
body.hope-guide .gk-match-item.is-correct::after { content: "\2713  Matched"; }
body.hope-guide .gk-match-item.is-picked { border-color: var(--hg-primary); background: var(--hg-primary-soft); box-shadow: 0 0 0 2px var(--hg-primary) inset; }
body.hope-guide .gk-match-item.is-wrong::after { content: "\2717  No"; }
body.hope-guide .gk-feedback.is-right { background: var(--hg-develop-bg); border-color: #a7dcc1; }
body.hope-guide .gk-feedback.is-wrong { background: var(--hg-reverse-bg); border-color: #f4bdb6; }
body.hope-guide .gk-feedback p { font-size: 16px; color: var(--hg-body); }
body.hope-guide .gk-feedback.is-right b { color: var(--hg-develop); }
body.hope-guide .gk-feedback.is-wrong b { color: var(--hg-reverse); }
body.hope-guide .gk-tiles-answer { background: var(--hg-surface-2); border-color: var(--hg-border-strong); }
body.hope-guide .gk-tiles-hint { font-size: 15px; font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-tile { min-height: 44px; background: var(--hg-surface); border-color: var(--hg-border-strong); color: var(--hg-text); font-size: 17px; }
body.hope-guide .gk-tile:hover:not(:disabled) { border-color: var(--hg-primary); }
/* A used tile becomes a clear empty slot rather than a faded word */
body.hope-guide .gk-tile:disabled { opacity: 1; color: transparent; background: #eef0f3; border-style: dashed; border-color: var(--hg-border-strong); }
body.hope-guide .gk-tile--picked { background: var(--hg-primary-soft); border-color: var(--hg-primary); }

/* Flashcards */
body.hope-guide .gk-flash-gr, body.hope-guide .gk-flash-gloss { color: var(--hg-text); }
body.hope-guide .gk-flash-translit, body.hope-guide .gk-flash-note { font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-flash-meta { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--hg-muted); }

/* Reading */
body.hope-guide .gk-reading-intro, body.hope-guide .gk-reading-src { font-style: normal; color: var(--hg-muted); }
body.hope-guide .gk-reading-src { font-size: 14px; }
body.hope-guide .gk-verse-n { font-size: 13px; color: var(--hg-primary); }
body.hope-guide .gk-verse-gr { color: var(--hg-text); }
body.hope-guide .gk-word { border-bottom-color: rgba(58, 87, 232, 0.45); min-height: 0; }
body.hope-guide .gk-word:hover { background: var(--hg-primary-soft); }
body.hope-guide .gk-word.is-active { background: #dfe5fc; }
body.hope-guide .gk-verse-toggle { min-height: 36px; font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--hg-primary); }
body.hope-guide .gk-verse-tr { font-style: normal; color: var(--hg-body); }
body.hope-guide .gk-wordcard { background: var(--hg-surface); border-color: var(--hg-border-strong); box-shadow: var(--hg-shadow); }
body.hope-guide .gk-wordcard-gr, body.hope-guide .gk-wordcard-gloss { color: var(--hg-text); }
body.hope-guide .gk-wordcard-parse { font-style: normal; color: var(--hg-muted); }

/* Finish */
body.hope-guide .gk-finish-mark { background: var(--hg-develop); box-shadow: none; }
body.hope-guide .gk-finish p { font-size: 17px; color: var(--hg-body); }

@media (max-width: 560px) {
  body.hope-guide .gk-head { margin-bottom: 1.2rem; }
  body.hope-guide .gk-sub { font-size: 16px; }
  body.hope-guide .gk-intro { font-size: 15px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
  body.hope-guide .gk-unit-head { flex-wrap: wrap; }
  body.hope-guide .gk-unit-headtext { flex-basis: calc(100% - 70px); }
  body.hope-guide .gk-unit-count { margin-left: 62px; }
}

/* Audio buttons: comfortable tap size */
body.hope-guide .gk-audio { min-width: 44px; min-height: 44px; }
