/* Shared LinPad design: used by the landing page, documentation and project pages. */
@font-face { font-family:"LinPad Dot"; src:url("/fonts/linpad-dot.woff2") format("woff2"); font-weight:800; font-style:normal; font-display:swap; }
:root,.dark-scope,:root[data-theme="light"],:root[data-theme="light"] .dark-scope {
  --bg:#f2f2ef; --bg-2:#e9e9e5; --surface:#fafaf8; --surface-2:#e5e5e0;
  --text:#1b1c1a; --muted:#676962; --line:#d1d2cb; --accent:#bd3e2d; --accent-2:#bd3e2d; --accent-3:#bd3e2d; --accent-ink:#fff;
  --code-bg:#e9e9e5; --warn:#bd3e2d; --ok:#507351; --glow:transparent;
  --display:"LinPad Dot","JetBrains Mono",monospace; --maxw:1280px; --nav-h:80px; --radius:20px; color-scheme:light;
}
:root[data-theme="dark"],:root[data-theme="dark"] .dark-scope {
  --bg:#101111; --bg-2:#1a1c1c; --surface:#202323; --surface-2:#292d2d;
  --text:#f4f4ee; --muted:#b9bcb9; --line:#414646; --accent:#ff6653; --accent-2:#ff6653; --accent-3:#ff6653; --accent-ink:#101111;
  --code-bg:#1a1c1c; --warn:#ff6653; --ok:#afc4a5; color-scheme:dark;
}
body { font-size:16px; line-height:1.65; }
h1,h2 { font-family:var(--display); font-weight:800; line-height:1.25; letter-spacing:-.035em; }
h3,h4 { font-family:var(--mono); font-weight:400; line-height:1.4; letter-spacing:-.03em; }
.wrap { width:min(var(--maxw),100% - 96px); }
.narrow { width:min(820px,100% - 96px); }
.gnav { background:var(--bg); border-bottom:1px solid var(--line); backdrop-filter:none; -webkit-backdrop-filter:none; }
.gnav-inner { width:min(var(--maxw),100% - 96px); gap:24px; }
.brand { font:400 1.35rem var(--mono); letter-spacing:-.07em; gap:10px; }
.brand img { display:none; }
.brand::before { content:"[_]"; color:var(--accent); font:400 1.1rem var(--mono); }
.gnav-links { margin-left:24px; gap:8px; }
.gnav-links a { padding:0 12px; font:400 .78rem var(--mono); }
.gnav-tools { margin-left:auto; }
.gnav-cta { min-height:42px; padding:0 20px; font:400 .78rem var(--mono); border-radius:24px; }
.icon-btn { border-radius:10px; }
.btn { min-height:52px; gap:14px; border-radius:28px; padding:0 22px; font:400 .85rem var(--mono); transform:none!important; }
.btn-primary { background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.btn-primary:hover { background:var(--text); border-color:var(--text); color:var(--bg); opacity:1; }
.btn-small { min-height:44px; padding:0 16px; font-size:.75rem; }
.btn-big { min-height:58px; font-size:.86rem; }
.btn-ghost { background:transparent; color:var(--text); }
body:not(.home) .page-head { padding:64px 0 34px; margin-bottom:30px; border-bottom:1px solid var(--line); }
body:not(.home) .page-head h1 { font:800 clamp(2.6rem,5.5vw,4.4rem)/1.25 var(--display); letter-spacing:-.035em; margin:0 0 24px; }
body:not(.home) .page-head p { font-size:1.08rem; line-height:1.7; margin-bottom:16px; }
body:not(.home) .page-head .kicker { margin-bottom:22px; font:.68rem var(--mono); letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
body:not(.home) .kicker:not(:has(span))::before { content:none; }
body:not(.home) .h-md { font:800 clamp(1.5rem,2.6vw,2.1rem)/1.25 var(--display); }
body:not(.home) .grid { gap:24px; }
body:not(.home) .card { background:var(--surface); border-radius:20px; padding:28px; }
body:not(.home) .card .ico { border-radius:50%; background:var(--bg-2); width:44px; height:44px; }
body:not(.home) .card h3 { margin-bottom:16px; }
body:not(.home) .card p { font-size:.92rem; line-height:1.7; }
body:not(.home) .callout { border-radius:16px; padding:22px 24px; }
body:not(.home) .prose h2 { padding-top:8px; margin-top:56px; font-size:clamp(1.65rem,3vw,2.2rem); }
body:not(.home) .prose h2:first-child { margin-top:0; }
body:not(.home) .prose h3 { font-size:1rem; margin-top:28px; }
body:not(.home) .prose p,body:not(.home) .prose li { line-height:1.75; }
body:not(.home) .prose code { overflow-wrap:anywhere; }
body:not(.home) .shot { padding:8px; border-radius:20px; background:var(--surface); }
body:not(.home) .shot picture { display:block; overflow:hidden; border-radius:12px; }
body:not(.home) .shot figcaption { padding:18px 12px 14px; font-size:.82rem; }
body:not(.home) .shot figcaption b { font:.9rem var(--mono); margin-bottom:8px; }
body:not(.home) .shot img { height:auto; }
body:not(.home) .steps-list { gap:16px; }
body:not(.home) .steps-list > li { padding:24px 24px 24px 80px; border-radius:20px; }
body:not(.home) .steps-list > li::before { background:var(--text); color:var(--bg); left:22px; top:24px; }
body:not(.home) .steps-list h3 { margin:0 0 9px; }
body:not(.home) details { border-radius:16px; background:var(--surface); margin-bottom:14px; }
body:not(.home) summary { font:400 .9rem/1.6 var(--mono); padding:22px 24px; }
body:not(.home) summary::after { color:var(--accent); font-size:1.15rem; }
body:not(.home) details > div { padding:0 24px 24px; }
body:not(.home) .doc { grid-template-columns:210px minmax(0,1fr); gap:64px; padding-top:14px; }
body:not(.home) .toc { font:.74rem/1.6 var(--mono); border-top:2px solid var(--accent); padding-top:14px; }
body:not(.home) .toc a { border-radius:22px; min-height:40px; padding:10px 14px; }
body:not(.home) .table-wrap { border-radius:16px; }
body:not(.home) th { font:400 .76rem var(--mono); background:var(--surface); padding:16px; }
body:not(.home) td { font-size:.86rem; }
body:not(.home) .theme-filters button { font:.75rem var(--mono); min-height:46px; }
body:not(.home) .palette { border-radius:16px; }
body:not(.home) .palette .meta { padding:16px; }
body:not(.home) .palette .actions a { border-radius:24px; font-size:.7rem; }
body:not(.home) .dl-grid { gap:24px; }
body:not(.home) .dl-card { border-radius:22px; padding:30px; }
body:not(.home) .dl-main { background:var(--surface); }
body:not(.home) .dl-card h2 { font-size:clamp(1.7rem,2.9vw,2.4rem); }
body:not(.home) .dl-card p { font-size:.93rem; }
body:not(.home) .dl-facts { margin-top:30px; }
body:not(.home) .copy { border-radius:12px; background:var(--bg-2); }
body:not(.home) .copy code { font-size:.7rem; }
body:not(.home) .dl-icon { background:transparent; }
body:not(.home) .tablet::before,body:not(.home) .tablet-screen::after { background:none; }
body:not(.home) .tablet { border:1px solid #868d87; box-shadow:inset 0 0 0 2px #363c37,0 20px 28px -18px #0008; }
.site-footer { background:var(--bg); margin:0; padding-top:64px; border-top:1px solid var(--line); }
.site-footer .foot-top { gap:70px; padding-bottom:48px; }
.site-footer .foot-cols { gap:40px; }
.site-footer h2 { font:400 .72rem var(--mono); letter-spacing:0; color:var(--text); margin-bottom:18px; }
.site-footer p,.site-footer li { font-size:.82rem; line-height:1.65; }
.site-footer li { margin-bottom:6px; }
.site-footer .foot-status { font:.68rem/1.7 var(--mono); }
.site-footer .dot { width:5px; height:5px; background:var(--accent); box-shadow:none; }
.site-footer .legal { padding:26px 0; }
.site-footer .legal p { font-size:.66rem; line-height:1.8; }
.footer-social { display:flex; align-items:center; gap:10px; min-height:40px; text-decoration:none; }
.footer-social svg { width:18px; height:18px; flex-shrink:0; color:var(--text); }
.footer-social:hover svg { color:var(--accent); }
@media(min-width:801px) { .menu-btn { display:none; } .gnav-links { display:flex; position:static; flex-direction:row; border:0; padding:0; background:none; } }
@media(max-width:1100px) { .wrap,.gnav-inner { width:calc(100% - 56px); } .gnav-inner { gap:18px; } .gnav-links { gap:0; margin-left:0; } .gnav-links a { padding:0 9px; } .site-footer .foot-top { gap:40px; } .site-footer .foot-cols { gap:24px; } }
@media(max-width:900px) { body:not(.home) .doc { grid-template-columns:1fr; gap:32px; } body:not(.home) .toc { position:static; } body:not(.home) .toc ol { grid-template-columns:1fr 1fr; } .site-footer .foot-top { grid-template-columns:1fr; gap:36px; } }
@media(max-width:800px) { .gnav-links { top:80px; padding:8px 24px 20px; } .gnav-links a { font-size:.9rem; } body:not(.home) .page-head { padding-top:42px; } body:not(.home) .page-head h1 { font-size:clamp(2.5rem,6.4vw,3.6rem); } }
@media(max-width:540px) { .wrap,.gnav-inner,.narrow { width:calc(100% - 40px); } .gnav-inner { gap:12px; } .brand { font-size:1.05rem; gap:6px; } .brand::before { font-size:.9rem; } .gnav-cta { padding:0 12px; } .gnav-tools { gap:0; } .gnav-tools a.icon-btn { display:none; } .gnav-links { left:0; right:0; width:100%; } body:not(.home) .page-head { padding:36px 0 22px; margin-bottom:24px; } body:not(.home) .page-head p { font-size:.97rem; } body:not(.home) .page-head h1 { font-size:2.5rem; overflow-wrap:anywhere; } body:not(.home) .dl-card { padding:24px 20px; } body:not(.home) .card { padding:24px 20px; } body:not(.home) .steps-list > li { padding:22px 18px 22px 62px; } body:not(.home) .steps-list > li::before { left:14px; top:22px; width:32px; height:32px; } body:not(.home) summary { padding:18px; font-size:.76rem; } body:not(.home) details > div { padding:0 18px 20px; } body:not(.home) .toc ol { grid-template-columns:1fr; } body:not(.home) .copy { flex-wrap:wrap; } body:not(.home) .copy code { flex-basis:100%; } .site-footer .foot-cols { grid-template-columns:1fr 1fr; gap:28px 20px; } .site-footer .foot-top { gap:36px; } .site-footer .legal p { font-size:.63rem; } .footer-social { font-size:.76rem; } }
body:not(.home) .dl-card,body:not(.home) .steps-list > li { min-width:0; }
body:not(.home) .steps-list { grid-template-columns:minmax(0,1fr); }
body:not(.home) .dl-facts .sha { display:block; white-space:normal; overflow-wrap:anywhere; word-break:break-all; }
body:not(.home) .path { max-width:100%; }
body:not(.home) .path span { min-width:0; overflow-wrap:anywhere; }
@media(max-width:900px) { body:not(.home) .dl-grid { grid-template-columns:minmax(0,1fr); } }
[hidden] { display:none!important; }

/* A small, readable hierarchy shared by the guide and project pages. */
.seo-breadcrumb { padding-top: 24px; }
.seo-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; font: 12px/1.6 "JetBrains Mono", monospace; color: var(--muted); }
.seo-breadcrumb li + li::before { content: "/"; margin-right: 10px; opacity: .5; }
.seo-breadcrumb a { color: inherit; text-decoration: none; }
.seo-breadcrumb a:hover { text-decoration: underline; }

/* Guides use the same display face, with quieter reading surfaces. */
.guide-start { display:grid; grid-template-columns:240px minmax(0,1fr); gap:40px; padding:18px 0 42px; }
.guide-start h2 { font-size:1.7rem; margin:0; }
.guide-start p { max-width:740px; color:var(--muted); margin:0; }
.guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; padding-bottom:64px; }
.guide-card { display:flex; flex-direction:column; align-items:flex-start; color:var(--text); text-decoration:none; padding:36px; border:1px solid var(--line); border-radius:20px; background:var(--surface); }
.guide-card:hover { border-color:var(--accent); }
.guide-category { font:.68rem/1.6 var(--mono); text-transform:uppercase; letter-spacing:.04em; color:var(--accent); }
.guide-card h2 { font-size:clamp(1.8rem,3vw,2.6rem); margin:28px 0 18px; }
.guide-card p { color:var(--muted); margin:0 0 32px; }
.guide-read { display:flex; justify-content:space-between; width:100%; margin-top:auto; padding-top:20px; border-top:1px solid var(--line); font:.76rem var(--mono); }
.guide-read span { color:var(--accent); }
.guide-footnote { border-top:1px solid var(--line); padding:36px 0 72px; }
.guide-footnote h2 { font-size:1.8rem; }
.guide-footnote p { max-width:840px; color:var(--muted); }
.guide-meta { display:flex; flex-wrap:wrap; gap:10px 24px; margin-top:28px; font:.68rem/1.6 var(--mono); color:var(--muted); }
.guide-article .prose { max-width:900px; font-size:1.04rem; }
.guide-article .prose > p { max-width:76ch; }
.guide-article .prose pre { font-size:.78rem; line-height:1.8; border:1px solid var(--line); }
.guide-article .prose kbd { white-space:nowrap; }
.guide-capture { margin:0 0 44px; padding:8px; border-radius:20px; border:1px solid var(--line); background:var(--surface); }
.guide-capture picture { display:block; border-radius:12px; overflow:hidden; }
.guide-capture img { width:100%; height:auto; display:block; }
.guide-capture figcaption { font:.66rem/1.8 var(--mono); color:var(--muted); padding:16px 12px 8px; }
.guide-back { display:block; margin-top:18px; padding:10px 14px; }
.guide-related { margin-top:56px; border-top:1px solid var(--line); padding-top:26px; }
.guide-related h2 { margin-top:0!important; }
.guide-related ul { list-style:none; padding:0!important; display:grid; grid-template-columns:1fr 1fr; gap:12px 24px; }
.guide-related a { display:block; padding:12px 0; }
.guide-cta { margin-top:40px; padding:28px; background:var(--surface); border:1px solid var(--line); border-radius:20px; }
.guide-cta h2 { margin-top:0!important; }
.guide-cta .text-link { display:inline-block; margin:18px 0 0 20px; }
.lp-guides { padding-top:80px; padding-bottom:80px; }
.lp-guides .guide-grid { padding-bottom:0; width:100%; grid-template-columns:repeat(3,minmax(0,1fr)); }
.lp-guides .guide-card { padding:28px; }
.lp-guides .guide-card h2 { font-size:1.8rem; }
@media(max-width:1000px) {
  .menu-btn { display:inline-grid; }
  .gnav-links { display:none; position:absolute; top:80px; left:0; right:0; flex-direction:column; margin:0; padding:8px 24px 20px; background:var(--bg); border-bottom:1px solid var(--line); }
  .gnav-links.open { display:flex; }
  .gnav-links a { min-height:52px; font-size:.9rem; }
  .lp-guides .guide-grid { grid-template-columns:1fr; }
}
@media(max-width:700px) { .guide-start { grid-template-columns:1fr; gap:16px; } .guide-grid { grid-template-columns:1fr; } .guide-card { padding:26px; } .guide-related ul { grid-template-columns:1fr; } .guide-article .prose { font-size:.96rem; } .guide-cta { padding:22px; } .guide-cta .text-link { margin-left:0; display:block; } .lp-guides { padding-top:56px; padding-bottom:56px; } }

/* A first-person story, with a workbench rather than a corporate biography. */
.about-head { position:relative; }
.about-note { display:flex; align-items:center; gap:14px; margin-top:30px; font:.7rem/1.8 var(--mono); color:var(--muted); }
.about-note img { flex-shrink:0; }
.about-content { padding-bottom:88px; }
.about-content .kicker { font:.68rem/1.7 var(--mono); color:var(--accent); text-transform:uppercase; letter-spacing:.05em; }
.about-content h2 { font-size:clamp(1.8rem,3.5vw,2.8rem); margin:20px 0 28px; }
.about-story { max-width:880px; padding:40px 0; }
.about-story p:not(.kicker),.about-projects > p:not(.kicker),.about-invite > p:not(.kicker) { max-width:76ch; line-height:1.85; font-size:1.04rem; }
.about-workbench { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:64px; border-block:1px solid var(--line); padding:56px 0; margin:24px 0 56px; }
.about-workbench p { color:var(--muted); }
.about-specs { margin:28px 0 0; font:.75rem/1.7 var(--mono); }
.about-specs > div { display:grid; grid-template-columns:120px minmax(0,1fr); gap:20px; padding:16px 0; border-top:1px solid var(--line); }
.about-specs dt { color:var(--muted); }
.about-specs dd { margin:0; }
.about-projects { padding:12px 0 56px; }
.about-project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:32px 0; }
.about-project-grid article { padding:32px; border:1px solid var(--line); background:var(--surface); border-radius:20px; }
.about-project-grid h3 { margin:28px 0 18px; font-size:1.25rem; }
.about-project-grid p { color:var(--muted); }
.about-project-grid a { display:inline-block; margin-top:12px; font:.76rem/1.8 var(--mono); }
.about-invite { border-top:1px solid var(--line); padding:52px 0 0; }
.about-invite .hero-actions { margin-top:32px; }
.about-signature { font:1.05rem var(--mono)!important; margin-top:36px; color:var(--muted); }
.lp-about { padding-top:72px; padding-bottom:72px; border-top:1px solid var(--line); }
.lp-about .kicker { color:var(--accent); font:.68rem var(--mono); text-transform:uppercase; letter-spacing:.05em; }
.lp-about h2 { font-size:clamp(2rem,4vw,3.2rem); margin:24px 0; }
.lp-about p:not(.kicker) { max-width:720px; line-height:1.8; color:var(--muted); }
@media(max-width:800px) { .about-workbench { grid-template-columns:1fr; gap:20px; padding:36px 0; } .about-project-grid { grid-template-columns:1fr; } .about-story p:not(.kicker),.about-projects > p:not(.kicker),.about-invite > p:not(.kicker) { font-size:.97rem; } .about-project-grid article { padding:26px; } }
@media(max-width:420px) { .about-specs > div { grid-template-columns:100px minmax(0,1fr); gap:12px; } .about-note { font-size:.63rem; } }