/* Merchandising surfaces (Oct 24 2026): light ivory shopping areas, star field kept for brand moments.
   Loaded LAST on picker.html, book.html, cart.html, checkout.html. Dark islands kept: top nav, Fabism artwork,
   book cover/mockups, printed-page previews, review/dedication dialog, flip-book preview, celebrations.
   Backups of the pages: *.bak_pre_merch. Remove this file's <link> to revert. */
.pk-body{
  --m-bg:#f8f4ec; --m-panel:#fffdf9; --m-line:#e3d9c6; --m-ink:#1b1814; --m-mute:#5a5247;
  --m-gold:#b8892b; --m-gold-ink:#7d5a12; --m-gold-soft:#f3e7cc;
  --c-all:#1b1814; --c-mot:#b04a22; --c-art:#1d6b74; --c-phi:#5a4a8c; --c-mine:#7d5a12;
  --m-shadow:0 1px 2px rgba(40,30,10,.06),0 6px 18px -8px rgba(40,30,10,.18);
  background:var(--m-bg)!important; color:var(--m-ink);
}
.pk-body{--m-line2:#cdbfa6}
html:has(.pk-body){background:var(--m-bg);scrollbar-color:rgba(60,45,20,.45) transparent}

/* dark islands keep light text */
.pk-body .pk-nav,.pk-body .pk-review,.pk-body .pk-fb,.pk-body .pk-burst,.pk-body .rl__media,.pk-body .st-hero__img,.pk-body .st-page{color:#f5f5f5}

/* shared type on light */
.pk-body :is(.pk,.st-wrap,.co-wrap) :is(.kicker,.pk-small,.sub){color:var(--m-mute)}
.pk-body :is(.st-wrap,.co-wrap) .display{color:var(--m-ink)}
.pk-body :is(.st-wrap,.co-wrap) :is(.lede){color:#2c2721}
.pk-body :is(.st-wrap,.co-wrap) .body{color:#3b352d}
.pk-body :is(.st-wrap,.co-wrap) a:not(.btn){color:var(--m-gold-ink);text-underline-offset:3px}
.pk-body .pk-note{color:#a3261b}.pk-body .pk-note.ok{color:#1f6b35}

/* buttons on light */
.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn{color:var(--m-ink);border:1.5px solid var(--m-ink);background:var(--m-panel);border-radius:6px}
.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn:hover,.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn:focus-visible{background:var(--m-ink);color:#fff}
.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn--solid{background:var(--m-ink);color:#fff;border-color:var(--m-ink);box-shadow:inset 0 -2px 0 var(--m-gold)}
.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn--solid:hover,.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn--solid:focus-visible{background:#000;color:#f3d78f;border-color:#000}
.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn:focus-visible{outline:2px solid var(--m-gold);outline-offset:3px}
.pk-body :is(.pk-hud,.pk,.st-wrap,.co-wrap) .btn[disabled]{opacity:.45}

/* ---------- picker HUD ---------- */
.pk-body{--hud:128px}
@media(min-width:900px){.pk-body{--hud:132px}}
.pk-body .pk-hud{background:rgba(255,253,249,.97);border-bottom:1px solid var(--m-line);box-shadow:0 8px 20px -14px rgba(40,30,10,.35);padding:12px var(--pad)}
.pk-body .pk-hud__row{gap:14px}
.pk-body .pk-hud__row--tools{margin-top:12px;padding-top:12px;border-top:1px solid var(--m-line);gap:16px}
.pk-body .pk-ring{color:var(--m-ink)}
.pk-body .pk-ring__bg{stroke:var(--m-line)}
.pk-body .pk-ring__fg{stroke:var(--m-gold)}
.pk-body .pk-ring.is-full .pk-ring__fg{stroke:var(--m-gold);filter:none}
.pk-body .pk-ring__n small{color:var(--m-mute)}
.pk-body .pk-hud__mid{background:var(--m-bg);border:1px solid var(--m-line);border-radius:10px;padding:8px 14px 10px;margin-right:8px}
.pk-body .pk-hud__label{color:var(--m-ink);font-size:16px}
.pk-body .pk-bar{height:5px;border-radius:5px;background:#e9e0cd;overflow:hidden}
.pk-body .pk-bar i{background:linear-gradient(90deg,#c99b3c,var(--m-gold));border-radius:5px}
.pk-body .pk-auto,.pk-body .pk-revbtn{padding:12px 16px;font-size:10.5px}

/* category chips: distinct accent per category, clear selected state */
.pk-body .pk-filters{gap:8px;padding:2px}
.pk-body .pk-filters button,.pk-body .pk-view button{--c:var(--c-all);display:inline-flex;align-items:center;gap:7px;font:600 12px/1 var(--sans);letter-spacing:.03em;color:var(--m-ink);background:var(--m-panel);border:1.5px solid var(--m-line2);border-radius:999px;padding:9px 14px;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
.pk-body .pk-filters button::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--c);flex:none}
.pk-body .pk-filters [data-filter=motivational]{--c:var(--c-mot)}
.pk-body .pk-filters [data-filter=artistic]{--c:var(--c-art)}
.pk-body .pk-filters [data-filter=philosophical]{--c:var(--c-phi)}
.pk-body .pk-filters [data-filter=picked]{--c:var(--c-mine)}
.pk-body .pk-filters [data-filter=picked]::before{content:"\2665";width:auto;height:auto;background:none;color:var(--c);font-size:12px;line-height:1}
.pk-body .pk-filters button:hover,.pk-body .pk-view button:hover{border-color:var(--c);box-shadow:0 0 0 1px var(--c) inset}
.pk-body .pk-filters button:focus-visible,.pk-body .pk-view button:focus-visible{outline:2px solid var(--m-gold);outline-offset:2px}
.pk-body .pk-filters button[aria-checked=true]{background:var(--c);border-color:var(--c);color:#fff;box-shadow:0 3px 10px -4px var(--c)}
.pk-body .pk-filters button[aria-checked=true]::before{background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
.pk-body .pk-filters [data-filter=picked][aria-checked=true]::before{background:none;color:#fff;box-shadow:none}
.pk-body .pk-view{gap:0;border:1.5px solid var(--m-line2);border-radius:999px;padding:3px;background:var(--m-panel)}
.pk-body .pk-view button{border:0;padding:7px 13px;background:transparent}
.pk-body .pk-view button[aria-pressed=true]{background:var(--m-ink);color:#fff}

/* ---------- picker body ---------- */
.pk-body .pk-hint{color:var(--m-mute);padding-top:14px}
.pk-body .pk-paths{padding-top:22px}
.pk-body .pk-paths__lead{color:var(--m-mute)}
.pk-body .pk-paths__dot{color:var(--m-gold)}
.pk-body .pk-paths__or{color:var(--m-mute)}
.pk-body .pk-path{background:var(--m-panel);border:1.5px solid var(--m-line);color:var(--m-ink);box-shadow:var(--m-shadow)}
.pk-body .pk-path:hover{border-color:var(--m-gold);background:#fff}
.pk-body .pk-path small{color:var(--m-mute)}
.pk-body .pk-path__ico{color:var(--m-gold-ink)}
.pk-body .pk-path--pop{border-color:var(--m-gold);background:linear-gradient(180deg,#fff,var(--m-gold-soft))}
.pk-body .pk-path[aria-pressed=true]{border-color:var(--m-ink);box-shadow:0 0 0 2px var(--m-ink)}
.pk-body .pk-popdone{background:var(--m-panel);border:1.5px solid var(--m-gold);box-shadow:var(--m-shadow)}
.pk-body .pk-popdone__star{color:var(--m-gold-ink)}
.pk-body .pk-popdone__s{color:var(--m-mute)}
.pk-body .pk-empty{color:var(--m-mute)}

/* product cards */
.pk-body .rl__it{--c:var(--c-all)}
.pk-body .rl__it[data-cat=motivational]{--c:var(--c-mot)}
.pk-body .rl__it[data-cat=artistic]{--c:var(--c-art)}
.pk-body .rl__it[data-cat=philosophical]{--c:var(--c-phi)}
.pk-body .rl__media{border:0;border-radius:6px;box-shadow:0 10px 26px -12px rgba(30,20,5,.55)}
.pk-body .is-picked .rl__media{box-shadow:0 0 0 3px var(--m-gold),0 10px 26px -12px rgba(30,20,5,.55)}
.pk-body .is-picked .rl__media::after{box-shadow:none}
.pk-body .rl__chk{background:var(--m-gold);color:#fff}
.pk-body .rl__q{color:var(--m-ink)}
.pk-body .rl__desc{color:var(--m-mute)}
.pk-body .rl__tag{display:inline-block;margin-top:6px;color:var(--c);background:color-mix(in srgb,var(--c) 10%,#fff);border:1px solid color-mix(in srgb,var(--c) 35%,#fff);border-radius:999px;padding:4px 8px;letter-spacing:.14em}
.pk-body .heart{border:1.5px solid var(--m-ink);background:var(--m-panel);color:var(--m-ink)}
.pk-body .heart:hover{background:var(--m-gold-soft)}
.pk-body .heart[aria-pressed=true]{background:var(--m-ink);border-color:var(--m-ink);color:#f0cf7c}
.pk-body .pk[data-view=grid] .rl{gap:22px;padding-top:24px}
.pk-body .pk[data-view=grid] .rl__card{background:var(--m-panel);border:1px solid var(--m-line);border-top:3px solid var(--c);border-radius:10px;padding:10px 10px 12px;box-shadow:var(--m-shadow);height:auto}
.pk-body .pk[data-view=grid] .rl__media{width:100%}
.pk-body .pk[data-view=grid] .rl__cap{margin-top:12px;align-items:flex-start}
.pk-body .pk-scrub::before{background:rgba(60,45,20,.18)}
.pk-body .pk-scrub__thumb{background:rgba(60,45,20,.55);box-shadow:none}
.pk-body .pk-toast{background:var(--m-ink);color:#fff}

/* ---------- book page ---------- */
.pk-body .st-hero{gap:36px}
.pk-body .st-hero__img{background:#000 url(img/stars_bg.jpg) center/cover;border-radius:14px;padding:clamp(18px,3vw,36px);box-shadow:0 20px 40px -24px rgba(20,12,0,.6)}
.pk-body .st-price{color:var(--m-ink)}
.pk-body .st-price small{color:var(--m-mute)}
.pk-body .st-list{background:var(--m-panel);border:1px solid var(--m-line);border-radius:10px;padding:18px 20px;box-shadow:var(--m-shadow)}
.pk-body .st-list li{color:#2c2721}
.pk-body .st-list li::before{color:var(--m-gold)}
.pk-body .st-pages{gap:16px}
.pk-body .st-pages img{border:0;border-radius:6px;box-shadow:0 10px 24px -12px rgba(30,20,5,.55)}
.pk-body .st-wrap>.pk-small{margin-top:12px}
.pk-body .st-faq{gap:12px;margin-top:44px}
.pk-body .st-faq details{background:var(--m-panel);border:1px solid var(--m-line);border-radius:10px;padding:16px 18px;box-shadow:var(--m-shadow)}
.pk-body .st-faq details[open]{border-color:var(--m-gold)}
.pk-body .st-faq summary{color:var(--m-ink)}
.pk-body .st-faq p{color:#3b352d}

/* ---------- cart + checkout panels ---------- */
.pk-body :is(.st-box,.co-sum,.co fieldset,.co-done){background:var(--m-panel);border:1px solid var(--m-line);border-radius:12px;box-shadow:var(--m-shadow);padding:22px}
.pk-body .co fieldset{padding:20px 22px 22px;gap:14px}
.pk-body .co legend{color:var(--m-ink);background:var(--m-panel);border-radius:6px;padding:0 8px}
.pk-body :is(.st-box,.co-sum) :is(h2,h3){color:var(--m-ink)}
.pk-body .st-line p{color:#3b352d}
.pk-body .st-line a{color:var(--m-gold-ink)}
.pk-body .st-line picture img{background:#000;border-radius:6px}
.pk-body .st-qty{border:1.5px solid var(--m-ink);border-radius:8px;background:#fff}
.pk-body .st-qty button{color:var(--m-ink)}
.pk-body .st-qty button:hover:not(:disabled){background:var(--m-gold-soft)}
.pk-body :is(.st-ded,.co) label{color:#4a433a}
.pk-body :is(.st-ded input,.st-ded textarea,.co input,.co select){color:var(--m-ink);background:#fff;border:1.5px solid var(--m-line2);border-radius:6px}
.pk-body :is(.st-ded input,.st-ded textarea,.co input,.co select):focus{outline:2px solid var(--m-gold);outline-offset:1px;border-color:var(--m-gold-ink)}
.pk-body :is(.st-ded,.co) ::placeholder{color:#8a8173}
.pk-body .st-ded small{color:var(--m-mute)}
.pk-body .st-thumbs,.pk-body .co-thumbs{background:#000;padding:4px;border-radius:6px}
.pk-body :is(.st-sum,.co-sum) dt{color:#4a433a}
.pk-body :is(.st-sum,.co-sum) dd{color:var(--m-ink)}
.pk-body :is(.st-sum,.co-sum) .tot{border-top:1px solid var(--m-line);color:var(--m-ink)}
.pk-body .st-page__cap{color:var(--m-mute)}
.pk-body .ship{border:1.5px solid var(--m-line2)!important;border-radius:8px;color:var(--m-ink)!important;background:#fff}
.pk-body .ship small{color:var(--m-mute)}
.pk-body .ship input{accent-color:var(--m-ink)}
.pk-body .ship:has(input:checked){border-color:var(--m-ink)!important;background:var(--m-gold-soft);box-shadow:0 0 0 1px var(--m-ink) inset}
.pk-body .pay{border:1.5px dashed var(--m-line2)!important}
.pk-body .pay p{color:#3b352d}
.pk-body .pay .ph{color:var(--m-gold-ink)}
.pk-body #co-ded+a{color:var(--m-gold-ink)!important}
.pk-body .co-done code{background:var(--m-gold-soft)}
/* mobile HUD: give the counter room (no pill chrome, tighter gaps) */
@media(max-width:600px){.pk-body .pk-hud__row{gap:8px}.pk-body .pk-hud__mid{background:none;border:0;padding:0;margin:0}.pk-body .pk-hud__label{font-size:14px}}
@media(max-width:600px){.pk-body .pk-bar{display:none}.pk-body .pk-hud__label{margin:0;font-size:13px;max-height:2.4em;overflow:hidden}}