.svg-cloud-page{position:relative;width:100%;aspect-ratio:16 / 9;overflow:hidden;--svg-cloud-bg: #000;--svg-cloud-fg: #fff;--svg-cloud-muted: rgba(255, 255, 255, .72);--svg-cloud-border: rgba(255, 255, 255, .2);--svg-cloud-panel-bg: rgba(0, 0, 0, .78);--svg-cloud-control-bg: rgba(255, 255, 255, .1);--svg-cloud-control-bg-hover: rgba(255, 255, 255, .16);--svg-cloud-control-fg: #fff;--svg-cloud-pressed-bg: #fff;--svg-cloud-pressed-fg: #000;color-scheme:dark;background:#000;color:#fff;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;letter-spacing:0}.svg-cloud-page[data-theme=light]{--svg-cloud-bg: #fff;--svg-cloud-fg: #000;--svg-cloud-muted: rgba(0, 0, 0, .64);--svg-cloud-border: rgba(0, 0, 0, .18);--svg-cloud-panel-bg: rgba(255, 255, 255, .86);--svg-cloud-control-bg: rgba(0, 0, 0, .06);--svg-cloud-control-bg-hover: rgba(0, 0, 0, .1);--svg-cloud-control-fg: #000;--svg-cloud-pressed-bg: #000;--svg-cloud-pressed-fg: #fff;color-scheme:light;background:#fff;color:#000}.svg-cloud-scene{position:absolute;inset:0;overflow:hidden;touch-action:none}.svg-cloud-scene canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}.svg-cloud-grid-overlay{position:absolute;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(to right,color-mix(in srgb,var(--svg-cloud-fg) 11%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--svg-cloud-fg) 11%,transparent) 1px,transparent 1px);background-position:center;background-size:var(--svg-cloud-grid-cell, 8px) var(--svg-cloud-grid-cell, 8px)}.svg-cloud-drop-overlay{position:absolute;inset:0;z-index:10;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--svg-cloud-fg) 42%,transparent);background:color-mix(in srgb,var(--svg-cloud-bg) 72%,transparent);color:var(--svg-cloud-fg);font-size:12px;letter-spacing:0;pointer-events:none}.svg-cloud-status{position:absolute;inset:0;z-index:3;display:grid;place-items:center;padding:24px;color:currentColor;font-size:12px;line-height:1.4;text-align:center;pointer-events:none}.svg-cloud-panel-toggle{position:absolute;z-index:12;top:16px;right:16px;display:grid;width:36px;height:36px;place-items:center;border:0;background:transparent;color:currentColor;font:inherit;font-size:20px;line-height:1}.svg-cloud-regenerate{position:absolute;z-index:12;top:60px;right:16px;display:grid;width:36px;height:36px;place-items:center;border:0;background:transparent;color:currentColor;padding:0;font:inherit;line-height:1}.svg-cloud-regenerate svg{display:block;width:24px;height:24px}.svg-cloud-panel{position:absolute;z-index:11;top:104px;right:16px;display:grid;width:min(320px,calc(100vw - 32px));max-height:calc(100% - 120px);gap:12px;padding:14px;overflow:auto;border:1px solid var(--svg-cloud-border);border-radius:8px;background:var(--svg-cloud-panel-bg);box-shadow:0 18px 52px #0000002e;backdrop-filter:blur(18px);color:var(--svg-cloud-control-fg);font-size:11px;line-height:1.3}.svg-cloud-panel-header,.svg-cloud-meta,.svg-cloud-switches,.svg-cloud-zoom-row,.svg-cloud-direction-grid{display:flex;align-items:center;gap:8px}.svg-cloud-panel-header{justify-content:space-between;padding-bottom:4px;border-bottom:1px solid var(--svg-cloud-border)}.svg-cloud-panel-header strong{font-size:11px}.svg-cloud-panel-header span,.svg-cloud-meta{color:var(--svg-cloud-muted)}.svg-cloud-panel label{display:grid;gap:5px}.svg-cloud-panel label span{display:flex;justify-content:space-between;color:var(--svg-cloud-muted)}.svg-cloud-panel select,.svg-cloud-panel input,.svg-cloud-panel button{color:var(--svg-cloud-control-fg);font:inherit;letter-spacing:0}.svg-cloud-panel select{min-height:30px;border:1px solid var(--svg-cloud-border);border-radius:6px;background:var(--svg-cloud-control-bg);padding:0 8px}.svg-cloud-panel select option{background:var(--svg-cloud-bg);color:var(--svg-cloud-fg)}.svg-cloud-panel input[type=range]{width:100%;accent-color:var(--svg-cloud-control-fg)}.svg-cloud-panel button{min-height:30px;border:1px solid var(--svg-cloud-border);border-radius:6px;background:var(--svg-cloud-control-bg);color:var(--svg-cloud-control-fg)}.svg-cloud-panel button:hover{background:var(--svg-cloud-control-bg-hover)}.svg-cloud-panel button[aria-pressed=true]{background:var(--svg-cloud-pressed-bg);color:var(--svg-cloud-pressed-fg)}.svg-cloud-switches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.svg-cloud-direction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.svg-cloud-direction-grid button:last-child{grid-column:1 / -1}.svg-cloud-zoom-row{display:grid;grid-template-columns:30px 1fr 30px 30px auto}.svg-cloud-meta{display:grid;grid-template-columns:1fr;gap:3px;padding-top:4px;border-top:1px solid var(--svg-cloud-border)}@media(max-width:520px){.svg-cloud-panel{inset:auto 10px 10px;width:auto;max-height:calc(100% - 20px)}.svg-cloud-panel-toggle{top:10px;right:10px}.svg-cloud-regenerate{top:54px;right:10px}}*,*:after,*:before{box-sizing:border-box}html,body{transition:color .125s ease,background-color .2s ease,border-color .125s ease}button{user-select:none;cursor:pointer}a{color:currentColor}.color{color:var(--text)}.bg-color{background-color:var(--background)}.color-alt{color:var(--background)}.bg-color-alt{background-color:var(--text)}.last-no-border:last-of-type{border:0!important}.dynamic-grid :nth-child(6n+1),.dynamic-grid :nth-child(6n+6){grid-area:span 2/span 2}.dynamic-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-flow:dense}.dynamic-grid :nth-child(6){grid-column:span 2}.dynamic-grid :nth-child(7){grid-column:span 2}.dynamic-grid :nth-child(8){grid-column:span 2}.grid-2-3>*{grid-column:span 3}.grid-2-3>*:nth-child(n+3){grid-column:span 3}.randoma11y-tile{transform:translateY(4px);opacity:0;animation:randoma11y-fade-in .24s ease-out forwards}@keyframes randoma11y-fade-in{0%{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}.cssstats-item{transition:background-color .22s ease,box-shadow .22s ease}.cssstats-item--new{animation:cssstats-highlight-in .42s ease-out}@keyframes cssstats-highlight-in{0%{background-color:#ffff004d;box-shadow:0 0 0 1px #0000002e}60%{background-color:#ffff002e}to{background-color:#00000005;box-shadow:0 0 0 1px #0000001a}}@media screen and (min-width:48em){.grid-columns{grid-template-columns:2fr 1fr 1fr 1fr;column-gap:32px;display:grid}}
