:root{--spaceRotation:3600s;--spaceWidth:100vw;--spaceHeight:100vh;--twinkleDelay:0s;--starX:0%;--starY:0%;--starSize:2px;--starColor:#fffdf8;--background-color:#050b1a;--surface-color:#000c;--accent-color:#fde790;--text-color:color-mix(in oklab, var(--accent-color) 40%, contrast-color(var(--background-color)) 60%);--default-spacing:1rem;--large-spacing:2rem;font-size:clamp(16px,.8rem + .7vw,22px)}*{box-sizing:border-box}body{background-color:var(--background-color);width:100vw;height:100vh;color:var(--text-color);justify-content:center;align-items:center;margin:0;padding:0;font-family:Cormorant Garamond,Times,serif;display:flex;overflow:hidden}main{flex-direction:column;justify-content:flex-start;align-items:stretch;width:100%;max-width:600px;display:flex}#load-error{margin:var(--default-spacing) 0 0}#load-error[hidden]{display:none}footer{bottom:var(--default-spacing);z-index:10;text-align:center;opacity:.55;padding:0;font-size:.85rem;transition:opacity .3s;position:fixed}footer:hover{opacity:1}h1,article{width:100%;padding:var(--default-spacing);background-color:var(--surface-color);border-radius:var(--default-spacing)}h1{text-align:center;opacity:1;transition:opacity .5s}h1.is-fading{opacity:0}h1 .subtitle{text-align:right;font-size:.875rem;font-style:italic;font-weight:400;display:block}article{opacity:0;overscroll-behavior:contain;max-height:max(8rem,min(65vh,100vh - 12rem,36rem));overflow-y:auto}article.is-visible{animation:.8s ease-out both article-reveal}article{justify-content:flex-start;align-items:center;gap:var(--default-spacing);display:flex}article h2{margin:0;font-size:1.5rem}article #count{min-width:3ch;font-size:2rem}article #count:before{content:"#";vertical-align:.2em;margin-right:.15em;font-size:1rem;display:inline-block}article .way-details{flex:1;min-width:0}article .way-actions{justify-content:flex-end;align-items:center;gap:.75rem;margin-top:.75rem;display:flex}article #copy-link{color:inherit;font:inherit;cursor:pointer;background:0 0;border:1px solid;border-radius:.25rem;padding:.25em .65em;font-size:.8rem}article #copy-link:hover{background:#ffffff14}article #copy-link:focus-visible{outline:2px solid var(--accent-color);outline-offset:3px}article #copy-status{min-height:1em;font-size:.8rem}.mix-controls{right:var(--default-spacing);bottom:calc(var(--default-spacing) + 2rem);z-index:20;opacity:0;justify-content:flex-end;align-items:center;display:flex;position:fixed}.mix-controls.is-visible{animation:.8s ease-out both article-reveal}.mix-controls[hidden]{display:none}#mix-it-up{background:var(--surface-color);color:inherit;font:inherit;cursor:pointer;border:1px solid;border-radius:.25rem;padding:.25em .65em;font-size:.8rem}#mix-it-up:hover{background:#ffffff14}#mix-it-up:focus-visible{outline:2px solid var(--accent-color);outline-offset:3px}#mix-it-up:disabled{cursor:wait;opacity:.6}#mix-status{text-align:right;opacity:0;pointer-events:none;background:#050b1aeb;border:1px solid #ffffff1f;border-radius:.3rem;width:max-content;max-width:min(16rem,100vw - 7rem);padding:.45em .7em;font-size:.75rem;line-height:1.2;transition:opacity .18s,transform .18s;position:absolute;bottom:-2px;right:calc(100% + .65rem);overflow:hidden;transform:translateY(.25rem)}#mix-status.is-visible{opacity:.88;transform:translateY(0)}@keyframes article-reveal{0%{opacity:0}to{opacity:1}}article[hidden]{display:none}.space{z-index:-1;transform-origin:50%;animation:space-rotation var(--spaceRotation) linear infinite;width:var(--spaceWidth);height:var(--spaceHeight);position:fixed}@keyframes space-rotation{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){h1,article{transition:none}article.is-visible,.mix-controls.is-visible{opacity:1;animation:none}.space,.star{animation:none}}@keyframes twinkle-soft{0%,78%,to{opacity:1;transform:scale(1)}82%{opacity:.8;transform:scale(.95)}86%{opacity:1;transform:scale(1.05)}}@keyframes twinkle-flash{0%,87%,to{opacity:1;transform:scale(1)}89%{opacity:.7;transform:scale(1.1)}92%{opacity:1;transform:scale(1)}}@keyframes twinkle-double{0%,73%,to{opacity:1;transform:scale(1)}76%{opacity:.75;transform:scale(1.08)}79%{opacity:1;transform:scale(1)}83%{opacity:.8;transform:scale(1.06)}87%{opacity:1;transform:scale(1)}}.star{left:var(--starX);top:var(--starY);width:var(--starSize);height:var(--starSize);background-color:var(--starColor);pointer-events:none;border-radius:50%;position:absolute}.star.large{--starSize:3px}.star.small{--starSize:1px}.star.color-blue{--starColor:#b8d5ff}.star.color-blue-white{--starColor:#dce8ff}.star.color-white{--starColor:#fffdf8}.star.color-yellow-white{--starColor:#fff0c2}.star.color-orange{--starColor:#ffd0a1}.star.color-red{--starColor:#ffad8a}.star.twinkle-soft{animation:twinkle-soft 50s ease-in-out var(--twinkleDelay) infinite}.star.twinkle-flash{animation:twinkle-flash 70s ease-in-out var(--twinkleDelay) infinite}.star.twinkle-double{animation:twinkle-double 90s ease-in-out var(--twinkleDelay) infinite}
