*{box-sizing:border-box;margin:0;padding:0}body{background:#000;overflow:hidden}#landing{z-index:100;cursor:inherit;background:#000;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#landing.hidden{pointer-events:none}.text-container{flex-wrap:wrap;justify-content:center;gap:4px;max-width:90vw;padding:0 2rem;display:flex}.pixel-char{opacity:0;display:grid;position:relative}.pixel-char .on{background:#fff}.pixel-char .off{background:0 0}#cursor{grid-template-rows:repeat(34,3px);grid-template-columns:repeat(2,3px);align-self:center;animation:.6s step-end infinite blink;display:grid}#cursor .on{background:#fff}#cursor.hidden{display:none}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.enter-hint{opacity:0;-webkit-user-select:none;user-select:none;gap:0;display:flex;position:fixed;bottom:3rem;transform:translateY(20px)}.enter-hint .pixel-char-sm{display:grid}.enter-hint .pixel-char-sm .on{background:#fff}.enter-hint .pixel-char-sm .off{background:0 0}.enter-hint .spacer{width:10px}#deco-canvas{pointer-events:none;z-index:50;opacity:0;width:100vw;height:100vh;position:fixed;inset:0}#main{background:#000;justify-content:center;align-items:center;gap:80px;width:100vw;height:100vh;display:flex}.profile{cursor:inherit;flex-direction:column;align-items:center;gap:20px;padding:20px;transition:transform .5s cubic-bezier(.16,1,.3,1);display:flex}.profile:hover{transform:scale(1.02)}.pfp{object-fit:cover;opacity:0;will-change:box-shadow, filter;border-radius:50%;width:160px;height:160px;transition:box-shadow .5s cubic-bezier(.16,1,.3,1),filter .5s;box-shadow:0 0 #fff0}.profile:hover .pfp{filter:brightness(1.08);box-shadow:0 0 12px #ffffff14,0 0 35px #ffffff08}.pixel-name{opacity:.4;gap:0;transition:opacity .4s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1);display:flex;transform:scale(1)}.pixel-name.hidden{opacity:0}.profile:hover .pixel-name{opacity:1}.pixel-name .pixel-char-sm{display:grid}.pixel-name .pixel-char-sm .on{background:#fff}.pixel-name .pixel-char-sm .off{background:0 0}#volume-control{z-index:200;opacity:0;image-rendering:pixelated;align-items:center;gap:8px;padding:6px 10px;transition:opacity 1s;display:none;position:fixed;top:16px;right:16px}#volume-control.visible{opacity:.4;display:flex}#volume-control:hover{opacity:.9}#mute-btn{cursor:inherit;background:0 0;border:none;align-items:center;padding:2px;display:flex}#mute-btn canvas{image-rendering:pixelated;width:42px;height:36px}#volume-slider-wrap{width:60px;height:12px;cursor:inherit;position:relative}#volume-track{background:#ffffff26;width:100%;height:3px;position:absolute;top:5px;left:0}#volume-fill{background:#ffffff80;width:50%;height:3px;position:absolute;top:5px;left:0}#volume-knob{background:#fff;width:6px;height:11px;position:absolute;top:1px;left:50%;transform:translate(-50%)}
