﻿/* Tool detail pages — layout inspired by tool-directory product pages, built with Atlas tokens.
   Typography pass: 16–17px body, 1.7 line height, WCAG AA body contrast on the dark canvas. */
.tool-main{max-width:1360px;margin:0 auto;padding:0 48px 80px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:22px 0 0;font-size:12.5px;color:#a99cb8}
.crumbs a{color:#c0b0d2}
.crumbs a:hover{color:#c3aeff}
.crumbs span[aria-current]{color:#e4dcef}
.crumbs .crumb-sep{color:#6a6078}

/* ---------- Hero ---------- */
.tool-hero{display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:48px;align-items:start;padding:32px 0 44px;border-bottom:1px solid #2a2433;margin-bottom:0}
.tool-hero h1{margin:16px 0 14px;font-size:52px;line-height:1.06;letter-spacing:-1.8px;font-weight:700}
.tool-hero h1 .rank-dot{color:var(--purple)}
.tool-tagline{margin:0;font-size:18px;line-height:1.55;color:#d9d3e4;max-width:36em}
.tool-chips{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
.tool-chip{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#d3c3e6;background:#241c31;border:1px solid #443552;border-radius:999px;padding:6px 11px}
.tool-chip.is-rank{color:#161021;background:var(--green);border-color:var(--green);font-weight:700}
.tool-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:28px 0 0;padding:20px 0 0;border-top:1px dashed #372e44;max-width:660px}
.tool-meta div{min-width:0}
.tool-meta dt{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:#a99cb8;margin:0 0 6px}
.tool-meta dd{margin:0;font-size:14.5px;color:#f1ecf9;font-weight:600;line-height:1.45;overflow-wrap:anywhere}
.tool-meta dd a{color:#e2d3f6;text-decoration:underline;text-decoration-color:#6b5589;text-underline-offset:3px}
.tool-meta dd a:hover{color:#fff}
.tool-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btn-primary,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:13px 22px;border-radius:10px;font-size:14px;font-weight:600;border:1px solid transparent;transition:background .2s,border-color .2s,transform .2s}
.btn-primary{background:var(--purple);color:#191223;box-shadow:0 6px 18px #5b2f8f33}
.btn-primary:hover{background:#c3aeff;color:#191223;transform:translateY(-1px)}
.btn-ghost{border-color:#4b3b5f;color:#e2d8ee;background:#1c1726}
.btn-ghost:hover{background:#2a2037;border-color:#7a629b;color:#fff}

.tool-hero-card{position:relative;padding:26px;border:1px solid #3d3250;border-radius:16px;background:linear-gradient(160deg,#221a30,#13121c);text-align:center}
.tool-hero-card img{width:92px;height:92px;object-fit:contain;border-radius:18px;background:#2a2434;padding:8px;margin:8px auto 16px;display:block}
.tool-hero-card .hero-rank{position:absolute;top:16px;left:18px;font-size:12px;font-weight:700;letter-spacing:.08em;color:#f0cf8c}
.tool-hero-card .hero-name{display:block;font-size:16px;font-weight:600;color:#f5f1fb}
.tool-hero-card .hero-sub{display:block;margin-top:6px;font-size:12.5px;color:#b3a6c2}
.tool-hero-card dl{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin:22px 0 0;text-align:left}
.tool-hero-card dt{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:#a497b3}
.tool-hero-card dd{margin:3px 0 0;font-size:12.5px;color:#ece5f5;line-height:1.45;overflow-wrap:anywhere}
.tool-hero-card .hero-status{display:inline-flex;align-items:center;gap:6px;color:#f6d9a6}
.tool-hero-card .hero-status i{width:6px;height:6px;border-radius:50%;background:#f0b45f;display:inline-block;font-style:normal}
.tool-hero-card .hero-note{margin:18px 0 0;padding-top:16px;border-top:1px solid #332a42;font-size:12px;line-height:1.6;color:#b3a6c2}

/* ---------- Layout + table of contents ---------- */
.tool-layout{display:grid;grid-template-columns:224px minmax(0,1fr);gap:56px;align-items:start;padding-top:38px}
.tool-side{position:sticky;top:108px;align-self:start;max-height:calc(100vh - 132px);overflow:auto}
.toc-title{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#a99cb8;margin:0 0 12px}
.toc{list-style:none;margin:0 0 24px;padding:0;border-left:1px solid #362d44}
.toc a{display:block;padding:9px 0 9px 15px;margin-left:-1px;border-left:2px solid transparent;font-size:14px;line-height:1.4;color:#b3a6c2;transition:color .15s,background .15s,border-color .15s}
.toc a:hover{color:#eee6fb}
.toc a[aria-current="true"]{color:#f0e7ff;border-left-color:var(--purple);background:linear-gradient(90deg,#2a2038,transparent);font-weight:600}
.toc a:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:4px}
.side-card{padding:16px;border:1px solid #362d44;border-radius:11px;background:#171320;margin-bottom:12px}
.side-card span{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:#a99cb8;margin-bottom:7px}
.side-card a{font-size:13px;color:#d9c3f7;overflow-wrap:anywhere}
.side-card p{margin:0;font-size:12.5px;line-height:1.6;color:#b3a6c2}
.toc-mobile{display:none;margin:0 0 18px;border:1px solid #362d44;border-radius:11px;background:#171320;padding:0 16px}
.toc-mobile summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;font-size:14px;font-weight:600;color:#eee6fb}
.toc-mobile summary::-webkit-details-marker{display:none}
.toc-mobile summary::after{content:"▾";color:var(--purple);font-size:12px}
.toc-mobile[open] summary::after{content:"▴"}
.toc-mobile .toc{border-left:0;margin:0 0 6px}
.toc-mobile .toc a{padding-left:4px;border-left:0}
.toc-mobile .toc a[aria-current="true"]{background:none;color:#d9c3f7}

/* ---------- Article ---------- */
.tool-article{min-width:0}
.tool-section{margin-bottom:56px;scroll-margin-top:116px}
.tool-section:focus,.tool-section:focus-visible{outline:none}
.tool-section>h2{margin:0 0 8px;font-size:27px;line-height:1.28;letter-spacing:-.6px}
.tool-section>h2 span{color:var(--purple)}
.tool-section>.section-kicker{margin:0 0 20px;font-size:13.5px;line-height:1.6;color:#a99cb8}
.tool-section p{margin:0 0 16px;font-size:16.5px;line-height:1.72;color:#d3ccdf;max-width:70ch}
.tool-section p:last-child{margin-bottom:0}
.tool-section a{color:#c9b1ec;text-decoration:underline;text-underline-offset:2px}
.tool-section a:hover{color:#e6d8ff}

/* ---------- Quick verdict ---------- */
.verdict{border:1px solid #443552;border-radius:16px;background:linear-gradient(155deg,#211a2e,#14121c);padding:24px 26px;margin-top:4px}
.verdict-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.verdict-head .verdict-label{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:#cbb8e6;font-weight:600}
.verdict-head .verdict-label i{width:7px;height:7px;border-radius:50%;background:var(--green);font-style:normal;box-shadow:0 0 10px #c5f49a66}
.verdict-badge{font-size:11px;font-weight:600;letter-spacing:.04em;color:#f6d9a6;background:#33260f;border:1px solid #5c451c;border-radius:999px;padding:5px 11px}
.verdict-badge.is-documented{color:#d8cdf0;background:#271f36;border-color:#463457}
.verdict-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.verdict-cell{padding:16px 18px;border:1px solid #372e46;border-radius:12px;background:#171322}
.verdict-cell h3{margin:0 0 9px;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:#c9b6e2;font-weight:600}
.verdict-cell p{margin:0;font-size:15px;line-height:1.65;color:#d8d1e3}
.verdict-cell ul{margin:0;padding:0;list-style:none;display:grid;gap:7px}
.verdict-cell li{position:relative;padding-left:17px;font-size:14.5px;line-height:1.6;color:#d3ccdf}
.verdict-cell li::before{content:"·";position:absolute;left:4px;color:#c9b1ec;font-weight:700}
.verdict-cell.is-caution h3{color:#f3c3a1}
.verdict-cell.is-caution li::before{color:#f3c3a1}
.verdict-status{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:baseline;padding:15px 18px;border:1px dashed #4a3a60;border-radius:12px;background:#141020}
.verdict-status strong{font-size:12.5px;letter-spacing:.04em;color:#f6d9a6}
.verdict-status p{margin:0;flex:1 1 320px;font-size:13.5px;line-height:1.65;color:#b3a6c2}

/* ---------- Feature / step / audience cards ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.feature-card{padding:20px;border:1px solid #362d44;border-radius:12px;background:linear-gradient(150deg,#191423,#14121c)}
.feature-card .feature-icon{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#2b2138;color:var(--green);font-size:13px;margin-bottom:12px}
.feature-card h3{margin:0 0 8px;font-size:15.5px;letter-spacing:-.2px;line-height:1.35}
.feature-card p{margin:0;font-size:14.5px;line-height:1.68;color:#bdb3cc;max-width:none}

.step-list{list-style:none;counter-reset:step;margin:22px 0 0;padding:0;display:grid;gap:12px}
.step-list li{counter-increment:step;display:grid;grid-template-columns:36px minmax(0,1fr);gap:16px;padding:18px 20px;border:1px solid #362d44;border-radius:12px;background:#161220}
.step-list li::before{content:"0" counter(step);font-size:13px;font-weight:700;color:#c9b1ec;letter-spacing:.06em;padding-top:2px}
.step-list h3{margin:0 0 6px;font-size:15.5px}
.step-list p{margin:0;font-size:14.5px;line-height:1.68;color:#bdb3cc;max-width:none}

.audience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}
.audience-card{padding:18px;border:1px solid #362d44;border-radius:12px;background:#161220}
.audience-card strong{display:block;font-size:14.5px;margin-bottom:7px;color:#f0eaf8}
.audience-card p{margin:0;font-size:14px;line-height:1.66;color:#bdb3cc;max-width:none}

/* ---------- Pricing ---------- */
.pricing-flag{display:block;margin:0 0 16px;padding:14px 16px;border:1px solid #5c451c;border-radius:11px;background:#2a1f0d;font-size:13.5px;line-height:1.65;color:#f0d7ab}
.pricing-flag strong{display:block;margin-bottom:3px;color:#ffd79a}
.table-scroll{overflow-x:auto;border:1px solid #362d44;border-radius:12px;background:#15111d;-webkit-overflow-scrolling:touch}
.table-scroll:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.pricing-table{width:100%;min-width:620px;border-collapse:collapse;font-size:14.5px}
.pricing-table th,.pricing-table td{text-align:left;padding:14px 16px;border-bottom:1px solid #332a42;vertical-align:top;line-height:1.6}
.pricing-table thead th{background:#1d1728;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#c0b0d2;font-weight:600}
.pricing-table tbody tr:last-child td{border-bottom:0}
.pricing-table tbody tr:nth-child(odd){background:#171320}
.pricing-table td:first-child{font-weight:600;color:#f0eaf8;white-space:nowrap}
.pricing-table td:nth-child(2){white-space:nowrap}
.pricing-table td strong{color:#d9c3f7;font-weight:600}
.plan-audience{display:block;margin-top:6px;font-size:12.5px;color:#b3a6c2}
.plan-quota{display:block;margin-top:6px;font-size:12.5px;color:#b3a6c2}
.pricing-meta{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline;margin:14px 0 0;font-size:12.5px;color:#a99cb8}
.pricing-meta a{color:#c9b1ec;text-decoration:underline;text-underline-offset:2px}
.pricing-note{margin:12px 0 0;font-size:12.5px;line-height:1.7;color:#a99cb8;max-width:78ch}
.table-hint{display:none;margin:10px 0 0;font-size:12px;color:#a99cb8}
.table-scroll.is-scrollable + .table-hint{display:block}
.pricing-unit{margin:14px 0 0;padding:12px 16px;border:1px solid #3d3250;border-radius:11px;background:#1b1526;font-size:13.5px;line-height:1.65;color:#d8cff0}

/* ---------- Pros & cons ---------- */
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}
.pros-cons section{padding:20px;border:1px solid #362d44;border-radius:12px;background:#161220}
.pros-cons h3{margin:0 0 12px;font-size:11.5px;text-transform:uppercase;letter-spacing:.08em}
.pros-cons .is-pro h3{color:#c9e9a8}
.pros-cons .is-con h3{color:#f6bccb}
.pros-cons ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.pros-cons li{position:relative;padding-left:19px;font-size:14.5px;line-height:1.66;color:#cfc7db}
.pros-cons .is-pro li::before{content:"+";position:absolute;left:0;color:#c9e9a8;font-weight:700}
.pros-cons .is-con li::before{content:"–";position:absolute;left:0;color:#f6bccb;font-weight:700}

/* ---------- Alternatives ---------- */
.alt-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px;list-style:none;padding:0}
.alt-list a{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid #362d44;border-radius:12px;background:#161220;transition:border-color .2s,background .2s,transform .2s}
.alt-list a:hover{background:#221a2f;border-color:#7a629b;transform:translateY(-2px)}
.alt-list span{font-size:14px;font-weight:600;color:#f0eaf8}
.alt-list small{font-size:12.5px;line-height:1.6;color:#b3a6c2}
.alt-list i{font-style:normal;font-size:10.5px;color:#a99cb8;letter-spacing:.05em}

/* ---------- Real examples / user experiences (optional modules) ---------- */
.example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.example-card{margin:0;border:1px solid #362d44;border-radius:12px;overflow:hidden;background:#161220}
.example-card img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top left;background:#221a2e}
.example-grid.is-single{grid-template-columns:1fr}
.example-grid.is-single .example-card img{aspect-ratio:16/9}
.example-card figcaption{padding:14px 16px;display:grid;gap:6px}
.example-card figcaption strong{font-size:14px;color:#f0eaf8;font-weight:600}
.example-card figcaption span{font-size:12px;line-height:1.6;color:#b3a6c2}
.example-card figcaption a{font-size:12px;color:#c9b1ec;text-decoration:underline;text-underline-offset:2px}
.experience-list{display:grid;gap:12px;margin-top:22px}
.experience-card{margin:0;padding:20px;border:1px solid #362d44;border-radius:12px;background:#161220}
.experience-card blockquote{margin:0 0 12px;font-size:15px;line-height:1.7;color:#d8d1e3}
.experience-card figcaption{font-size:12.5px;color:#b3a6c2}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:10px;margin-top:22px}
.faq details{border:1px solid #362d44;border-radius:12px;background:#161220;padding:0 20px}
.faq summary{cursor:pointer;padding:17px 0;font-size:15px;font-weight:600;line-height:1.5;color:#f0eaf8;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:#c9b1ec;font-size:18px;font-weight:400;flex:none}
.faq details[open] summary::after{content:"–"}
.faq summary:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:6px}
.faq details p{padding:0 0 18px;margin:0;font-size:14.5px;line-height:1.72;color:#bdb3cc;max-width:70ch}

/* ---------- Sources ---------- */
.source-list{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:10px;counter-reset:src}
.source-list li{counter-increment:src;position:relative;padding-left:28px;font-size:13px;line-height:1.65;color:#b3a6c2;overflow-wrap:anywhere}
.source-list li::before{content:"[" counter(src) "]";position:absolute;left:0;color:#9b8ea9;font-size:11px}
.source-list a{color:#d2bcf2;text-decoration:underline;text-underline-offset:2px}
.source-list a:hover{color:#e9ddff}
.source-meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin:18px 0 0;padding:14px 16px;border:1px solid #332a42;border-radius:11px;background:#15111d;font-size:12.5px;color:#b3a6c2}
.source-meta strong{color:#e4dcef;font-weight:600}
.source-note{margin:14px 0 0;padding:14px 16px;border:1px dashed #4a3a60;border-radius:11px;font-size:12.5px;line-height:1.7;color:#b3a6c2;background:#14111b}

/* ---------- Pager + footnote ---------- */
.rank-pager{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px;padding-top:30px;border-top:1px solid #2a2433}
.rank-pager a{display:flex;flex-direction:column;gap:5px;padding:18px 20px;border:1px solid #362d44;border-radius:12px;background:#161220;transition:border-color .2s,background .2s}
.rank-pager a:hover{background:#221a2f;border-color:#7a629b}
.rank-pager small{font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:#a99cb8}
.rank-pager span{font-size:14px;font-weight:600;color:#f0eaf8}
.rank-pager .is-next{text-align:right;align-items:flex-end}

.tool-footnote{max-width:1360px;margin:0 auto;padding:0 48px 56px;font-size:12px;line-height:1.75;color:#a99cb8}

/* ---------- Responsive: 1024 / 768 / 390 / 320 ---------- */
@media(max-width:1100px){
  .tool-main,.tool-footnote{padding-left:32px;padding-right:32px}
  .tool-hero{grid-template-columns:minmax(0,1fr) 286px;gap:32px}
  .tool-hero h1{font-size:44px;letter-spacing:-1.4px}
  .tool-tagline{font-size:17px}
  .tool-layout{grid-template-columns:190px minmax(0,1fr);gap:36px}
  .tool-section>h2{font-size:25px}
  .audience-grid{grid-template-columns:1fr 1fr}
  .alt-list{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .tool-hero{grid-template-columns:1fr;gap:24px;padding-bottom:36px}
  .tool-hero-card{max-width:420px}
  .tool-layout{grid-template-columns:1fr;gap:26px}
  .tool-side{display:none}
  .toc-mobile{display:block}
  .verdict-grid{grid-template-columns:1fr}
  .pros-cons,.audience-grid,.alt-list,.rank-pager,.example-grid{grid-template-columns:1fr}
  .tool-meta{grid-template-columns:1fr 1fr;gap:16px}
  .pricing-table{min-width:560px}
}
@media(max-width:760px){
  .tool-main,.tool-footnote{padding-left:20px;padding-right:20px}
  .tool-main{padding-bottom:56px}
  .crumbs{font-size:12px;padding-top:18px}
  .tool-hero{padding-top:24px}
  .tool-hero h1{font-size:36px;letter-spacing:-1.2px}
  .tool-tagline{font-size:16px}
  .tool-section{margin-bottom:44px;scroll-margin-top:96px}
  .tool-section>h2{font-size:23px}
  .tool-section p{font-size:16px;line-height:1.7}
  .verdict{padding:20px}
  .verdict-cell{padding:15px 16px}
  .verdict-cell p,.verdict-cell li{font-size:14.5px}
  .feature-card,.step-list li,.audience-card,.pros-cons section{padding:16px}
  .pricing-table{min-width:520px;font-size:14px}
  .pricing-table th,.pricing-table td{padding:12px 13px}
  .rank-pager .is-next{text-align:left;align-items:flex-start}
  .tool-footnote{padding-left:20px;padding-right:20px}
}
@media(max-width:430px){
  .tool-meta{grid-template-columns:1fr}
  .tool-hero h1{font-size:32px}
  .tool-actions .btn-primary,.tool-actions .btn-ghost{width:100%}
  .tool-hero-card{padding:20px}
  .verdict{padding:16px}
  .crumbs{font-size:11.5px}
}
@media(max-width:360px){
  .tool-main,.tool-footnote{padding-left:16px;padding-right:16px}
  .tool-hero h1{font-size:28px;letter-spacing:-.8px}
  .tool-tagline{font-size:15px}
  .tool-section>h2{font-size:21px}
  .tool-section p{font-size:15.5px}
  .tool-chip{font-size:10px;padding:5px 9px}
}
@media(max-width:560px){
  .table-scroll{border:0;background:none;overflow:visible}
  .pricing-table{display:block;min-width:0;font-size:14px}
  .pricing-table thead{display:none}
  .pricing-table tbody{display:block}
  .pricing-table tr{display:block;margin-bottom:10px;padding:4px 0;border:1px solid #362d44;border-radius:12px;background:#161220}
  .pricing-table tbody tr:nth-child(odd){background:#161220}
  .pricing-table td{display:block;border:0;padding:7px 16px}
  .pricing-table td:first-child{white-space:normal;padding-top:13px;font-size:15px}
  .pricing-table td::before{content:attr(data-label);display:block;margin-bottom:3px;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:#a99cb8}
  .pricing-table td:first-child::before{display:none}
  .pricing-table td strong{font-size:14.5px}
  .table-hint{display:none}
}
html[data-theme=light] .pricing-table tr{background:#fff;border-color:var(--border)}
html[data-theme=light] .pricing-table tbody tr:nth-child(odd){background:#fff}@media(prefers-reduced-motion:reduce){
  .btn-primary,.btn-ghost,.alt-list a,.rank-pager a{transition:none;transform:none}
}

/* ---------- Light theme ---------- */
html[data-theme=light] .crumbs{color:#6f617e}
html[data-theme=light] .crumbs a{color:#7a5aa0}
html[data-theme=light] .crumbs span[aria-current]{color:#3a2e48}
html[data-theme=light] .crumbs .crumb-sep{color:#b7a9c6}
html[data-theme=light] .tool-hero{border-color:var(--border)}
html[data-theme=light] .tool-tagline{color:#4f4260}
html[data-theme=light] .tool-chip{background:#f0e8fa;border-color:#dccbea;color:#5f348f}
html[data-theme=light] .tool-chip.is-rank{background:#e2f1d3;border-color:#c3dfa7;color:#3d6a26}
html[data-theme=light] .tool-meta{border-color:#ded3e8}
html[data-theme=light] .tool-meta dt{color:#6d5f7c}
html[data-theme=light] .tool-meta dd{color:#241a30}
html[data-theme=light] .tool-meta dd a{color:#5f348f;text-decoration-color:#bda3d8}
html[data-theme=light] .btn-primary{background:var(--purple);color:#fff;box-shadow:0 6px 18px #5b2f8f26}
html[data-theme=light] .btn-primary:hover{background:#63339f;color:#fff}
html[data-theme=light] .btn-ghost{background:#fff;border-color:#d9cce7;color:#5b456f}
html[data-theme=light] .btn-ghost:hover{background:#f5eefd;border-color:#b795d8;color:#3f2a58}
html[data-theme=light] .tool-hero-card{background:linear-gradient(160deg,#faf6ff,#ffffff);border-color:#ddd0ec;box-shadow:0 10px 30px #46266b0f}
html[data-theme=light] .tool-hero-card img{background:#f2ecfa}
html[data-theme=light] .tool-hero-card .hero-rank{color:#8c6110}
html[data-theme=light] .tool-hero-card .hero-name{color:#241a30}
html[data-theme=light] .tool-hero-card .hero-sub{color:#6d5f7c}
html[data-theme=light] .tool-hero-card dt{color:#6d5f7c}
html[data-theme=light] .tool-hero-card dd{color:#2a2136}
html[data-theme=light] .tool-hero-card .hero-status{color:#8a5a12}
html[data-theme=light] .tool-hero-card .hero-note{color:#6d5f7c;border-color:#e6dced}
html[data-theme=light] .toc{border-color:#e4d9ef}
html[data-theme=light] .toc a{color:#5f5170}
html[data-theme=light] .toc a:hover{color:#4a2c73}
html[data-theme=light] .toc a[aria-current="true"]{color:#4a2c73;background:linear-gradient(90deg,#f1e8fc,transparent)}
html[data-theme=light] .toc-title{color:#6d5f7c}
html[data-theme=light] .toc-mobile{background:#fff;border-color:var(--border)}
html[data-theme=light] .toc-mobile summary{color:#33273f}
html[data-theme=light] .side-card{background:#fff;border-color:var(--border)}
html[data-theme=light] .side-card span{color:#6d5f7c}
html[data-theme=light] .side-card a{color:#5f348f}
html[data-theme=light] .side-card p{color:#5f5170}
html[data-theme=light] .tool-section>h2{color:#241a30}
html[data-theme=light] .tool-section>.section-kicker{color:#6d5f7c}
html[data-theme=light] .tool-section p{color:#443a52}
html[data-theme=light] .tool-section a{color:#5f348f}
html[data-theme=light] .verdict{background:linear-gradient(155deg,#faf6ff,#ffffff);border-color:#ddd0ec}
html[data-theme=light] .verdict-head .verdict-label{color:#5f348f}
html[data-theme=light] .verdict-badge{color:#7a4f0d;background:#fdf3dd;border-color:#e8cf9a}
html[data-theme=light] .verdict-badge.is-documented{color:#4a2c73;background:#f1e8fc;border-color:#d9c6ef}
html[data-theme=light] .verdict-cell{background:#fff;border-color:var(--border)}
html[data-theme=light] .verdict-cell h3{color:#5f348f}
html[data-theme=light] .verdict-cell p,html[data-theme=light] .verdict-cell li{color:#443a52}
html[data-theme=light] .verdict-cell.is-caution h3{color:#8a4a12}
html[data-theme=light] .verdict-cell.is-caution li::before{color:#b5651d}
html[data-theme=light] .verdict-status{background:#faf6ff;border-color:#dccbea}
html[data-theme=light] .verdict-status strong{color:#7a4f0d}
html[data-theme=light] .verdict-status p{color:#5f5170}
html[data-theme=light] .feature-card,html[data-theme=light] .step-list li,html[data-theme=light] .audience-card,html[data-theme=light] .pros-cons section,html[data-theme=light] .alt-list a,html[data-theme=light] .faq details,html[data-theme=light] .rank-pager a,html[data-theme=light] .example-card,html[data-theme=light] .experience-card{background:#fff;border-color:var(--border)}
html[data-theme=light] .feature-card h3,html[data-theme=light] .step-list h3,html[data-theme=light] .audience-card strong,html[data-theme=light] .faq summary,html[data-theme=light] .rank-pager span,html[data-theme=light] .alt-list span,html[data-theme=light] .example-card figcaption strong{color:#2e2339}
html[data-theme=light] .feature-card p,html[data-theme=light] .step-list p,html[data-theme=light] .audience-card p,html[data-theme=light] .pros-cons li,html[data-theme=light] .faq details p,html[data-theme=light] .alt-list small,html[data-theme=light] .example-card figcaption span,html[data-theme=light] .experience-card figcaption,html[data-theme=light] .verdict-cell li{color:#5a4b68}
html[data-theme=light] .experience-card blockquote{color:#443a52}
html[data-theme=light] .table-scroll{background:#fff;border-color:var(--border)}
html[data-theme=light] .pricing-table th,html[data-theme=light] .pricing-table td{border-color:#e6dcef}
html[data-theme=light] .pricing-table thead th{background:#f4eefb;color:#5f5170}
html[data-theme=light] .pricing-table tbody tr:nth-child(odd){background:#fbf9ff}
html[data-theme=light] .pricing-table td:first-child{color:#2c2138}
html[data-theme=light] .pricing-table td strong{color:#5f348f}
html[data-theme=light] .plan-audience,html[data-theme=light] .plan-quota{color:#6d5f7c}
html[data-theme=light] .pricing-flag{background:#fff6e3;border-color:#e8cf9a;color:#7a4f0d}
html[data-theme=light] .pricing-flag strong{color:#8a5a12}
html[data-theme=light] .pricing-meta,html[data-theme=light] .pricing-note,html[data-theme=light] .table-hint{color:#6d5f7c}
html[data-theme=light] .pricing-unit{background:#f6f0ff;border-color:#e0d2f0;color:#4a3560}
html[data-theme=light] .pricing-meta a{color:#5f348f}
html[data-theme=light] .source-list li{color:#5a4b68}
html[data-theme=light] .source-list a{color:#5f348f}
html[data-theme=light] .source-list li::before{color:#8a7c98}
html[data-theme=light] .source-meta{background:#fbf9ff;border-color:var(--border);color:#5f5170}
html[data-theme=light] .source-meta strong{color:#33273f}
html[data-theme=light] .source-note{background:#faf6ff;border-color:#ddcfec;color:#5f5170}
html[data-theme=light] .rank-pager{border-color:var(--border)}
html[data-theme=light] .feature-card .feature-icon{background:#efe5fa;color:#4d7a2f}
html[data-theme=light] .tool-footnote{color:#6d5f7c}
