@layer z.tokens,z.base,z.components;@layer z.pages{.z-toolpage{gap:var(--z-space-6);padding-block:var(--z-space-10) var(--z-space-18);flex-direction:column;display:flex}.z-toolpage__hero{align-items:center;gap:var(--z-space-4) var(--z-space-5);grid-template-columns:auto minmax(0,1fr) auto;display:grid}.z-toolpage__intro{gap:var(--z-space-1);flex-direction:column;min-width:0;display:flex}.z-toolpage__title{overflow-wrap:anywhere}.z-toolpage__lead{max-width:44rem;color:var(--z-sub);font:var(--z-text-body-lg);overflow-wrap:anywhere}.z-toolpage__actions{justify-content:flex-end;gap:var(--z-space-2);flex-wrap:wrap;display:flex}.z-toolpage__grid{grid-template-columns:minmax(0, 1fr) var(--z-aside-w);align-items:start;gap:var(--z-space-10);display:grid}.z-toolpage__main{gap:var(--z-space-10);flex-direction:column;min-width:0;display:flex}.z-toolpage__aside{gap:var(--z-space-5);flex-direction:column;min-width:0;display:flex}:is(.z-toolpage:has(.z-tab>.z-pending[data-pending=true]) .z-toolpage__main,.z-toolpage__panel:has(.z-pending[data-pending=true]) :is(.z-topics,.z-toolpage__count)){opacity:.55;transition:opacity var(--z-dur) var(--z-ease)}.z-toolpage__section{gap:var(--z-space-4);flex-direction:column;display:flex}.z-toolpage__section-head{justify-content:space-between;align-items:baseline;gap:var(--z-space-2) var(--z-space-4);flex-wrap:wrap;display:flex}.z-toolpage__desc{max-width:44rem;color:var(--z-ink);font:var(--z-text-body-lg);white-space:pre-line;overflow-wrap:anywhere}.z-toolpage__uses{border-top:1px solid var(--z-line)}.z-toolpage__uses li{padding-block:var(--z-space-3);border-bottom:1px solid var(--z-line);font:var(--z-text-body);overflow-wrap:anywhere}.z-toolpage__examples{gap:var(--z-space-5);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.z-toolpage__screens{gap:var(--z-space-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.z-toolpage__screens[data-count="1"]{grid-template-columns:minmax(0,1fr)}.z-toolpage__screen{gap:var(--z-space-2);flex-direction:column;display:flex}.z-toolpage__screen-media{aspect-ratio:16/9;border:1px solid var(--z-line);border-radius:var(--z-radius-md);background:var(--z-muted);place-items:center;display:grid;overflow:hidden}.z-toolpage__screen-media img{object-fit:contain;width:100%;height:100%}.z-toolpage__screen-missing{padding:var(--z-space-4);color:var(--z-sub);font:var(--z-text-small);text-align:center}.z-toolpage__screen figcaption{justify-content:space-between;align-items:baseline;gap:var(--z-space-1) var(--z-space-4);color:var(--z-sub);font:var(--z-text-caption);flex-wrap:wrap;display:flex}.z-toolpage__insights{gap:var(--z-space-8);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.z-toolpage__insights section{gap:var(--z-space-3);padding-top:var(--z-space-4);border-top:1px solid var(--z-line);flex-direction:column;display:flex}.z-toolpage__insights ul{gap:var(--z-space-2);font:var(--z-text-body);overflow-wrap:anywhere;padding-inline-start:1.25em;list-style:outside;display:grid}.z-toolpage__insights li::marker{color:var(--z-sub)}.z-toolpage__try{justify-content:space-between;align-items:center;gap:var(--z-space-3) var(--z-space-6);flex-wrap:wrap;display:flex}.z-toolpage__try>div{flex:20rem;min-width:0}.z-toolpage__try p{margin-top:var(--z-space-1);font:var(--z-text-body);overflow-wrap:anywhere}.z-toolpage__panel{gap:var(--z-space-4);flex-direction:column;display:flex}.z-toolpage__panel-head{justify-content:space-between;align-items:flex-end;gap:var(--z-space-3) var(--z-space-6);flex-wrap:wrap;display:flex}.z-toolpage__panel-head>div{flex:20rem;min-width:0}.z-toolpage__panel-head p{margin-top:var(--z-space-1);color:var(--z-sub);font:var(--z-text-small)}.z-toolpage__count{justify-content:space-between;align-items:baseline;gap:var(--z-space-1) var(--z-space-4);color:var(--z-ink);font:var(--z-text-small);flex-wrap:wrap;display:flex}.z-toolpage__works{gap:var(--z-space-8) var(--z-space-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.z-toolpage__panel .z-pagination{margin-top:var(--z-space-4)}.z-toolpage__empty-actions{gap:var(--z-space-3);margin-top:var(--z-space-1);flex-wrap:wrap;display:flex}.z-toolpage__empty-actions .z-btn{margin-top:0}.z-toolpage__summary{align-items:center;gap:var(--z-space-1) var(--z-space-5);color:var(--z-sub);font:var(--z-text-small);flex-wrap:wrap;display:flex}.z-toolpage__summary .z-num{color:var(--z-ink);font-weight:600}.z-toolpage__summary .z-link .z-num{color:inherit}.z-toolpage__tools{gap:var(--z-space-3);flex-direction:column;display:flex}.z-toolpage__search{gap:var(--z-space-2);flex-wrap:wrap;display:flex}.z-toolpage__search .z-search{background:var(--z-surface);flex:16rem;max-width:none}.z-toolpage__search .z-select{flex:0 12rem;min-width:0}.z-toolpage__filters{justify-content:space-between;gap:var(--z-space-3);flex-wrap:wrap;display:flex}.z-toolpage__filters .z-seg{scrollbar-width:none;max-width:100%;overflow-x:auto}.z-toolpage__filters .z-seg::-webkit-scrollbar{display:none}.z-toolpage .z-topics .z-topic__title{-webkit-line-clamp:2}.z-toolpage__steps li{grid-template-columns:var(--z-space-8) minmax(0, 1fr);gap:var(--z-space-3);padding:var(--z-space-4) var(--z-space-5);border-top:1px solid var(--z-line);display:grid}.z-toolpage__steps li:first-child{border-top:0}.z-toolpage__step{color:var(--z-accent-text);font:var(--z-text-numeral);font-size:1.25rem;line-height:1.5rem}.z-toolpage__steps p{font:var(--z-text-body);overflow-wrap:anywhere}.z-toolpage__start-actions{gap:var(--z-space-3);flex-wrap:wrap;display:flex}.z-toolpage__docs{align-items:flex-start;gap:var(--z-space-2);margin-top:var(--z-space-4);padding-top:var(--z-space-5);border-top:1px solid var(--z-line);flex-direction:column;display:flex}.z-toolpage__docs p{color:var(--z-sub);font:var(--z-text-small)}.z-toolpage__links{gap:var(--z-space-2);flex-direction:column;display:flex}.z-toolpage__links .z-link{white-space:normal;overflow-wrap:anywhere}.z-toolpage__note{color:var(--z-sub);font:var(--z-text-caption)}@media (max-width:68.6875em){.z-toolpage__hero{grid-template-columns:auto minmax(0,1fr)}.z-toolpage__actions{grid-column:2;justify-content:flex-start}.z-toolpage__examples{grid-template-columns:repeat(2,minmax(0,1fr))}.z-toolpage__examples>:nth-child(3){display:none}}@media (max-width:59.9375em){.z-toolpage{gap:var(--z-space-5);padding-block:var(--z-space-6) var(--z-space-12)}.z-toolpage__grid{gap:var(--z-space-10);grid-template-columns:minmax(0,1fr)}.z-toolpage__aside{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;display:grid}.z-toolpage__examples{grid-template-columns:repeat(3,minmax(0,1fr))}.z-toolpage__examples>:nth-child(3){display:flex}}@media (max-width:47.9375em){.z-toolpage__examples{grid-template-columns:repeat(2,minmax(0,1fr))}.z-toolpage__examples>:nth-child(3){display:none}.z-toolpage__screens{grid-template-columns:minmax(0,1fr)}}@media (max-width:39.9375em){.z-toolpage__hero{gap:var(--z-space-3) var(--z-space-4)}.z-toolpage__actions{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.z-toolpage__actions>*,.z-toolpage__actions .z-btn{width:100%}.z-toolpage__actions>.z-btn--primary{grid-column:1/-1}.z-toolpage__lead,.z-toolpage__desc{font:var(--z-text-body)}.z-toolpage__aside{grid-template-columns:minmax(0,1fr)}.z-toolpage__insights{gap:var(--z-space-6);grid-template-columns:minmax(0,1fr)}.z-toolpage__works{gap:var(--z-space-8);grid-template-columns:minmax(0,1fr)}.z-toolpage__examples{grid-template-columns:minmax(0,1fr)}.z-toolpage__examples>:nth-child(3){display:flex}.z-toolpage__panel-head .z-btn{width:100%}.z-toolpage__search .z-select{flex:1 1 calc(50% - var(--z-space-1))}.z-toolpage__search .z-btn{flex:100%}.z-toolpage__filters .z-seg{width:100%}.z-toolpage__filters .z-seg__item{padding-inline:var(--z-space-2);flex:1 0 auto}.z-toolpage__steps li{padding:var(--z-space-4)}.z-toolpage__start-actions .z-btn{flex:100%}}}@layer z.utilities;