.developer-story{background:var(--paper);color:var(--ink)}.developer-intro{padding:70px var(--page-gutter) 50px}.developer-intro h1{font-family:var(--font-display);font-size:clamp(64px,8vw,122px);letter-spacing:-.065em;font-weight:400;line-height:.96;margin:30px 0}.developer-intro h1 span{color:var(--moss)}.developer-intro>div{display:flex;justify-content:space-between;gap:40px;align-items:flex-end}.developer-intro p{font-size:16px;line-height:1.7;max-width:470px;margin:0}.developer-stage{font-size:10px;line-height:1.6;border:1px solid #bac2af;padding:10px 14px;max-width:230px}.component-playground{margin:0 var(--page-gutter) 80px;display:grid;grid-template-columns:1fr 1.1fr;border:1px solid #b7c0aa}.component-code{background:var(--ink);color:var(--paper);padding:30px;min-width:0}.component-file{display:flex;justify-content:space-between;gap:20px;font-size:11px;border-bottom:1px solid #485140;padding-bottom:25px}.component-file>span:last-child{color:var(--acid)}.component-choices{display:flex;gap:6px;margin-top:22px;flex-wrap:wrap}.component-choices button{background:none;color:#c6d0bc;border:1px solid #485140;padding:10px 12px;font-size:10px}.component-choices button[aria-pressed=true]{background:var(--acid);color:var(--ink);border-color:var(--acid)}.component-code pre{font-size:clamp(11px,1.2vw,16px);line-height:1.9;color:var(--acid);padding:30px 0;overflow:auto;margin:0}.component-code>p{font-size:11px;line-height:1.7;color:#bbc6ae;max-width:40ch;margin:0}.component-render{padding:35px;display:flex;align-items:center;justify-content:center;min-width:0}.component-render>.preview-website{width:100%}.component-render .preview-site-hero h3{font-size:38px}.component-render>.preview-bio{width:100%;max-width:260px}.component-guided{padding:25px 0}.component-guided h3{font-size:49px}.component-guided ol{padding-left:20px;margin:25px 0;font-size:13px;line-height:2.4}.developer-principles{padding:0 var(--page-gutter) 80px;display:grid;grid-template-columns:1fr 1fr;grid-gap:8vw;gap:8vw}.developer-boundary h2,.developer-principles h2{font-family:var(--font-display);font-size:clamp(42px,5vw,72px);line-height:1.02;letter-spacing:-.055em;font-weight:400;margin:24px 0}.developer-principles article{padding:23px 0;border-top:1px solid #bac2af}.developer-principles article h3{font-size:21px;font-weight:400;letter-spacing:-.035em;margin:0 0 13px}.developer-principles article p{font-size:13px;line-height:1.8;margin:0;color:#59624f}.developer-boundary{padding:60px var(--page-gutter);background:var(--acid);display:grid;grid-template-columns:1fr 1fr;grid-gap:25px 8vw;gap:25px 8vw;align-items:center}.developer-boundary h2{margin-bottom:0}.developer-boundary p{font-size:14px;line-height:1.8;max-width:430px}.developer-boundary>.button,.developer-boundary>.story-link{width:-moz-fit-content;width:fit-content}.developer-story :focus-visible{outline:2px solid currentColor;outline-offset:4px}@media (max-width:850px){.component-playground{grid-template-columns:1fr}.component-code pre{font-size:14px}.component-render{min-height:480px}.developer-intro h1{font-size:80px}.developer-principles{gap:35px}.developer-intro>div{align-items:flex-start}.developer-stage{min-width:150px}}@media (max-width:600px){.developer-intro{padding:40px 24px}.developer-intro h1{font-size:54px}.developer-intro>div{display:block}.developer-intro p{font-size:14px}.developer-stage{display:inline-block;margin-top:20px;max-width:none}.component-playground{margin:0 18px 50px}.component-code{padding:24px 20px}.component-code pre{font-size:11px}.component-render{padding:22px;min-height:420px}.component-render .preview-site-hero h3{font-size:36px}.component-guided h3{font-size:39px}.developer-principles{grid-template-columns:1fr;padding:0 24px 45px;gap:15px}.developer-boundary h2,.developer-principles h2{font-size:46px}.developer-boundary{display:block;padding:45px 24px}.developer-boundary p{font-size:13px;margin:25px 0}.developer-boundary>.story-link{display:flex;margin-top:24px}}