/* Fanstation Tippspiel 1.1.1: compact fixture rows, no remote images. */
.ftTips { --ft-accent: #136b85; --ft-soft: rgba(19, 107, 133, .08); }
.ftTips .ftHeading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 10px; }
.ftTips .ftHeading h1 { font-size: 23px; line-height: 1.25; margin: 0; }
.ftTips .ftHeading > span { font-size: 12px; color: var(--wcfContentDimmedText); }
.ftTips .ftIntro { margin: 6px 0 10px; }
.ftTips .ftNav ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; padding: 0; list-style: none; }
.ftTips .ftNav a { display: block; padding: 8px 12px; border-radius: 6px; font-weight: 600; border: 1px solid var(--wcfContentBorder); }
.ftTips .ftNav a[aria-current="page"] { background: var(--ft-accent); color: #fff; border-color: var(--ft-accent); }
.ftTips .ftFilters { display: flex; flex-wrap: wrap; align-items: end; gap: 8px 14px; margin: 10px 0; }
.ftTips .ftFilters label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; }
.ftTips .ftBeneficiary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 8px 12px; margin: 10px 0; background: var(--ft-soft); border-radius: 6px; font-size: 12px; }
.ftTips .ftBeneficiary small { width: 100%; }
.ftTips .ftBeneficiary label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ftTips .ftGames { display: grid; gap: 6px; }
.ftTips .ftFixture { display: grid; grid-template-columns: 170px minmax(0, 1fr) 84px; gap: 4px 12px; align-items: center; padding: 8px 12px; border: 1px solid var(--wcfContentBorder); border-radius: 7px; }
.ftTips .ftFixtureMeta { display: flex; flex-direction: column; gap: 3px; font-size: 11px; line-height: 1.4; color: var(--wcfContentDimmedText); }
.ftTips .ftFixtureMeta > span:empty { display: none; }
.ftTips .ftFixtureMain { display: grid; grid-template-columns: minmax(0, 1fr) 126px minmax(0, 1fr); gap: 10px; align-items: center; }
.ftTips .ftTeam { display: flex; gap: 7px; align-items: center; min-width: 0; }
.ftTips .ftHome { justify-content: end; text-align: right; }
.ftTips .ftTeamName { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.ftTips .ftMonogram { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: var(--ft-soft); color: var(--ft-accent); font-size: 9px; font-weight: 800; }
.ftTips .ftScore { display: flex; justify-content: center; gap: 6px; align-items: center; font-size: 18px; font-weight: 700; }
.ftTips .ftScore label { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.ftTips .ftScore input { width: 51px; height: 35px; padding: 3px; text-align: center; font-size: 18px; border-radius: 5px; }
.ftTips .ftInputLabel { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ftTips .ftFixtureFoot { display: flex; flex-direction: column; gap: 3px; text-align: right; font-size: 11px; color: var(--wcfContentDimmedText); }
.ftTips .ftFixture details { grid-column: 1 / -1; font-size: 12px; }
.ftTips .ftFixture summary, .ftTips .ftRules summary, .ftTips .ftSource summary { cursor: pointer; }
.ftTips .ftSaveBar { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin: 12px 0; }
.ftTips .ftRules { max-width: 70%; font-size: 12px; }
.ftTips .ftRules p { margin: 6px 0; }
.ftTips .ftReminder { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 12px 0; }
.ftTips .ftSource { display: flex; gap: 4px; flex-wrap: wrap; align-items: baseline; margin: 12px 0 0; font-size: 11px; color: var(--wcfContentDimmedText); }
.ftTips .ftSource details { margin-left: auto; }
.ftTips .ftSource p { margin: 5px 0; }
.ftTips tr.ftOwn { background: var(--ft-soft); font-weight: 700; }
@media (max-width: 850px) {
    .ftTips .ftFixture { grid-template-columns: minmax(0, 1fr) 78px; gap: 5px 8px; }
    .ftTips .ftFixtureMeta { grid-column: 1; grid-row: 1; flex-direction: row; flex-wrap: wrap; gap: 5px; }
    .ftTips .ftFixtureMain { grid-column: 1 / -1; grid-row: 2; }
    .ftTips .ftFixtureFoot { grid-column: 2; grid-row: 1; }
}
@media (max-width: 450px) {
    .ftTips .ftHeading h1 { font-size: 21px; }
    .ftTips .ftNav ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ftTips .ftNav a { padding: 7px 9px; text-align: center; font-size: 12px; }
    .ftTips .ftFilters { gap: 8px; }
    .ftTips .ftFilters label { max-width: 100%; }
    .ftTips .ftFilters select { max-width: 100%; }
    .ftTips .ftBeneficiary select { max-width: 100%; }
    .ftTips .ftFixture { padding: 8px; }
    .ftTips .ftFixtureMain { grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); gap: 6px; }
    .ftTips .ftTeam { justify-content: center; text-align: center; }
    .ftTips .ftTeamName { font-size: 12px; line-height: 1.35; hyphens: auto; }
    .ftTips .ftMonogram { display: none; }
    .ftTips .ftScore { gap: 4px; }
    .ftTips .ftScore input { width: 43px; height: 40px; font-size: 17px; }
    .ftTips .ftRules { max-width: 100%; }
    .ftTips .ftSource details { width: 100%; margin-left: 0; }
}

/* Direct matchday links preserve the selected view and avoid form submissions. */
.ftTips .ftMatchdays { display: flex; align-items: center; gap: 8px; margin: 10px 0; min-width: 0; }
.ftTips .ftMatchdays > span { font-size: 12px; flex-shrink: 0; }
.ftTips .ftMatchdayLinks { display: flex; gap: 3px; overflow-x: auto; padding: 3px 0 6px; min-width: 0; scrollbar-width: thin; }
.ftTips .ftMatchdayLinks a { display: flex; align-items: center; justify-content: center; min-width: 27px; height: 32px; padding: 0 3px; border: 1px solid var(--wcfContentBorder); border-radius: 4px; font-size: 12px; flex-shrink: 0; }
.ftTips .ftMatchdayLinks a[aria-current="page"] { background: var(--ft-accent); border-color: var(--ft-accent); color: #fff; font-weight: 700; }
.ftTips .ftArchive { margin: 8px 0; font-size: 12px; }
.ftTips .ftArchive summary { cursor: pointer; }
@media (max-width: 600px) {
    .ftTips .ftMatchdayLinks a { min-width: 34px; height: 38px; }
}

/* Field-specific score validation, including an accessible text hint. */
.ftTips .ftScore input[aria-invalid="true"] { border: 2px solid #c53030; background-color: #fff3f3; color: #8f1d1d; }
.ftTips .ftFieldError { color: #b42318; font-size: 11px; font-weight: 400; line-height: 1.3; max-width: 150px; text-align: center; }

.ftTips .ftScore label { width: 51px; }
.ftTips .ftFieldError { width: 100%; overflow-wrap: anywhere; }
@media (max-width: 450px) { .ftTips .ftScore label { width: 43px; } }

/* Compact top predictors box on dashboard and sidebars. */
.ftTopTipper .ftTopTipperList { list-style: none; margin: 0 0 10px; padding: 0; }
.ftTopTipper .ftTopTipperList li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 5px 0; }
.ftTopTipper .ftTopTipperList li span { min-width: 0; overflow-wrap: anywhere; }
.ftTopTipper .ftTopTipperList li strong { white-space: nowrap; font-weight: 600; }
.ftTopTipper > a { font-size: 12px; }

/* Completed match assessment is centered beneath the pairing, not in the side column. */
.ftTips .ftResultLine { grid-column: 2; display: grid; grid-template-columns: minmax(0, 1fr) 126px minmax(0, 1fr); gap: 10px; align-items: center; min-width: 0; padding: 3px 0; font-size: 13px; }
.ftTips .ftActualScore { grid-column: 2; text-align: center; font-size: 16px; }
.ftTips .ftResultPoints { grid-column: 3; min-width: 0; font-size: 12px; }
.ftTips .ftPointsBadge { display: inline-flex; align-items: center; padding: 3px 9px; border-radius: 12px; font-weight: 700; line-height: 1.4; }
.ftTips .ftPointsBadge--exact { background: #d9f3e3; color: #165b31; }
.ftTips .ftPointsBadge--partial { background: #fff0bf; color: #725000; }
.ftTips .ftPointsBadge--none { background: #e9edf1; color: #454d56; }
@media (max-width: 850px) {
    .ftTips .ftResultLine { grid-column: 1 / -1; grid-row: 3; font-size: 12px; }
    .ftTips .ftFixtureFinished > details { grid-row: 4; }
}

@media (max-width: 450px) { .ftTips .ftResultLine { grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); gap: 6px; } }

/* Private season statistics use compact counters and a horizontally scrollable mobile table. */
.ftTips .ftStatTotals { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 12px 0; }
.ftTips .ftStatTotals > div { padding: 10px 12px; border-radius: 6px; background: var(--ft-soft); }
.ftTips .ftStatTotals dt { font-size: 12px; }
.ftTips .ftStatTotals dd { margin: 4px 0 0; font-size: 20px; font-weight: 700; }
.ftTips .ftStatTable { overflow-x: auto; }
.ftTips .ftStatTable th { white-space: nowrap; }