.change-log-column { padding-bottom: 48px; }
.change-log-main { width: min(100%, 1120px); margin: 0 auto; padding: 48px 0 64px; }
.change-log-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 31px; }
.change-log-eyebrow, .change-log-kicker { margin: 0; color: #7889a1; font-size: 9px; font-weight: 700; letter-spacing: .17em; }
.change-log-intro h1 { margin-top: 9px; font-size: clamp(42px, 5vw, 58px); letter-spacing: -.065em; }
.change-log-intro h1 span { color: #92baff; background: linear-gradient(100deg, #a9cbff, #78a5fb 58%, #8cd8e4); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.change-log-description { max-width: 550px; margin: 13px 0 0; color: #929fb2; font-size: 11px; line-height: 1.7; }
.reset-all-button { display: inline-flex; min-height: 40px; flex: 0 0 auto; align-items: center; justify-content: center; gap: 8px; padding: 0 13px; border: 1px solid rgba(235, 137, 137, .2); border-radius: 7px; color: #d7a4a4; background: rgba(99, 41, 47, .12); cursor: pointer; font-size: 9px; font-weight: 700; transition: background 150ms ease, border-color 150ms ease, color 150ms ease; }
.reset-all-button svg { width: 15px; height: 15px; }
.reset-all-button:hover:not(:disabled) { border-color: rgba(235, 137, 137, .45); color: #ffd3d3; background: rgba(125, 45, 54, .24); }
.reset-all-button:disabled { opacity: .38; cursor: not-allowed; }
.change-log-panel { overflow: hidden; border: 1px solid rgba(200, 218, 242, .1); border-radius: 12px; background: linear-gradient(145deg, rgba(17, 26, 41, .9), rgba(10, 17, 29, .92)); box-shadow: 0 20px 55px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .025); }
.change-log-panel-heading { display: flex; min-height: 83px; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 21px; border-bottom: 1px solid rgba(200, 218, 242, .09); }
.change-log-panel-heading h2 { margin: 5px 0 0; color: #f1f5fb; font-family: 'Space Grotesk', sans-serif; font-size: 20px; font-weight: 600; letter-spacing: -.04em; }
.change-log-count { color: #8c9bb1; font-size: 9px; font-weight: 700; letter-spacing: .08em; }
.change-log-list { display: grid; align-content: start; max-height: min(62vh, 680px); min-height: 250px; gap: 0; overflow-y: auto; padding: 0 18px; scrollbar-color: #3a4d68 #111b2b; scrollbar-width: thin; }
.change-log-list[aria-busy="true"] { display: flex; align-items: center; justify-content: center; }
.change-log-loading { display: flex; align-items: center; gap: 9px; color: #8d9bb0; font-size: 10px; }
.change-log-entry { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: start; gap: 14px; padding: 17px 3px; border-bottom: 1px solid rgba(190, 211, 238, .075); animation: change-entry-in 260ms ease both; }
.change-log-entry:last-child { border-bottom: 0; }
.change-player-face { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; overflow: hidden; border: 1px solid rgba(178, 200, 226, .18); border-radius: 50%; color: #d3def0; background: radial-gradient(circle at 30% 20%, #445873, #1a283c 74%); font-size: 10px; font-weight: 700; object-fit: cover; }
.change-log-entry-content { min-width: 0; }
.change-log-entry-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.change-log-entry-identity { display: flex; min-width: 0; align-items: center; gap: 9px; }
.change-log-entry-identity h3 { overflow: hidden; margin: 0; color: #edf2fb; font-family: 'Space Grotesk', sans-serif; font-size: 14px; font-weight: 600; letter-spacing: -.02em; text-overflow: ellipsis; white-space: nowrap; }
.change-remove-button { display: grid; width: 29px; height: 29px; flex: 0 0 auto; place-items: center; border: 1px solid transparent; border-radius: 7px; color: #8492a7; background: transparent; cursor: pointer; font-size: 20px; line-height: 1; transition: color 140ms ease, border-color 140ms ease, background 140ms ease; }
.change-remove-button:hover { border-color: rgba(234, 133, 133, .2); color: #ffd1d1; background: rgba(127, 48, 55, .19); }
.change-detail-row { display: grid; grid-template-columns: 67px minmax(0, 1fr); align-items: center; gap: 8px; min-height: 27px; }
.change-detail-label { color: #74849a; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.change-transfer-values, .change-position-values, .change-rating-values { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 9px; }
.change-club { display: inline-flex; min-width: 0; align-items: center; gap: 6px; color: #aab8ca; font-size: 9px; font-weight: 600; }
.change-club.is-current { color: #dceaff; }
.change-club img { width: 21px; height: 21px; flex: 0 0 auto; object-fit: contain; }
.change-club-name { overflow: hidden; max-width: 190px; text-overflow: ellipsis; white-space: nowrap; }
.change-detail-arrow { color: #71839c; font-size: 12px; }
.change-position-primary { display: inline-flex; align-items: center; gap: 8px; color: #93a2b7; font-family: 'Space Grotesk', sans-serif; font-size: 10px; font-weight: 700; }
.change-position-primary strong { color: #bdd7ff; }
.change-position-secondary { color: #8292a8; font-size: 9px; }
.change-rating-stars { display: inline-flex; gap: 1px; color: #77869b; font-size: 13px; line-height: 1; }
.change-rating-star.is-full { color: #f2c65f; text-shadow: 0 0 7px rgba(242, 198, 95, .18); }
.change-rating-star.is-half { color: transparent; background: linear-gradient(90deg, #f2c65f 50%, #77869b 50%); -webkit-background-clip: text; background-clip: text; }
.change-log-empty { display: grid; justify-items: center; align-content: center; min-height: 280px; padding: 30px 20px; text-align: center; }
.change-log-empty-icon { display: grid; width: 37px; height: 37px; place-items: center; margin-bottom: 12px; border: 1px solid rgba(98, 224, 226, .2); border-radius: 50%; color: #7fd8cb; background: rgba(43, 112, 105, .13); font-size: 17px; }
.change-log-empty strong { color: #dce5f2; font-family: 'Space Grotesk', sans-serif; font-size: 14px; }
.change-log-empty p { margin: 7px 0 13px; color: #8290a4; font-size: 10px; }
.change-log-empty a { color: #9dc1ff; font-size: 10px; font-weight: 700; text-decoration: none; }
.change-log-empty a:hover { color: #d4e4ff; text-decoration: underline; }
.change-log-error { color: #e9a2a2; font-size: 10px; }
.change-log-status { position: fixed; z-index: 4; right: 24px; bottom: 24px; max-width: min(420px, calc(100vw - 32px)); padding: 12px 15px; border: 1px solid rgba(98, 224, 226, .24); border-radius: 8px; color: #c9eee7; background: rgba(12, 31, 37, .96); box-shadow: 0 12px 35px rgba(0, 0, 0, .4); font-size: 10px; animation: change-entry-in 180ms ease both; }
.change-log-status[hidden] { display: none; }
.reset-confirm-dialog { width: min(430px, calc(100vw - 28px)); max-width: 430px; padding: 0; border: 1px solid rgba(235, 137, 137, .23); border-radius: 14px; color: #e8eef8; background: radial-gradient(ellipse at 50% 0, rgba(158, 70, 77, .12), transparent 58%), linear-gradient(145deg, #172033, #0b111c); box-shadow: 0 28px 90px rgba(0, 0, 0, .72); }
.reset-confirm-dialog::backdrop { background: rgba(2, 6, 13, .78); backdrop-filter: blur(7px); }
.reset-confirm-content { display: grid; justify-items: center; padding: 27px 26px 23px; text-align: center; }
.reset-confirm-icon { display: grid; width: 34px; height: 34px; place-items: center; margin-bottom: 12px; border: 1px solid rgba(232, 133, 133, .25); border-radius: 50%; color: #edaaaa; background: rgba(135, 49, 56, .17); font-family: 'Space Grotesk', sans-serif; font-size: 17px; font-weight: 700; }
.reset-confirm-content h2 { margin: 6px 0 0; color: #f4f6fb; font-family: 'Space Grotesk', sans-serif; font-size: 22px; letter-spacing: -.04em; }
.reset-confirm-content > p:not(.change-log-kicker) { max-width: 320px; margin: 9px 0 0; color: #95a2b5; font-size: 10px; line-height: 1.7; }
.reset-confirm-actions { display: flex; justify-content: center; gap: 8px; margin-top: 20px; }
.reset-cancel-button, .reset-confirm-button { min-height: 37px; padding: 0 13px; border: 1px solid rgba(190, 211, 238, .15); border-radius: 7px; color: #c4cfde; background: rgba(255, 255, 255, .035); cursor: pointer; font-size: 9px; font-weight: 700; }
.reset-confirm-button { border-color: rgba(235, 137, 137, .32); color: #ffd7d7; background: rgba(130, 45, 54, .27); }
.reset-cancel-button:hover { border-color: rgba(190, 211, 238, .3); color: #f1f5fb; }
.reset-confirm-button:hover { border-color: rgba(235, 137, 137, .55); background: rgba(155, 50, 60, .4); }
@keyframes change-entry-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 700px) {
  .change-log-main { padding-top: 31px; }
  .change-log-intro { align-items: flex-start; flex-direction: column; gap: 17px; }
  .reset-all-button { align-self: flex-end; }
  .change-log-panel-heading { min-height: 73px; padding-inline: 15px; }
  .change-log-list { padding-inline: 12px; }
  .change-log-entry { grid-template-columns: 40px minmax(0, 1fr); gap: 10px; padding: 14px 0; }
  .change-player-face { width: 39px; height: 39px; }
  .change-detail-row { grid-template-columns: 58px minmax(0, 1fr); gap: 5px; }
  .change-club-name { max-width: 135px; }
  .change-log-status { right: 12px; bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .change-log-entry, .change-log-status { animation: none; }
}

/* Refined, spacious change cards */
.change-log-main { width: min(100%, 1160px); padding-top: 56px; }
.change-log-intro { align-items: flex-end; margin-bottom: 36px; }
.change-log-eyebrow, .change-log-kicker { font-size: 10px; letter-spacing: .15em; }
.change-log-intro h1 { margin-top: 11px; font-size: clamp(48px, 5.2vw, 66px); }
.change-log-description { max-width: 610px; margin-top: 16px; font-size: 13px; line-height: 1.75; }
.reset-all-button { min-height: 44px; padding: 0 16px; border-radius: 9px; font-size: 11px; }
.reset-all-button svg { width: 17px; height: 17px; }
.change-log-panel { border-color: rgba(176, 199, 230, .13); border-radius: 16px; background: linear-gradient(150deg, rgba(17, 27, 44, .96), rgba(10, 16, 28, .96)); }
.change-log-panel-heading { min-height: 96px; padding: 19px 24px; }
.change-log-panel-heading h2 { margin-top: 6px; font-size: 23px; }
.change-log-count { padding: 8px 11px; border: 1px solid rgba(163, 190, 225, .13); border-radius: 999px; color: #b6c3d5; background: rgba(167, 193, 224, .055); font-size: 10px; letter-spacing: .04em; }
.change-log-list { display: grid; align-content: start; max-height: none; min-height: 290px; gap: 12px; overflow: visible; padding: 17px; }
.change-log-list[aria-busy="true"] { display: flex; align-items: center; justify-content: center; }
.change-log-loading { gap: 12px; font-size: 13px; }
.change-log-entry { grid-template-columns: 58px minmax(0, 1fr); gap: 17px; padding: 18px 20px; border: 1px solid rgba(169, 193, 222, .12); border-radius: 13px; background: linear-gradient(135deg, rgba(25, 38, 58, .77), rgba(17, 27, 43, .73)); box-shadow: inset 0 1px rgba(255,255,255,.025), 0 6px 18px rgba(0,0,0,.09); transition: border-color 180ms ease, background 180ms ease, transform 180ms ease; }
.change-log-entry:hover { transform: translateY(-1px); border-color: rgba(156, 190, 237, .23); background: linear-gradient(135deg, rgba(29, 44, 66, .87), rgba(18, 30, 48, .82)); }
.change-log-entry:last-child { border-bottom: 1px solid rgba(169, 193, 222, .12); }
.change-player-face { width: 56px; height: 56px; border-color: rgba(185, 207, 238, .2); }
.change-log-entry-content { padding-top: 1px; }
.change-log-entry-header { align-items: center; gap: 16px; margin-bottom: 14px; }
.change-log-entry-identity { flex-wrap: wrap; gap: 8px 11px; }
.change-log-entry-identity h3 { font-size: 18px; letter-spacing: -.035em; }
.change-entry-summary { padding: 4px 8px; border: 1px solid rgba(127, 170, 225, .15); border-radius: 999px; color: #92acd0; background: rgba(82, 125, 185, .09); font-size: 9px; font-weight: 700; letter-spacing: .03em; }
.change-remove-button { display: inline-flex; width: auto; height: 34px; align-items: center; justify-content: center; gap: 7px; padding: 0 11px; border: 1px solid rgba(174, 196, 224, .16); border-radius: 8px; color: #aab9cc; background: rgba(209, 224, 245, .045); font-size: 10px; font-weight: 700; transition: border-color 150ms ease, color 150ms ease, background 150ms ease; }
.change-remove-button svg { width: 15px; height: 15px; }
.change-remove-button:hover { border-color: rgba(240, 161, 161, .32); color: #ffd2d2; background: rgba(127, 48, 55, .2); }
.change-detail-row { grid-template-columns: 104px minmax(0, 1fr); gap: 11px; min-height: 48px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(177, 198, 227, .085); }
.change-detail-label { color: #8293aa; font-size: 9px; letter-spacing: .09em; }
.change-comparison { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr); align-items: center; gap: 8px; }
.change-comparison-side { display: grid; min-width: 0; grid-template-columns: 52px minmax(0, 1fr); align-items: center; gap: 8px; }
.change-comparison-label { color: #6f8097; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.change-comparison-value { display: flex; min-width: 0; min-height: 29px; flex-wrap: wrap; align-items: center; gap: 5px; }
.change-comparison-arrow { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(163, 190, 225, .11); border-radius: 50%; color: #8da3c1; background: rgba(163, 190, 225, .045); font-size: 13px; }
.change-club { gap: 8px; color: #aab8ca; font-size: 12px; font-weight: 600; }
.change-club.is-current { color: #e0ecff; }
.change-club img { width: 27px; height: 27px; }
.change-club-name { max-width: 240px; }
.change-position-chip { display: inline-grid; min-width: 35px; min-height: 28px; place-items: center; padding: 0 8px; border: 1px solid rgba(142, 175, 219, .16); border-radius: 7px; color: #aebdd2; background: rgba(115, 150, 196, .08); font-family: 'Space Grotesk', sans-serif; font-size: 11px; font-weight: 700; }
.is-after .change-position-chip { border-color: rgba(120, 171, 238, .22); color: #d3e5ff; background: rgba(93, 143, 207, .14); }
.change-position-empty { color: #75849a; font-size: 11px; }
.change-rating-stars { gap: 2px; color: #58677c; font-size: 15px; }
.change-rating-value { color: #c4cfdf; font-size: 11px; font-weight: 700; white-space: nowrap; }
.change-comparison-side.is-before .change-comparison-label { color: #728198; }
.change-comparison-side.is-after .change-comparison-label { color: #79d8c3; }
.change-comparison-side.is-after .change-club { color: #c6f0e2; }
.change-comparison-side.is-after .change-position-chip { border-color: rgba(99, 215, 187, .3); color: #b8f0df; background: linear-gradient(135deg, rgba(54, 153, 129, .2), rgba(58, 112, 166, .16)); box-shadow: inset 0 1px rgba(220, 255, 244, .035); }
.change-comparison-side.is-after .change-rating-value { color: #8be1c8; }
.change-comparison-side.is-after .change-position-empty { color: #9ac8bb; }
.change-comparison-arrow { border-color: rgba(97, 198, 185, .2); color: #8de0d1; background: linear-gradient(135deg, rgba(45, 136, 120, .2), rgba(53, 105, 159, .16)); box-shadow: inset 0 1px rgba(219, 255, 245, .04), 0 0 13px rgba(63, 180, 160, .045); }
.change-log-list { align-content: start; max-height: min(70vh, 760px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; scrollbar-color: rgba(110, 150, 195, .48) rgba(9, 15, 26, .5); scrollbar-width: thin; }
.change-log-empty { min-height: 320px; }
.change-log-empty-icon { width: 44px; height: 44px; margin-bottom: 15px; font-size: 19px; }
.change-log-empty strong { font-size: 17px; }
.change-log-empty p { margin: 9px 0 15px; font-size: 12px; }
.change-log-empty a { font-size: 12px; }
.change-log-error { padding: 24px; font-size: 13px; }
.change-log-status { padding: 14px 18px; font-size: 12px; }

@media (max-width: 760px) {
  .change-log-main { padding-top: 38px; }
  .change-log-intro { gap: 20px; margin-bottom: 27px; }
  .change-log-intro h1 { font-size: clamp(46px, 9vw, 60px); }
  .change-log-panel-heading { min-height: 88px; padding: 16px 18px; }
  .change-log-list { max-height: min(66vh, 680px); gap: 10px; padding: 12px; }
  .change-log-entry { grid-template-columns: 48px minmax(0, 1fr); gap: 13px; padding: 16px; }
  .change-player-face { width: 48px; height: 48px; }
  .change-detail-row { grid-template-columns: 1fr; gap: 7px; padding: 10px 0; }
  .change-detail-label { font-size: 8px; }
}
@media (max-width: 480px) {
  .change-log-main { padding-top: 29px; }
  .change-log-description { font-size: 12px; }
  .change-log-panel-heading { padding-inline: 14px; }
  .change-log-panel-heading h2 { font-size: 21px; }
  .change-log-list { max-height: min(64vh, 620px); padding: 9px; }
  .change-log-entry { grid-template-columns: 42px minmax(0, 1fr); gap: 10px; padding: 13px 11px; }
  .change-player-face { width: 42px; height: 42px; }
  .change-log-entry-header { align-items: flex-start; gap: 8px; }
  .change-log-entry-identity { gap: 6px; }
  .change-log-entry-identity h3 { font-size: 16px; }
  .change-remove-button { width: 34px; flex: 0 0 34px; padding: 0; font-size: 0; }
  .change-remove-button span { display: none; }
  .change-remove-button svg { width: 17px; height: 17px; }
  .change-comparison { grid-template-columns: minmax(0, 1fr) 23px minmax(0, 1fr); gap: 4px; }
  .change-comparison-side { grid-template-columns: 1fr; gap: 4px; }
  .change-comparison-value { gap: 4px; }
  .change-comparison-arrow { width: 23px; height: 23px; }
  .change-club { gap: 5px; font-size: 10px; }
  .change-club img { width: 22px; height: 22px; }
  .change-club-name { max-width: 108px; }
  .change-position-chip { min-width: 31px; min-height: 26px; padding-inline: 6px; font-size: 10px; }
  .change-rating-stars { font-size: 12px; }
  .change-rating-value { font-size: 10px; }
  .change-log-status { right: 10px; bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .change-log-entry { transition: none; }
  .change-log-entry:hover { transform: none; }
}