/* (help1) Help centre and contact page. The landing page's type (IBM Plex) and the owner's light look: a white page, near-black
   text, and dark boxes with white text inside them. Dark mode changes the page and the hairlines; the boxes stay dark. */
@font-face {font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/static/ibm-plex-mono-400-v20.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/static/ibm-plex-mono-500-v20.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-stretch:100%;font-display:swap;src:url(/static/ibm-plex-sans-v23.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url(/static/ibm-plex-sans-v23.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-stretch:100%;font-display:swap;src:url(/static/ibm-plex-sans-v23.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
*{margin:0;padding:0;box-sizing:border-box}
body{background:#ffffff;color:#14171f;line-height:1.6}
html[data-theme="dark"] body{background:#0a0a0f;color:#e6e7ec}
.h3{--ink:#14171f;--ink3:#5b6270;--line:#e6e8ef;--green:#00874a;--box:#111118;--box2:#171823;--well:#0b0c11;--hair:rgba(255,255,255,.08);
  --hi:#ffffff;--tx:#d9dbe3;--mid:#a7acba;--lo:#7d8394;--neon:#00ff88;--ease:cubic-bezier(.23,1,.32,1);--back:cubic-bezier(.34,1.56,.64,1);--ios:cubic-bezier(.32,.72,0,1);
  --sans:'IBM Plex Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  font-family:var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;interpolate-size:allow-keywords}
html[data-theme="dark"] .h3{--ink:#e6e7ec;--ink3:#a3a8b5;--line:#1a1a2e;--green:#00ff88}
.h3-wrap{max-width:1240px;margin:0 auto;padding:26px 20px 90px}
.h3 a{color:var(--green);text-decoration:none}
.h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.h3 h2{font-size:clamp(24px,3vw,34px);line-height:1.12;letter-spacing:-.028em;font-weight:600;color:var(--ink)}
.h3-eyebrow{display:inline-flex;align-items:center;gap:9px;margin-bottom:12px;font:500 12.5px var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--ink3)}
.h3-eyebrow::before{content:"";width:8px;height:8px;border-radius:1px;background:var(--neon)}
.h3-sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:20px 40px;flex-wrap:wrap;margin:0 0 22px}
.h3-sec-h p{max-width:40em;margin-top:8px;font-size:16px;color:var(--ink3)}
.h3-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* a ribbon, only while something is degraded */
.h3 a.h3-ribbon{display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:12px 16px;border-radius:12px;border:1px solid rgba(245,165,36,.45);background:rgba(245,165,36,.1);color:var(--ink);font-size:14.5px;font-weight:500}
.h3 a.h3-ribbon[hidden]{display:none}
.h3-ribbon i{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:#f5a524}
.h3-ribbon.bad{border-color:rgba(255,68,102,.5);background:rgba(255,68,102,.09)}.h3-ribbon.bad i{background:#ff4466}
.h3-ribbon b{margin-left:auto;font-weight:600;color:var(--green);white-space:nowrap}

/* ── the hero: one dark block with a slow living background ── */
.h3-hero{position:relative;z-index:5;border-radius:26px;background:#0b0b12;color:var(--tx);border:1px solid #0b0b12;isolation:isolate}
html[data-theme="dark"] .h3-hero{border-color:var(--line)}
.h3-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.h3-bg .grid{position:absolute;inset:-60px;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask-image:radial-gradient(60% 80% at 50% 40%,#000 30%,transparent 100%);mask-image:radial-gradient(60% 80% at 50% 40%,#000 30%,transparent 100%)}
.h3-bg .glow{position:absolute;width:640px;height:640px;border-radius:50%;opacity:.9}
.h3-bg .glow.a{left:-180px;top:-260px;background:radial-gradient(circle,rgba(0,255,136,.22),rgba(0,255,136,.06) 40%,transparent 68%)}
.h3-bg .glow.b{right:-220px;bottom:-320px;background:radial-gradient(circle,rgba(0,168,255,.16),rgba(0,168,255,.04) 42%,transparent 68%)}
.h3-bg .beam{position:absolute;left:-40%;top:-10%;width:36%;height:130%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.045),transparent);transform:skewX(-18deg)}
.h3-hero-in{position:relative;z-index:1;padding:64px 56px 44px;max-width:900px}
.h3-kicker{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;font:500 13px var(--mono);letter-spacing:.06em;text-transform:uppercase}
.h3-kicker::before{content:"";width:8px;height:8px;border-radius:1px;background:var(--neon);box-shadow:0 0 14px rgba(0,255,136,.8)}
.h3-shine{color:#a9adbd;background:linear-gradient(110deg,#a9adbd 42%,#ffffff 50%,#a9adbd 58%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.h3-h1{font-size:clamp(40px,6.2vw,74px);line-height:1;letter-spacing:-.04em;font-weight:600;color:var(--hi)}
.h3-h1 .w{display:inline-block}
.h3-sub{margin:18px 0 0;max-width:34em;font-size:18px;line-height:1.55;color:var(--mid)}

/* the box you ask in */
.h3-ask{position:relative;display:flex;align-items:center;gap:12px;margin-top:30px;height:66px;padding:0 10px 0 20px;border-radius:16px;background:rgba(11,12,17,.92);border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 60px rgba(0,0,0,.35);transition:border-color .2s,box-shadow .25s}
.h3-ask:focus-within{border-color:rgba(0,255,136,.6);box-shadow:0 0 0 5px rgba(0,255,136,.14),0 24px 70px rgba(0,0,0,.45)}
.h3-ask>svg.find{flex:0 0 auto;width:20px;height:20px;color:var(--lo)}
.h3-ask input{flex:1 1 auto;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--hi);font:500 17px var(--sans);position:relative;z-index:1}
.h3-ask input::placeholder{color:transparent}
.h3 .h3-ask input:focus,.h3 .h3-ask input:focus-visible,.h3 .h3-chatask input:focus,.h3 .h3-chatask input:focus-visible,.h3 .h3-askrow input:focus,.h3 .h3-askrow input:focus-visible{outline:none!important;box-shadow:none!important}
.h3-type{position:absolute;left:52px;top:0;height:100%;display:flex;align-items:center;pointer-events:none;color:var(--lo);font:400 17px var(--sans);white-space:nowrap;overflow:hidden;max-width:calc(100% - 200px)}
.h3-type::after{content:"";display:inline-block;width:2px;height:1.1em;margin-left:2px;background:var(--neon);vertical-align:-3px;animation:h3Caret 1s steps(2,end) infinite}
.h3-ask.has-q .h3-type,.h3-ask.typing .h3-type{opacity:0}
.h3-kbd{flex:0 0 auto;display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 8px;border-radius:7px;border:1px solid rgba(255,255,255,.14);font:500 12px var(--mono);color:var(--lo);white-space:nowrap}
.h3-ask:focus-within .h3-kbd{display:none}
.h3-go{flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;border:0;background:#1d1f2a;color:var(--mid);cursor:pointer;transition:background .18s,color .18s,transform .18s}
.h3-go svg{width:19px;height:19px}
.h3-ask.has-q .h3-go{background:var(--neon);color:#04120b;box-shadow:0 0 22px rgba(0,255,136,.35)}
.h3-ask.has-q .h3-go:hover{transform:translateX(2px)}
/* Delta peeks over the box and watches the cursor */
.h3-delta{position:absolute;right:76px;top:-31px;width:54px;height:40px;pointer-events:none;overflow:hidden;z-index:0}
.h3-delta svg{display:block;width:54px;height:54px;transform:translateY(0);transition:transform .35s var(--back)}
.h3-ask:focus-within .h3-delta svg{transform:translateY(-3px)}
.h3-delta .pup{transition:transform .12s ease-out}
.h3-delta .lid{transform-box:fill-box;transform-origin:50% 50%;animation:h3Blink 5s ease-in-out 2s infinite}
/* results while you type */
.h3-sug{position:absolute;left:-1px;right:-1px;top:calc(100% + 10px);z-index:30;padding:8px;border-radius:16px;background:#12131c;border:1px solid rgba(255,255,255,.11);box-shadow:0 30px 80px rgba(0,0,0,.55);transform-origin:50% 0;animation:h3Pop .22s var(--ease)}
.h3-sug[hidden]{display:none}
.h3-sug-h{padding:8px 12px 6px;font:500 11px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--lo)}
.h3 .h3-sug a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;color:var(--tx);text-decoration:none;transition:background .12s}
.h3 .h3-sug a:hover,.h3 .h3-sug a.on{background:rgba(255,255,255,.07);text-decoration:none}
.h3-sug a .ic{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(0,255,136,.1);color:var(--neon)}
.h3-sug a .ic svg{width:17px;height:17px}
.h3-sug a b{display:block;font:500 15px/1.35 var(--sans);color:var(--hi)}
.h3-sug a span{display:block;font:400 12.5px/1.4 var(--sans);color:var(--lo)}
.h3-sug a .go{margin-left:auto;flex:0 0 auto;width:16px;height:16px;color:var(--lo);opacity:0;transform:translateX(-6px);transition:opacity .15s,transform .15s}
.h3-sug a:hover .go,.h3-sug a.on .go{opacity:1;transform:none}
.h3-sug mark{background:rgba(0,255,136,.22);color:inherit;border-radius:3px;padding:0 1px}
.h3-sug-foot{display:flex;justify-content:space-between;gap:12px;padding:8px 12px 4px;font:400 12px var(--sans);color:var(--lo)}
.h3-sug-foot kbd{font:500 11px var(--mono);padding:1px 5px;border:1px solid rgba(255,255,255,.14);border-radius:5px}
/* popular chips + status */
.h3-pop{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:18px}
.h3-pop>span{margin-right:4px;font:500 12.5px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--lo)}
.h3 a.h3-chip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--tx);font:500 13.5px var(--sans);text-decoration:none;transition:background .18s,border-color .18s,color .18s;will-change:transform}
.h3 a.h3-chip:hover{background:rgba(0,255,136,.1);border-color:rgba(0,255,136,.45);color:var(--hi);text-decoration:none}
.h3 a.h3-chip svg{width:14px;height:14px;color:var(--neon)}
.h3 a.h3-status{position:absolute;right:28px;top:26px;z-index:2;display:inline-flex;align-items:center;gap:9px;height:32px;padding:0 12px 0 10px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);font:500 12.5px var(--sans);color:var(--mid);text-decoration:none}
.h3 a.h3-status:hover{color:var(--hi);text-decoration:none}
.h3-status i{position:relative;width:8px;height:8px;border-radius:50%;background:#9aa0ae}
.h3-status.ok i{background:#00e07a}
.h3-status.ok i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid rgba(0,224,122,.7);animation:h3Ping 2s var(--ease) infinite}
.h3-status.warn i{background:#f5a524}.h3-status.bad i{background:#ff4466}

/* ── topics: eight dark cards with a spotlight that follows the pointer ── */
.h3-topics{margin-top:56px}
.h3-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.h3-grid[data-n="9"],.h3-grid[data-n="6"],.h3-grid[data-n="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}      /* (help3c) nine topics sit 3 by 3, never 4 + 4 + 1 */
.h3-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:0;min-height:196px;padding:22px 22px 20px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:var(--box);color:var(--hi);text-align:left;cursor:pointer;
  --mx:50%;--my:50%;transform-style:preserve-3d;will-change:transform;transition:border-color .25s,box-shadow .3s var(--ease)}
.h3-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(260px circle at var(--mx) var(--my),rgba(0,255,136,.13),transparent 62%);opacity:0;transition:opacity .3s;pointer-events:none}
.h3-card::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:radial-gradient(220px circle at var(--mx) var(--my),rgba(0,255,136,.75),transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0;transition:opacity .3s;pointer-events:none}
.h3-card:hover{box-shadow:0 24px 60px rgba(0,0,0,.28)}
.h3-card:hover::before,.h3-card:hover::after,.h3-card:focus-visible::after{opacity:1}
.h3-card:focus-visible{outline:2px solid var(--neon);outline-offset:3px}
.h3-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:rgba(0,255,136,.1);color:var(--neon);transition:transform .35s var(--back),background .2s}
.h3-ico svg{width:22px;height:22px}
.h3-card:hover .h3-ico{transform:translateY(-2px) rotate(-6deg) scale(1.06);background:rgba(0,255,136,.16)}
.h3-card b{display:block;margin-top:auto;padding-top:26px;font:600 17.5px/1.25 var(--sans);letter-spacing:-.012em}
.h3-card p{margin:7px 0 0;font-size:13.5px;line-height:1.5;color:var(--mid);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.h3-card .n{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font:500 12.5px var(--mono);letter-spacing:.02em;color:var(--lo);transition:color .2s}
.h3-card .n svg{width:14px;height:14px;transition:transform .3s var(--back)}
.h3-card:hover .n{color:var(--neon)}
.h3-card:hover .n svg{transform:translateX(5px)}

/* things that arrive when they scroll into view */
.h3-rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 60ms)}
.h3-rv.in{opacity:1;transform:none}

/* ── fix a problem: pick a tile, then one step at a time ── */
.h3-fix{margin-top:74px}
.h3-fixgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.h3-tile{position:relative;display:flex;align-items:center;gap:14px;min-height:78px;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:var(--box);color:var(--hi);text-align:left;cursor:pointer;--mx:50%;--my:50%;transition:border-color .2s,transform .3s var(--back),box-shadow .3s}
.h3-tile::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(200px circle at var(--mx) var(--my),rgba(0,255,136,.12),transparent 62%);opacity:0;transition:opacity .25s;pointer-events:none}
.h3-tile:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(0,0,0,.25);border-color:rgba(0,255,136,.3)}
.h3-tile:hover::before{opacity:1}
.h3-tile.on{border-color:rgba(0,255,136,.6);box-shadow:0 0 0 4px rgba(0,255,136,.12)}
.h3-tile .h3-ico{flex:0 0 auto;width:42px;height:42px;border-radius:12px}
.h3-tile:hover .h3-ico{transform:rotate(-8deg) scale(1.06)}
.h3-tile b{display:block;font:600 15px/1.3 var(--sans);letter-spacing:-.01em}
.h3-tile small{display:block;margin-top:3px;font-size:12.5px;line-height:1.4;color:var(--lo)}
.h3-tile:focus-visible{outline:2px solid var(--neon);outline-offset:3px}
.h3-stepper{margin-top:16px;border-radius:22px;border:1px solid rgba(255,255,255,.1);background:var(--box);color:var(--tx);overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.3)}
.h3-stepper[hidden]{display:none}
.h3-step-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px 0}
.h3-step-title{display:flex;align-items:center;gap:12px;font:600 16px var(--sans);color:var(--hi)}
.h3-step-title .h3-ico{width:36px;height:36px;border-radius:10px}
.h3-step-title .h3-ico svg{width:18px;height:18px}
.h3-x{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;border:1px solid rgba(255,255,255,.1);background:transparent;color:var(--mid);cursor:pointer;transition:background .15s,color .15s,transform .3s var(--back)}
.h3-x svg{width:16px;height:16px}
.h3-x:hover{background:rgba(255,255,255,.06);color:var(--hi);transform:rotate(90deg)}
.h3-dots{display:flex;align-items:center;gap:0;list-style:none;margin:22px 24px 0;padding:0}
.h3-dots li{position:relative;display:flex;align-items:center;flex:1 1 0;min-width:0}
.h3-dots li:last-child{flex:0 0 auto}
.h3-dots i{position:relative;z-index:1;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1.5px solid rgba(255,255,255,.18);background:var(--box);color:var(--mid);font:600 12.5px var(--mono);font-style:normal;transition:background .3s,border-color .3s,color .3s,transform .4s var(--back)}
.h3-dots li.on i{border-color:var(--neon);color:var(--neon);transform:scale(1.12);box-shadow:0 0 0 5px rgba(0,255,136,.12)}
.h3-dots li.done i{background:var(--neon);border-color:var(--neon);color:#04120b}
.h3-dots li.done i svg{width:14px;height:14px}
.h3-dots li::after{content:"";flex:1 1 auto;height:1.5px;margin:0 8px;background:linear-gradient(90deg,var(--neon) var(--p,0%),rgba(255,255,255,.14) var(--p,0%));transition:--p .4s}
.h3-dots li:last-child::after{display:none}
.h3-dots li.done::after{background:var(--neon)}
.h3-step-view{position:relative;padding:22px 24px 4px;min-height:150px;overflow:hidden}
.h3-step-card .k{font:500 11.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lo)}
.h3-step-card h3{margin:8px 0 12px;font:600 22px/1.25 var(--sans);letter-spacing:-.02em;color:var(--hi)}
.h3-step-card p{margin:0 0 10px;font-size:15.5px;line-height:1.65;color:var(--tx)}
.h3-step-card strong{color:var(--hi)}.h3-step-card em{color:var(--hi);font-style:normal;font-weight:500}
.h3-step-card code{font:500 13px var(--mono);padding:1px 6px;border-radius:5px;background:rgba(255,255,255,.08);color:var(--hi)}
.h3-step-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px 24px 24px}
.h3-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 18px;border-radius:12px;border:1px solid transparent;font:600 14.5px var(--sans);white-space:nowrap;cursor:pointer;text-decoration:none;transition:background .18s,border-color .18s,color .18s,box-shadow .2s;will-change:transform}
.h3 a.h3-btn:hover{text-decoration:none}
.h3 .h3-btn.brand{background:var(--neon);color:#04120b;box-shadow:0 8px 26px rgba(0,255,136,.25)}
.h3 .h3-btn.brand:hover{background:#00e87b;box-shadow:0 10px 30px rgba(0,255,136,.38)}
.h3 .h3-btn.ghost{background:transparent;color:var(--hi);border-color:rgba(255,255,255,.16)}
.h3 .h3-btn.ghost:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.04)}
.h3 .h3-btn.quiet{background:transparent;color:var(--mid);padding:0 10px}
.h3 .h3-btn.quiet:hover{color:var(--hi)}
.h3-btn svg{width:16px;height:16px}
.h3-btn .ck path{stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .35s var(--ease) .05s}
.h3-btn.did .ck path{stroke-dashoffset:0}
.h3-done{display:flex;align-items:center;gap:16px;padding:10px 0 6px}
.h3-done .big{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--neon);color:#04120b;animation:h3PopIn .5s var(--back)}
.h3-done .big svg{width:26px;height:26px}
.h3-done .big svg path{stroke-dasharray:30;stroke-dashoffset:30;animation:h3Draw .45s var(--ease) .18s forwards}
.h3-done h3{margin:0;font:600 21px var(--sans);color:var(--hi)}
.h3-done p{margin:3px 0 0;color:var(--mid);font-size:14.5px}

