/* how-it-works.css: the How it works scene (homepage #use-cases and the
   /how-to-redact/<doc> pages). ONE copy: index.html links it, and
   dev/tools/gen_doc_pages.py links it from every document page. The markup is
   partials/how-stage.html, the driver assets/how-it-works.js. */
  /* ========= WHY COVER (§5b, #use-cases): drop in, Cover redacts, hand it to Ai =========
     A stylized scene of the Mac app's upper-left corner (sidebar + page) beside
     an Ai chat window. Six real-world questions, one per document kind. Every
     beat is drag in, drag out; Tokens view is on, so the Ai reads [NAME_1].
     Everything that moves is computed from ONE clock in the driver below
     (SCENE_KIT rule 6); hover/press/drop states come from hit-testing the
     scene cursor, never from a timer (rule 7). App geometry and colours are
     copied from tour.html, which mirrors CoverKit (constants named inline). */
  .wc {
    --wc-blue: 74,143,243;                 /* --redact-blue, tour.html:3245 */
    --wc-accent: #007AFF;                  /* Theme.accent */
    --wc-win: #161617;                     /* --window-bg */
    --wc-chrome-top: #1f2123;              /* --chrome-top */
    --wc-chrome-bot: #262629;              /* --chrome-bot */
    --wc-side: #1b1c1f;                    /* --sidebar-bg */
    --wc-hair: rgba(255,255,255,0.10);     /* --hair */
    --wc-ink: #ededf0;                     /* --ink */
    --wc-ink2: #9a9aa1;                    /* --ink-2 */
    --wc-ink3: #6d6d74;                    /* --ink-3 */
    --wc-ctl: #c8c8cf;                     /* --ctl */
    --wc-chat-bg: #FFFFFF; --wc-chat-ink: #1A1C1E; --wc-chat-ink2: #6b6f76;
    --wc-chat-hair: rgba(0,0,0,0.09); --wc-chat-well: #F4F4F5; --wc-me: #EDEEF0;
    /* a full-width band on the page's muted surface, like #editing (the race)
       and #pricing, instead of a rounded box */
    background: var(--bg-surface-muted); padding: 5.5rem 1.5rem 5.5rem;   /* the band rule: 88 above, 88 below the windows */
  }
  [data-theme="dark"] .wc {
    --wc-chat-bg: #212124; --wc-chat-ink: #ECECEF; --wc-chat-ink2: #9a9aa1;
    --wc-chat-hair: rgba(255,255,255,0.10); --wc-chat-well: #2C2C30; --wc-me: #333338;
  }

  /* ---- the heading: eyebrow, headline, one line, like #editing and #pricing ---- */
  .wc-head { max-width: 760px; margin: 0 auto 1.75rem; text-align: center; }
  .wc-head h2 { margin: 0 auto .75rem; }
  .wc-head .lede { color: var(--text-secondary); font-size: 1.125rem; line-height: 1.55; max-width: 56ch; margin: 0 auto; }

  /* ---- the closing ask under the stage: headline, then button + platform ---- */
  .wc-more { position: relative; z-index: 5; text-align: center; margin: 1.5rem auto 0; padding: 0 16px; max-width: 640px; color: var(--text-muted); font-size: .875rem; line-height: 1.7; }
  .wc-more a { color: var(--text-secondary); text-decoration: none; white-space: nowrap; }
  .wc-more a:hover { color: var(--color-primary-text); }
  .wc-cta { position: relative; z-index: 5; text-align: center; margin: 2.5rem auto 0; max-width: 640px; }
  .wc-cta-head { font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; color: var(--text-primary); margin: 0 0 1.1rem; }
  .wc-cta-row { display: flex; justify-content: center; align-items: center; gap: 1rem; flex-wrap: wrap; }
  .wc-cta-row .btn { white-space: nowrap; }
  .wc-cta-plat { color: var(--text-muted); font-size: .875rem; }

  /* ---- the six questions: one chip per document kind ---- */
  .wc-cats { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; padding: 0 16px; position: relative; z-index: 5; }
  .wc-cat {
    position: relative; display: inline-flex; align-items: center; gap: 8px;
    padding: 7px 12px 7px 9px; border-radius: 999px; border: 1px solid rgba(0,0,0,.07);
    background: var(--bg-surface); color: var(--text-secondary); cursor: pointer;
    font: 500 13px/1 var(--font-body); overflow: hidden;
    transition: color .2s, border-color .2s, box-shadow .2s;
  }
  .wc-cat svg { width: 16px; height: 16px; flex: none; }
  [data-theme="dark"] .wc-cat { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.10); }
  .wc-cat.on { background: var(--bg-surface); }
  .wc-cat:hover { color: var(--text-primary); }
  .wc-cat.on { color: var(--text-primary); border-color: color-mix(in srgb, var(--acc) 40%, transparent);
    box-shadow: 0 4px 14px -6px color-mix(in srgb, var(--acc) 60%, transparent); }
  .wc-cat.on svg { color: var(--acc); }
  .wc-cat .wc-prog { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: var(--acc);
    transform-origin: 0 50%; transform: scaleX(0); opacity: 0; }
  .wc-cat.on .wc-prog { opacity: .9; }
  .wc-cat[data-doc="tax"]      { --acc: #7a2228; }
  .wc-cat[data-doc="bank"]     { --acc: #1d5fbf; }
  .wc-cat[data-doc="medical"]  { --acc: #147c6c; }
  .wc-cat[data-doc="1099"]     { --acc: #555; }
  .wc-cat[data-doc="lease"]    { --acc: #785220; }
  .wc-cat[data-doc="mortgage"] { --acc: #283c6e; }
  [data-theme="dark"] .wc-cat { --acc: #8fb6ff; }
  /* narrow screens: a wrapping row breaks the six chips into ragged rows of
     uneven pills (5 rows on a phone with larger text); an even grid instead */
  @media (max-width: 760px) {
    .wc-cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; max-width: 560px; margin: 0 auto; }
    .wc-cat { justify-content: center; min-width: 0; white-space: nowrap; }
  }
  .wc-pick { display: none; }
  @media (max-width: 520px) {
    .wc-cats { display: none; }
    .wc-pick {
      position: relative; z-index: 5; display: flex; align-items: center; justify-content: center; gap: 8px;
      width: max-content; min-width: 200px; margin: 0 auto 14px; padding: 9px 14px 9px 12px; border-radius: 999px;
      background: var(--bg-surface); color: var(--text-primary); font: 500 14px/1 var(--font-body); overflow: hidden;
      border: 1px solid color-mix(in srgb, var(--acc, #7a2228) 40%, transparent);
      box-shadow: 0 4px 14px -6px color-mix(in srgb, var(--acc, #7a2228) 60%, transparent);
      transition: border-color .3s, box-shadow .3s;
    }
    .wc-pick-ic { display: flex; color: var(--acc, #7a2228); transition: color .3s; }
    .wc-pick-ic svg { width: 16px; height: 16px; }
    .wc-pick-tx { flex: 1; text-align: center; }
    .wc-pick-caret { width: 12px; height: 12px; color: var(--text-secondary); flex: none; }
    .wc-pick .wc-prog { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: var(--acc, #7a2228);
      transform-origin: 0 50%; transform: scaleX(0); opacity: .9; }
    /* the real control: invisible, covering the pill, so a tap opens the native picker */
    .wc-pick select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer;
      font-size: 16px; /* >=16px or iOS zooms the page on focus */ -webkit-appearance: none; appearance: none; border: 0; }
    [data-theme="dark"] .wc-pick { background: rgba(255,255,255,.06); }
  }

  /* ---- the stage: fixed design units, scaled to fit (driver sets --k) ---- */
  .wc-frame { position: relative; max-width: 1120px; margin: 0 auto; container-type: inline-size; }
  /* The driver sets the canvas height (fit(): EDGE x k). The same ratio is
     reserved here so the page does not shift when the deferred script runs:
     1240x384 design units, or 640x740 once the canvas is under 720px wide. */
  .wc-canvas { position: relative; aspect-ratio: 1240 / 384; }
  @container (max-width: 719.98px) { .wc-canvas { aspect-ratio: 640 / 740; } }
  .wc-stage {
    position: absolute; left: 0; top: 0; width: 1240px; height: 450px; transform-origin: 0 0;
    /* visible, with room below the cards: a clipped stage cut both windows' drop shadows in a hard line */
    transform: scale(var(--k, 1)); overflow: visible; isolation: isolate;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
    -webkit-font-smoothing: antialiased; user-select: none; -webkit-user-select: none; cursor: default;
    /* decorative (aria-hidden, no controls inside), and it overhangs the canvas by
       66 design units: without this it sat invisibly on top of the "See Cover for"
       picker below it on desktop, so clicks never reached the select */
    pointer-events: none;
  }
  .wc-stage.narrow { width: 640px; height: 790px; }
  /* Unscaled until the deferred driver has measured the canvas (fit() sets --k):
     shown at design size first, the windows would jump into place (a layout shift). */
  .wc-stage:not([style*="--k"]) { visibility: hidden; }
  .wc-stage * { box-sizing: border-box; }

  /* ---- the desktop file (Finder icon + label) ---- */
  .wc-file { position: absolute; left: 24px; top: 148px; width: 96px; display: flex; flex-direction: column; align-items: center; gap: 6px; z-index: 3; }
  .wc-stage.narrow .wc-file { left: 8px; top: 110px; }
  .wc-fileic { position: relative; width: 64px; height: 76px; border-radius: 6px; display: grid; place-items: center; }
  .wc-file.sel .wc-fileic { background: rgba(0,0,0,.10); }
  [data-theme="dark"] .wc-file.sel .wc-fileic { background: rgba(255,255,255,.14); }
  /* a Finder-style PDF document icon: hairline page, dog-eared corner, text lines, the PDF label */
  .wc-docsvg { display: block; width: 46px; height: 58px; overflow: visible;
    filter: drop-shadow(0 .5px .5px rgba(0,0,0,.14)) drop-shadow(0 3px 6px rgba(0,0,0,.10)); }
  .wc-filelbl { max-width: 96px; text-align: center; font: 500 11.5px/1.25 -apple-system, sans-serif; color: #2a2c30;
    padding: 1px 5px; border-radius: 4px; }
  [data-theme="dark"] .wc-filelbl { color: #eee; }
  .wc-file.sel .wc-filelbl { background: #0A64D6; color: #fff; }

  /* ---- windows ---- */
  .wc-win { position: absolute; border-radius: 12px; overflow: hidden; }
  /* Two equal cards, mirrored about the stage's centre: a crop of Cover's
     upper-left corner (the email board's stripped-down corner, scene 2.5) and
     the Ai chat. The Cover window runs on past the crop, cut by the card. */
  .wc-corner, .wc-chat { position: absolute; top: 24px; width: 460px; height: 360px; border-radius: 12px; overflow: hidden; }
  .wc-corner { left: 136px; z-index: 2; background: var(--wc-win);
    box-shadow: 0 0 0 1px rgba(0,0,0,.55), 0 26px 50px -14px rgba(40,26,14,.40), 0 6px 14px rgba(40,26,14,.14); }
  .wc-stage.narrow .wc-corner, .wc-stage.narrow .wc-chat { left: 112px; width: 510px; height: 350px; }
  .wc-stage.narrow .wc-corner { top: 16px; }
  .wc-stage.narrow .wc-chat { top: 390px; }
  .wc-cover { left: 0; top: 0; width: 100%; height: 100%; background: var(--wc-win); border-radius: 0; }
  .wc-chat { left: 644px; background: var(--wc-chat-bg); z-index: 1;
    box-shadow: 0 0 0 1px rgba(0,0,0,.10), 0 26px 50px -14px rgba(40,26,14,.30), 0 6px 14px rgba(40,26,14,.10);
    display: flex; flex-direction: column; color: var(--wc-chat-ink); }
  [data-theme="dark"] .wc-chat { box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 26px 50px -14px rgba(0,0,0,.6); }
  .wc-win.front { z-index: 4; }

  /* Cover: title bar (header-oneshot .titlebar: 44pt band, raised gradient, hairline) */
  .wc-tb { position: relative; height: 44px; display: flex; align-items: center; gap: 10px; padding: 0 12px 0 14px;
    background: linear-gradient(var(--wc-chrome-top), var(--wc-chrome-bot)); border-bottom: 1px solid #0a0a0b;
    box-shadow: 0 1px 0 rgba(0,0,0,.55), 0 3px 9px rgba(0,0,0,.30); z-index: 3; }
  .wc-lights { display: flex; gap: 8px; }
  .wc-lights i { width: 12px; height: 12px; border-radius: 50%; background: #4a4a4e; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.35); }
  .wc-chat .wc-lights i { background: #d9d9dc; }
  [data-theme="dark"] .wc-chat .wc-lights i { background: #4a4a4e; }
  .wc-brand { display: flex; align-items: center; gap: 6px; margin-left: 4px; font: 600 12.5px -apple-system, BlinkMacSystemFont, sans-serif; color: var(--wc-ink); }
  .wc-brand svg { width: 16px; height: 16px; }
  .wc-fchip { margin-left: 46px; display: flex; align-items: center; gap: 6px; font: 500 12.5px -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif; color: var(--wc-ink2); white-space: nowrap; }
  .wc-fchip b { color: var(--wc-ink); font-weight: 600; }
  .wc-fchip svg { width: 13px; height: 13px; color: var(--wc-ink3); }

  .wc-body { position: absolute; left: 0; right: 0; top: 44px; bottom: 0; display: flex; }
  .wc-side { position: relative; width: 184px; flex: none; background: var(--wc-side); border-right: 1px solid var(--wc-hair);
    padding: 10px 0 12px; display: flex; flex-direction: column; }
  .wc-sbh { display: flex; align-items: center; padding: 4px 12px 8px 14px; font: 600 10.5px -apple-system, sans-serif;
    letter-spacing: .08em; text-transform: uppercase; color: var(--wc-ink3); }
  .wc-cnt { margin-left: auto; font: 400 11px -apple-system, sans-serif; letter-spacing: normal; color: var(--wc-ink2);
    background: rgba(255,255,255,.06); border-radius: 4px; padding: 1px 6px; font-variant-numeric: tabular-nums; }  /* CountPill */
  .wc-rows { flex: none; display: flex; flex-direction: column; gap: 1px; }
  .wc-row { position: relative; display: flex; align-items: center; gap: 9px; height: 28px; margin: 0 8px; padding: 0 8px 0 9px;
    border-radius: 7px; font: 400 13px -apple-system, sans-serif; color: var(--wc-ink2); white-space: nowrap; }   /* .file */
  .wc-row.hov { background: rgba(255,255,255,.08); color: var(--wc-ink); }
  .wc-row.act { background: rgba(10,132,255,.16); color: #cfe6ff; }                                              /* .file.active */
  .wc-row.act.hov { background: rgba(0,122,255,.20); }
  .wc-row.ctx { box-shadow: inset 0 0 0 2px rgba(10,132,255,.9); }                                               /* right-click focus ring */
  .wc-row .gl { width: 15px; height: 15px; flex: none; position: relative; }
  .wc-row .gl svg { position: absolute; inset: 0; width: 15px; height: 15px; }
  .wc-row .gl .clip { opacity: 0; color: var(--wc-accent); }
  .wc-row.act .gl .clip { color: #cfe6ff; }
  .wc-row .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  /* status column: StatusGlyph.swift StatusDot = a 7pt dot in Theme.success; its 13pt halo
     shows only while a row is UNVIEWED, and every row here is opened, so none has it.
     The ring is the row's CircularProgressStopButton (promo 01 RING). */
  .wc-row .st { position: relative; width: 18px; height: 18px; flex: none; }
  .wc-row .st svg { position: absolute; inset: 0; width: 18px; height: 18px; overflow: visible; }
  .wc-row .st .done { position: absolute; left: 5.5px; top: 5.5px; width: 7px; height: 7px; border-radius: 50%; background: #34C759; opacity: 0; }
  /* the drop pill floats just below the last PDF, not at the window's foot */
  .wc-add { margin: 6px 8px 0; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; gap: 6px;
    font: 400 12px -apple-system, sans-serif; color: var(--wc-ink3); position: relative; }
  .wc-add::before { content: ""; position: absolute; inset: 0; border-radius: 8px; border: 1px dashed rgba(255,255,255,.18); }
  .wc-add.lit { color: #cfe6ff; background: rgba(10,132,255,.14); }
  .wc-add.lit::before { border-color: rgba(10,132,255,.9); border-style: solid; }

  .wc-main { position: relative; flex: 1; min-width: 0; overflow: hidden; }

  /* the six document pages' styles (the DOCS block in assets/how-it-works.js) */
  /* the page: 8.5x11 paper; it runs on past the card's edge, like the window.
     A soft shadow only: a hard drop shadow read heavy against the dark pane. */
  .wc-page { position: absolute; left: 16px; top: 18px; width: 280px; height: 362px; background: #fff; border-radius: 2px;
    box-shadow: 0 0 0 .5px rgba(0,0,0,.35), 0 4px 14px rgba(0,0,0,.16); color: #1c1d20; padding: 20px 18px 18px;
    font: 400 10.5px/1.35 "Helvetica Neue", Helvetica, Arial, sans-serif; overflow: hidden; }
  .wc-page .org { font-weight: 700; font-size: 10px; letter-spacing: .02em; color: #333; }
  .wc-page .ttl { font-weight: 700; font-size: 14px; margin: 2px 0 12px; letter-spacing: -.01em; }
  .wc-page .lbl { font-size: 8px; letter-spacing: .08em; text-transform: uppercase; color: #8a8d93; margin-top: 7px; }
  .wc-page .val { font-size: 11px; color: #1c1d20; }
  .wc-page .hr { height: 1px; background: #e6e6e8; margin: 12px 0 10px; }
  .wc-page .tbl { width: 100%; border-collapse: collapse; font-size: 10px; }
  .wc-page .tbl td { padding: 3px 0; border-bottom: 1px solid #f0f0f2; }
  .wc-page .tbl td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
  .wc-page .tbl tr.tot td { font-weight: 700; border-bottom: 0; padding-top: 5px; }
  .wc-page .bars { display: flex; align-items: flex-end; gap: 6px; height: 46px; margin: 4px 0 2px; }
  .wc-page .bars i { flex: 1; background: var(--pacc, #1d5fbf); border-radius: 1.5px; opacity: .7; }
  .wc-page .foot { position: absolute; left: 22px; right: 22px; bottom: 14px; display: flex; justify-content: space-between; font-size: 8px; color: #9a9ca2; }
  /* ---- the six documents: each looks like its kind, and each hides different details ---- */
  .wc-page:has(.pg) { padding: 0; }
  /* the Cover card shows ~260 of the page's 280pt, so every design keeps its
     content 30pt clear of the right edge; colour bands still run to the edge */
  .pg { position: absolute; inset: 0; font: 400 9.5px/1.35 "Helvetica Neue", Helvetica, Arial, sans-serif; color: #1c1d20; }
  .pg .k { display: block; font-size: 6.8px; letter-spacing: .07em; text-transform: uppercase; color: #7a7f87; margin-bottom: 1px; }
  .pg .v { font-size: 10.5px; }
  .pg .rw { display: flex; justify-content: space-between; padding: 2.6px 0; border-bottom: 1px solid #eeeef1; font-size: 9px; }
  .pg .rw b { font-variant-numeric: tabular-nums; }
  /* IRS letter: seal, notice block, window-envelope address, SSN box, the refund change */
  .pg-tax { padding: 15px 30px 15px 16px; }
  .tx-top { display: flex; align-items: center; gap: 7px; padding-bottom: 7px; border-bottom: 1.5px solid #1c1d20; }
  /* a light seal: two thin rings and a star. The first cut (dense dark spokes)
     read as a black dot at page size. */
  .tx-seal { width: 24px; height: 24px; flex: none; display: block; }
  .tx-ag { font-size: 7.8px; line-height: 1.25; color: #333; } .tx-ag b { font-size: 8.4px; color: #1c1d20; }
  .tx-no { margin-left: auto; text-align: right; font-size: 7.5px; color: #666; } .tx-no b { display: block; font-size: 13px; letter-spacing: .03em; color: #1c1d20; }
  .tx-mid { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-top: 9px; }
  .tx-addr .v { display: block; line-height: 1.5; }
  .tx-id { border: 1px solid #cfd3da; border-radius: 3px; padding: 4px 6px; }
  .tx-h { margin-top: 11px; font-weight: 700; font-size: 11px; line-height: 1.25; }
  .tx-cmp { display: flex; align-items: center; gap: 6px; margin-top: 7px; }
  .tx-cmp div { flex: 1; border-radius: 4px; padding: 5px 7px; background: #f3f3f5; }
  .tx-cmp div.now { background: #fbeeee; box-shadow: inset 0 0 0 1.2px #7a2228; } .tx-cmp div.now b { color: #7a2228; }
  .tx-cmp b { display: block; font-size: 13px; } .tx-cmp i { font-style: normal; color: #999; font-size: 11px; }
  .pg-tax .rws { margin-top: 8px; }
  /* bank statement: a brand band, holder, balances, where the money went */
  .bk-hd { display: flex; align-items: center; gap: 7px; padding: 10px 30px 10px 16px; background: #1d5fbf; color: #fff; font-weight: 700; font-size: 11px; }
  .bk-logo { width: 15px; height: 15px; border-radius: 4px; background: linear-gradient(135deg, #bfe0ff, #fff); box-shadow: inset -4px -4px 0 rgba(29,95,191,.35); }
  .bk-hd span { margin-left: auto; font-weight: 400; font-size: 8px; opacity: .85; }
  .bk-b { padding: 9px 30px 9px 16px; }
  .bk-b .v { display: block; line-height: 1.5; }
  .bk-ac { display: flex; align-items: center; gap: 6px; margin-top: 5px; font-size: 7.8px; color: #6b7280; }
  .bk-tl { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 9px; }
  .bk-tl div { background: #eef3fb; border-radius: 4px; padding: 5px 7px; } .bk-tl b { display: block; font-size: 12.5px; color: #17407e; }
  .bk-cats { margin-top: 9px; display: grid; grid-template-columns: 52px 1fr 36px; gap: 4px 6px; align-items: center; font-size: 8.5px; }
  .bk-cats i { height: 7px; border-radius: 2px; background: #1d5fbf; }
  .bk-cats b { text-align: right; font-variant-numeric: tabular-nums; }
  /* hospital bill: teal rule and cross, a patient card, charges, amount due */
  .pg-med { border-top: 4px solid #147c6c; }
  .md-hd { display: flex; align-items: center; gap: 7px; padding: 11px 16px 4px; font-weight: 700; font-size: 10.5px; color: #0f5c50; }
  .md-x { position: relative; width: 14px; height: 14px; flex: none; }
  .md-x::before, .md-x::after { content: ""; position: absolute; background: #147c6c; border-radius: 1.5px; }
  .md-x::before { left: 5px; top: 0; width: 4px; height: 14px; } .md-x::after { left: 0; top: 5px; width: 14px; height: 4px; }
  .md-t { padding: 0 16px; font-size: 12.5px; font-weight: 700; } .md-t span { font-weight: 400; font-size: 8px; color: #7a7f87; margin-left: 5px; }
  .md-card { margin: 7px 30px 0 16px; background: #eaf5f2; border-radius: 5px; padding: 6px 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px; }
  .md-card .wide { grid-column: 1 / -1; }
  .md-rows { margin: 7px 30px 0 16px; }
  .md-due { margin: 8px 30px 0 16px; display: flex; justify-content: space-between; align-items: center; background: #147c6c; color: #fff; border-radius: 5px; padding: 6px 9px; font-size: 9px; }
  .md-due b { font-size: 14px; }
  /* 1099: a tax form's box grid, then the year in one line */
  .iv-hd { display: flex; justify-content: space-between; align-items: flex-end; padding: 14px 30px 6px 16px; }
  .iv-hd b { display: block; font-size: 13px; } .iv-hd small { font-size: 7.5px; color: #666; }
  .iv-yr { font: 800 20px/1 "Helvetica Neue", Helvetica, sans-serif; color: transparent; -webkit-text-stroke: 1px #1c1d20; letter-spacing: .02em; }
  .iv-g { display: grid; grid-template-columns: 1.25fr 1fr; margin: 0 30px 0 16px; border-top: 1.5px solid #1c1d20; border-left: 1px solid #a3a8ae; }
  .iv-g > div { border-right: 1px solid #a3a8ae; border-bottom: 1px solid #a3a8ae; padding: 3px 5px 4px; min-height: 27px; }
  .iv-g .n { font-weight: 700; font-size: 7px; margin-right: 3px; color: #1c1d20; }
  .iv-g .v { font-size: 10px; }
  .iv-ch { margin: 9px 30px 0 16px; display: flex; align-items: center; gap: 8px; }
  .iv-ch svg { width: 150px; height: 34px; flex: none; }
  .iv-ch b { display: block; font-size: 13px; color: #147c3c; } .iv-ch span { font-size: 7.5px; color: #7a7f87; }
  /* lease: a legal document, the details inside the prose */
  .pg-lse { padding: 16px 32px 16px 19px; font-family: Georgia, "Times New Roman", serif; font-size: 9px; line-height: 1.6; color: #222; }
  .ls-t { text-align: center; font-weight: 700; letter-spacing: .16em; font-size: 10px; }
  .ls-s { text-align: center; font-style: italic; font-size: 7.8px; color: #785220; margin: 1px 0 6px; padding-bottom: 6px; border-bottom: 1px solid #d9c9b0; }
  .pg-lse p { margin: 0 0 5px; }
  .pg-lse .pii { font-size: 9.5px; }
  .pg-lse .cl { font-weight: 700; color: #785220; letter-spacing: .04em; }
  .ls-sig { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 10px; font-size: 7px; color: #777; }
  .ls-sig div { border-top: 1px solid #555; padding-top: 2px; }
  .ls-sig div:first-child { font: italic 13px/1 "Snell Roundhand", "Segoe Script", cursive; color: #243; border: 0; padding: 0; }
  .ls-sig div:first-child span { display: block; border-top: 1px solid #555; margin-top: 3px; padding-top: 2px; font: 7px Georgia, serif; color: #777; }
  /* mortgage: a navy band with the house, amount due, where this month goes */
  .mg-hd { display: flex; align-items: center; gap: 7px; padding: 10px 30px 10px 16px; background: #283c6e; color: #fff; font-weight: 700; font-size: 11px; }
  .mg-hd svg { width: 15px; height: 15px; } .mg-hd span { margin-left: auto; font-weight: 400; font-size: 8px; opacity: .85; }
  .mg-b { padding: 9px 30px 9px 16px; }
  .mg-2 { display: grid; grid-template-columns: 1.2fr 1fr; gap: 6px 10px; }
  .mg-2 .wide { grid-column: 1 / -1; }
  .mg-due { margin-top: 9px; display: flex; justify-content: space-between; align-items: center; border: 1.4px solid #283c6e; border-radius: 5px; padding: 6px 9px; font-size: 8.5px; }
  .mg-due b { font-size: 14px; color: #283c6e; }
  .mg-sp { display: flex; align-items: center; gap: 10px; margin-top: 9px; }
  .mg-sp svg { width: 52px; height: 52px; flex: none; }
  .mg-lg { flex: 1; display: grid; grid-template-columns: 8px 1fr auto; gap: 3px 5px; align-items: center; font-size: 8.5px; }
  .mg-lg i { width: 8px; height: 8px; border-radius: 2px; }
  /* page_only documents (the /how-to-redact/for-<profession> pages, never the homepage) */
  /* leave request: a people-team band, the employee card, the leave */
  .hr-hd { display: flex; align-items: center; gap: 7px; padding: 10px 30px 10px 16px; background: #4b3a8c; color: #fff; font-weight: 700; font-size: 11px; }
  .hr-logo { width: 14px; height: 14px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff 0 28%, #c9bdf5 30% 100%); }
  .hr-hd span:last-child { margin-left: auto; font-weight: 400; font-size: 8px; opacity: .85; }
  .hr-b { padding: 9px 30px 9px 16px; }
  .hr-t { font-size: 12px; font-weight: 700; display: flex; align-items: baseline; justify-content: space-between; gap: 6px; }
  .hr-t span { font-weight: 600; font-size: 7.2px; color: #4b3a8c; background: #ece8fb; border-radius: 3px; padding: 2px 5px; }
  .hr-card { margin-top: 7px; background: #f3f1fb; border-radius: 5px; padding: 6px 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px; }
  .hr-card .wide { grid-column: 1 / -1; }
  .hr-rows { margin-top: 7px; }
  /* incident report: a city seal, the report number, the caller, what happened */
  .pg-gov { padding: 15px 30px 15px 16px; }
  .gv-hd { display: flex; align-items: center; gap: 7px; padding-bottom: 7px; border-bottom: 1.5px solid #3d5a40; font-size: 7.8px; line-height: 1.25; color: #333; }
  .gv-hd b { font-size: 8.6px; color: #1c1d20; }
  .gv-seal { width: 24px; height: 24px; flex: none; display: block; }
  .gv-no { margin-left: auto; text-align: right; font-size: 7.5px; color: #666; } .gv-no b { display: block; font-size: 11px; letter-spacing: .03em; color: #1c1d20; }
  .gv-t { margin-top: 9px; font-weight: 700; font-size: 12px; }
  .gv-card { margin-top: 6px; border: 1px solid #cfd8cf; border-radius: 4px; padding: 6px 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px; }
  .gv-card .wide { grid-column: 1 / -1; }
  .gv-rows { margin-top: 7px; }
  /* a detected value: the engine's pill (blue) then the redaction (black) */
  .wc-page .pii { position: relative; display: inline-block; }
  .wc-page .pii .bar { position: absolute; left: -2px; right: -2px; top: 0; bottom: -1px; border-radius: 1.5px; opacity: 0; }
  /* Tokens view (EditingOverlay+TokenLabels.swift / tokens.rs token_layout): the
     token laid on the solid bar in light grey (white .72 = 184,184,184), Helvetica,
     about .65-.7 of the text size, 2pt in from the bar's left edge. */
  .wc-page .pii .bar::after { content: attr(data-tok); position: absolute; left: 3px; top: 0; bottom: 0; display: flex; align-items: center;
    font: 400 7.5px/1 Helvetica, Arial, sans-serif; color: rgb(184,184,184); white-space: nowrap; opacity: var(--tk, 0); }
  .wc-scan { position: absolute; left: 0; right: 0; height: 60px; pointer-events: none; opacity: 0;
    background: linear-gradient(180deg, transparent, rgba(var(--wc-blue),.14) 70%, rgba(var(--wc-blue),.55) 98%, transparent); }

  /* the right-click menu (native macOS dark menu) and its submenu */
  .wc-ctx, .wc-sub { position: absolute; z-index: 28; padding: 5px; border-radius: 10px; background: rgba(40,40,44,.97);
    box-shadow: 0 0 0 .5px rgba(0,0,0,.8), inset 0 0 0 .5px rgba(255,255,255,.14), 0 12px 32px rgba(0,0,0,.45);
    font: 400 13px -apple-system, sans-serif; color: var(--wc-ink); opacity: 0; pointer-events: none; }
  .wc-ctx { width: 236px; } .wc-sub { width: 132px; }
  .wc-mi { display: flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 5px; white-space: nowrap; gap: 8px; }
  .wc-mi.hov { background: var(--wc-accent); color: #fff; }
  .wc-mi .kbd { margin-left: auto; color: var(--wc-ink2); font-size: 12px; }
  .wc-mi.hov .kbd { color: rgba(255,255,255,.8); }
  .wc-mi .chev { margin-left: auto; width: 8px; height: 8px; color: var(--wc-ink2); }
  .wc-mi.hov .chev { color: #fff; }
  .wc-mi.open:not(.hov) { background: rgba(255,255,255,.10); }
  .wc-sep { height: 1px; margin: 5px 9px; background: rgba(255,255,255,.10); }
  .wc-tile { width: 14px; height: 14px; border-radius: 3.5px; background: rgba(255,255,255,.16); flex: none; }  /* tour .aitile */


  /* Ai chat */
  .wc-ctb { height: 38px; flex: none; display: flex; align-items: center; gap: 10px; padding: 0 12px; border-bottom: 1px solid var(--wc-chat-hair);
    font: 600 12.5px -apple-system, sans-serif; color: var(--wc-chat-ink); }
  .wc-ctb .t { display: flex; align-items: center; gap: 6px; margin-left: 4px; }
  .wc-ctb .t svg { width: 13px; height: 13px; color: #C9652A; }
  .wc-msgs { position: relative; flex: 1; min-height: 0; padding: 14px 14px 8px; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; overflow: hidden; }
  .wc-hello { position: absolute; left: 0; right: 0; top: 42%; text-align: center; font: 600 17px -apple-system, sans-serif; color: var(--wc-chat-ink); letter-spacing: -.01em; }
  .wc-me { align-self: flex-end; max-width: 88%; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; opacity: 0; }
  .wc-bub { background: var(--wc-me); border-radius: 14px; padding: 8px 11px; font: 400 12.5px/1.35 -apple-system, sans-serif; }
  .wc-ai { align-self: flex-start; max-width: 92%; font: 400 12.5px/1.45 -apple-system, sans-serif; min-height: 18px; opacity: 0; }
  .wc-dots { display: inline-flex; gap: 4px; }
  .wc-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--wc-chat-ink2); opacity: .5; }
  .wc-att { display: flex; align-items: center; gap: 8px; padding: 6px 10px 6px 6px; border-radius: 10px; background: var(--wc-chat-bg);
    box-shadow: 0 0 0 1px var(--wc-chat-hair); max-width: 100%; }
  .wc-att .ic { position: relative; width: 26px; height: 32px; border-radius: 3px; background: #fff; flex: none; overflow: hidden;
    box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
  .wc-att .ic i { position: absolute; left: 4px; height: 3px; border-radius: .5px; background: #111; }
  .wc-att .ic i.g { background: #d9d9dd; height: 2px; }
  /* the sent attachment: the top of the redacted page itself, so you see what the Ai gets */
  .wc-thumb { position: relative; display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
  .wc-thumb .pv { position: relative; width: 282px; height: 146px; border-radius: 10px; overflow: hidden; background: #fff;
    box-shadow: 0 0 0 1px var(--wc-chat-hair), 0 4px 12px rgba(0,0,0,.08); }
  .wc-thumb .wc-page { left: 0; top: 0; margin: 0; transform: scale(.94); transform-origin: 0 0; box-shadow: none; }
  .wc-thumb .wc-page .pii .bar { opacity: 1; background: #0b0b0c; --tk: 1; }
  .wc-thumb .fn { font: 500 11px -apple-system, sans-serif; color: var(--wc-chat-ink2); padding-right: 2px; }
  /* beside the preview, level with the lifted redaction: room to read */
  .wc-nu { position: absolute; right: calc(100% + 12px); top: 72px; white-space: nowrap; font: 600 12.5px -apple-system, sans-serif;
    color: var(--wc-chat-ink); opacity: 0; }
  .wc-ai b { font-weight: 600; }
  /* The Ai's copy has no text under a redaction (fragcheck + the forensic
     byte-absence check refuse to save otherwise; the XMP word index drops it
     too), so every clone of the page in the chat renders the values as nothing. */
  .wc-thumb .pii, .wc-lens .pii { color: transparent; }
  .wc-thumb .wc-page .pii .bar { transform-origin: 0 50%; }
  /* what the Ai never got (promo 01 .rbar): the label, then the redaction with its token */
  .wc-rchip { position: absolute; left: 0; top: 0; z-index: 32; display: flex; align-items: center; gap: 8px; padding: 7px 11px; border-radius: 10px;
    background: #FCFBF8; white-space: nowrap; font: 500 12.5px/1.2 -apple-system, sans-serif; color: #3A3540; opacity: 0; pointer-events: none;
    /* Cover blue, and soft: a diffuse glow, no hard ring */
    box-shadow: 0 0 0 .5px rgba(10,132,255,.14), 0 6px 18px rgba(10,132,255,.18), 0 0 26px rgba(10,132,255,.12); }
  .wc-rchip i { position: relative; display: block; font-style: normal; color: transparent; background: #0b0b0c; padding: 1px 4px; border-radius: 2px; }
  .wc-rchip em { position: absolute; left: 4px; top: 0; bottom: 0; display: flex; align-items: center; font: 400 9px Helvetica, Arial, sans-serif; font-style: normal; color: rgb(184,184,184); }
  .wc-att b { display: block; font: 600 11px/1.2 -apple-system, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 170px; }
  .wc-att small { display: block; font: 400 10px/1.2 -apple-system, sans-serif; color: var(--wc-chat-ink2); }
  /* The composer is one text row. When a file lands it grows UPWARD to hold the
     attachment (--grow, set by the driver), so the text row and Send never move. */
  .wc-cmp { position: relative; margin: 0 12px 12px; padding: 8px; display: flex; flex-direction: column; --grow: 0px; }
  .wc-cmp::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; top: calc(-1 * var(--grow)); border-radius: 16px;
    background: var(--wc-chat-bg); box-shadow: 0 0 0 1px var(--wc-chat-hair), 0 2px 8px rgba(0,0,0,.05); }
  .wc-cmp.focus::before { box-shadow: 0 0 0 1px rgba(10,132,255,.55), 0 0 0 3px rgba(10,132,255,.18); }
  .wc-cmp > * { position: relative; }
  .wc-cmp > .wc-att { position: absolute; left: 8px; top: calc(8px - var(--grow)); opacity: 0; transform-origin: 0 100%; }
  .wc-inrow { display: flex; align-items: flex-end; gap: 8px; min-height: 26px; }
  .wc-txt { flex: 1; min-width: 0; font: 400 12.5px/1.35 -apple-system, sans-serif; padding: 4px 4px; position: relative; }
  .wc-txt .ph { color: var(--wc-chat-ink2); }
  .wc-txt .ln { display: inline-block; width: 1.5px; height: 1.1em; background: var(--wc-accent); vertical-align: -2px; margin-left: 1px; opacity: 0; }
  .wc-send { width: 26px; height: 26px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #d4d4d8; color: #fff; }
  [data-theme="dark"] .wc-send { background: #48484d; }
  .wc-send svg { width: 13px; height: 13px; }
  .wc-send.ready { background: #1A1C1E; }
  [data-theme="dark"] .wc-send.ready { background: #ECECEF; color: #1A1C1E; }
  .wc-send.hov { transform: scale(1.06); }
  .wc-send.down { transform: scale(.94); opacity: .8; }
  .wc-chatdrop { position: absolute; left: 0; right: 0; top: 38px; bottom: 0; display: grid; place-items: center; opacity: 0; pointer-events: none;
    background: rgba(10,132,255,.07); font: 600 13px -apple-system, sans-serif; color: #0A64D6; }
  .wc-chatdrop::before { content: ""; position: absolute; inset: 10px; border: 1.5px dashed rgba(10,132,255,.7); border-radius: 14px; }

  /* things that ride the cursor */
  .wc-ghost { position: absolute; left: 0; top: 0; z-index: 30; pointer-events: none; opacity: 0; }
  .wc-ghost .wc-docsvg { filter: drop-shadow(0 6px 12px rgba(0,0,0,.22)); }
  /* the 20pt file icon a row drag carries (MultiFileDragSource: rowIconDrag) */
  .wc-mini { position: relative; width: 22px; height: 28px; filter: drop-shadow(0 0 .6px rgba(0,0,0,.55)) drop-shadow(0 3px 5px rgba(0,0,0,.28)); }
  .wc-mini::before { content: ""; position: absolute; inset: 0; background: #fff; border-radius: 2px;
    clip-path: polygon(0 0, 70% 0, 100% 24%, 100% 100%, 0 100%); }
  .wc-mini i { position: absolute; left: 3px; bottom: 4px; width: 13px; height: 6px; border-radius: 1px; background: #E5484D; }
  .wc-keycap { position: absolute; z-index: 31; opacity: 0; pointer-events: none; display: flex; gap: 4px; }
  .wc-keycap span { min-width: 30px; height: 30px; padding: 0 8px; border-radius: 7px; display: grid; place-items: center;
    background: linear-gradient(#fdfdfd, #eeeef0); color: #1a1c1e; font: 600 15px -apple-system, sans-serif;
    box-shadow: 0 0 0 1px rgba(0,0,0,.14), 0 2px 0 rgba(0,0,0,.14), 0 8px 18px rgba(0,0,0,.18); }
  .wc-bird { position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 25; pointer-events: none; transform-origin: 0 0; opacity: 0; }
  /* the L-pin, geometry from promo.css .bird (RevealBirdGlyph.swift:49-73) */
  .wc-bird .base { position: absolute; left: -45.38px; top: 0; width: 50px; height: 14px; border-radius: 4px; background: rgba(var(--wc-blue),.26); }
  .wc-bird .stem { position: absolute; left: -.75px; top: -12px; width: 1.5px; height: 12px; background: rgb(var(--wc-blue)); }
  .wc-bird .badge { position: absolute; left: -9px; top: -30px; width: 18px; height: 18px; border-radius: 50%; background: rgb(var(--wc-blue));
    box-shadow: 0 -2px 10px rgba(var(--wc-blue),.45); }
  .wc-bird .badge::before, .wc-bird .badge::after { content: ""; position: absolute; left: 50%; top: 50%; background: #fff; border-radius: 1.5px; }
  .wc-bird .badge::before { width: 10px; height: 2px; margin: -1px 0 0 -5px; }
  .wc-bird .badge::after { width: 2px; height: 10px; margin: -5px 0 0 -1px; }

  /* the scene cursor: the email board's macOS arrow / I-beam (kit/promo.css), at 1x */
  .wc-cur { position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 40; pointer-events: none; }
  .wc-cur .a, .wc-cur .b { position: absolute; display: none; background-size: 100% 100%; background-repeat: no-repeat; }
  /* The two cursor images are shared with the §6c magic-tool tile (.mt-cur), which
     sizes them for its own scale below. */
  .wc-cur .a { width: 28px; height: 40px; left: -5px; top: -5px; }
  .wc-cur .a, .mt-cur .a { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHAAAACgCAYAAADU3uhkAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAcKADAAQAAAABAAAAoAAAAABXdy7oAAAQPUlEQVR4Ae2deYxX1RXHH9uAFaRsiiwzww4KtQkgItRGo3EtoNGm4h8qaQylKKK4IJoYl8SkidHEpNZYU7dE61bENY1LjNjGpTa4IQpGKYJKWESEWZjX7+f5O8/7e7/fDDM4G2/OSc7c++697/7e+37fOefe+5aJIhdHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBByB9kGgWyv9TLl+4lbq27tpAoFywDfRvKiqpfs6oUXwtc5GS0ngV8N9GsuHZDWWb50z6OK9dG/h+YeEsW+i5513Xs/33ntv2IYNG8Z++OGHI5YuXdrb6gqp7WdpC3/Wm7cGAoCPQloPaU9pxaJFi/p+9913y/bt27c2juMvlH5SW1v71wceeOBw1UNkhZT2KPtaP8q6tCcCWfIg55CdO3fOF3E10lQaGhrqd+zYseLkk0/uTxspbSHcSRQIHSVFlqeD6CM9VNb235S54kzd119/fdm8efN+rnY/k0JiL6mTKBDaW8z6sCJISMhT2l+cFVlfMYdx3fbt26+//fbbh6stlsh+RqK5UlKXNkYAkLEcwMeSDpXiHgdnCCvZxJ1+//33/1ixYsXIwn6QaC7VY6LAaA8xAhmQYEl9pQOlQ7OM3XzzzfGaNWuKiiFx69at10+dOnVwYd/QEp1EgdKWYq4O94nlEM+wviHS4UVMaUNl8bRp0+KvvvoqW1X35ZdfXnbssccOUhss2EkUCO0hEIiVQCCg95MOkA6VVmVZUlncvXv3eMmSJbEGMUXVssS6b7755oZbbrkldKceEwVaW4oRCNC4z8OkuM9h0tFFDGlDZYlCIpZYzp0qJj7lMVFItZOE8c/cJ7EMKxrbGIGqS4isrq4uS6Ksc4XHxPZh0AjMxr9K/fz4/REIkdOnTy/rTjdt2rTYY2Lbk5glkIk5AxgInNgcAnGnl19+eVkSZYnXZdypx8RW5jQkkNGjEVjVXALVLhnYyNrKutPdu3d7TGxl0sLuyhHIQnW1dFJzLFDt0sHN6NGjS0hUH3WaJy73mCik2kBalUAdX4wllpli1ComLvKY2PoMtjqBxMQrrriiLIlbtmy57sYbbxyh08hO9jkO09Y/yxz32OoECqu4R48eiSW+//77RV6YZTfFxCdEcDjZ97XTn3CBtQmBkIiOGTMmzpJITJSLvdZj4k9gLdi1TQmExMZi4mefffYHj4kBEweYbXMCiYlXXnllrHXSrDut1QL48quvvtpj4gGSx25tTqB+I4mJxx13XIk7ZQFca6ePZ0j0mNgCQtuFQEhEx44dG3/wwQdFlliIidcU3Cn3Iv1WVGclEBKxxKw7FYk1iokLPSa2gLlC03a1QAgkJi5btqwsiRs3brxWa6c8Y+PzxGZy2e4EQiLzRCxRDwoXuVNi4t69ex/zmNhM9tSsQwiERHTcuHHxRx99VELi5s2br5o4cSKPZ3hMFAhNSYcSqAOLZ86cWeJOZYnExEs8JjZF3Q91HU4gMfGqq66Kdccia4k1WgC/Wu9ieExsgscOJxArJCYef/zxJe5UjNbu2rXrsUsvvTSc7Ps8MSC0UxAIiej48ePjtWt5j+ZHYWAjS1zmMTFgLch2KgIhcdasWWXdqV5v+73HxIC5QrbTEYg7veaaa8qRuFcPFF/pMbGYxE5HIFYIiVjixx9//KMv/SFXq7XTRzIkdumY2CkJhESUmFiORN3ZX7qfmFh8meZ4q1MTCImNxMS969evX6AHi3mKjmU3s8Lw/cQc0/bjqXV6AnGny5cvL4mJ8qi7Pv/88/N0KrwOwB0M3q7iHQ97I0rZ/EunJ1AUpDFx3bp1RTFR7+xvfv7556erjS252Tv7XYbEg4JASOzWrVt81FFHZZ92q9HzNctVzytxvNuBJebGCrkKcyMyvejTTz+N7r///vScVNazV69eR6mAcyX+cUGG1sf2QSu5IhAWtCoT6U5FSoisMpJieVhdOICBuIOaPE4ydwT269cvOvfcczm3RGSBDbp/+D9tmNVZWmhxcCe5IbCioiLSc6TRI488Es2YMSNlRQTW6ytS7wQEpnVdJYObwfUwj7K3kw745Rb1kUzAm5OKlFiPUIiDAxd9RWrN4MGDx+v3jpRyA5gpBW8a52Ig06ktUB8Riu64445I9AnvlktNTc2Xjz766C26j7iv5XvnZ482s0CG/YKpSR04cGD87rvvttQE67/44ouVem5mjvpnBDpaigXybj8facjVVELn06S0CYG4x3vuuSeePXt2kwT27NkzeUJtfwxq9NlQX1+/U3O+/7zwwgu3TZky5QSd1S+lE6WjpHxVg69r5IpA4kC7yyGHHBLddddd0YUXXhj1798/Wr16daNuUqREr7zySqRYFvXty2JKFO3Zs2fHJZdccsNDDz3E6BL32CCtl9YVtmuV7i1sU04bNLxYtHnwS7vHwAEDBkSLFy+OLrjggkhrmNGpp54aTZo0qUkktZ4Z6WZt2qZPnz79TzvttOrevXtDihEHeeQhj7wpZSgkQyBpbuSnEGhXc7PBYJj/7LPPRrfeemsk8JP9mLfpIV4m2432o0FI9OSTT0Z1dXCi2bfkzDPPnFdVVcXouKagWNyegpKnHDKNUCMbAo1MziH3EsZAVjSyHzloCOMTMUttSvSUU06J9aZR2DTN8y7E4YcfXrJP2A/vEerbpOk+xLz77rtvhdr8WjpTOlVKzGPQMlZaJWXgwhc1iH25XMz+KRYoTHQpNzR8m2QKfzR4CDeTvG6sRvfee2905JHgWSqVlZVRdXV1aUVQont7ke4qpCVY4RlnnDFPF0zoQrE8i31YnrlUrC9rdVwwXUIas8BKnf0EfQ90dWoWyjzzzDPJW7eMMjVASW62vvHGG2GTWLd49mmOtycs1PsOcWPWq99JrJNH7bUsFu62784777xY9b+QMtpkusBxcaXwNSm8BaPO7HsUXLicV5cQI9A+NZl8J1RnDlDjH3zwwYtlhbWGqvLJ6gmkMX/Tp5etKklVX6/yFxXT7tEIM92PrxuOHDkyIUr9NprefffdRf2p/zUjRoyAQMgbKR0qZcWF4zTi7G58LlZfdF4tEgjkig0/dgdAw6VjJkyYME2T5qeKUG1iQ8Q+NnTo0N+KrN/pYwZbwqbcVVefTap+L9YKS7qbLoI9K1euXKD9Rkkt5oXkhXfhzfK6jPUJk/T+GQSygoFLYlAwTMpVP4kVDz0JtilFtUwGoJ977rk/q/1vCjrn5ZdffihsqgshxvWqvlHVHDJ++umn091k0ftkvX/XPlXSI6QcG+udHCvk2ae7ckkew/D9iV2tpKbsZ+6ohybiu0aNGrVh+PDhQxTHeml80UvvM/QUyqyO7NYkfOPDDz/8lwULFrysqYANKBo0v9s0f/78kzUfTOYUTOqZ88nFNnpMIiyp08fUI/1GMqXQb1ZohLrqzTff/E6Vaf/K0xi1C0LZJE+aCzFy9ncytOMKhjjUrJErHIWAPkOGDDl07ty5Q0XmQK2a9IUsWcfut956a+urr766U21Cob/uGlnO1aT8j1YBgXq6OtKSmBWVpHK/kfqL9NmupE6k1r3++usXa1T6ktxyjQqZMGYn8JDYZQUCQ+Jwo8RBBgy4rnHSKVLmYTxAdJx0lnR2QcnPDJTtE6S/1qtj87Q0ln6eglHmwoULzWLKprythBsVcakrFeF/08svHEu4YM2FZq5T2fwJJ9dSAVTcFFc4qa12cOVTxtXPXAzNroxQRjvTOi2R7frkk09eVVkirNDgHuUWragkxY0+8cQTkQYzaZ3c769034+4lyWsuV4m7etgyrSEQIizeGKxBbKMNIgEUUgjb2QZmdlt2tbKxe6R+3tNpLBPIkz8NTWwzbLpqlWrIsW9tE6Dn1FaXmPVBU9hJEKeado2T5nmEhi6MiPPrBASjTDIg6jvC7o7yJs1WpuUUD0G8bFi10a1TYQYd+KJJyaL3VaWTbdt2xbpE11hcTcRjwvlnExzTR4n31wCaWtilgiBRqJZIVZlFkfe1MpIjXBL61977bVtepeBf+HDxZGMLs8///x0wZuycqJBU1Gxnkbj4uCcjDhSxNIftnL0t6UEmiUCQUgkBKJYoqmRF6bUsW1tLK3/p0QEUpfISSedFB199NG2WZLqAd50FEql9q17++23NysLWUYiVSa5JdFOsDkpIBhAxBpGGskUQinLViir/oxSmUyb2jYrJKxP2gi2Uvmx0smHHXbYDH3c5510WKmMYmPy5SbNK+3CSVLdgoo1r4w1x0yba0nt3xrRMhIeKcU0+U2bzHOsuSSQE2uphEAAKILrM5DDGGluljLy1o7U+klSjSi7a437I/3LutM1TWBuGXGX4uyzz460fJaMOImNZ511VnTTTTdFp59+ejpSZR6oeeGf9ADUOvWBJwh/147LjpWuXYQAwKO4K9QsEqtEmYNl1Sb9WCrWiKUMl46STpZOfemll25LzaqQESmxlupiDXSSuxHh/I8mWulZO2fOnFnaf4x0hLTLWKDO9YDFCLTUiLQUQtFwG2IhMVxTPULbldIJ0mNkdbP1wuZTIunHWXqW0WBbqz3bH3/88SXal+cyRku5IHDRdgOXi4jj4DhzJ5xYa0g5cMx1ZfunPCSdekhOyNbcrkET+7WaRgzTwvUArZNCdoko/n2rtmv1IsttF1100b/UgFEtagMqc6N2HLl0oeWALwGrFQtC4iAM6zB3y9PSZp0VukPf75xzzqnSwGTc5MmTjxk0aFAli+RadtuuRzPWvfjii6t1L3K93kbiiQBGr0xRbFRrI13IJN6aKpsv6WgCsTwjkdEsBFqcZLsXdxr0vEyFRp7c3eimO/kNinm1etAJwiAKkizPtlkiZGYHTirKl3QEgSDI70Ie1oclkiaEKYVQI9HqrJ25QyzKCMpanZVDbO4JBJj2FIt//CZ5iEAgFMARI4kUMmlDHYQjth9lZm2WJ7V6c5vWH/vmTtqbQAAEUBNAtm1INIsx8CGIYzSLJTWCaAthpmZ5lFs/uSZP55mAQ9pRYuSRAjqpkUQeq6OclHKEchTijCxLKTPyaWMS5q0sF2lHWCDAZQGFAMTKIYEyYiBpOQKNNCPMyKMPykitP2XzKR1FoKEZAmwkAj6EQZ4RifWZBSqbEGPEWRv6og/rM5uyX+4kBKUjTi78/dDKKLdtUiRsCzkQh1jeUiszApNGef0TgtKR52jHQRoqxxTW2TFCjhFkeUvDNpbPbWrgdIYTDI/FSLTjCusoM/LCfLky2z+3aRaYjj7R7PFkt7PHF5JGXXY72963HQFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR8ARcAQcAUfAEXAEHAFHwBFwBBwBR+CgQuD/n5G5EL1KTZ0AAAAASUVORK5CYII=); }   /* hotspot (20,20) of 112x160 */
  .wc-cur .b { width: 23px; height: 22px; left: -12px; top: -11px; }
  .wc-cur .b, .mt-cur .b { background-image: url(data:image/png;base64,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); }  /* hotspot (48,44) of 92x88 */
  .wc-cur[data-s="arrow"] .a, .wc-cur[data-s="ibeam"] .b { display: block; }
  .wc-cur .ring { position: absolute; left: -15px; top: -15px; width: 30px; height: 30px; border-radius: 50%;
    border: 1.5px solid rgba(var(--wc-blue),.85); background: rgba(var(--wc-blue),.10); opacity: 0; }
  .wc-cur .cp { position: absolute; left: 12px; top: 18px; width: 15px; height: 15px; border-radius: 50%; background: #2DBE4E; opacity: 0;
    box-shadow: 0 0 0 1.5px #fff, 0 1px 3px rgba(0,0,0,.3); }
  .wc-cur .cp::before, .wc-cur .cp::after { content: ""; position: absolute; left: 50%; top: 50%; background: #fff; border-radius: 1px; }
  .wc-cur .cp::before { width: 8px; height: 2px; margin: -1px 0 0 -4px; } .wc-cur .cp::after { width: 2px; height: 8px; margin: -4px 0 0 -1px; }

  .wc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }