:root{--bg:#191917;--bg-footer-line:#262623;--text:#e8e6dc;--text-dim:#8a887e;--text-faint:#5f5e5a;--row-line:#33332f;--btn-line:#44443f;--purple:#7f77dd;--purple-light:#afa9ec;--teal:#5dcaa5;--teal-light:#9fe1cb;--coral:#f0997b;--coral-light:#f5c4b3;--pink:#d4537e;--pink-light:#f4c0d1;--mono:ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;--sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{background:var(--bg);min-height:100%;color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;flex-direction:column;display:flex}a{color:inherit;text-decoration:none}a:focus-visible,.knock:focus-visible{outline:2px solid var(--purple);outline-offset:4px;border-radius:4px}header{justify-content:space-between;align-items:center;padding:22px clamp(20px,5vw,40px);display:flex}.mark{gap:4px;display:flex}.mark span{border-radius:2px;width:10px;height:10px;display:block}.mark span:first-child{background:var(--purple);animation:3.2s ease-in-out infinite drift}.mark span:nth-child(2){background:var(--teal);animation:2.6s ease-in-out infinite driftB}.mark span:nth-child(3){background:var(--coral)}.wordmark{font-family:var(--mono);color:var(--text-dim);letter-spacing:1px;font-size:13px}main{text-align:center;flex-direction:column;flex:1;align-items:center;padding:clamp(48px,10vh,96px) 24px clamp(56px,9vh,88px);display:flex}.eyebrow{font-family:var(--mono);color:var(--text-dim);letter-spacing:2px;font-size:clamp(11px,2.8vw,13px)}h1{letter-spacing:-.01em;margin-top:30px;font-size:clamp(30px,7vw,44px);font-weight:500;line-height:1.3}.cursor{background:var(--pink);vertical-align:-.08em;width:.34em;height:.85em;margin-left:.22em;animation:1.1s step-end infinite cursorBlink;display:inline-block}.subline{color:var(--text-dim);max-width:26em;margin-top:30px;font-size:clamp(14px,3.6vw,17px);line-height:1.8}.plays{text-align:left;width:min(420px,100%);margin-top:clamp(52px,9vh,84px)}.plays h2{font-family:var(--mono);color:var(--text-faint);letter-spacing:2px;margin-bottom:12px;font-size:11px;font-weight:400}.plays a{border-bottom:1px solid var(--row-line);justify-content:space-between;align-items:center;padding:15px 2px;font-size:clamp(15px,4vw,17px);transition:padding-left .25s ease-out,border-color .25s ease-out;display:flex}.plays a .arrow{opacity:0;font-size:15px;line-height:1;transition:opacity .25s ease-out,transform .25s ease-out;transform:translate(-4px,4px)}.plays a:hover,.plays a:focus-visible{outline:none;padding-left:12px}.plays a:hover .arrow,.plays a:focus-visible .arrow{opacity:1;transform:translate(0)}.plays a[data-hue=purple]:hover,.plays a[data-hue=purple]:focus-visible{border-color:var(--purple)}.plays a[data-hue=purple] .arrow{color:var(--purple-light)}.plays a[data-hue=teal]:hover,.plays a[data-hue=teal]:focus-visible{border-color:var(--teal)}.plays a[data-hue=teal] .arrow{color:var(--teal-light)}.plays a[data-hue=coral]:hover,.plays a[data-hue=coral]:focus-visible{border-color:var(--coral)}.plays a[data-hue=coral] .arrow{color:var(--coral-light)}.plays a[data-hue=pink]:hover,.plays a[data-hue=pink]:focus-visible{border-color:var(--pink)}.plays a[data-hue=pink] .arrow{color:var(--pink-light)}.knock-wrap{margin-top:clamp(56px,10vh,96px)}.knock{border:1px solid var(--btn-line);color:var(--text);font-size:15px;font-family:var(--sans);border-radius:28px;padding:13px 36px;transition:transform .2s ease-out,border-color .2s ease-out,background .2s ease-out;display:inline-block;transform:rotate(-1deg)}.knock:hover{border-color:var(--text-dim);background:#e8e6dc0a;animation:.55s cubic-bezier(.28,.84,.42,1) knockKnock}.knock:active{transform:rotate(0)scale(.96)}@keyframes knockKnock{0%{transform:rotate(-1deg)translateY(0)}18%{transform:rotate(.5deg)translateY(-9px)}34%{transform:rotate(-.5deg)translateY(0)}40%{transform:rotate(-.5deg)translateY(0)scaleY(.96)}52%{transform:rotate(.5deg)translateY(-5px)scale(1)}68%{transform:rotate(-1deg)translateY(0)}76%{transform:rotate(-1deg)translateY(0)scaleY(.98)}to{transform:rotate(-1deg)translateY(0)scale(1)}}footer{border-top:1px solid var(--bg-footer-line);font-family:var(--mono);color:var(--text-faint);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:18px clamp(20px,5vw,40px);font-size:11px;display:flex}@keyframes cursorBlink{0%,49%{opacity:1}50%,to{opacity:0}}@keyframes drift{0%,to{transform:translateY(0)rotate(-4deg)}50%{transform:translateY(-5px)rotate(-4deg)}}@keyframes driftB{0%,to{transform:translateY(-3px)rotate(6deg)}50%{transform:translateY(3px)rotate(6deg)}}@media (prefers-reduced-motion:reduce){.mark span,.cursor,.knock:hover{animation:none}.cursor{opacity:1}.plays a,.plays a .arrow,.knock{transition:none}}@media (width<=420px){footer{text-align:center;justify-content:center}}