:root{
  color-scheme:dark;
  --night:#050d13;--deep:#081622;--panel:rgba(9,22,33,.82);--panel-solid:#0a1825;
  --ink:#e9f3f8;--text:#d4e1e8;--muted:#9aacb8;--faint:#6f8290;
  --ice:#9ae1fa;--ice-strong:#c6efff;--ice-dim:rgba(154,225,250,.16);
  --amber:#f0c674;--amber-dim:rgba(240,198,116,.14);
  --line:#22394a;--line-soft:#1a2c3a;
  --sans:"PingFang SC","Microsoft YaHei","Noto Sans SC","Noto Sans CJK SC","Segoe UI",sans-serif;
  --mono:"SFMono-Regular","Cascadia Mono",Consolas,"Liberation Mono",monospace;
  --dock-space:118px;
}
*{box-sizing:border-box}
html{background:var(--night);scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--night);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--ice);outline-offset:4px;border-radius:3px}
img{max-width:100%;height:auto}
h1,h2,h3,p,ol,ul,figure{margin:0}
main{position:relative;z-index:1}
main:focus{outline:none}
.skip{position:fixed;z-index:30;top:10px;left:14px;padding:10px 16px;background:var(--ice);color:var(--night);transform:translateY(-180%)}
.skip:focus{transform:none}

.sky{position:fixed;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:62% 40%;pointer-events:none;z-index:0}
.at-page .sky{opacity:.34}

.masthead{position:absolute;z-index:3;top:26px;left:clamp(20px,4.2vw,64px);right:clamp(20px,4.2vw,64px);display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:inline-flex;align-items:center;gap:12px;min-height:44px;color:var(--ink)}
.brand-mark{width:30px;height:30px;color:var(--ice)}
.brand-word{font-size:19px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
.masthead-find{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--muted);font-size:15px;border-bottom:1px solid transparent}
.masthead-find:hover{color:var(--ice);border-bottom-color:var(--ice)}

