:root {
  --ys-dur-instant: 100ms;  
  --ys-dur-micro:   160ms;  
  --ys-dur-short:   250ms;  
  --ys-dur-flip:    300ms;  
  --ys-dur-medium:  400ms;  
  --ys-dur-spring:  500ms;  
  --ys-dur-long:    560ms;  
  --ys-dur-sweep:   1500ms; 
  --ys-demo-start:  1200ms; 
  --ys-demo-step:   900ms;  
  --ys-demo-hold:   3200ms; 
  --ys-demo-gap:    1800ms; 
  --ys-demo-type:   150ms;  
  --ys-demo-type-jitter: 100ms;
  --ys-demo-stream: 24ms;   
  --ys-demo-flash:  80ms;   
  --ys-demo-fade:   500ms;  
  --ys-ease-standard:   cubic-bezier(.25,.46,.45,.94);   
  --ys-ease-emphasized: cubic-bezier(.22,1,.36,1);       
  --ys-ease-exit:       cubic-bezier(.42,0,1,1);         
  --ys-ease-move:       cubic-bezier(.645,.045,.355,1);  
  --ys-ease-linear: linear; /* Progress bars and marquee. */
  --ys-ease-spring: linear(0, .0235, .0843, .1701, .2702, .3766, .4827, .584, .6771, .7601, .8319, .8923, .9415, .9804, 1.0099, 1.0312, 1.0455, 1.054, 1.0578, 1.0581, 1.0556, 1.0514, 1.0459, 1.0399, 1.0337, 1.0276, 1.0218, 1.0167, 1.0121, 1.0082, 1.005, 1.0024, 1.0003, .9988, .9978, .9971, .9967, 1, 1, .9969, .9971, .9975, .9978, .9982, .9985, .9989, .9991, .9994, 1, 1);
  --ys-ease-settle: linear(0, 0.0411, 0.1342, 0.2478, 0.3638, 0.4725, 0.5692, 0.6524, 0.7222, 0.7798, 0.8267, 0.8644, 0.8944, 0.9181, 0.9367, 0.9513, 0.9626, 0.9714, 0.9782, 0.9834, 0.9874, 0.9904, 0.9927, 0.9945, 0.9959, 0.9969, 0.9976, 0.9982, 0.9987, 1);
  --ys-dist-xs: 4px;   
  --ys-dist-sm: 8px;   
  --ys-dist-md: 16px;  
  --ys-dist-lg: 32px;  
  --ys-lift:   -2px;   
  --ys-stagger-tight: 35ms;   
  --ys-stagger:       70ms;   
  --ys-stagger-loose: 150ms;  
  --ys-stagger-digit: 50ms;   
  --ys-stagger-max:   5;      
  --ys-flip-step:      300ms; 
  --ys-flip-step-fast: 100ms; 
  --ys-press-scale: .97;       
  --ys-press-brightness: .98;  
  --ys-hover-brightness: 1.06; 
  --ys-reveal-dur: var(--ys-dur-long);
  --ys-reveal-dist: var(--ys-dist-md);
  --ys-reveal-ease: var(--ys-ease-emphasized);
  --ys-reveal-stagger: var(--ys-stagger);
}
@supports not (transition-timing-function: linear(0, 1)) {
  :root {
    --ys-ease-spring: cubic-bezier(.34,1.36,.64,1);
    --ys-ease-settle: var(--ys-ease-emphasized);
  }
}
@media (max-width: 600px) {
  :root { --ys-reveal-dist: var(--ys-dist-sm); }
}
html[data-ys-family="goval"] {
  --ys-reveal-dur: var(--ys-dur-spring);   
  --ys-reveal-dist: 24px;
  --ys-reveal-ease: var(--ys-ease-spring);  
  --ys-press-scale: .95;
  --ys-hover-brightness: 1.12;              
}
html[data-ys-family="game"] {
  --ys-reveal-dur: 800ms;                   
  --ys-reveal-dist: var(--ys-dist-sm);      
  --ys-reveal-ease: cubic-bezier(.25,.1,.25,1); 
  --ys-reveal-stagger: var(--ys-stagger-loose);
}
html[data-ys-family="admin"], html[data-ys-family="tool"] {
  --ys-dur-micro: 100ms; --ys-dur-short: 160ms; --ys-dur-medium: 200ms; --ys-dur-long: 200ms;
  --ys-ease-spring: var(--ys-ease-standard); --ys-ease-settle: var(--ys-ease-standard);
  --ys-press-scale: 1;
}
@property --ys-x { syntax: '<length-percentage>'; inherits: true; initial-value: 50%; }
@property --ys-y { syntax: '<length-percentage>'; inherits: true; initial-value: 0%; }
[data-ys-count] { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ys-digit { display: inline-block; height: 1em; width: 1ch; overflow: clip; vertical-align: -.08em; line-height: 1; }
.ys-digit__strip, .ys-digit__strip > span { display: block; line-height: 1; }
[data-ys-flip-group] { perspective: 1280px; }
[data-ys-flip] { position: relative; backface-visibility: hidden; }
[data-ys-flip]::after, [data-ys-flip]::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; }
[data-ys-flip]::before { background: #fff; }
[data-ys-flip]::after { border: 2px solid var(--accent, #3155D4); }
[data-ys-flip][data-rarity="legendary"]::after { border-color: #FFE3A0; }
[data-ys-flip][data-rarity="standard"] { --ys-flash: .16; --ys-rim: 0; --ys-afterglow: 1400ms; }
[data-ys-flip][data-rarity="premium"] { --ys-flash: .28; --ys-rim: .40; --ys-afterglow: 1900ms; }
[data-ys-flip][data-rarity="legendary"] { --ys-flash: .42; --ys-rim: .62; --ys-afterglow: 2600ms; }
[data-ys-flip-card], [data-ys-tilt] { position: relative; perspective: 1280px; }
.ys-card__in { position: relative; display: grid; transform-style: preserve-3d; }
.ys-face--front, .ys-face--back { grid-area: 1 / 1; backface-visibility: hidden; }
.ys-face--back { transform: rotateY(180deg); }
[data-ys-flip-card][aria-pressed="true"] .ys-card__in { transform: rotateY(180deg); }
.ys-tilt__shine { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(var(--ys-angle,120deg),rgba(255,255,255,.05) 0%,transparent var(--ys-stop,49%),rgba(0,0,0,.05) var(--ys-stop2,50%),transparent 100%); }
[data-ys-spoiler] { position: relative; overflow: clip; }
.ys-spoiler__cover { position: absolute; inset: 0; display: grid; place-items: center; background: var(--ys-cover, #1D1D1F); color: #fff; pointer-events: none; }
[data-ys-spoiler][aria-pressed="true"] .ys-spoiler__cover { translate: 0 -100%; }
[data-ys-shine] { position: relative; }
[data-ys-shine]::after { content: ''; position: absolute; inset: 0; border-radius: inherit; border: 1px solid var(--ys-shine-color,rgba(255,255,255,.18)); pointer-events: none; opacity: 0; mask-image: radial-gradient(200px 200px at var(--ys-x,50%) var(--ys-y,0%),#000 0,#0009 30%,#0003 50%,#0000 70%); }
.ys-marquee { --ys-marquee-gap: 28px; display: flex; overflow: clip; gap: var(--ys-marquee-gap); mask-image: linear-gradient(90deg,transparent,#000 128px,#000 calc(100% - 128px),transparent); }
.ys-marquee ul { flex: 0 0 auto; display: flex; gap: var(--ys-marquee-gap); list-style: none; padding: 0; }
.ys-marquee li { scroll-snap-align: start; }
@media (prefers-reduced-motion: no-preference) {
  .ys-press { transition: scale var(--ys-dur-micro) var(--ys-ease-standard); }
  .ys-press:active { scale: var(--ys-press-scale); will-change: scale; }
  .ys-lift { transition: translate var(--ys-dur-short) var(--ys-ease-standard); }
  .ys-card__in { transition: transform var(--ys-dur-flip) var(--ys-ease-move); }
  .ys-tilt__in { transition: transform var(--ys-dur-micro) var(--ys-ease-move); }
  [data-ys-tilt][data-tracking="true"] .ys-tilt__in { transition: none; }
  .ys-spoiler__cover { transition: translate var(--ys-dur-short) var(--ys-ease-move); }
  .ys-acc { interpolate-size: allow-keywords; }
  .ys-acc::details-content { block-size: 0; overflow: clip; transition: block-size var(--ys-dur-short) var(--ys-ease-move),content-visibility var(--ys-dur-short) var(--ys-ease-move) allow-discrete; }
  .ys-acc[open]::details-content { block-size: auto; }
  [data-ys-video][data-playing="true"] { animation: ys-video var(--ys-demo-fade) var(--ys-ease-move); }
  html[data-ys-motion="on"] [data-ys-flip][data-anim="in"] { animation: ys-flip-in var(--ys-dur-short) var(--ys-ease-exit); }
  html[data-ys-motion="on"] [data-ys-flip][data-anim="out"] { animation: ys-flip-out var(--ys-dur-short) var(--ys-ease-exit); }
  html[data-ys-motion="on"] [data-ys-flip][data-rarity]::after { animation: ys-rim var(--ys-afterglow) var(--ys-ease-exit); }
  html[data-ys-motion="on"] [data-ys-flip][data-flash="true"]::before { animation: ys-flash var(--ys-dur-short) var(--ys-ease-exit); }
  ::view-transition-group(*) { animation-duration: var(--ys-dur-short); animation-timing-function: var(--ys-ease-move); }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: var(--ys-dur-short); }
}
.ys-press:active { filter: brightness(var(--ys-press-brightness)); }
a { transition: color var(--ys-dur-instant) var(--ys-ease-standard); }
@media (hover:hover) {
  .ys-hover:hover { filter: brightness(var(--ys-hover-brightness)); }
  .ys-lift:hover { box-shadow: var(--ys-lift-shadow,0 8px 24px #0001); }
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .ys-lift:hover { translate: 0 var(--ys-lift); }
}
@media (prefers-reduced-motion:no-preference) and (scripting:enabled) {
  html.js[data-ys-motion="on"] [data-ys-reveal="armed"] { opacity: 0; translate: 0 var(--ys-reveal-dist); }
  html.js[data-ys-motion="on"] [data-ys-reveal="armed"][data-ys-reveal-kind="fade"] { translate: none; }
  html.js[data-ys-motion="on"] [data-ys-reveal="in"] { opacity: 1; translate: none; will-change: opacity,translate; transition: opacity var(--ys-reveal-dur) var(--ys-ease-standard),translate var(--ys-reveal-dur) var(--ys-reveal-ease); transition-delay: calc(min(var(--ys-i,0),var(--ys-stagger-max)) * var(--ys-reveal-stagger)); }
}
@media (hover:hover) and (pointer:fine) and (min-width:601px) and (prefers-reduced-motion:no-preference) {
  html[data-ys-motion="on"] [data-ys-shine]::after { transition: opacity var(--ys-dur-micro) var(--ys-ease-standard); }
  html[data-ys-motion="on"] [data-ys-shine]:hover::after { opacity: 1; }
  html[data-ys-motion="on"] [data-ys-shine][data-sweep="true"]::after { animation: ys-sweep var(--ys-dur-sweep) var(--ys-ease-move); }
}
@media (min-width:601px) and (prefers-reduced-motion:no-preference) {
  html.js[data-ys-motion="on"] .ys-marquee ul { animation: ys-marquee 40s linear infinite; animation-play-state: paused; }
  html.js[data-ys-motion="on"] .ys-marquee[data-in-view="true"][data-paused="false"] ul { animation-play-state: running; }
  html.js[data-ys-motion="on"] .ys-marquee:hover ul, html.js[data-ys-motion="on"] .ys-marquee:focus-within ul, html[data-ys-hidden="true"] .ys-marquee ul { animation-play-state: paused !important; }
}
html:not([data-ys-motion="on"]) .ys-marquee, html:not(.js) .ys-marquee { mask-image: none; }
html:not([data-ys-motion="on"]) .ys-marquee ul:not(:first-child), html:not(.js) .ys-marquee ul:not(:first-child) { display: none; }
@media (max-width:600px), (prefers-reduced-motion:reduce) {
  .ys-marquee { mask-image: none; }
  .ys-marquee ul:first-child { flex: 0 1 100%; overflow-x: auto; scroll-snap-type: x mandatory; }
  .ys-marquee ul:not(:first-child) { display: none; }
}
@media (max-width:600px), (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce) {
  [data-ys-shine]::after, .ys-tilt__shine { display: none; }
}
html:not([data-ys-motion="on"]) .ys-card__in { transition: none; }
html:not([data-ys-motion="on"]) [data-ys-flip-card][aria-pressed="true"] .ys-card__in { transform: none; }
html:not([data-ys-motion="on"]) [data-ys-flip-card] .ys-face--back { transform: none; }
html:not([data-ys-motion="on"]) [data-ys-flip-card][aria-pressed="false"] .ys-face--back,
html:not([data-ys-motion="on"]) [data-ys-flip-card][aria-pressed="true"] .ys-face--front { visibility: hidden; }
@media (prefers-reduced-motion:reduce) {
  [data-ys-reveal] { opacity: 1 !important; translate: none !important; }
  .ys-press:active { scale: 1; }
  .ys-lift:hover { translate: none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media print {
  [data-ys-reveal] { opacity: 1 !important; translate: none !important; }
  .ys-marquee { mask-image: none; }
  .ys-marquee ul { animation: none !important; }
  .ys-marquee ul:not(:first-child), [data-ys-shine]::after { display: none; }
}
@keyframes ys-flip-in { to { transform: rotateX(-90deg); } }
@keyframes ys-flip-out { from { transform: rotateX(-90deg); } to { transform: none; } }
@keyframes ys-flash { from { opacity: var(--ys-flash); } to { opacity: 0; } }
@keyframes ys-rim { from { opacity: var(--ys-rim); } to { opacity: 0; } }
@keyframes ys-video { from { opacity: 0; } to { opacity: 1; } }
@keyframes ys-marquee { to { transform: translateX(calc(-100% - var(--ys-marquee-gap))); } }
@keyframes ys-sweep { 0% { --ys-x: 0%; --ys-y: 25%; opacity: 0; } 50% { --ys-x: 3%; --ys-y: 4%; opacity: 1; } 100% { --ys-x: 8%; --ys-y: 0%; opacity: 0; } }
[data-ys-stagger="tight"] { --ys-reveal-stagger: var(--ys-stagger-tight); }
[data-ys-stagger="loose"] { --ys-reveal-stagger: var(--ys-stagger-loose); }

.ys-marquee li { flex: 0 0 210px; }
.ys-flashing { position: relative; }
.ys-flashing::after { content: ''; position: absolute; inset: 0; background: #fff; pointer-events: none; opacity: 0; animation: ys-demo-flash var(--ys-demo-flash) var(--ys-ease-standard); }
@keyframes ys-demo-flash { from { opacity: .28; } to { opacity: 0; } }
html:not([data-ys-motion="on"]) .ys-press:active { scale: 1; }
html:not([data-ys-motion="on"]) .ys-lift:hover { translate: none; }
[data-ys-flip-group][data-in-view="false"] [data-ys-flip]::after,
html[data-ys-hidden="true"] [data-ys-flip],
html[data-ys-hidden="true"] [data-ys-flip]::before,
html[data-ys-hidden="true"] [data-ys-flip]::after { animation-play-state: paused !important; }
[data-ys-sound-toggle][aria-pressed="true"], [data-ys-demo-pause][aria-pressed="true"], [data-ys-marquee-pause][aria-pressed="true"] { border-color: var(--accent,#3155D4); box-shadow: inset 0 0 0 1px var(--accent,#3155D4); }
@media (prefers-reduced-motion:no-preference) {
  html[data-ys-motion="on"] [data-ys-flip][data-anim="in"] { animation: ys-flip-in var(--ys-dur-short) var(--ys-ease-exit),ys-flip-pop var(--ys-dur-instant) var(--ys-ease-standard); }
}
@keyframes ys-flip-pop { 0% { scale: .8; } 50% { scale: 1.1; } 100% { scale: 1; } }