/* Shared shell motion. Protected editors and games keep their own behaviour. */
@keyframes platform-enter {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes platform-sheet-enter {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes platform-sheet-exit { to { opacity: 0; transform: translateY(20px) scale(.98); } }
@keyframes platform-drawer-exit { to { opacity: 0; transform: translateX(32px); } }
@keyframes platform-fade-exit { to { opacity: 0; } }
@keyframes platform-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes platform-drawer-enter {
  from { opacity: 0; transform: translateX(32px); }
  to { opacity: 1; transform: translateX(0); }
}

@media (prefers-reduced-motion: no-preference) {
  .platform-header__nav a { position: relative; }
  .platform-header__nav a::after {
    content: ''; position: absolute; right: 0; bottom: 1px; left: 0; height: 2px;
    background: currentColor; transform: scaleX(0); transform-origin: left;
    transition: transform var(--motion-duration) var(--motion-ease);
  }
  .platform-header__nav a:is(:hover, :focus-visible, .is-active)::after { transform: scaleX(1); }
  .world-switch__item, .platform-header .account-link, .platform-header .icon-button,
  #main-content .button, .career-quick-links a, .career-pagination a,
  .career-mobile-metric-tabs a, .career-position-grid span, .career-sort-form label {
    transition: transform var(--motion-duration) var(--motion-ease),
      border-color var(--motion-fast), color var(--motion-fast), background-color var(--motion-fast);
  }
  #main-content .button:active, .platform-header .icon-button:active,
  .career-pagination a:active, .career-position-grid label:active span { transform: scale(.98); }
  .career-row-action > span { display: inline-block; transition: transform var(--motion-fast); }
  .career-row-action:is(:hover, :focus-visible) > span { transform: translateX(3px); }
  .career-club-card, .career-player-card, .creation-card, .foundation-grid article, .account-card {
    transition: transform var(--motion-duration) var(--motion-ease), border-color var(--motion-fast);
  }
  .career-player-card { position: relative; }
  .career-player-card::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(115deg, transparent 25%, rgba(255,255,255,.07) 48%, transparent 65%);
    transform: translateX(-120%); transition: transform 550ms var(--motion-ease);
  }
  .career-player-card:is(:hover, :focus-visible)::after { transform: translateX(120%); }
  .career-player-table tbody tr, .career-mobile-row { transition: background-color var(--motion-fast), border-color var(--motion-fast); }
  .career-filter-accordion[open] > :not(summary) { animation: platform-enter 200ms var(--motion-ease); }
  .career-sheet[open], .career-quick-view[open] { animation: platform-sheet-enter 420ms var(--motion-ease); }
  .career-filter-sheet[open] { animation-name: platform-drawer-enter; }
  .career-sheet.is-closing, .career-quick-view.is-closing { animation: platform-sheet-exit 180ms ease-in forwards; }
  .career-filter-sheet.is-closing { animation-name: platform-drawer-exit; }
  .career-sheet.is-closing::backdrop, .career-quick-view.is-closing::backdrop { animation: platform-fade-exit 180ms ease-in forwards; }
  .language-picker[open] .language-picker__panel { animation: platform-enter 240ms var(--motion-ease); }
  .career-player-table__portrait img, .career-mobile-row__portrait img { transform-origin: 50% 85%; transition: transform 380ms var(--motion-ease); }
  .career-row-action, .career-results-search { transition: background-color 180ms, box-shadow 220ms, border-color 180ms; }
  .career-results-search:focus-within { box-shadow: 0 0 0 4px #248cff16; }
  .career-position-grid input:checked + span { animation: platform-enter 220ms var(--motion-ease); }
  .career-sheet[open]::backdrop, .career-quick-view[open]::backdrop { animation: platform-fade 180ms ease-out; }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  #main-content .button:hover, .platform-header .account-link:hover, .career-quick-links a:hover { transform: translateY(-2px); }
  .career-player-table tbody tr:hover .career-player-table__portrait img, .career-mobile-row:hover .career-mobile-row__portrait img { transform: translateY(-2px) scale(1.12); }
  .career-player-card:hover, .career-club-card:hover { transform: translateY(-4px); border-color: var(--color-accent); }
}

@media (prefers-reduced-motion: reduce) {
  .platform-header *, #main-content *, .platform-footer *,
  .platform-header *::before, .platform-header *::after,
  #main-content *::before, #main-content *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
}

/* Shared atmosphere and pointer feedback. Original editor/game interiors are excluded in JS. */
@keyframes platform-atmosphere { 0%,100% { opacity: .48; } 50% { opacity: .85; } }
.platform-cursor { position: fixed; top: 0; left: 0; width: 0; height: 0; z-index: 40; pointer-events: none; opacity: 0; transition: opacity 160ms; }
.platform-cursor::before { content: ''; position: absolute; width: 150px; height: 150px; top: -75px; left: -75px; border-radius: 50%; background: radial-gradient(circle,color-mix(in srgb,var(--color-accent) 7%,transparent),transparent 68%); }
.platform-cursor__ring { position: absolute; width: 28px; height: 28px; top: -14px; left: -14px; border: 1px solid color-mix(in srgb,var(--color-accent) 45%,#ffffff40); border-radius: 50%; transition: width 180ms,height 180ms,top 180ms,left 180ms,border-color 180ms; }
.platform-cursor.is-action .platform-cursor__ring { width: 38px; height: 38px; top: -19px; left: -19px; border-color: color-mix(in srgb,var(--color-accent) 45%,#fff); }
.platform-cursor.is-visible { opacity: 1; }
body.is-motion-paused::after { animation-play-state: paused; }
@media (prefers-reduced-motion: no-preference) {
  body::after { animation: platform-atmosphere 20s ease-in-out infinite; }
  .platform-tabs > a,.foundation-grid__link,.cp-attribute { transition: background-color 160ms,border-color 160ms,color 160ms; }
  .account-form input,.career-search { transition: border-color 180ms,box-shadow 180ms; }
  .account-form input:focus-visible,.career-search:focus-within { border-color: color-mix(in srgb,var(--color-accent) 60%,#fff); box-shadow: 0 0 0 3px color-mix(in srgb,var(--color-accent) 10%,transparent); }
  .has-platform-js .platform-header__nav.is-open { animation: platform-enter 180ms var(--motion-ease); }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  .foundation-grid article:hover,.account-card:hover,.creation-card:hover { border-color: color-mix(in srgb,var(--color-accent) 40%,var(--color-border)); transform: translateY(-2px); }
}
@media (prefers-reduced-motion: reduce), (pointer: coarse), (max-width: 1023px) { .platform-cursor { display: none; } }
@media (prefers-reduced-motion: reduce) { body::after { animation: none; } }

/* Bounded CSS atmosphere: two light beams, a horizon shimmer and sixteen flecks, away from primary text. */
.platform-atmosphere { display: none; position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; contain: strict; }
body[data-motion-enabled="true"] .platform-atmosphere { display: block; }
.platform-ray { position: absolute; top: -30%; width: 32vw; max-width: 500px; height: 135vh; opacity: .3; transform-origin: center 10%; background: linear-gradient(96deg,transparent 25%,color-mix(in srgb,var(--color-accent) 14%,transparent) 43%,#c9e8ff1b 49%,transparent 61%); animation: platform-ray-drift 22s ease-in-out infinite alternate; }
.platform-ray--left { left: -10%; --ray-angle: -20deg; }.platform-ray--right { right: -10%; --ray-angle: 20deg; animation-delay: -11s; }
.platform-particle { position: absolute; width: 2px; height: 2px; border-radius: 50%; left: var(--particle-x,4%); top: var(--particle-y,50%); background: color-mix(in srgb,var(--color-accent) 45%,#fff); box-shadow: 0 0 6px color-mix(in srgb,var(--color-accent) 28%,transparent); opacity: 0; animation: platform-particle-drift 17s ease-in-out infinite; animation-delay: var(--particle-delay,0s); }
.platform-particle:nth-of-type(1) { --particle-x:3%; --particle-y:24%; --particle-delay:-3s; }
.platform-particle:nth-of-type(2) { --particle-x:7%; --particle-y:63%; --particle-delay:-11s; }
.platform-particle:nth-of-type(3) { --particle-x:13%; --particle-y:41%; --particle-delay:-6s; }
.platform-particle:nth-of-type(4) { --particle-x:20%; --particle-y:89%; --particle-delay:-14s; }
.platform-particle:nth-of-type(5) { --particle-x:8%; --particle-y:95%; --particle-delay:-8s; }
.platform-particle:nth-of-type(6) { --particle-x:96%; --particle-y:32%; --particle-delay:-13s; }
.platform-particle:nth-of-type(7) { --particle-x:92%; --particle-y:81%; --particle-delay:-4s; }
.platform-particle:nth-of-type(8) { --particle-x:87%; --particle-y:54%; --particle-delay:-9s; }
.platform-particle:nth-of-type(9) { --particle-x:81%; --particle-y:94%; --particle-delay:-1s; }
.platform-particle:nth-of-type(10) { --particle-x:97%; --particle-y:65%; --particle-delay:-15s; }
@keyframes platform-ray-drift { from { transform: rotate(var(--ray-angle)) translateX(-10px); opacity: .35; } to { transform: rotate(calc(var(--ray-angle) + 7deg)) translateX(12px); opacity: .8; } }
@keyframes platform-particle-drift { 0%,100% { opacity: 0; transform: translate3d(0,20px,0); } 30%,65% { opacity: .7; } 95% { opacity: 0; transform: translate3d(18px,-90px,0); } }
body.is-motion-paused .platform-atmosphere * { animation-play-state: paused; }
body[data-motion-enabled="false"] .platform-atmosphere, body[data-motion-enabled="false"] .platform-cursor { display: none; }
body[data-motion-enabled="false"]::after { animation: none; }
body[data-motion-enabled="false"] :is(.cd-hero,.cd-lower) { animation: none; }
body[data-motion-enabled="false"] [data-discovery-results]::before { animation: none; opacity: .65; }
body:has([data-protected-module], [data-disable-motion]) .platform-atmosphere { display: none; }
@media (max-width:767px) { .platform-atmosphere { opacity: .6; }.platform-ray { width: 55vw; animation-duration: 28s; }.platform-particle:nth-of-type(n+5) { display: none; }.platform-particle:nth-of-type(3) { left: 94%; }.platform-particle:nth-of-type(4) { left: 98%; } }
@media (prefers-reduced-motion:reduce) { body[data-motion-enabled] .platform-atmosphere { display: none; } }

.platform-horizon { position: absolute; top: 22%; left: -20%; width: 140%; height: 1px; background: linear-gradient(90deg,transparent 8%,color-mix(in srgb,var(--color-accent) 40%,transparent) 36%,#d6ecff30 51%,transparent 85%); opacity: .2; transform: rotate(-12deg); animation: platform-horizon-drift 26s ease-in-out infinite alternate; }
@keyframes platform-horizon-drift { from { transform: rotate(-12deg) translateY(-12px); opacity: .12; } to { transform: rotate(-9deg) translateY(35px); opacity: .45; } }
.platform-particle:nth-of-type(11) { --particle-x:5%; --particle-y:38%; --particle-delay:-6s; width:3px; height:3px; }
.platform-particle:nth-of-type(12) { --particle-x:94%; --particle-y:19%; --particle-delay:-12s; width:3px; height:3px; }
.platform-particle:nth-of-type(13) { --particle-x:16%; --particle-y:74%; --particle-delay:-4s; }
.platform-particle:nth-of-type(14) { --particle-x:89%; --particle-y:91%; --particle-delay:-8s; }
.platform-particle:nth-of-type(15) { --particle-x:2%; --particle-y:85%; --particle-delay:-10s; }
.platform-particle:nth-of-type(16) { --particle-x:98%; --particle-y:47%; --particle-delay:-2s; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .footer-socials a { transition: transform 240ms var(--motion-ease),background-color 180ms,box-shadow 240ms,border-color 180ms; }
 .footer-socials a:hover { transform: translateY(-3px); border-color: color-mix(in srgb,var(--color-accent) 45%,transparent); box-shadow: 0 5px 18px color-mix(in srgb,var(--color-accent) 12%,transparent); }
 .world-switch__item .brand-mark { transition: transform 300ms var(--motion-ease); }
 .world-switch__item:hover .brand-mark { transform: scale(1.08) rotate(-3deg); }
}