/* The Labs overview is independent of the shared project-detail stylesheet. */
.labs-refresh {
  --lb-paper: #fff; --lb-soft: #f1f4f5; --lb-ink: #303b3a; --lb-muted: #596b66;
  --lb-line: #cddad3; --lb-green: #326b55; --lb-blue: #3c6382; --lb-plum: #7b5675; --lb-gold: #85601f;
  --lb-hero: #edf4f0; --lb-hero-ink: #2c463c; --lb-hero-muted: #536b60; --lb-hero-line: #90aa9a;
  --lb-streaks: #f0f6f2; --lb-pst: #eff3f7; --lb-note: #f3eff4; --lb-device: #fff;
  --lb-wash: #dfebe3; --lb-blue-wash: #e0e9f1; --lb-plum-wash: #ebe2ed; --lb-gold-wash: #eee8d9;
  background: var(--lb-paper); color: var(--lb-ink);
}
html[data-theme="dark"] .labs-refresh {
  --lb-paper: #222b29; --lb-soft: #2a3435; --lb-ink: #eef4f0; --lb-muted: #c4d3cb;
  --lb-line: #52675d; --lb-green: #b1dec4; --lb-blue: #b3d5ee; --lb-plum: #dfc1db; --lb-gold: #e4ce95;
  --lb-hero: #34473f; --lb-hero-ink: #f0f6f2; --lb-hero-muted: #c7d8ce; --lb-hero-line: #88a696;
  --lb-streaks: #2d3c34; --lb-pst: #2e3a44; --lb-note: #3a323d; --lb-device: #26312c;
  --lb-wash: #3c5647; --lb-blue-wash: #3d5060; --lb-plum-wash: #514156; --lb-gold-wash: #514b38;
}
html[data-nav-experiment="floating"] body.labs-refresh nav.site-nav:not(.is-scrolled) {
  --masthead-ink: var(--lb-hero-ink); --masthead-muted: var(--lb-hero-muted); --masthead-line: var(--lb-line);
  --masthead-surface: transparent; --masthead-blur: none;
}
.labs-refresh main { background: var(--lb-paper); color: var(--lb-ink); font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif; font-size: 18px; line-height: 1.75; }
.labs-refresh main *, .labs-refresh main *::before, .labs-refresh main *::after { box-sizing: border-box; letter-spacing: 0; }
.labs-refresh main :where(h1,h2,h3,p,ul,ol,dl,dd,figure) { margin: 0; }
.labs-refresh main :where(h1,h2,h3) { color: inherit; text-wrap: balance; }
.labs-refresh main :where(h1,h2) { font-family: "Avenir Next", "Helvetica Neue", Inter, sans-serif; font-weight: 200; line-height: 1.15; }
.labs-refresh main h2 { font-size: 48px; }
.labs-refresh main h3 { font-size: 23px; font-weight: 500; line-height: 1.4; }
.labs-refresh main strong { font-weight: 500; }
.labs-refresh main p { text-wrap: pretty; }
.labs-refresh main a { color: var(--lb-green); text-underline-offset: 5px; }
.labs-refresh main :where(button,summary) { font: inherit; cursor: pointer; }
.labs-refresh main :where(a,button,summary):focus-visible { outline: 2px solid var(--lb-blue); outline-offset: 5px; }
.labs-refresh main [hidden] { display: none !important; }
.labs-refresh main [id] { scroll-margin-top: 124px; }
.labs-refresh main .lucide, .labs-refresh main i[data-lucide] { display: inline-block; width: 22px; height: 22px; flex-shrink: 0; stroke-width: 1.5; }
.lb-shell { width: min(100% - 64px, 1200px); margin-inline: auto; }
.lb-skip { position: fixed; z-index: 10002; top: 20px; left: 20px; padding: 12px 18px; background: #fff; color: #303b3a; transform: translateY(-200%); }
.lb-skip:focus { transform: none; }
.lb-section { padding-block: 88px; }
.labs-refresh .lb-eyebrow { font-size: 14px; font-weight: 550; color: var(--lb-green); line-height: 1.6; margin-bottom: 20px; }
.lb-eyebrow > span { color: var(--lb-muted); margin-left: 8px; font-weight: 400; }
.labs-refresh .lb-text-link { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; margin-top: 25px; font-size: 17px; font-weight: 500; text-decoration: none; }
.lb-text-link:hover { text-decoration: underline !important; }
.lb-text-link .lucide { width: 19px !important; height: 19px !important; }
.lb-hero { padding: 145px 0 46px; background: var(--lb-hero); color: var(--lb-hero-ink); }
.lb-hero-layout { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 68px; align-items: center; }
.labs-refresh .lb-hero h1 { font-size: 72px; line-height: 1.08; }
.labs-refresh .lb-promise { margin-top: 24px; font-family: "Avenir Next", "Helvetica Neue", Inter, sans-serif; font-size: 42px; font-weight: 300; line-height: 1.18; color: var(--lb-green); }
.lb-hero-description { margin-top: 25px !important; color: var(--lb-hero-muted); font-size: 20px; max-width: 460px; }
.lb-hero-figure { min-width: 0; width: 100%; max-width: 600px; justify-self: end; }
.lb-scene { position: relative; width: 100%; height: 476px; }
#lb-hero-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.lb-scene-stage { position: absolute; display: flex; align-items: center; gap: 20px; height: 110px; }
.lb-explore { top: 8px; left: 4%; width: 75%; }
.lb-build { top: 176px; left: 24%; width: 76%; }
.lb-stage-symbol { display: grid; place-items: center; width: 68px; height: 68px; flex: 0 0 68px; border: 1px solid var(--lb-hero-line); border-radius: 50%; color: var(--lb-gold); background: var(--lb-gold-wash); }
.lb-build .lb-stage-symbol { color: var(--lb-plum); background: var(--lb-plum-wash); }
.lb-stage-symbol .lucide { width: 28px !important; height: 28px !important; }
.lb-stage-number { display: block; color: var(--lb-hero-muted); font-size: 12px; line-height: 1.5; margin-bottom: 7px; }
.lb-scene-stage strong { display: block; font-size: 25px; line-height: 1.35; }
.lb-scene-stage p { color: var(--lb-hero-muted); font-size: 15px; line-height: 1.65; margin-top: 5px !important; }
.lb-releases { position: absolute; top: 366px; inset-inline: 0; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 32px; }
.labs-refresh .lb-release { display: block; min-width: 0; height: 110px; border-top: 1px solid var(--lb-hero-line); color: var(--lb-hero-ink); text-decoration: none; padding-top: 14px; background: var(--lb-hero); }
.labs-refresh .lb-release > .lucide { display: block; color: var(--lb-green); width: 20px !important; height: 20px !important; margin-bottom: 8px; }
.labs-refresh .lb-release-pst > .lucide { color: var(--lb-blue); }
.lb-release strong { display: block; font-size: 20px; line-height: 1.4; }
.lb-release span { display: block; color: var(--lb-hero-muted); font-size: 13px; line-height: 1.6; margin-top: 4px; }
.lb-release:hover strong { text-decoration: underline; text-underline-offset: 5px; }
.lb-motion-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 26px; min-height: 40px; color: var(--lb-hero-muted); font-size: 13px; }
.lb-motion { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; padding: 0; border: 1px solid var(--lb-hero-line); border-radius: 50%; color: var(--lb-hero-ink); background: transparent; }
.lb-motion:hover { background: var(--lb-wash); }
.lb-motion > span { display: flex; align-items: center; }
.lb-motion .lucide { width: 16px !important; height: 16px !important; }
.lb-motion i, .lb-motion .lucide + .lb-icon-fallback { display: none !important; }
.lb-icon-fallback { font-size: 12px; line-height: 1; }
.lb-scene:not([data-ready]) .lb-build::before { content: ""; position: absolute; height: 44px; border-left: 1px solid var(--lb-hero-line); top: -48px; left: 34px; }
.lb-intro-band { border-bottom: 1px solid var(--lb-line); background: var(--lb-paper); padding-block: 26px; }
.lb-intro-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.lb-intro-grid > div { display: flex; align-items: flex-start; gap: 14px; }
.lb-intro-grid .lucide { color: var(--lb-green); margin-top: 3px; }
.lb-intro-grid > div:nth-child(2) .lucide { color: var(--lb-blue); }
.lb-intro-grid > div:nth-child(3) .lucide { color: var(--lb-plum); }
.lb-intro-grid strong { display: block; font-size: 16px; line-height: 1.5; }
.lb-intro-grid p > span { display: block; font-size: 14px; line-height: 1.65; color: var(--lb-muted); margin-top: 4px; }
.lb-project-heading { padding-block: 82px 50px; }
.lb-split-heading { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 80px; align-items: start; }
.lb-split-heading p { color: var(--lb-muted); }
.lb-split-heading p + p { margin-top: 22px; }
.lb-project { padding-block: 74px; }
.lb-streaks { background: var(--lb-streaks); }
.lb-pst { background: var(--lb-pst); }
.lb-project-layout { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap: 90px; align-items: center; }
.labs-refresh .lb-project h3 { font-family: "Avenir Next", "Helvetica Neue", Inter, sans-serif; font-size: 46px; font-weight: 300; line-height: 1.1; }
.labs-refresh .lb-project-promise { font-size: 27px; line-height: 1.35; color: var(--lb-green); margin-top: 18px; margin-bottom: 24px; }
.lb-project-copy > p:not(.lb-eyebrow,.lb-project-promise) { color: var(--lb-muted); }
.lb-project-copy > p + p { margin-top: 18px; }
.lb-feature-list { list-style: none; padding: 0; margin-top: 28px !important; border-top: 1px solid var(--lb-line); }
.lb-feature-list li { display: flex; gap: 16px; padding-top: 20px; font-size: 16px; line-height: 1.75; color: var(--lb-muted); }
.lb-feature-list .lucide { color: var(--lb-green); margin-top: 3px; width: 20px !important; height: 20px !important; }
.lb-pst .lb-eyebrow, .lb-pst .lb-project-promise, .lb-pst .lb-text-link, .lb-pst .lb-feature-list .lucide { color: var(--lb-blue); }
.lb-project-copy code { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-size: 16px; color: var(--lb-ink); overflow-wrap: anywhere; }
.lb-project-links { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 28px; }
.labs-refresh .lb-checksum { font-size: 14px; color: var(--lb-blue); }
.lb-project-visual { width: 100%; min-width: 0; }
.lb-project-visual > figcaption { color: var(--lb-muted); text-align: center; font-size: 13px; line-height: 1.65; margin-top: 22px; }
.lb-phone { width: min(100%, 320px); padding: 13px; margin-inline: auto; border: 1px solid var(--lb-line); border-radius: 36px; background: var(--lb-device); box-shadow: 0 15px 40px #172e2010; }
.lb-phone-top { width: 66px; height: 5px; border-radius: 4px; background: var(--lb-line); margin: 7px auto 20px; }
.lb-phone-content { padding: 14px 12px 28px; }
.lb-phone-day { font-size: 14px; font-weight: 500; color: var(--lb-green); }
.labs-refresh .lb-phone-title { font-size: 30px; line-height: 1.25; font-family: "Avenir Next", "Helvetica Neue", Inter, sans-serif; font-weight: 400; margin-top: 13px; }
.lb-phone-remaining { margin-top: 18px !important; padding-bottom: 18px; font-size: 13px; color: var(--lb-muted); }
.lb-habit { display: flex; align-items: center; gap: 12px; padding: 18px 0; border-top: 1px solid var(--lb-line); }
.lb-habit > .lucide { color: var(--lb-plum); width: 20px !important; height: 20px !important; }
.lb-habit:nth-of-type(3) > .lucide { color: var(--lb-blue); }
.lb-habit > div { flex: 1; }
.lb-habit strong { display: block; font-size: 15px; line-height: 1.5; }
.lb-habit div > span { display: block; color: var(--lb-muted); font-size: 11px; line-height: 1.6; margin-top: 3px; }
.lb-habit-count { color: var(--lb-plum); font-size: 13px; font-variant-numeric: tabular-nums; }
.lb-habit-done { color: var(--lb-green); }
.lb-habit-done > .lucide { color: var(--lb-green); }
.lb-week { border-top: 1px solid var(--lb-line); padding-top: 19px; }
.lb-week > span { color: var(--lb-muted); font-size: 12px; }
.lb-week > div { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 6px; margin-top: 14px; }
.lb-week div > span { display: flex; align-items: center; flex-direction: column; gap: 8px; color: var(--lb-muted); font-size: 10px; line-height: 1.5; }
.lb-week div > span::before { content: ""; width: 17px; height: 17px; border-radius: 50%; background: var(--lb-wash); border: 1px solid var(--lb-line); }
.lb-week div > span:nth-child(-n+4)::before { background: var(--lb-green); border-color: var(--lb-green); }
.lb-terminal { border: 1px solid var(--lb-line); border-radius: 6px; overflow: hidden; background: var(--lb-device); }
.lb-terminal-header { display: flex; align-items: center; gap: 10px; padding: 18px 22px; border-bottom: 1px solid var(--lb-line); background: var(--lb-blue-wash); color: var(--lb-blue); font-size: 13px; line-height: 1.6; }
.lb-terminal-header > span:last-child { color: var(--lb-muted); margin-left: auto; font-size: 11px; }
.lb-terminal-header .lucide { width: 18px !important; height: 18px !important; }
.lb-terminal-body { padding: 30px 24px; font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-size: 14px; line-height: 1.7; }
.lb-terminal-command { color: var(--lb-blue); overflow-wrap: anywhere; padding-bottom: 24px; border-bottom: 1px solid var(--lb-line); }
.lb-terminal-command > span { color: var(--lb-muted); }
.lb-terminal-body dl { margin-top: 20px; }
.lb-terminal-body dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-block: 8px; }
.lb-terminal-body dt { color: var(--lb-muted); overflow-wrap: anywhere; }
.lb-terminal-body dd { color: var(--lb-ink); }
.lb-terminal-footer { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--lb-line); padding: 18px 22px; color: var(--lb-green); font-size: 12px; line-height: 1.5; }
.lb-terminal-footer .lucide { width: 17px !important; height: 17px !important; }
.lb-principles { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 38px; margin-top: 52px; }
.lb-principles article { border-top: 2px solid var(--lb-green); padding-top: 22px; }
.lb-principles article:nth-child(2) { border-color: var(--lb-blue); }
.lb-principles article:nth-child(3) { border-color: var(--lb-plum); }
.lb-principles article > span { display: block; color: var(--lb-green); font-size: 13px; margin-bottom: 18px; }
.lb-principles article:nth-child(2) > span { color: var(--lb-blue); }
.lb-principles article:nth-child(3) > span { color: var(--lb-plum); }
.lb-principles p { font-size: 17px; color: var(--lb-muted); margin-top: 17px !important; }
.lb-questions { background: var(--lb-soft); }
.lb-questions-layout { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 80px; }
.lb-faq details { border-top: 1px solid var(--lb-line); }
.lb-faq details:last-child { border-bottom: 1px solid var(--lb-line); }
.lb-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-block: 24px; font-size: 18px; font-weight: 500; line-height: 1.6; list-style: none; }
.lb-faq summary::-webkit-details-marker { display: none; }
.lb-faq summary > i { display: none !important; }
.lb-faq summary::after { content: "+"; color: var(--lb-blue); }
.lb-faq summary:has(svg)::after { display: none; }
.lb-faq details[open] summary::after { content: "-"; }
.lb-faq summary .lucide { color: var(--lb-blue); width: 18px !important; height: 18px !important; }
.lb-faq details[open] summary .lucide { transform: rotate(45deg); }
.lb-faq details p { padding-bottom: 26px; color: var(--lb-muted); font-size: 17px; }
.lb-close { padding-block: 60px; background: var(--lb-note); }
.lb-close-layout { display: grid; grid-template-columns: minmax(0,.35fr) minmax(0,1fr) 52px; align-items: center; gap: 44px; }
.labs-refresh .lb-close .lb-eyebrow { color: var(--lb-plum); margin: 0; }
.labs-refresh .lb-close h2 { font-size: 36px; }
.lb-close p:not(.lb-eyebrow) { margin-top: 18px; font-size: 17px; color: var(--lb-muted); }
.lb-close-layout > .lucide { width: 42px !important; height: 42px !important; color: var(--lb-plum); }

