/* makeabook.fun brand: "Hybrid B" (Punita's pick). Crayon-box bright, but polished: one system on every page
   (home, ideas, maker, guide). Loaded LAST so it wins over the older shared styles.

   Color    warm white #FFF8EE pages, white cards, ink #2B2A33
            crayon red #E4572E: main buttons (filled a touch deeper, #CF4520, so white text stays readable), links, accents
            sunflower #F3B61F, sky #3A86C8, grass #4CA35A: accents, one per element, never all on one thing
            tints for chips/sections: red #FDE6DF/#9A3412 · yellow #FDF1CC/#7A5A00 · blue #DCEBF8/#1E4E7A · green #E3F1E4/#2F6B37
   Type     logo Cormorant Garamond italic 500 · headings Fredoka 500 with one colored phrase · body Nunito 400 · buttons Nunito 700
   Shape    pill buttons (red fill, or white with a 1.5px ink outline) · cards 22px corners, soft shadow · pictures 16px corners
   Tokens below re-point the shared variables (vibe.css, home.css, maker.css, ideas.css) so most things follow on their own. */
:root, html body.makeabook {
  --ink: #2B2A33; --ink-soft: #4A4752; --line: rgba(43, 42, 51, .12);
  --red: #E4572E; --red-btn: #CF4520; --red-btn-d: #B93A15; --red-text: #B93A15;
  --sun: #F3B61F; --sky: #3A86C8; --grass: #4CA35A;
  --red-50: #FDE6DF; --red-ink: #9A3412; --sun-50: #FDF1CC; --sun-ink: #7A5A00; --sky-50: #DCEBF8; --sky-ink: #1E4E7A; --grass-50: #E3F1E4; --grass-ink: #2F6B37;
  --page: #FFF8EE; --alt: #EAF2FA; --alt-warm: #FEF6DE;
  --paper: var(--page); --card: #ffffff; --sage: var(--alt); --desk: #F4EDE2;
  --rust: var(--red-text); --forest: var(--red-btn); --forest-2: var(--red-btn-d); --rose: var(--red-ink);
  --serif: "Fredoka", "Nunito", system-ui, sans-serif; --caps: "Nunito", system-ui, sans-serif; --body: "Nunito", system-ui, sans-serif;
  --logo: "Cormorant Garamond", Georgia, serif;
  --paper-tex: none; --scallop: none; --scallop-sage: none;
  --shadow: 0 14px 34px -20px rgba(43, 42, 51, .3);
  --soft: 0 1px 2px rgba(43, 42, 51, .05), 0 14px 30px -18px rgba(43, 42, 51, .24);
  --outline: 1px solid var(--line);
  --mark: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 26'><path d='M2 5 Q9 2 16 6 Q23 2 30 5 V22 Q23 19 16 23 Q9 19 2 22Z' fill='%23F3B61F' stroke='%232B2A33' stroke-width='1.6' stroke-linejoin='round'/><path d='M16 6V23' stroke='%232B2A33' stroke-width='1.6'/><path d='M16 6 C16 0 22 0 22 4' fill='none' stroke='%23E4572E' stroke-width='1.8' stroke-linecap='round'/></svg>");
}

/* ---------- ground: warm white, no watercolor, no grain ---------- */
html body, html body.makeabook.page-id-9442 { background: var(--page) !important; color: var(--ink); }
.mb-wash { display: none !important; }
.h-sec.sage::before, .mb-header::after { display: none !important; }

/* ---------- header + logo: italic "Make a Book" with the open-book mark ---------- */
.mb-header, .mk-top { background: rgba(255, 248, 238, .94) !important; border-bottom: var(--outline) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.mb-wordmark, .mk-wordmark { font: italic 500 25px/1 var(--logo) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--ink) !important; gap: 0 !important; white-space: pre; }
.mb-wordmark span, .mk-wordmark span { color: var(--ink) !important; }
.mb-wordmark svg, .mk-wordmark svg { display: none !important; }
.mb-wordmark::before, .mk-wordmark::before { content: ""; width: 32px; height: 26px; flex: none; margin-right: 9px; background: var(--mark) center / contain no-repeat; }
.mb-nav a { font: 700 13px/1 var(--caps) !important; letter-spacing: .02em !important; text-transform: none !important; color: var(--ink-soft) !important; }
.mb-nav a:hover { color: var(--ink) !important; }
.mb-nav a[aria-current="page"] { color: var(--ink) !important; text-decoration-color: var(--sun) !important; text-decoration-thickness: 3px !important; }
.mk-nav a { font: 700 13px/1 var(--caps) !important; letter-spacing: .02em !important; text-transform: none !important; color: var(--ink-soft) !important; }

