/* Arena Motion — global effect classes + widget styles */
@media (prefers-reduced-motion: reduce) {
	.am-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
	.am-marquee-track { animation: none !important; }
	#am-cdot, #am-cring { display: none !important; }
}

/* ---------- custom cursor ---------- */
body.am-cursor-on { cursor: none; }
body.am-cursor-on a, body.am-cursor-on button, body.am-cursor-on [role="button"] { cursor: none; }
#am-cdot, #am-cring { position: fixed; top: 0; left: 0; z-index: 100000; pointer-events: none; border-radius: 50%; transform: translate(-50%,-50%); will-change: transform; }
#am-cdot { width: 7px; height: 7px; background: var(--am-accent, #c7a24a); }
#am-cring { width: 34px; height: 34px; border: 1px solid rgba(199,162,74,.55); transition: width .25s ease, height .25s ease, border-color .25s ease, background .25s ease; }
#am-cring.am-active { width: 54px; height: 54px; background: rgba(199,162,74,.1); border-color: var(--am-accent, #c7a24a); }
@media (hover: none) { #am-cdot, #am-cring { display: none !important; } body.am-cursor-on { cursor: auto; } }

/* ---------- scroll reveal ---------- */
.am-reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.16,.8,.24,1), transform .8s cubic-bezier(.16,.8,.24,1); }
.am-reveal.am-reveal-left { transform: translateX(-34px); }
.am-reveal.am-reveal-right { transform: translateX(34px); }
.am-reveal.am-reveal-scale { transform: scale(.94); transform-origin: left center; }
.am-reveal.am-in { opacity: 1; transform: none; }

/* ---------- magnetic buttons ---------- */
.am-magnet { display: inline-flex; transition: transform .35s cubic-bezier(.16,.8,.24,1); will-change: transform; }

/* ---------- editorial row (generic list class, reusable outside widgets) ---------- */
.am-row { display: grid; grid-template-columns: 56px 1fr; gap: 18px; padding: 24px 0; border-bottom: 1px solid rgba(0,0,0,.1); position: relative; transition: padding-left .35s ease; }
.am-row:hover { padding-left: 12px; }
.am-row .am-row-idx { opacity: .6; font-weight: 600; }

/* ---------- countdown widget ---------- */
.am-countdown { display: flex; gap: 14px; flex-wrap: wrap; align-items: stretch; }
.am-cd-unit { min-width: 76px; padding: 14px 8px; text-align: center; border: 1px solid rgba(255,255,255,.16); border-radius: 14px; background: rgba(0,0,0,.2); }
.am-cd-unit strong { display: block; font-variant-numeric: tabular-nums; font-size: 28px; font-weight: 700; line-height: 1; color: var(--am-accent, #c7a24a); }
.am-cd-unit span { font-size: 11px; opacity: .75; text-transform: lowercase; }
.am-cd-caption { display: flex; align-items: center; padding: 14px 16px; }
.am-cd-caption span { font-size: 12px; opacity: .8; }

/* ---------- counter widget ---------- */
.am-counter { display: block; }
.am-counter-num { display: block; font-variant-numeric: tabular-nums; font-size: 32px; font-weight: 700; line-height: 1.1; }
.am-counter-label { font-size: 13px; opacity: .75; }

/* ---------- marquee ticker widget ---------- */
.am-marquee { overflow: hidden; padding: 16px 0; border-top: 1px solid rgba(0,0,0,.1); border-bottom: 1px solid rgba(0,0,0,.1); }
.am-marquee-track { display: flex; gap: 40px; width: max-content; animation-name: am-scroll-left; animation-timing-function: linear; animation-iteration-count: infinite; }
.am-marquee:hover .am-marquee-track { animation-play-state: paused; }
.am-marquee-track span { white-space: nowrap; display: flex; align-items: center; gap: 8px; font-weight: 600; }
.am-marquee-track span small { opacity: .6; font-weight: 400; font-size: 11px; }
@keyframes am-scroll-left { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- animated timeline widget ---------- */
.am-timeline { position: relative; padding-left: 0; }
.am-timeline-track { position: absolute; left: 19px; top: 6px; bottom: 6px; width: 2px; background: rgba(0,0,0,.12); }
.am-timeline-fill { position: absolute; left: 19px; top: 6px; width: 2px; background: var(--am-accent, #c7a24a); height: 0; transition: height 1.1s ease; }
.am-t-item { position: relative; padding: 0 0 30px 58px; }
.am-t-item .am-ball { position: absolute; left: 6px; top: 0; }
.am-t-item h3 { font-size: 12px; margin: 0 0 4px; opacity: .75; font-weight: 600; }
.am-t-item h4 { margin: 0 0 6px; font-size: 20px; }
.am-t-item p { margin: 0; opacity: .8; font-size: 14px; }

/* ball chip, shared by timeline + anywhere a numbered marker is useful */
.am-ball { --c:#e7b93b; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:radial-gradient(circle at 34% 30%, #fff 0 10%, var(--c) 12% 100%); color:#fff; font-weight:700; font-size:11px; box-shadow:inset 0 -3px 5px rgba(0,0,0,.35), inset 0 2px 2px rgba(255,255,255,.5); }
.am-ball[data-n="2"]{--c:#1e4fa0} .am-ball[data-n="3"]{--c:#b8272d} .am-ball[data-n="4"]{--c:#5b3a78}
.am-ball[data-n="5"]{--c:#dd6a22} .am-ball[data-n="6"]{--c:#1f7a4d} .am-ball[data-n="7"]{--c:#7c2d2d} .am-ball[data-n="8"]{--c:#171310}
.am-ball[data-n="9"]{ background:conic-gradient(from -20deg,#e7b93b 0 24%, #fff 24% 76%, #e7b93b 76% 100%); color:#241a02; }

/* ---------- drag carousel widget ---------- */
.am-carousel { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; cursor: grab; }
.am-carousel:active { cursor: grabbing; }
.am-carousel::-webkit-scrollbar { height: 6px; }
.am-carousel::-webkit-scrollbar-thumb { background: rgba(0,0,0,.15); border-radius: 6px; }
.am-card { scroll-snap-align: start; flex: 0 0 auto; display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 16px; border: 1px solid rgba(0,0,0,.1); background: rgba(0,0,0,.03); transition: transform .35s cubic-bezier(.16,.8,.24,1); }
.am-card:hover { transform: translateY(-6px); }
.am-card-rank { font-size: 22px; font-weight: 700; opacity: .5; }
.am-card h4 { margin: 0; font-size: 15px; }
.am-card span:last-child { font-size: 12px; opacity: .65; }
