/* CoraVision Help Centre (coravision.ai/help/), 12 October 2026.
   Loaded after style.css on every help page by templates/layouts/help.php.
   Every class is prefixed hc- so nothing collides with the site. The design is
   handover/Support/mockups/ (approved by Jed on 12 October 2026). */

:root{
  --hc-sidebar:236px;
  --hc-toc:200px;
  --hc-amber:#B9791A;
  --hc-amber-tint:#FFF4DF;
  --hc-red:#D23C3C;
  --hc-red-tint:#FDECEC;
  --hc-green-ink:#1E7A3C;
  --hc-green-tint:#E7F7EC;
  --hc-callout:#6940DD;
  --hc-arrow:#D65499;
}


/* the site's nav bar is fixed (style.css .wp-block-template-part), so every help page starts under it */
.hc-body main{padding-top:var(--nav-h)}

/* ---------- hero with search ---------- */
.hc-hero{position:relative;background:var(--surface);padding:clamp(48px,7vw,84px) 0 clamp(40px,5vw,60px)}
.hc-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 50% at 30% 100%,rgba(105,64,221,.14),transparent 70%),radial-gradient(50% 45% at 80% 90%,rgba(214,84,153,.12),transparent 70%)}
.hc-hero .in{position:relative;z-index:2;max-width:1000px;margin:0 auto;padding:0 var(--pad);text-align:center}
.hc-hero h1{font-size:clamp(32px,5vw,54px);font-weight:800;letter-spacing:-.03em;line-height:1.06;margin-top:14px}
.hc-hero .hc-sub{font-size:clamp(15.5px,1.8vw,18.5px);color:var(--grey);font-weight:500;margin:14px auto 0;max-width:640px}
.hc-hero.is-short{padding:34px 0 30px}
.hc-hero.is-short .in{text-align:left;max-width:var(--wrap)}

.hc-search{position:relative;max-width:640px;margin:30px auto 0}
.hc-search .box{display:flex;align-items:center;gap:12px;height:60px;padding:0 18px 0 20px;background:#fff;border:1px solid var(--line);
  border-radius:999px;box-shadow:0 14px 40px rgba(11,11,15,.08),0 1px 0 rgba(255,255,255,.8) inset;text-align:left}
