/* TechMeasured — single stylesheet, no web fonts, no framework. */
:root{
  --bg:#fbfaf7;--card:#fff;--ink:#14151a;--ink2:#3b3d45;--muted:#6b6d76;--line:#e7e4dc;--soft:#f3f1ec;
  --accent:#ff5a1f;--accent-ink:#fff;--c:var(--accent);
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --serif:"Iowan Old Style","Charter","Bitstream Charter","Sitka Text",Cambria,Georgia,serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
  --r:6px;--gut:16px;
}
@media (prefers-color-scheme:dark){:root{--bg:#0e0f12;--card:#16181d;--ink:#ecebe7;--ink2:#c9c8c3;--muted:#9a9ca5;--line:#262830;--soft:#1b1d23}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--gut)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:8px 12px;z-index:99}.skip:focus{left:8px}
.muted{color:var(--muted)}.small{font-size:.875rem}.mono{font-family:var(--mono)}
.i{display:inline-block;vertical-align:-.15em;flex:none}
.kicker{font:700 .72rem/1 var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--c);margin:0 0 .6rem}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.45em;border:1px solid transparent;border-radius:var(--r);padding:.7em 1.1em;font-weight:700;font-size:.95rem;line-height:1;cursor:pointer;white-space:nowrap;transition:transform .08s,background .15s}
.btn:active{transform:translateY(1px)}
.btn-accent{background:var(--accent);color:var(--accent-ink)}.btn-accent:hover{background:#e84a12;color:#fff}
.btn-ink{background:var(--ink);color:var(--bg)}.btn-ink:hover{color:var(--bg);opacity:.9}
.btn-ghost{border-color:var(--line);background:var(--card)}
.btn-sm{padding:.55em .9em;font-size:.85rem}

/* masthead */
.masthead{background:var(--bg);border-bottom:1px solid var(--line)}
.mast-row{display:flex;align-items:center;gap:20px;height:64px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:1.3rem;letter-spacing:-.03em;flex:none}
.logo b{color:var(--accent);font-weight:800}
.logo-mark{width:22px;height:22px;border-radius:4px;background:var(--ink);position:relative;overflow:hidden}
.logo-mark::before{content:"";position:absolute;inset:auto 0 0 0;height:9px;background:repeating-linear-gradient(90deg,var(--accent) 0 2px,transparent 2px 5px)}
.logo-mark::after{content:"";position:absolute;left:4px;top:4px;width:9px;height:4px;background:var(--bg);border-radius:1px}
.logo:hover{color:var(--ink)}
.cats{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;mask-image:linear-gradient(90deg,#000 92%,transparent)}
.cats::-webkit-scrollbar{display:none}
.cats a{padding:8px 10px;font-weight:600;font-size:.92rem;border-radius:var(--r);white-space:nowrap;position:relative}
.cats a::after{content:"";position:absolute;left:10px;right:10px;bottom:2px;height:2px;background:var(--c);transform:scaleX(0);transition:transform .15s;transform-origin:left}
.cats a:hover{color:var(--ink)}.cats a:hover::after,.cats a[aria-current]::after{transform:scaleX(1)}
.mast-actions{display:flex;align-items:center;gap:10px;flex:none}
.search{display:flex;align-items:center;background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:0 4px 0 12px;height:38px}
.search input{border:0;background:none;width:120px;outline:none;font-size:.9rem;transition:width .2s}
.search input:focus{width:180px}
.search button{border:0;background:none;padding:6px;cursor:pointer;color:var(--muted)}
.ruler{height:7px;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 8px);opacity:.9}

/* section headings */
.sec-h{display:flex;justify-content:space-between;align-items:baseline;font:800 .78rem/1 var(--mono);text-transform:uppercase;letter-spacing:.14em;margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid var(--ink)}
.sec-h a{font-weight:600;color:var(--muted);letter-spacing:.08em}
.sec-h a:hover{color:var(--accent)}

/* cards */
.card{--pad:0;position:relative}
.card-img{display:block;overflow:hidden;border-radius:var(--r);background:var(--soft);aspect-ratio:16/9}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.card:hover .card-img img{transform:scale(1.025)}
.tag{display:inline-block;font:700 .72rem/1 var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--c);margin-bottom:8px}
.tag .score{color:var(--ink)}
.card-title{margin:0;font-weight:800;letter-spacing:-.02em;line-height:1.18}
.card-title a:hover{color:var(--c)}
.card-dek{color:var(--ink2);margin:.5em 0 0;font-size:.98rem}
.meta{font:.78rem/1.4 var(--mono);color:var(--muted);margin:.6em 0 0;display:flex;align-items:center;gap:4px}

.top{display:grid;gap:28px;padding:28px 0 32px;border-bottom:1px solid var(--line);margin-bottom:28px}
.card-lead .card-title{font-size:clamp(1.6rem,3.6vw,2.6rem);line-height:1.08;letter-spacing:-.03em}
.card-lead .card-body{padding-top:16px}
.card-lead .card-dek{font-size:1.1rem;max-width:62ch}
.top-stack{display:grid;gap:20px;align-content:start}
.card-stack{display:grid;grid-template-columns:1fr 128px;gap:14px;align-items:start;padding-bottom:20px;border-bottom:1px solid var(--line)}
.card-stack:last-child{border-bottom:0;padding-bottom:0}
.card-stack .card-img{order:2}
.card-stack .card-title{font-size:1.05rem}

.grid-main{display:grid;gap:40px;padding-bottom:40px}
.card-row{display:grid;grid-template-columns:1fr 110px;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.card-row .card-img{order:2;aspect-ratio:1/1}
.card-row .card-title{font-size:1.08rem}
.card-row .card-dek{display:none}
.river .card-row:first-of-type{padding-top:0}

.tiles{display:grid;gap:24px;grid-template-columns:1fr}
.card-tile .card-body{padding-top:12px}
.card-tile .card-title{font-size:1.15rem}
.strip,.related{padding:8px 0 48px}

/* rail */
.rail{display:grid;gap:28px;align-content:start}
.rail-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.ranked{list-style:none;margin:0;padding:0;counter-reset:r}
.ranked li{counter-increment:r;display:grid;grid-template-columns:34px 1fr;padding:12px 0;border-bottom:1px solid var(--line);font-weight:700;line-height:1.3}
.ranked li:last-child{border-bottom:0;padding-bottom:0}
.ranked li::before{content:counter(r,decimal-leading-zero);font:800 1rem var(--mono);color:var(--accent);grid-row:span 2}
.ranked .meta{margin-top:4px;font-weight:400}
.repo-list{list-style:none;margin:0;padding:0}
.repo-list li{padding:12px 0;border-bottom:1px solid var(--line)}.repo-list li:last-child{border:0;padding-bottom:0}
.repo-name{display:flex;align-items:center;gap:6px;font-weight:700;font-size:.88rem;color:var(--ink)}
.repo-sum{display:block;color:var(--ink2);font-size:.9rem;margin-top:3px}

/* newsletter */
.nl-box{background:var(--ink);color:var(--bg);border-radius:var(--r);padding:22px;position:relative;overflow:hidden}
.nl-box::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:repeating-linear-gradient(90deg,var(--accent) 0 2px,transparent 2px 7px);opacity:.8}
.nl-box .kicker{color:var(--accent)}
.nl-head{font-weight:800;font-size:1.3rem;letter-spacing:-.02em;line-height:1.15;margin:0 0 .4em}
.nl-pitch{margin:0 0 14px;opacity:.82;font-size:.95rem}
.nl-form{display:flex;flex-wrap:wrap;gap:8px}
.nl-form input[type=email]{flex:1 1 180px;min-width:0;height:44px;border-radius:var(--r);border:1px solid var(--line);background:var(--card);color:var(--ink);padding:0 12px;font-size:16px}
.nl-form .btn{height:44px}
.nl-box .nl-form input[type=email]{border-color:transparent}
.nl-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.nl-msg{flex-basis:100%;margin:2px 0 0;min-height:1.2em}
.nl-msg.ok{color:#2fbf71}.nl-msg.err{color:#ff6b6b}
.nl-box .nl-msg.ok{color:#7ef0ad}
.nl-wide{margin:22px 0}
.nl-wide,.nl-end{display:grid;gap:16px}
.nl-inline{margin:2em 0;font-family:var(--sans)}
.nl-inline .nl-head{font-size:1.15rem}
.nl-end{margin:36px 0 0}
.nl-page{max-width:760px;padding:48px var(--gut) 64px}
.nl-hero .nl-form{max-width:520px;margin:20px 0}
.nl-points{list-style:none;padding:0;margin:28px 0 40px;display:grid;gap:14px}
.nl-points li{padding-left:22px;position:relative;color:var(--ink2)}
.nl-points li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:2px;background:var(--accent)}
.nl-points b{color:var(--ink)}
.nl-slide{position:fixed;z-index:40;right:16px;bottom:16px;left:16px;max-width:380px;margin-left:auto;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--accent);border-radius:var(--r);padding:18px 18px 14px;box-shadow:0 18px 50px rgba(0,0,0,.18);transform:translateY(120%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.nl-slide.show{transform:none}
.nl-slide .nl-head{font-size:1.1rem;padding-right:24px}
.nl-close{position:absolute;right:8px;top:6px;border:0;background:none;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--muted);padding:4px 8px}

/* listing */
.list-head{padding:40px 0 28px;border-bottom:1px solid var(--line);margin-bottom:28px}
.list-title{font-size:clamp(2rem,5vw,3.4rem);font-weight:800;letter-spacing:-.04em;line-height:1;margin:0}
.list-intro{color:var(--ink2);font-size:1.1rem;margin:.6em 0 0;max-width:60ch}
.pager{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:24px 0}

/* article */
.progress-bar{position:fixed;top:0;left:0;right:0;height:3px;z-index:50;pointer-events:none}
.progress-bar span{display:block;height:100%;width:100%;background:var(--c,var(--accent));transform-origin:left;transform:scaleX(0)}
.read-ring{position:fixed;z-index:30;right:14px;bottom:14px;width:48px;height:48px;display:grid;place-items:center;background:var(--card);border-radius:50%;box-shadow:0 4px 18px rgba(0,0,0,.14);opacity:0;transition:opacity .25s;pointer-events:none}
.read-ring.on{opacity:1}
.read-ring svg{position:absolute;inset:-2px;transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--line);stroke-width:3}
.ring-fg{fill:none;stroke:var(--accent);stroke-width:3.4;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .1s linear}
.ring-num{font:800 .7rem var(--mono);letter-spacing:-.04em}
.read-ring.done .ring-fg{stroke:#2fbf71}

.post{max-width:760px;padding-top:28px}
.post-head{margin-bottom:22px}
.crumbs{display:flex;align-items:center;gap:8px;color:var(--muted);margin-bottom:14px}
.crumbs .tag{margin:0}
.pill{font:700 .66rem/1 var(--mono);text-transform:uppercase;letter-spacing:.1em;border:1px solid var(--line);border-radius:99px;padding:4px 8px;color:var(--ink2)}
.post-title{font-size:clamp(1.85rem,4.6vw,3rem);line-height:1.06;letter-spacing:-.035em;font-weight:800;margin:0;text-wrap:balance}
.post-dek{font-size:clamp(1.08rem,2vw,1.28rem);color:var(--ink2);margin:.65em 0 0;line-height:1.45;text-wrap:pretty}
.post-meta{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font:.8rem/1.4 var(--mono);color:var(--muted);margin:20px 0 0;padding-top:16px;border-top:1px solid var(--line)}
.post-meta .by{color:var(--ink);font-weight:700;font-family:var(--sans);font-size:.9rem}
.post-meta .views b{color:var(--ink)}
.share{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.share-top{margin-top:16px}
.sh{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink2);cursor:pointer;transition:background .15s,color .15s,border-color .15s;padding:0}
.sh:hover{color:#fff;border-color:transparent}
.sh-x:hover{background:#000}.sh-facebook:hover{background:#1877f2}.sh-linkedin:hover{background:#0a66c2}.sh-reddit:hover{background:#ff4500}
.sh-hn:hover{background:#ff6600}.sh-bluesky:hover{background:#1185fe}.sh-threads:hover{background:#000}.sh-whatsapp:hover{background:#25d366}
.sh-email:hover,.sh-copy:hover,.sh-native:hover{background:var(--ink);color:var(--bg)}
.sh.copied{background:#2fbf71;color:#fff;border-color:transparent}
.share-label{font:700 .75rem var(--mono);text-transform:uppercase;letter-spacing:.1em;margin-right:4px;flex-basis:100%}
.share-bottom{margin:32px 0 0;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.post-hero{margin:0 calc(var(--gut) * -1) 28px}
.post-hero img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--soft)}
.post-hero figcaption{padding:8px var(--gut) 0}
.share-rail{display:none}

/* prose */
.prose{font:1.125rem/1.72 var(--serif);color:var(--ink);overflow-wrap:break-word}
.prose>*{margin:0 0 1.15em}
.prose h2,.prose h3{font-family:var(--sans);letter-spacing:-.02em;line-height:1.2;margin:1.8em 0 .6em;scroll-margin-top:20px}
.prose h2{font-size:1.5rem;font-weight:800}
.prose h3{font-size:1.2rem;font-weight:800}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px}
.prose a:hover{color:var(--accent)}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin:.35em 0}
.prose li::marker{color:var(--accent)}
.prose blockquote{margin:1.6em 0;padding:.2em 0 .2em 1.1em;border-left:3px solid var(--accent);font-style:italic;color:var(--ink2)}
.prose code{font:.86em var(--mono);background:var(--soft);border:1px solid var(--line);border-radius:4px;padding:.1em .35em}
.prose pre{background:#0f1115;color:#e9e7e2;border-radius:var(--r);padding:16px;overflow-x:auto;font:.86rem/1.6 var(--mono)}
.prose pre code{background:none;border:0;padding:0;color:inherit}
.prose strong{font-weight:700}
.prose hr{border:0;height:7px;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 8px);margin:2.4em 0}
.table-wrap{overflow-x:auto;margin:0 0 1.3em;border:1px solid var(--line);border-radius:var(--r)}
.prose table{border-collapse:collapse;width:100%;font:.9rem/1.45 var(--sans)}
.prose th,.prose td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose th{background:var(--soft);font-weight:700;white-space:nowrap}
.prose tr:last-child td{border-bottom:0}
.prose img{border-radius:var(--r)}

/* review verdict */
.verdict{display:grid;gap:18px;border:1px solid var(--line);border-top:4px solid var(--c);border-radius:var(--r);background:var(--card);padding:20px;margin:0 0 30px}
.verdict-score{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:6px}
.score-big{font:800 3.6rem/1 var(--sans);letter-spacing:-.05em}
.score-of{font:700 1rem var(--mono);color:var(--muted);padding-bottom:8px}
.meter{grid-column:1/-1;height:10px;margin-top:10px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--line) 0 2px,transparent 2px 10%),var(--soft);overflow:hidden}
.meter span{display:block;height:100%;background:var(--c)}
.verdict-label{grid-column:1/-1;margin:8px 0 0;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--c)}
.verdict-text .kicker{margin-bottom:.4em}
.verdict-sum{font-size:1.08rem;font-weight:600;margin:0 0 .5em;line-height:1.45}
.pc{display:grid;gap:16px}
.pc-h{font:800 .75rem var(--mono);text-transform:uppercase;letter-spacing:.1em;margin:0 0 8px}
.pc-pro{color:#1f9d5a}.pc-con{color:#d13d3d}
.pc ul{margin:0;padding:0;list-style:none;font-size:.95rem}
.pc li{padding:5px 0 5px 22px;position:relative;border-top:1px solid var(--line)}
.pc li::before{position:absolute;left:2px;font-weight:800}
.pc div:first-child li::before{content:"+";color:#1f9d5a}
.pc div:last-child li::before{content:"–";color:#d13d3d}
.method{margin:0;padding-top:12px;border-top:1px dashed var(--line)}

/* repo card */
.repo-card{border:1px solid var(--line);border-radius:var(--r);background:var(--card);padding:20px;margin:0 0 30px;border-top:4px solid var(--c)}
.repo-top{display:flex;gap:12px;align-items:flex-start}
.repo-title{font-weight:800;font-size:1.05rem;word-break:break-all}
.repo-top p{margin:.3em 0 0;color:var(--ink2)}
.repo-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:16px 0}
.repo-facts dt{color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em}
.repo-facts dd{margin:3px 0 0;font-weight:700}
.repo-facts .wide{grid-column:1/-1}
.repo-facts code{display:block;background:var(--soft);border:1px solid var(--line);border-radius:4px;padding:8px 10px;overflow-x:auto;white-space:nowrap;font-weight:400}

/* sources */
.sources{margin:36px 0 0;padding:20px;background:var(--soft);border-radius:var(--r)}
.sources-h{font:800 .78rem var(--mono);text-transform:uppercase;letter-spacing:.14em;margin:0 0 12px}
.sources ol{margin:0;padding-left:1.4em;display:grid;gap:8px;font-size:.95rem}
.sources li::marker{font-family:var(--mono);color:var(--accent);font-weight:700}
.sources a{font-weight:600;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.sources a:hover{text-decoration-color:var(--accent)}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 0}
.tags a{font:.8rem var(--mono);color:var(--muted);border:1px solid var(--line);border-radius:99px;padding:4px 10px}
.tags a:hover{color:var(--accent);border-color:var(--accent)}

.static-page{padding-top:40px;padding-bottom:60px}
.search-big{max-width:520px;height:auto;padding:6px;margin:20px 0 36px;border-radius:var(--r)}
.search-big input{width:100%!important;font-size:1rem;padding:6px}

/* footer */
.site-foot{border-top:1px solid var(--line);background:var(--card);margin-top:24px}
.foot-grid{display:grid;gap:28px;padding-top:40px;padding-bottom:28px}
.foot-grid p{margin:.6em 0}
.logo-foot{font-size:1.15rem}
.foot-h{font:800 .72rem var(--mono);text-transform:uppercase;letter-spacing:.14em;margin:0 0 12px}
.foot-links{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.foot-social{display:flex;gap:14px}
.foot-base{padding-top:18px;padding-bottom:28px;border-top:1px solid var(--line)}

/* ---------- responsive ---------- */
@media (max-width:759px){
  .mast-row{flex-wrap:wrap;height:auto;padding-top:12px;gap:10px 12px}
  .logo{flex:1}
  .cats{order:3;flex-basis:100%;margin:0 calc(var(--gut)*-1);padding:0 var(--gut) 6px}
  .search input{width:0;padding:0}
  .search input:focus{width:110px;padding:0 4px}
  .search{padding:0 2px 0 6px}
  .card-lead .card-img{margin:0 calc(var(--gut)*-1);border-radius:0}
}
@media (min-width:640px){
  .tiles{grid-template-columns:repeat(3,1fr)}
  .card-row{grid-template-columns:220px 1fr;gap:20px}
  .card-row .card-img{order:0;aspect-ratio:16/10}
  .card-row .card-dek{display:block;font-size:.95rem}
  .card-row .card-title{font-size:1.25rem}
  .nl-wide{grid-template-columns:1fr 1fr;align-items:center;padding:28px}
  .pc{grid-template-columns:1fr 1fr}
  .verdict{grid-template-columns:170px 1fr;padding:24px}
  .verdict .pc,.verdict .method{grid-column:1/-1}
  .foot-grid{grid-template-columns:repeat(2,1fr)}
  .nl-slide{left:auto}
  .read-ring{width:52px;height:52px}
}
@media (min-width:760px){
  .post-hero{margin:0 0 30px}.post-hero img{border-radius:var(--r)}.post-hero figcaption{padding-left:0}
  .prose{font-size:1.2rem}
}
@media (min-width:980px){
  :root{--gut:24px}
  .top{grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);gap:36px}
  .grid-main{grid-template-columns:minmax(0,1fr) 340px;gap:48px}
  .rail{position:sticky;top:20px}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr 1.4fr}
}
@media (min-width:1180px){
  .post{max-width:760px}
  .post-layout{position:relative}
  .share-rail{display:block;position:absolute;left:-80px;top:0;bottom:0}
  .share-rail-inner{position:sticky;top:24px;display:grid;gap:8px}
  .read-ring{right:28px;top:50%;bottom:auto;transform:translateY(-50%);width:58px;height:58px}
  .ring-num{font-size:.78rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.masthead,.site-foot,.share,.share-rail,.nl-box,.nl-slide,.read-ring,.progress-bar,.related{display:none!important}}
