@layer pages{.product-page--marklane{--product-border-color:#244c3d29;--product-border-color-strong:#244c3d3d;--marklane-flow-node-background:color-mix(in srgb, var(--surface-color) 88%, #e4ede6 12%);--product-hero-image-mobile-max-width:min(100%, 18rem);max-width:64rem}.product-page--slug-free-permalinks{--product-border-color:#22477c2e;--product-border-color-strong:#22477c47;--product-hero-image-max-width:min(100%, 28rem);--product-hero-image-mobile-max-width:min(100%, 22rem);max-width:64rem}.lsd-visual-frame{grid-template-columns:1fr}.lsd-visual-files,.lsd-visual-info{background:var(--surface-color);border:1px solid var(--product-border-color);border-radius:var(--radius-sm);padding:var(--space-xs)}.lsd-visual-files{gap:calc(var(--space-2xs) + var(--space-2xs) / 2);display:grid;& span{background:color-mix(in srgb, var(--brand-soft) 74%, var(--surface-color) 26%);padding:var(--space-2xs) var(--space-xs);border-radius:.25rem}}.lsd-visual-info{align-content:center;gap:var(--space-2xs);display:grid;& small{color:var(--product-text-muted)}}.marklane-tool-heading{align-items:center;gap:var(--space-xs);margin-top:var(--space-md);flex-wrap:wrap;justify-content:space-between;display:flex}.marklane-tool-heading h3{margin:0}.marklane-copy-button{width:auto;margin:0}.marklane-prompt{max-height:28rem;overflow:auto}.marklane-class-table-wrapper{margin-top:var(--space-md);overflow-x:auto}.marklane-class-table{border:1px solid var(--product-border-color);border-collapse:separate;border-spacing:0;border-radius:4px;width:100%;min-width:48rem;overflow:hidden}.marklane-class-table thead{background:color-mix(in srgb, var(--surface-color) 92%, var(--brand-soft) 8%)}.marklane-class-table thead th{color:var(--product-text-muted);font-size:var(--font-size-text-sm);font-weight:600}.marklane-class-table th,.marklane-class-table td{color:var(--text);padding:var(--space-xs) var(--space-sm);text-align:left;vertical-align:top;border:0}.marklane-class-table tbody tr+tr th,.marklane-class-table tbody tr+tr td{border-top:1px solid var(--product-border-color)}.marklane-class-table tbody th{white-space:nowrap;font-weight:600}.marklane-class-table tbody th code{white-space:nowrap}.marklane-class-table tbody td code{overflow-wrap:anywhere;white-space:normal}.marklane-example-table{border:1px solid var(--product-border-color);table-layout:fixed}.marklane-example-table__caption{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.marklane-example-table__type-column{width:24%}.marklane-example-table__head{background:color-mix(in srgb, var(--surface-color) 92%, var(--brand-soft) 8%)}.marklane-example-table__head th{color:var(--product-text-muted);font-size:var(--font-size-text-sm);padding:var(--space-xs) var(--space-sm);font-weight:600}.marklane-example-table__head th+th{border-left:1px solid var(--product-border-color)}:where(.marklane-example-table th,.marklane-example-table td){color:var(--text);vertical-align:top;background:0 0;border:0;padding:0}.marklane-example-introduction{max-width:56rem}.marklane-example>th,.marklane-example>td{border-top:1px solid var(--product-border-color)}.marklane-example__head{font-weight:inherit;padding:var(--space-xs) var(--space-sm)}.marklane-example__head h3{margin:0;font-size:1rem;line-height:1.4}.marklane-example__head p{color:var(--product-text-muted);font-size:var(--font-size-text-compact);margin:var(--space-2xs) 0 0;line-height:1.55}.marklane-example__pane{border-left:1px solid var(--product-border-color);min-width:0}.marklane-example__pane--source pre{min-height:140px;margin:0}.marklane-example__label{clip:rect(0 0 0 0);clip-path:inset(50%);color:var(--product-text-muted);font-size:var(--font-size-text-sm);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;font-weight:600;position:absolute;overflow:hidden}.marklane-example__preview{padding:var(--space-xs) var(--space-sm);align-items:center;display:grid}.marklane-example__flow{align-items:center;gap:var(--space-xs);grid-template-columns:minmax(0,1fr) 2rem minmax(0,1fr) 2rem minmax(0,1fr);display:grid}.marklane-example__flow-node{background:var(--marklane-flow-node-background);border:1px solid var(--product-border-color-strong);border-radius:var(--radius-sm);font-size:var(--font-size-text-sm);min-height:4rem;padding:var(--space-xs);text-align:center;justify-content:center;align-items:center;line-height:1.45;display:flex}.marklane-example__flow-arrow{color:var(--brand);width:2rem;height:1rem;display:block}.marklane-example__flow-arrow path{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.75px}.marklane-example__callout{--callout-accent:light-dark(#1f6feb,#79c0ff);padding:0 var(--space-sm);border:0;border-left:.25em solid var(--callout-accent);background:0 0;border-radius:0;margin:0}.marklane-example__callout strong{margin-bottom:var(--space-xs);color:var(--callout-accent);font-size:var(--font-size-text-compact);align-items:center;gap:.5em;font-weight:600;display:flex}.marklane-example__callout strong:before{content:"ⓘ";flex:none;font-size:1em;line-height:1}.marklane-example__callout p{color:var(--text);font-size:var(--font-size-text-compact);margin:0;line-height:1.65}.marklane-example__callout--warning{--callout-accent:light-dark(#9a6700,#d29922)}.marklane-example__callout--warning strong:before{content:"⚠"}.marklane-example__math{justify-content:center;align-items:center;display:flex}.marklane-example__math math{font-size:var(--font-size-heading-sm);max-width:100%}@media (width<768px){.marklane-example-table{display:block}.marklane-example-table colgroup,.marklane-example-table__head{display:none}.marklane-example-list{width:100%;display:block}.marklane-example{display:block}.marklane-example__head{width:auto;display:block}.marklane-example__pane{border-left:0;border-top:1px solid var(--product-border-color);display:block}.marklane-example__label{border-bottom:1px solid var(--product-border-color);clip:auto;clip-path:none;height:auto;padding:var(--space-xs) var(--space-sm);white-space:normal;width:auto;margin:0;position:static;overflow:visible}.marklane-example__flow{gap:var(--space-xs);grid-template-columns:1fr}.marklane-example__flow-arrow{justify-self:center;transform:rotate(90deg)}}}@layer components{.works-section{margin-top:var(--space-2xl)}.blog-section{margin-top:var(--space-xl)}.section-head{align-items:center;column-gap:var(--space-md);margin-bottom:var(--space-md);row-gap:var(--space-sm);grid-template-columns:minmax(0,42rem) auto;display:grid;& h1,& h2{grid-column:1;align-self:end;margin:0}@media (width<768px){grid-template-columns:1fr;align-items:flex-start}}.works-intro,.blog-intro{color:color-mix(in srgb, var(--text) 76%, transparent);grid-column:1;max-width:42rem;margin:0}.works-link,.blog-link{white-space:nowrap;grid-column:2;@media (width<768px){white-space:normal;grid-column:1}}.blog-grid{margin-inline:auto;margin-top:var(--space-md);max-width:calc(900px + var(--space-md) + var(--space-md));grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));width:100%}.blog-card{& .work-title{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}.blog-thumb{background:color-mix(in srgb, var(--surface-soft-color) 52%, var(--brand-soft) 48%);&.blog-thumb--empty{justify-content:center;align-items:center;display:flex}}.blog-thumb-placeholder{color:color-mix(in srgb, var(--text) 54%, transparent);font-size:var(--font-size-heading-sm);letter-spacing:.08rem;text-transform:uppercase;font-weight:600}.blog-fallback{background:color-mix(in srgb, var(--surface-color) 90%, var(--brand-soft) 10%);border:1px solid color-mix(in srgb, var(--border) 95%, transparent);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);align-items:flex-start;gap:var(--space-sm);margin-top:var(--space-md);padding:var(--space-md);display:grid;& p{color:color-mix(in srgb, var(--text) 76%, transparent);margin:0}}.works-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));display:grid}.product-grid{max-width:calc(900px + var(--space-md) + var(--space-md));width:100%;margin-inline:auto}article.work-card{background:color-mix(in srgb, var(--surface-color) 90%, var(--brand-soft) 10%);border:1px solid color-mix(in srgb, var(--border) 95%, transparent);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;margin:0;padding:0;transition:box-shadow .16s,border-color .16s;display:flex;overflow:hidden}.work-card-link,.work-card-inner{flex-direction:column;text-decoration:none;display:flex;position:relative}.work-img{aspect-ratio:16/9;background:color-mix(in srgb, var(--brand-soft) 60%, var(--surface-color) 40%);object-fit:cover;width:100%;height:auto;max-height:none;transition:transform .24s;&.work-img--contain{object-fit:contain;padding:clamp(var(--space-md), 2vw, var(--space-lg))}}.work-badge{color:#fffffff2;font-size:var(--font-size-text-xs);letter-spacing:.03rem;padding:var(--space-2xs) var(--space-xs);text-transform:uppercase;z-index:1;background:#121e16a3;border:1px solid #ffffff6b;border-radius:999px;font-weight:600;line-height:1;position:absolute;top:.625rem;left:.625rem;html[data-theme=light] &{background:#121e16cc;border-color:#0000001a}}.work-body{padding:var(--space-md)}.work-title{font-size:var(--font-size-text-xl);margin:0;line-height:1.4}.work-description{color:color-mix(in srgb, var(--text) 76%, transparent);-webkit-line-clamp:3;font-size:var(--font-size-text-compact);line-clamp:3;margin:calc(var(--space-xs) + var(--space-2xs) / 2) 0 0;-webkit-box-orient:vertical;line-height:1.6;display:-webkit-box;overflow:hidden}@media (hover:hover){.work-card:hover{border-color:color-mix(in srgb, var(--brand) 30%, transparent);box-shadow:var(--shadow-md);& .work-img{transform:scale(1.02)}}}.article-page{--article-accent:var(--brand);background:color-mix(in srgb, var(--surface-color) 89%, var(--surface-soft-color) 11%);border:1px solid color-mix(in srgb, var(--border) 95%, transparent);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);max-width:52rem;min-height:clamp(22rem,58svh,34rem);padding:var(--space-lg);& a{color:var(--article-accent);text-decoration-color:color-mix(in srgb, var(--article-accent) 44%, transparent);text-underline-offset:.16em;text-decoration-thickness:.08em}& h1{font-size:var(--font-size-heading-md);margin:0 0 var(--space-md);text-align:center;font-weight:300}& h2{border-left:var(--space-2xs) solid var(--article-accent);padding-left:var(--space-sm)}& h3:before{background:color-mix(in srgb, var(--article-accent) 78%, transparent);content:"";height:.5rem;margin-right:var(--space-xs);border-radius:999px;width:.5rem;display:inline-block;transform:translateY(-.25rem)}& #vanilla-form{margin-block:var(--space-xl);& form{gap:var(--space-sm);display:grid;&>p{margin:0}}& .vf-required-mark{color:var(--pico-del-color);font-weight:600}& p[data-vf-status]{margin:0}& [data-vf-success-dialog]{& article{margin:0}& footer{justify-content:flex-end}}}}.article-toc{background:var(--surface-color);border:1px solid var(--article-accent,var(--brand));border-radius:var(--radius-lg);margin-block:var(--space-md);padding:var(--space-md);width:fit-content;& ol{margin:0;padding-left:1.25rem;display:grid}& li{border-bottom:1px solid var(--article-accent,var(--brand));margin-top:0;&:last-child{border-bottom:0}}& a{color:var(--article-accent,var(--brand));text-decoration:none}}.article-toc-title{color:color-mix(in srgb, var(--text) 72%, transparent);font-size:var(--font-size-text-sm);letter-spacing:.08rem;text-transform:uppercase;margin:0;font-weight:600}.article-meta{color:color-mix(in srgb, var(--text) 68%, transparent);font-size:var(--font-size-text-compact);margin-top:var(--space-lg)}}