.starter-header{max-width:760px;margin-bottom:34px}.starter-header h1{letter-spacing:-.052em;margin:16px 0 20px;font-size:clamp(38px,4.7vw,60px);line-height:1.04}.starter-header h1 span{color:#9bada5}.starter-header p{color:#a7b4ad;max-width:640px;font-size:17px}.starter-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:start;gap:28px;display:grid}.starter-form,.starter-preview{background:var(--surface);border-radius:16px;min-width:0;padding:26px}.starter-preview{position:sticky;top:106px}.starter-steps{grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 24px;padding:0;list-style:none;display:grid}.starter-steps button{border:1px solid var(--line);width:100%;min-height:44px;color:var(--muted);background:0 0;border-radius:8px;align-items:center;gap:8px;padding:8px 10px;font-size:12px;display:flex}.starter-steps button span{background:var(--soft);width:22px;height:22px;font:11px var(--mono);border-radius:50%;flex-shrink:0;place-items:center;display:grid}.starter-steps button[aria-current=step]{color:#a4f5d0;background:#223b2e;border-color:#476b55}.starter-steps button[aria-current=step] span{background:var(--mint);color:#09261e}.starter-form fieldset{border:0;gap:18px;margin:0;padding:0;display:grid}.starter-form legend{letter-spacing:-.04em;margin-bottom:4px;padding:0;font-size:26px;font-weight:650}.starter-form label{color:var(--muted);gap:8px;font-size:13px;display:grid}.starter-form input:not([type=radio]),.starter-form textarea{width:100%;min-height:48px;color:var(--text);background:#111815;border:1px solid #50675a;border-radius:8px;padding:12px 14px;font-size:16px}.starter-form textarea{resize:vertical;line-height:1.5}.starter-form input:focus-visible,.starter-form textarea:focus-visible{outline:2px solid var(--mint);outline-offset:2px}.starter-form input[aria-invalid=true]{border-color:#ff8a7a}.optional{color:#6f7c75}.field-error{color:#ff9b8c;margin-top:-10px;font-size:12px}.choice-group{flex-wrap:wrap;gap:8px;display:flex}.choice-title{width:100%;color:var(--muted);margin-bottom:2px;font-size:13px}.starter-form .choice{cursor:pointer;align-items:center;gap:0;display:flex}.choice input,.direction input{opacity:0;width:1px;height:1px;position:absolute}.choice>span{border:1px solid var(--line);min-height:44px;color:var(--text);border-radius:25px;align-items:center;padding:10px 15px;font-size:13px;display:flex}.choice-wide{flex:calc(50% - 8px)}.choice-wide>span{border-radius:10px;flex-direction:column;align-items:start;gap:2px;width:100%}.choice-wide small{color:var(--muted);font-size:12px}.choice input:checked+span{color:#a4f5d0;background:#223b2e;border-color:#476b55}.choice input:focus-visible+span,.direction input:focus-visible~strong{outline:2px solid var(--mint);outline-offset:3px}.direction-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.starter-form .direction{border:1px solid var(--line);cursor:pointer;border-radius:12px;gap:6px;padding:14px;display:grid;position:relative}.direction:has(input:checked){border-color:var(--mint);background:#1b2a22}.direction strong{color:var(--text);font-size:14px}.direction small{font-size:12px;line-height:1.45}.swatches{gap:4px;display:flex}.swatches i{border:1px solid #fff2;border-radius:50%;width:20px;height:20px}.starter-nav{border-top:1px solid var(--line);justify-content:space-between;gap:12px;margin-top:26px;padding-top:20px;display:flex}.starter-nav [data-starter-prev] svg{transform:rotate(180deg)}.preview-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.preview-head h2{font-size:24px}[data-starter-download] svg{transform:rotate(90deg)}.file-tabs{scrollbar-width:thin;gap:6px;margin-bottom:8px;padding-bottom:8px;display:flex;overflow-x:auto}.file-tabs button{border:1px solid var(--line);min-height:40px;font:12px var(--mono);color:var(--muted);background:0 0;border-radius:8px;flex-shrink:0;padding:8px 12px}.file-tabs button[aria-selected=true]{color:#a4f5d0;background:#223b2e;border-color:#476b55}.file-view{border:1px solid var(--line);height:min(62vh,560px);font:12.5px/1.65 var(--mono);color:#cfdcd5;white-space:pre-wrap;overflow-wrap:anywhere;background:#0d1210;border-radius:10px;margin:0;padding:18px;overflow:auto}.hint{color:var(--muted);margin-top:12px;font-size:12px}.starter-checklist{border-top:1px solid var(--line);margin-top:56px;padding-top:36px}.checklist-count{font:13px var(--mono);color:var(--mint)}.progress{background:var(--soft);border-radius:6px;height:6px;margin-bottom:28px;overflow:hidden}.progress i{background:var(--mint);width:0;height:100%;transition:width .3s;display:block}.checklist-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.checklist-group{background:var(--surface);border-radius:13px;padding:20px}.checklist-group h3{margin-bottom:12px;font-size:18px}.check-item{border-radius:10px;grid-template-columns:22px 1fr;gap:10px;margin:0 -8px;padding:10px 8px;font-size:13px;display:grid}.check-item input{width:20px;height:20px;accent-color:var(--mint);margin:2px 0 0}.check-item strong{font-weight:600;display:block}.check-item small{color:var(--muted);font-size:12px}.link-button{color:var(--mint);background:0 0;border:0;min-height:0;padding:0;font-size:12px;text-decoration:underline}.starter-updated{color:#6f7c75;margin-top:40px;font-size:12px}@media (width<=1000px){.starter-layout{grid-template-columns:1fr}.starter-preview{position:static}}@media (width<=720px){.starter-form,.starter-preview{padding:18px}.starter-steps{grid-template-columns:repeat(4,minmax(0,1fr))}.starter-steps button{justify-content:center;padding:6px;font-size:0}.starter-steps button span{font-size:11px}.choice-wide{flex-basis:100%}.file-view{height:420px}.checklist-groups{grid-template-columns:1fr}.preview-head{flex-wrap:wrap}}.starter-example{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px 10px;margin:-6px 0 18px;font-size:13px;display:flex}.starter-example .link-button{min-height:32px;font-size:13px}.next-step{color:var(--muted);margin:-12px 0 10px;font-size:15px}.next-step a{color:var(--mint);text-underline-offset:3px;text-decoration:underline}.next-step strong{color:var(--text)}.guided-hint{margin:0 0 24px}.guided-hint code,.step-actions code{font:12px var(--mono);background:var(--soft);color:#cfdcd5;border-radius:5px;padding:2px 6px}.check-item>input{cursor:pointer}.check-item label{cursor:pointer;display:block}.check-item.is-next{box-shadow:inset 2px 0 0 var(--mint);background:#1b2a22}.check-item details{margin-top:6px}.check-item summary{cursor:pointer;color:var(--mint);align-items:center;width:fit-content;min-height:32px;font-size:12px;display:flex}.step-prompt{border:1px solid var(--line);max-height:220px;font:12px/1.6 var(--mono);color:#cfdcd5;white-space:pre-wrap;overflow-wrap:anywhere;background:#0d1210;border-radius:8px;margin:6px 0 10px;padding:12px;overflow:auto}.step-actions{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:12px;display:flex}.step-actions .btn{min-height:40px;padding:8px 14px;font-size:12px}.step-manual{color:var(--muted);margin:4px 0 0;font-size:12px}.check-item:has(>input:checked) strong{color:var(--muted);text-decoration:line-through}
