:root {
    color-scheme: dark;
    --bg: #07111f;
    --panel: #0d1b2d;
    --panel-2: #10243b;
    --text: #eef6ff;
    --muted: #9fb1c5;
    --line: #29415d;
    --blue: #43a5ff;
    --orange: #ff9d42;
    --cyan: #5ce1d4;
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(circle at 15% 0, #102b49 0, var(--bg) 38rem); color: var(--text); line-height: 1.65; }
a { color: var(--blue); text-underline-offset: .2em; }
a:focus-visible { outline: .2rem solid var(--orange); outline-offset: .25rem; border-radius: .2rem; }
.hd, .mn, .ct, .ft { width: min(74rem, calc(100% - 2rem)); margin-inline: auto; }
.hd { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.25rem 0; }
.hd-brand { color: var(--text); font-weight: 850; font-size: 1.25rem; text-decoration: none; letter-spacing: -.03em; }
.hd-brand span { color: var(--orange); }
.mn { border-block: 1px solid var(--line); }
.mn ol { display: flex; flex-wrap: wrap; gap: 1.25rem; list-style: none; padding: .8rem 0; margin: 0; }
.mn a { color: var(--muted); text-decoration: none; font-weight: 700; }
.ct section { padding: 4.5rem 0; }
.hero { min-height: 24rem; display: grid; align-content: center; max-width: 54rem; }
.hero h1 { margin: 0; font-size: clamp(3rem, 9vw, 6.8rem); line-height: .95; letter-spacing: -.07em; }
.hero > p:last-child { color: var(--muted); font-size: clamp(1.1rem, 2vw, 1.4rem); max-width: 44rem; }
.eyebrow, .tool-kicker, .readme-type { color: var(--orange); text-transform: uppercase; letter-spacing: .14em; font-size: .74rem; font-weight: 850; }
.section-intro { max-width: 50rem; margin-bottom: 2rem; }
.section-intro h2, .about h2 { margin: .1rem 0 .5rem; font-size: clamp(2rem, 5vw, 3.6rem); letter-spacing: -.04em; }
.section-intro > p:last-child, .about p { color: var(--muted); }
.tools-grid, .readmes-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: 1.25rem; }
.tool-card, .readme-card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 1rem; padding: 1.4rem; background: linear-gradient(145deg, color-mix(in srgb, var(--panel-2) 86%, transparent), var(--panel)); box-shadow: 0 1rem 3rem #0005; }
.tool-card h3, .readme-card h3 { margin: .2rem 0 .65rem; font-size: 1.5rem; line-height: 1.15; }
.tool-card header > p:last-child, .readme-card > p { color: var(--muted); }
.tool-card dl { margin: auto 0 1.25rem; }
.tool-card dl div { display: grid; grid-template-columns: 7rem 1fr; border-top: 1px solid var(--line); padding: .55rem 0; }
.tool-card dt { color: var(--muted); }
.tool-card dd { margin: 0; }
.tool-cta, .readme-link { display: inline-flex; align-self: flex-start; margin-top: auto; padding: .7rem 1rem; border-radius: .55rem; background: var(--blue); color: #04101d; font-weight: 850; text-decoration: none; }
.readmes-section { border-block: 1px solid var(--line); }
.readme-card { border-left: .25rem solid var(--cyan); }
.readme-link { background: transparent; color: var(--cyan); border: 1px solid var(--cyan); }
.tag-list, .tool-links { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; padding: 0; margin: 1rem 0 1.25rem; }
.tag-list li { border: 1px solid var(--line); color: var(--muted); border-radius: 999px; padding: .2rem .6rem; font-size: .78rem; }
.availability { margin-top: auto; color: var(--muted); border-left: .2rem solid var(--orange); padding-left: .8rem; }
.ft { border-top: 1px solid var(--line); padding: 1.5rem 0 3rem; color: var(--muted); }
@media (max-width: 40rem) {
    .hd { align-items: flex-start; flex-direction: column; }
    .ct section { padding: 3.2rem 0; }
    .tool-card dl div { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }