.scout-page { --cp-tabs-height: 0px; max-width: var(--page-max); margin: 0 auto; padding: 24px var(--page-gutter) 36px; min-width: 0; }
.scout-page [hidden] { display: none !important; }
.scout-page h1,.scout-page h2,.scout-page h3,.scout-page p { margin-top: 0; }
.scout-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; margin-bottom: 20px; }
.scout-heading h1 { display: flex; align-items: center; gap: 12px; margin: 0; font-size: clamp(1.5rem,2.2vw,2rem); font-weight: 680; letter-spacing: -.04em; }
.scout-heading p { color: #adc0d6; margin: 6px 0 0; font-size: .9rem; }
.scout-heading-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.scout-heading-actions form { margin: 0; }
.scout-count { display: inline-grid; place-items: center; min-width: 35px; height: 32px; padding: 3px 8px; border: 1px solid #68b0ef40; border-radius: 9px; background: #248cff20; color: #bfdfff; font-size: .85rem; letter-spacing: 0; }
.scout-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 0; }
.scout-toolbar .cc-search { flex: 1; min-width: 0; }
.scout-toolbar .cc-search input { min-width: 0; width: 100%; }
.scout-live { color: #b8cce3; font-size: .83rem; line-height: 1.5; margin: 12px 0; }
.scout-live:empty { height: 16px; margin: 0; }
.scout-note,.scout-device-note { font-size: .87rem; line-height: 1.7; color: #adbed1; }
.scout-device-note { margin-bottom: 20px; }
.scout-device-note a { color: #afd8ff; }
.scout-panel,.scout-player-slot,.scout-empty,.scout-import,.scout-pending { border: 1px solid var(--panel-border); border-radius: var(--radius-panel); background: var(--panel-fill); box-shadow: var(--panel-shadow); padding: 20px; min-width: 0; }
.scout-import,.scout-pending { margin-bottom: 18px; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 12px; border-color: #6aaff944; }
.scout-import p,.scout-pending p { margin: 0; font-size: .9rem; color: #c4d7ed; }
.scout-empty { padding: clamp(30px,5vw,64px); text-align: center; }
.scout-empty-mark { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 20px; background: #248cff1a; color: #8ac8ff; font-size: 2.1rem; margin-bottom: 18px; }
.scout-empty h2 { font-size: 1.2rem; margin-bottom: 10px; }
.scout-empty p { color: #b3c6df; line-height: 1.6; }
.scout-player-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 3px; }
.scout-player-meta img { width: 22px; height: 22px; border-radius: 0; background: transparent; }
.scout-player-meta .nation-flag { height: 16px; }
.scout-shortlist-table .cc-player-col { width: 48%; }
.scout-shortlist-table .cc-position-col { width: 10%; }
.scout-shortlist-table .cc-age-col { width: 8%; }
.scout-shortlist-table .cc-rating-col { width: 10%; }
.scout-shortlist-table .cc-value-col { width: 14%; }
.scout-shortlist-table .cc-identity a { overflow-wrap: normal; hyphens: none; }
.scout-missing { margin-top: 20px; border-top: 1px solid var(--panel-border); padding-top: 12px; }
.scout-missing summary { cursor: pointer; min-height: 44px; padding: 12px 0; }
.scout-missing p { color: #b1c5db; font-size: .85rem; }
.scout-missing > div { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 10px; padding-block: 6px; }
.scout-slots { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.scout-player-slot { position: relative; background: linear-gradient(125deg,#4287ba16,transparent 65%),var(--panel-fill); }
.scout-slot-player { position: relative; text-decoration: none; color: inherit; border-radius: 10px; display: grid; grid-template-columns: 80px minmax(0,1fr); align-items: center; gap: 18px; }
.scout-slot-player > img { object-fit: contain; width: 80px; height: 90px; border-radius: 12px; background: #ffffff05; }
.scout-slot-player > div { min-width: 0; }
.scout-slot-name { display: block; font-weight: 670; font-size: clamp(1rem,1.65vw,1.5rem); line-height: 1.3; text-decoration: none; overflow-wrap: normal; word-break: normal; }
.scout-slot-meta { display: block; color: #b1c8e0; font-size: .83rem; margin-top: 5px; line-height: 1.5; }
.scout-slot-ratings { display: flex; align-items: center; gap: 14px; margin-top: 10px; }
.scout-slot-ratings > span { display: flex; align-items: center; gap: 8px; }
.scout-slot-ratings small { color: #b8cce0; font-size: .65rem; }
.scout-slot-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.scout-text-button { min-height: 44px; display: inline-flex; align-items: center; padding: 6px 10px; color: #afcdea; font-size: .83rem; text-decoration: none; border-radius: 8px; }
.scout-slot-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 150px; text-decoration: none; color: #b6d5f4; text-align: center; }
.scout-slot-empty > span { font-size: 2rem; color: #8bc5fb; }
.scout-slot-empty small { color: #a1b8d0; font-size: .8rem; }
.scout-compare-toolbar { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; margin: 20px 0; }
.scout-compare-toolbar .scout-heading-actions { justify-content: center; }
.scout-slot-edit { position: absolute; right: 0; top: 0; color: #86bbef; opacity: .65; font-size: .9rem; }
.scout-slot-name { padding-right: 18px; }
.scout-difference-filter { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: #bfd4eb; font-size: .87rem; }
.scout-difference-filter input { width: 18px; height: 18px; accent-color: #248cff; }
.scout-attribute-toolbar { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 14px; margin-top: 24px; margin-bottom: 18px; }
.scout-attribute-toolbar h2 { margin: 0; font-size: 1.15rem; }
.scout-attribute-toolbar .cc-search { flex: 0 1 320px; }
.scout-search-results { list-style: none; margin: 0 0 20px; padding: 8px; border: 1px solid var(--panel-border); border-radius: 14px; background: #162536; max-height: 360px; overflow-y: auto; }
.scout-search-results a { display: grid; grid-template-columns: 40px minmax(0,1fr) 42px; align-items: center; gap: 12px; padding: 8px; min-height: 64px; text-decoration: none; border-radius: 10px; }
.scout-search-results img { width: 40px; height: 44px; object-fit: contain; }
.scout-search-results strong { display: block; font-size: .93rem; line-height: 1.4; }
.scout-search-results small { display: block; color: #acbfd5; font-size: .78rem; margin-top: 3px; }
.scout-error { color: #ffb5ac; border: 1px solid #f0896e55; border-radius: 12px; background: #74362726; padding: 14px 18px; line-height: 1.6; }
.scout-share-dialog { width: min(540px,calc(100% - 32px)); border: 1px solid #52799e; border-radius: 20px; background: #15273a; color: #eef6ff; padding: 24px; }
.scout-share-dialog::backdrop { background: #020710b3; }
.scout-share-dialog form { display: flex; justify-content: end; }
.scout-share-dialog h2 { margin-block: 12px 20px; font-size: 1.2rem; }
.scout-share-dialog label { display: grid; gap: 10px; font-size: .9rem; }
.scout-share-dialog input { width: 100%; min-width: 0; min-height: 46px; font-size: 16px; color: #e5f3ff; background: #0c1927; border: 1px solid #658ca6; border-radius: 8px; padding: 10px; }
.scout-share-dialog p { color: #b9cde3; line-height: 1.6; font-size: .85rem; }
@media (hover: hover) and (pointer: fine) { .scout-player-slot:hover { border-color: #6ca9da60; } .scout-slot-name:hover,.scout-text-button:hover { color: #fff; } .scout-text-button:hover,.scout-search-results a:hover { background: #478fc825; } }
@media (prefers-reduced-motion: no-preference) { .scout-player-slot { transition: border-color 180ms; animation: scout-appear 240ms var(--motion-ease); } .scout-player-slot:hover .scout-slot-player > img { transform: translateY(-2px); } .scout-slot-player > img { transition: transform 200ms; } @keyframes scout-appear { from { opacity: .4; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } } }
@media (max-width: 767px) {
  .scout-page { padding: 16px 16px 28px; }
  .scout-heading { margin-bottom: 16px; }
  .scout-heading p { font-size: .84rem; }
  .scout-toolbar { gap: 8px; }
  .scout-toolbar input { font-size: 16px; }
  .scout-toolbar > button { padding-inline: 12px; }
  .scout-mobile-list > article { border-bottom: 1px solid #ffffff12; }
  .scout-mobile-list > article:last-child { border-bottom: 0; }
  .scout-mobile-list .cc-mobile-player { border-bottom: 0; }
  .scout-compare-search { flex-wrap: wrap; }
  .scout-slots { gap: 10px; }
  .scout-player-slot { padding: 12px; border-radius: 14px; }
  .scout-slot-player { position: relative; text-decoration: none; color: inherit; border-radius: 10px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
  .scout-slot-player > img { width: 56px; height: 60px; }
  .scout-slot-name { font-size: .97rem; line-height: 1.4; }
  .scout-slot-meta { font-size: .75rem; }
  .scout-slot-ratings { gap: 10px; }
  .scout-slot-ratings > span { flex-direction: column; gap: 4px; }
  .scout-slot-ratings .cc-score { min-width: 38px; height: 34px; }
  .scout-slot-actions { gap: 2px; }
  .scout-text-button { padding-inline: 7px; font-size: .77rem; }
  .scout-slot-empty { min-height: 190px; font-size: .85rem; }
  .scout-panel { padding: 14px; }
  .scout-attribute-toolbar .cc-search { flex-basis: 100%; }
  .scout-attribute-toolbar input { font-size: 16px; }
  .scout-page .cp-compare-table { min-width: 0; }
}
@media (max-width: 359px) { .scout-slots { grid-template-columns: minmax(0,1fr); } .scout-slot-player { flex-direction: row; align-items: center; } .scout-slot-empty { min-height: 100px; } }
@media (prefers-reduced-motion: reduce) { .scout-page *, .scout-page *::before, .scout-page *::after { animation: none !important; transition: none !important; transform: none !important; } }
.scout-page :is(a,button,input,select,summary):focus-visible { outline: 2px solid #a6d3ff; outline-offset: 4px; }
.scout-page .button:not(.button--accent) { color: #e1ecfa; background: var(--control-fill); }
.scout-page .button:disabled { cursor: wait; opacity: .6; }
.scout-page [aria-busy="true"] { opacity: .7; }

.scout-picker { position: fixed; inset: 0; width: min(580px,calc(100% - 32px)); max-height: min(650px,calc(100dvh - 48px)); margin: auto; padding: 22px; border: 1px solid #557998; border-radius: 22px; background: #122234; color: #eef6ff; box-shadow: 0 32px 100px #0009; overflow-y: auto; overscroll-behavior: contain; }
.scout-picker::backdrop { background: #02071099; }
.scout-picker-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.scout-picker-heading h2 { margin: 0; font-size: 1.2rem; }
.scout-picker-heading p { margin: 6px 0 0; color: #a9c4df; font-size: .85rem; line-height: 1.5; }
.scout-picker-heading p:empty { display: none; }
.scout-picker-heading .button { width: 44px; height: 44px; padding: 0; font-size: 1.4rem; }
.scout-picker .scout-search-results { margin-bottom: 0; border: 0; background: transparent; padding: 0; max-height: 360px; }
.scout-picker .scout-toolbar .cc-search { flex-basis: 180px; }
.scout-picker [data-scout-search-results] a:focus-visible { outline-offset: -3px; }
.scout-picker[aria-busy="true"] [data-scout-choose] { pointer-events: none; }
@media (prefers-reduced-motion: no-preference) { .scout-picker[open] { animation: scout-picker-in 180ms var(--motion-ease); } @keyframes scout-picker-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } } }
@media (max-width: 767px) { .scout-picker { padding: 18px; width: calc(100% - 24px); max-height: calc(100dvh - 24px); border-radius: 18px; } }