/* Skill Finder. Reads the theme's tokens. One typeface; the type scale is 12 13 15 16 17 18 20 22 24 28 32 40; no underlines.
   Glass (blur and a light edge) only on what floats over the page: the search field, its suggestions, the action bar, the tray and the toast. */
.sf,.sf-nav,.sf-tray,.sf-toast,.sf-float,.sf-sheet{--sf-sunk:var(--bg-sunk,#f5f5f7);--sf-ink:var(--ink,#1d1d1f);--sf-text:var(--text,#2c2c30);--sf-muted:var(--muted,#5e5e66);--sf-line:var(--line,#e4e5e9);--sf-strong:var(--line-strong,#cfd1d7);--sf-accent:var(--accent,#d4145a);--sf-accent-text:var(--accent-text,#d4145a);--sf-r:20px;--sf-ricon:22.5%;--sf-glass:color-mix(in oklab,var(--bg,#fff) 62%,transparent);--sf-glass-strong:color-mix(in oklab,var(--bg,#fff) 84%,transparent);--sf-edge:color-mix(in oklab,var(--ink,#1d1d1f) 10%,transparent);--sf-hi:inset 0 1px 0 rgb(255 255 255/.55);--sf-lift:0 1px 2px rgb(0 0 0/.04),0 16px 40px -18px rgb(15 17 22/.35);font-family:var(--sans,system-ui,sans-serif)}
:root[data-theme="dark"] :is(.sf,.sf-tray,.sf-toast,.sf-float,.sf-sheet){--sf-hi:inset 0 1px 0 rgb(255 255 255/.10);--sf-lift:0 16px 40px -18px rgb(0 0 0/.7)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.sf,.sf-tray,.sf-toast,.sf-float,.sf-sheet){--sf-hi:inset 0 1px 0 rgb(255 255 255/.10);--sf-lift:0 16px 40px -18px rgb(0 0 0/.7)}}
.sf{padding-bottom:var(--section,4rem);color:var(--sf-text)}
.sf--bare{padding-bottom:0}
:where(.sf,.sf-nav,.sf-tray,.sf-toast,.sf-float) a{text-decoration:none;color:inherit}
.sf a:hover{text-decoration:none}
.sf :focus-visible,.sf-nav :focus-visible,.sf-tray :focus-visible,.sf-toast :focus-visible,.sf-float :focus-visible{outline:2px solid var(--sf-accent);outline-offset:2px;border-radius:8px}
:where(.sf) :where(h1,h2,h3,p,ul,ol,dl,dd){margin:0;padding:0}
:where(.sf) :where(ul,ol){list-style:none}
:where(.sf) :where(h2,h3){text-wrap:pretty}
.sf-vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* local navigation on the inner pages */
.sf-nav{margin:0 0 clamp(1rem,3svh,1.75rem)}
.sf-nav ul{display:flex;gap:.25rem .375rem;list-style:none;margin:0;padding:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.sf-nav ul::-webkit-scrollbar{display:none}
.sf-nav a{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 .875rem;border-radius:999px;color:var(--sf-text);font-size:.9375rem;font-weight:560;white-space:nowrap;transition:background-color var(--t-fast,140ms) var(--ease,ease),color var(--t-fast,140ms) var(--ease,ease)}
.sf-nav a:hover{background:var(--sf-sunk);color:var(--sf-ink)}
.sf-nav a[aria-current=page]{background:var(--sf-ink);color:var(--bg,#fff)}

/* shared type */
.sf-h2{color:var(--sf-ink);font-size:1.5rem;font-weight:650;line-height:1.25;letter-spacing:-.02em}
.sf-h2--list{margin:clamp(1.5rem,4svh,2.5rem) 0 .5rem}
.sf-lead{max-width:48rem;color:var(--sf-text);font-size:1.125rem;line-height:1.6;text-wrap:pretty}
.sf-answer-top{margin:.75rem 0 1rem}
.sf-lead a{display:inline-block;padding-block:.5625rem;margin-block:-.5625rem;color:var(--sf-accent-text);font-weight:560}
.sf-note{color:var(--sf-muted);font-size:.9375rem;line-height:1.5}
.sf-note a{color:var(--sf-accent-text);font-weight:560}
.sf-count{margin-top:1rem}
.sf-sec{margin-top:clamp(2.5rem,6svh,4rem)}
.sf-sec__head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.25rem;padding-bottom:.75rem;border-bottom:1px solid var(--sf-line)}
.sf-more{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--sf-accent-text);font-size:.9375rem;font-weight:600;white-space:nowrap}

/* buttons: one tinted action per view, the rest outlined */
.sf-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;padding:0 1.25rem;border:1px solid var(--sf-strong);border-radius:999px;background:none;color:var(--sf-ink);font:inherit;font-size:.9375rem;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;transition:border-color var(--t-fast,140ms) var(--ease,ease),background-color var(--t-fast,140ms) var(--ease,ease),transform var(--t-fast,140ms) var(--ease,ease)}
.sf-btn:hover{border-color:var(--sf-ink)}
.sf-btn:active,.sf-get:active{transform:scale(.97)}
.sf-btn--accent{border-color:var(--sf-accent);background:var(--sf-accent);color:var(--on-accent,#fff)}
.sf-btn--accent:hover{border-color:var(--sf-accent);background:color-mix(in oklab,var(--sf-accent) 88%,#000)}
.sf-btn[aria-pressed=true]{border-color:var(--sf-ink);background:var(--sf-sunk)}
/* the install pill, App Store style */
.sf-get{position:relative;z-index:1;display:inline-grid;place-items:center;min-width:4.75rem;min-height:2.75rem;padding:0 1rem;border:0;border-radius:999px;background:color-mix(in oklab,var(--sf-ink) 7%,transparent);color:var(--sf-accent-text);font:inherit;font-size:.9375rem;font-weight:650;white-space:nowrap;cursor:pointer;transition:background-color var(--t-fast,140ms) var(--ease,ease),transform var(--t-fast,140ms) var(--ease,ease)}
.sf-get:hover{background:color-mix(in oklab,var(--sf-ink) 12%,transparent)}
.sf-get--solid{background:var(--sf-accent);color:var(--on-accent,#fff)}
.sf-get--solid:hover{background:color-mix(in oklab,var(--sf-accent) 88%,#000)}

/* publisher icons: the rounded square of an app icon */
.sf-ic{display:block;flex:none;width:3.5rem;height:3.5rem;border-radius:var(--sf-ricon);background:#fff;box-shadow:0 0 0 1px rgb(0 0 0/.07);object-fit:cover}
.sf-ic--letter{display:grid;place-items:center;color:#1d1d1f;font-size:1.375rem;font-weight:650}
.sf-ic--lg{width:8rem;height:8rem;font-size:3rem}

/* ----- hub hero: the publishers behind one glass search field ----- */
.sf-hero{position:relative;isolation:isolate;padding:clamp(2.5rem,7svh,4.5rem) 0 clamp(2.25rem,6svh,4rem);border-bottom:1px solid var(--sf-line)}
.sf-wall{position:absolute;inset:-12px 0 0;z-index:-2;display:grid;gap:14px;align-content:start;overflow:hidden;opacity:.9;pointer-events:none}
.sf-wall__row{display:flex;width:max-content}
.sf-wall__row:nth-child(2n){margin-inline-start:-35px}
.sf-wall img{display:block;flex:none;width:56px;height:56px;margin-inline-end:14px;border-radius:var(--sf-ricon);background:#fff;box-shadow:0 0 0 1px rgb(0 0 0/.06)}
/* sf.js repeats each row past the screen's width, so the wall fills any screen */
.sf-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 75% at 50% 52%,var(--bg,#fff) 42%,color-mix(in oklab,var(--bg,#fff) 78%,transparent) 68%,color-mix(in oklab,var(--bg,#fff) 30%,transparent) 100%),linear-gradient(to bottom,transparent 60%,var(--bg,#fff))}
.sf-hero__in{display:grid;justify-items:center;gap:1rem;text-align:center}
.sf-kicker{color:var(--sf-muted);font-size:.8125rem;font-weight:560}
.sf-kicker b{margin-inline-end:.375rem;color:var(--sf-accent-text);font-weight:650}
.sf-h1{color:var(--sf-ink);font-size:2.5rem;font-weight:650;line-height:1.15;letter-spacing:-.035em}
.sf-sub{max-width:38rem;color:var(--sf-text);font-size:1.125rem;line-height:1.5}
.sf-try{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.25rem .5rem;color:var(--sf-muted);font-size:.9375rem}
.sf-try a{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 .25rem;color:var(--sf-ink);font-weight:560;transition:color var(--t-fast,140ms) var(--ease,ease)}
.sf-try a:hover{color:var(--sf-accent-text)}

/* ----- the search field (glass: it floats over the wall) ----- */
.sf-search{position:relative;width:min(100%,48rem);margin-top:1.25rem;text-align:left}
.sf-search--big{width:min(100%,46rem);margin-top:.5rem}
.sf-field{display:flex;align-items:center;gap:.75rem;height:3.5rem;padding:0 .375rem 0 1.125rem;border:1px solid var(--sf-edge);border-radius:999px;background:var(--sf-glass);-webkit-backdrop-filter:blur(28px) saturate(1.5);backdrop-filter:blur(28px) saturate(1.5);box-shadow:var(--sf-hi),var(--sf-lift);transition:box-shadow var(--t-fast,140ms) var(--ease,ease),border-color var(--t-fast,140ms) var(--ease,ease)}
.sf-search--big .sf-field{gap:.875rem;height:4rem;padding-inline-start:1.375rem}
.sf-field:focus-within{border-color:color-mix(in oklab,var(--sf-ink) 30%,transparent)}
.sf-field svg{flex:none;width:1.375rem;height:1.375rem;fill:none;stroke:var(--sf-ink);stroke-width:2;stroke-linecap:round}
.sf-field input[type=search]{flex:1;min-width:0;min-height:2.75rem;border:0;outline:0;background:none;color:var(--sf-ink);font:inherit;font-size:1.0625rem;caret-color:var(--sf-accent);-webkit-appearance:none;appearance:none}
.sf-search--big .sf-field input[type=search]{font-size:1.125rem}
.sf-field input::placeholder{color:var(--sf-muted);opacity:1}
.sf-field input::-webkit-search-cancel-button{display:none}
.sf-field kbd{display:none;margin-inline-end:.75rem;padding:.125rem .5rem;border:1px solid var(--sf-line);border-radius:6px;color:var(--sf-muted);font:inherit;font-size:.8125rem}
@media (hover:hover) and (min-width:48em){.sf-field kbd{display:block}.sf-scope:not([hidden])~kbd{display:none}}
.sf-field:focus-within kbd{display:none}
.sf-scope{display:flex;flex:none;gap:2px;padding:3px;border-radius:999px;background:color-mix(in oklab,var(--sf-ink) 6%,transparent)}
.sf-scope[hidden]{display:none}
.sf-scope button{min-height:2.75rem;padding:0 .875rem;border:0;border-radius:999px;background:none;color:var(--sf-text);font:inherit;font-size:.8125rem;font-weight:600;cursor:pointer;transition:background-color var(--t-fast,140ms) var(--ease,ease),color var(--t-fast,140ms) var(--ease,ease)}
.sf-scope button:hover{color:var(--sf-ink)}
.sf-scope button[aria-pressed=true]{background:var(--bg,#fff);color:var(--sf-ink);box-shadow:0 1px 3px rgb(0 0 0/.12)}
.sf-search:not(.sf-search--big) .sf-scope{display:none}
/* suggestions, glass too */
.sf-pop{position:absolute;z-index:30;inset-inline:0;top:calc(100% + .5rem);max-height:min(34rem,70svh);overflow:auto;overscroll-behavior:contain;padding:.5rem;border:1px solid var(--sf-edge);border-radius:24px;background:var(--sf-glass-strong);-webkit-backdrop-filter:blur(30px) saturate(1.6);backdrop-filter:blur(30px) saturate(1.6);box-shadow:var(--sf-hi),0 24px 60px -20px rgb(15 17 22/.4);text-align:left;transform-origin:top center;animation:sf-pop .16s var(--ease-out,ease-out)}
.sf-pop[hidden]{display:none}
@keyframes sf-pop{from{opacity:0;transform:translateY(-4px) scale(.99)}}
.sf-pop__head{padding:.5rem .75rem .25rem;color:var(--sf-muted);font-size:.8125rem;font-weight:560}
.sf-pop .sf-row{padding:.5rem .75rem;border:0;border-radius:16px}
.sf-pop .sf-row.is-active,.sf-pop .sf-row:hover{background:color-mix(in oklab,var(--sf-ink) 6%,transparent)}
.sf-pop .sf-ic{width:3rem;height:3rem}
.sf-pop__job{display:grid;place-items:center;background:var(--sf-sunk);box-shadow:none}
.sf-pop__job svg{width:1.375rem;height:1.375rem;fill:none;stroke:var(--sf-ink);stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sf-pop__more{display:flex;align-items:center;width:100%;min-height:2.75rem;margin-top:.25rem;padding:0 .75rem;border:0;border-top:1px solid var(--sf-line);background:none;color:var(--sf-accent-text);font:inherit;font-size:.9375rem;font-weight:600;text-align:left;cursor:pointer}
.sf-pop__empty{padding:.75rem;color:var(--sf-text);font-size:.9375rem;line-height:1.5}

/* ----- jobs ----- */
.sf-jobs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap,1.5rem);margin-top:1rem}
.sf-jobs--all{grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr));margin-top:1.5rem}
.sf-job{display:grid;gap:.75rem;align-content:start;height:100%;padding:1rem;border-radius:var(--sf-r);background:var(--sf-sunk);color:var(--sf-ink);transition:transform var(--t-fast,140ms) var(--ease,ease),background-color var(--t-fast,140ms) var(--ease,ease)}
.sf-job:hover{transform:translateY(-2px)}
.sf-job i{display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:var(--sf-ricon);background:var(--bg,#fff);box-shadow:0 0 0 1px var(--sf-line)}
.sf-job svg{width:1.375rem;height:1.375rem;fill:none;stroke:var(--sf-ink);stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sf-job strong{display:block;font-size:1rem;font-weight:650;line-height:1.35}
.sf-job small{display:block;color:var(--sf-muted);font-size:.8125rem;line-height:1.4}

/* ----- rows: icon, name, one line, numbers, Get ----- */
.sf-rows{display:grid}
.sf-row{position:relative;display:grid;grid-template-columns:1.5rem 3.5rem minmax(0,1fr) auto;align-items:center;gap:.875rem;padding:.75rem 0;border-bottom:1px solid var(--sf-line)}
.sf-row--plain{grid-template-columns:3.5rem minmax(0,1fr) auto}
.sf-row[hidden]{display:none}
.sf-row__n{color:var(--sf-ink);font-size:1.0625rem;font-weight:650;text-align:center}
.sf-row__who{min-width:0}
.sf-row__name{overflow:hidden;color:var(--sf-ink);font-size:1rem;font-weight:650;line-height:1.35;white-space:nowrap;text-overflow:ellipsis}
.sf-row__name a{color:inherit}
.sf .sf-row__name a::after{content:"";position:absolute;inset:0}
.sf .sf-row:hover .sf-row__name a{color:var(--sf-accent-text)}
.sf-row__line{overflow:hidden;color:var(--sf-muted);font-size:.8125rem;line-height:1.4;white-space:nowrap;text-overflow:ellipsis}
.sf-row__line--full{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--sf-text);font-size:.9375rem;line-height:1.5;white-space:normal}
.sf-row__line code{font-family:inherit;font-weight:600;color:var(--sf-ink)}
.sf-row__meta{display:flex;flex-wrap:nowrap;overflow:hidden;white-space:nowrap;align-items:center;gap:0 .5rem;margin-top:.125rem;color:var(--sf-muted);font-size:.75rem;font-weight:560;line-height:1.5}
.sf-row__meta>*+*::before{content:"·";margin-inline-end:.5rem}
.sf-row__score b{color:var(--sf-ink);font-weight:650}
.sf-rows--list .sf-row{grid-template-columns:2rem 3.5rem minmax(0,1fr) auto;align-items:start;padding:1rem 0}
.sf-rows--list .sf-row__n{padding-top:.875rem}
.sf-rows--list .sf-row__name{font-size:1.0625rem}
.sf-rows--list .sf-row__meta{flex-wrap:wrap;margin-top:.25rem}
.sf-rows--list .sf-get{margin-top:.375rem}
.sf-rows--list .sf-row--plain{grid-template-columns:3.5rem minmax(0,1fr) auto}
.sf-rows--two{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap,1.5rem)}

/* a state is a shape and a word, never only a colour */
.sf-scan{display:inline-flex;align-items:center;gap:.375rem;color:var(--sf-ink);white-space:nowrap}
.sf-scan i{display:inline-block;flex:none;width:.625rem;height:.625rem}
.sf-scan--clear i{border-radius:50%;background:var(--sf-ink)}
.sf-scan--mixed i{transform:rotate(45deg);border:2px solid var(--sf-ink);background:linear-gradient(135deg,var(--sf-ink) 50%,transparent 50%)}
.sf-scan--warn{color:var(--sf-accent-text);font-weight:650}
.sf-scan--warn i{width:0;height:0;border-inline:.375rem solid transparent;border-bottom:.625rem solid currentColor}
.sf-scan--none{color:var(--sf-muted)}
.sf-scan--none i{border:1.5px solid currentColor;border-radius:50%}

/* ----- hub shelves ----- */
.sf-charts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap,1.5rem)}
.sf-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap,1.5rem);row-gap:clamp(2.5rem,6svh,4rem)}
.sf-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap,1.5rem);margin-top:1rem}
.sf-trust li{padding:1.25rem;border-radius:var(--sf-r);background:var(--sf-sunk)}
.sf-trust strong{display:block;margin-bottom:.375rem;color:var(--sf-ink);font-size:1.0625rem;font-weight:650;line-height:1.35}
.sf-trust p{color:var(--sf-text);font-size:.9375rem;line-height:1.5}
.sf-faq{padding-bottom:var(--section,4rem)}
.sf-faq .sf-prose{max-width:none;margin-top:.5rem}
@media (min-width:64em){.sf-faq .sf-prose{width:calc((100% - var(--gap,1.5rem) * 11) / 12 * 8 + var(--gap,1.5rem) * 7)}}

/* ----- one item: App Store head ----- */
.sf-top{padding-top:clamp(1rem,3svh,2rem)}
.sf-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:0 .5rem;margin-bottom:.75rem;color:var(--sf-muted);font-size:.8125rem;font-weight:560}
.sf-crumb a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--sf-accent-text)}
.sf-head{display:grid;grid-template-columns:8rem minmax(0,1fr);grid-template-areas:'ic t' 'ic b';column-gap:1.75rem;align-items:end}
.sf-head>.sf-ic{grid-area:ic;align-self:start}
.sf-head__t{grid-area:t;min-width:0}
.sf-head__b{grid-area:b;min-width:0;align-self:start}
.sf-name{color:var(--sf-ink);font-size:2.5rem;font-weight:650;line-height:1.15;letter-spacing:-.035em;overflow-wrap:anywhere}
.sf-name__by{display:block;margin-top:.375rem;color:var(--sf-muted);font-size:1rem;font-weight:400;line-height:1.5;letter-spacing:0}
.sf-badges{display:flex;gap:.375rem;margin-top:.5rem}
.sf-badge{display:inline-flex;align-items:center;padding:0 .5rem;border:1px solid var(--sf-strong);border-radius:999px;color:var(--sf-ink);font-size:.75rem;font-weight:600;line-height:1.6}
.sf-answer{max-width:44rem;margin-top:.75rem;color:var(--sf-ink);font-size:1.25rem;font-weight:500;line-height:1.4;text-wrap:pretty}
.sf-answer code{font-family:inherit;font-weight:650}
.sf-actions{display:flex;flex-wrap:wrap;gap:.625rem;margin-top:1.25rem}
.sf-notices{display:grid;gap:.5rem;max-width:44rem;margin-top:1rem}
.sf-notice{padding:.75rem 1rem;border-radius:14px;background:var(--sf-sunk);color:var(--sf-text);font-size:.9375rem;line-height:1.5}
.sf-notice--warn{box-shadow:inset 3px 0 0 var(--sf-accent);color:var(--sf-ink)}
.sf-notice b{font-weight:650}
.sf-notice .sf-scan{margin-inline-end:.25rem}
/* the stat strip */
.sf-stats{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;margin-top:2rem;padding:1rem 0;border-block:1px solid var(--sf-line)}
.sf-stat{display:grid;justify-items:center;align-content:start;gap:.125rem;padding:0 .75rem;border-inline-start:1px solid var(--sf-line);text-align:center}
.sf-stat:first-child{border:0}
.sf-stat dt{color:var(--sf-muted);font-size:.75rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase}
.sf-stat dd{display:grid;justify-items:center;gap:.125rem}
.sf-stat strong{color:var(--sf-ink);font-size:1.5rem;font-weight:650;line-height:1.25;letter-spacing:-.02em;white-space:nowrap}
.sf-stat strong .sf-scan{font-size:1.25rem;font-weight:650;letter-spacing:-.01em}
.sf-stat strong .sf-scan i{width:.75rem;height:.75rem}
.sf-stat strong .sf-scan--warn i{border-inline-width:.4375rem;border-bottom-width:.75rem}
.sf-stat span:not(.sf-scan){color:var(--sf-muted);font-size:.8125rem;white-space:nowrap}
/* body: main 1-8, contents 9-12 */
.sf-body{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap,1.5rem);margin-top:2.5rem;padding-bottom:var(--section,4rem)}
.sf-body>.sf-main{grid-column:1/span 8;min-width:0}
.sf-body>.sf-aside{grid-column:9/span 4;position:sticky;top:calc(var(--mast-h,4rem) + 1rem);align-self:start}
.sf-block{margin-bottom:2.75rem;scroll-margin-top:calc(var(--mast-h,4rem) + 1.5rem)}
.sf-block>h2,.sf-block.sf-prose>h2{margin:0 0 .75rem;color:var(--sf-ink);font-size:1.5rem;font-weight:650;line-height:1.25;letter-spacing:-.02em}
.sf-block__lead{margin-bottom:1rem;font-size:1.0625rem;line-height:1.6}
.sf-cmd{display:flex;align-items:center;gap:.75rem;padding:.5rem .5rem .5rem 1.25rem;border-radius:18px;background:var(--sf-sunk)}
.sf-cmd code{flex:1;min-width:0;color:var(--sf-ink);font-family:inherit;font-size:1rem;font-weight:560;line-height:1.5;overflow-wrap:anywhere}
.sf-block .sf-note{margin-top:.75rem}
.sf-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap,1.5rem)}
.sf-pair>div{padding:1.25rem;border-radius:var(--sf-r);background:var(--sf-sunk)}
.sf-pair h3{margin-bottom:.5rem;color:var(--sf-ink);font-size:1.0625rem;font-weight:650;line-height:1.35}
.sf-pair li{position:relative;margin-top:.375rem;padding-inline-start:1.25rem;font-size:1rem;line-height:1.5}
.sf-pair code{font-family:inherit;font-weight:600;color:var(--sf-ink)}
.sf-pair__yes li::before{content:"";position:absolute;inset-inline-start:0;top:.45em;width:.5rem;height:.25rem;border-left:2px solid var(--sf-ink);border-bottom:2px solid var(--sf-ink);transform:rotate(-45deg)}
.sf-pair__no li::before{content:"";position:absolute;inset-inline-start:.0625rem;top:.7em;width:.625rem;height:2px;background:var(--sf-muted)}
.sf-bars{display:grid;gap:.75rem}
.sf-bar{display:grid;grid-template-columns:9rem minmax(0,1fr) 2.5rem;align-items:center;gap:1rem;font-size:.9375rem;line-height:1.4}
.sf-bar__name{color:var(--sf-ink);font-weight:600}
.sf-bar__name small{display:block;color:var(--sf-muted);font-size:.8125rem;font-weight:400}
.sf-bar__track{display:block;height:.5rem;overflow:hidden;border-radius:99px;background:var(--sf-line)}
.sf-bar__track i{display:block;height:100%;border-radius:99px;background:var(--sf-ink)}
.sf-bar__val{color:var(--sf-ink);font-weight:650;text-align:right}
.sf-bar__none{grid-column:2/-1;color:var(--sf-muted);font-size:.8125rem}
.sf-toc{padding:1.25rem;border-radius:var(--sf-r);background:var(--sf-sunk)}
.sf-toc h2{margin-bottom:.25rem;color:var(--sf-ink);font-size:1.0625rem;font-weight:650;line-height:1.35}
.sf-toc a{display:flex;align-items:center;min-height:2.75rem;border-top:1px solid var(--sf-line);color:var(--sf-ink);font-size:.9375rem;font-weight:560;line-height:1.35;transition:color var(--t-fast,140ms) var(--ease,ease)}
.sf-toc h2+a{border-top:0}
.sf-toc a:hover,.sf-toc a[aria-current=true]{color:var(--sf-accent-text)}
.sf-vote__btns{display:flex;gap:.5rem}
.sf-checked{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--sf-line);color:var(--sf-muted);font-size:.9375rem;line-height:1.5}
.sf-checked p+p{margin-top:.5rem}
.sf-checked a{color:var(--sf-accent-text);font-weight:560}
/* the action bar once the head scrolls away: top on wide screens, at the thumb on phones */
.sf-float{position:fixed;z-index:40;left:50%;top:calc(var(--mast-h,4rem) + .5rem);display:flex;align-items:center;gap:.75rem;max-width:calc(100vw - 2rem);padding:.4375rem .4375rem .4375rem .5rem;border:1px solid var(--sf-edge);border-radius:999px;background:var(--sf-glass-strong);-webkit-backdrop-filter:blur(28px) saturate(1.5);backdrop-filter:blur(28px) saturate(1.5);box-shadow:var(--sf-hi),var(--sf-lift);color:var(--sf-ink);opacity:0;transform:translate(-50%,-.75rem);pointer-events:none;transition:opacity .2s var(--ease-out,ease-out),transform .2s var(--ease-out,ease-out)}
.sf-float[hidden]{display:none}
.sf-float:not(.is-on){visibility:hidden;transition:opacity .2s var(--ease-out,ease-out),transform .2s var(--ease-out,ease-out),visibility 0s linear .2s}
.sf-float.is-on{visibility:visible;opacity:1;transform:translate(-50%,0);pointer-events:auto}
.sf-float .sf-ic{width:2.25rem;height:2.25rem}
.sf-float b{overflow:hidden;min-width:0;padding-inline-end:.25rem;font-size:.9375rem;font-weight:650;white-space:nowrap;text-overflow:ellipsis}