.hc-search .box:focus-within{border-color:#c9bdf0;box-shadow:0 0 0 4px rgba(105,64,221,.12),0 14px 40px rgba(11,11,15,.08)}
.hc-search svg{width:22px;height:22px;stroke:var(--violet);flex:0 0 auto}
.hc-search input{flex:1;border:0;outline:0;font:inherit;font-size:17px;font-weight:500;color:var(--ink);background:transparent;min-width:0}
.hc-search input::placeholder{color:var(--muted)}
.hc-search kbd{font:inherit;font-size:11.5px;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:7px;padding:3px 7px;background:var(--surface-2)}
.hc-search.is-compact{margin:0}
.hc-search.is-compact .box{height:44px;box-shadow:none}
.hc-search.is-compact input{font-size:14.5px}
.hc-quick{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:16px}
.hc-quick span{font-size:13px;font-weight:700;color:var(--muted);line-height:1}
.hc-quick a{white-space:nowrap;font-size:13px;font-weight:700;color:var(--ink-2);background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 13px;transition:.15s}
.hc-quick a:hover{color:var(--violet);border-color:#d9d0ee;background:var(--violet-tint)}

/* ---------- search dropdown (results while typing) ---------- */
.hc-results{position:absolute;left:0;right:0;top:calc(100% + 10px);background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:0 30px 70px rgba(11,11,15,.16);text-align:left;overflow:hidden;z-index:30}
.hc-results .grp{padding:14px 10px 6px;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hc-results a{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--r-sm);margin:0 6px}
.hc-results a:hover,.hc-results a.on{background:var(--violet-tint)}
.hc-results .ic{width:30px;height:30px;border-radius:9px;background:var(--surface);display:grid;place-items:center}
.hc-results .ic svg{width:16px;height:16px;stroke:var(--violet)}
.hc-results .t{font-size:14.5px;font-weight:700;color:var(--ink)}
.hc-results .t mark{background:none;color:var(--violet)}
.hc-results .c{font-size:12.5px;color:var(--muted);font-weight:600;margin-top:2px}
.hc-results .k{font-size:12px;font-weight:700;color:var(--muted)}
.hc-results .foot{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);font-weight:600;background:var(--surface-2)}
.hc-results .foot a{display:inline;padding:0;margin:0;color:var(--violet);background:none}

/* ---------- category grid ---------- */
.hc-sec{padding:clamp(40px,6vw,70px) 0}
.hc-sec.is-tight{padding-top:0}
.hc-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px}
.hc-sec-head h2{font-size:clamp(22px,2.8vw,30px);font-weight:800;letter-spacing:-.02em}
.hc-sec-head p{font-size:15px;color:var(--grey);font-weight:500;margin-top:6px}
.hc-sec-head a{font-size:13.5px;font-weight:700;color:var(--violet);white-space:nowrap}
.hc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hc-cat{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 24px 22px;transition:.18s;position:relative}
.hc-cat:hover{transform:translateY(-2px);border-color:#d9d0ee;box-shadow:0 18px 40px rgba(11,11,15,.08)}
.hc-cat .ic{width:46px;height:46px;border-radius:13px;background:var(--violet-tint);display:grid;place-items:center;margin-bottom:16px}
.hc-cat .ic svg{width:23px;height:23px;stroke:var(--violet);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hc-cat h3{font-size:17.5px;font-weight:800;letter-spacing:-.015em}
.hc-cat p{font-size:14px;color:var(--grey);font-weight:500;line-height:1.55;margin-top:6px}
.hc-cat .n{position:absolute;top:22px;right:22px;font-size:12px;font-weight:700;color:var(--muted)}

/* ---------- start here path ---------- */
.hc-path{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;counter-reset:step}
.hc-path a{position:relative;display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:18px 18px 16px 18px;transition:.18s}
.hc-path a:hover{border-color:#d9d0ee;box-shadow:0 14px 30px rgba(11,11,15,.07)}
.hc-path a::before{counter-increment:step;content:counter(step);display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;
  background:var(--grad);color:#fff;font-size:13px;font-weight:800;margin-bottom:12px}
.hc-path b{display:block;font-size:14.5px;font-weight:800;letter-spacing:-.01em;line-height:1.25}
.hc-path span{display:block;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:5px}
.hc-path .done::after{content:"";position:absolute;right:-13px;top:50%;width:14px;height:1px;background:var(--faint)}

/* ---------- popular list ---------- */
.hc-two{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start}
.hc-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.hc-list a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 4px;border-bottom:1px solid var(--line);transition:.15s}
.hc-list a:hover{color:var(--violet)}
.hc-list .t{display:block;font-size:15.5px;font-weight:700;letter-spacing:-.005em}
.hc-list .c{display:block;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:2px}
.hc-list svg{width:18px;height:18px;stroke:var(--faint);flex:0 0 auto}
.hc-list a:hover svg{stroke:var(--violet)}

/* ---------- side panel (what's new, status, contact) ---------- */
.hc-panel{background:var(--surface);border-radius:var(--r-lg);padding:24px}
.hc-panel h3{font-size:16px;font-weight:800;display:flex;align-items:center;gap:10px}
.hc-panel h3 .dot{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(52,199,89,.18)}
.hc-panel p{font-size:14px;color:var(--grey);font-weight:500;line-height:1.55;margin-top:8px}
.hc-panel ul{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:10px}
.hc-panel li{font-size:14px;font-weight:600;color:var(--ink-2);display:flex;gap:10px;align-items:baseline}
.hc-panel li small{color:var(--muted);font-weight:700;font-size:11.5px;white-space:nowrap}
.hc-panel+.hc-panel{margin-top:16px}
.hc-panel .ver{display:inline-block;font-size:11.5px;font-weight:800;color:var(--violet);background:var(--violet-tint);border-radius:999px;padding:3px 9px}

/* ---------- contact band ---------- */
.hc-contact{background:var(--ink);color:#fff;border-radius:var(--r-xl);padding:clamp(32px,4vw,48px);display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:28px;align-items:start}
.hc-contact h2{font-size:clamp(22px,2.8vw,30px);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.hc-contact>div>p{font-size:14.5px;color:#a5a1b3;font-weight:500;line-height:1.6;margin-top:10px;max-width:340px}
.hc-contact .opt{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-md);padding:18px}
.hc-contact .opt b{display:block;font-size:15px;font-weight:800}
.hc-contact .opt span{display:block;font-size:13px;color:#a5a1b3;font-weight:500;margin-top:5px;line-height:1.5}
.hc-contact .opt em{display:inline-block;font-style:normal;font-size:12.5px;font-weight:700;color:#fff;margin-top:12px;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:1px}

/* ---------- two and three column docs frame ---------- */
.hc-frame{display:grid;grid-template-columns:var(--hc-sidebar) minmax(0,1fr);gap:40px;padding:30px 0 80px}
.hc-frame.has-toc{grid-template-columns:var(--hc-sidebar) minmax(0,1fr) var(--hc-toc)}
/* 16 October 2026 (Jed): on topic, search, contact and guide pages the frame spans the whole window, the
   menu against the left edge and On this page against the right, so the middle column gets the room.
   The article keeps a reading width and sits in the middle of that column. The band above does the same,
   so the breadcrumbs sit over the menu and the search over the table of contents. */
.hc-body main>.wrap:has(>.hc-frame){max-width:none;padding:0 var(--pad)}
.hc-hero.is-short.hc-band .in{max-width:none}
.hc-frame.has-toc{gap:48px}
.hc-frame>.hc-article{max-width:980px;width:100%;margin:0 auto}
.hc-side{position:sticky;top:calc(var(--nav-h) + 20px);align-self:start;max-height:calc(100vh - var(--nav-h) - 40px);overflow:auto;padding-right:6px;margin-left:-12px}   /* -12px: the link text lines up with the logo */
.hc-side .cap{font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 10px 12px}
.hc-side>ul{list-style:none;display:flex;flex-direction:column;gap:2px}
.hc-side>ul>li>a{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13.5px;font-weight:700;color:var(--ink-2);padding:8px 12px;border-radius:var(--r-sm)}
.hc-side>ul>li>a:hover{background:var(--surface);color:var(--violet)}
.hc-side>ul>li.on>a{background:var(--violet-tint);color:var(--violet)}
.hc-side>ul>li>a svg{width:14px;height:14px;stroke:var(--faint);transition:transform .2s}
.hc-side>ul>li.on>a svg{transform:rotate(90deg);stroke:var(--violet)}
.hc-side ul ul{list-style:none;margin:4px 0 6px 12px;padding-left:12px;border-left:1px solid var(--line);display:none;flex-direction:column;gap:1px}
.hc-side li.on ul{display:flex}
.hc-side ul ul a{display:block;font-size:13px;font-weight:600;color:var(--grey);padding:6px 10px;border-radius:8px}
.hc-side ul ul a:hover{color:var(--violet)}
.hc-side ul ul a.on{color:var(--violet);font-weight:800}
.hc-side .grp{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:10px 10px 2px}

/* ---------- category page body ---------- */
.hc-cathead{padding-bottom:26px;border-bottom:1px solid var(--line);margin-bottom:8px}
.hc-cathead .ic{width:52px;height:52px;border-radius:15px;background:var(--violet-tint);display:grid;place-items:center;margin-bottom:16px}
.hc-cathead .ic svg{width:26px;height:26px;stroke:var(--violet);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hc-cathead h1{font-size:clamp(28px,3.6vw,40px);font-weight:800;letter-spacing:-.03em;line-height:1.1}
.hc-cathead p{font-size:16px;color:var(--grey);font-weight:500;line-height:1.6;margin-top:10px;max-width:640px}
.hc-group{padding:28px 0 8px}
.hc-group h2{font-size:19px;font-weight:800;letter-spacing:-.015em;margin-bottom:6px}
.hc-group .hc-list{border-top:0}
.hc-group .hc-list a{padding:13px 4px}
.hc-group .hc-list a:first-child{border-top:1px solid var(--line)}
.hc-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--violet);background:var(--violet-tint);border-radius:999px;padding:4px 9px}
.hc-badge.is-amber{color:var(--hc-amber);background:var(--hc-amber-tint)}
.hc-badge.is-green{color:var(--hc-green-ink);background:var(--hc-green-tint)}
.hc-badge.is-grey{color:var(--grey);background:var(--surface)}

/* ---------- article ---------- */
.hc-article{min-width:0}
.hc-crumbs{font-size:13px;font-weight:700;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.hc-crumbs a{color:var(--violet)}
.hc-crumbs svg{width:13px;height:13px;stroke:var(--faint)}
.hc-article h1{font-size:clamp(28px,3.6vw,40px);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin-top:14px}
.hc-meta{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-top:14px;font-size:13px;font-weight:600;color:var(--muted)}
.hc-meta span{display:inline-flex;align-items:center;gap:6px}
.hc-meta svg{width:14px;height:14px;stroke:var(--faint)}
.hc-article .lead{font-size:17.5px;color:var(--ink-2);font-weight:500;line-height:1.65;margin-top:18px}
.hc-article h2{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.2;margin:44px 0 0;scroll-margin-top:calc(var(--nav-h) + 20px)}
.hc-article h3{font-size:18px;font-weight:800;letter-spacing:-.01em;margin:28px 0 0;scroll-margin-top:calc(var(--nav-h) + 20px)}
.hc-article p{font-size:16px;color:var(--ink-2);line-height:1.72;font-weight:450;margin-top:14px}
.hc-article b,.hc-article strong{color:var(--ink);font-weight:800}
.hc-article ul{margin:14px 0 0 22px}
.hc-article li{font-size:16px;color:var(--ink-2);line-height:1.7;font-weight:450;margin-top:8px}
.hc-ui{display:inline-block;font-weight:800;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:0 7px;font-size:.93em;line-height:1.55;white-space:nowrap}

/* numbered steps */
.hc-steps{list-style:none;margin:18px 0 0;counter-reset:s}
.hc-steps>li{position:relative;padding:0 0 22px 50px;font-size:16px;color:var(--ink-2);line-height:1.7;font-weight:450}
.hc-steps>li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:1px;width:32px;height:32px;border-radius:50%;
  background:var(--grad);color:#fff;font-weight:800;font-size:14px;display:grid;place-items:center}
.hc-steps>li::after{content:"";position:absolute;left:15.5px;top:40px;bottom:0;width:1px;background:var(--line)}
.hc-steps>li:last-child::after{display:none}
.hc-steps>li>p{margin-top:0}
.hc-steps>li p+p{margin-top:10px}
.hc-steps>li .hc-shot{margin-top:14px}

/* the annotated screenshot */
/* the image and its marks share one grid cell, so the SVG (same aspect ratio as the image) lands
   exactly on it and never on the caption; the figure may step out of the step's indent so a full
   window stays readable; a click opens it at the page's width (help.js) */
.hc-shot{position:relative;display:grid;grid-template-columns:100%;margin:24px 0 4px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--surface)}
.hc-shot img{grid-area:1/1;width:100%;height:auto;display:block;cursor:zoom-in}
.hc-shot svg.ov{grid-area:1/1;position:relative;width:100%;height:auto;pointer-events:none;overflow:visible}
.hc-shot figcaption.hc-cap{grid-area:2/1}
.hc-steps>li .hc-shot{margin-left:-50px}
.hc-zoom{position:fixed;inset:0;z-index:200;background:rgba(11,11,15,.82);display:grid;place-items:center;padding:28px;cursor:zoom-out}
.hc-zoom .in{position:relative;margin:0;border:0;display:grid;grid-template-columns:100%;max-width:min(1600px,96vw);max-height:92vh;border-radius:var(--r-md);overflow:hidden;background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.hc-zoom img{grid-area:1/1;width:100%;height:auto;max-height:92vh;object-fit:contain;display:block}
.hc-zoom svg{grid-area:1/1;width:100%;height:auto;pointer-events:none}
.hc-shot .mark circle{fill:var(--hc-callout);stroke:#fff;stroke-width:4}
.hc-shot .mark text{fill:#fff;font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:26px;text-anchor:middle;dominant-baseline:central}
.hc-shot .box{fill:none;stroke:var(--hc-callout);stroke-width:5;rx:10;ry:10}
.hc-shot .box-halo{fill:none;stroke:#fff;stroke-width:11;rx:10;ry:10;opacity:.9}
.hc-shot .arrow{fill:none;stroke:var(--hc-arrow);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.hc-shot .arrow-halo{fill:none;stroke:#fff;stroke-width:14;stroke-linecap:round;stroke-linejoin:round;opacity:.95}
.hc-shot .dim{fill:rgba(11,11,15,.38)}
.hc-shot .label rect{fill:#fff;stroke:var(--line);stroke-width:1.5;rx:10}
.hc-shot .label text{fill:var(--ink);font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:22px}
.hc-cap{font-size:13px;color:var(--muted);font-weight:600;margin-top:10px;line-height:1.5}
.hc-cap b{color:var(--grey)}
.hc-shot.is-stub::after{content:"Stand-in image. The real capture comes from the app with the demo business.";position:absolute;left:12px;bottom:12px;
  font-size:11.5px;font-weight:700;color:#fff;background:rgba(11,11,15,.72);border-radius:999px;padding:5px 11px}

/* callouts (tip, note, warning) */
.hc-call{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;margin-top:20px;padding:16px 18px;border-radius:var(--r-md);
  background:var(--violet-tint);border:1px solid #e3dcf6}
.hc-call svg{width:22px;height:22px;stroke:var(--violet);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}
.hc-call p{margin:0;font-size:14.5px;line-height:1.62;color:var(--ink-2)}
.hc-call b{display:block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--violet);margin-bottom:3px}
.hc-call.is-note{background:var(--surface);border-color:var(--line)}
.hc-call.is-note svg,.hc-call.is-note b{stroke:var(--grey);color:var(--grey)}
.hc-call.is-warn{background:var(--hc-amber-tint);border-color:#f4dfb6}
.hc-call.is-warn svg,.hc-call.is-warn b{stroke:var(--hc-amber);color:var(--hc-amber)}

/* platform tabs */
.hc-tabs{margin-top:20px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.hc-tabs .bar{display:flex;gap:4px;padding:6px;background:var(--surface);border-bottom:1px solid var(--line)}
.hc-tabs .bar button{font:inherit;font-size:13.5px;font-weight:700;color:var(--grey);background:none;border:0;border-radius:9px;padding:8px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.hc-tabs .bar button svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hc-tabs .bar button.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(11,11,15,.08)}
.hc-tabs .pane{padding:4px 20px 20px}
.hc-tabs .pane .hc-steps{margin-top:14px}
.hc-tabs .pane .hc-steps>li:last-child{padding-bottom:0}

/* before you start */
.hc-pre{margin-top:22px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r-md)}
.hc-pre b{display:block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.hc-pre ul{margin:6px 0 0 18px}
.hc-pre li{font-size:15px;margin-top:4px}

/* toc */
.hc-toc{position:sticky;top:calc(var(--nav-h) + 20px);align-self:start;justify-self:end;width:100%;font-size:13px}
.hc-toc .cap{font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.hc-toc ul{list-style:none;border-left:1px solid var(--line);display:flex;flex-direction:column}
.hc-toc a{display:block;padding:6px 0 6px 14px;color:var(--grey);font-weight:600;margin-left:-1px;border-left:1px solid transparent;line-height:1.35}
.hc-toc a.on{color:var(--violet);border-left-color:var(--violet);font-weight:800}
.hc-toc a:hover{color:var(--violet)}
.hc-toc .sub a{padding-left:26px;font-size:12.5px}
.hc-toc .share{margin-top:22px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.hc-toc .share a{padding:0;border:0;display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-2);font-weight:700}
.hc-toc .share svg{width:14px;height:14px;stroke:var(--grey)}

/* in-article "on this page" for phones */
.hc-toc-inline{display:none}

/* was this helpful */
.hc-helpful{margin-top:48px;padding:22px 24px;background:var(--surface);border-radius:var(--r-lg);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hc-helpful b{font-size:15.5px;font-weight:800}
.hc-helpful span{display:block;font-size:13px;color:var(--muted);font-weight:600;margin-top:3px}
.hc-helpful .btns{display:flex;gap:8px}
.hc-helpful button{font:inherit;font-size:14px;font-weight:700;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 16px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.hc-helpful button:hover{border-color:#d9d0ee;color:var(--violet)}
.hc-helpful button svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* related + still stuck */
.hc-related{margin-top:40px}
.hc-related h2{font-size:19px;margin:0 0 12px}
.hc-related .cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hc-related a{display:block;border:1px solid var(--line);border-radius:var(--r-md);padding:16px 18px;transition:.15s}
.hc-related a:hover{border-color:#d9d0ee;box-shadow:0 12px 26px rgba(11,11,15,.06)}
.hc-related a b{display:block;font-size:14.5px;font-weight:800;letter-spacing:-.005em;line-height:1.3}
.hc-related a span{display:block;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:5px}
.hc-stuck{margin-top:28px;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.hc-stuck b{font-size:15.5px;font-weight:800}
.hc-stuck span{display:block;font-size:13.5px;color:var(--grey);font-weight:500;margin-top:3px}
.hc-stuck .glass-pill.md{height:40px;padding:0 20px;font-size:14px}
.hc-prevnext{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:40px}
.hc-prevnext a{border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px}
.hc-prevnext a small{display:block;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hc-prevnext a b{display:block;font-size:14px;font-weight:800;margin-top:4px}
.hc-prevnext a.next{text-align:right}


/* ---------- figures in content: the placeholder before a capture exists ---------- */
.hc-shot figcaption.hc-cap{padding:10px 14px 11px;margin:0;background:#fff;border-top:1px solid var(--line)}
.hc-shot .hc-ph{margin:0;padding:38px 24px;text-align:center;font-size:13.5px;font-weight:600;color:var(--grey);line-height:1.55;
  background:repeating-linear-gradient(135deg,var(--surface) 0 14px,#f1eef8 14px 28px)}
.hc-shot .hc-ph::before{content:"Screenshot coming";display:block;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.hc-shot.is-todo::after{display:none}
.hc-steps>li .hc-shot{margin-bottom:4px}
.hc-steps>li .hc-call{margin-top:14px}
.hc-article h2:first-child{margin-top:0}
.hc-article .lead+.hc-pre,.hc-article .lead+h2{margin-top:26px}
.hc-article a:not(.glass-pill){color:var(--violet);font-weight:700}
.hc-article ol:not(.hc-steps){margin:14px 0 0 22px}
.hc-article ol:not(.hc-steps) li{margin-top:8px}
.hc-tabs .pane[hidden]{display:none}

/* ---------- the search band on topic and guide pages ---------- */
.hc-band .in{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.hc-band .hc-search{width:min(420px,100%)}

/* ---------- the home's start-here path, topic grid and panels come from the layout ---------- */
.hc-empty-topic{margin-top:26px;padding:26px 28px;border:1px dashed #d9d0ee;border-radius:var(--r-lg);background:var(--surface-2)}
.hc-empty-topic b{display:block;font-size:16px;font-weight:800}
.hc-empty-topic p{font-size:14.5px;color:var(--grey);font-weight:500;line-height:1.6;margin-top:6px}

/* ---------- the helpful vote's second step ---------- */
.hc-helpful .thanks{font-size:14.5px;font-weight:700;color:var(--hc-green-ink)}
.hc-helpful form{display:flex;gap:8px;flex-wrap:wrap;align-items:center;width:100%}
.hc-helpful textarea{flex:1 1 260px;min-height:44px;font:inherit;font-size:14px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);resize:vertical}
.hc-helpful small{display:block;width:100%;font-size:12px;color:var(--muted);font-weight:600}

/* ---------- the contact form (templates/partials/form-contact.php) ---------- */
.hc-article .contact-form{margin-top:26px;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 28px}
.hc-article .contact-form h2{display:none}
.hc-article .contact-form .success{font-weight:700;color:var(--hc-green-ink)}
.hc-article .contact-form .errors{margin:0 0 14px 18px;color:var(--hc-red);font-weight:600}
.hc-article .form-group{margin-top:14px}
.hc-article .form-group label{display:block;font-size:13px;font-weight:800;color:var(--ink-2);margin-bottom:6px}
.hc-article .form-group input,.hc-article .form-group textarea{width:100%;font:inherit;font-size:15px;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff}
.hc-article .form-group input:focus,.hc-article .form-group textarea:focus{outline:0;border-color:#c9bdf0;box-shadow:0 0 0 4px rgba(105,64,221,.12)}
.hc-article .contact-form .btn{margin-top:18px;font:inherit;font-size:14.5px;font-weight:800;color:#fff;background:var(--grad);border:0;border-radius:999px;padding:12px 24px;cursor:pointer}

/* ---------- the search page (/help/search/) ---------- */
.hc-searchpage .hc-results{position:static;margin-top:18px;box-shadow:none}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .hc-frame.has-toc{grid-template-columns:var(--hc-sidebar) minmax(0,1fr)}
  .hc-toc{display:none}
  .hc-toc-inline{display:block;margin-top:22px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-md)}
  .hc-toc-inline b{display:block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
  .hc-toc-inline a{display:block;font-size:14px;font-weight:700;color:var(--violet);padding:4px 0}
}
@media(max-width:900px){
  .hc-grid{grid-template-columns:1fr 1fr}
  .hc-path{grid-template-columns:repeat(2,1fr)}
  .hc-path .done::after{display:none}
  .hc-two{grid-template-columns:1fr}
  .hc-contact{grid-template-columns:1fr 1fr}
  .hc-frame,.hc-frame.has-toc{grid-template-columns:1fr;gap:24px;padding-top:18px}
  .hc-side{margin-left:0;position:static;max-height:none;overflow:visible;border:1px solid var(--line);border-radius:var(--r-md);padding:12px}
  .hc-side>ul>li:not(.on){display:none}
  .hc-side .cap{display:none}
}
@media(max-width:600px){
  .hc-grid{grid-template-columns:1fr}
  .hc-sec-head{flex-direction:column;align-items:flex-start;gap:8px}
  .hc-path{grid-template-columns:1fr}
  .hc-contact{grid-template-columns:1fr;border-radius:var(--r-lg)}
  .hc-search .box{height:52px;padding:0 14px 0 16px}
  .hc-search input{font-size:15.5px}
  .hc-search kbd{display:none}
  .hc-related .cards{grid-template-columns:1fr}
  .hc-prevnext{grid-template-columns:1fr}
  .hc-prevnext a.next{text-align:left}
  .hc-steps>li{padding-left:42px}
  .hc-steps>li .hc-shot{margin-left:-42px}
  .hc-steps>li::before{width:28px;height:28px;font-size:13px}
  .hc-steps>li::after{left:13.5px}
  .hc-article h1{font-size:28px}
}

/* ---------- the contact page's sign-in card (Jed, 16 October 2026: sign in first, as the app) ---------- */
.hc-signin-head{margin-bottom:6px}
.hc-signin-head b{display:block;font-size:17px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.hc-signin-head span{display:block;margin-top:6px;font-size:14.5px;color:var(--grey);font-weight:500;line-height:1.55}
.hc-signin-head span b{display:inline;font-size:inherit;color:var(--ink)}
.hc-signin-err{margin-top:12px;font-size:14px;font-weight:700;color:var(--hc-red)}
.hc-signin-note{margin-top:14px;font-size:13.5px;color:var(--grey);font-weight:500;line-height:1.6}
.hc-article .hc-signin .btn{margin-top:18px;font:inherit;font-size:14.5px;font-weight:800;color:#fff;background:var(--grad);border:0;border-radius:999px;padding:12px 24px;cursor:pointer}
.hc-article .hc-signin .btn:disabled{opacity:.6;cursor:default}
.hc-linkbtn{background:none;border:0;padding:0;font:inherit;font-size:13.5px;font-weight:700;color:var(--violet);cursor:pointer}
.hc-linkbtn:disabled{color:var(--grey);font-weight:600;cursor:default}
.hc-otp{display:flex;gap:9px;margin-top:16px}
.hc-otp input{width:52px;height:60px;border-radius:14px;border:2px solid var(--line);text-align:center;font:inherit;font-size:24px;font-weight:800;color:var(--ink);background:var(--surface)}
.hc-otp input:focus{outline:0;border-color:var(--violet);background:#fff;box-shadow:0 0 0 4px var(--violet-tint)}
.hc-otp input.filled{border-color:var(--violet)}
.hc-otp.ok input{border-color:var(--hc-green-ink)}
.hc-otp.bad input{border-color:var(--hc-red);background:var(--hc-red-tint)}
.hc-otp-status{margin-top:10px;font-size:13.5px;font-weight:700;color:var(--grey);min-height:18px}
.hc-otp-status.ok{color:var(--hc-green-ink)}
.hc-otp-status.bad{color:var(--hc-red)}
.hc-account{display:grid;gap:8px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.hc-account>div{display:flex;gap:14px;align-items:baseline;font-size:14px}
.hc-account span{width:72px;flex:none;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hc-account b{font-weight:700;color:var(--ink);word-break:break-all}
.hc-contact-noscript{font-size:14px;font-weight:700;color:var(--hc-red)}
@media(max-width:600px){.hc-otp{gap:6px}.hc-otp input{width:44px;height:52px;font-size:20px}}

/* ---------- the app layout (CoraVision's Settings > Help, 24 October 2026) ----------
   The app opens /help/?app=1 in a frame and help.php marks the document html.hc-app before the
   first paint: no site nav, logo or footer, no room kept for the fixed nav bar, and the sticky
   menus and heading offsets start from the top edge. The pages themselves are the same pages. */
html.hc-app .wp-block-template-part,html.hc-app .footer{display:none}
html.hc-app .hc-body main{padding-top:0}
html.hc-app .hc-side,html.hc-app .hc-toc{top:20px}
html.hc-app .hc-side{max-height:calc(100vh - 40px)}
html.hc-app .hc-article h2,html.hc-app .hc-article h3{scroll-margin-top:20px}