/* ---------- type ---------- */
.home h1, .home h2, .home h3, .a-wrap h1, .a-body h2, .a-body h3, .mk-library h1, .mk-library h2, .mk-panel h2, .mk-dlg h2, .mk-dlg h3,
html body.makeabook.page-id-9442 :is(h1, h2, h3, h4) { font-family: var(--serif) !important; font-weight: 500 !important; letter-spacing: -.005em; color: var(--ink) !important; }
/* one colored phrase per headline: sky blue on the hero, crayon red elsewhere */
:is(.h-title, .mk-hero h1, .i-hero .h-title) em { font-style: normal !important; color: var(--red) !important; background: none !important; padding: 0 !important; }
.h-hero h1 em { font-style: normal !important; color: var(--sky) !important; background: none !important; padding: 0 !important; }
.a-end-make h2 em { font-style: normal !important; color: var(--sun) !important; background: none !important; }
.h-eyebrow, .mk-eyebrow, .i-eyebrow, .mb-offer-eyebrow, .mk-field > span, .mk-dlg label, .mk-dlg legend { font-family: var(--caps) !important; font-weight: 800 !important; color: var(--red-ink) !important; letter-spacing: .1em !important; }
.h-quote, .h-review p, .a-body blockquote, html body.makeabook.page-id-9442 .mb-quotes p { font-family: var(--body) !important; font-style: normal !important; font-weight: 600 !important; }
a { color: var(--red-text); }
.h-sub, .h-steps p, .h-starter p, .i-card p, .h-reasons p { color: var(--ink-soft) !important; }

