[data-tool-head]{padding:var(--tool-head-pad,0);gap:var(--tool-head-gap,var(--space-4));flex-direction:column;display:flex}[data-section]:has([data-tool-page]){padding-block:var(--space-4);align-content:start}[data-tool-head]{margin-bottom:var(--space-4)}[data-tool]{scroll-margin-top:calc(var(--chrome-h,92px) + var(--space-4))}[data-tool][data-phase=done]:has([data-tool-viewer])>[data-tool-drop]{min-height:44px;padding:var(--space-2)}[data-tool-result]:has([data-tool-viewer]){margin-top:var(--space-3);border:0;padding:0}[data-tool-drop]{justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--tool-drop-h,180px);padding:var(--space-6);border:var(--border-w,1px) dashed var(--trim);border-radius:var(--radius-md);text-align:center;cursor:pointer;flex-direction:column;display:flex}[data-tool-drop][data-busy]{cursor:progress}[data-tool-drop]{transition:background-color .12s,color .12s,border-color .12s}[data-tool-drop-input]{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}[data-tool-drop]:has([data-tool-drop-input]:focus-visible){outline:var(--focus-ring-w,2px) solid var(--focus-ring,var(--highlight));outline-offset:var(--focus-ring-offset,2px)}[data-tool-drop][data-tool-drop-active]{border-style:solid}[data-tool-drop-hint]{font-size:var(--fs-small)}[data-tool-drop-mark]{width:var(--tool-drop-mark,0);height:var(--tool-drop-mark,0);flex:none;overflow:hidden}[data-tool-drop-mark]>svg{width:50%;height:50%}[data-tool-options]{gap:var(--space-4);margin-top:var(--space-4);flex-wrap:wrap;display:flex}[data-tool-option]{flex:220px;min-width:0}[data-tool-option] :disabled{color:var(--inactive);cursor:not-allowed}[data-tool-option]:has(:disabled){color:var(--inactive);cursor:not-allowed}[data-tool-option-help]{margin-top:var(--space-1);font-size:var(--fs-micro);max-width:var(--measure,65ch)}[data-tool-check]{min-height:var(--control-min-h,44px);cursor:pointer}[data-tool-status]{margin-top:var(--space-3);font-size:var(--fs-small);min-height:0}[data-tool-status]:empty{display:none}[data-tool-run]{gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap;display:flex}[data-tool-run]>[data-actions]{margin-top:0}[data-tool-run]:not(:has([data-tool-file-format])){grid-auto-rows:1fr;grid-auto-columns:1fr;grid-auto-flow:column;width:fit-content;max-width:100%;display:grid}[data-tool-run]:not(:has([data-tool-file-format]))>[data-actions]{display:contents}[data-tool-result]{margin-top:var(--space-6);gap:var(--space-4);display:grid}[data-tool-outputs]{gap:var(--space-3);grid-auto-columns:1fr;grid-auto-flow:column;width:fit-content;max-width:100%;display:grid}[data-tool-outputs]>*,[data-tool-output]>*{width:100%}[data-tool-batch-table]{border-collapse:collapse;text-align:left;width:100%}[data-tool-batch-caption]{text-align:left;padding-bottom:var(--space-2)}[data-tool-batch-table] th,[data-tool-batch-table] td{border-top:var(--border-w,1px) solid var(--trim);padding:var(--space-2) var(--space-3) var(--space-2) 0;vertical-align:top}[data-tool-batch-name]{overflow-wrap:anywhere}[data-tool-batch-message]{font-size:var(--fs-small);max-width:var(--measure,65ch);display:block}[data-tool-batch-outcome]{align-items:flex-start;gap:var(--space-2);flex-wrap:wrap;display:flex}[data-tool-after]{margin-top:var(--space-4);align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}[data-tool-stage]{margin-top:var(--space-4);gap:var(--space-4);display:grid}[data-tool-batch-state]{font-size:var(--fs-small)}[data-tool-stage-remove]{appearance:none;padding:var(--space-1) var(--space-2);min-height:var(--control-min-h,44px);cursor:pointer;font:inherit;color:inherit;background:0 0;border:0;flex:none}[data-tool-stage-remove]:focus-visible{outline:var(--focus-ring-w,2px) solid;outline-offset:var(--focus-ring-offset,2px)}[data-tool-batch-all]{gap:var(--space-3);flex-wrap:wrap;display:flex}[data-tool-preview]{height:clamp(var(--tool-preview-min,280px), 70dvh, 800px);border:var(--border-w,1px) solid var(--trim);border-radius:var(--radius-md);width:100%;overflow:hidden}[data-tool-preview]:has([data-tool-viewer]){height:clamp(320px, calc(100dvh - var(--chrome-h,92px) - 190px), min(900px, 85vw))}[data-tool-preview] canvas,[data-tool-preview] img{object-fit:contain;width:100%;height:100%;display:block}[data-tool-canvas]{touch-action:none;flex:1;width:100%;min-height:0}[data-tool-viewer]{width:100%;height:100%;color:var(--tool-viewer-line,var(--trim));--tool-viewer-grid:var(--trim);flex-direction:column;display:flex;position:relative}[data-tool-viewer-bar]{top:var(--space-3);left:var(--space-3);right:var(--space-3);gap:var(--space-1);pointer-events:none;flex-wrap:wrap;display:flex;position:absolute}[data-tool-viewer-bar]>span{display:contents}[data-tool-viewer-bar] :is(button,select){pointer-events:auto;width:auto;min-width:0}[data-tool-viewer]>[data-tool-extras]{right:var(--space-3);bottom:var(--space-3);left:var(--space-3);justify-content:space-between;align-items:flex-end;gap:var(--space-2);flex-wrap:wrap;display:flex;position:absolute}[data-tool-view-group]{gap:var(--space-1);display:grid}[data-tool-view-group]>:is(p,span){margin:0}[data-tool-view-group] .ui-control>h2{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;margin:0}[data-tool-frame]{pointer-events:auto}.tool-colour-row .scroll-row-track{--row-count:9;--row-gap:var(--space-1)}.tool-colour-row .scroll-row-track>:is(button,[data-tool-custom-colour]){aspect-ratio:1;cursor:pointer;background:0 0;border:2px solid #0000;border-radius:50%;height:auto;padding:2px}.tool-colour-row .scroll-row-track>button[aria-checked=true]{border-color:var(--primary-fill,var(--highlight))}.tool-colour-row img{width:100%;height:100%;display:block}:has(>[data-viewer-app]){container-type:inline-size}[data-viewer-app]{border:2px solid var(--trim);border-radius:var(--radius-md);background:var(--background);width:fit-content;max-width:100%;margin-inline:auto;overflow:hidden}[data-section]:has([data-viewer-app]){padding-block:var(--section-py,3rem)}[data-viewer-stage]>[data-stage-picture]{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}[data-viewer-stage]>[data-empty-stage]:not(:only-child):not([data-tool] *){display:none}[data-viewer-stage] [data-viewer-close]{z-index:3;top:var(--space-3);left:var(--space-3);position:absolute}[data-viewer-body]{--viewer-h:min(80vh, 60cqw);grid-template-columns:var(--viewer-h) calc(var(--viewer-h) * 2 / 3);display:grid}[data-viewer-body]:not(:has([data-viewer-side])){grid-template-columns:min(80vh,100cqw)}[data-viewer-stage]{aspect-ratio:1;background:radial-gradient(ellipse at 50% 35%, var(--wash) 0%, var(--background) 70%);min-height:0;position:relative}[data-viewer-stage] [data-tool-viewer]{container-type:size}[data-viewer-stage] [data-tool-canvas]{width:min(100cqw, 100cqh * var(--tool-ratio,1));height:min(100cqh, 100cqw / var(--tool-ratio,1));outline:var(--border-w,1px) dashed var(--trim);flex:none;margin:auto}[data-viewer-stage] [data-tool-canvas][data-tool-plain]{outline:none;width:100%;height:100%}[data-tool-backgrounds] .tool-colour-row .scroll-row-track>:is(button,[data-tool-custom-colour]){border-radius:var(--radius-sm,4px)}[data-tool-backgrounds] img{box-sizing:border-box;border:var(--border-w,1px) solid var(--trim);border-radius:2px;width:100%;height:100%;display:block}[data-tool-custom-colour]{cursor:pointer;border:2px solid #0000;border-radius:50%;padding:2px;display:grid}[data-tool-custom-colour][aria-checked=true]{border-color:var(--primary-fill,var(--highlight))}[data-tool-custom-colour] input{appearance:none;border-radius:inherit;cursor:pointer;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);border:0;width:100%;height:100%;padding:0}[data-tool-custom-colour] input::-webkit-color-swatch-wrapper{opacity:0}[data-tool-custom-colour] input::-webkit-color-swatch{opacity:0}[data-tool-custom-colour] input::-moz-color-swatch{opacity:0}[data-tool-zoom]{top:calc(var(--space-6) + 60px + var(--space-6));right:calc(var(--space-6) + 28px);margin:0;position:absolute}[data-viewer-stage] [data-tool-viewer]{position:absolute;inset:0}[data-viewer-stage]>[data-tool-run]{justify-content:center;align-items:center;margin:0;position:absolute;inset:0}[data-viewer-stage]>[data-tool-drop]{--tool-drop-mark:72px;inset:var(--space-4);border-radius:var(--radius-lg,var(--radius-md));background:0 0;border-width:2px;min-height:0;position:absolute}[data-viewer-stage] [data-tool-drop-mark]{border-radius:var(--radius-lg,var(--radius-md));background:var(--wash);place-items:center;display:grid}[data-empty-slot]{--tool-drop-mark:48px;aspect-ratio:1;cursor:default;min-height:0;padding:0}[data-empty-slot] [data-tool-drop-mark]{place-items:center;display:grid}[data-viewer-stage] [data-tool-drop-mark]>svg{color:var(--highlight)}[data-viewer-stage] [data-tool-drop-label]{font-family:var(--font-display,inherit);font-size:var(--fs-large);font-weight:600}[data-viewer-side] [data-tool-drop]{--tool-drop-mark:1.25rem;min-height:3rem;padding:var(--space-2) var(--space-3);font-size:var(--fs-small);flex-direction:row}[data-viewer-side] [data-tool-drop-mark]>svg{width:100%;height:100%}[data-viewer-side] [data-tool-drop-hint]:empty{display:none}[data-viewer-side] [data-tool-viewer-bar]{gap:var(--space-3);margin-block:var(--space-3);pointer-events:auto;display:grid;position:static}[data-tool-viewer-sep]{background:var(--trim);flex:none;align-self:stretch;width:1px;margin:6px 2px}[data-viewer-stage] [data-tool-status]{top:var(--space-4);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--wash);margin:0;position:absolute;left:50%;transform:translate(-50%)}[data-tool-run]:has([data-tool-file-format]){align-items:center;gap:var(--space-3)}[data-tool-file-format]{align-items:center;gap:var(--space-1);font-size:var(--fs-small);margin:0;display:inline-flex}[data-tool-file-format] svg{width:1.25em;height:1.25em;color:var(--color-success)}[data-viewer-stage] [data-tool-error]{top:var(--space-4);left:var(--space-4);right:var(--space-4);position:absolute}[data-viewer-side]>:first-child:not(:empty)+*,[data-viewer-side]>[data-tool-view-group]+:is([data-tool-view-group],[data-tool-options]),[data-viewer-side]>[data-output-type],[data-viewer-side]>[data-tool-outputs]{margin-top:var(--space-3)}[data-viewer-side]>[data-tool-outputs]{grid-auto-flow:row}[data-viewer-side] [data-tool-options]{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));display:grid}[data-viewer-side] [data-tool-option]:not([data-option-kind=number]){grid-column:1/-1}[data-viewer-side] [data-tool-option][data-option-kind=number]{align-self:end}[data-viewer-side]{contain:size;padding:var(--space-4) var(--space-4);border-left:var(--border-w,1px) solid var(--trim);background:var(--wash);overflow-y:auto}@media (max-width:760px){[data-viewer-body]{grid-template-columns:minmax(0,1fr)}[data-viewer-app]{width:auto}[data-viewer-stage]{justify-self:center;width:min(100%,80vh)}[data-viewer-side]{contain:none;border-top:var(--border-w,1px) solid var(--trim);border-left:0}}[data-tool-result]:has([data-tool-viewer]) [data-tool-reset]{display:none}[data-tool-privacy]{margin-top:var(--space-4);font-size:var(--fs-small);max-width:var(--measure,65ch)}[data-tool-prose]{margin-top:var(--space-8);gap:var(--space-8);max-width:var(--guide-measure,800px);display:grid}[data-tool-prose] p,[data-tool-prose] li{max-width:var(--measure,65ch)}[data-tool-steps] ol{gap:var(--space-4);padding-left:var(--space-4);display:grid}[data-tool-step-name]{display:block}[data-tool-facts] dl{gap:var(--space-4);margin:0;display:grid}[data-tool-fact] dd{max-width:var(--measure,65ch);margin:0}[data-tool-faq-item]{border-bottom:var(--border-w,1px) solid var(--trim);padding-block:var(--space-3)}[data-tool-faq-item]>summary{cursor:pointer;min-height:var(--control-min-h,44px);justify-content:space-between;align-items:center;gap:var(--space-2);display:flex}[data-tool-faq-item]>p{margin-top:var(--space-2)}[data-tool-faq-item]>summary:after{content:var(--tool-faq-mark,"");flex:none}[data-tool-faq-item][open]>summary:after{content:var(--tool-faq-mark-open,var(--tool-faq-mark,""))}[data-tool-related] ul{gap:var(--space-2);margin:0;padding:0;list-style:none;display:grid}[data-tool-related] li>*{padding-block:var(--space-2);display:inline-block}[data-tool-related-list]{grid-template-columns:repeat(auto-fill, minmax(var(--tool-related-min,15rem), 1fr));gap:var(--space-3)}[data-tool-related-list]>li{display:flex}[data-tool-related-list]>li>*{width:100%;min-height:var(--control-min-h,44px);padding-block:var(--space-2);text-align:center;justify-content:center;align-items:center;display:flex}[data-tool-index]{gap:var(--space-8);display:grid}[data-tool-group-grid]{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}[data-tool-group-head] p{margin-top:var(--space-1);max-width:var(--measure,65ch)}@media (max-width:639px){[data-tool-outputs]{grid-auto-flow:row;width:100%}[data-tool-option]{flex-basis:100%}[data-tool-batch-table],[data-tool-batch-table] tbody,[data-tool-batch-row],[data-tool-batch-row]>*,[data-tool-batch-caption]{width:100%;display:block}[data-tool-batch-table] thead{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}[data-tool-batch-row]>*{padding-right:0}[data-tool-batch-size],[data-tool-batch-outcome]{padding-top:var(--space-1);border-top:0}[data-tool-batch-outcome]{display:flex}[data-tool-batch-outcome]>*,[data-tool-batch-all]>*{flex:100%}[data-tool-batch-outcome]>[data-tool-batch-state],[data-tool-batch-outcome]>[data-tool-stage-remove]{flex:none}[data-tool-batch-outcome]>[data-tool-stage-remove]{margin-inline-start:auto}}[data-viewer-app]{position:relative}[data-tool-tutorial-open]{top:var(--space-3);right:var(--space-3);z-index:1;position:absolute}[data-tool-tutorial]{gap:var(--space-4);width:min(42.5rem,90vw);display:grid}[data-tool-tutorial] iframe{margin-inline:calc(44px + var(--space-2,.5rem));aspect-ratio:16/9;border:0}[data-tool-description]{margin-top:var(--space-4);gap:var(--space-3);display:grid}[data-tool-tutorial-open] svg circle{display:none}[data-tool-tutorial-open]:hover{color:var(--primary-fill,var(--highlight))}

[data-css-sentinel=site-begin]{--site-css:begin}[data-css-sentinel=site-end]{--site-css:end}