/* Dorax Finance — the Help center inside the app (features/help/help-page.js) and the help videos (features/help/help-videos.js).
   v274 (the canvas "Ayuda y Novedades", version A, approved 2026-10-25): the top on the forest with the search and three questions to try; the
   videos as numbered rows; the topics' index beside the questions of the one chosen (a row of buttons on a phone); the way to write; and the
   player: a wide window on a computer, the whole screen on a phone. */

/* ---------- the top, on the forest (a .bq-hero: look-land-pages.css gives it its colours) ---------- */
.hp-hero { gap: 16px; }
.hp-hero-t { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.hp-hero h2 { margin: 0; color: #FFFFFF; font-size: 27px; line-height: 1.12; font-weight: 600; letter-spacing: -0.015em; }
.hp-lead { margin: -6px 0 0; color: var(--lk-soft, #B5C2BE); font-size: 15px; line-height: 1.5; }
.hc-search.hp-search { width: 100%; max-width: 720px; box-sizing: border-box; margin: 0; padding: 4px 6px 4px 0; border-radius: 999px; background: rgba(0, 0, 0, .28); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }
.hc-search.hp-search:focus-within { box-shadow: inset 0 0 0 2px var(--lk-lime, var(--brand)); }
.hc-search.hp-search > svg { width: 19px; height: 19px; margin: 0 10px 0 18px; color: var(--lk-soft-2, #8FA19B); }
.hc-search.hp-search input { height: 46px; min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #FFFFFF; font: 400 16px var(--font); }
.hc-search.hp-search input::placeholder { color: var(--lk-soft-2, #8FA19B); }
:root.land #view .hp-hero .hp-search input, :root.land #view .hp-hero .hp-search input:focus { min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #FFFFFF; outline: none; }      /* the light theme's fields are white: not this one, on the forest */
.hp-search .hc-clear { all: unset; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: #FFFFFF; cursor: pointer; }
.hp-search .hc-clear svg { width: 16px; height: 16px; }
.hp-search .hc-clear:focus-visible { outline: 2px solid var(--lk-lime, var(--focus)); }
.hp-try { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.hp-try-l { margin-right: 2px; color: var(--lk-soft-2, #8FA19B); font-size: 13px; }
.hp-try-q { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; background: rgba(255, 255, 255, .08); color: #E6EEE9; font-size: 13px; cursor: pointer; white-space: nowrap; }
.hp-try-q:hover { background: rgba(255, 255, 255, .14); }
.hp-try-q:focus-visible { outline: 2px solid var(--lk-lime, var(--focus)); outline-offset: 2px; }
.hp-hero .hp-fig { flex: none; }
.hp-hero .hp-fig img { width: 100%; height: auto; }

/* ---------- the page under it ---------- */
.hp-page { display: flex; flex-direction: column; gap: 36px; margin-top: 8px; }
#hp-results { display: flex; flex-direction: column; gap: 36px; }
.hp-sec { display: flex; flex-direction: column; gap: 14px; }
.hp-sec-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.hp-sec-h h2 { margin: 0; color: var(--ink-strong); font-size: 18px; font-weight: 600; }
.hp-sec-h .note { margin: 0; }

/* the videos: a row each, its poster with the play button, its step, its title and question, how long */
.hv-rows { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }      /* three across, as on the canvas (owner: "se supone que el grid es 3x2") */
@media (max-width: 1100px) { .hv-rows { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.hv-row { all: unset; box-sizing: border-box; width: 100%; display: flex; align-items: center; gap: 16px; padding: 10px 18px 10px 10px; border-radius: 22px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); cursor: pointer; transition: box-shadow var(--t1) ease-out; }
.hv-row:hover { box-shadow: inset 0 0 0 1px var(--ink-3); }
.hv-row:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.hv-thumb { position: relative; flex: none; display: block; width: 72px; height: 100px; overflow: hidden; border-radius: 14px; background: var(--surface-2); }
.hv-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.hv-play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; background: var(--lk-lime, var(--brand)); color: var(--lk-deep, #0B1F0F); }
.hv-play svg { width: 15px; height: 15px; margin-left: 2px; fill: currentColor; stroke: none; }
.hv-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.hv-step { color: var(--ink-3); font-size: 12.5px; }
.hv-t b { color: var(--ink-strong); font-size: 15px; font-weight: 600; line-height: 1.3; }
.hv-t small { color: var(--ink-2); font-size: 13px; line-height: 1.4; }
.hv-dur { flex: none; padding: 3px 10px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 12.5px; }
.hv-all { display: none; }

/* the questions by topic: the index beside the questions (a computer), or the row of buttons over them (a phone) */
.hp-qa { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 20px; }
.hp-index { flex: 1 1 260px; max-width: 320px; box-sizing: border-box; display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 10px; }
.hp-topic { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 0 14px; border-radius: 14px; color: var(--ink-2); font-size: 14.5px; cursor: pointer; }
.hp-topic svg { flex: none; width: 18px; height: 18px; color: var(--ink-3); }
/* v278: Dorax's own icons (the illustrated things, ui/art.js) for the topics, their pane and the way to write; the line icon outside the look */
.hp-ti { flex: none; display: grid; place-items: center; width: 32px; height: 32px; margin-left: -4px; }
.hp-ti > svg:not(.obj) { width: 18px; height: 18px; color: var(--ink-3); }
.hp-pane-h { gap: 14px; }
.hp-pane .hp-pane-ic { display: grid; place-items: center; flex: none; }
.hp-pane .hp-pane-ic .hp-ti { width: 44px; height: 44px; margin: 0; }
.hp-found .hp-pane-ic .hp-ti { width: 38px; height: 38px; }
.hp-write-ic:has(svg.obj) { width: 46px; height: 46px; background: none; }
.hp-topic .grow { flex: 1; min-width: 0; }
.hp-topic .hp-n { color: var(--ink-3); font-size: 12.5px; }
.hp-topic:hover { background: var(--surface-2); }
.hp-topic:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.hp-topic[aria-pressed="true"] { background: var(--select); color: var(--ink-strong); font-weight: 500; }
.hp-topic[aria-pressed="true"] svg { color: var(--brand); }
.hp-chips { display: none; }
.hp-pane { flex: 999 1 520px; min-width: 0; box-sizing: border-box; margin: 0; padding: 6px 30px 14px; }
.hp-pane-h { display: flex; align-items: center; gap: 12px; padding: 18px 0 12px; }
.hp-pane-h h3 { flex: 1; min-width: 0; margin: 0; color: var(--ink-strong); font-size: 20px; font-weight: 600; }
.hp-pane-h .note { margin: 0; }
.hp-pane-ic { display: none; }
.hp-pane-ic:has(.hp-ti) { display: grid; }
.hp-q { border-top: 1px solid var(--line); }
.hp-q summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 58px; padding: 4px 0; cursor: pointer; list-style: none; color: var(--ink-strong); font-size: 15px; font-weight: 500; line-height: 1.4; }
.hp-q summary::-webkit-details-marker { display: none; }
.hp-q summary svg { flex: none; width: 18px; height: 18px; color: var(--ink-3); transition: transform var(--t1) ease-out; }
.hp-q[open]:not(.closing) summary svg { transform: rotate(45deg); color: var(--brand); }      /* closing (v295, app/motion.js: faqToggle): the plus turns back as the answer slides away */
.hp-q summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 6px; }
.hp-a { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; max-width: 760px; padding: 0 0 20px; }
.hp-a p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.6; }
.hp-a .btn svg { width: 14px; height: 14px; }
/* what a search found: a card a topic, one under the other, its icon beside its name */
.hp-found { display: flex; flex-direction: column; gap: 14px; }
.hp-found .hp-pane-ic { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 12px; background: var(--select); color: var(--brand); }
.hp-found .hp-pane-ic:has(.hp-ti) { width: auto; height: auto; background: none; }
.hp-found .hp-pane-ic svg { width: 18px; height: 18px; }
.hp-found .hp-pane-h h3 { font-size: 17px; }
.hp-none { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 20px; margin: 0; }
.hp-none p { margin: 0; color: var(--ink-2); }

/* the way to write: one line, its button at the right */
.hp-write { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 16px 20px; padding: 22px 26px; margin: 0; text-align: left; }
.hp-write .grow { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.hp-write h2 { margin: 0; color: var(--ink-strong); font-size: 16px; font-weight: 600; }
.hp-write .note { margin: 0; }
.hp-write > .btn { flex: none; min-height: 46px; }
.hp-write-ic { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--select); color: var(--brand); }
.hp-write-ic svg { width: 20px; height: 20px; }

@media (min-width: 921px) {
  :root.land-page #view > .bq-hero.hp-hero, #view > .hp-hero { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 32px; padding-bottom: 0; }
  :root.land #view > .bq-hero.hp-hero::after { display: none; }
  .hp-hero-t { flex: 1 1 520px; gap: 16px; padding-bottom: 38px; }
  .hp-hero h2 { font-size: 34px; }
  .hp-lead { font-size: 15.5px; }
  .hc-search.hp-search input { height: 50px; }
  .hp-hero .hp-fig { width: 196px; margin-right: 24px; }
}
@media (max-width: 920px) {
  .hp-hero .hp-fig { position: absolute; top: 0; right: 12px; width: 88px; }
  .hp-hero h2, .hp-lead { padding-right: 92px; }
  .hp-try { flex-wrap: nowrap; margin: 0 -16px; padding: 0 16px; overflow-x: auto; scrollbar-width: none; }
  .hp-try::-webkit-scrollbar { display: none; }
  .hp-try-l { display: none; }
  .hp-try-q { flex: none; min-height: 44px; }
  .hp-page, #hp-results { gap: 32px; }
  .hv-rows { grid-template-columns: 1fr; gap: 10px; }
  .hv-row { gap: 14px; padding: 8px 14px 8px 8px; border-radius: 20px; }
  .hv-thumb { width: 58px; height: 80px; border-radius: 12px; }
  .hv-play { width: 30px; height: 30px; margin: -15px 0 0 -15px; }
  .hv-play svg { width: 13px; height: 13px; }
  .hv-rows:not(.all) > .hv-more { display: none; }
  .hv-all { display: flex; justify-content: center; min-height: 44px; }
  .hp-index { display: none; }
  .hp-chips { display: flex; gap: 8px; width: 100%; margin: 0 -16px; padding: 0 16px 2px; overflow-x: auto; scrollbar-width: none; }
  .hp-chips::-webkit-scrollbar { display: none; }
  .hp-chip { all: unset; box-sizing: border-box; flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); font-size: 14px; font-weight: 500; white-space: nowrap; cursor: pointer; }
  .hp-chip span { color: var(--ink-3); font-size: 12px; }
  .hp-chip[aria-pressed="true"] { background: var(--bq-pick-bg, var(--brand)); box-shadow: none; color: var(--bq-pick-ink-2, #FFFFFF); font-weight: 600; }
  .hp-chip[aria-pressed="true"] span { color: inherit; opacity: .75; }
  .hp-chip:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
  .hp-qa { gap: 12px; }
  .hp-pane { flex-basis: 100%; padding: 4px 18px 8px; border-radius: 22px; }
  .hp-pane-h { padding: 14px 0 10px; }
  .hp-pane-h h3 { font-size: 17px; }
  .hp-q summary { min-height: 56px; }
  .hp-write { flex-direction: column; align-items: stretch; padding: 20px; }
  .hp-write .grow { flex: none; }
  .hp-write > .btn { justify-content: center; min-height: 48px; }
  .hp-write-ic { display: none; }
}

/* in "Your first week": the way to watch how, under a mission */
.step-hv { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; }
.hv-link { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-size: 13px; font-weight: 500; }
.hv-link svg { width: 14px; height: 14px; fill: currentColor; }
.hv-link small { color: var(--ink-3); font-size: 12px; font-weight: 400; }
.fsteps .step-hv .hv-link { padding: 0; margin: 0; }      /* not the rows' taller links (thumb.css: .li .linkbtn): here each is its own 44 px */
@media (pointer: coarse) { .fsteps .step-hv .hv-link { min-height: 44px; padding: 0; margin: 0; } .step-hv { gap: 0 16px; margin-top: 2px; } }

/* ---------- the player, over the screen (#hv-root): a wide window on a computer ---------- */
.hv-root { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px; }
.hv-root[hidden] { display: none; }
.hv-root .scrim { position: absolute; inset: 0; z-index: 0; background: rgba(3, 9, 8, .74); }
.hv-box { position: relative; z-index: 1; box-sizing: border-box; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 20px 32px; width: min(960px, 100%); max-height: calc(100dvh - 32px); padding: 24px; border-radius: 28px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line), 0 40px 80px -30px rgba(0, 0, 0, .8); }
.hv-frame { grid-column: 1; grid-row: 1 / span 2; display: grid; place-items: center; overflow: hidden; border-radius: 20px; background: #000000; }
.hv-frame video { display: block; height: min(676px, calc(100dvh - 80px)); width: auto; aspect-ratio: 9 / 16; object-fit: contain; background: #000000; }
.hv-side { grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 20px; padding: 0 0 4px; overflow-y: auto; }
.hv-head { grid-column: 2; grid-row: 1; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-top: 8px; }
.hv-fs { display: none; }
.hv-head .grow { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.hv-steps { display: flex; gap: 4px; }
.hv-steps span { width: 22px; height: 4px; border-radius: 999px; background: var(--surface-3); }
.hv-steps span.on { background: var(--lk-lime, var(--brand)); }
.hv-stepn { margin: 0; color: var(--ink-3); font-size: 13px; }
.hv-head h2 { margin: 0; color: var(--ink-strong); font-size: 28px; line-height: 1.15; font-weight: 600; letter-spacing: -0.01em; }
.hv-q { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.45; }
.hv-q-dur { color: var(--ink-3); }
.hv-x { all: unset; box-sizing: border-box; flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-strong); cursor: pointer; }
.hv-x svg { width: 18px; height: 18px; }
.hv-x:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.hv-cc { display: flex; flex-direction: column; gap: 8px; }
.hv-cc-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.hv-cc-l { color: var(--ink-strong); font-size: 14px; font-weight: 600; }
.hv-cc-on { all: unset; box-sizing: border-box; display: grid; place-items: center; min-width: 44px; height: 36px; padding: 0 10px; border-radius: 8px; box-shadow: inset 0 0 0 1.5px var(--line-strong); color: var(--ink-2); font-size: 12.5px; font-weight: 700; cursor: pointer; }
.hv-cc-on[aria-pressed="true"] { background: var(--ink-strong); box-shadow: none; color: var(--surface); }
.hv-cc-on:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.hv-langs { flex: none; }
.hv-langs button { min-height: 36px; padding: 0 14px; font-size: 13.5px; }
.hv-ln-short { display: none; }
.hv-lang { margin: 0; }
.hv-says { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 1px solid var(--line); }
.hv-says h3 { margin: 0; color: var(--ink-strong); font-size: 14px; font-weight: 600; }
.hv-says p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.65; }
.hv-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; }
.hv-acts .btn { min-height: 48px; }
.hv-next { gap: 10px; padding-left: 8px; }
.hv-next-th { flex: none; width: 32px; height: 32px; overflow: hidden; border-radius: 50%; background: var(--surface-2); }
.hv-next-th img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* a phone: the whole screen, the video on black with its title over it, the choices in a panel at its foot */
@media (max-width: 920px) {
  .hv-root { padding: 0; place-items: stretch; }
  .hv-box { width: 100%; height: 100dvh; max-height: none; flex-direction: column; gap: 0; padding: 0; border-radius: 0; background: #000000; box-shadow: none; }
  .hv-box { display: flex; }
  /* v276: the title over the video, not on it, so the video's own buttons (on an iPhone, full screen at its top left) are never covered */
  .hv-head { order: 1; flex: none; align-items: center; gap: 10px; padding: calc(10px + env(safe-area-inset-top)) 12px 10px; background: #000000; }
  .hv-frame { order: 2; flex: 1; min-height: 0; border-radius: 0; }
  .hv-frame video { width: 100%; height: 100%; aspect-ratio: auto; }
  .hv-side { order: 3; flex: none; gap: 12px; padding: 16px 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 26px 26px 0 0; background: var(--surface); box-shadow: inset 0 1px 0 var(--line); overflow: visible; }
  .hv-head .grow { order: 2; flex: 1; gap: 2px; }
  .hv-head .hv-x { order: 1; background: rgba(255, 255, 255, .12); box-shadow: none; color: #FFFFFF; }
  .hv-fs { all: unset; box-sizing: border-box; order: 3; flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #FFFFFF; cursor: pointer; }
  .hv-fs svg { width: 19px; height: 19px; }
  .hv-fs:focus-visible { outline: 2px solid var(--lk-lime, var(--focus)); outline-offset: 2px; }
  .hv-steps { display: none; }
  .hv-head h2 { color: #FFFFFF; font-size: 15px; letter-spacing: 0; }
  .hv-stepn { order: 2; color: #C9D4CF; font-size: 12px; }
  .hv-q { display: none; }
  .hv-cc-row { justify-content: space-between; }
  .hv-cc-l { color: var(--ink-2); font-size: 13px; font-weight: 500; }
  .hv-langs { margin-left: auto; }
  .hv-langs button { min-height: 40px; padding: 0 12px; }
  .hv-ln-long { display: none; }
  .hv-ln-short { display: inline; }
  .hv-says { display: none; }
  .hv-acts { flex-direction: column; gap: 10px; }
  .hv-acts .btn { justify-content: center; min-height: 50px; }
  .hv-next-th { display: none; }      /* the owner's change on the canvas: the phone's "Next" without its poster */
}

/* ---------- v279: a screen's videos, offered in a corner (features/help/help-videos.js: hvNote) ----------
   The notices' card (.curio: css/screens/ahead.css, css/look/look-land-notices.css): on a computer at the bottom left of the page, beside the side
   menu (the curiosities keep the right); on a phone over the bar at the foot, where the curiosities come up (one at a time: a curiosity there
   hides it). One line to press: the play mark on lime, the question, how long; and its ×. */
#hv-note-root { position: fixed; left: calc(var(--rail, 248px) + 22px); bottom: 22px; z-index: 45; width: min(360px, calc(100vw - 32px)); pointer-events: none; }
:root.pm-rail-shut.pm-rail-shut #hv-note-root { left: calc(68px + 22px); }
#hv-note-root:empty { display: none; }
.hv-note { pointer-events: auto; position: relative; display: flex; align-items: center; gap: 12px; padding: 12px 52px 12px 14px; animation: curio-in 320ms var(--ease, ease-out) both; }
.hv-note .cu-open { all: unset; box-sizing: border-box; cursor: pointer; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 2px; border-radius: 16px; -webkit-tap-highlight-color: transparent; }
.hv-note .cu-open:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.hv-note .hv-note-mark { flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--lk-lime, var(--brand)); color: var(--lk-deep, #0B1F0F); box-shadow: none; }
.hv-note .hv-note-mark svg { width: 17px; height: 17px; margin-left: 3px; fill: currentColor; stroke: none; }
.hv-note .cu-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.hv-note .cu-t b { font-size: 14.5px; font-weight: 600; line-height: 1.3; letter-spacing: 0; color: var(--nt-ink); }
.hv-note .cu-t small { font-size: 12.5px; line-height: 1.25; color: var(--nt-ink-2); }
.hv-note > .x { position: absolute; top: 8px; right: 8px; margin: 0; }
#hv-note-root .hv-note { padding: 12px 52px 12px 14px; }
#hv-note-root .hv-note .cu-t b { white-space: normal; overflow-wrap: anywhere; }      /* the question on two lines when it needs them (a phone's notices keep one) */      /* the words keep clear of the × (the notices' look sets its own padding) */
@media (hover: hover) and (pointer: fine) { .hv-note .cu-open:hover .cu-t b { text-decoration: underline; text-underline-offset: 3px; } }
@media (max-width: 920px) {
  #hv-note-root { left: 10px; right: 10px; width: auto; bottom: calc(88px + var(--tab-b, 0px)); display: flex; justify-content: center; }
  #hv-note-root .hv-note { width: 100%; max-width: 420px; padding: 10px 50px 10px 12px; }
  :root:is(.pm-curio, #pm-0) #hv-note-root { display: none; }
}
@media (prefers-reduced-motion: reduce) { .hv-note { animation: none; } }