.lesson-launch { display:grid; grid-template-columns:minmax(0, 1fr) minmax(330px, .75fr); gap:clamp(38px, 7vw, 130px); align-items:end; padding:clamp(58px, 9vw, 128px) clamp(22px, 8vw, 128px) clamp(48px, 7vw, 100px); background:#0d2340; color:#f9f6ef; }.lesson-launch h1 { font-size:clamp(52px, 7vw, 94px); }.lesson-launch > div > p:not(.eyebrow) { max-width:570px; margin:25px 0 30px; color:#e1dfd8; font-size:17px; }.username-task { grid-column:1; align-self:start; max-width:560px; padding:21px 0 0; border-top:3px solid #b8922a; }.username-task h2 { color:#f9f6ef; font-family:"Cormorant Garamond", Georgia, serif; font-size:29px; font-weight:600; line-height:1.05; }.username-task p:not(.eyebrow) { margin:9px 0 17px; color:#d9d6cf; font-size:13px; }.username-examples { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:17px 0 12px; }.username-examples > div { padding:11px; border:1px solid rgba(249,246,239,.2); }.username-examples > div:last-child { border-color:rgba(184,146,42,.6); }.username-examples span,.username-examples code { display:block; }.username-examples span { margin-bottom:5px; color:#b8922a; font-family:"JetBrains Mono", monospace; font-size:10px; text-transform:uppercase; }.username-examples code { color:#f9f6ef; font-family:"JetBrains Mono", monospace; font-size:11px; line-height:1.7; }.username-check { color:#f9f6ef !important; font-weight:600; }.username-task a { display:inline-block; font-size:13px; font-weight:600; }.username-task a span { padding-left:6px; }.github-action { margin-right:16px; padding:9px 12px; background:#b8922a; color:#0d2340; }.github-action span { color:#0d2340; }.username-guide-link { color:#f9f6ef; border-bottom:1px solid #b8922a; padding:8px 0; }.username-guide-link span { color:#b8922a; }.today-steps { margin:0; padding:0; list-style:none; border-top:1px solid rgba(249,246,239,.22); }.today-steps li { display:grid; grid-template-columns:34px 1fr; gap:13px; padding:16px 0; border-bottom:1px solid rgba(249,246,239,.22); }.today-steps span { color:#b8922a; font-family:"JetBrains Mono", monospace; font-size:11px; }.today-steps strong { display:block; font-size:15px; }.today-steps small { display:block; margin-top:3px; color:#d9d6cf; font-size:12px; }
.build-status { display:grid; grid-template-columns:minmax(0, 1fr) minmax(280px, .45fr); gap:40px; padding:clamp(34px, 5vw, 64px) clamp(22px, 8vw, 128px); border-bottom:1px solid #d8d0c0; }.build-status h2 { color:#0d2340; font-size:clamp(31px, 3vw, 44px); }.build-status p:not(.eyebrow) { max-width:620px; color:#655f55; font-size:14px; }.build-status code { color:#0d2340; font-family:"JetBrains Mono", monospace; font-size:.9em; }.build-time { align-self:center; padding-left:28px; border-left:3px solid #b8922a; }.build-time span,.build-time small { display:block; color:#655f55; font-family:"JetBrains Mono", monospace; font-size:10px; text-transform:uppercase; }.build-time strong { display:block; margin:7px 0; color:#0d2340; font-family:"Cormorant Garamond", Georgia, serif; font-size:29px; line-height:1.05; }
.statistics { display:grid; grid-template-columns:repeat(4, 1fr); background:#e9e4d8; border-bottom:1px solid #d8d0c0; }.statistics > div { min-height:130px; padding:28px clamp(18px, 3vw, 52px); border-right:1px solid #d8d0c0; }.statistics > div:last-child { border-right:0; }.statistics span { display:block; color:#0d2340; font-family:"Cormorant Garamond", Georgia, serif; font-size:34px; font-weight:600; line-height:1.05; }.statistics small { display:block; margin-top:8px; color:#655f55; font-family:"JetBrains Mono", monospace; font-size:10px; text-transform:uppercase; }
.blueprint-layout { display:grid; grid-template-columns:280px minmax(0, 1fr); max-width:1500px; margin:0 auto; }.source-nav { position:sticky; top:0; align-self:start; max-height:100vh; overflow:auto; padding:47px 28px; border-right:1px solid #d8d0c0; }.source-nav nav { border-top:1px solid #d8d0c0; }.source-nav a { display:grid; grid-template-columns:26px 1fr; gap:9px; padding:12px 0; border-bottom:1px solid #d8d0c0; color:#534e45; font-size:12px; line-height:1.28; }.source-nav a:hover { color:#0d2340; font-weight:700; }.source-nav a span { color:#b8922a; font-family:"JetBrains Mono", monospace; font-size:10px; }.source-content { min-width:0; }.source-section { max-width:1000px; padding:clamp(40px, 6vw, 88px) clamp(22px, 7vw, 108px); margin:0 auto; border-bottom:1px solid #d8d0c0; }.source-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:28px; }.source-header p { margin:0; color:#b8922a; font-family:"JetBrains Mono", monospace; font-size:11px; font-weight:500; text-transform:uppercase; }.source-header p span { display:block; margin-top:5px; color:#777064; font-size:9px; text-transform:none; }.source-header > a { color:#655f55; font-size:12px; border-bottom:1px solid #b8922a; white-space:nowrap; }.blueprint-page .markdown-content > h1:first-child { margin-top:0; }
@media (max-width:760px) { .lesson-launch { display:block; padding:57px 25px 48px; }.username-task { margin-top:35px; }.username-examples { grid-template-columns:1fr; }.today-steps { margin-top:42px; }.build-status { display:block; padding:42px 25px; }.build-time { margin-top:28px; padding-left:20px; }.statistics { grid-template-columns:1fr 1fr; }.statistics > div { min-height:114px; padding:22px; }.statistics > div:nth-child(2) { border-right:0; }.blueprint-layout { display:block; }.source-nav { position:static; max-height:none; padding:30px 22px; border-right:0; border-bottom:1px solid #d8d0c0; }.source-nav nav { display:grid; grid-template-columns:1fr 1fr; }.source-nav a { padding-right:9px; }.source-section { padding:47px 22px; }.source-header { align-items:flex-start; }.source-header p span { max-width:210px; overflow-wrap:anywhere; } }