/* Print Buddy: styles for the Setup & Care Guides. Split out of site.css on 19 Oct 2026 (speed: every shop page loaded all of it);
   linked right after site.css by setup.html. New rules that only these pages use go here; see docs/STYLE-GUIDE.md. */
/* ---- Template proofs (19 Oct 2026): a file made on our template, shown in 3D on the gazebo and as its printed pieces ---- */
/* Setup & Care Guides (setup.html, js/howto.js, js/howto-art.js; 19 Oct 2026, redesigned the same night: "a guide needs to
   look like a guide"). Hub: search, the Journal's pill filters, guide cards with a line drawing on --panel. A guide: a photo
   header with Time / People / Level chips and Start / Print buttons, the doc layout's sticky contents on the left, What You
   Need on --panel, numbered sections (the free guides' .g-n chip), step cards (drawing on --panel, "Step N", title, words),
   picture cards, photos with captions, Tip / Safety figure cards (.g-fc, honey for safety), questions, the shop's own product
   cards, the contact strip, more guides. Print: the guide only, steps three across. */
.ht-svg{display:block;width:100%;height:auto;stroke:var(--ink);stroke-width:1.6;color:var(--ink)}
.ht-svg .s{fill:#DEE3E7}
.ht-svg .a{fill:rgba(var(--prgb),.24)}
.ht-svg .a2{stroke:var(--primary);stroke-width:4.5}
.ht-svg .w{fill:#fff}
.ht-svg .w2{stroke:#fff;stroke-width:4}
.ht-svg .th{stroke-width:2.8}
.ht-svg .th2{stroke-width:2.6}
.ht-svg .thin{stroke:var(--muted);stroke-width:1}
.ht-svg .gr{stroke:var(--muted);stroke-width:1.2;opacity:.7}
.ht-svg .ar{stroke:var(--primary);stroke-width:2}
.ht-svg .ar2{stroke:var(--primary);stroke-width:1.6;opacity:.65}
.ht-svg .cord{stroke:var(--accent);stroke-width:1.3}
.ht-svg .tie{stroke:var(--ink);stroke-width:1.8}
.ht-svg .hl,.ht-svg .hl .tie{stroke:var(--primary);stroke-width:2.6}
.ht-svg .soil{fill:#E9E3D8;stroke:none}
.ht-svg .soil2{fill:#E8ECEF;stroke:none}
.ht-svg .glass{fill:rgba(var(--prgb),.07)}
.ht-svg .tape,.ht-svg .tapef{fill:var(--attn-ring);stroke:var(--attn-line)}
.ht-svg .spray{stroke:var(--primary);stroke-width:1.6;stroke-dasharray:1 4}
.ht-svg .drops{stroke:var(--primary);stroke-width:2}
.ht-svg .no{stroke:var(--attn);stroke-width:3;fill:none}
.ht-svg .okc{fill:var(--primary);stroke:none}
.ht-svg .ok{stroke:#fff;stroke-width:2.2}
.ht-svg .mesh{fill:rgba(var(--prgb),.12);stroke-dasharray:3 2}
.ht-svg .dot{fill:var(--ink);stroke:none}
.ht-svg .pp{stroke-width:1.8}
.ht-svg .pp .s{fill:#fff}
.ht-svg .ht-t{fill:var(--muted);stroke:none;font-family:Montserrat,system-ui,sans-serif;font-size:8.6px;font-weight:500;letter-spacing:.3px}
.ht-page #htContact{margin-top:34px}
@media print{.ht-page{padding:0!important}
.ht-page *{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

/* setup guide films (20 Oct 2026): our picture with a play button, the player loads on press */
.ht-video{margin:6px 0 18px;max-width:720px}
.ht-vplay,.ht-vframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--radius);overflow:hidden;background:#1d2329}
.ht-vplay{position:relative;padding:0;cursor:pointer}
.ht-vplay img{width:100%;height:100%;object-fit:cover;display:block;opacity:.88;transition:opacity .15s}
.ht-vplay:hover img,.ht-vplay:focus-visible img{opacity:1}
.ht-vplay:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.ht-vbtn{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.94);color:var(--ink);display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.ht-vbtn svg{width:30px;height:30px;margin-left:3px}
.ht-vlen{position:absolute;right:10px;bottom:10px;padding:3px 8px;border-radius:var(--radius-sm);background:rgba(0,0,0,.65);color:#fff;font-size:12px;font-weight:500}
.ht-video figcaption{margin-top:8px;font-size:13px;line-height:1.5;color:var(--muted)}
.ht-video figcaption b{display:block;font-weight:500;color:var(--ink)}
@media print{.ht-video{display:none}}

/* Print This Guide (moved from site.css, 20 Oct 2026: unscoped there, it hid the chrome and opened every FAQ on any printed page) */
@media print{
  
  body>*:not(main),.ht-page .crumbs,.ht-acts,.ht-sheets,.ht-layout>.doc-nav,.ht-shop,.ht-help,.ht-more,#htContact{display:none!important}
  
  .ht-hero{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:24px;padding:0 0 16px;margin:0 0 18px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none}
  .ht-ph{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px;padding:0 0 10px;border-bottom:1px solid var(--line);font-size:8.5pt;color:var(--muted)}.ht-ph img{height:9mm;width:auto}
  .ht-hero h1{font-size:22pt}.ht-photo{aspect-ratio:4/3;max-height:58mm}.ht-fig{max-width:95mm}.ht-im{aspect-ratio:4/3}
  .ht-layout{display:block}.ht-steps,.ht-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .ht-step,.ht-cardx,.g-fc,.ht-fig,.ht-need,details.faq,.ht-tbl{break-inside:avoid}
  .ht-sh{break-after:avoid}.ht-sec{margin-bottom:22px}.ht-card:hover{transform:none}
  details.faq .a{display:block}
  .ht-main::after{content:"More setup and care guides: www.myprintbuddy.co.uk/setup";display:block;margin-top:18px;padding-top:10px;border-top:1px solid var(--line);font-size:9pt;color:var(--muted)}}