@layer components{.toc_wrap{justify-content:flex-start;align-items:flex-start;gap:var(--space-4);flex-flow:column;display:flex}.toc_list{flex-flow:column;justify-content:flex-start;align-items:flex-start;width:100%;display:flex}.toc_link{color:#8898aa;border-left:.0625rem solid #e3e8ee;padding:.4rem .5rem .4rem 1rem;font-size:.8em;text-decoration:none;transition:all .25s}.toc_link[data-toc-depth="3"]{padding-left:2.85rem;font-size:.7em}.toc_link[data-toc-status=active]{color:var(--brand-500);border-color:var(--brand-500)}@media (hover:hover){.toc_link:hover{color:var(--brand-500);border-color:var(--brand-500)}}.article-body_wrap.editorial{background-color:var(--light-base)}.article-body_layout{gap:var(--space-6) var(--site-gutter);grid-template-columns:repeat(12,minmax(0,1fr));width:100%;display:grid}@media not (min-width:57rem){.article-body_layout{flex-direction:column;display:flex}}.article-body_sidebar{grid-column:span 4}.editorial .article-body_sidebar{grid-column:span 5}.article-body_sidebar-inner{position:sticky;top:8rem}.article-body_main{grid-column:6/span 7}.legal .article-body_content a{color:var(--brand-500)}.article-body_content .frank-table{border-collapse:collapse;width:100%;font-family:inherit;font-size:.875rem;line-height:1.6}.article-body_content .frank-table th{letter-spacing:.06em;text-align:left;text-transform:uppercase;white-space:nowrap;border-bottom:.0625rem solid var(--brand-500);opacity:.5;padding:.75rem 1rem;font-size:.6875rem;font-weight:500}.article-body_content .frank-table td{vertical-align:top;opacity:.85;padding:.875rem 1rem}.article-body_content .frank-table :is(th,td):first-child{padding-left:0}.article-body_content .frank-table :is(th,td):last-child{padding-right:0}.article-body_content .frank-table td:first-child{white-space:nowrap;opacity:1;font-weight:500}.article-body_content .frank-table tbody tr:nth-child(odd) td{background-color:color-mix(in srgb, var(--brand-500) 6%, transparent)}.article-body_content .callout{border-left:.25rem solid;border-radius:.25rem;margin:2rem 0;padding:1.5rem 1.75rem}.article-body_content .callout p{margin-bottom:0}.article-body_content .callout-label{letter-spacing:.14em;text-transform:uppercase;margin-bottom:.5rem;font-weight:600;display:block}.article-body_content .callout-tip{background:var(--success-background);border-color:var(--success-border)}.article-body_content .callout-tip .callout-label{color:var(--success-border)}.article-body_content .callout-warn{background:var(--warning-background);border-color:var(--warning-border)}.article-body_content .callout-warn .callout-label{color:var(--warning-border)}.article-body_content .callout-frank{background:var(--brand-100);border-color:var(--brand-500)}.article-body_content .callout-frank .callout-label{color:var(--brand-500)}.article-body_content .callout-frank a{color:var(--brand-500);font-weight:500}.article-body_content .checklist-section{border:.0625rem solid var(--border);border-radius:.25rem;margin:2rem 0;overflow:hidden}.article-body_content .checklist-header{background:var(--text);color:var(--background);gap:var(--space-2);flex-wrap:wrap;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.article-body_content .checklist-header h4{margin:0;font-weight:500}.article-body_content .checklist-header span{opacity:.5}.article-body_content .checklist-item{border-bottom:.0625rem solid var(--border);align-items:flex-start;gap:.875rem;padding:.875rem 1.5rem;display:flex}.article-body_content .checklist-item:last-child{border-bottom:none}.article-body_content .check-box{border:.09375rem solid var(--border);background:var(--background);border-radius:.1875rem;flex-shrink:0;width:1.125rem;height:1.125rem;margin-top:.125rem}.article-body_content .checklist-item-text{margin-top:.25rem}.article-body_content .checklist-item-text strong{margin-bottom:var(--space-3);text-transform:none}.article-body_content .checklist-item-text span{color:color-mix(in srgb, var(--dark-900) 40%, transparent)}.article-body_content .stat-row{border:.0625rem solid var(--border);border-radius:.25rem;grid-template-columns:1fr 1fr 1fr;margin:2rem 0;display:grid;overflow:hidden}.article-body_content .stat-item{border-right:.0625rem solid var(--border);text-align:center;padding:1.5rem}.article-body_content .stat-item:last-child{border-right:none}.article-body_content .stat-num{color:var(--brand-500);margin-bottom:var(--space-3)}.article-body_content .stat-label{color:color-mix(in srgb, var(--dark-900) 40%, transparent);letter-spacing:.05em}.article-body_content .beta-cta{background:var(--text);color:var(--background);text-align:center;border-radius:.375rem;margin:3.5rem 0;padding:2.75rem 3rem}.article-body_content .beta-badge{background:var(--brand-500);color:var(--brand-100);letter-spacing:.14em;text-transform:uppercase;border-radius:1.25rem;margin-bottom:1.25rem;padding:.3125rem .75rem;display:inline-block}.article-body_content .beta-cta h3{margin-bottom:.75rem;font-weight:400;line-height:1.2}.article-body_content .beta-cta p{opacity:.7;max-width:30rem;margin:0 auto 1.75rem;line-height:1.65}.article-body_content .beta-cta-btn{background:var(--background);color:var(--text);border-radius:.1875rem;padding:.875rem 2rem;font-weight:600;text-decoration:none;transition:background .2s,color .2s;display:inline-block}.article-body_content .beta-cta-btn:hover{background:var(--brand-500);color:var(--brand-100)}.article-body_content .beta-cta-small{letter-spacing:.05em;opacity:.4;margin-top:.875rem;display:block}.article-body_content .email-thread{border:.0625rem solid var(--border);border-radius:.25rem;margin:2rem 0;overflow:hidden}.article-body_content .email-thread-header{background:var(--text);color:var(--background);letter-spacing:.08em;text-transform:uppercase;padding:.75rem 1.25rem}.article-body_content .email-item{border-bottom:.0625rem solid var(--border);padding:1.25rem}.article-body_content .email-item:last-child{border-bottom:none}.article-body_content .email-item.client{background:var(--warning-background)}.article-body_content .email-item.client .email-from{color:var(--warning-border)}.article-body_content .email-from{font-weight:600;display:block}.article-body_content .from-label{color:color-mix(in srgb, var(--dark-900) 40%, transparent);margin-bottom:var(--space-4);margin-top:var(--space-2);font-weight:400}.article-body_content .email-body{color:color-mix(in srgb, var(--dark-900) 40%, transparent);line-height:1.6}.article-body_content .email-body strong{color:var(--text)}.article-body_content .cost-box{border:.0625rem solid var(--border);border-radius:.25rem;margin:2rem 0;overflow:hidden}.article-body_content .cost-header{background:var(--text);color:var(--background);letter-spacing:.1em;text-transform:uppercase;padding:.75rem 1.25rem}.article-body_content .cost-row{border-bottom:.0625rem solid var(--border);justify-content:space-between;align-items:center;gap:1rem;padding:.875rem 1.5rem;display:flex}.article-body_content .cost-row:last-child{border-bottom:none}.article-body_content .cost-row.total{background:var(--brand-100);font-weight:600}.article-body_content .cost-row.total .cost-val{color:var(--brand-500)}.article-body_content .cost-label{color:color-mix(in srgb, var(--dark-900) 40%, transparent)}.article-body_content .cost-val{white-space:nowrap;font-weight:500}.article-body_content .drift-table{border-collapse:collapse;border:.0625rem solid var(--border);width:100%;margin:2rem 0}.article-body_content .drift-table thead tr{background:var(--text);color:var(--background)}.article-body_content .drift-table thead th{text-align:left;letter-spacing:.12em;text-transform:uppercase;padding:.875rem 1.125rem;font-weight:500}.article-body_content .drift-table thead th,.article-body_content .drift-table tbody td{display:table-cell}.article-body_content .drift-table tbody tr:nth-child(2n){background:color-mix(in srgb, var(--text) 2%, transparent)}.article-body_content .drift-table tbody td{border-bottom:.0625rem solid var(--border);vertical-align:top;padding:.75rem 1.125rem;line-height:1.5}.article-body_content .drift-table tbody tr:last-child td{border-bottom:none}.article-body_content .drift-score{border-radius:100vw;padding:.25rem .5rem;font-weight:600;display:inline-block}.article-body_content .score-high{background:var(--error-background);color:var(--error-border)}.article-body_content .score-med{background:var(--warning-background);color:var(--warning-border)}.article-body_content .score-low{background:var(--success-background);color:var(--success-border)}.article-body_content .compare-visual{border:.0625rem solid var(--border);border-radius:.25rem;grid-template-columns:1fr 1fr;margin:2rem 0;display:grid;overflow:hidden}.article-body_content .compare-side{border-right:.0625rem solid var(--border);padding:1.5rem}.article-body_content .compare-side:last-child{border-right:none}.article-body_content .compare-label{letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb, var(--dark-900) 40%, transparent);align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.article-body_content .dot{border-radius:50%;flex-shrink:0;width:.5rem;height:.5rem;display:inline-block}.article-body_content .dot-figma{background:var(--brand-500)}.article-body_content .dot-live{background:var(--success-border)}.article-body_content .compare-spec{background:var(--text);color:var(--brand-100);border-radius:.1875rem;padding:1rem;line-height:1.8}.article-body_content .compare-spec .prop{color:var(--brand-300,var(--brand-500));opacity:.7}.article-body_content .compare-spec .val-correct{color:var(--success-border)}.article-body_content .compare-spec .val-wrong{color:var(--error-border);text-decoration:line-through}.article-body_content .compare-spec .val-actual{color:var(--warning-border)}.article-body_content .steps{border:.0625rem solid var(--border);border-radius:.25rem;flex-direction:column;margin:2rem 0;display:flex;overflow:hidden}.article-body_content .step{border-bottom:.0625rem solid var(--border);grid-template-columns:4rem 1fr;display:grid}.article-body_content .step:last-child{border-bottom:none}.article-body_content .step-num{background:var(--text);color:var(--background);justify-content:center;align-items:center;padding:1.5rem 0;display:flex}.article-body_content .step-body{padding:1.25rem 1.5rem}.article-body_content .step-body h4{margin-bottom:.375rem}.article-body_content .step-body p{color:color-mix(in srgb, var(--dark-900) 40%, transparent);margin-bottom:0;line-height:1.55}.article-body_content .timeline{margin:2rem 0;padding-left:2rem;position:relative}.article-body_content .timeline:before{content:"";background:var(--border);width:.125rem;position:absolute;top:.5rem;bottom:.5rem;left:.5rem}.article-body_content .tl-item{margin-bottom:1.75rem;position:relative}.article-body_content .tl-item:last-child{margin-bottom:0}.article-body_content .tl-dot{background:var(--background);border:.125rem solid var(--border);border-radius:50%;width:.875rem;height:.875rem;position:absolute;top:.25rem;left:-1.875rem}.article-body_content .tl-item.active .tl-dot{background:var(--brand-500);border-color:var(--brand-500)}.article-body_content .tl-item.done .tl-dot{background:var(--success-border);border-color:var(--success-border)}.article-body_content .tl-head{margin-bottom:var(--space-2);padding-top:.25rem;font-weight:600;display:block}.article-body_content .tl-body{color:color-mix(in srgb, var(--dark-900) 40%, transparent);line-height:1.55}.article-body_content .template-block{background:var(--background);border:.0625rem solid var(--border);border-radius:.25rem;margin:2rem 0;padding:1.75rem 2rem}.article-body_content .template-label{letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb, var(--dark-900) 40%, transparent);margin-bottom:1rem;display:block}.article-body_content .template-block p{color:var(--text);margin-bottom:.75rem;line-height:1.7}.article-body_content .template-block p:last-child{margin-bottom:0}.article-body_content .placeholder{background:color-mix(in srgb, var(--brand-500) 10%, transparent);color:var(--brand-500);border-radius:.125rem;padding:0 .25rem .35rem;font-weight:600}.article-body_content .do-dont{border:.0625rem solid var(--border);border-radius:.25rem;grid-template-columns:1fr 1fr;margin:2rem 0;display:grid;overflow:hidden}.article-body_content .do-side{border-right:.0625rem solid var(--border);background:color-mix(in srgb, var(--success-border) 6%, transparent);padding:1.5rem}.article-body_content .dont-side{background:color-mix(in srgb, var(--warning-border) 6%, transparent);padding:1.5rem}.article-body_content .do-side h4{color:var(--success-border);margin-top:0}.article-body_content .dont-side h4{color:var(--warning-border);margin-top:0}.article-body_content .do-side ul,.article-body_content .dont-side ul{margin:0;padding:0;list-style:none}.article-body_content .do-side ul li,.article-body_content .dont-side ul li{border-bottom:.0625rem solid color-mix(in srgb, var(--border) 50%, transparent);padding:1rem 0;line-height:1.5}.article-body_content .do-side ul li:first-child,.article-body_content .dont-side ul li:first-child{padding-top:0}.article-body_content .do-side ul li:last-child,.article-body_content .dont-side ul li:last-child{border-bottom:none;padding-bottom:0}.article-body_content .scale-chart{border:.0625rem solid var(--border);border-radius:.25rem;margin:2rem 0;overflow:hidden}.article-body_content .scale-header{background:var(--text);color:var(--background);letter-spacing:.1em;text-transform:uppercase;padding:1rem 1.5rem}.article-body_content .scale-row{border-bottom:.0625rem solid var(--border);grid-template-columns:5rem 1fr 6rem;align-items:center;padding:0 1.5rem;display:grid}.article-body_content .scale-row:last-child{border-bottom:none}.article-body_content .scale-row.head{background:color-mix(in srgb, var(--text) 3%, transparent)}.article-body_content .scale-label{color:color-mix(in srgb, var(--dark-900) 40%, transparent);padding:.75rem 0}.article-body_content .scale-bar-wrap{color:color-mix(in srgb, var(--dark-900) 40%, transparent);padding:.625rem 1rem .625rem 0}.article-body_content .scale-bar{background:var(--brand-500);border-radius:.125rem;justify-content:flex-end;align-items:center;min-width:2rem;height:1.25rem;padding-right:.5rem;display:flex}.article-body_content .scale-bar span{color:#fff;font-weight:600}.article-body_content .scale-time{text-align:right;padding:.75rem 0;font-weight:600}@media not (min-width:52rem){.article-body_content .stat-row{grid-template-columns:1fr}.article-body_content .stat-item{border-right:none;border-bottom:.0625rem solid var(--border)}.article-body_content .stat-item:last-child{border-bottom:none}.article-body_content .beta-cta{padding:2rem 1.5rem}.article-body_content .compare-visual{grid-template-columns:1fr}.article-body_content .compare-side{border-right:none;border-bottom:.0625rem solid var(--border)}.article-body_content .compare-side:last-child{border-bottom:none}.article-body_content .step{grid-template-columns:3rem 1fr}.article-body_content .drift-table{border:none}.article-body_content .drift-table thead{display:none}.article-body_content .drift-table,.article-body_content .drift-table tbody,.article-body_content .drift-table tr,.article-body_content .drift-table td{width:100%;display:block}.article-body_content .drift-table tbody tr{border:.0625rem solid var(--border);border-radius:.25rem;margin-bottom:.75rem;overflow:hidden}.article-body_content .drift-table tbody tr:nth-child(2n){background:0 0}.article-body_content .drift-table tbody td{border-bottom:.0625rem solid var(--border);padding:.625rem 1rem;display:block}.article-body_content .drift-table tbody tr td:last-child{border-bottom:none}.article-body_content .drift-table tbody tr:last-child td{border-bottom:.0625rem solid var(--border)}.article-body_content .drift-table tbody tr:last-child td:last-child{border-bottom:none}.article-body_content .drift-table tbody td:before{content:attr(data-label);font-size:var(--text-small);text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb, var(--dark-900) 40%, transparent);margin-bottom:.25rem;display:block}.article-body_content .drift-table tbody td:first-child:before{display:none}.article-body_content .drift-table tbody td:first-child{background:var(--text);color:var(--background);border-bottom:.0625rem solid var(--border);padding:.75rem 1rem}.article-body_content .drift-table tbody td:first-child strong{color:var(--background)}.article-body_content .do-dont{grid-template-columns:1fr}.article-body_content .do-side{border-right:none;border-bottom:.0625rem solid var(--border)}.article-body_content .scale-row{grid-template-columns:3.75rem 1fr 5rem}}}