/* ── ask anything: a conversation that grows for as long as you like ── */
.h3-chat{margin-top:74px}
.h3-thread{display:flex;flex-direction:column;gap:14px;margin:0 0 16px}
.h3-thread:empty{display:none}
.h3-msg{display:flex;gap:12px;max-width:760px;animation:h3Up .42s var(--ease)}
.h3-msg.me{align-self:flex-end;flex-direction:row-reverse}
.h3-msg .bub{padding:14px 18px;border-radius:18px;background:var(--box);color:var(--tx);border:1px solid rgba(255,255,255,.07);font-size:15.5px;line-height:1.62}
.h3-msg.me .bub{background:#1c1e2b;color:var(--hi);border-bottom-right-radius:6px;font-weight:500}
.h3-msg.ai .bub{border-bottom-left-radius:6px;min-width:200px}
.h3-msg .av{flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--box);border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;overflow:hidden;margin-top:auto}
.h3-msg .av svg{width:28px;height:28px}
.h3-from{display:block;margin-bottom:8px;font:500 11px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--lo)}
.h3-from b{font-weight:500;color:var(--mid);text-transform:none;letter-spacing:0;font-family:var(--sans);font-size:13.5px}
.h3-think{display:inline-flex;align-items:center;gap:5px;height:20px}
.h3-think i{width:6px;height:6px;border-radius:50%;background:var(--neon);animation:h3Dot 1.1s ease-in-out infinite}
.h3-think i:nth-child(2){animation-delay:.15s}.h3-think i:nth-child(3){animation-delay:.3s}
.h3-a{font-size:15.5px;line-height:1.66;color:var(--tx)}
.h3-a p{margin:0 0 11px}.h3-a p:last-child{margin-bottom:0}
.h3-a strong{color:var(--hi);font-weight:600}.h3-a em{color:var(--hi);font-style:normal;font-weight:500}
.h3-a code{font:500 13px var(--mono);padding:1px 6px;border-radius:5px;background:rgba(255,255,255,.08);color:var(--hi)}
.h3-a ol{margin:0 0 11px 20px}.h3-a li{margin:0 0 10px;padding-left:4px}.h3-a li>strong{display:block;margin-bottom:3px}
.h3-a a{color:var(--neon)}
.h3-msg.ai .h3-a>*{animation:h3Up .45s var(--ease) both}
.h3-msg.ai .h3-a>*:nth-child(2){animation-delay:.08s}.h3-msg.ai .h3-a>*:nth-child(3){animation-delay:.16s}.h3-msg.ai .h3-a>*:nth-child(4){animation-delay:.24s}
.h3-alts{margin-top:12px;padding-top:10px;border-top:1px solid var(--hair);font-size:13.5px;color:var(--lo)}
.h3-alts a{display:inline-block;margin:4px 16px 0 0;color:var(--neon)}
.h3-pick{display:flex;flex-direction:column;margin-top:10px}
.h3 .h3-pick a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 2px;border-bottom:1px solid var(--hair);color:var(--hi);font:500 15px var(--sans);text-decoration:none}
.h3 .h3-pick a::after{content:"";flex:0 0 7px;width:7px;height:7px;margin-right:8px;border-right:1.6px solid var(--lo);border-top:1.6px solid var(--lo);transform:rotate(45deg);transition:transform .15s,border-color .15s}
.h3 .h3-pick a:hover{color:var(--neon)}.h3 .h3-pick a:hover::after{border-color:var(--neon);transform:translateX(3px) rotate(45deg)}
.h3-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin-top:14px;font-size:13.5px}
.h3 .h3-foot a,.h3-foot button{padding:0;border:0;background:none;color:var(--lo);font:500 13.5px var(--sans);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.h3 .h3-foot a:hover,.h3-foot button:hover{color:var(--hi);text-decoration:none}
.h3 .h3-foot a.go{color:var(--neon)}
.h3-foot svg{width:14px;height:14px}
.h3-foot .yes.did{color:var(--neon)}
.h3-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.h3-chatask{display:flex;align-items:center;gap:10px;height:62px;padding:0 8px 0 20px;border-radius:16px;background:var(--box);border:1px solid rgba(255,255,255,.1);transition:border-color .2s,box-shadow .2s}
.h3-chatask:focus-within{border-color:rgba(0,255,136,.55);box-shadow:0 0 0 4px rgba(0,255,136,.12)}
.h3-chatask input{flex:1 1 auto;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--hi);font:500 16px var(--sans)}
.h3-chatask input::placeholder{color:var(--lo);font-weight:400}
.h3-chatask button{flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;border:0;background:#1d1f2a;color:var(--mid);cursor:pointer;transition:background .18s,color .18s}
.h3-chatask button svg{width:18px;height:18px}
.h3-chatask.has-q button{background:var(--neon);color:#04120b}
.h3-chat-note{margin-top:10px;font-size:13px;color:var(--ink3)}

/* ── still stuck ── */
.h3-end{display:flex;align-items:center;justify-content:space-between;gap:20px 40px;flex-wrap:wrap;margin-top:70px;padding-top:30px;border-top:1px solid var(--line)}
.h3-end p{margin-top:6px;max-width:40em;font-size:15px;color:var(--ink3)}
.h3-end-links{display:flex;flex-wrap:wrap;gap:10px}
.h3 .h3-end-links a{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:12px;border:1px solid var(--line);color:var(--ink);font:600 14.5px var(--sans);text-decoration:none;transition:border-color .2s,background .2s;will-change:transform}
.h3 .h3-end-links a:hover{border-color:var(--ink);text-decoration:none}
.h3 .h3-end-links a.brand{background:var(--ink);color:#fff;border-color:var(--ink)}
html[data-theme="dark"] .h3 .h3-end-links a.brand{background:var(--neon);color:#04120b;border-color:var(--neon)}
.h3-end-links svg{width:15px;height:15px;transition:transform .2s}
.h3-end-links a:hover svg{transform:translate(2px,-2px)}

/* ── the drawer: one topic's answers, slid in from the right ── */
.h3-drawer{position:fixed;inset:0;z-index:1200}
.h3-drawer[hidden]{display:none}
.h3-scrim{position:absolute;inset:0;background:rgba(5,7,11,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .35s}
.h3-drawer.on .h3-scrim{opacity:1}
.h3-panel{position:absolute;top:0;right:0;bottom:0;width:min(680px,100%);display:flex;flex-direction:column;background:#0e0f16;color:var(--tx);border-left:1px solid rgba(255,255,255,.1);box-shadow:-30px 0 80px rgba(0,0,0,.45);transform:translateX(100%);transition:transform .46s var(--ios)}
.h3-drawer.on .h3-panel{transform:none}
.h3-panel-h{display:flex;align-items:center;gap:14px;padding:22px 26px 18px;border-bottom:1px solid var(--hair)}
.h3-panel-h .h3-ico{flex:0 0 auto}
.h3-panel-h .h3-eyebrow{margin-bottom:2px}
.h3-panel-h h2{font-size:22px;color:var(--hi)}
.h3-panel-h .h3-x{margin-left:auto}
.h3-panel-b{flex:1 1 auto;overflow:auto;padding:8px 26px 30px;scrollbar-width:thin}
.h3-topic[hidden]{display:none}
.h3-topic-d{margin:14px 0 6px;font-size:15px;color:var(--mid)}
.h3-list>details{border-bottom:1px solid var(--hair)}
.h3-list summary{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:60px;padding:15px 2px;list-style:none;cursor:pointer;font:500 16px/1.4 var(--sans);color:var(--hi);transition:color .12s}
.h3-list summary::-webkit-details-marker{display:none}
.h3-list summary:hover{color:var(--neon)}
.h3-list summary::after{content:"";flex:0 0 9px;width:9px;height:9px;margin-right:6px;border-right:1.7px solid var(--lo);border-bottom:1.7px solid var(--lo);transform:rotate(45deg) translateY(-3px);transition:transform .25s var(--ease)}
.h3-list details[open]>summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.h3-list details::details-content{height:0;overflow:clip;transition:height .3s var(--ease),content-visibility .3s allow-discrete}
.h3-list details[open]::details-content{height:auto}
.h3-tag{margin-left:10px;font:500 11px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--neon);vertical-align:1px}
.h3-list .h3-a{padding:0 40px 20px 2px}
.h3-list details.flash>summary{animation:h3Flash 1.6s ease-out}
.h3-mini{display:flex;flex-direction:column;gap:12px;margin-top:18px}
.h3-mini:empty{display:none}
/* (helpinbox1) the "answer me by email" row under an answer, for readers we cannot otherwise name */
.h3-mailme{display:block;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.h3-mailme label{display:block;font-size:13px;color:var(--lo);line-height:1.55;margin-bottom:10px}
.h3-mailme label a{color:var(--neon)}
.h3-mailme .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.h3-mailme input{flex:1 1 200px;min-width:0;height:44px;padding:0 14px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:var(--well);color:var(--hi);font:500 15px var(--sans)}
.h3-mailme input:focus{outline:0;border-color:rgba(0,255,136,.55)}
.h3-mailme button[disabled]{opacity:.55;cursor:default}
.h3-askrow{display:flex;align-items:center;gap:12px;margin-top:16px;height:56px;padding:0 6px 0 16px;border-radius:14px;background:var(--well);border:1px solid rgba(255,255,255,.1);transition:border-color .2s}
.h3-askrow:focus-within{border-color:rgba(0,255,136,.55)}
.h3-askrow input{flex:1 1 auto;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--hi);font:500 15.5px var(--sans)}
.h3-askrow input::placeholder{color:var(--lo);font-weight:400}
.h3-askrow button{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;border:0;background:transparent;color:var(--lo);cursor:pointer;transition:background .15s,color .15s}
.h3-askrow button svg{width:17px;height:17px}
.h3-askrow.has-q button{background:var(--neon);color:#04120b}

/* sparks and confetti live on the page for a moment */
.h3-spark{position:fixed;left:0;top:0;width:3px;height:14px;border-radius:2px;background:var(--neon);pointer-events:none;z-index:2000;transform-origin:50% 0}
.h3-conf{position:fixed;left:0;top:0;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:2000}

@keyframes h3Caret{50%{opacity:0}}
@keyframes h3Blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes h3Shine{to{background-position:-220% 0}}
@keyframes h3Drift{50%{transform:translate(60px,40px) scale(1.08)}}
@keyframes h3DriftB{50%{transform:translate(-70px,-40px) scale(1.06)}}
@keyframes h3Beam{0%,55%{transform:translateX(0) skewX(-18deg)}100%{transform:translateX(420%) skewX(-18deg)}}
@keyframes h3GridMove{to{background-position:44px 44px}}
@keyframes h3Ping{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.9);opacity:0}}
@keyframes h3Pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes h3Up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes h3Dot{0%,100%{transform:translateY(0);opacity:.45}50%{transform:translateY(-4px);opacity:1}}
@keyframes h3PopIn{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
@keyframes h3Draw{to{stroke-dashoffset:0}}
@keyframes h3Flash{from{color:var(--neon)}to{color:var(--hi)}}
@media (prefers-reduced-motion:no-preference){
  .h3-shine{animation:h3Shine 3.2s linear infinite}
  .h3-bg .glow.a{animation:h3Drift 16s ease-in-out infinite alternate}
  .h3-bg .glow.b{animation:h3DriftB 19s ease-in-out infinite alternate}
  .h3-bg .beam{animation:h3Beam 9s var(--ease) 2s infinite}
  .h3-bg .grid{animation:h3GridMove 22s linear infinite}
  .h3-h1 .w{opacity:0;filter:blur(10px);transform:translateY(14px);transition:opacity .7s var(--ease),filter .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 90ms + 80ms)}
  .h3-h1.in .w{opacity:1;filter:blur(0);transform:none}
  .h3-sub,.h3-ask,.h3-pop{opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
  .h3-hero.in .h3-sub{opacity:1;transform:none;transition-delay:.35s}
  .h3-hero.in .h3-ask{opacity:1;transform:none;transition-delay:.45s}
  .h3-hero.in .h3-pop{opacity:1;transform:none;transition-delay:.58s}
}
@media (prefers-reduced-motion:reduce){
  .h3 *,.h3 *::before,.h3 *::after{animation:none!important;transition:none!important}
  .h3-rv{opacity:1;transform:none}
}

/* ── smaller screens ── */
@media(max-width:1100px){.h3-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.h3-fixgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.h3-hero-in{padding:52px 34px 36px}.h3 a.h3-status{top:18px;right:18px}}
@media(max-width:760px){
  .h3-wrap{padding:16px 16px 70px}
  .h3-hero{border-radius:20px}.h3-hero-in{padding:76px 22px 28px}
  .h3 a.h3-status{top:16px;right:16px;left:16px;justify-content:center}
  .h3-h1{font-size:clamp(38px,11vw,52px)}.h3-sub{font-size:16px}
  .h3-ask{height:60px;padding:0 8px 0 16px;margin-top:24px}.h3-ask input{font-size:16px}.h3-type{left:44px;font-size:16px;max-width:calc(100% - 120px)}
  .h3-kbd{display:none}.h3-delta{right:64px;top:-30px}
  .h3-topics{margin-top:40px}.h3-fix,.h3-chat{margin-top:54px}
  .h3-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .h3-grid[data-n="9"],.h3-grid[data-n="6"],.h3-grid[data-n="3"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  .h3-grid[data-odd] .h3-card:last-child{grid-column:1/-1;min-height:0}
  .h3-card{min-height:0;padding:16px 16px 15px;border-radius:15px}.h3-card b{padding-top:18px;font-size:15.5px}.h3-card p{display:none}.h3-card .n{margin-top:10px}
  .h3-ico{width:40px;height:40px;border-radius:11px}.h3-ico svg{width:19px;height:19px}
  .h3-fixgrid{grid-template-columns:minmax(0,1fr)}
  .h3-panel{width:100%;top:auto;height:96%;border-left:0;border-top:1px solid rgba(255,255,255,.12);border-radius:22px 22px 0 0;transform:translateY(100%)}
  .h3-panel-h{padding:18px 18px 14px}.h3-panel-b{padding:4px 18px 26px}
  .h3-msg{max-width:100%}
  .h3-end{margin-top:54px}
}
@media(max-width:420px){.h3-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.h3-pop>span{display:none}}

/* (rd4) 2026-09-26, owner: "i hate this black / green ai looking gradient ... our site needs to feel extremely established".
   The help centre keeps every part of help3 (the ask box with Delta and its typed hint, the topic drawers, the guided fixes
   and their stepper, the conversation, the sparks) and wears the rest of the site's new clothes: the first screen sits on
   the landing's canvas with its heavy headline and no glowing block, and in light mode the boxes are white paper with a
   soft lift instead of dark tiles. Dark mode keeps its dark boxes and only loses the glow. */
.h3-bg{display:none}
.h3-hero{background:none;border:0;border-radius:0;isolation:auto;border-bottom:1px solid var(--line)}
html[data-theme="dark"] .h3-hero{border-color:var(--line)}
.h3-hero-in{padding:58px 0 54px;max-width:880px}
.h3-kicker{margin-bottom:18px;font:500 13px var(--mono);letter-spacing:.01em;text-transform:none;color:var(--ink3)}
.h3-kicker::before{background:#00c46e;box-shadow:none;border-radius:2px}
.h3-shine{background:none!important;-webkit-text-fill-color:currentColor!important;color:inherit;animation:none!important}
.h3-h1{font-family:-apple-system,BlinkMacSystemFont,Inter,"Segoe UI",sans-serif;font-weight:800;color:var(--ink);letter-spacing:-.034em;line-height:1.02}
.h3-sub{color:var(--ink3);font-size:18.5px}
.h3 h2{font-family:-apple-system,BlinkMacSystemFont,Inter,"Segoe UI",sans-serif;font-weight:700;letter-spacing:-.024em;text-wrap:balance}
.h3-eyebrow{text-transform:none;letter-spacing:.01em;font-size:13px}
.h3-eyebrow::before{background:#00c46e;border-radius:2px}
.h3-ask:focus-within,.h3-chatask:focus-within{box-shadow:0 0 0 4px rgba(0,196,110,.14)}
.h3-ask.has-q .h3-go{box-shadow:none}
.h3 .h3-btn.brand,.h3 .h3-btn.brand:hover{box-shadow:none}
.h3-card:hover,.h3-tile:hover{box-shadow:none}
html[data-theme="dark"] .h3-card::before,html[data-theme="dark"] .h3-tile::before{background:radial-gradient(260px circle at var(--mx) var(--my),rgba(255,255,255,.045),transparent 62%)}
html[data-theme="dark"] .h3-card::after{background:radial-gradient(220px circle at var(--mx) var(--my),rgba(255,255,255,.26),transparent 60%)}
html[data-theme="dark"] .h3-card:hover,html[data-theme="dark"] .h3-tile:hover{box-shadow:0 22px 50px -24px rgba(0,0,0,.8)}

/* light mode: the page is the landing's canvas and the boxes are white paper */
html:not([data-theme="dark"]) body{background:#f7f7fb}
html:not([data-theme="dark"]) .h3{--box:#ffffff;--box2:#f6f7f9;--well:#f6f7f9;--hair:rgba(20,23,31,.08);--hi:#14171f;--tx:#2b3040;--mid:#4b5563;--lo:#6b7280;--line:#e6e8ef}
html:not([data-theme="dark"]) .h3-ask{background:#fff;border-color:#d5d8e2;box-shadow:0 1px 2px rgba(20,23,31,.05),0 18px 40px -24px rgba(20,23,31,.28)}
html:not([data-theme="dark"]) .h3-ask:focus-within{border-color:#00c46e;box-shadow:0 0 0 4px rgba(0,196,110,.14),0 18px 40px -24px rgba(20,23,31,.28)}
html:not([data-theme="dark"]) .h3-ask>svg.find{color:#9aa1ad}
html:not([data-theme="dark"]) .h3-type{color:#6b7280}
html:not([data-theme="dark"]) .h3-type::after{background:#00c46e}
html:not([data-theme="dark"]) .h3-kbd{border-color:#d5d8e2;color:#6b7280}
html:not([data-theme="dark"]) .h3-go,html:not([data-theme="dark"]) .h3-chatask button{background:#f1f2f6;color:#6b7280}
html:not([data-theme="dark"]) .h3-sug{background:#fff;border-color:#e6e8ef;box-shadow:0 30px 70px -30px rgba(20,23,31,.35)}
html:not([data-theme="dark"]) .h3 .h3-sug a:hover,html:not([data-theme="dark"]) .h3 .h3-sug a.on{background:#f4f5f8}
html:not([data-theme="dark"]) .h3-sug a .ic,html:not([data-theme="dark"]) .h3-ico{background:#e8f8ef;color:#007a43}
html:not([data-theme="dark"]) .h3-sug mark{background:rgba(0,196,110,.2)}
html:not([data-theme="dark"]) .h3-sug-foot kbd{border-color:#d5d8e2}
html:not([data-theme="dark"]) .h3 a.h3-chip{background:#fff;border-color:#d5d8e2;color:#2b3040}
html:not([data-theme="dark"]) .h3 a.h3-chip svg{color:#007a43}
html:not([data-theme="dark"]) .h3 a.h3-chip:hover{background:#ecfdf3;border-color:#00c46e;color:#14171f}
html:not([data-theme="dark"]) .h3 a.h3-status{background:#fff;border-color:#e6e8ef;color:#4b5563}
html:not([data-theme="dark"]) .h3 a.h3-status:hover{color:#14171f}
html:not([data-theme="dark"]) .h3-card,html:not([data-theme="dark"]) .h3-tile{border-color:#e6e8ef;box-shadow:0 1px 2px rgba(20,23,31,.05)}
html:not([data-theme="dark"]) .h3-card:hover,html:not([data-theme="dark"]) .h3-tile:hover{box-shadow:0 1px 2px rgba(20,23,31,.04),0 22px 44px -24px rgba(20,23,31,.32);border-color:#d5d8e2}
html:not([data-theme="dark"]) .h3-card::before,html:not([data-theme="dark"]) .h3-tile::before{background:radial-gradient(260px circle at var(--mx) var(--my),rgba(0,196,110,.06),transparent 62%)}
html:not([data-theme="dark"]) .h3-card::after{background:radial-gradient(220px circle at var(--mx) var(--my),rgba(20,23,31,.26),transparent 60%)}
html:not([data-theme="dark"]) .h3-card:hover .h3-ico{background:#dcf5e8}
html:not([data-theme="dark"]) .h3-card:hover .n{color:#007a43}
html:not([data-theme="dark"]) .h3-card:focus-visible,html:not([data-theme="dark"]) .h3-tile:focus-visible{outline-color:#14171f}
html:not([data-theme="dark"]) .h3-tile.on{border-color:#00c46e;box-shadow:0 0 0 4px rgba(0,196,110,.14)}
html:not([data-theme="dark"]) .h3-stepper{border-color:#e6e8ef;box-shadow:0 1px 2px rgba(20,23,31,.05),0 30px 70px -36px rgba(20,23,31,.35)}
html:not([data-theme="dark"]) .h3-x{border-color:#e6e8ef}
html:not([data-theme="dark"]) .h3-x:hover{background:#f4f5f8}
html:not([data-theme="dark"]) .h3-dots i{border-color:#d5d8e2}
html:not([data-theme="dark"]) .h3-dots li.on i{border-color:#00c46e;color:#007a43;box-shadow:0 0 0 5px rgba(0,196,110,.14)}
html:not([data-theme="dark"]) .h3-dots li::after{background:linear-gradient(90deg,#00c46e var(--p,0%),#e6e8ef var(--p,0%))}
html:not([data-theme="dark"]) .h3-dots li.done::after{background:#00c46e}
html:not([data-theme="dark"]) .h3-step-card code,html:not([data-theme="dark"]) .h3-a code{background:#f1f2f6}
html:not([data-theme="dark"]) .h3 .h3-btn.ghost{color:#14171f;border-color:#d5d8e2}
html:not([data-theme="dark"]) .h3 .h3-btn.ghost:hover{border-color:#14171f;background:#fff}
html:not([data-theme="dark"]) .h3-msg .bub{border-color:#e6e8ef;box-shadow:0 1px 2px rgba(20,23,31,.04)}
html:not([data-theme="dark"]) .h3-msg.me .bub{background:#14171f;color:#fff;border-color:#14171f}
html:not([data-theme="dark"]) .h3-msg .av{border-color:#e6e8ef}
html:not([data-theme="dark"]) .h3-think i{background:#00c46e}
html:not([data-theme="dark"]) .h3-a a,html:not([data-theme="dark"]) .h3-alts a,html:not([data-theme="dark"]) .h3 .h3-foot a.go,
html:not([data-theme="dark"]) .h3-foot .yes.did,html:not([data-theme="dark"]) .h3-mailme label a,html:not([data-theme="dark"]) .h3-tag{color:#007a43}
html:not([data-theme="dark"]) .h3 .h3-pick a:hover,html:not([data-theme="dark"]) .h3-list summary:hover{color:#007a43}
html:not([data-theme="dark"]) .h3 .h3-pick a:hover::after{border-color:#007a43}
html:not([data-theme="dark"]) .h3-chatask{border-color:#d5d8e2;box-shadow:0 1px 2px rgba(20,23,31,.05)}
html:not([data-theme="dark"]) .h3-chatask:focus-within{border-color:#00c46e}
html:not([data-theme="dark"]) .h3-scrim{background:rgba(20,23,31,.32)}
html:not([data-theme="dark"]) .h3-panel{background:#fff;border-left-color:#e6e8ef;box-shadow:-30px 0 80px -20px rgba(20,23,31,.3)}
html:not([data-theme="dark"]) .h3-mailme{border-top-color:#e6e8ef}
html:not([data-theme="dark"]) .h3-mailme input{border-color:#d5d8e2}
html:not([data-theme="dark"]) .h3-mailme input:focus,html:not([data-theme="dark"]) .h3-askrow:focus-within{border-color:#00c46e}
html:not([data-theme="dark"]) .h3-askrow{border-color:#e6e8ef}
html:not([data-theme="dark"]) .h3-list details.flash>summary{animation:none}
@media(max-width:760px){
  .h3-hero-in{padding:64px 0 36px}
  html:not([data-theme="dark"]) .h3-panel{border-top-color:#e6e8ef}
}

/* (rd6) the help centre's living light and shimmer come back, drawn for the light page; the pointer's light on every card
   is visible again. Owner: "you removed a lot of the cool motion effects? why? we want those". */
.h3-bg{display:block;top:-26px;left:calc(50% - 50vw);right:calc(50% - 50vw);border-radius:0}
@media(max-width:760px){.h3-bg{top:-16px}}
.h3-hero-in{z-index:1}
.h3-bg .grid{display:none}
.h3-bg .glow.a{width:860px;height:860px;left:calc(50% - 960px);top:-470px}
.h3-bg .glow.b{width:940px;height:940px;right:auto;left:calc(50% + 40px);bottom:auto;top:-300px}
html:not([data-theme="dark"]) .h3-bg .glow.a{background:radial-gradient(circle,rgba(0,214,120,.2),rgba(0,214,120,.07) 40%,transparent 68%)}
html:not([data-theme="dark"]) .h3-bg .glow.b{background:radial-gradient(circle,rgba(56,150,255,.16),rgba(56,150,255,.05) 42%,transparent 68%)}
html:not([data-theme="dark"]) .h3-bg .beam{background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);opacity:.6}
html[data-theme="dark"] .h3-bg .glow{opacity:.65}
html:not([data-theme="dark"]) .h3 .h3-shine{background:linear-gradient(110deg,#5b6270 42%,#00a05a 50%,#5b6270 58%)!important;background-size:220% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important}
html[data-theme="dark"] .h3 .h3-shine{background:linear-gradient(110deg,#a9adbd 42%,#ffffff 50%,#a9adbd 58%)!important;background-size:220% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important}
@media (prefers-reduced-motion:no-preference){.h3 .h3-shine{animation:h3Shine 3.2s linear infinite!important}}
html:not([data-theme="dark"]) .h3-card::before,html:not([data-theme="dark"]) .h3-tile::before{background:radial-gradient(290px circle at var(--mx) var(--my),rgba(0,196,110,.13),transparent 62%)}
html:not([data-theme="dark"]) .h3-card::after{background:radial-gradient(230px circle at var(--mx) var(--my),rgba(0,196,110,.9),transparent 60%)}
html[data-theme="dark"] .h3-card::before,html[data-theme="dark"] .h3-tile::before{background:radial-gradient(260px circle at var(--mx) var(--my),rgba(0,255,136,.13),transparent 62%)}
html[data-theme="dark"] .h3-card::after{background:radial-gradient(220px circle at var(--mx) var(--my),rgba(0,255,136,.75),transparent 60%)}
html:not([data-theme="dark"]) .h3-tile:hover{border-color:rgba(0,196,110,.45)}