/* ----- list pages: main 1-8, side 9-12 ----- */
.sf-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem}
.sf-head-list,.sf-layout>.sf-main{min-width:0}
.sf-head-list .sf-search{margin-top:1.25rem}
@media (min-width:64em){
  .sf-layout{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap,1.5rem);row-gap:0;align-items:start}
  .sf-layout>.sf-main,.sf-head-list{grid-column:1/span 8}
  .sf-side{grid-column:9/span 4;grid-row:1/span 2;position:sticky;top:calc(var(--mast-h,4rem) + 1rem)}
}
.sf-card{padding:1.25rem;border-radius:var(--sf-r);background:var(--sf-sunk)}
.sf-card__title{color:var(--sf-ink);font-size:1.0625rem;font-weight:650;line-height:1.35}
.sf-card__more{margin-top:.5rem;font-size:.9375rem}
.sf-card__more a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--sf-accent-text);font-weight:560}
.sf-facts{display:grid;margin-top:.5rem}
.sf-facts>div{display:flex;justify-content:space-between;gap:1rem;padding:.625rem 0;border-top:1px solid var(--sf-line);font-size:.9375rem;line-height:1.4}
.sf-facts>div:first-child{border-top:0}
.sf-facts dt{color:var(--sf-muted)}
.sf-facts dd{color:var(--sf-ink);font-weight:560;text-align:right}
.sf-facts dd a{display:inline-flex;align-items:center;min-height:2.75rem;margin-block:-.75rem;color:var(--sf-accent-text)}
.sf-facts--two{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap,1.5rem);margin:0}
.sf-facts--two>div:nth-child(2){border-top:0}
.sf-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.75rem 1rem;margin-top:1.25rem;color:var(--sf-muted);font-size:.8125rem}
.sf-filters label{display:grid;gap:.25rem}
.sf-filters select{min-height:2.75rem;padding:0 2.25rem 0 1rem;border:1px solid var(--sf-strong);border-radius:999px;background:var(--bg,#fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2386868b' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 1rem center/.75rem;color:var(--sf-ink);font:inherit;font-size:.9375rem;-webkit-appearance:none;appearance:none}
.sf-check{display:flex!important;align-items:center;min-height:2.75rem;gap:.5rem;color:var(--sf-ink);font-size:.9375rem}
.sf-check input{position:relative;flex:none;width:2.75rem;height:2.75rem;margin:0 -.75rem 0 -.75rem;-webkit-appearance:none;appearance:none;background:none;cursor:pointer}
.sf-check input::before{content:"";position:absolute;inset:.75rem;border:1.5px solid var(--sf-strong);border-radius:6px;background:var(--bg,#fff);transition:background-color var(--t-fast,140ms) var(--ease,ease),border-color var(--t-fast,140ms) var(--ease,ease)}
.sf-check input:checked::before{border-color:var(--sf-accent);background:var(--sf-accent)}
.sf-check input::after{content:"";position:absolute;left:1.125rem;top:.9375rem;width:.4375rem;height:.75rem;border:solid var(--on-accent,#fff);border-width:0 2px 2px 0;transform:rotate(45deg);opacity:0}
.sf-check input:checked::after{opacity:1}
.sf-check input:focus-visible{outline:none}
.sf-check input:focus-visible::before{outline:2px solid var(--sf-accent);outline-offset:2px}
.sf-check{gap:.75rem!important}
.sf-filters__count{align-self:center;margin-inline-start:auto;color:var(--sf-ink);font-size:.9375rem;font-weight:560}

/* reading text */
.sf-prose{font-size:1.125rem;line-height:1.6}
.sf-prose>section{margin-top:2.5rem}
.sf-layout>.sf-main.sf-prose{margin-top:.5rem}
.sf-prose h2{margin:2.5rem 0 .75rem;color:var(--sf-ink);font-size:1.5rem;font-weight:650;line-height:1.25;letter-spacing:-.02em}
.sf-prose>section>h2:first-child,.sf-prose>h2:first-child,.sf-sec.sf-prose>h2{margin-top:0}
.sf-prose h3{margin:1.25rem 0 .375rem;color:var(--sf-ink);font-size:1.125rem;font-weight:650;line-height:1.35}
.sf-prose h3:first-child{margin-top:0}
.sf-prose p+p{margin-top:1rem}
.sf-prose ul,.sf-prose ol{display:grid;gap:.5rem;margin:.75rem 0}
.sf-prose li{position:relative;padding-inline-start:1.125rem}
.sf-prose li::before{content:"";position:absolute;inset-inline-start:0;top:.7em;width:.375rem;height:.375rem;border-radius:50%;background:var(--sf-strong)}
.sf-prose a{color:var(--sf-accent-text);font-weight:560}
.sf-prose a.sf-btn{color:var(--sf-ink);font-weight:600}
.sf-prose a.sf-btn--accent{color:var(--on-accent,#fff)}
.sf-prose code{font-family:inherit;font-weight:600;color:var(--sf-ink)}
.sf-prose .sf-rows{display:grid;gap:0;margin:0}
.sf-prose .sf-rows li{padding-inline-start:0}
.sf-prose .sf-rows li::before{display:none}
.sf-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sf-table{width:100%;border-collapse:collapse;font-size:.9375rem;line-height:1.5}
.sf-table th,.sf-table td{padding:.625rem .75rem;border-top:1px solid var(--sf-line);text-align:left;vertical-align:top;font-weight:400}
.sf-table th:first-child,.sf-table td:first-child{padding-inline-start:0}
.sf-table thead th{border-top:0;color:var(--sf-muted);font-size:.8125rem;font-weight:560}
.sf-table tbody th{color:var(--sf-ink);font-weight:560}
.sf-table--cmp{min-width:40rem}
.sf-table--cmp thead th{color:var(--sf-ink);font-size:1.125rem;font-weight:650;line-height:1.35}
.sf-table--cmp small{display:block;color:var(--sf-muted);font-size:.8125rem;font-weight:400}
.sf-table--cmp code{font-family:inherit;overflow-wrap:anywhere}
.sf-table--cmp tbody th{width:9rem;color:var(--sf-muted)}
.sf-lead--gap{margin-bottom:1.5rem}

/* compare tray and toast: floating, so glass */
.sf-tray,.sf-toast{position:fixed;z-index:45;inset-inline:0;bottom:calc(var(--tabs-h,0px) + var(--safe-b,0px) + .75rem);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem .75rem;width:fit-content;max-width:calc(100vw - 2rem);margin-inline:auto;padding:.5rem .5rem .5rem 1.25rem;border:1px solid var(--sf-edge);border-radius:28px;background:var(--sf-glass-strong);-webkit-backdrop-filter:blur(28px) saturate(1.6);backdrop-filter:blur(28px) saturate(1.6);box-shadow:var(--sf-hi),var(--sf-lift);color:var(--sf-ink);font-size:.9375rem;font-weight:560;line-height:1.4}
.sf-tray[hidden],.sf-toast[hidden]{display:none}
.sf-toast{z-index:50;min-height:3.75rem;animation:sf-rise .2s var(--ease-out,ease-out)}
.sf-toast a{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 1rem;border-radius:999px;background:color-mix(in oklab,var(--sf-ink) 7%,transparent);color:var(--sf-accent-text);font-weight:650}
.sf-tray:not([hidden])~.sf-toast{bottom:calc(var(--tabs-h,0px) + var(--safe-b,0px) + 5rem)}
@keyframes sf-rise{from{opacity:0;transform:translateY(.5rem)}}

/* ----- tablet ----- */
@media (min-width:48em) and (max-width:63.99em){
  .sf-jobs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sf-charts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sf-charts>.sf-rows:nth-child(3){display:none}
  .sf-body{display:block}
  .sf-aside{display:none}
}
@media (max-width:63.99em){.sf-layout .sf-side{order:3}}
/* ----- phone ----- */
@media (max-width:47.99em){
  .sf-h1,.sf-name{font-size:1.75rem}
  .sf-sub{font-size:1rem}
  .sf-hero{padding-top:7rem}
  .sf-wall{inset:-8px 0 auto;height:6rem;gap:12px}
  .sf-wall img{width:44px;height:44px;margin-inline-end:12px}
  .sf-hero{padding-bottom:2rem}
  .sf-hero::before{background:linear-gradient(to bottom,color-mix(in oklab,var(--bg,#fff) 5%,transparent) 0,color-mix(in oklab,var(--bg,#fff) 35%,transparent) 2.5rem,color-mix(in oklab,var(--bg,#fff) 88%,transparent) 5rem,var(--bg,#fff) 6rem)}
  .sf-row{grid-template-columns:1.25rem 3rem minmax(0,1fr) auto;gap:.75rem}
  .sf-row--plain{grid-template-columns:3rem minmax(0,1fr) auto}
  .sf-ic{width:3rem;height:3rem}
  .sf-get{min-width:4.25rem;padding:0 .875rem}
  .sf-search--big .sf-field{height:3.5rem;padding-inline-start:1.125rem}
  .sf-search--big .sf-field input[type=search]{font-size:1rem}
  .sf-scope{display:none!important}
  .sf-try{flex-wrap:nowrap;justify-content:flex-start;width:calc(100% + var(--gutter,1rem) * 2);margin-inline:calc(var(--gutter,1rem) * -1);padding-inline:var(--gutter,1rem);overflow-x:auto;scrollbar-width:none;white-space:nowrap}
  .sf-try::-webkit-scrollbar,.sf-jobs::-webkit-scrollbar,.sf-charts::-webkit-scrollbar,.sf-stats::-webkit-scrollbar{display:none}
  .sf-try a{padding:0 .875rem;border:1px solid var(--sf-line);border-radius:999px}
  .sf-jobs:not(.sf-jobs--all){grid-template-columns:none;grid-template-rows:auto auto;grid-auto-flow:column;grid-auto-columns:9.5rem;gap:.75rem;margin-inline:calc(var(--gutter,1rem) * -1);padding-inline:var(--gutter,1rem);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter,1rem);scrollbar-width:none}
  .sf-jobs:not(.sf-jobs--all) li{scroll-snap-align:start}
  .sf-jobs--all{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
  .sf-charts{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc(100% - 2.5rem);column-gap:1rem;margin-inline:calc(var(--gutter,1rem) * -1);padding-inline:var(--gutter,1rem);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter,1rem);scrollbar-width:none}
  .sf-charts>.sf-rows{scroll-snap-align:start}
  .sf-two,.sf-trust,.sf-rows--two,.sf-pair,.sf-facts--two{grid-template-columns:minmax(0,1fr)}
  .sf-facts--two>div:nth-child(2){border-top:1px solid var(--sf-line)}
  .sf-row__line:not(.sf-row__line--full){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal}
  .sf-rows--list .sf-row{grid-template-columns:1.5rem 3rem minmax(0,1fr);column-gap:.75rem}
  .sf-rows--list .sf-row--plain{grid-template-columns:3rem minmax(0,1fr)}
  .sf-rows--list .sf-ic{width:3rem;height:3rem}
  .sf-rows--list .sf-row__n{padding-top:.625rem}
  .sf-rows--list .sf-get{grid-column:-2;justify-self:start;margin-top:0}
  .sf-head{grid-template-columns:4.5rem minmax(0,1fr);grid-template-areas:'ic t' 'b b';column-gap:1rem;align-items:center}
  .sf-head>.sf-ic{align-self:center}
  .sf-ic--lg{width:4.5rem;height:4.5rem;font-size:1.75rem}
  .sf-name__by{margin-top:.125rem;font-size:.9375rem}
  .sf-answer{font-size:1.0625rem}
  .sf-actions{display:grid;grid-template-columns:1fr 1fr}
  .sf-actions .sf-btn--accent{grid-column:1/-1}
  .sf-stats{grid-auto-columns:7.5rem;margin-inline:calc(var(--gutter,1rem) * -1);padding-inline:var(--gutter,1rem);overflow-x:auto;scrollbar-width:none}
  .sf-body{display:block;margin-top:2rem}
  .sf-aside{display:none}
  .sf-bar{grid-template-columns:6.5rem minmax(0,1fr) 2.25rem;gap:.75rem}
  .sf-cmd{flex-wrap:wrap;padding:.75rem .75rem .75rem 1rem}
  .sf-cmd code{flex-basis:100%;font-size:.9375rem}
  .sf-cmd .sf-get{margin-inline-start:auto}
  .sf-float{top:auto;bottom:calc(var(--tabs-h,0px) + var(--safe-b,0px) + .75rem);width:calc(100vw - 2rem);transform:translate(-50%,.75rem)}
  .sf-float b{flex:1}
  .sf-float:has(~.sf-tray:not([hidden])){display:none}
  .sf-sec__head{align-items:center}
}
/* These rows only scroll sideways on phones; on wider screens the theme's edge fade (data-fade-row) would only clip a hover lift or a focus ring. */
@media (min-width:48em){.sf-try[data-fade-row],.sf-jobs[data-fade-row],.sf-charts[data-fade-row],.sf-stats[data-fade-row]{-webkit-mask-image:none;mask-image:none}}
/* ----- phones: the search is a sheet over what is visible above the keyboard, the field docked at its foot (HIG, Search fields) ----- */
.sf-sheet{position:fixed;top:0;right:0;left:0;z-index:1000;display:flex;flex-direction:column;height:100vh;height:100dvh;background:var(--bg,#fff);color:var(--sf-text);animation:sf-sheet-in .22s cubic-bezier(.2,.8,.2,1)}
.sf-sheet[hidden]{display:none}
@keyframes sf-sheet-in{from{opacity:0;transform:translateY(.75rem)}}
.sf-sheet-open,.sf-sheet-open body{overflow:hidden}
.sf-sheet-open .sf-toast{z-index:1001}
.sf-sheet__head{display:flex;flex:none;align-items:baseline;justify-content:space-between;gap:1rem;padding:calc(env(safe-area-inset-top,0px) + .875rem) 1rem .5rem}
.sf-sheet__head h2{margin:0;color:var(--sf-ink);font-size:1.75rem;font-weight:650;line-height:1.2;letter-spacing:-.02em}
.sf-sheet__n{color:var(--sf-muted);font-size:.9375rem}
.sf-sheet .sf-scope{display:flex!important;flex:none;margin:0 1rem .25rem}
.sf-sheet .sf-scope button{flex:1}
.sf-sheet .sf-pop{position:static;flex:1;min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain;padding:0 0 .5rem;border:0;border-radius:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;animation:none}
.sf-sheet :where(ul,ol,li,p){margin:0;padding:0;list-style:none}
.sf-sheet .sf-pop[hidden]{display:block;visibility:hidden}
.sf-sheet .sf-pop__head{padding:1.125rem 1rem .375rem;font-size:.8125rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase}
.sf-sheet .sf-row{min-height:3.5rem;padding:.625rem 1rem;border:0;border-radius:0}
.sf-sheet .sf-row::before{content:"";position:absolute;right:0;bottom:0;left:4.875rem;height:1px;background:var(--sf-line)}
.sf-sheet .sf-row.is-active,.sf-sheet .sf-row:hover{background:var(--sf-sunk)}
.sf-sheet .sf-row__name{font-size:1.0625rem}
.sf-sheet .sf-row__meta{flex-wrap:wrap;white-space:normal}
.sf-sheet .sf-row__meta>.sf-scan{flex-basis:100%}
.sf-sheet .sf-row__meta>.sf-scan::before{content:none}
.sf-sheet .sf-row__line:not(.sf-row__line--full){display:block;-webkit-line-clamp:unset;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-sheet .sf-pop__more{width:auto;margin:.25rem 1rem 0;padding:0;border:0}
.sf-sheet .sf-pop__empty{padding:1rem}
.sf-sheet__bar{display:flex;flex:none;align-items:center;gap:.625rem;padding:.5rem .75rem .625rem}
.sf-sheet__field,.sf-sheet__close{background:var(--sf-glass-strong);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);box-shadow:0 0 0 1px var(--sf-edge),0 .25rem 1.25rem rgb(0 0 0/.12)}
.sf-sheet__field{display:flex;flex:1;align-items:center;gap:.5rem;min-width:0;height:3rem;padding:0 0 0 .875rem;border-radius:999px}
.sf-sheet__field>svg{flex:none;width:1.125rem;height:1.125rem;fill:none;stroke:var(--sf-ink);stroke-width:2.2;stroke-linecap:round;opacity:.55}
.sf-sheet input[type=search]{flex:1;min-width:0;min-height:2.75rem;margin:0;padding:0;border:0;outline:0;background:none;color:var(--sf-ink);font:inherit;font-size:1.0625rem;caret-color:var(--sf-accent);-webkit-appearance:none;appearance:none}
.sf-sheet input[type=search]::placeholder{color:var(--sf-muted);opacity:1}
.sf-sheet input::-webkit-search-cancel-button{display:none}
.sf-sheet__clear{display:grid;flex:none;place-items:center;width:2.75rem;height:2.75rem;margin:0;padding:0;border:0;background:none;color:inherit;cursor:pointer}
.sf-sheet__clear[hidden]{display:none}
.sf-sheet__clear svg{box-sizing:border-box;width:1.375rem;height:1.375rem;padding:.375rem;border-radius:50%;background:color-mix(in oklab,var(--sf-muted) 60%,transparent);fill:none;stroke:var(--bg,#fff);stroke-width:2.2;stroke-linecap:round}
.sf-sheet__close{display:grid;flex:none;place-items:center;width:3rem;height:3rem;margin:0;padding:0;border:0;border-radius:50%;color:var(--sf-ink);cursor:pointer}
.sf-sheet__close svg{width:1.125rem;height:1.125rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.sf-sheet__close:focus-visible,.sf-sheet__clear:focus-visible{outline:2px solid var(--sf-accent);outline-offset:2px}
@media (max-width:47.99em){.sf-field input[type=search][readonly]{cursor:text}}
@media (prefers-reduced-transparency:reduce){.sf-field,.sf-pop,.sf-float,.sf-tray,.sf-toast,.sf-sheet__field,.sf-sheet__close{background:var(--bg,#fff);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (prefers-contrast:more){.sf-field,.sf-pop,.sf-float,.sf-tray,.sf-toast{border-color:var(--sf-ink)}}
@media (prefers-reduced-motion:reduce){.sf *,.sf-nav *,.sf-tray,.sf-toast,.sf-float,.sf-pop,.sf-sheet{transition:none!important;animation:none!important}}
@media print{.sf-nav,.sf-search,.sf-try,.sf-wall,.sf-tray,.sf-toast,.sf-float,.sf-get,.sf-actions,.sf-vote,.sf-filters,.sf-aside{display:none!important}}