.hero{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,600px);align-content:center;row-gap:30px;padding:96px clamp(20px,6.4vw,104px) var(--dock-space)}
.hero-text{max-width:600px}
.hero-kicker{display:flex;align-items:center;gap:14px;color:var(--ice);font-size:14px;letter-spacing:.18em}
.hero-kicker:before{content:"";width:34px;border-top:1px solid var(--ice)}
.hero h1{margin-top:14px;color:var(--ink);font-size:clamp(34px,min(4.2vw,7.4vh),60px);line-height:1.28;font-weight:400;letter-spacing:.01em}
.hero-intro{margin-top:16px;max-width:36em;color:var(--text);font-size:17px;line-height:1.85}
.codecard{margin-top:24px;padding:20px 22px 18px;background:var(--panel);border:1px solid #2b4558;border-radius:4px;backdrop-filter:blur(10px)}
.codecard-label{color:var(--muted);font-size:13.5px}
.codecard-row{margin-top:8px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.codecard-code{font-family:var(--mono);font-size:28px;letter-spacing:.08em;color:var(--ink)}
.codecard-copy{min-height:44px;min-width:88px;padding:0 20px;border:0;border-radius:4px;background:var(--ice);color:#06141c;font:500 16px var(--sans);cursor:pointer;transition:background .15s,transform .12s}
.codecard-copy:active,.tool-btn:active{transform:scale(.98)}
.codecard-copy:hover{background:var(--ice-strong)}
.codecard-copy[data-done]{background:#b9e6c6}
.codecard-note{margin-top:10px;color:var(--text);font-size:15px}
.codecard-foot a{color:var(--text);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.codecard-foot{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.6}
.codecard-inline{margin:22px 0;max-width:560px}
.prose .codecard-code{font-size:22px;padding:0;background:none;color:var(--ink)}

.pick{position:relative;min-width:0}
.pick h2{font-size:16px;font-weight:400;color:var(--muted);margin-bottom:12px}
.pick-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,300px);border:1px solid #2d4a5e;border-radius:4px;background:rgba(8,20,30,.88);backdrop-filter:blur(10px);overflow:hidden;transition:border-color .2s}
.pick-text{display:grid;align-content:center;gap:8px;padding:26px 30px}
.pick-kicker{color:var(--ice);font-size:14px}
.pick-title{color:var(--ink);font-size:clamp(20px,2.4vw,26px);line-height:1.45}
.pick-note{color:var(--muted);font-size:15px;line-height:1.8}
.pick-meta{color:var(--faint);font-size:13px}
.pick-cover{display:block;width:100%;height:100%;object-fit:cover;object-position:right center;border-left:1px solid var(--line-soft)}
.pick-card:hover{border-color:var(--ice)}
.pick-card:hover .pick-title{color:var(--ice)}
@media (min-width:1024px){
  .hero{grid-template-columns:minmax(0,600px) minmax(300px,380px);justify-content:space-between;align-items:end;column-gap:48px}
  .hero .pick-card{grid-template-columns:1fr}
  .hero .pick-cover{display:none}
  .hero .pick-text{padding:22px 24px}
  .hero .pick-title{font-size:22px}
  .hero .pick-note{font-size:14.5px;line-height:1.75}
}

.shelves,.toolbelt,.themes{position:relative;width:min(1080px,100% - 40px);margin:0 auto}
.shelf,.toolbelt,.themes{padding:52px 0 12px;border-top:1px solid var(--line-soft)}
.shelf-head{display:grid;gap:8px;margin-bottom:20px;max-width:46em}
.shelf-head h2{color:var(--ink);font-size:24px;font-weight:400}
.shelf-head p{color:var(--muted);font-size:15px;max-width:44em}

.entry-list{list-style:none;padding:0}
.entry{border-top:1px solid var(--line-soft)}
.entry:first-child{border-top-color:var(--line)}
.entry a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 28px;padding:18px 4px;transition:background .15s}
.entry-title{color:var(--ink);font-size:18.5px;line-height:1.5}
.entry-lede{grid-column:1;color:var(--muted);font-size:14.5px;line-height:1.7}
.entry-time{color:var(--faint);font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}
.entry .entry-time{grid-column:2;grid-row:1;align-self:baseline}
.entry a:hover{background:rgba(154,225,250,.05)}
.entry a:hover .entry-title{color:var(--ice)}

.lead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:32px;align-items:start}
.lead-main{display:grid;gap:10px}
.lead-cover{display:block;width:100%;aspect-ratio:1200/630;object-fit:cover;border:1px solid var(--line-soft);border-radius:4px;margin-bottom:6px;transition:border-color .2s}
.lead-title{color:var(--ink);font-size:clamp(21px,2.2vw,25px);line-height:1.45}
.lead-lede{color:var(--muted);font-size:15px;line-height:1.8}
.lead-main:hover .lead-title{color:var(--ice)}
.lead-main:hover .lead-cover{border-color:var(--ice)}
.lead-rest,.index-grid,.chart-list,.compact-list,.route-line,.tool-bento{list-style:none;padding:0}
.lead-rest li,.chart-list li,.compact-list li{border-top:1px solid var(--line-soft)}
.lead-rest li:first-child{border-top:0}
.lead-rest a,.chart-list a,.index-grid a{display:grid;gap:4px;padding:15px 2px}
.lead-rest li:first-child a{padding-top:0}
.lead-rest-title,.index-title{color:var(--ink);font-size:16.5px;line-height:1.5}
.lead-rest-lede,.index-lede{color:var(--muted);font-size:14px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lead-rest .entry-time,.lead-main .entry-time{font-size:13px}
.lead-rest a:hover .lead-rest-title,.index-grid a:hover .index-title,.chart-list a:hover .index-title{color:var(--ice)}
.index-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:44px}
.index-grid li{border-top:1px solid var(--line-soft)}
.route-line{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));column-gap:22px;overflow:hidden}
.route-line li{position:relative;padding-top:24px}
.route-line li:before{content:"";position:absolute;top:7px;left:0;right:-22px;border-top:1px solid #2c4a5e}
.route-line li:after{content:"";position:absolute;top:3px;left:0;width:9px;height:9px;border-radius:50%;background:var(--night);border:1px solid var(--ice);transition:background .2s}
.route-line li:hover:after{background:var(--ice)}
.route-line a{display:grid;gap:6px;padding:2px 0 26px}
.route-stop{color:var(--ice);font-size:14.5px}
.route-title{color:var(--ink);font-size:16px;line-height:1.55}
.route-line a:hover .route-title{color:var(--ice)}
.chart-shelf{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:34px;align-items:start}
.reward-chart{padding:18px 18px 12px;border:1px solid var(--line);border-radius:4px;background:rgba(6,16,24,.8)}
.reward-chart svg{display:block;width:100%;height:auto}
.reward-chart .axis{stroke:#2c4a5e}
.reward-chart .bar{fill:rgba(154,225,250,.2);stroke:var(--ice);stroke-width:1}
.reward-chart .bar-next{fill:none;stroke-dasharray:4 3}
.reward-chart .val{fill:var(--ink);font:15px var(--mono)}
.reward-chart .yr{fill:var(--muted);font:14.5px var(--sans)}
.reward-chart .unit{fill:var(--faint);font:13.5px var(--sans)}
.reward-chart figcaption{margin-top:8px;color:var(--faint);font-size:13px;line-height:1.6}
.chart-list li:first-child{border-top:0}
.chart-list li:first-child a{padding-top:0}
.compact-list a{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr) auto;gap:6px 28px;align-items:baseline;padding:18px 2px}
.compact-title{color:var(--ink);font-size:17px;line-height:1.5}
.compact-lede{color:var(--muted);font-size:14.5px;line-height:1.75}
.compact-list a:hover .compact-title{color:var(--ice)}
.tool-bento{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:14px}
.tool-bento .tool-big{grid-row:span 2}
.tool-bento a{display:grid;align-content:start;gap:10px;height:100%;padding:22px;border:1px solid var(--line);border-radius:4px;background:rgba(8,20,30,.8);transition:border-color .2s}
.tool-bento .tool-big a{padding:28px;background:linear-gradient(160deg,rgba(154,225,250,.1),rgba(8,20,30,.88) 58%)}
.tool-bento .tool-big .tool-name{font-size:21px}
.tool-bento a:hover{border-color:var(--ice)}
.tool-read{color:var(--muted);font-size:13.5px;line-height:1.7;font-variant-numeric:tabular-nums}
.tool-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px;padding-top:16px;border-top:1px solid var(--line-soft)}
.tool-figs>span{display:grid;gap:2px}
.fig-k{color:var(--faint);font-size:13px}
.fig-v{color:var(--ink);font-family:var(--mono);font-size:clamp(17px,1.8vw,22px);font-variant-numeric:tabular-nums;white-space:nowrap}
.fig-u{white-space:normal}
.epoch{display:block;height:6px;margin-top:8px;border-radius:3px;background:#12293a;overflow:hidden}
.epoch-fill{display:block;height:100%;background:var(--ice)}
.chip-count{margin-left:8px;color:var(--faint);font-size:13px;font-variant-numeric:tabular-nums}

.tool-name{color:var(--ink);font-size:17.5px}
.tool-lede{color:var(--muted);font-size:14.5px;line-height:1.7}
.theme-chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.theme-chips a,.leaf-tags a,.leaf-tags span:not(.leaf-tags-label){display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border:1px solid #2d4658;border-radius:20px;font-size:14.5px;color:var(--text)}
.theme-chips a:hover,.leaf-tags a:hover{border-color:var(--ice);color:var(--ice)}

.listing,.leaf,.tool,.plain{position:relative;width:min(780px,100% - 40px);margin:0 auto;padding:118px 0 60px}
.listing{width:min(980px,100% - 40px)}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:var(--faint);font-size:13.5px;margin-bottom:20px}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--ice)}
.listing-head{margin-bottom:28px}
.listing-head h1,.leaf-head h1,.tool-head h1{color:var(--ink);font-size:clamp(28px,3.6vw,42px);line-height:1.35;font-weight:400}
.listing-intro{margin-top:14px;color:var(--muted);max-width:46em}
.listing-intro p+p{margin-top:.6em}
.theme-list{list-style:none;padding:0}
.theme-list a{display:grid;grid-template-columns:200px 1fr auto;gap:16px;align-items:baseline;padding:18px 4px;border-top:1px solid var(--line-soft)}
.theme-name{color:var(--ink);font-size:18px}
.theme-gist{color:var(--muted);font-size:14.5px}
.theme-count{color:var(--faint);font-family:var(--mono);font-size:13px}
.theme-list a:hover .theme-name{color:var(--ice)}
.pager{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pager a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 12px;border:1px solid var(--line)}
.pager [aria-current]{background:var(--ice);color:var(--night);border-color:var(--ice)}