@media (max-width: 1100px) {
  .lb-hero-layout { gap: 38px; }
  .labs-refresh .lb-hero h1 { font-size: 62px; }
  .labs-refresh .lb-promise { font-size: 38px; }
  .lb-scene-stage { gap: 15px; }
  .lb-stage-symbol { width: 56px; height: 56px; flex-basis: 56px; }
  .lb-scene-stage strong { font-size: 23px; }
  .lb-project-layout, .lb-split-heading, .lb-questions-layout { gap: 48px; }
  .lb-terminal-body { padding: 25px 18px; font-size: 12px; }
  .lb-terminal-header { padding: 16px; gap: 8px; }
  .lb-terminal-header > span:last-child { max-width: 90px; text-align: right; }
}
@media (max-width: 900px) {
  .lb-hero { padding-top: 135px; }
  .lb-hero-layout { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .lb-hero-copy { max-width: 650px; }
  .lb-hero-description { max-width: 590px; }
  .lb-hero-figure { justify-self: center; max-width: 570px; }
  .lb-scene { height: 436px; }
  .lb-scene-stage { height: 94px; }
  .lb-build { top: 143px; }
  .lb-releases { top: 326px; }
  .lb-intro-grid { gap: 22px; }
  .lb-intro-grid > div { gap: 10px; }
  .lb-intro-grid strong { font-size: 15px; }
  .lb-intro-grid p > span { font-size: 13px; }
  .lb-project-layout { gap: 36px; grid-template-columns: minmax(0,1fr) minmax(0,.8fr); }
  .lb-pst .lb-project-layout { grid-template-columns: minmax(0,1fr); }
  .lb-pst .lb-project-visual { max-width: 560px; margin-inline: auto; }
  .lb-terminal-body { font-size: 15px; padding: 30px; }
  .lb-terminal-header { padding: 18px 24px; }
  .lb-terminal-header > span:last-child { max-width: none; }
  .lb-principles { gap: 24px; }
  .lb-close-layout { grid-template-columns: minmax(0,1fr) 52px; gap: 25px; }
  .lb-close .lb-eyebrow { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .lb-shell { width: calc(100% - 40px); }
  .lb-section { padding-block: 60px; }
  .labs-refresh main h2 { font-size: 37px; }
  .lb-project-heading { padding-block: 60px 38px; }
  .lb-split-heading, .lb-questions-layout { grid-template-columns: minmax(0,1fr); gap: 25px; }
  .lb-project { padding-block: 56px; }
  .lb-project-layout { grid-template-columns: minmax(0,1fr); gap: 36px; }
  .lb-project-visual { max-width: 500px; margin-inline: auto; }
  .lb-intro-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .lb-intro-grid > div { gap: 16px; }
  .lb-intro-grid strong { font-size: 16px; }
  .lb-intro-grid p > span { font-size: 14px; }
  .lb-principles { grid-template-columns: minmax(0,1fr); gap: 32px; margin-top: 36px; }
  .lb-principles article > span { margin-bottom: 12px; }
  .lb-close { padding-block: 45px; }
  .lb-close-layout { grid-template-columns: minmax(0,1fr); }
  .lb-close-layout > .lucide { display: none; }
}
@media (max-width: 480px) {
  .lb-shell { width: calc(100% - 36px); }
  .lb-hero { padding: 113px 0 28px; }
  .labs-refresh .lb-hero h1 { font-size: 53px; }
  .labs-refresh .lb-promise { font-size: 35px; margin-top: 18px; }
  .lb-hero-description { font-size: 18px; line-height: 1.65; margin-top: 20px !important; }
  .labs-refresh .lb-eyebrow { font-size: 13px; }
  .lb-hero .lb-eyebrow { margin-bottom: 12px; }
  .lb-hero-layout { gap: 18px; }
  .labs-refresh .lb-hero .lb-text-link { margin-top: 18px; }
  .lb-eyebrow > span { display: block; margin: 4px 0 0; }
  .lb-scene { height: 254px; }
  .lb-scene-stage { gap: 10px; width: 46%; height: 90px; top: 0; }
  .lb-explore { left: 0; }
  .lb-build { left: 54%; }
  .lb-stage-symbol { width: 32px; height: 32px; flex-basis: 32px; }
  .lb-stage-symbol .lucide { width: 18px !important; height: 18px !important; }
  .lb-scene-stage strong { font-size: 18px; }
  .lb-scene-stage p { display: none; }
  .lb-stage-number { font-size: 10px; }
  .lb-releases { top: 154px; gap: 20px; }
  .labs-refresh .lb-release { height: 100px; }
  .lb-release strong { font-size: 17px; }
  .lb-release span { font-size: 11px; }
  .lb-motion-row { font-size: 12px; margin-top: 16px; }
  .lb-scene:not([data-ready]) .lb-build::before { height: 32px; top: auto; bottom: -36px; left: 16px; }
  .labs-refresh .lb-project h3 { font-size: 39px; }
  .labs-refresh .lb-project-promise { font-size: 25px; }
  .lb-terminal-body { font-size: 12px; padding: 24px 16px; }
  .lb-terminal-header { padding: 16px; font-size: 12px; }
  .lb-terminal-header > span:last-child { font-size: 10px; }
  .lb-terminal-footer { padding: 18px 16px; font-size: 11px; }
  .lb-feature-list li { font-size: 16px; gap: 13px; }
  .lb-faq summary { font-size: 17px; }
  .labs-refresh .lb-close h2 { font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .labs-refresh main *, .labs-refresh main *::before, .labs-refresh main *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
