:root{color-scheme:dark;background:#000;color:#f6f6f5;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;display:grid;place-items:center;padding:64px 28px;-webkit-font-smoothing:antialiased}
main{width:min(100%,450px);transform:translateY(-20px)}
header{margin-bottom:24px}
h1{display:inline-block;font-size:clamp(28px,5vw,34px);line-height:1.25;font-weight:500;letter-spacing:-1.15px;margin:0 0 42px}
header p{font-size:13px;line-height:1.5;letter-spacing:.02em;margin:0;color:#b8b8b8}
.project{display:flex;align-items:center;gap:16px;min-height:90px;padding:20px 0;text-decoration:none;color:inherit;border-top:1px solid #ffffff1c;font-size:23px;letter-spacing:-.5px;font-weight:450}
.project:last-child{border-bottom:1px solid #ffffff1c}
.project-mark{width:24px;height:24px;flex:0 0 24px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;opacity:.9;transition:opacity .18s ease}
.series .project-mark{color:#b7a0ff}
.songs .project-mark{color:#77d9b2}
.project-label{display:block;transform-origin:left center;transition:transform .18s cubic-bezier(.22,.61,.36,1)}
.arrow{width:18px;height:18px;flex:0 0 18px;margin-left:auto;stroke:#aaa;stroke-width:1.2;transition:transform .18s cubic-bezier(.22,.61,.36,1),stroke .18s ease}
.project:focus-visible .project-label{transform:scale(1.04)}
.project:focus-visible .arrow{transform:translate(2px,-2px) scale(1.08);stroke:#fff}
.project:focus-visible .project-mark{opacity:1}
a:focus-visible{outline:2px solid #f6f6f5;outline-offset:8px;border-radius:2px}
@media(hover:hover){
  .project:hover .project-label{transform:scale(1.04)}
  .project:hover .arrow{transform:translate(2px,-2px) scale(1.08);stroke:#fff}
  .project:hover .project-mark{opacity:1}
}
@media(max-width:380px){body{padding-inline:24px}h1{font-size:28px}main{transform:none}.project{font-size:21px;min-height:86px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;transform:none!important}}
@media(forced-colors:active){.project{border-color:CanvasText}.arrow{stroke:LinkText}.project .project-mark{color:LinkText;opacity:1}}