.leaf-kicker{display:inline-block;color:var(--ice);font-size:14.5px;margin-bottom:10px}
.leaf-lede{margin-top:16px;color:var(--text);font-size:17.5px;line-height:1.85}
.leaf-meta{margin-top:16px;display:flex;flex-wrap:wrap;gap:6px 10px;color:var(--faint);font-size:13.5px}
.leaf-meta a{color:var(--muted);border-bottom:1px solid var(--line)}
.leaf-cover{margin:28px 0 8px}
.leaf-cover img{display:block;width:100%;border-radius:4px;border:1px solid var(--line-soft)}
.leaf-cover figcaption{margin-top:8px;color:var(--faint);font-size:13px}
.route{margin:26px 0 8px;border:1px solid var(--line);border-radius:4px;background:rgba(8,20,30,.74)}
.route summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 18px;color:var(--ink);font-size:15.5px}
.route summary::-webkit-details-marker{display:none}
.route summary:after{content:"＋";color:var(--ice)}
.route details[open] summary:after{content:"－"}
.route ol{margin:0;padding:4px 18px 16px 40px;color:var(--muted);font-size:15px}
.route li{padding:3px 0}
.route a:hover{color:var(--ice)}

.prose{margin-top:26px;font-size:17px;line-height:1.95;color:var(--text);overflow-wrap:anywhere}
.prose>*+*{margin-top:1.05em}
.prose h2{margin-top:2.1em;color:var(--ink);font-size:clamp(22px,2.3vw,26px);line-height:1.45;font-weight:500;scroll-margin-top:24px}
.prose h2:before{content:"";display:block;width:26px;height:2px;margin-bottom:14px;background:var(--ice);box-shadow:34px 0 0 -0px rgba(154,225,250,.35)}
.prose h3{margin-top:1.7em;color:var(--ink);font-size:19px;line-height:1.5;font-weight:500;scroll-margin-top:24px}
.prose a{color:var(--ice);text-decoration:underline;text-decoration-color:rgba(154,225,250,.45);text-underline-offset:4px}
.prose a:hover{text-decoration-color:var(--ice)}
.prose strong{color:var(--ink);font-weight:600}
.prose ul,.prose ol{padding-left:1.4em}
.prose li+li{margin-top:.45em}
.prose code{font-family:var(--mono);font-size:.9em;padding:1px 6px;border-radius:3px;background:#0f2433;color:var(--ice-strong)}
.prose blockquote{padding:4px 0 4px 18px;border-left:1px solid var(--line);color:var(--muted)}
.prose hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.prose .hint{padding:14px 18px;border:1px solid rgba(154,225,250,.26);background:rgba(154,225,250,.07);border-radius:4px}
.prose .caution{padding:14px 18px;border:1px solid rgba(240,198,116,.38);background:var(--amber-dim);border-radius:4px;color:var(--ink)}
.prose .point{font-size:18px;line-height:1.8;color:var(--ink);padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.prose ol.steps{list-style:none;padding-left:0;counter-reset:step}
.prose ol.steps>li{position:relative;counter-increment:step;padding:0 0 18px 50px;margin:0}
.prose ol.steps>li:before{content:counter(step);position:absolute;left:0;top:2px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--ice);border-radius:50%;color:var(--ice);font-family:var(--mono);font-size:14px;background:var(--night)}
.prose ol.steps>li:after{content:"";position:absolute;left:16px;top:38px;bottom:4px;border-left:1px dashed #33536a}
.prose ol.steps>li:last-child:after{display:none}
.prose ol.steps>li>p+p{margin-top:.6em}
.shot{margin:1.6em 0}
.shot a{display:block}
.shot img{display:block;border-radius:4px;border:1px solid var(--line);background:#fff}
.shot figcaption{margin-top:8px;color:var(--faint);font-size:13.5px;line-height:1.6}
@media (min-width:641px){.shot a,.shot figcaption{max-width:600px;margin-left:auto;margin-right:auto}.shot-tall a,.shot-tall figcaption{max-width:520px}}
.fine a{color:var(--text);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.prose figure.chart{margin:1.6em 0;padding:16px;border:1px solid var(--line);border-radius:4px;background:rgba(8,20,30,.7)}
.prose figure.chart svg{display:block;width:100%;max-width:440px;height:auto;margin:0 auto}
@media (min-width:641px){.prose figure.chart{max-width:474px;margin-left:auto;margin-right:auto}}
.prose figure.chart figcaption{margin-top:10px;color:var(--faint);font-size:13.5px}
.table-wrap{margin:1.4em 0;overflow-x:auto;border:1px solid var(--line);border-radius:4px}
.table-wrap table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.7}
.table-wrap th{text-align:left;color:var(--ink);font-weight:500;background:#0c1d2a}
.table-wrap th,.table-wrap td{padding:10px 14px;border-bottom:1px solid var(--line-soft);vertical-align:top;overflow-wrap:break-word}
.table-wrap tr:last-child td{border-bottom:0}
.signup-link{color:var(--ice);font-weight:500;text-decoration:underline;text-underline-offset:4px}
.signup-link:after{content:" ↗";font-size:.85em}
.fine{display:block;margin-top:.55em;padding:9px 13px;border:1px solid var(--line);border-radius:4px;background:rgba(9,22,33,.7);color:var(--muted);font-size:13.5px;line-height:1.7}

.qa{margin-top:2.6em;padding-top:4px}
.qa>h2{color:var(--ink);font-size:clamp(21px,2.2vw,24px);font-weight:500}
.qa-item{padding:16px 0;border-bottom:1px solid var(--line-soft)}
.qa-item h3{color:var(--ink);font-size:17px;font-weight:500;line-height:1.55}
.qa-item p{margin-top:6px;color:var(--text);font-size:16px;line-height:1.85}
.leaf-foot{margin-top:46px;display:grid;gap:26px}
.leaf-tags{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.leaf-tags-label{color:var(--faint);font-size:13.5px;margin-right:4px}
.next-reads{padding:20px 22px;border:1px solid var(--line);border-radius:4px;background:rgba(8,20,30,.7)}
.next-reads h2{color:var(--ink);font-size:16px;font-weight:500}
.next-reads ul{list-style:none;padding:0;margin-top:8px}
.next-reads li{padding:8px 0;border-top:1px solid var(--line-soft)}
.next-reads li:first-child{border-top:0}
.next-reads a{color:var(--ink)}
.next-reads a:hover{color:var(--ice)}

.tool-panel{margin:26px 0 10px;padding:22px;border:1px solid #2b4558;border-radius:6px;background:linear-gradient(160deg,#0c2232,#071420 60%)}
.tool-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.tool-field{display:grid;gap:6px;flex:1 1 200px}
.tool-field label,.tool-field span.lab{color:var(--muted);font-size:13.5px}
.tool-field input,.tool-field select{min-height:46px;width:100%;padding:0 12px;border:1px solid #33536a;border-radius:4px;background:#06121b;color:var(--ink);font:16px var(--sans)}
.tool-field input[type=text]{font-family:var(--mono);font-size:15px}
.tool-btn{min-height:46px;padding:0 20px;border:0;border-radius:4px;background:var(--ice);color:#06141c;font:500 16px var(--sans);cursor:pointer}
.tool-btn:hover{background:var(--ice-strong)}
.tool-out{margin-top:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.tool-out .metric:last-child:nth-child(even){grid-column:1/-1}
.metric{padding:16px;border:1px solid var(--line);border-radius:4px;background:rgba(5,13,19,.7)}
.metric-k{color:var(--muted);font-size:13px}
.metric-v{display:block;margin-top:4px;color:var(--ink);font-size:clamp(20px,2.2vw,26px);font-variant-numeric:tabular-nums;font-family:var(--mono);line-height:1.3;white-space:nowrap}
.metric-s{display:block;margin-top:4px;color:var(--faint);font-size:13.5px}
.metric-main .metric-s{color:var(--muted)}
.metric-main{grid-column:1/-1;border-color:#2f5770}
.metric-main .metric-v{font-size:clamp(28px,4vw,44px);color:var(--ice);white-space:normal}
.tool-status{margin-top:14px;color:var(--muted);font-size:14px}
.tool-status[data-tone=warn]{color:var(--amber)}
.tool-list{list-style:none;padding:0;margin-top:14px;font-size:14px}
.tool-list li{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:10px 0;border-top:1px solid var(--line-soft)}
.tool-list code{font-family:var(--mono);color:var(--text);overflow-wrap:anywhere}
.tool-list .amt{font-family:var(--mono);color:var(--ink);text-align:right}
.tool-list .sub{grid-column:1/-1;color:var(--faint);font-size:13.5px}
.tool-guide{margin-top:34px}
.tool-stamp{margin-top:30px;color:var(--faint);font-size:13px}

.finder-form{display:grid;gap:8px;max-width:640px}
.finder-form label{color:var(--muted);font-size:14px}
.finder-form input{min-height:52px;padding:0 16px;border:1px solid #33536a;border-radius:4px;background:#06121b;color:var(--ink);font:17px var(--sans)}
.finder-status{margin-top:14px;color:var(--muted);font-size:14.5px}
.finder-results{list-style:none;padding:0;margin-top:10px}
.finder-results li{border-top:1px solid var(--line-soft)}
.finder-results a{display:grid;gap:4px;padding:14px 4px}
.finder-results .f-t{color:var(--ink);font-size:17px}
.finder-results .f-s{color:var(--muted);font-size:14px}
.finder-results .f-c{color:var(--ice);font-size:13px;letter-spacing:.08em}
.lost-links{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.lost-links a{display:inline-flex;min-height:44px;align-items:center;padding:0 16px;border:1px solid var(--line);border-radius:4px}

.ref-group{margin-top:30px}
.ref-group h2{color:var(--ink);font-size:20px;font-weight:500;margin-bottom:8px}
.ref-list{list-style:none;padding:0}
.ref-list li{display:grid;gap:4px;padding:12px 0;border-top:1px solid var(--line-soft);font-size:15px}
.ref-list>li>a{color:var(--ice)}
.ref-checked,.ref-used{color:var(--faint);font-size:13.5px}
.ref-used a{color:var(--muted);border-bottom:1px solid var(--line);white-space:nowrap}

.colophon{position:relative;z-index:1;margin-top:60px;border-top:1px solid var(--line);background:rgba(4,10,15,.94)}
.colophon-inner{width:min(1080px,100% - 40px);margin:0 auto;padding:34px 0 calc(var(--dock-space) + 10px)}
.colophon-brand{display:flex;align-items:center;gap:10px;color:var(--ink);letter-spacing:.2em;text-transform:uppercase;font-size:15px}
.colophon-mark{width:24px;height:24px;color:var(--ice)}
.colophon-note{margin-top:14px;max-width:52em;color:var(--muted);font-size:14px;line-height:1.85}
.colophon-note a{color:var(--text);border-bottom:1px solid var(--line)}
.colophon-links{list-style:none;padding:0;margin-top:16px;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:14px}
.colophon-links a{display:inline-flex;min-height:36px;align-items:center;color:var(--text)}
.colophon-links a:hover{color:var(--ice)}
.colophon-year{margin-top:12px;color:var(--faint);font-size:13px}
.dock{position:fixed;z-index:10;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;width:600px;max-width:calc(100% - 28px);height:64px;padding:6px 10px;border:1px solid #3a5163;border-radius:40px;background:rgba(4,12,19,.9);backdrop-filter:blur(16px)}
.dock a{position:relative;flex:1;display:flex;align-items:center;justify-content:center;height:50px;border-radius:26px;color:var(--muted);font-size:15px;transition:color .15s,background .15s}
.dock a+a:before{content:"";position:absolute;left:0;height:14px;border-left:1px solid #34495a}
.dock a:hover{color:var(--ink);background:#132a38}
.dock a[aria-current]{color:var(--ice)}
.dock a[aria-current]:after{content:"";position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:var(--ice)}

@media (max-width:900px){
  .lead,.chart-shelf{grid-template-columns:1fr;gap:22px}
  .index-grid{grid-template-columns:1fr}
  .compact-list a{grid-template-columns:minmax(0,1fr) auto}
  .compact-lede{grid-column:1/-1}
  .tool-bento{grid-template-columns:1fr}
  .tool-bento .tool-big{grid-row:auto}
  .theme-list a{grid-template-columns:1fr auto}
  .theme-gist{grid-column:1/-1;grid-row:2}
}
@media (max-width:640px){
  :root{--dock-space:96px}
  .masthead{top:16px}
  .brand-word{font-size:16px;letter-spacing:.18em}
  .brand-mark{width:26px;height:26px}
  .masthead-find{font-size:14px}
  .sky{object-position:72% 30%;opacity:.62}
  .at-page .sky{opacity:.22}
  .hero{min-height:auto;align-content:start;row-gap:20px;padding:80px 20px 28px}
  .hero h1{font-size:clamp(28px,8.4vw,38px);margin-top:10px}
  .hero-kicker{font-size:13px;letter-spacing:.12em}
  .hero-intro{font-size:15.5px;line-height:1.75;margin-top:10px}
  .codecard{margin-top:16px;padding:12px 16px}
  .pick h2{font-size:15.5px;margin-bottom:10px}
  .pick-kicker{display:none}
  .codecard-code{font-size:23px}
  .prose .codecard-code{font-size:20px}
  .codecard-note{font-size:14px}
  .reward-chart{padding:14px 10px 10px}.reward-chart .val,.reward-chart .yr{font-size:18px}.reward-chart .unit{font-size:17px}
  .listing,.leaf,.tool,.plain{padding-top:86px}
  .leaf-cover{display:none}
  .prose{font-size:16.5px;line-height:1.9}
  .crumbs a,.leaf-kicker,.leaf-tags a,.leaf-tags span:not(.leaf-tags-label),.theme-chips a,.colophon-links a{display:inline-flex;align-items:center;min-height:44px}
  .leaf-meta a{display:inline-block;padding:11px 0;margin:-11px 0;border-bottom:0;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
  .entry a{grid-template-columns:1fr;padding:15px 2px}
  .entry .entry-time{grid-column:1;grid-row:auto}
  .pick-card{grid-template-columns:1fr}
  .pick-cover{display:none}
  .pick-text{padding:16px 18px 18px}
  .route-line{grid-template-columns:1fr}
  .route-line li{padding:0 0 0 26px}
  .route-line li:before{top:0;bottom:0;left:4px;right:auto;border-top:0;border-left:1px solid #2c4a5e}
  .route-line li:after{top:5px}
  .route-line a{padding:0 0 20px}
  .entry-title{font-size:17px}
  .table-cards table,.table-cards thead,.table-cards tbody,.table-cards tr,.table-cards td{display:block}
  .table-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .table-cards tr{padding:10px 14px;border-bottom:1px solid var(--line)}
  .table-cards tr:last-child{border-bottom:0}
  .table-cards td{padding:4px 0;border:0}
  .table-cards td[data-label]:before{content:attr(data-label);display:block;color:var(--faint);font-size:13px}
  .table-cards td:first-child{color:var(--ink);font-weight:500}
  .dock{height:58px;padding:4px 6px}
  .dock a{font-size:14px;height:48px}
  .tool-panel{padding:16px}
}
@media (max-width:480px){
  .tool-figs{grid-template-columns:1fr;gap:8px}
  .tool-figs>span{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
}
@media (prefers-reduced-motion:no-preference){
  .hero-intro,.at-home .codecard,.hero .pick{animation:rise .7s cubic-bezier(.16,1,.3,1) both}
  .at-home .codecard{animation-delay:.12s}
  .hero .pick{animation-delay:.2s}
  .entry a,.index-grid a,.compact-list a{transition:background .15s,transform .2s cubic-bezier(.16,1,.3,1)}
  .entry a:hover,.index-grid a:hover,.compact-list a:hover{transform:translateX(3px)}
}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
.tool-manual{margin-top:18px;padding-top:16px;border-top:1px dashed #2b4558}
.tool-btn-ghost{background:transparent;color:var(--ice);border:1px solid #3a6078}
.tool-btn-ghost:hover{background:rgba(154,225,250,.08)}
.tool-panel [hidden]{display:none}
.hero h1,.listing-head h1,.leaf-head h1,.tool-head h1,.prose h2,.shelf-head h2,.qa>h2{text-wrap:balance}
.pick-title,.entry-title,.lead-title,.lead-rest-title,.index-title,.compact-title,.route-title,.tool-name,.next-reads li,.route li,.qa-item h3,.prose h3{text-wrap:pretty}
.leaf-lede,.hero-intro{text-wrap:pretty}