/* TG Vault FX layer 2026-11-13 – presentation only. No commerce data, no requests. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:fxVtOut .22s ease both}
::view-transition-new(root){animation:fxVtIn .42s cubic-bezier(.2,.7,.2,1) both}
@keyframes fxVtOut{to{opacity:0;transform:translate3d(0,-10px,0)}}
@keyframes fxVtIn{from{opacity:0;transform:translate3d(0,16px,0)}}

/* scroll progress hairline */
.fx-progress{position:fixed;left:0;top:0;width:100%;height:2px;z-index:2147483000;pointer-events:none;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,#8a6a22,#f3dc9a 55%,#fff6dc);box-shadow:0 0 10px rgba(243,220,154,.55)}

/* scroll reveal */
.fx-on .fx-r{opacity:0!important;transform:translate3d(0,28px,0) scale(.985)!important;transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)!important;will-change:opacity,transform}
.fx-on .fx-r.fx-in{opacity:1!important;transform:none!important}

/* hero entrance (home) */
html body #page-home #home h1#tgv-main-content .fx-w,.fx-w{display:inline-block!important;font:inherit!important;font-family:inherit!important;font-weight:inherit!important;font-size:inherit!important;line-height:inherit!important;color:inherit!important;letter-spacing:inherit!important;text-transform:inherit!important;background:none!important;-webkit-text-fill-color:currentColor;will-change:transform,opacity}
.fx-hero-wait .fx-w,.fx-hero-wait .tgv5-stat-card,.fx-hero-wait .tgv5-lead,.fx-hero-wait .tgv5-hero-actions,.fx-hero-wait .tgv5-eyebrow,.fx-hero-wait .tgv5-trust-line{opacity:0!important}
.fx-hero-go .fx-w{animation:fxWord .9s cubic-bezier(.2,.7,.2,1) calc(var(--i,0)*75ms + 80ms) backwards}
.fx-hero-go .tgv5-eyebrow{animation:fxRise .7s cubic-bezier(.2,.7,.2,1) backwards}
.fx-hero-go .tgv5-lead{animation:fxRise .8s cubic-bezier(.2,.7,.2,1) .45s backwards}
.fx-hero-go .tgv5-hero-actions{animation:fxRise .8s cubic-bezier(.2,.7,.2,1) .6s backwards}
.fx-hero-go .tgv5-stat-card{animation:fxRise .8s cubic-bezier(.2,.7,.2,1) calc(var(--fx-i,0)*95ms + .75s) backwards}
.fx-hero-go .tgv5-trust-line{animation:fxFade 1s ease 1.25s backwards}
@keyframes fxWord{from{opacity:0;transform:translate3d(0,.55em,0) rotate(2deg);filter:blur(10px)}}
@keyframes fxRise{from{opacity:0;transform:translate3d(0,22px,0)}}
@keyframes fxFade{from{opacity:0}}

/* card tilt + glare */
.fx-tilt{z-index:3;will-change:transform;box-shadow:0 30px 60px -24px rgba(10,2,5,.65),0 0 0 1px rgba(214,176,106,.6),0 0 34px -6px rgba(243,220,154,.35)!important}
.fx-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:4;opacity:0;animation:fxGlareIn .3s ease forwards;background:radial-gradient(circle at var(--fx-x,50%) var(--fx-y,50%),rgba(255,246,220,.3),rgba(255,246,220,0) 58%);mix-blend-mode:screen}
.fx-glare.fx-holo{background:radial-gradient(circle at var(--fx-x,50%) var(--fx-y,50%),rgba(255,255,255,.42),rgba(255,255,255,0) 42%),linear-gradient(115deg,rgba(255,255,255,0) 22%,rgba(255,90,170,.34) 36%,rgba(255,226,128,.34) 46%,rgba(96,222,255,.34) 56%,rgba(160,118,255,.3) 66%,rgba(255,255,255,0) 80%);background-size:100% 100%,240% 240%;background-position:0 0,var(--fx-x,50%) var(--fx-y,50%);mix-blend-mode:color-dodge;--fx-o:.45}
@keyframes fxGlareIn{to{opacity:var(--fx-o,1)}}
.fx-on .merch-card>img,.fx-on .vault-img-wrap>img,.fx-on .hs-thumb>img{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.fx-on .merch-card.fx-tilt>img,.fx-on .fx-tilt .vault-img-wrap>img,.fx-on .fx-tilt .hs-thumb>img{transform:scale(1.05)}

/* spotlight on dark panels */
.fx-spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;opacity:0;transition:opacity .45s ease;background:radial-gradient(520px circle at var(--fx-x,50%) var(--fx-y,50%),rgba(243,220,154,.13),rgba(243,220,154,0) 60%)}
.fx-spot-on>.fx-spot{opacity:1}

/* button sheen + press */
.fx-sheen{position:absolute;top:0;bottom:0;left:-60%;width:45%;pointer-events:none;transform:skewX(-20deg);background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0));animation:fxSheen .75s ease forwards}
@keyframes fxSheen{to{left:130%}}
.fx-on :is(.btn-nav,.vault-ebay-btn,.vault-btn,.vg-card-cta,.tgv5-hero-actions a,.merch-actions a,.tgv-merch-pagination button,.tgvmf-chip,.vault-filter){transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease,background-color .25s ease,color .25s ease,border-color .25s ease}
.fx-on :is(.btn-nav,.vault-ebay-btn,.vault-btn,.vg-card-cta,.tgv5-hero-actions a,.merch-actions a,.tgv-merch-pagination button,.tgvmf-chip,.vault-filter):active{transform:scale(.96)!important}
@media(hover:hover){.fx-on :is(.vault-ebay-btn,.vault-btn.primary,.tgv5-hero-actions a,.merch-actions a.primary,.tgv-merch-pagination button):hover{transform:translate3d(0,-2px,0);box-shadow:0 12px 26px -12px rgba(243,220,154,.6)}
.fx-on :is(.tgvmf-chip,.vault-filter):hover{transform:translate3d(0,-1px,0)}}

/* section heading gold hairline */
.fx-on .fx-line{position:relative}
.fx-on .fx-line::after{content:"";position:absolute;left:0;bottom:-10px;height:2px;width:72px;border-radius:2px;background:linear-gradient(90deg,#c9a84c,#f3dc9a,rgba(243,220,154,0));transform:scaleX(0);transform-origin:0 50%;transition:transform 1s cubic-bezier(.2,.7,.2,1) .25s}
.fx-on .fx-line.fx-line-in::after{transform:scaleX(1)}

@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}.fx-on .fx-r{opacity:1!important;transform:none!important;transition:none!important}.fx-hero-wait *{opacity:1!important}.fx-hero-go *{animation:none!important}.fx-glare,.fx-sheen,.fx-spot{display:none!important}}
