yarn-loading{position:fixed;inset:0;z-index:100;display:grid;place-items:center;overflow:auto;padding:24px;background:#322b3d;color:#fff;font-family:system-ui,sans-serif;text-align:center;touch-action:pan-y;user-select:auto}
yarn-loading[hidden]{display:none}
.yarn-loading-content{width:min(100%,540px);margin:auto}
.yarn-loading-art{display:block;position:relative;aspect-ratio:480/400;width:100%;height:auto;max-height:min(58dvh,max(100px,calc(100dvh - 240px)));overflow:visible}
yarn-loading h1{font-size:clamp(22px,4vw,30px);font-weight:600;letter-spacing:.02em;margin:12px 0}
yarn-loading p{color:#e2dce7;font-size:16px;line-height:1.5;margin:0 0 24px}
yarn-loading .yarn-loading-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;min-width:100px;padding:10px 20px;border:1px solid #ffffff55;border-radius:999px;color:white;background:transparent;text-decoration:none;font:600 16px system-ui,sans-serif}
yarn-loading .yarn-loading-link:focus-visible{outline:3px solid #f8d461;outline-offset:5px}
.yarn-loading-art>svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.yarn-ball{transform-origin:50% 50%;will-change:transform;backface-visibility:hidden}
.yarn-tail{stroke-dasharray:1 1}
.yarn-gathered{stroke-dasharray:0 1}
yarn-loading .yarn-loading-replay{display:inline-flex;align-items:center;justify-content:center;margin:0;min-height:44px;padding:8px 16px;border:0;border-radius:12px;background:transparent;color:#e2dce7;font:inherit;cursor:pointer}
yarn-loading .yarn-loading-replay:focus-visible{outline:3px solid #f8d461;outline-offset:3px}

.yarn-loading-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}
