/* FXCHS V3.29 / A live, scalable ident: original lettering, an anatomically
   narrower FOUR-toe fox print without claws, and no trailing full stop. */
body.fxv2 .fxv329-brand{
  --fxv329-brand-height:43px;
  display:inline-flex;position:relative;align-items:center;flex:none;
  font-size:var(--fxv329-brand-height);gap:.17em;
  width:max-content;height:1em;
  white-space:nowrap;user-select:none;pointer-events:none;
}
body.fxv2 .fxv329-brand-paw{
  display:block;flex:none;width:.75em;
  height:1em;overflow:visible;
}
body.fxv2 .fxv329-brand-type{
  display:block;position:relative;flex:none;
  width:2.68em;
  height:1em;overflow:hidden;
}
body.fxv2 .fxv329-brand-type img{
  position:absolute;display:block;top:0;
  left:-.892em;
  width:3.875em;
  height:1em;
  max-width:none;object-fit:fill;pointer-events:none;
}

/* One deliberately small listening instrument beside the centred brand.
   The main button becomes Play/Pause after SoundCloud has actually loaded;
   the current-title/level button always opens the listening drawer. */
body.fxv2 .fxv2-header .fxv329-music-strip{
  display:flex;align-items:center;gap:4px;min-width:0;
}
body.fxv2 .fxv2-header .fxv318-music-toggle{
  display:grid;place-items:center;flex:none;width:42px;height:43px;
  min-width:42px;transform:none!important;
}
body.fxv2 .fxv318-music-toggle svg[hidden]{display:none!important}
body.fxv2 .fxv329-music-now{
  appearance:none;box-sizing:border-box;display:flex;align-items:center;
  gap:8px;min-width:0;max-width:min(170px,19vw);height:38px;
  padding:5px 6px;border:0;border-radius:7px;
  background:transparent;color:#d8e8dd;cursor:pointer;
  font:650 11px/1.2 system-ui,sans-serif;
}
body.fxv2 .fxv329-music-now:hover,body.fxv2 .fxv329-music-now[aria-expanded=true]{color:#8df99a}
body.fxv2 .fxv329-music-strip :is(button):focus-visible{outline:2px solid #a3f5ae;outline-offset:2px}
body.fxv2 .fxv329-music-eq{
  display:flex;align-items:center;justify-content:space-between;
  flex:0 0 22px;width:22px;height:18px;gap:2px;
}
body.fxv2 .fxv329-music-eq i{
  width:3px;min-height:4px;height:6px;background:#5db96e;
  border-radius:2px;transform-origin:center;
}
body.fxv2 .fxv318-music.is-playing .fxv329-music-eq i{
  background:#3be847;animation:fxv329-music-level .58s ease-in-out infinite alternate;
}
body.fxv2 .fxv318-music.is-playing .fxv329-music-eq i:nth-child(2){animation-duration:.81s;animation-delay:-.28s}
body.fxv2 .fxv318-music.is-playing .fxv329-music-eq i:nth-child(3){animation-duration:.47s;animation-delay:-.12s}
body.fxv2 .fxv318-music.is-playing .fxv329-music-eq i:nth-child(4){animation-duration:.71s;animation-delay:-.43s}
@keyframes fxv329-music-level{from{height:4px}to{height:16px}}
body.fxv2 .fxv329-music-track{
  display:block;min-width:0;max-width:128px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;text-align:left;
}
@media(max-width:850px){
  body.fxv2 .fxv329-music-track{display:none}
  body.fxv2 .fxv329-music-now{width:31px;padding:5px 3px}
}
@media(max-width:620px){
  body.fxv2 .fxv2-header .fxv318-music-toggle{width:36px;min-width:36px;height:38px}
  body.fxv2 .fxv329-music-strip{gap:0}
  body.fxv2 .fxv329-music-now{width:27px}
}
body.fxv2 .fxv2-header .fxv2-logo{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:0;max-width:60vw;
}
body.fxv2 .fxv2-header .fxv329-brand{--fxv329-brand-height:41px}
@media(max-width:620px){
  body.fxv2 .fxv2-header .fxv329-brand{--fxv329-brand-height:34px}
}
@media(max-height:500px) and (pointer:coarse){
  body.fxv2 .fxv2-header .fxv329-brand{--fxv329-brand-height:30px}
}

/* Only the centre of the old logo raster is shown: this retains Sebastian's
   letterforms and gradient, while cropping the old paw and fox-head point. */
body.fxv2 .fxv329-ident-stage{
  position:absolute;inset:0;isolation:isolate;pointer-events:none;
  display:grid;place-items:center;
}
body.fxv2 .fxv329-ident-lockup{
  position:relative;z-index:2;
  display:grid;place-items:center;max-width:90vw;
}
body.fxv2 .fxv329-ident-lockup .fxv329-brand{
  --fxv329-brand-height:clamp(55px,min(17vw,26dvh),210px);
}
body.fxv2 .fxv329-ident-lockup .fxv329-brand-paw{
  transform-origin:50% 70%;
  animation:fxv329-ident-paw 5.6s cubic-bezier(.22,.78,.25,1) both;
}
body.fxv2 .fxv329-ident-lockup .fxv329-brand-type{
  animation:fxv329-ident-letters 5.6s cubic-bezier(.18,.68,.22,1) both;
}
body.fxv2 .fxv329-ident-trail{
  position:absolute;z-index:1;
  top:calc(50% + min(9vw,91px));left:50%;transform:translateX(-50%);
  width:min(790px,85vw);height:clamp(52px,8vw,98px);
}
body.fxv2 .fxv329-ident-trail i{
  position:absolute;display:block;
  width:clamp(22px,3.1vw,43px);aspect-ratio:1;
  left:var(--fxv329-step-left,11%);
  top:var(--fxv329-step-top,24%);
  background:url('/assets/fox-paw-source.svg?v=3.29-clawless') center/contain no-repeat;
  opacity:0;
  transform:translate(-50%,-50%) rotate(var(--fxv329-step-turn,13deg));
  animation:fxv329-footprint 4.5s ease-out both;
  animation-delay:var(--fxv329-step-delay,0s);
}
@keyframes fxv329-footprint{
  0%,13%{opacity:0;scale:.82;filter:blur(2px)}
  22%{opacity:.73;scale:1;filter:blur(0)}
  57%{opacity:.48;scale:1;filter:blur(0)}
  100%{opacity:0;scale:1;filter:blur(1px)}
}
@keyframes fxv329-ident-paw{
  0%,30%{opacity:0;transform:translateX(-20%) translateY(7%) rotate(-12deg);filter:blur(5px)}
  44%{opacity:1;transform:translateX(0) translateY(0) rotate(2deg);filter:blur(0)}
  52%,100%{opacity:1;transform:none;filter:none}
}
@keyframes fxv329-ident-letters{
  /* Never reveal half a character at a stage edge. The entire word arrives. */
  0%,39%{opacity:0;transform:translateX(18px) scale(.97);filter:blur(6px)}
  46%{opacity:.77;transform:translateX(5px) scale(.993);filter:blur(1.8px)}
  57%,100%{opacity:1;transform:none;filter:none}
}

/* The old MP4 remains available as an optional soundtrack only. Never show
   its permanently baked-in claws or point for even one transition frame. */
body.fxv2 .fxv317-intro-film.fxv329-ident-soundtrack{
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
}
body.fxv2 .fxv317-intro .fxv329-ident-stage{z-index:1}
body.fxv2 .fxv317-intro-overlay{z-index:2}
body.fxv2 .fxv329-route-ident{
  position:fixed;inset:0;z-index:2147483001;
  background:#000;color:#fff;overflow:hidden;
  opacity:1;transition:opacity .92s cubic-bezier(.3,.6,.4,1);
  pointer-events:all;
}
body.fxv2 .fxv329-route-ident[hidden]{display:none!important}
body.fxv2 .fxv329-route-ident.is-leaving{opacity:0;pointer-events:none}
html.fxv329-route-ident-pending body.fxv2 .fxv329-route-ident{
  display:block!important;
}
body.fxv2 .fxv329-route-ident .fxv329-ident-stage{z-index:1}
body.fxv2 .fxv329-route-skip{
  position:absolute;z-index:2;right:clamp(16px,3vw,43px);
  bottom:clamp(18px,4dvh,50px);min-height:44px;
  padding:8px 13px;border:1px solid #7b9c83;border-radius:8px;
  color:#c8dacd;background:#0a1610;font:650 12px/1.25 system-ui,sans-serif;
  cursor:pointer;
}
body.fxv2 .fxv329-route-skip:focus-visible{outline:2px solid #68e875;outline-offset:3px}
body.fxv2 .fxv329-example-frame{position:relative;isolation:isolate}
body.fxv2 .fxv329-example-frame .fxv329-ident-lockup .fxv329-brand{
  --fxv329-brand-height:clamp(45px,min(12.5vw,19dvh),135px);
}
body.fxv2 .fxv329-example-frame .fxv329-ident-trail{
  top:calc(50% + min(7vw,65px));
}
body.fxv2 .fxv329-example-frame [data-fxv329-example-replay]{
  position:absolute;z-index:3;bottom:12px;right:13px;
  min-height:39px;padding:8px 12px;border:1px solid #7b9c83;
  border-radius:7px;background:#092014;color:#fff;cursor:pointer;
  font:650 11px/1.3 system-ui,sans-serif;
}

/* Reuse the genuine clawless SVG in the quiet footer/header footsteps and
   keep a slightly larger, more fox-like imprint than the previous PNG. */
body.fxv2 .fxv323-fox-layer i,
body.fxv2 .fxv2-footer-foxpath i,
body.fxv2 .fxv2-header-foxpath i,
body.fxv2 .fxv2-foxprint{
  background-image:url('/assets/fox-paw-source.svg?v=3.29-clawless')!important;
}
@media(max-width:650px){
  body.fxv2 .fxv329-ident-trail{
    top:calc(50% + 9vw);height:58px;width:89vw;
  }
  body.fxv2 .fxv329-ident-trail i{width:clamp(19px,5.3vw,28px)}
}
@media(prefers-reduced-motion:reduce){
  body.fxv2 .fxv318-music.is-playing .fxv329-music-eq i{animation:none!important;height:9px}
  body.fxv2 .fxv329-ident-trail{display:none!important}
  body.fxv2 .fxv329-ident-lockup .fxv329-brand :is(.fxv329-brand-paw,.fxv329-brand-type){
    animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important;
  }
  body.fxv2 .fxv329-route-ident{transition-duration:.01ms!important}
}