:root{
 --ink:#12142B;--ink-soft:#3A3A4D;--muted:#6B6B80;
 --violet:#6D4AFF;--violet-tint:#EEEAFF;--violet-ink:#4B32C3;
 --mint:#00C48C;--mint-tint:#E0FAF1;--mint-ink:#007A57;
 --canvas:#F7F7FB;--surface:#FFF;--border:#E3E3EC;--radius:10px;--thead:#2E2168;
 --fh:'Outfit',system-ui,sans-serif;--fb:'Inter',system-ui,sans-serif;
 --fo:'Segoe UI Symbol','Apple Symbols','Cambria Math','STIX Two Math','Noto Sans Math','Noto Sans Symbols2','Symbola','DejaVu Sans',sans-serif;
 --sh:0 1px 2px rgba(18,20,43,.04);
 --max:1200px;
}
[data-theme="dark"]{
 --ink:#EDEDF5;--ink-soft:#C4C4D4;--muted:#8A8AA3;
 --violet:#8A6BFF;--violet-tint:#2E2358;--violet-ink:#C4B5FF;
 --mint:#00C48C;--mint-tint:#10322A;--mint-ink:#5DE0B8;
 --canvas:#0C0D1C;--surface:#191B33;--border:#2C2F4D;--sh:none;--thead:#3A2C7A;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--canvas);color:var(--ink-soft);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--fh);color:var(--ink);line-height:1.2}
h1{font-size:38px;font-weight:700;letter-spacing:-.6px}
h2{font-size:27px;font-weight:600;letter-spacing:-.3px}
h3{font-size:18px;font-weight:600}
a{color:var(--violet);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.font-output{font-family:var(--fo)}

/* ANNOUNCE STRIP */
.db{background:#12142B;color:#fff;padding:8px 0;font-size:13px;position:sticky;top:0;z-index:150;text-align:center}
.db b{color:#B9A6FF;font-weight:600}
[data-theme="dark"] .db{background:#05060F}

/* HEADER */
header{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:37px;z-index:100}
.hdr{display:flex;align-items:center;gap:18px;height:62px;max-width:var(--max);margin:0 auto;padding:0 24px}
.logo{display:flex;align-items:center;gap:8px;flex-shrink:0;cursor:pointer}
.logo:hover{text-decoration:none}
.logo svg{width:29px;height:29px;border-radius:7px;display:block}
.ltx{font-family:var(--fh);font-weight:600;font-size:19px;color:var(--ink);letter-spacing:-.3px}
.ltx em{font-style:normal;color:var(--violet)}
nav{display:flex;gap:1px;margin-left:auto}
.ni{position:relative}
.nb{font-family:var(--fb);font-size:14px;font-weight:500;color:var(--ink-soft);background:none;border:none;padding:8px 11px;border-radius:7px;cursor:pointer;display:flex;align-items:center;gap:4px}
.nb:hover{background:var(--canvas);color:var(--ink)}
.nb svg{width:11px;height:11px;opacity:.5}
/* dropdown — hover-bridge fix: pseudo-element fills the visual gap so cursor never leaves hover zone */
.dd{display:none;position:absolute;top:100%;left:0;min-width:210px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:6px;box-shadow:0 8px 26px rgba(18,20,43,.1);margin-top:10px}
.dd::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px;background:transparent}
[data-theme="dark"] .dd{box-shadow:0 8px 26px rgba(0,0,0,.4)}
.ni:hover .dd,.ni:focus-within .dd{display:block}
.dd a{display:block;padding:8px 11px;border-radius:7px;font-size:14px;color:var(--ink-soft);cursor:pointer}
.dd a:hover{background:var(--violet-tint);color:var(--violet-ink);text-decoration:none}
.tgl{background:none;border:1px solid var(--border);border-radius:8px;width:34px;height:34px;cursor:pointer;color:var(--ink-soft);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.tgl:hover{background:var(--canvas)}
.tgl svg{width:16px;height:16px}
/* mobile controls cluster (theme + hamburger), pushed right */
.mctrl{display:none;margin-left:auto;align-items:center;gap:10px}
.mb{background:none;border:1px solid var(--border);border-radius:8px;width:36px;height:36px;cursor:pointer;color:var(--ink-soft);align-items:center;justify-content:center;display:flex}
.mb svg{width:18px;height:18px}

/* OFF-CANVAS SIDEBAR */
.scrim{position:fixed;inset:0;background:rgba(10,11,25,.5);opacity:0;visibility:hidden;transition:opacity .25s;z-index:200}
.scrim.open{opacity:1;visibility:visible}
.sidebar{position:fixed;top:0;right:-320px;width:300px;max-width:85vw;height:100%;background:var(--surface);z-index:210;box-shadow:-8px 0 30px rgba(0,0,0,.15);transition:right .28s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;align-items:stretch;overflow-y:auto}
[data-theme="dark"] .sidebar{box-shadow:-8px 0 30px rgba(0,0,0,.5)}
.sidebar.open{right:0}
.sbhead{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);z-index:2}
.sbclose{background:none;border:none;cursor:pointer;color:var(--muted);width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:8px}
.sbclose:hover{background:var(--canvas);color:var(--ink)}
.sbclose svg{width:20px;height:20px}
.sbnav{display:block;width:100%;padding:10px 14px 30px}
.sbnav .acc{display:block;width:100%}
.sbnav .home{display:block;padding:13px 14px;font-family:var(--fh);font-weight:600;font-size:16px;color:var(--ink);border-radius:9px;cursor:pointer}
.sbnav .home:hover{background:var(--violet-tint);color:var(--violet-ink);text-decoration:none}
.acc{border-radius:9px;overflow:hidden;margin-bottom:2px}
.acc-h{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;cursor:pointer;padding:13px 14px;font-family:var(--fh);font-weight:600;font-size:16px;color:var(--ink);text-align:left}
.acc-h:hover{background:var(--canvas)}
.acc-h svg{width:15px;height:15px;color:var(--muted);transition:transform .2s;flex-shrink:0}
.acc.open .acc-h svg{transform:rotate(180deg)}
.acc-b{display:none;padding:2px 0 8px 14px}
.acc.open .acc-b{display:block}
.acc-b a{display:block;padding:9px 14px;font-size:14.5px;color:var(--ink-soft);border-radius:8px;cursor:pointer}
.acc-b a:hover{background:var(--violet-tint);color:var(--violet-ink);text-decoration:none}

/* HERO */
.hero{padding:52px 0 30px;text-align:center}
.hero h1{margin-bottom:14px}
.hero h1 .g{background:linear-gradient(90deg,var(--violet),#A98BFF);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p{font-size:17px;color:var(--muted);max-width:760px;margin:0 auto;line-height:1.55}

/* TOOL PREVIEW */
.tool{max-width:900px;margin:26px auto 60px;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 4px 22px rgba(18,20,43,.06)}
[data-theme="dark"] .tool{box-shadow:0 4px 22px rgba(0,0,0,.28)}
.tool textarea{width:100%;min-height:72px;resize:vertical;display:block;font-family:var(--fb);font-size:16px;color:var(--ink);line-height:1.5;background:var(--canvas);border:1.5px solid var(--border);border-radius:12px;padding:14px 16px;outline:none;transition:border-color .15s,box-shadow .15s}
.tool textarea:focus{border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-tint)}
.tool textarea::placeholder{color:var(--muted)}
.tbar{display:flex;align-items:center;gap:12px;margin:10px 2px 6px}
.tbar .cnt{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.tbar .lnk{margin-left:auto;font-size:13px;font-weight:500;cursor:pointer}
.res{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.row{background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:11px 13px;display:flex;align-items:center;gap:12px;box-shadow:var(--sh);cursor:pointer;transition:border-color .1s,background .1s}
.row:hover{border-color:var(--violet);background:var(--violet-tint)}
.row:hover .cp{background:#5C3AE8;color:#fff}
[data-theme="dark"] .row:hover .cp{background:#9B80FF;color:#0C0D1C}
.row:active{transform:scale(.998)}
.row .tag{font-size:11px;font-weight:600;color:var(--muted);width:80px;flex-shrink:0;font-family:var(--fb);text-transform:uppercase;letter-spacing:.3px}
.row .out{flex:1;font-family:var(--fo);font-size:18px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cp{background:var(--canvas);color:var(--muted);border:none;border-radius:7px;width:32px;height:32px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--fb)}
.cp svg{width:15px;height:15px}
.cp.done{background:var(--mint-tint)!important;color:var(--mint-ink)!important}
.toolcta{text-align:center;margin-top:15px;font-size:14px;color:var(--muted)}
.toolcta a{cursor:pointer}

/* SECTIONS — 60px top/bottom, alternating bg */
section.blk{padding:60px 0}
section.alt{background:var(--surface)}
[data-theme="dark"] section.alt{background:#10121F}
.eyebrow{font-family:var(--fb);font-size:12px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--violet);margin-bottom:9px}
.blk h2.sh{margin-bottom:8px}
.lead{color:var(--muted);max-width:760px;margin-bottom:26px;font-size:16px}

/* POPULAR TOOL CARDS */
.tgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tcard{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:17px;display:block;transition:transform .13s,border-color .13s,box-shadow .13s;cursor:pointer}
section.alt .tcard{background:var(--canvas)}
[data-theme="dark"] section.alt .tcard{background:var(--surface)}
.tcard:hover{transform:translateY(-3px);border-color:var(--violet);box-shadow:0 8px 22px rgba(109,74,255,.14);text-decoration:none}
.tcard .pv{font-family:var(--fo);font-size:25px;color:var(--violet);line-height:1;margin-bottom:13px;display:block;height:28px;overflow:hidden;white-space:nowrap}
.tcard .nm{font-family:var(--fh);font-weight:600;font-size:18px;color:var(--ink);margin-bottom:5px;display:block}
.tcard .ds{font-size:14.5px;color:var(--muted);line-height:1.45;display:block}

/* CATEGORY CARDS */
.cgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ccard{background:linear-gradient(160deg,var(--violet-tint),var(--surface));border:1px solid var(--border);border-radius:16px;padding:22px 20px;display:block;transition:transform .13s,box-shadow .13s;cursor:pointer}
.ccard:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(109,74,255,.15);text-decoration:none}
.ccard .ic{width:42px;height:42px;border-radius:11px;background:var(--violet);display:flex;align-items:center;justify-content:center;margin-bottom:15px}
.ccard .ic svg{width:22px;height:22px;color:#fff}
.ccard h3{color:var(--ink);margin-bottom:6px;font-size:18px}
.ccard p{font-size:14.5px;color:var(--muted);line-height:1.5;margin-bottom:12px}
.ccard .cl{font-size:13px;color:var(--violet-ink);font-weight:600}

/* IMAGE PLACEHOLDER */
.imgph{border:2px dashed var(--border);border-radius:14px;background:var(--canvas);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 24px;color:var(--muted);min-height:230px}
section.alt .imgph{background:var(--surface)}
.imgph svg{width:34px;height:34px;margin-bottom:12px;color:var(--violet);opacity:.6}
.imgph .t{font-family:var(--fh);font-weight:600;color:var(--ink-soft);font-size:14px;margin-bottom:4px}
.imgph .d{font-size:12.5px;max-width:280px;line-height:1.5}
.imgph .tag{margin-top:9px;font-size:11px;font-weight:600;background:var(--violet-tint);color:var(--violet-ink);border-radius:20px;padding:3px 10px;letter-spacing:.3px}
/* UI MOCKUP (SVG illustration of the tool) */
.mockup{width:100%;border-radius:16px;overflow:hidden;box-shadow:0 10px 34px rgba(18,20,43,.10);border:1px solid var(--border);background:var(--surface)}
.mockrow{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:26px 0 8px}
@media(max-width:720px){.mockrow{grid-template-columns:1fr}}
[data-theme="dark"] .mockup{box-shadow:0 10px 34px rgba(0,0,0,.35)}
.mockup svg{display:block;width:100%;height:auto}
.mockcap{text-align:center;font-size:13px;color:var(--muted);margin-top:12px}

/* SPLIT ROW (text + image) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.split.rev .txt{order:2}
.split .txt h2{margin-bottom:12px}
.split .txt p{font-size:16.5px;line-height:1.72;margin-bottom:14px;color:var(--ink-soft)}
.split .txt p:last-child{margin-bottom:0}
.split .txt strong{color:var(--ink);font-weight:600}
.split .demo{font-family:var(--fo);color:var(--violet-ink);background:var(--violet-tint);padding:1px 7px;border-radius:5px}
.fpoint{border-left:2px solid var(--violet-tint);padding:2px 0 2px 16px;margin:16px 0}
.fpoint h3{font-size:16px;color:var(--ink);margin-bottom:4px}
.fpoint p{font-size:14.5px !important;line-height:1.6 !important;margin:0 !important;color:var(--muted)}

/* CONTENT ARTICLE — full 1200 container; prose line-length constrained for readability */
.article{max-width:var(--max);margin:0 auto}
.article h2{margin-bottom:6px}
.article .sub{color:var(--violet);font-weight:600;font-size:12px;letter-spacing:.7px;text-transform:uppercase;margin-bottom:14px;display:block}
.article p{margin:0 0 16px;font-size:16.5px;line-height:1.72;color:var(--ink-soft)}
.article p.big{font-size:17.5px}
.article strong{color:var(--ink);font-weight:600}
.article .demo{font-family:var(--fo);color:var(--violet-ink);background:var(--violet-tint);padding:1px 7px;border-radius:5px}
.article a{font-weight:500;cursor:pointer}
.mt{margin-top:44px}

/* CALLOUT + KEY BOX */
.callout{background:var(--violet-tint);border-left:4px solid var(--violet);border-radius:0 12px 12px 0;padding:17px 19px;margin:22px 0}
.callout h3{color:var(--violet-ink);font-size:15px;margin-bottom:5px}
.callout p{margin:0;font-size:15px;color:var(--ink-soft)}
.keyrow{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0 8px}
.kbox{flex:1;min-width:200px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px}
section.alt .kbox{background:var(--canvas)}
[data-theme="dark"] section.alt .kbox{background:var(--surface)}
.kbox .u{display:inline-block;font-family:'Consolas','SF Mono',ui-monospace,monospace;font-weight:600;font-size:12.5px;color:var(--violet-ink);background:var(--violet-tint);padding:3px 9px;border-radius:6px;letter-spacing:.3px;margin-bottom:10px}
.kbox .t{font-family:var(--fh);font-weight:600;color:var(--ink);font-size:18px;margin-bottom:6px;line-height:1.25}
.kbox p{font-size:14.5px;color:var(--muted);margin:0;line-height:1.5}
.kbox .big{font-size:22px;font-family:var(--fh);color:var(--violet);font-weight:600;margin-bottom:2px}
.kbox .plr{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.kbox .plr svg{width:20px;height:20px;flex-shrink:0}
.kbox .plr .t{margin:0}
[data-theme="dark"] .kbox .plr svg[fill="#000"]{fill:var(--ink)}
[data-theme="dark"] .plat svg[fill="#000"]{fill:var(--ink)}

/* STEP CARDS */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0 8px}
.step{background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:18px}
section.alt .step{background:var(--canvas)}
[data-theme="dark"] section.alt .step{background:var(--surface)}
.step .n{width:28px;height:28px;border-radius:8px;background:var(--violet);color:#fff;font-family:var(--fh);font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center;margin-bottom:11px}
.step h3{font-size:18px;margin-bottom:5px}
.step p{font-size:14.5px;color:var(--muted);margin:0;line-height:1.55}

/* FEATURE PILLS */
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:22px 0 8px}
.feat{display:flex;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:17px 18px}
section.alt .feat{background:var(--canvas)}
[data-theme="dark"] section.alt .feat{background:var(--surface)}
.feat .fi{width:40px;height:40px;border-radius:10px;background:var(--violet-tint);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.feat .fi svg{width:20px;height:20px;color:var(--violet)}
.feat h3{font-size:18px;margin-bottom:5px}
.feat p{font-size:14.5px;color:var(--muted);margin:0;line-height:1.55}

/* COMPAT TABLE */
.twrap{margin:22px 0 8px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface)}
section.alt .twrap{background:var(--canvas)}
[data-theme="dark"] section.alt .twrap{background:var(--surface)}
.tmeta{padding:12px 17px;background:var(--canvas);border-bottom:1px solid var(--border);font-size:13px;color:var(--muted)}
[data-theme="dark"] .tmeta{background:#10121F}
section.alt .tmeta{background:var(--surface)}
[data-theme="dark"] section.alt .tmeta{background:#10121F}
table.compat{width:100%;border-collapse:collapse;font-size:15.5px}
table.compat th,table.compat td{text-align:left;padding:13px 18px;border-bottom:1px solid var(--border);vertical-align:top}
/* prominent header */
table.compat thead th{font-family:var(--fh);font-size:12.5px;font-weight:700;color:#fff;background:var(--thead);text-transform:uppercase;letter-spacing:.5px;border-bottom:none}
[data-theme="dark"] table.compat thead th{background:var(--thead);color:#fff}
section.alt table.compat thead th{background:var(--thead)}
[data-theme="dark"] section.alt table.compat thead th{background:var(--thead)}
/* alternating row bg */
table.compat tbody tr:nth-child(even){background:var(--canvas)}
[data-theme="dark"] table.compat tbody tr:nth-child(even){background:rgba(255,255,255,.02)}
section.alt table.compat tbody tr:nth-child(even){background:var(--surface)}
[data-theme="dark"] section.alt table.compat tbody tr:nth-child(even){background:rgba(255,255,255,.02)}
/* soft dividers between all columns */
table.compat td:not(:last-child),table.compat th:not(:last-child){border-right:1px solid var(--border)}
table.compat tbody tr:last-child td{border-bottom:none}
table.compat .pf{font-family:var(--fh);font-weight:600;color:var(--ink);white-space:nowrap}
table.compat td .note{color:var(--muted);font-size:14px;display:block;margin-top:4px}
.yes{color:var(--mint-ink);font-weight:600}
.no{color:#D6455D;font-weight:600}
[data-theme="dark"] .no{color:#FF7A8F}
.warn{color:#C77A15;font-weight:600}
[data-theme="dark"] .warn{color:#F0A94B}
/* platform logo in moat table first column */
.plat{display:flex;align-items:center;gap:9px}
.plat svg{width:18px;height:18px;flex-shrink:0}
/* header-column list table (no header row; first col is the dark label) */
table.listtbl{width:100%;border-collapse:collapse;font-size:15px}
table.listtbl td{padding:13px 18px;border-bottom:1px solid var(--border);vertical-align:top}
table.listtbl tbody tr:last-child td{border-bottom:none}
table.listtbl td:first-child{font-family:var(--fh);font-weight:600;color:#fff;background:var(--thead);width:180px;white-space:nowrap;border-right:1px solid var(--border)}
[data-theme="dark"] table.listtbl td:first-child{background:var(--thead);color:#fff}
table.listtbl td:last-child{color:var(--ink-soft);line-height:1.55}
table.listtbl td:last-child b{color:var(--violet-ink)}
table.listtbl tbody tr:nth-child(even) td:not(:first-child){background:var(--canvas)}
[data-theme="dark"] table.listtbl tbody tr:nth-child(even) td:not(:first-child){background:rgba(255,255,255,.02)}
section.alt table.listtbl tbody tr:nth-child(even) td:not(:first-child){background:var(--surface)}
[data-theme="dark"] section.alt table.listtbl tbody tr:nth-child(even) td:not(:first-child){background:rgba(255,255,255,.02)}
/* alpha = 3-column alphabet table: styled header row + column dividers */
table.listtbl.alpha thead th{font-family:var(--fh);font-size:12.5px;font-weight:700;color:#fff;background:var(--thead);text-transform:uppercase;letter-spacing:.5px;padding:13px 18px;text-align:left;border-bottom:1px solid rgba(255,255,255,.22)}
table.listtbl.alpha thead th:first-child{width:180px}
table.listtbl.alpha thead th:not(:last-child){border-right:1px solid rgba(255,255,255,.22)}
table.listtbl.alpha td:not(:first-child):not(:last-child){border-right:1px solid var(--border)}
table.listtbl.alpha td:not(:first-child){font-size:20px;color:var(--ink);white-space:nowrap}
table.listtbl.alpha td:first-child{border-bottom:1px solid rgba(255,255,255,.14)}
table.listtbl.alpha tbody tr:last-child td:first-child{border-bottom:none}
.listwrap{margin:22px 0 8px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface)}
/* .tablewrap wraps the compatibility tables. It was used in the markup but
   never defined, so those tables rendered with no outer border or rounded
   corners while .listwrap tables did. Same treatment, plus horizontal scroll
   so wide compat tables stay usable on small screens. */
.tablewrap{margin:22px 0 8px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface)}
section.alt .tablewrap{background:var(--canvas)}
[data-theme="dark"] section.alt .tablewrap{background:var(--surface)}
@media(max-width:720px){ .tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch} }
section.alt .listwrap{background:var(--canvas)}
[data-theme="dark"] section.alt .listwrap{background:var(--surface)}

/* USE-CASE LIST */
.uc{background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:6px 20px;margin:22px 0 8px}
section.alt .uc{background:var(--canvas)}
[data-theme="dark"] section.alt .uc{background:var(--surface)}
.uc .r{display:flex;gap:16px;padding:15px 0;border-bottom:1px solid var(--border);align-items:baseline}
.uc .r:last-child{border-bottom:none}
.uc .q{font-family:var(--fh);font-weight:600;color:var(--ink);font-size:15px;width:190px;flex-shrink:0}
.uc .a{font-size:15px;color:var(--ink-soft);line-height:1.55}
.uc .a b{color:var(--violet-ink)}

/* TIPS */
.tips{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0 8px}
.tip{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 18px}
section.alt .tip{background:var(--canvas)}
[data-theme="dark"] section.alt .tip{background:var(--surface)}
.tip h3{font-size:18px;margin-bottom:5px;display:flex;align-items:center;gap:8px}
.tip h3 .d{width:7px;height:7px;border-radius:50%;background:var(--violet);flex-shrink:0}
.tip p{font-size:14.5px;color:var(--muted);margin:0;line-height:1.55}

/* TESTED BOX */
.tested{background:linear-gradient(150deg,var(--violet-tint),var(--surface));border:1px solid var(--border);border-radius:16px;padding:26px 28px;margin:22px 0 8px}
.tested h3{color:var(--ink);font-size:18px;margin-bottom:10px;display:flex;align-items:center;gap:9px}
.tested h3 svg{width:21px;height:21px;color:var(--violet)}
.tested p{font-size:15.5px;color:var(--ink-soft);line-height:1.7;margin-bottom:12px}
.tested p:last-child{margin-bottom:0}

/* FAQ */
.faq{margin:22px 0 8px;display:flex;flex-direction:column;gap:10px}
.qa{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}
section.alt .qa{background:var(--canvas)}
[data-theme="dark"] section.alt .qa{background:var(--surface)}
.qa summary{font-family:var(--fh);font-weight:600;color:var(--ink);font-size:15.5px;padding:16px 46px 16px 18px;cursor:pointer;position:relative;list-style:none}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:21px;color:var(--violet);font-weight:400}
.qa[open] summary::after{content:"–"}
.qa summary:hover{color:var(--violet)}
.qa .ans{padding:0 18px 17px;font-size:15px;color:var(--ink-soft);line-height:1.65}

/* CLOSING */
.close{background:linear-gradient(135deg,#1a1550 0%,#2d1b6b 45%,#6D4AFF 130%);border-radius:18px;padding:42px 30px;text-align:center;position:relative;overflow:hidden}
.close::before{content:"";position:absolute;top:-40%;right:-10%;width:340px;height:340px;background:radial-gradient(circle,rgba(138,107,255,.4),transparent 70%);pointer-events:none}
[data-theme="dark"] .close{background:linear-gradient(135deg,#15123a 0%,#241a52 45%,#4B32C3 130%);border:1px solid var(--border)}
.close h2{color:#fff;margin-bottom:10px;position:relative}
[data-theme="dark"] .close h2{color:#fff}
.close p{color:#D6D2F0;max-width:580px;margin:0 auto 22px;font-size:15.5px;position:relative}
[data-theme="dark"] .close p{color:#C9C6E6}
.close .b{display:inline-block;background:#fff;color:var(--violet-ink);font-family:var(--fh);font-weight:700;font-size:15px;padding:13px 30px;border-radius:11px;cursor:pointer;position:relative;box-shadow:0 6px 20px rgba(0,0,0,.2)}
.close .b:hover{background:#F3F0FF;text-decoration:none;transform:translateY(-1px)}

/* FOOTER */
footer{background:var(--surface);border-top:1px solid var(--border);padding:44px 0 26px;margin-top:0}
[data-theme="dark"] footer{background:#10121F}
.fg{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:28px}
.fc h4{font-family:var(--fh);font-size:14px;font-weight:600;color:var(--ink);margin-bottom:14px}
.fc a{display:block;font-size:14px;color:var(--muted);margin-bottom:10px;cursor:pointer}
.fc a:hover{color:var(--violet)}
.fc.brand .logo{display:inline-flex}
.fc p{font-size:14px;color:var(--muted);margin-top:4px;line-height:1.6;max-width:300px}
.fb{border-top:1px solid var(--border);padding-top:20px;display:flex;justify-content:space-between;font-size:13px;color:var(--muted);flex-wrap:wrap;gap:8px}


/* CONTACT FORM */
.cform{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:26px;box-shadow:0 4px 22px rgba(18,20,43,.06)}
[data-theme="dark"] .cform{box-shadow:0 4px 22px rgba(0,0,0,.28)}
.cform .crow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:620px){.cform .crow{grid-template-columns:1fr}}
.cfield{display:block;margin-bottom:16px}
.cfield label{display:block;font-family:var(--fh);font-weight:600;font-size:13.5px;color:var(--ink);margin-bottom:7px}
.cfield .req{color:var(--violet);margin-left:2px}
.cfield input,.cfield select,.cfield textarea{width:100%;font-family:var(--fb);font-size:15px;color:var(--ink);line-height:1.5;background:var(--canvas);border:1.5px solid var(--border);border-radius:10px;padding:12px 14px;outline:none;transition:border-color .18s,box-shadow .18s}
.cfield textarea{min-height:140px;resize:vertical}
.cfield input:focus,.cfield select:focus,.cfield textarea:focus{border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-tint)}
.cfield input::placeholder,.cfield textarea::placeholder{color:var(--muted)}
.cbtn{display:inline-block;background:var(--violet);color:#fff;font-family:var(--fh);font-weight:700;font-size:15px;padding:13px 30px;border:none;border-radius:11px;cursor:pointer;transition:background .18s,transform .12s}
.cbtn:hover{background:var(--violet-ink)}
.cbtn:active{transform:translateY(1px)}
.cnote{font-size:13px;color:var(--muted);margin-top:12px;line-height:1.6}
.emailbox{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--violet-tint);border:1px solid var(--border);border-radius:12px;padding:18px 20px;margin:18px 0 6px}
.emailbox .ea{font-family:var(--fh);font-weight:700;font-size:19px;color:var(--violet-ink);text-decoration:none;word-break:break-all}
.emailbox .ecopy{display:inline-flex;align-items:center;gap:7px;background:var(--surface);border:1.5px solid var(--violet);color:var(--violet-ink);font-family:var(--fb);font-weight:600;font-size:13.5px;line-height:1;padding:11px 18px;border-radius:9px;cursor:pointer;white-space:nowrap;width:auto;height:auto;flex-shrink:0;transition:background .18s,color .18s,border-color .18s}
.emailbox .ecopy:hover{background:var(--violet);color:#fff;border-color:var(--violet)}
.emailbox .ecopy.done{background:var(--mint-tint);border-color:var(--mint);color:var(--mint-ink)}
[data-theme="dark"] .emailbox .ecopy:hover{color:var(--canvas)}


/* POLICY PAGES — narrow reading column (matches .tool width) */
.polywrap{max-width:900px;margin:0 auto;padding:0 24px}
.polyhero{padding:34px 0 6px;border-bottom:1px solid var(--border);margin-bottom:30px}
.polyhero h1{margin-bottom:10px}
.polyupd{display:inline-block;background:var(--violet-tint);color:var(--violet-ink);font-family:var(--fb);font-weight:600;font-size:12.5px;letter-spacing:.2px;padding:6px 13px;border-radius:20px;margin-bottom:16px}
.polyintro{font-size:16.5px;line-height:1.7;color:var(--ink-soft)}
.polyintro strong{color:var(--ink)}
.poly{padding-bottom:70px}
.poly h2{font-size:23px;margin:44px 0 12px;scroll-margin-top:90px}
.poly h3{font-size:17.5px;margin:26px 0 8px}
.poly p{font-size:15.5px;line-height:1.75;margin-bottom:14px;color:var(--ink-soft)}
.poly li{font-size:15.5px;line-height:1.75;color:var(--ink-soft);margin-bottom:9px}
.poly ul{padding-left:22px;margin:0 0 16px}
.poly a{color:var(--violet-ink);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
[data-theme="dark"] .poly a{color:var(--violet-ink)}
.poly strong{color:var(--ink)}
/* table of contents */
.toc{background:var(--canvas);border:1px solid var(--border);border-radius:12px;padding:22px 26px;margin:26px 0 8px}
.toc .tt{font-family:var(--fh);font-weight:700;font-size:14px;color:var(--ink);margin-bottom:12px}
.toc ol{margin:0;padding-left:20px}
.toc li{margin-bottom:7px;font-size:14.5px}
.toc a{color:var(--violet-ink);text-decoration:none}
.toc a:hover{text-decoration:underline}
/* plain-terms highlight box */
.plain{background:var(--violet-tint);border-left:3px solid var(--violet);border-radius:0 10px 10px 0;padding:18px 22px;margin:20px 0}
.plain .pt{font-family:var(--fh);font-weight:700;font-size:13px;letter-spacing:.5px;text-transform:uppercase;color:var(--violet-ink);margin-bottom:7px}
.plain p{margin-bottom:0;color:var(--ink-soft)}
/* legal note */
.legalnote{background:var(--canvas);border:1px solid var(--border);border-radius:10px;padding:16px 20px;margin-top:34px;font-size:13.5px;line-height:1.7;color:var(--muted)}


/* ===== BLOG ===== */
.blogwrap{max-width:1200px;margin:0 auto;padding:0 24px}
.chips{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-bottom:36px}
.chip{font-family:var(--fb);font-size:13.5px;font-weight:500;padding:8px 17px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);cursor:pointer;transition:.18s;white-space:nowrap}
.chip:hover{border-color:var(--violet);color:var(--violet-ink)}
.chip.on{background:var(--violet);color:#fff;border-color:var(--violet)}
[data-theme="dark"] .chip.on{color:var(--canvas)}
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:900px){.bgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.bgrid{grid-template-columns:1fr}}
.pcard{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s;min-width:0}
.pcard:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(18,20,43,.10);border-color:var(--violet)}
[data-theme="dark"] .pcard:hover{box-shadow:0 14px 34px rgba(0,0,0,.34)}
.pthumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--canvas)}
.pthumb svg{width:100%;height:100%;display:block}
.ppill{position:absolute;left:11px;top:11px;background:rgba(18,20,43,.86);color:#fff;font-family:var(--fb);font-size:10.5px;font-weight:600;letter-spacing:.3px;padding:5px 10px;border-radius:999px}
.pbody{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1}
.pmeta{display:flex;gap:13px;font-size:12.5px;color:var(--muted);margin-bottom:9px}
.pcard h3,.pcard h2{font-family:var(--fh);font-size:17.5px;line-height:1.32;color:var(--ink);margin-bottom:8px}
.pcard .pex{font-size:14px;color:var(--muted);line-height:1.6;flex:1}
.pcard .pmore{margin-top:14px;font-size:13.5px;font-weight:600;color:var(--violet-ink)}
/* pagination */
.pag{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:42px;flex-wrap:wrap}
.pag a,.pag span{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);font-size:14px;font-weight:500;cursor:pointer}
.pag a:hover{border-color:var(--violet);color:var(--violet-ink)}
.pag .cur{background:var(--violet);color:#fff;border-color:var(--violet)}
[data-theme="dark"] .pag .cur{color:var(--canvas)}
.pag .off{opacity:.4;pointer-events:none}
.bempty{text-align:center;padding:52px 20px;color:var(--muted);grid-column:1/-1}
.bempty h3{font-family:var(--fh);font-size:20px;color:var(--ink);margin-bottom:8px}
/* archive header */
.archead{background:var(--ink);padding:46px 0 40px;text-align:center;margin-bottom:44px}
[data-theme="dark"] .archead{background:var(--surface);border-bottom:1px solid var(--border)}
.archead .eyebrow{color:var(--violet-tint);justify-content:center}
[data-theme="dark"] .archead .eyebrow{color:var(--violet-ink)}
.archead h1{color:#fff;font-size:clamp(25px,3.6vw,36px);margin:6px 0 0}
[data-theme="dark"] .archead h1{color:var(--ink)}
.archead .acount{margin-top:11px;font-size:14px;color:#B9B6D6}
[data-theme="dark"] .archead .acount{color:var(--muted)}
.archead .abc{font-size:13px;color:#B9B6D6;margin-bottom:12px}
.archead .abc a{color:var(--violet-tint);cursor:pointer}
[data-theme="dark"] .archead .abc{color:var(--muted)}
[data-theme="dark"] .archead .abc a{color:var(--violet-ink)}
/* single post */
.postwrap{max-width:820px;margin:0 auto;padding:0 24px}
.pohero{padding-top:30px}
.pohero .pobc{font-size:13px;color:var(--muted);margin-bottom:14px}
.pohero .pobc a{color:var(--violet-ink);cursor:pointer}
.pocat{display:inline-block;background:var(--violet-tint);color:var(--violet-ink);font-family:var(--fb);font-size:11.5px;font-weight:700;letter-spacing:.3px;padding:5px 12px;border-radius:999px;margin-bottom:13px;cursor:pointer}
.pohero h1{font-size:clamp(26px,3.8vw,37px);line-height:1.22;margin-bottom:14px}
.pohero .pometa{display:flex;gap:15px;font-size:13.5px;color:var(--muted);flex-wrap:wrap}
.pofeat{max-width:820px;margin:26px auto 0;padding:0 24px}
.pofeat svg{width:100%;height:auto;border-radius:14px;border:1px solid var(--border);display:block}
.poart{max-width:820px;margin:34px auto 0;padding:0 24px}
.poart p{margin-bottom:16px;color:var(--ink-soft);font-size:16.5px;line-height:1.78}
.poart h2{font-size:25px;margin:34px 0 12px}
.poart h3{font-size:19px;margin:26px 0 8px}
.poart ul{margin:0 0 17px;padding-left:22px}
.poart li{margin-bottom:9px;color:var(--ink-soft);font-size:16px;line-height:1.75}
.poart blockquote{border-left:3px solid var(--violet);padding:10px 20px;margin:22px 0;font-style:italic;color:var(--ink-soft);background:var(--violet-tint);border-radius:0 10px 10px 0}
.poart blockquote p{margin-bottom:0}
.wipnote{background:var(--canvas);border:1px dashed var(--border);border-radius:10px;padding:15px 18px;font-size:13.5px;color:var(--muted);line-height:1.65;margin-bottom:22px}
.tagrow{display:flex;gap:9px;flex-wrap:wrap;max-width:820px;margin:30px auto 0;padding:0 24px;align-items:center}
.tagrow .tlab{font-size:13px;color:var(--muted)}
.tagrow a{font-size:12.5px;padding:6px 13px;border-radius:999px;background:var(--canvas);border:1px solid var(--border);color:var(--ink-soft);cursor:pointer;transition:.18s}
.tagrow a:hover{border-color:var(--violet);color:var(--violet-ink)}
.poback{max-width:820px;margin:32px auto 0;padding:0 24px}
.poback a{font-size:14px;color:var(--violet-ink);font-weight:600;cursor:pointer}
.related{max-width:1200px;margin:56px auto 0;padding:0 24px}
.related h2{font-size:23px;text-align:center;margin-bottom:24px}

.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:11px 22px;border-radius:10px;font-size:14px;font-weight:500;opacity:0;pointer-events:none;transition:.25s;z-index:300;display:flex;align-items:center;gap:8px}
[data-theme="dark"] .toast{background:var(--surface);border:1px solid var(--border);color:var(--ink)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast svg{width:15px;height:15px;color:var(--mint)}

/* STUB PAGE */
.stub{max-width:820px;margin:0 auto;padding:20px 0}
.stub .bc{font-size:13px;color:var(--muted);margin-bottom:18px}
.stub .bc a{cursor:pointer}
.stub h1{margin-bottom:12px}
.stub .sd{font-size:17px;color:var(--muted);max-width:680px;line-height:1.55;margin-bottom:26px}
.stubnote{background:var(--violet-tint);border:1px dashed var(--violet);border-radius:14px;padding:20px 22px;margin-bottom:26px}
.stubnote .t{font-family:var(--fh);font-weight:600;color:var(--violet-ink);margin-bottom:6px;font-size:15px;display:flex;align-items:center;gap:8px}
.stubnote p{font-size:14.5px;color:var(--ink-soft);line-height:1.6;margin:0}
.stubnote code{background:var(--surface);padding:2px 7px;border-radius:5px;font-size:13px;color:var(--violet-ink)}
.sibs{margin-top:10px}
.sibs .h{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:12px}
.sibgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

/* RESPONSIVE */
@media(max-width:900px){
 #nav,#tg{display:none}
 .mctrl{display:flex}
 .tgrid{grid-template-columns:repeat(2,1fr)}
 .cgrid{grid-template-columns:repeat(2,1fr)}
 .fg{grid-template-columns:1fr 1fr 1fr;gap:28px}
 .fc.brand{grid-column:1/-1;margin-bottom:4px}
 .split,.split.rev{grid-template-columns:1fr;gap:20px}
 .split.rev .txt{order:0}
 .sibgrid{grid-template-columns:1fr 1fr}
 table.listtbl.alpha thead th{text-align:center}
 table.listtbl.alpha thead th:first-child{text-align:left}
 table.listtbl.alpha td:not(:first-child){text-align:center}
}
@media(max-width:720px){
 h1{font-size:30px}
 h2{font-size:23px}
 .hero{padding:38px 0 22px}
 section.blk{padding:44px 0}
 .steps{grid-template-columns:1fr}
 .feats{grid-template-columns:1fr}
 .tips{grid-template-columns:1fr}
 .keyrow{flex-direction:column}
 .uc .r{flex-direction:column;gap:4px}
 .uc .q{width:auto}
 table.listtbl:not(.alpha) td:first-child{width:auto;display:block;border-right:none;border-bottom:none;padding:11px 18px}
 table.listtbl:not(.alpha) td:last-child{display:block;padding:12px 18px}
 table.listtbl:not(.alpha) tbody tr:nth-child(even) td:not(:first-child){background:transparent}
 table.listtbl.alpha{font-size:13px}
 table.listtbl.alpha thead th{padding:10px 10px;text-align:center}
 table.listtbl.alpha thead th:first-child{text-align:left;width:76px}
 table.listtbl.alpha td{padding:10px 10px}
 table.listtbl.alpha td:first-child{width:76px;font-size:13px}
 table.listtbl.alpha td:not(:first-child){font-size:17px;text-align:center}
 table.compat{font-size:13.5px}
 .plat svg{width:15px;height:15px}
 .tool{padding:15px}
 .row .tag{display:none}
 table.compat{font-size:13px}
 table.compat th,table.compat td{padding:10px 12px}
 .close{padding:28px 20px}
 .tested{padding:20px}
 .sibgrid{grid-template-columns:1fr}
 .fg{grid-template-columns:1fr 1fr;gap:24px 28px}
 .fc.brand{grid-column:1/-1}
 .fb{flex-direction:column;gap:6px}
}
@media(max-width:480px){
 .tgrid{grid-template-columns:1fr 1fr}
 .cgrid{grid-template-columns:1fr}
 .db{font-size:12px}
 .wrap,.hdr{padding-left:16px;padding-right:16px}
 .fg{grid-template-columns:1fr;gap:22px}
 .fc p{max-width:none}
}

/* nav links: never underline */
.nb,.nb:hover,.nb:focus,a.logo,a.logo:hover{text-decoration:none}

/* sticky: header only */
/* The announcement bar scrolls away; only the main header sticks. */
.db{position:static;top:auto}
header{top:0}

/* --- unicode output font fixes --- */
table.listtbl.alpha td:not(:first-child){font-family:var(--fo)}
.poart .demo{font-family:var(--fo);color:var(--violet-ink);background:var(--violet-tint);padding:1px 7px;border-radius:5px}

/* --- blog figure + warn box --- */
.pofig{margin:26px 0;text-align:center}
.pofig img{width:100%;height:auto;border-radius:12px;border:1px solid var(--border);display:block}
.pocap{display:block;margin-top:9px;font-size:13.5px;color:var(--muted);line-height:1.5}
.warn-box{background:var(--surface);border:1px solid var(--border);border-left:4px solid #E0A030;border-radius:0 12px 12px 0;padding:16px 19px;margin:22px 0}
.warn-box p{margin:0;font-size:15px;color:var(--ink-soft)}
.poart .steps{grid-template-columns:1fr;gap:12px}
.poart .step{display:flex;gap:14px;align-items:flex-start}
.poart .step .sn{flex-shrink:0}
.poart .step div.sc{flex:1}
.poart code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;background:var(--violet-tint);color:var(--violet-ink);padding:2px 6px;border-radius:5px}


/* BLOG IMAGES + FIXES */
table.listtbl.alpha td:not(:first-child){font-family:var(--fo)}
.poart .demo{font-family:var(--fo);color:var(--violet-ink);background:var(--violet-tint);padding:1px 7px;border-radius:5px}
.pofeat img{width:100%;height:auto;border-radius:14px;border:1px solid var(--border);display:block}
.poimg{margin:28px 0;padding:0}
.poimg img{width:100%;height:auto;border-radius:12px;border:1px solid var(--border);display:block}
.poimg figcaption{margin-top:10px;font-size:14px;line-height:1.55;color:var(--muted);text-align:center}
.pthumb img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover}
.warn-box{background:var(--violet-tint);border-left:3px solid var(--violet);border-radius:8px;padding:16px 20px;margin:24px 0}
.warn-box p{margin:0;color:var(--ink-soft)}

/* Cookie consent. The Cookie Policy promises consent is asked BEFORE
   non-essential cookies are set, and that the choice can be changed at any
   time from the Site. This bar plus the footer link deliver both. It is
   fixed-position, so it never shifts content and CLS stays 0. */
.cbar{position:fixed;left:0;right:0;bottom:0;z-index:9000;display:none;background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -6px 26px rgba(18,20,43,.13)}
.cbar.show{display:block}
.cbar .in{max-width:var(--max);margin:0 auto;padding:13px 24px;display:flex;align-items:center;gap:16px;flex-wrap:nowrap}
.cbar p{margin:0;flex:1 1 auto;min-width:0;font-size:13.5px;line-height:1.5;color:var(--ink-soft)}
.cbar a{color:var(--violet-ink);text-decoration:underline}
.cbar .btns{display:flex;gap:10px;flex-shrink:0}
.cbar button{font-family:inherit;font-size:13.5px;font-weight:600;cursor:pointer;padding:10px 18px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--ink);transition:.15s}
.cbar button:hover{border-color:var(--violet)}
.cbar button.pri{background:var(--violet);border-color:var(--violet);color:#fff}
.cbar button.pri:hover{background:var(--violet-ink);border-color:var(--violet-ink)}
@media(max-width:720px){.cbar .in{padding:14px 16px;gap:12px}.cbar .btns{width:100%}.cbar .btns button{flex:1}}

/* GDPR/ePrivacy: refusing must be as easy and as prominent as accepting, so
   both buttons share one size class and only the fill differs. */
.cbar button.eq{min-width:118px;text-align:center}
.cbar button.eq:not(.pri){border-color:var(--violet);color:var(--violet-ink)}
.cbar button.eq:not(.pri):hover{background:var(--violet-tint)}
.cbar button:focus-visible{outline:2px solid var(--violet);outline-offset:2px}
@media(max-width:860px){.cbar .in{flex-wrap:wrap;gap:12px}}

/* Contact form result. Empty by default so it takes no space until used. */
.cstatus{margin:10px 0 0;font-size:14px;line-height:1.5;min-height:0}
.cstatus:empty{display:none}
.cstatus.good{color:var(--mint-ink)}
.cstatus.bad{color:#B91C1C}
[data-theme="dark"] .cstatus.bad{color:#F09595}
.cbtn[disabled]{opacity:.6;cursor:default}