/* Bookmark pill, dialog and nudge (shared by the illustrated site and the text pages) */
.bm-pill, .bm-link { cursor: pointer; font: 600 .8rem 'Poppins', system-ui, sans-serif; letter-spacing: .02em; color: #fff; display: inline-flex; align-items: center; gap: .45rem; }
.bm-pill { position: fixed; z-index: 7; right: 14px; top: max(62px, calc(env(safe-area-inset-top) + 54px)); height: 42px; padding: 0 .95rem 0 .75rem; border-radius: 999px;
  background: linear-gradient(135deg, #ff9a3c, #ff6a1a); color: #2a0e00; border: 1px solid rgba(255,255,255,.35);
  box-shadow: 0 6px 22px rgba(0,0,0,.5), 0 0 20px rgba(255,140,50,.45); animation: bmPulse 2.8s ease-in-out infinite; transition: transform .2s; }
.bm-pill:hover { transform: translateY(-1px); }
.bm-pill .bm-star-i { font-size: 1.05rem; line-height: 1; }
.bm-pill .bm-short { display: none; }
@keyframes bmPulse { 0%,100% { box-shadow: 0 6px 22px rgba(0,0,0,.5), 0 0 0 0 rgba(255,140,50,.55), 0 0 20px rgba(255,140,50,.4); }
  50% { box-shadow: 0 6px 22px rgba(0,0,0,.5), 0 0 0 9px rgba(255,140,50,0), 0 0 28px rgba(255,140,50,.6); } }
@media (max-width: 380px) { .bm-pill .bm-long { display: none; } .bm-pill .bm-short { display: inline; } }
.bm-link { background: transparent; border: 1px solid #ffd27a; color: #ffd27a; border-radius: 999px; padding: .25rem .8rem; font-size: .8rem; font-weight: 500; }
.bm-link:hover { background: #ffd27a; color: #200; }
.bm-link-foot { display: inline-flex; margin: 0 auto .8rem; }

.bm-dlg { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 16px; background: rgba(5,3,8,.72); opacity: 0; transition: opacity .22s ease; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.bm-dlg[hidden] { display: none; }
.bm-dlg.show { opacity: 1; }
.bm-box { position: relative; width: min(420px, 100%); padding: 1.6rem 1.4rem 1.3rem; border-radius: 20px; text-align: center; color: #fff6e6;
  background: linear-gradient(160deg, #2a1418, #120a16); border: 1px solid rgba(255,190,100,.5); box-shadow: 0 24px 80px rgba(0,0,0,.7), 0 0 50px rgba(255,140,50,.25);
  font-family: 'Poppins', system-ui, sans-serif; transform: translateY(14px) scale(.98); transition: transform .25s cubic-bezier(.16,1,.3,1); }
.bm-dlg.show .bm-box { transform: none; }
.bm-x { position: absolute; top: 8px; right: 10px; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255,255,255,.08); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.bm-star { font-size: 2.2rem; color: #ffb347; text-shadow: 0 0 24px #ff8a2a; line-height: 1; }
.bm-title { font: 700 1.25rem 'Cinzel', serif; color: #ffd27a; margin: .4rem 0 .2rem; }
.bm-sub { font-size: .88rem; color: #e0cfb0; margin-bottom: 1rem; }
.bm-steps { text-align: left; margin: 0 0 1.1rem 1.2rem; padding: 0; font-size: .92rem; line-height: 1.55; color: #f0e2c8; }
.bm-steps li { margin-bottom: .55rem; padding-left: .2rem; }
.bm-steps kbd { display: inline-block; padding: .05rem .45rem; border-radius: 6px; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.1); font: 600 .85rem 'Poppins', sans-serif; }
.bm-actions { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; }
.bm-btn { min-height: 44px; padding: .55rem 1.2rem; border-radius: 999px; font: 600 .86rem 'Poppins', system-ui, sans-serif; cursor: pointer; color: #fff6e6; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.3); }
.bm-btn:hover { border-color: #ffb347; }
.bm-primary { background: linear-gradient(135deg, #ff9a3c, #ff6a1a); color: #2a0e00; border-color: transparent; }
.bm-small { min-height: 38px; padding: .35rem 1rem; }
.bm-note { margin-top: .9rem; font-size: .74rem; color: #b9a98c; }

.bm-nudge { position: fixed; z-index: 50; left: 50%; top: max(116px, calc(env(safe-area-inset-top) + 108px)); transform: translate(-50%, -12px); width: min(430px, calc(100vw - 24px));
  display: flex; align-items: center; gap: .6rem; padding: .6rem .7rem .6rem .9rem; border-radius: 16px; color: #fff6e6; font: 400 .84rem/1.35 'Poppins', system-ui, sans-serif;
  background: rgba(20,10,20,.95); border: 1px solid #ffb347; box-shadow: 0 14px 40px rgba(0,0,0,.6), 0 0 26px rgba(255,140,50,.3); opacity: 0; transition: opacity .35s, transform .35s; }
.bm-nudge.show { opacity: 1; transform: translate(-50%, 0); }
.bm-nstar { font-size: 1.4rem; color: #ffb347; }
.bm-ntext { flex: 1; min-width: 0; }
.bm-nno { border: 0; background: transparent; color: #cdbb9a; font: 500 .78rem 'Poppins', sans-serif; padding: .5rem .4rem; cursor: pointer; min-height: 40px; }
@media (prefers-reduced-motion: reduce) { .bm-pill { animation: none; } .bm-dlg, .bm-box, .bm-nudge { transition: none; } }

.begin[hidden] { display: none; }
#resumeBtn { border-color: #ffb347; background: linear-gradient(135deg, rgba(255,154,60,.25), rgba(255,106,26,.15)); margin-top: 1.4rem; }
