
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&display=swap');
:root{--paper:#f3f0e8;--ink:#171a1d;--muted:#62676b;--orange:#f05a28;--green:#2c7a62;--rule:#cbc8bf;--white:#fffdf7;--rail:248px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'IBM Plex Sans',sans-serif;line-height:1.65}.rail{position:fixed;inset:0 auto 0 0;width:var(--rail);border-right:1px solid var(--rule);padding:30px 24px;display:flex;flex-direction:column;background:var(--paper);z-index:10}.brand{display:block;color:var(--ink);text-decoration:none;font-weight:600;line-height:1.05;font-size:22px}.brand small{display:block;margin-top:8px;font:11px 'IBM Plex Mono';letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.rail nav{display:grid;gap:5px;margin-top:56px}.rail nav a{padding:8px 0;color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}.rail nav a:hover,.rail nav a[aria-current=page]{color:var(--orange);border-color:var(--orange)}.rail-bottom{margin-top:auto;font:11px 'IBM Plex Mono';color:var(--muted)}.mobilebar,.mobilemenu{display:none}.page{margin-left:var(--rail);min-height:100vh}.wrap{width:min(1120px,calc(100% - 72px));margin:auto}.hero{padding:78px 0 56px;border-bottom:1px solid var(--rule)}.kicker,.label{font:12px 'IBM Plex Mono';letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}h1,h2,h3{line-height:1.08;margin-top:0}h1{font-size:clamp(48px,7vw,108px);letter-spacing:-.055em;max-width:1050px;margin:20px 0 28px}h2{font-size:clamp(32px,4vw,58px);letter-spacing:-.035em}h3{font-size:21px}.lede{font:clamp(20px,2vw,28px)/1.45 'Source Serif 4';max-width:760px;color:#303438}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 18px;background:var(--ink);color:var(--paper);text-decoration:none;border:1px solid var(--ink);font-weight:600}.btn.orange{background:var(--orange);border-color:var(--orange)}.btn.ghost{background:transparent;color:var(--ink)}section{padding:74px 0;border-bottom:1px solid var(--rule)}.section-head{display:grid;grid-template-columns:90px 1fr;gap:22px;margin-bottom:38px}.section-no{font:13px 'IBM Plex Mono';color:var(--orange)}.diagnostic{margin-top:48px;border:1px solid var(--ink);background:#202428;color:#e6e7e4;box-shadow:12px 12px 0 var(--orange)}.diag-head{padding:12px 16px;border-bottom:1px solid #454a4e;display:flex;justify-content:space-between;font:11px 'IBM Plex Mono';color:#b8bebc}.diag-grid{display:grid;grid-template-columns:repeat(4,1fr)}.metric{padding:22px 18px;border-right:1px solid #454a4e}.metric:last-child{border:0}.metric b{display:block;font:32px 'IBM Plex Mono';color:#fff}.metric span{font:11px 'IBM Plex Mono';color:#aeb5b2}.issue{display:grid;grid-template-columns:110px 1fr 110px;padding:13px 18px;border-top:1px solid #454a4e;font:12px 'IBM Plex Mono'}.bad{color:#ff8b68}.good{color:#71c5a2}.lanes{border-top:1px solid var(--ink)}.lane{display:grid;grid-template-columns:80px 1.1fr 1fr auto;gap:22px;align-items:start;padding:28px 0;border-bottom:1px solid var(--rule)}.lane .num{font:13px 'IBM Plex Mono';color:var(--orange)}.lane p{margin:0;color:var(--muted)}.lane a{color:var(--ink);font-weight:600}.problem-grid{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--rule)}.problem{padding:22px 18px;min-height:170px;border-right:1px solid var(--rule)}.problem:last-child{border:0}.problem b{display:block;margin-bottom:38px;font:12px 'IBM Plex Mono';color:var(--orange)}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule)}.step{background:var(--white);padding:24px 18px;min-height:210px}.step b{font:12px 'IBM Plex Mono';color:var(--green)}.notes-index{border-top:2px solid var(--ink)}.note-row{display:grid;grid-template-columns:130px 1fr 100px;gap:24px;padding:24px 0;border-bottom:1px solid var(--rule);text-decoration:none;color:var(--ink)}.note-row:hover h3{color:var(--orange)}.note-row p{margin:6px 0 0;color:var(--muted)}.note-row .meta{font:11px 'IBM Plex Mono';color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px}.fit-list{list-style:none;padding:0}.fit-list li{padding:13px 0;border-bottom:1px solid var(--rule)}.fit-list li:before{content:'+';font-family:'IBM Plex Mono';color:var(--green);margin-right:12px}.fit-list.no li:before{content:'−';color:var(--orange)}.cta{background:var(--orange);color:#fff}.cta h2{max-width:700px}.cta .btn{background:#fff;color:var(--ink);border-color:#fff}.pagehead{padding:70px 0 40px;border-bottom:1px solid var(--rule)}.pagehead h1{font-size:clamp(44px,6vw,82px);max-width:900px}.article{display:grid;grid-template-columns:220px minmax(0,720px);gap:54px;justify-content:center;padding:60px 0}.toc{position:sticky;top:28px;align-self:start;font:12px 'IBM Plex Mono';border-top:2px solid var(--ink);padding-top:12px}.toc a{display:block;color:var(--muted);text-decoration:none;padding:7px 0}.toc a:hover{color:var(--orange)}.prose{font:19px/1.72 'Source Serif 4'}.prose h2{font-family:'IBM Plex Sans';font-size:36px;margin-top:64px}.prose h3{font-family:'IBM Plex Sans';margin-top:35px}.prose code,.code{font:14px/1.6 'IBM Plex Mono';background:#22272b;color:#e8eee9;padding:2px 6px}.checklist{font-family:'IBM Plex Sans';background:var(--white);border-left:5px solid var(--green);padding:24px 28px;margin:34px 0}.checklist li{margin:9px 0}.callout{border:1px solid var(--ink);padding:22px 24px;margin:32px 0;font-family:'IBM Plex Sans'}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.card{border:1px solid var(--rule);padding:28px;color:var(--ink);text-decoration:none;background:rgba(255,255,255,.22)}.card:hover{border-color:var(--orange)}.form{display:grid;gap:18px;max-width:760px}.field{display:grid;gap:7px}.field label{font:12px 'IBM Plex Mono';text-transform:uppercase}.field input,.field select,.field textarea{font:16px 'IBM Plex Sans';padding:13px 14px;border:1px solid #989a95;background:var(--white);color:var(--ink)}.field textarea{min-height:145px}.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.fine{font-size:13px;color:var(--muted)}footer{padding:48px 0}.footgrid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.footlinks{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.footlinks a{color:var(--ink)}.cookie{position:fixed;z-index:30;left:calc(var(--rail) + 18px);right:18px;bottom:16px;background:var(--ink);color:#fff;padding:13px 16px;display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;font-size:13px}.cookie button{background:var(--orange);color:#fff;border:0;padding:10px 16px;font-weight:600;cursor:pointer}.filterbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.filterbar button{border:1px solid var(--ink);background:transparent;padding:8px 12px;cursor:pointer}.filterbar button.active{background:var(--ink);color:#fff}@media(max-width:900px){:root{--rail:0px}.rail{display:none}.mobilebar{display:flex;position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--rule);padding:14px 18px;justify-content:space-between;align-items:center}.mobilebar button{font-size:22px;border:0;background:none}.mobilemenu{display:none;padding:12px 18px;border-bottom:1px solid var(--rule);background:var(--paper)}.mobilemenu.open{display:grid}.mobilemenu a{padding:10px;color:var(--ink)}.page{margin-left:0}.wrap{width:min(100% - 36px,760px)}.hero{padding-top:52px}.diag-grid{grid-template-columns:1fr 1fr}.metric:nth-child(2){border-right:0}.issue{grid-template-columns:1fr auto}.issue span:nth-child(2){display:none}.problem-grid,.steps{grid-template-columns:1fr 1fr}.problem{border-bottom:1px solid var(--rule)}.lane{grid-template-columns:45px 1fr}.lane p,.lane a{grid-column:2}.article{grid-template-columns:1fr;padding:36px 18px}.toc{position:static}.split,.footgrid{grid-template-columns:1fr}.cookie{left:10px;right:10px;bottom:10px}.section-head{grid-template-columns:54px 1fr}.cards{grid-template-columns:1fr}}@media(max-width:540px){h1{font-size:48px}.diag-grid,.problem-grid,.steps,.two{grid-template-columns:1fr}.metric,.problem{border-right:0}.note-row{grid-template-columns:1fr}.note-row .meta{order:-1}.cookie{font-size:11px;padding:10px 12px}.cookie button{padding:9px 11px}.hero,section{padding-top:52px;padding-bottom:52px}}
