/* Our Canada site layer: lesson toolbar, home "Next up" card, slide player. */

/* ---------- Lesson page toolbar ---------- */
.oc-bar{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;
  max-width:8.5in;margin:0 auto 18px;padding:10px 12px;background:#1b2731;color:#f5f4ef;border-radius:8px;
  font-family:"Atkinson Hyperlegible","Segoe UI",system-ui,sans-serif;font-size:14px}
.oc-home{color:#e3a33b;text-decoration:none;font-weight:700}
.oc-t{font-family:"Zilla Slab",Georgia,serif;font-weight:700;font-size:17px}
.oc-sp{flex:1}
.oc-btn{display:inline-flex;align-items:center;min-height:36px;padding:6px 14px;border-radius:999px;border:1.5px solid #56636c;
  background:transparent;color:#f5f4ef;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.oc-btn:hover{border-color:#f5f4ef}
.oc-primary{background:#e3a33b;border-color:#e3a33b;color:#1b2731}
.oc-btn:focus-visible,.oc-home:focus-visible{outline:3px solid #e3a33b;outline-offset:2px}
@media (max-width:640px){.oc-bar{position:static}.oc-sp{display:none}.oc-t{width:100%}}
@media print{.oc-bar{display:none}}

/* ---------- Home ---------- */
.nextup{display:grid;gap:4px;padding:18px 20px;border-radius:8px;background:#1b2731;color:#f5f4ef;text-decoration:none}
.nextup .eyebrow{color:#e3a33b}
.nextup b{font-family:"Zilla Slab",Georgia,serif;font-size:clamp(22px,3.4vw,30px)}
.nextup span{color:#d6dde0}
.nextup .go{color:#e3a33b;font-weight:700;margin-top:4px}
.nextup:hover b{text-decoration:underline}
.nextup:focus-visible{outline:3px solid #e3a33b;outline-offset:3px}
.ready-chip{display:inline-block;font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;padding:2px 8px;border-radius:999px;background:#e3a33b;color:#1b2731;font-weight:500;vertical-align:middle}
.title-row h3 a{color:inherit;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.title-row h3 a:hover{color:var(--spruce)}

/* ---------- Slide player ---------- */
body.player{margin:0;background:#0d1317;overflow:hidden;height:100vh;font-family:"Atkinson Hyperlegible",system-ui,sans-serif}
#stage{position:fixed;inset:0 0 56px 0;overflow:hidden;cursor:pointer}
#deck{position:absolute;top:0;left:0;width:1920px;height:1080px;transform-origin:0 0}
#deck section{position:absolute;inset:0;width:1920px;height:1080px;overflow:hidden;display:none !important}
#deck section.on{display:flex !important;flex-direction:column}
#deck section#cover.on{display:block !important}
#deck *{margin:0;box-sizing:border-box}
#deck img{display:block;object-fit:cover}
#deck aside{display:none !important}
#deck a{cursor:pointer;color:inherit;text-decoration:none}
#deck table{width:100%;border-collapse:collapse}
#deck th{text-align:left;padding:10px 12px;border-bottom:3px solid #1b2731}
#deck td{padding:8px 12px;border-bottom:1px solid #c9d0d2}
.pbar{position:fixed;left:0;right:0;bottom:0;height:56px;display:flex;align-items:center;gap:8px;padding:0 12px;background:#1b2731;color:#f5f4ef}
.pb{min-height:40px;min-width:44px;padding:0 14px;border-radius:999px;border:1.5px solid #56636c;background:transparent;color:#f5f4ef;
  font:inherit;font-weight:700;font-size:15px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.pb:hover{border-color:#f5f4ef}
.pb:focus-visible,#jump:focus-visible{outline:3px solid #e3a33b;outline-offset:2px}
.pcount{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:14px;min-width:64px;text-align:center}
#jump{flex:1;min-width:0;max-width:420px;min-height:40px;border-radius:8px;border:1.5px solid #56636c;background:#0d1317;color:#f5f4ef;font:inherit;padding:0 8px}
#notes{position:fixed;left:0;right:0;bottom:56px;max-height:40vh;overflow:auto;padding:14px 18px;background:#f5f4ef;color:#1b2731;
  font-size:18px;line-height:1.45;border-top:4px solid #e3a33b;display:none}
#notes.open{display:block}
:fullscreen .pbar{opacity:0;transition:opacity .2s}
:fullscreen .pbar:hover,:fullscreen .pbar:focus-within{opacity:1}
:fullscreen #stage{bottom:0}
@media (max-width:640px){#btn-full{display:none}}
.nextups{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