/* ---------- buttons: red pill (main), white pill with a 1.5px ink outline (secondary) ---------- */
.h-btn, .mb-nav .mb-cta, .mk-btn, a.mb-buy-btn:not(#mb-none),
html body.makeabook.page-id-9442 :is(.bde-button__button, .button-atom, .formkit-submit) {
  background: var(--red-btn) !important; color: #fff !important; border: 1.5px solid var(--red-btn) !important; border-radius: 999px !important;
  box-shadow: 0 8px 18px -10px rgba(207, 69, 32, .65) !important; font-family: var(--caps) !important; font-weight: 700 !important;
  letter-spacing: .03em !important; text-transform: none !important; transition: transform .2s ease, background .15s ease !important;
}
.h-btn:hover, .mb-nav .mb-cta:hover, .mk-btn:hover, a.mb-buy-btn:not(#mb-none):hover, html body.makeabook.page-id-9442 :is(.bde-button__button, .button-atom, .formkit-submit):hover {
  background: var(--red-btn-d) !important; border-color: var(--red-btn-d) !important; transform: translateY(-1px) !important;
}
.mb-nav .mb-cta { color: #fff !important; }
.h-btn.ghost, .mk-btn.ghost, a.mb-ghost-btn:not(#mb-none) { background: #fff !important; color: var(--ink) !important; border: 1.5px solid var(--ink) !important; box-shadow: none !important; }
.h-btn.ghost:hover, .mk-btn.ghost:hover, a.mb-ghost-btn:not(#mb-none):hover { background: var(--sun-50) !important; }
.a-end-make .h-btn { background: #fff !important; color: var(--ink) !important; border-color: #fff !important; }
.mk-btn.danger { background: #fff !important; color: var(--red-text) !important; border: 1.5px solid var(--red-text) !important; box-shadow: none !important; }
.mk-btn:disabled { background: #e9e5de !important; border-color: #e9e5de !important; color: #8a8590 !important; box-shadow: none !important; }
.h-guide { background: var(--sun-50) !important; border: 0 !important; box-shadow: none !important; color: var(--ink) !important; }

/* ---------- cards: white, 22px corners, soft shadow ---------- */
.h-steps li, .h-starter, .h-plan, .i-card, .h-note, .h-try, .h-review, .a-cta, .a-end-book, .a-end-hunny, .mk-starter-row a, .mk-exports article, .mk-kdp, .mk-coach,
.h-faq details, .h-kdp ol li, html body.makeabook.page-id-9442 :is(.mb-inside-card, .mb-quotes blockquote) {
  background: #fff !important; border: var(--outline) !important; border-radius: 22px !important; box-shadow: var(--soft) !important;
}
.h-starter:hover, .i-card:hover, .mk-starter-row a:hover { transform: translateY(-3px) !important; box-shadow: 0 18px 36px -20px rgba(43, 42, 51, .35) !important; }
.h-plan.hl { outline: none !important; border: 1.5px solid var(--red) !important; }
.h-badge { background: var(--red-btn) !important; color: #fff !important; border: 0 !important; font-family: var(--caps) !important; font-weight: 800 !important; }
.h-try-page, .mk-book .cv { background: var(--desk) !important; }
.mk-dlg { border: 0 !important; box-shadow: 0 30px 70px -24px rgba(43, 42, 51, .35) !important; background: var(--page) !important; }
.mk-cards .c, .mk-sizes .c, .mk-fonts .c, .mk-layouts button, .mk-panel textarea, .mk-panel input[type="text"], .mk-dlg input, .mk-dlg select, .h-try-tools input { border: 1.5px solid #e2dbcf !important; background: #fff !important; }
:is(.mk-cards, .mk-sizes, .mk-fonts) input:checked + .c, .mk-layouts button[aria-pressed="true"] { background: var(--sun-50) !important; border-color: var(--sun) !important; }
/* pictures: 16px corners */
.h-cover, .mb-offer-cover img, .mb-inside-cover img, .a-end-book img { border-radius: 4px 16px 16px 4px !important; border: 0; }

/* ---------- chips and accents: one crayon per element ---------- */
.h-ic, .h-starter .ic, .mk-starter-row .ic { border: 0 !important; }
.h-ic, .h-starters > :nth-child(1) .ic, .mk-starter-row > :nth-child(1) .ic { background: var(--sun-50) !important; color: var(--sun-ink) !important; }
.h-steps li:nth-child(2) .h-ic, .h-reasons > :nth-child(2) .h-ic, .h-starters > :nth-child(2) .ic, .mk-starter-row > :nth-child(2) .ic { background: var(--sky-50) !important; color: var(--sky-ink) !important; }
.h-steps li:nth-child(3) .h-ic, .h-reasons > :nth-child(3) .h-ic, .h-starters > :nth-child(3) .ic, .mk-starter-row > :nth-child(3) .ic { background: var(--red-50) !important; color: var(--red-ink) !important; }
.h-steps li:nth-child(4) .h-ic, .h-starters > :nth-child(4) .ic, .mk-starter-row > :nth-child(4) .ic { background: var(--grass-50) !important; color: var(--grass-ink) !important; }
.h-steps li::before { font-family: var(--serif) !important; font-weight: 600 !important; opacity: 1 !important; }
.h-steps li:nth-child(1)::before { color: var(--sun) !important; } .h-steps li:nth-child(2)::before { color: var(--sky) !important; }
.h-steps li:nth-child(3)::before { color: var(--red) !important; } .h-steps li:nth-child(4)::before { color: var(--grass) !important; }
.h-ticks li::before, .h-plan li::before, .mk-checks li::before, .a-body li::marker { color: var(--grass) !important; }
.mk-steps b, .mk-pill.all { background: var(--grass) !important; color: #fff !important; }
.mk-pill { background: var(--sun-50) !important; color: var(--sun-ink) !important; border: 0; }
.h-tag, .h-days b, .i-more, .mk-steps li { font-family: var(--caps) !important; }
.i-more, .h-starter span { color: var(--red-text) !important; }
.i-eyebrow { color: var(--sky-ink) !important; }
html body.makeabook.page-id-9442 :is(.bde-section-9442-300 .bde-text, .fd-label, .fd-eyebrow) { background: var(--red-50) !important; color: var(--red-ink) !important; font-family: var(--caps) !important; font-weight: 800 !important; letter-spacing: .08em !important; }
.h-stars, .a-stars, .h-rating span, .h-trust-stars, html body.makeabook.page-id-9442 .mb-stars, html body.makeabook.page-id-9442 .mb-quotes blockquote::before { color: var(--sun) !important; }
.h-review { border-left: 4px solid var(--sun) !important; }

/* ---------- sections: warm white, alternating with one soft blue tint ---------- */
.h-sec.sage, .a-related { background: var(--alt) !important; }
.h-sec.sage.h-final { background: var(--alt-warm) !important; }
.h-hero { position: relative; overflow: hidden; }
.h-hero::before, .h-hero::after { content: ""; position: absolute; pointer-events: none; background-repeat: no-repeat; background-size: contain; z-index: -1; }
.h-hero::before { left: 3%; top: 10%; width: 44px; height: 44px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2.5l2.8 6 6.4.8-4.7 4.4 1.2 6.4L12 17l-5.7 3.1 1.2-6.4-4.7-4.4 6.4-.8z' fill='%23F3B61F'/></svg>"); transform: rotate(-12deg); }
.h-hero::after { right: 4%; bottom: 8%; width: 104px; height: 30px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 34'><path d='M3 20 Q18 6 33 20 T63 20 T93 20 T117 15' fill='none' stroke='%233A86C8' stroke-width='5' stroke-linecap='round'/></svg>"); }
html body.makeabook.page-id-9442 .bde-section-9442-300 { background: var(--alt-warm) !important; border-bottom: var(--outline); }
html body.makeabook.page-id-9442 main :is(.bde-section-9442-306, .bde-section-9442-332, .bde-section-9442-356, .bde-section-9442-378) { background: var(--alt) !important; }
.mk-books { background: var(--alt) !important; border: var(--outline); box-shadow: none !important; }
.mk-books::after { background: #d9cbb4 !important; height: 10px !important; }
.mk-new { background: #fff !important; border: 2px dashed #e2c9a0 !important; color: var(--ink) !important; }

/* ---------- footer: ink, with crayon accents ---------- */
.mb-footer { background: var(--ink) !important; color: #e8e6ee !important; border-top: 0; }
.mb-footer .mb-wordmark, .mb-footer .mb-wordmark span { color: #fff !important; }
.mb-footer a, body.makeabook .mb-footer a { color: #fff !important; text-decoration-color: var(--sun) !important; }

/* ---------- maker specifics ---------- */
.mk-strip li button[aria-current="true"] { border-color: var(--red) !important; background: #fff !important; }
.mk-add { border-color: #e2c9a0 !important; color: var(--ink) !important; }
.mk-panel { background: #fff !important; border-left: var(--outline) !important; }
.mk-strip { border-right: var(--outline) !important; background: var(--page) !important; }
.mk-seg { border: 1.5px solid #e2dbcf !important; background: #fff !important; }
.mk-seg button[aria-pressed="true"] { background: var(--ink) !important; color: #fff !important; }
.mk-done { background: var(--grass-50) !important; border: 0; }
.mk-toast { background: var(--ink) !important; }
.mk-reader { background: #2B2A33 !important; }
@media (max-width: 900px) { .mk-panel { border-left: 0 !important; border-top: var(--outline) !important; } .mk-strip { border-right: 0 !important; border-bottom: var(--outline) !important; } }

/* Fredoka has no italic: the guide's italic headings stay upright (and everything inside them) */
html body.makeabook.page-id-9442 :is(h1, h2, h3, h4, h5), html body.makeabook.page-id-9442 :is(h1, h2, h3, h4, h5) * { font-style: normal !important; }

/* ---------- phones ---------- */
@media (max-width: 760px) { .h-hero::before, .h-hero::after { display: none; } }
@media (max-width: 560px) {
  .mb-wordmark, .mk-wordmark { font-size: 22px !important; }
  .mb-wordmark::before, .mk-wordmark::before { width: 27px; height: 22px; margin-right: 7px; }
  .mb-nav .mb-cta { padding: 10px 13px !important; font-size: 12px !important; }
  .mk-nav { display: none !important; }
}