@font-face{font-family:Bungee;src:url('/fonts/bungee.woff2') format('woff2');font-display:swap}
@font-face{font-family:Inter;src:url('/fonts/inter-var.woff2') format('woff2');font-weight:100 900;font-display:swap}
html:has(.ranking-page){color-scheme:light;scroll-behavior:smooth;scroll-padding-top:24px}
.ranking-page{--ink:#141517;--body:#35383c;--line:#d9dcdf;--mint:#edf9f0;--lavender:#f5efff;--blue:#edf4ff;--cream:#fff7e9;--pink:#fff0f2;--teal:#eaf9f8;margin:0;background:#fff;color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased}
.ranking-page *{box-sizing:border-box}
.ranking-page :is(p,li,dt,dd,td,th,summary,figcaption,small,.reading-button,.reading-jumps a,.reading-sources a,.related-list p){font-family:Inter,system-ui,sans-serif!important}
.ranking-page :is(.direct-answer a,.reading-copy a,.reading-faq p a){font-family:Inter,system-ui,sans-serif!important}
.ranking-page :is(h1,h2,h3,.reading-brand,.related-list> a>span:first-child){font-family:Bungee,system-ui,sans-serif!important;font-weight:400}
.ranking-page :is(h1,h2,h3,p,figure){margin:0}
.ranking-page a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
.ranking-page :is(a,summary):focus-visible{outline:3px solid #7125d3;outline-offset:5px}
.ranking-page ::selection{background:#d9c7f4;color:#141517}
.ranking-page :is(code,kbd){font:500 .9em ui-monospace,SFMono-Regular,Consolas,monospace!important;background:#ffffffb0;border:1px solid #cdd3da;border-radius:5px;padding:2px 5px;overflow-wrap:anywhere}
.ranking-page .skip-content{position:absolute;z-index:100;top:12px;left:12px;transform:translateY(-150%);background:#111;color:#fff;padding:12px 20px;border-radius:8px}
.ranking-page .skip-content:focus{transform:none}
.reading-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 32px;border-bottom:1px solid var(--line);background:#fff}
.reading-brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-size:17px;line-height:1.3;white-space:nowrap}
.reading-header nav{display:flex;align-items:center;gap:28px;font-size:12px}
.reading-header nav>a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.reading-width{width:min(1140px,calc(100% - 64px));margin-inline:auto}
.reading-hero{text-align:center;padding:68px 0 34px}
.reading-hero h1{font-size:clamp(29px,3.8vw,47px);line-height:1.25;letter-spacing:-.02em;max-width:1100px;margin-inline:auto;text-wrap:balance}
.reading-intro{font-size:18px;line-height:1.75;max-width:76ch;margin:22px auto 0!important;color:var(--body)}
.reading-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:26px}
.ranking-page .reading-button{display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:12px;padding:13px 22px;min-height:48px;font-size:14px;font-weight:650;line-height:1.4;background:#111;color:#fff!important;border:1px solid #111;border-radius:999px;text-decoration:none;transition:background .15s ease}
.ranking-page .reading-button:hover{background:#343434}
.ranking-page .reading-button.secondary{background:#fff;color:#111!important;border-color:#c8ccd1}
.ranking-page .reading-button.secondary:hover{background:#f5efff;border-color:#b0a0c3}
.ranking-page .reading-button.compact{font-family:Bungee,system-ui,sans-serif!important;font-size:11px;padding:10px 17px;min-height:42px}
.reading-offer{margin:17px auto 0!important;max-width:75ch;font-size:12px;line-height:1.7;color:#53575b}
.direct-answer{background:var(--blue);border:1px solid #cdd9e9;border-radius:14px;padding:23px 28px;margin:0 0 14px}
.direct-answer p{font-size:16px;line-height:1.8;color:#253449;max-width:92ch}
.direct-answer p+p{margin-top:12px}
.reading-jumps{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px;padding:10px 0 28px;margin:0;border-bottom:1px solid var(--line)}
.reading-jumps a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;color:#53575b;text-decoration:none}
.reading-jumps a:hover{color:#7125d3;text-decoration:underline}
.reading-section{padding:32px 34px;margin-top:24px;border:1px solid var(--line);border-radius:16px;scroll-margin-top:22px}
.reading-section h2,.reading-faq>h2,.reading-related>h2,.reading-closing h2{font-size:clamp(23px,2.5vw,31px);line-height:1.4;letter-spacing:-.015em;margin-bottom:20px}
.reading-copy{min-width:0}
.reading-copy :is(p,ul,ol,dl){font-size:16px;line-height:1.85;color:var(--body)}
.reading-copy>p{max-width:80ch}
.reading-copy>p+p,.reading-copy>p+ul,.reading-copy>p+ol,.reading-copy :is(ul,ol,dl,figure,div)+p{margin-top:16px}
.reading-copy :is(ul,ol){padding-left:24px;margin-bottom:0;margin-top:16px}
.reading-copy li+li{margin-top:8px}
.reading-copy a{color:#57259a;font-weight:600}
.reading-copy h3{font-size:19px;line-height:1.5;margin:24px 0 8px}
.reading-copy .setup-steps{padding-left:25px;margin:0;list-style:decimal}
.setup-steps>li{padding:0 0 20px 12px;margin:0 0 20px!important;border-bottom:1px solid #0002}
.setup-steps>li:last-child{padding-bottom:0;margin-bottom:0!important;border:0}
.setup-steps>li::marker{font-weight:700;color:#1d5741}
.setup-steps h3{margin:0 0 7px!important}
.setup-steps p{max-width:80ch}
.tone-mint{background:var(--mint);border-color:#cedfd2}.tone-lavender{background:var(--lavender);border-color:#ddd2ec}.tone-blue{background:var(--blue);border-color:#cdd9e9}.tone-cream{background:var(--cream);border-color:#e3d8c6}.tone-pink{background:var(--pink);border-color:#e6cdd2}.tone-teal{background:var(--teal);border-color:#c8dedd}.tone-white{background:#fff}
.table-scroll{max-width:100%;overflow-x:auto;border:1px solid #c6ced8;border-radius:12px;background:#fff;margin:8px 0 20px}
.table-scroll:focus-visible{outline:3px solid #7125d3;outline-offset:4px}
.reading-copy .table-hint{display:none}
.table-scroll table{width:100%;border-collapse:collapse;text-align:left;font-size:14px;line-height:1.7}
.table-scroll caption{text-align:left;padding:14px 18px;font-family:Inter,system-ui,sans-serif!important;font-weight:700;background:#fff;border-bottom:1px solid #c6ced8}
.table-scroll :is(th,td){padding:15px 18px;min-width:165px;vertical-align:top;border-bottom:1px solid #dce2e8;color:#303842!important;font-size:14px!important;line-height:1.7}
.table-scroll thead th{background:#f4f7fb;font-weight:700}.table-scroll tbody th{font-weight:700}.table-scroll tr:last-child :is(th,td){border-bottom:0}
.settings-list{display:grid;grid-template-columns:minmax(150px,.55fr) 1.5fr;gap:12px 24px;margin:16px 0 0!important}
.settings-list dt{font-weight:700}.settings-list dd{margin:0}
.workflow{margin:18px 0 24px!important}
.reading-copy .workflow ol{display:flex;gap:0;list-style:none;padding:0;margin:0;flex-wrap:wrap}
.workflow li{flex:1 1 180px;position:relative;margin:0!important;display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;min-height:90px;padding:16px 25px;text-align:center;border-block:1px solid #9baea3;background:#ffffffb0;font-size:14px;font-weight:650}
.ranking-page .workflow li span{font-family:Inter,system-ui,sans-serif!important;font-size:12px;font-weight:400}
.workflow li:first-child{border-left:1px solid #9baea3;border-radius:10px 0 0 10px}.workflow li:last-child{border-right:1px solid #9baea3;border-radius:0 10px 10px 0}
.workflow li:not(:last-child)::after{content:'→';position:absolute;right:-7px;z-index:1;font-size:20px;color:#1c4936}
.workflow figcaption{font-size:12px;line-height:1.7;margin-top:10px;color:#46564d}
.reading-faq,.reading-related{padding:44px 0 0}
.reading-faq details{border-bottom:1px solid var(--line);padding:16px 2px}
.reading-faq summary{cursor:pointer;min-height:36px;font-size:17px;font-weight:650;line-height:1.7}
.reading-faq details[open] summary{margin-bottom:12px}
.reading-faq details p{max-width:80ch;font-size:16px;line-height:1.85;color:var(--body);padding:0 23px 8px}
.related-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.related-list>a{position:relative;display:block;text-decoration:none;padding:20px 32px 20px 0;border-top:2px solid #171719}
.related-list>a>span:first-child{font-size:17px;line-height:1.7}.related-list p{font-size:14px;line-height:1.8;color:var(--body);margin-top:8px}
.related-arrow{position:absolute;top:19px;right:0;font-size:23px}.related-list a:hover{color:#7125d3}
.reading-sources{margin:32px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.reading-sources>p:first-child{font-size:14px;font-weight:650}.reading-sources ul{padding-left:20px;margin:12px 0;font-size:13px;line-height:1.9}.reading-sources a{color:#57259a}
.reading-sources .review-date{font-size:12px;line-height:1.8;color:#53575b;max-width:80ch}
.reading-closing{padding:48px 0 60px;text-align:center}.reading-closing h2{margin-bottom:12px}.reading-closing>p{font-size:16px;color:var(--body)}
.reading-footer{border-top:1px solid var(--line);padding:28px 32px 60px;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.reading-footer nav{display:flex;gap:20px;flex-wrap:wrap;font-size:12px}.reading-footer nav a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}.reading-footer small{font-size:11px;color:#53575b}
@media(max-width:760px){.reading-header{padding:12px 18px;gap:12px;flex-wrap:wrap}.reading-brand{font-size:14px}.reading-header nav{gap:18px;font-size:11px}.reading-width{width:calc(100% - 36px)}.reading-hero{padding:40px 0 26px}.reading-hero h1{font-size:clamp(27px,5.6vw,38px)}.reading-intro{font-size:16px;margin-top:18px!important}.reading-offer{font-size:11px}.reading-section{padding:24px 22px;margin-top:18px}.direct-answer{padding:20px 22px}.reading-jumps{justify-content:flex-start;padding-bottom:18px;gap:0 18px}.reading-copy :is(p,ul,ol,dl){font-size:15px}.reading-section h2,.reading-faq>h2,.reading-related>h2,.reading-closing h2{font-size:23px}.related-list{grid-template-columns:1fr;gap:6px}.settings-list{grid-template-columns:1fr;gap:5px}.settings-list dd{margin-bottom:12px}.workflow ol{display:grid!important;grid-template-columns:1fr!important;gap:20px!important}.workflow li{border:1px solid #9baea3!important;border-radius:10px!important;min-height:64px}.workflow li:not(:last-child)::after{content:'↓';right:auto;bottom:-26px;left:calc(50% - 7px)}.reading-footer{padding-inline:18px;align-items:flex-start;flex-direction:column}.reading-faq summary{font-size:16px}.reading-faq details p{padding-left:0;font-size:15px}}
@media(max-width:440px){.reading-header nav{width:100%;justify-content:space-between}.reading-hero{padding-top:30px}.reading-section{padding:22px 18px}.reading-hero h1{font-size:28px}.reading-actions{gap:10px}.ranking-page .reading-button{font-size:13px;padding:12px 18px}.reading-intro{line-height:1.75}.reading-copy .setup-steps{padding-left:21px}.setup-steps>li{padding-left:7px}.direct-answer p{font-size:15px}.reading-jumps a{font-size:12px}.reading-faq,.reading-related{padding-top:32px}.reading-closing{padding-bottom:42px}}
@media(max-width:760px){.reading-copy .table-hint{display:block;font-size:12px;line-height:1.6;margin-bottom:10px}.table-scroll table:has(thead th:nth-child(2):last-child) :is(th,td){min-width:0}}
@media(prefers-reduced-motion:reduce){html:has(.ranking-page){scroll-behavior:auto}.ranking-page .reading-button{transition:none}}
