*{box-sizing:border-box;margin:0;padding:0}
:root{--ink:#e9e4d8;--amber:#ffb15c;--bg:#07090f}
html,body{height:100%;background:var(--bg);overflow:hidden;overscroll-behavior:none}
body{color:var(--ink);font:500 13px/1.2 ui-monospace,"SF Mono",Menlo,Consolas,monospace;-webkit-tap-highlight-color:transparent;user-select:none}
#gl{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;display:block;touch-action:none;cursor:grab}
#gl.hot{cursor:pointer}
#gl:active{cursor:grabbing}

#loader{position:fixed;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;background:var(--bg);z-index:10;transition:opacity .9s ease,visibility .9s}
#loader.gone{opacity:0;visibility:hidden}
.ld-track{width:min(220px,56vw);height:1px;background:#ffffff1f;overflow:hidden}
.ld-bar{height:100%;width:0;background:var(--amber);transition:width .25s}
.ld-num{letter-spacing:.2em;font-size:11px;opacity:.55;font-variant-numeric:tabular-nums}
.board{display:flex;align-items:center;gap:10px;margin-top:6px;padding:12px 22px;border:1px solid #ffb15c66;border-radius:999px;background:#ffb15c12;color:var(--amber);font:inherit;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;transition:background .2s,transform .2s}
.board:focus-visible{outline:2px solid var(--amber);outline-offset:4px}
@media (hover:hover){.board:hover{background:#ffb15c26}}
#loader.ready .ld-track,#loader.ready .ld-num{display:none}
.board:active{transform:scale(.97)}
.board svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.enter{position:fixed;z-index:6;left:50%;bottom:calc(max(24px,env(safe-area-inset-bottom)) + 9vh);transform:translateX(-50%);background:#07090fb3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:rise .8s ease both}
.board[hidden]{display:none}
.enter:active{transform:translateX(-50%) scale(.97)}
@keyframes rise{from{opacity:0;translate:0 10px}}
body.intro::before,body.intro::after{content:"";position:fixed;left:0;right:0;height:9vh;background:#000;z-index:3;pointer-events:none}
body.intro::before{top:0}body.intro::after{bottom:0}
@media (max-aspect-ratio:1/1){body.intro::before,body.intro::after{height:5vh}}

.dock{position:fixed;z-index:5;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;gap:6px;padding:6px;border-radius:999px;background:#0a0d16a8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #ffffff14;opacity:0;transition:opacity 1.2s ease .6s}
.dock.show{opacity:1}
.dock button{width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:#d9d3c5;display:grid;place-items:center;cursor:pointer;transition:background .2s,color .2s}
@media (hover:hover){.dock button:hover{background:#ffffff12}}
.dock button:focus-visible{outline:1px solid var(--amber);outline-offset:2px}
.dock button[aria-pressed="true"]:not([data-act="sound"]){color:var(--amber);background:#ffb15c1a}
.dock svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dock [data-act="sound"] .off{display:none}
.dock [data-act="sound"][aria-pressed="false"] .on{display:none}
.dock [data-act="sound"][aria-pressed="false"] .off{display:block}
.dock button.tick{animation:tick .35s ease}
@keyframes tick{50%{transform:scale(.86)}}

.hint{position:fixed;z-index:4;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:1px solid #ffb15caa;pointer-events:none;opacity:0;transition:opacity .6s}
.hint.show{opacity:1;animation:ping 1.8s ease-out infinite}
@keyframes ping{0%{transform:scale(.6);opacity:1}80%,100%{transform:scale(1.6);opacity:0}}
@media (min-width:900px) and (min-aspect-ratio:4/3){.dock{left:auto;right:24px;transform:none;flex-direction:column;bottom:50%;translate:0 50%}}
@media (prefers-reduced-motion:reduce){.hint.show{animation:none}#loader,.dock{transition-duration:.01s;transition-delay:0s}.dock button.tick{animation:none}}

@font-face{font-family:Briptoe;src:url(assets/font/briptoe.otf) format('opentype');font-display:swap}
.tl{position:fixed;z-index:4;left:max(28px,env(safe-area-inset-left));top:max(20px,env(safe-area-inset-top));display:flex;flex-direction:column;align-items:flex-start;gap:10px;max-width:calc(100vw - 40px)}
body.intro .tl{display:none}
.title{margin:0;font:400 clamp(44px,9vw,128px)/.9 Briptoe,ui-monospace,monospace;color:#f3ead8;text-shadow:0 4px 30px #000a;pointer-events:none;animation:rise .7s ease both}
.title[hidden]{display:none}
.title.sec{font-size:clamp(36px,6vw,84px)}
body.intro .title{display:none}
#dockOld{display:none}
.sound{position:fixed;z-index:5;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));width:44px;height:44px;border-radius:50%;border:1px solid #ffffff14;background:#0a0d16a8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#d9d3c5;display:grid;place-items:center;cursor:pointer;animation:rise .8s ease both}
.sound[hidden]{display:none}
.sound:focus-visible{outline:1px solid var(--amber);outline-offset:2px}
@media (hover:hover){.sound:hover{color:var(--amber)}}
.sound svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sound .off,.sound[aria-pressed="false"] .on{display:none}
.sound[aria-pressed="false"] .off{display:block}
@media (max-width:899px),(max-aspect-ratio:4/3){.sound{bottom:calc(max(18px,env(safe-area-inset-bottom)) + 64px)}}
.nav button{width:auto;min-width:44px;padding:0 14px;border-radius:999px;font:inherit;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.nav button[aria-current="true"]{color:var(--amber);background:#ffb15c1a}

.skip{position:fixed;z-index:6;right:max(20px,env(safe-area-inset-right));bottom:calc(9vh + 16px);height:40px;padding:0 18px;border:1px solid #ffffff2e;border-radius:999px;background:#07090f99;color:#d9d3c5;font:inherit;font-size:11px;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;animation:rise .8s ease both}
.skip[hidden]{display:none}
.skip:focus-visible{outline:1px solid var(--amber);outline-offset:2px}
@media (hover:hover){.skip:hover{color:var(--amber);border-color:#ffb15c66}}
@media (max-aspect-ratio:1/1){.skip{bottom:calc(5vh + 14px)}}

.panel{position:fixed;z-index:4;right:max(132px,env(safe-area-inset-right));top:15%;width:min(440px,42vw);text-align:right;font-family:Briptoe,ui-monospace,monospace;color:#f3ead8;text-shadow:0 2px 18px #000c,0 1px 3px #000a;animation:rise .6s ease both;user-select:text}
.panel[hidden]{display:none}
.panel p{font-size:clamp(22px,2.6vw,36px);line-height:1.18}
.panel dl{display:grid;grid-template-columns:1fr auto;gap:6px 22px;align-items:baseline}
.panel dt{font:500 12px/1 ui-monospace,Consolas,monospace;letter-spacing:.2em;text-transform:uppercase;opacity:.7}
.panel dd{font-size:clamp(22px,2.4vw,34px);line-height:1.15;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.panel dd button{font:inherit;color:var(--amber);background:none;border:0;cursor:pointer;padding:0;text-align:right;overflow-wrap:anywhere;text-shadow:inherit}
@media (max-width:899px),(max-aspect-ratio:4/3){.panel{left:20px;right:20px;width:auto;top:calc(max(20px,env(safe-area-inset-top)) + 196px)}.panel p{font-size:26px}.panel dd{font-size:24px}}

.meme-nav{position:fixed;z-index:5;left:50%;bottom:calc(max(18px,env(safe-area-inset-bottom)) + 68px);transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:4px;border-radius:999px;background:#0a0d16a8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #ffffff14;font-variant-numeric:tabular-nums;font-size:11px;letter-spacing:.14em}
.meme-nav[hidden]{display:none}
.meme-nav button{width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:#d9d3c5;display:grid;place-items:center;cursor:pointer}
.meme-nav button:focus-visible{outline:1px solid var(--amber)}
@media (hover:hover){.meme-nav button:hover{background:#ffffff12;color:var(--amber)}}
.meme-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:900px) and (min-aspect-ratio:4/3){.meme-nav{bottom:max(24px,env(safe-area-inset-bottom))}}

.links{display:flex;flex-wrap:wrap;margin-left:-10px;gap:2px;opacity:0;transition:opacity 1.2s ease .6s}
.links[hidden]{display:none}
body:not(.intro) .links{opacity:1}
.links>*{min-width:44px;height:44px;padding:0 10px;display:grid;place-items:center;color:#d9d3c5;text-decoration:none;letter-spacing:.18em;text-transform:uppercase;font-size:11px;border-radius:999px;transition:background .2s,color .2s}
.links>*:focus-visible{outline:1px solid var(--amber);outline-offset:2px}
@media (hover:hover){.links>*:hover{background:#ffffff12;color:var(--amber)}}
.links>.dis{opacity:.5;cursor:default}
.links img{width:22px;height:22px;object-fit:contain}
.links .ico{width:20px;height:20px;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.ca{display:flex;align-items:center;gap:10px;max-width:min(420px,calc(100vw - 40px));padding:8px 8px 8px 14px;border:1px solid #ffffff1f;border-radius:999px;background:#0a0d16a8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:11px;letter-spacing:.12em}
.ca[hidden]{display:none}
.ca b{font-weight:500;color:var(--amber);letter-spacing:.2em}
.ca span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#d9d3c5;user-select:text}
.ca button{height:28px;padding:0 12px;border:0;border-radius:999px;background:#ffb15c1f;color:var(--amber);font:inherit;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.ca button:disabled{opacity:.45;cursor:default}
.ca button:focus-visible{outline:1px solid var(--amber)}

/* section dock: text pills on touch; on desktop, brutalist cards tucked into the right edge, slide out on hover */
.nav svg.i,.nav .h{display:none}
@media (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){
  .dock.nav{right:0;padding:0;gap:14px;background:none;border:0;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none;align-items:flex-end;overflow:visible}
  .dock.nav button{--r:0deg;width:310px;height:56px;padding:0 18px;justify-content:flex-start;display:flex;align-items:center;gap:16px;border:2.5px solid #0b0b0f;border-right:0;border-radius:16px 0 0 16px;background:#f3ead8;color:#0b0b0f;box-shadow:-5px 5px 0 #0b0b0f;font:400 22px/1 Briptoe,ui-monospace,monospace;letter-spacing:.02em;text-transform:none;transform:translateX(256px);rotate:var(--r);transition:transform .7s cubic-bezier(.2,.9,.25,1.2),rotate .8s cubic-bezier(.2,.9,.25,1.2),background .2s;transition-timing-function:linear(0.000,0.056,0.204,0.408,0.636,0.858,1.050,1.199,1.296,1.341,1.340,1.303,1.240,1.164,1.085,1.013,0.954,0.911,0.887,0.880,0.888,0.906,0.931,0.958,0.984,1.007,1.025,1.036,1.041,1.041,1.036,1.028,1.019,1.010,1.001,0.994,0.989,0.986,0.986,0.987,1),linear(0.000,0.056,0.204,0.408,0.636,0.858,1.050,1.199,1.296,1.341,1.340,1.303,1.240,1.164,1.085,1.013,0.954,0.911,0.887,0.880,0.888,0.906,0.931,0.958,0.984,1.007,1.025,1.036,1.041,1.041,1.036,1.028,1.019,1.010,1.001,0.994,0.989,0.986,0.986,0.987,1),ease}
  /* card runs ~80px past the screen edge so the spring overshoot and the tilt never expose its end */
  .dock.nav button svg{display:block;flex:none;width:24px;height:24px;stroke-width:2.2}
  .dock.nav .h{display:inline}
  .dock.nav button:hover,.dock.nav button:focus-visible{transform:translateX(80px);rotate:calc(var(--r) * -.6);background:#fff7e6}
  .dock.nav button:focus-visible{outline:none}
  .dock.nav button[aria-current="true"]{background:var(--amber);color:#0b0b0f}
  /* hand-placed tilt, like the title lettering */
  .dock.nav button:nth-child(1){--r:-3deg}.dock.nav button:nth-child(2){--r:2deg}.dock.nav button:nth-child(3){--r:-1.5deg}.dock.nav button:nth-child(4){--r:2.8deg}
}

/* ── brutalist skin: cream card, thick ink border, hard shadow, filled rounded icons ── */
:root{--card:#f3ead8;--ink:#0b0b0f;--bw:2.5px}
.board,.skip,.sound,.ca,.links>*,.meme-nav{background:var(--card);color:var(--ink);border:var(--bw) solid var(--ink);box-shadow:4px 4px 0 var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
/* Material Symbols Rounded, filled */
.board svg,.skip svg,.sound svg,.meme-nav svg,.nav svg{fill:currentColor;stroke:none}
.board,.skip{font-weight:700}
.board:active,.skip:active,.sound:active,.ca button:active,.links>a:active{translate:2px 2px;box-shadow:2px 2px 0 var(--ink)}
@media (hover:hover){.board:hover,.skip:hover,.sound:hover,.links>a:hover{background:#fff7e6;color:var(--ink);border-color:var(--ink)}}
.board:focus-visible,.skip:focus-visible,.sound:focus-visible,.links>*:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.sound{border-radius:14px}
.links{gap:10px;margin-left:0}
.links>*{min-width:44px;height:44px;padding:0 9px;border-radius:14px;color:var(--ink);box-shadow:3px 3px 0 var(--ink)}
.links>.dis{opacity:1;color:#0b0b0f8c;background:#e2dacb}
.links>.dis img{opacity:.5}
.links img.ink{filter:brightness(0)}
.ca{padding:6px 6px 6px 14px;border-radius:14px}
.ca b{color:var(--ink);font-weight:800}
.ca span{color:var(--ink)}
.ca button{border:2px solid var(--ink);border-radius:9px;background:var(--amber);color:var(--ink);font-weight:700}
.meme-nav{border-radius:16px;padding:4px}
.meme-nav span{color:var(--ink);font-weight:700}
.meme-nav button{color:var(--ink);border-radius:10px}
@media (hover:hover){.meme-nav button:hover{background:#0b0b0f14;color:var(--ink)}}
/* touch dock (bottom): one brutal card holding text pills */
@media not all and (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){
  .dock.nav{background:var(--card);border:var(--bw) solid var(--ink);border-radius:18px;box-shadow:4px 4px 0 var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
  .dock.nav button{color:var(--ink);font-weight:700;border-radius:11px}
  .dock.nav button[aria-current="true"]{background:var(--amber);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
}
/* breathing room from the screen edges, shared by every corner element */
:root{--edge:clamp(24px,4vw,56px)}
.tl{left:max(var(--edge),env(safe-area-inset-left));top:max(var(--edge),env(safe-area-inset-top));gap:14px}
.sound{right:max(var(--edge),env(safe-area-inset-right));bottom:max(var(--edge),env(safe-area-inset-bottom))}
.skip{right:max(var(--edge),env(safe-area-inset-right))}
.meme-nav{bottom:max(var(--edge),env(safe-area-inset-bottom))}
.panel{right:calc(var(--edge) + 96px)}
@media (max-width:899px),(max-aspect-ratio:4/3){
  .dock{bottom:max(var(--edge),env(safe-area-inset-bottom))}
  .sound,.meme-nav{bottom:calc(max(var(--edge),env(safe-area-inset-bottom)) + 72px)}
  .meme-nav{bottom:calc(max(var(--edge),env(safe-area-inset-bottom)) + 72px)}
  .panel{left:var(--edge);right:var(--edge);top:calc(var(--edge) + 200px)}
}

/* links: bottom-left corner. CA rides as the dock's last row */
.links{position:fixed;z-index:5;left:max(var(--edge),env(safe-area-inset-left));bottom:max(var(--edge),env(safe-area-inset-bottom))}
body.intro .links{display:none}
.nav small{font-size:inherit;opacity:.6}
.dock.nav .ca-btn[aria-disabled="true"]{cursor:default}
@media (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){.dock.nav button:nth-child(5){--r:-2.2deg}}
@media (max-width:899px),(max-aspect-ratio:4/3){
  .links{bottom:calc(max(var(--edge),env(safe-area-inset-bottom)) + 72px)}
  .meme-nav{bottom:calc(max(var(--edge),env(safe-area-inset-bottom)) + 136px)}
  .nav small{display:none}
  .dock.nav button{padding:0 11px}
  .panel{top:calc(var(--edge) + 72px)}
}

/* CA card: its own colour (pump.fun green), "CA" lettering as the icon */
.dock.nav .ca-btn{background:#5fcb88;color:var(--ink);padding-left:13px}
.ca-ic{font:400 20px/1 Briptoe,ui-monospace,monospace;letter-spacing:0;min-width:24px}
@media (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){.dock.nav .ca-btn:hover,.dock.nav .ca-btn:focus-visible{background:#86dba5}.dock.nav .ca-btn small{opacity:.75}}
@media not all and (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){.dock.nav .ca-btn{background:#5fcb88;box-shadow:inset 0 0 0 2px var(--ink)}.ca-ic{font-size:15px}}

/* Stats: DexScreener chart, left side, slides in with a spring */
:root{--spring:linear(0.000,0.056,0.204,0.408,0.636,0.858,1.050,1.199,1.296,1.341,1.340,1.303,1.240,1.164,1.085,1.013,0.954,0.911,0.887,0.880,0.888,0.906,0.931,0.958,0.984,1.007,1.025,1.036,1.041,1.041,1.036,1.028,1.019,1.010,1.001,0.994,0.989,0.986,0.986,0.987,1)}
.chart{position:fixed;z-index:4;margin:0;left:max(var(--edge),env(safe-area-inset-left));top:50%;width:min(520px,40vw);height:min(400px,calc(100vh - 280px));translate:0 -50%;background:#0b0b0f;border:var(--bw) solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--ink);overflow:hidden;animation:slideL .9s var(--spring) both;rotate:-1.2deg}
.chart[hidden]{display:none}
.chart iframe{width:100%;height:100%;border:0;display:block}
.chart.soon{display:grid;place-items:center;background:var(--card);color:var(--ink);font:400 clamp(22px,2.4vw,32px)/1.1 Briptoe,ui-monospace,monospace;text-align:center;padding:20px}
.chart.soon[hidden]{display:none}
@keyframes slideL{from{transform:translateX(calc(-100% - 2 * var(--edge)))}to{transform:none}}
@media (max-width:899px),(max-aspect-ratio:4/3){.chart{left:var(--edge);right:var(--edge);width:auto;top:calc(var(--edge) + 240px);translate:none;height:min(300px,calc(100vh - 470px));rotate:-.8deg}}
@media (prefers-reduced-motion:reduce){.chart{animation:none}}
/* dock reactions: hover lifts the shadow + wiggles the icon, press sinks into the shadow, release pops (spring) */
@media (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){
  .dock.nav button{transition-property:transform,rotate,background,box-shadow,translate;transition-duration:.7s,.8s,.2s,.18s,.12s;transition-timing-function:var(--spring),var(--spring),ease,ease,ease}
  .dock.nav button:hover{box-shadow:-8px 8px 0 var(--ink)}
  .dock.nav button:hover>svg,.dock.nav button:hover>.ca-ic{animation:wig .6s var(--spring)}
  .dock.nav button:active{translate:-4px 4px;box-shadow:-1px 1px 0 var(--ink);transition-duration:.7s,.8s,.2s,.05s,.05s}
}
.dock.nav button.pop{animation:pop .55s var(--spring)}
.dock.nav button:active{scale:.94}
@keyframes wig{0%{rotate:-18deg;scale:1.3}}
@keyframes pop{0%{scale:.9 1.08}}
@media (prefers-reduced-motion:reduce){.dock.nav button.pop,.dock.nav button:hover>svg,.dock.nav button:hover>.ca-ic{animation:none}}
/* tidy-random: pivot each tilt on the visible end so every row keeps the same gap */
@media (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){
  .dock.nav{gap:16px}
  .dock.nav button{transform-origin:28px 50%}
  .dock.nav button:nth-child(1){--r:-2.4deg}.dock.nav button:nth-child(2){--r:1.6deg}.dock.nav button:nth-child(3){--r:-1.2deg}.dock.nav button:nth-child(4){--r:2.2deg}.dock.nav button:nth-child(5){--r:-1.8deg}
}
/* slide lives on `translate` (applied after `rotate`), so the tilt pivots on the visible end and every gap stays equal */
@media (hover:hover) and (min-width:900px) and (min-aspect-ratio:4/3){
  .dock.nav button{transform:none;translate:256px 0;transition-property:translate,rotate,background,box-shadow,transform;transition-duration:.7s,.8s,.2s,.18s,.12s;transition-timing-function:var(--spring),var(--spring),ease,ease,ease}
  .dock.nav button:hover,.dock.nav button:focus-visible{transform:none;translate:80px 0}
  .dock.nav button:active{translate:80px 0;transform:translate(-4px,4px);transition-duration:.7s,.8s,.2s,.05s,.05s}
}
/* entrance: everything slides/pops in on a spring, no fades. Fill `backwards` so hover/press transforms work after. */
.title{animation:none}
.title span{display:inline-block;animation:charIn .9s var(--spring) var(--d) backwards}
@keyframes charIn{from{transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(0)}}
.dock,.dock.show,.links,body:not(.intro) .links{opacity:1;transition:none}
body:not(.live) .dock,body:not(.live) .links,body:not(.live) .sound{visibility:hidden}
body.live .dock.nav button{animation:inR .9s var(--spring) backwards;animation-delay:calc(250ms + var(--i) * 90ms)}
.dock.nav button:nth-child(1){--i:0}.dock.nav button:nth-child(2){--i:1}.dock.nav button:nth-child(3){--i:2}.dock.nav button:nth-child(4){--i:3}.dock.nav button:nth-child(5){--i:4}
@keyframes inR{from{transform:translateX(160px)}}
@media (max-width:899px),(max-aspect-ratio:4/3){body.live .dock.nav{animation:inUp .9s var(--spring) .15s backwards}body.live .dock.nav button{animation-name:inUp}@keyframes inUp{from{transform:translateY(160px)}}}
body.live .links>*{animation:inUp2 .9s var(--spring) backwards}
body.live .links>*:nth-child(1){animation-delay:.35s}body.live .links>*:nth-child(2){animation-delay:.45s}body.live .links>*:nth-child(3){animation-delay:.55s}body.live .links>*:nth-child(4){animation-delay:.65s}body.live .links>*:nth-child(5){animation-delay:.75s}
@keyframes inUp2{from{transform:translateY(140px) rotate(-14deg)}}
body.live .sound{animation:popIn .8s var(--spring) .7s backwards}
@keyframes popIn{from{transform:scale(0) rotate(-40deg)}}
.panel{animation:inR2 .9s var(--spring) backwards}
@keyframes inR2{from{transform:translateX(90px)}}
.meme-nav{animation:inUp3 .8s var(--spring) backwards}
@keyframes inUp3{from{transform:translate(-50%,120px)}}
.skip,.enter,.board{animation:popIn .7s var(--spring) backwards}
.enter{animation-name:popInC}
@keyframes popInC{from{transform:translateX(-50%) scale(0)}}
@media (prefers-reduced-motion:reduce){.title span,body.live .dock.nav,body.live .dock.nav button,body.live .links>*,body.live .sound,.panel,.meme-nav,.skip,.enter,.board{animation:none}}