.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.video-controls{position:absolute;left:2.269044%;top:57.234043%;width:64.019449%;display:flex;align-items:center;gap:9px;z-index:5;height:26px}
.video-toggle{display:grid;place-items:center;flex:none;width:24px;height:26px;padding:4px;border:0;border-radius:0;background:none;color:#111;cursor:pointer;opacity:.85}
.video-toggle:hover{opacity:1}.video-toggle:focus-visible{outline:1px solid #111;outline-offset:2px}
.video-toggle svg{grid-area:1/1;pointer-events:none}.video-toggle .pause-icon{display:none}.video-toggle.is-playing .play-icon{display:none}.video-toggle.is-playing .pause-icon{display:block}
.video-progress{appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0;height:22px;margin:0;background:none;cursor:pointer;--progress:0%}
.video-progress::-webkit-slider-runnable-track{height:1px;background:linear-gradient(to right,#111 var(--progress),#d5d5d5 var(--progress))}
.video-progress::-moz-range-track{height:1px;background:#d5d5d5}.video-progress::-moz-range-progress{height:1px;background:#111}
.video-progress::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:5px;height:5px;border:0;border-radius:50%;background:#111;margin-top:-2px}
.video-progress::-moz-range-thumb{width:5px;height:5px;border:0;border-radius:50%;background:#111}
.video-progress:focus-visible{outline:1px solid #111;outline-offset:2px}
.piece-tooltip{position:fixed;z-index:1000;width:240px;max-width:calc(100vw - 24px);padding:13px 15px 14px;background:#fffffff2;backdrop-filter:blur(14px);border:1px solid #00000012;border-radius:3px;box-shadow:0 6px 22px #0000000e;pointer-events:none;font-family:Lexend,Arial,sans-serif;color:#222;animation:note-appear .15s ease-out}
.tooltip-heading{display:flex;align-items:center;gap:8px;margin-bottom:7px}.tooltip-heading strong{font-weight:350;font-size:11px;letter-spacing:.01em;line-height:1.4}
.piece-tooltip p{font-weight:250;font-size:11px;line-height:1.65;margin:0;color:#555}
.sample-dot{width:9px;height:9px;flex:none;border-radius:50%;background:var(--picked-color,#f57255);box-shadow:inset 0 0 0 1px #00000012;transition:background .12s}
.picker-cursor{position:fixed;z-index:1001;width:19px;height:19px;pointer-events:none;transform:translate(-9.5px,-9.5px);border:1px solid #fff;box-shadow:0 0 0 1px #111,inset 0 0 0 1px #111;background:transparent;border-radius:0}
.picker-cursor::before,.picker-cursor::after{content:"";position:absolute;background:white;box-shadow:0 0 0 .5px #111}
.picker-cursor::before{left:8px;top:4px;width:1px;height:9px}.picker-cursor::after{left:4px;top:8px;width:9px;height:1px}
.sample-pixel{position:absolute;left:24px;top:24px;width:12px;height:12px;background:var(--picked-color,#f57255);border:1px solid white;box-shadow:0 0 0 1px #111;border-radius:0}
.picker-cursor[hidden],.piece-tooltip[hidden]{display:none}
@media(hover:hover) and (pointer:fine){html.picker-active .home,html.picker-active .home *{cursor:none!important}}
@media(prefers-reduced-motion:reduce){.piece-tooltip{animation:none}}
@keyframes note-appear{from{opacity:0;margin-top:3px}to{opacity:1;margin-top:0}}

@font-face{font-family:'Spline Sans Mono';src:url(assets/spline-sans-mono.woff2) format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:Italianno;src:url(assets/italianno.woff2) format('woff2');font-weight:400;font-display:swap}
.video-sound{width:24px;flex:none}.video-sound .sound-waves{display:none}.video-sound.is-audible .sound-waves{display:block}.video-sound.is-audible .sound-muted{display:none}
.style-card{background:white;color:#111;box-sizing:border-box}.mini-animation{position:absolute;object-fit:cover;pointer-events:none}

.home{user-select:text;-webkit-user-select:text}.art img{user-select:none;-webkit-user-select:none;-webkit-user-drag:none;pointer-events:auto}.animation-icon{display:block;filter:none!important;box-shadow:none!important;overflow:visible}.animation-icon img{object-fit:fill!important}
html.dragging-image .art{transform:none!important}
.style-card{font:inherit;text-align:left}

.picker-cursor.is-text{background:#ffffff55}.picker-cursor.is-text .sample-pixel{background:#fff}

.home ::selection{background:#fff;color:#000;text-shadow:0 0 1px #aaa}
