/* eFootball RTG · The Huddle
   Gradient colour stays on identity, actions and celebrations.
   Questions and answer text sit on solid, high-contrast surfaces. */
:root {
  --bg: #100b1c;
  --panel: #281e3c;
  --panel2: #1b142b;
  --line: #4b3a65;
  --muted: #c1b6d1;
  --white: #faf8ff;
  --violet: #a575ff;
  --lime: #d7ff3f;
  --ink: #160f29;
  --blue: var(--violet);
  --yellow: var(--lime);
  --cyan: #c4a4ff;
  --pink: var(--lime);
  --green: #8eebbb;
  --red: #ff91a6;
  --gradient-purple: linear-gradient(135deg, #5420a5, #7836cd 58%, #8b46d3);
  --gradient-orchid: linear-gradient(135deg, #a575ff, #c49bff);
  --gradient-lime: linear-gradient(115deg, #b8ef39, #e4ff65);
  --radius: 14px;
}
body {
  font-size: 16px;
  background-color: var(--bg);
  background-image: radial-gradient(ellipse at 85% 0, #59299438, transparent 52%);
}
::selection { background: var(--lime); color: var(--ink); }
a { color: var(--cyan); }
small { font-size: .8125rem; }
button, input, select, summary { touch-action: manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, summary:focus-visible {
  outline: 3px solid var(--lime);
  outline-offset: 4px;
}
.button {
  border-radius: 10px;
  background: #35254c;
  min-height: 48px;
  font-size: .9375rem;
  transition: filter .18s, transform .18s, box-shadow .18s;
}
.button:hover:not(:disabled) { filter: brightness(1.07); }
.button.primary {
  background: var(--gradient-lime);
  color: var(--ink);
  border-color: #e4ff6570;
  box-shadow: 0 4px 18px #d7ff3f10;
}
.button.ghost { background: transparent; border-color: #705590; color: var(--white); }
.button.ghost:hover:not(:disabled) { background: #a575ff16; }
.button.danger { background: #4d223c; color: #ffc2ce; }
.good { color: var(--green); }
.bad { color: #ffadbb; }
.eyebrow { font-size: .875rem; letter-spacing: .1em; }

/* Identity and navigation */
.topbar { height: 96px; background: #130d20; border-color: #392a50; }
.brand { padding: 0; flex-shrink: 0; }
.brand img { display: block; width: 210px; height: auto; }
.loading-brand { width: min(340px, 85%); height: auto; }
.wallet { background: #221934; border-color: #705590; }
.profile-strip .icon-button { min-width: 44px; min-height: 44px; justify-content: center; border-radius: 10px; }
.main-nav { border-color: var(--line); }
.main-nav button { border-radius: 8px 8px 0 0; min-height: 56px; }
.main-nav button:hover { background: #a575ff13; }
.main-nav button.active { background: linear-gradient(0deg, #a575ff20, transparent); color: var(--lime); border-color: var(--lime); }
.section-head h1 { color: var(--white); }
.section-head .eyebrow { color: var(--violet); }
.section-head p { color: var(--muted); }
footer { font-size: .8125rem; line-height: 1.6; }
.crest {
  background: linear-gradient(150deg, #8548da, #3d1b6f);
  border-color: #c7a4ff;
  color: var(--lime);
}

/* Clubhouse and game menu */
.club-banner {
  background: var(--gradient-purple);
  border: 1px solid #c39bff55;
  border-radius: 18px;
  box-shadow: inset 0 1px #ffffff24;
}
.club-banner::after {
  content: '';
  position: absolute;
  width: 320px;
  height: 320px;
  inset-inline-end: 9%;
  top: -68px;
  background: url('/brand/huddle-watermark.svg') center / contain no-repeat;
  opacity: .08;
  pointer-events: none;
}
.club-banner .crest { background: #24123f80; border-color: #dfc6ff; }
.club-banner p, .club-banner small { color: var(--white); }
.club-banner .eyebrow { color: #eee2ff; }
.banner-rating { z-index: 1; }
.home-tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.menu-tile { border-radius: var(--radius); border: 1px solid #ffffff35; min-width: 0; box-shadow: inset 0 1px #ffffff20; }
.menu-tile:hover { box-shadow: 0 12px 28px #0005, inset 0 0 0 2px #faf8ff; transform: translateY(-3px); }
.tile-play { background: var(--gradient-lime); color: var(--ink); }
.tile-squad { background: linear-gradient(135deg, #442467, #623795); color: var(--white); }
.tile-contracts { background: var(--gradient-orchid); color: var(--ink); }
.tile-badges { background: linear-gradient(135deg, #32204d, #562c80); color: var(--white); }
.tile-community { background: var(--gradient-purple); color: var(--white); }
.feature-panel {
  background: linear-gradient(130deg, #241437, #4b247d);
  border-color: #9767c4;
  border-radius: var(--radius);
}
.feature-panel small { color: #e1d4f1; }
.stadium-mark { right: -20px; bottom: 20px; transform: rotate(-12deg); opacity: .13; pointer-events: none; }
.stadium-mark img { display: block; width: 190px; height: 190px; }
.panel, .mode-card, .contract, .listing, .selected-detail { border-radius: var(--radius); }
.panel p { color: var(--muted); }
.panel h2 .icon { color: var(--violet); }
.strip { background: var(--panel2); border-inline-start: 3px solid var(--violet); border-radius: 0 var(--radius) var(--radius) 0; }
.strip p, .feature-panel small { font-size: .875rem; }
.history-tiles span { background: #322145; color: var(--cyan); }
.history-tiles small { font-size: .75rem; }
.next-badge p span { font-size: .875rem; }
.result-W { background: #a7eebf; color: #123123; }
.result-D { background: #cec3de; color: var(--ink); }
.result-L { background: #62263e; color: #fff1f4; }
.mode-card { background: linear-gradient(145deg, #271936, #1b142b 65%); }
.mode-card small { font-size: .875rem; }
.mode-art { opacity: .7; }
.mode-art>.icon { color: var(--violet); }
.fixture-progress i { background: #504060; }
.fixture-progress i.done { background: var(--lime); }

/* Squad, transfers, rankings and achievements */
input, select { background: #130e20; border-color: #705590; border-radius: 9px; color: var(--white); font-size: 1rem; }
.strength { background: linear-gradient(140deg, #3c235a, #1b142b); border-radius: var(--radius); border-color: var(--violet); }
.selected-detail .button, .contract-bottom .button, .tabs button { font-size: .875rem; min-height: 44px; }
.selected-detail p, .contract p, .contract a, .selected-detail a { font-size: .8125rem; }
.tabs .active { background: var(--lime); border-color: var(--lime); color: var(--ink); }
.division-summary { background: linear-gradient(115deg, #281b3d, #472471); border: 1px solid var(--line); border-radius: var(--radius); }
.division-summary>div { border-left: 0; border-inline-start: 1px solid #ffffff25; padding-left: 0; padding-inline-start: 24px; }
td { background: #271e36; border-color: #4a385d; }
tr:nth-child(even) td { background: #20172e; }
.my-row td { background: #e9dcff !important; color: var(--ink); }
.my-row small { color: #544164; }
.distribution span { background: #362744; }
.distribution i { background: var(--gradient-orchid); }
.badge-tile { background: #2b203a; border-radius: var(--radius); }
.badge-tile.selected { background: #e9dcff; color: var(--ink); border-color: var(--lime); outline-color: var(--lime); }
.badge-tile.selected small { color: #534365; }
.badge-detail { background: radial-gradient(ellipse at 50% 20%, #482478, var(--bg) 68%); border-radius: var(--radius); }
.equipped-mark { background: var(--lime); color: var(--ink); }
.grade-ladder .achieved { background: #332440; }
progress::-webkit-progress-bar { background: #43334f; }
progress::-webkit-progress-value { background: var(--gradient-lime); }
progress::-moz-progress-bar { background: var(--gradient-lime); }

/* Match surfaces: keep reading areas solid. */
.scoreboard { background: linear-gradient(105deg, #54228a, #221432 43%, #221432 57%, #54228a); border: 1px solid #714696; border-radius: var(--radius); }
.score span { color: #d2bae9; }
.timer { background: var(--panel2); border-color: #705590; }
.timer strong { font-variant-numeric: tabular-nums; }
.timer.urgent { color: #ffb3c0; border-color: #ff91a6; }
.question-progress>span { border-color: #705590; }
.question-progress .current { color: var(--ink); }
.question-progress .hit { background: #226441; border-color: #8eebbb; }
.question-panel { background: #21172f; border-color: #634980; border-radius: var(--radius); }
.question-visual { color: #bd95f21a; }
.answers .answer { background: #352546; border-color: #87699f; border-radius: 10px; color: var(--white); }
.answers .answer:not(:disabled):hover { background: #4b3163; border-color: var(--violet); }
.answer-key { color: #d4baff; }
.answer-key small { color: var(--muted); font-size: .75rem; }
.answers .answer.correct-answer { background: #21583d; border-color: #8eebbb; }
.answers .answer.wrong-answer { background: #63253e; border-color: #ff91a6; }
.answers .answer.chosen { outline-color: var(--lime); }
.room-answers .answer-0 .answer-key { color: #d4baff; }
.room-answers .answer-1 .answer-key { color: #e4ff65; }
.room-answers .answer-2 .answer-key { color: #fff; }
.room-answers .answer-3 .answer-key { color: #dab5fc; }
.last-answer { background: var(--panel2); border-color: var(--violet); }
.answer-explanation p { font-size: 1rem; }
.answer-explanation a { font-size: .875rem; }
.rival-rule { font-size: .875rem; }
.fulltime { background: radial-gradient(ellipse at top, #57218d, #190f29 75%); border-color: #8153ab; border-radius: var(--radius); }
.fulltime-ribbon { background: var(--gradient-lime); color: var(--ink); }
.waiting-panel { background: var(--panel2); border-color: var(--line); border-radius: var(--radius); }
.search-orbit i { border-color: var(--violet); }
.match-analysis { background-color: #211235; background-image: linear-gradient(#ba91ef0d 1px, transparent 1px), linear-gradient(90deg, #ba91ef0d 1px, transparent 1px); }
.comparison-bars>div { background: #170e25; }

/* Streamer rooms carry the Huddle identity. */
.room-header h1 { color: var(--white); overflow-wrap: anywhere; }
.room-pin { background: linear-gradient(120deg, #35204e, #4c2475); border-color: #9470b9; border-radius: var(--radius); }
.room-pin strong { color: var(--lime); }
.room-pin .button { font-size: .875rem; min-height: 44px; }
.lobby-panel { background: radial-gradient(ellipse at 50% 20%, #4e2380, #1b142b 72%); border-color: #8157a6; border-radius: var(--radius); }
.lobby-ball img { width: 112px; height: 112px; animation: ball-float 5s ease-in-out infinite; }
.lobby-players>span { background: #37234b; border: 1px solid #674c7d; border-radius: 10px; }
.answer-distribution>div>div { background: #d7ff3f; }
.answer-distribution>div:nth-child(1)>div { background: #a575ff; }
.answer-distribution>div:nth-child(3)>div { background: #faf8ff; }
.answer-distribution>div:nth-child(4)>div { background: #d8afff; }
.podium { background: radial-gradient(ellipse at center, #4d2676, #1a1029 80%); border-radius: var(--radius); }
.podium article { background: linear-gradient(180deg, #543575, #21152f); border-color: #9d77b9; border-radius: 12px 12px 0 0; }
.podium article { flex: 1 1 0; min-width: 0; max-width: 200px; }
.podium-1 { background: linear-gradient(180deg, #623896, #2b1744) !important; border-color: var(--lime) !important; }
.source-list a { background: #171021; border-color: var(--line); border-radius: 10px; }

/* Celebrations and overlays */
dialog { background: #21142f; border-color: #a575ff; border-radius: 18px; }
dialog::backdrop { background: #100919df; }
.walkout { background: radial-gradient(ellipse, #a575ff50, #d7ff3f12 40%, transparent 70%); }
#toast { background: #f5eeff; border-color: #8544d8; color: var(--ink); border-radius: 10px; }
#celebration { background: radial-gradient(ellipse, #391354ed, #160f2980 50%, transparent 80%); }
#celebration strong { color: var(--lime); background: var(--gradient-lime); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-shadow: none; filter: drop-shadow(0 5px 0 #371352); }
#celebration span { background: var(--gradient-purple); border: 1px solid #bf93ff; border-radius: 12px; color: var(--white); }
.goal-ball img { width: 110px; height: 110px; animation: goal-flight .6s both; }
.loader { border-color: #553d6d; border-top-color: var(--lime); }

@media (max-width: 1100px) {
  .stadium-mark { right: 12px; bottom: 0; }
}
@media (max-width: 700px) {
  body { font-size: 16px; }
  .topbar { height: 84px; gap: 8px; }
  .brand img { width: 165px; }
  .profile-strip { gap: 4px; }
  .eyebrow { font-size: .75rem; }
  .section-head p { font-size: .875rem; }
  .club-banner { padding: 22px 18px; background: var(--gradient-purple); }
  .club-banner::after { width: 210px; height: 210px; top: -20px; inset-inline-end: 18%; }
  .club-banner p { font-size: .8125rem; max-width: 210px; }
  .club-banner .crest { display: none; }
  .home-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .menu-tile { height: auto; min-height: 140px; padding: 17px 13px; gap: 15px; }
  .menu-tile:nth-child(4), .menu-tile:nth-child(5) { height: auto; min-height: 125px; }
  .menu-tile span { font-size: 23px; overflow-wrap: anywhere; }
  .feature-panel h2 { max-width: 85%; }
  .feature-panel small, .strip p { font-size: .875rem; }
  .mode-card p, .rules p, .lobby-panel p { font-size: 1rem; }
  .mode-card p { max-width: 85%; }
  .tabs button { font-size: .875rem; }
  .answer, .room-answers .answer { font-size: 1rem; }
  .answer-key small { font-size: .75rem; }
  .question-panel h1 { font-size: 1.625rem; }
  .lifelines .button { font-size: .875rem; min-height: 44px; }
  .lifelines>span, .rival-rule, .last-answer summary, .verdict { font-size: .875rem; }
  .answer-explanation p { font-size: 1rem; }
  .answer-explanation a { font-size: .875rem; }
  .answer-explanation small { font-size: .8125rem; }
  .room-pin .button { font-size: .875rem; min-height: 44px; }
  .room-pin>span { font-size: .75rem; max-width: 75px; }
  .room-controls .button { font-size: .875rem; }
  .lobby-players>span { font-size: .875rem; }
  .contract p, .contract a { font-size: .8125rem; }
  .badge-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .badge-tile strong { font-size: 1rem; }
  .badge-tile small { font-size: .75rem; }
  .badge-detail p { font-size: 1rem; }
  .room-answers { grid-template-columns: 1fr; }
  .match-top { flex-wrap: wrap; }
  .room-answers .answer { flex-direction: row; text-align: start; justify-content: start; min-height: 72px; gap: 16px; padding: 14px; }
  .source-list small { font-size: .8125rem; }
  footer { font-size: .75rem; flex-direction: column; gap: 10px; }
  footer a { max-width: none; text-align: start; }
  html[lang=ja] .badge-tile strong, html[lang=ar] .badge-tile strong { font-size: .875rem; }
  #celebration strong { font-size: clamp(40px, 13vw, 70px); }
  #celebration span { max-width: 90vw; text-align: center; padding: 10px 18px; }
}
@media (max-width: 380px) {
  .brand img { width: 145px; }
  .wallet { font-size: 18px; padding: 5px 8px; }
  .main-nav button { padding-inline: 10px; }
  .club-banner { padding: 20px 16px; }
  .menu-tile span { font-size: 21px; }
  .badge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .menu-tile:hover, .button:hover:not(:disabled), .player-card:hover { transform: none; }
  #celebration strong { filter: none; }
}
@media (forced-colors: active) {
  .button.primary, .menu-tile, .answer { border: 1px solid ButtonText; }
  #celebration strong { -webkit-text-fill-color: CanvasText; color: CanvasText; filter: none; }
}

/* Matchday menu. Artwork carries the atmosphere; actions remain readable. */
.topbar { height: 88px; }
.account-button { min-height: 44px; padding: 10px 16px; background: #44305f; white-space: nowrap; }
.main-nav { background: #171021; }
.main-nav button { transition: background .18s, color .18s; }
.matchday-hero { position: relative; isolation: isolate; min-height: 432px; border: 1px solid #8460a866; border-radius: 22px; overflow: hidden; background: #160d2c; box-shadow: 0 16px 55px #0003; }
.hero-art { position: absolute; inset: 0; height: 100%; width: 100%; object-fit: cover; z-index: -2; }
.matchday-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#130b26b8, #130b2645 57%,transparent); }
.hero-copy { padding: 42px 44px; max-width: 620px; }
.hero-kicker { color: var(--lime); display: flex; gap: 10px; align-items: center; font-size: .75rem; letter-spacing: .15em; }
.hero-kicker .icon { width: 18px; height: 18px; }
.hero-copy h1 { font-size: clamp(40px, 5.5vw, 68px); line-height: .98; letter-spacing: -.025em; margin: 22px 0 18px; text-transform: uppercase; max-width: 530px; }
.hero-copy h1 .brand-e { text-transform: none; }
.hero-copy p { max-width: 390px; color: #eee6f9; line-height: 1.6; font-size: 1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.hero-actions .button { min-height: 52px; padding: 13px 22px; }
.hero-actions .ghost { background: #170f24c9; }
.hero-footnote { display: flex; gap: 8px; align-items: center; margin-top: 18px; color: #dbd0e8; font-size: .75rem; }
.hero-footnote .icon { width: 14px; height: 14px; color: var(--lime); }
.hero-label { position: absolute; inset-inline-end: 32px; top: 28px; display: grid; font: 600 14px Rajdhani,sans-serif; letter-spacing: .12em; text-align: end; opacity: .8; }
.hero-label b { font-size: 28px; line-height: 1; color: var(--lime); }
.hero-label span { font-size: 9px; margin-top: 8px; }
.menu-heading { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin: 28px 0 14px; }
.menu-heading h2 { margin: 0; font: 700 .85rem 'DM Sans',sans-serif; letter-spacing: .08em; }
.menu-heading>span { color: var(--muted); font: 500 .8rem Rajdhani,sans-serif; letter-spacing: .12em; }
.play-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.play-card { display: flex; flex-direction: column; text-align: start; padding: 24px; color: var(--white); border: 1px solid #8665a8; border-radius: 16px; background: linear-gradient(130deg,#48276d,#27163e); position: relative; min-width: 0; min-height: 230px; transition: transform .18s,box-shadow .18s; }
.play-card.quick { background: linear-gradient(115deg,#dbff60,#b7ed36); color: var(--ink); border-color: #e5ff89; }
.play-card.crowd { background: linear-gradient(125deg,#8b4dd3,#6431ad); border-color: #bb8cec; }
.play-card-top { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-bottom: 20px; }
.play-card-top small { font: 600 1.15rem Rajdhani,sans-serif; opacity: .6; }
.mode-icon { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #fff4; background: #ffffff14; border-radius: 12px; }
.quick .mode-icon { background: #160f2910; border-color: #160f2928; }
.mode-icon .icon { width: 27px; height: 27px; }
.play-card>strong { font: 700 clamp(27px,3vw,36px)/1.1 Rajdhani,'Noto Sans Arabic','Noto Sans JP',sans-serif; }
.play-card-detail { font-size: .8125rem; line-height: 1.6; margin: 8px 0 18px; opacity: .92; }
.play-card-cta { display: flex; gap: 10px; justify-content: space-between; align-items: center; width: 100%; border-top: 1px solid #ffffff30; padding-top: 14px; margin-top: auto; font-size: .875rem; font-weight: 700; }
.quick .play-card-cta { border-color: #160f2930; }
.play-card-cta .icon { width: 20px; height: 20px; }
@media (hover:hover) { .play-card:hover { transform: translateY(-4px); box-shadow: 0 10px 30px #0005, inset 0 0 0 1px #ffffff90; } .club-link:hover { background: #342146; } }
.play-section { animation: menu-arrive .45s ease-out both; }
@keyframes menu-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.club-section { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; margin-bottom: 24px; }
.club-link { display: flex; width: 100%; align-items: center; gap: 16px; color: var(--white); text-align: start; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #21172f; margin-bottom: 10px; }
.club-link-icon { display: grid; place-items: center; flex-shrink: 0; width: 46px; height: 46px; border-radius: 10px; color: #c6a0ff; background: #392450; }
.club-link>span:nth-child(2) { display: grid; gap: 3px; flex: 1; }
.club-link strong { font-size: .95rem; }
.club-link small { color: var(--muted); font-size: .8rem; line-height: 1.4; }
.club-link>.icon { width: 18px; height: 18px; flex-shrink: 0; color: var(--muted); }
.season-card { margin-top: 59px; border: 1px solid #644982; border-radius: 16px; padding: 24px; background: radial-gradient(ellipse at top right,#51277c55,transparent),#20142d; }
.season-card>.eyebrow { color: var(--violet); font-size: .7rem; }
.season-rating { display: flex; align-items: center; gap: 18px; margin: 18px 0; }
.season-rating .crest { width: 58px; height: 70px; }
.season-rating h2 { font-size: 32px; margin: 0 0 4px; }
.season-rating>div>span { font-size: .8125rem; color: var(--muted); }
.season-card p { font-size: .875rem; line-height: 1.6; color: var(--muted); }
.season-card>.button { margin-top: 16px; }
.club-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.club-bottom .panel { margin: 0; }
.account-layout { display: grid; grid-template-columns: 1fr 1fr; max-width: 1000px; margin: 24px auto; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: var(--panel2); }
.account-pitch { position: relative; min-height: 560px; overflow: hidden; }
.account-pitch>img { position: absolute; height: 100%; width: 100%; object-fit: cover; object-position: 70%; opacity: .6; }
.account-pitch>div { position: relative; background: linear-gradient(#190d2ded,transparent); padding: 36px; }
.account-pitch h1 { font-size: 48px; margin: 15px 0; }
.account-pitch p { color: #eee4fa; line-height: 1.7; }
.account-panel { padding: 40px 32px; min-width: 0; }
.account-panel h2 { font-size: 32px; margin: 12px 0; }
.account-panel p { color: var(--muted); font-size: .9rem; line-height: 1.6; }
.account-panel>.button { width: 100%; margin-top: 18px; }
.google-button { background: #fff; color: #1f1f1f; border: 1px solid #747775; border-radius: 4px; font-family: 'DM Sans',sans-serif; font-weight: 500; gap: 12px; }
.google-g { font: 700 22px Arial,sans-serif; color: #4285f4; }
.auth-notice { padding: 12px 14px; border: 1px solid #73568f; border-radius: 10px; background: #332144; }
.email-option { margin-top: 20px; border-top: 1px solid var(--line); padding-top: 16px; }
.email-option summary { cursor: pointer; min-height: 44px; padding: 10px 0; }
.email-option form { display: grid; gap: 12px; margin-top: 10px; }
.email-option label { display: grid; gap: 8px; }
.email-option input { width: 100%; }
.guest-continue { background: transparent; color: var(--lime); }
.account-note { font-size: .75rem!important; }
.account-status { display: flex; align-items: center; gap: 10px; color: var(--lime); font-size: .85rem; margin-bottom: 18px; }
html[dir=rtl] .hero-copy { margin-inline-start: auto; background: linear-gradient(270deg,#140b29ef,#140b2970); }
html[dir=rtl] .hero-label { display: none; }
@media(max-width:900px) { .hero-copy { padding: 36px 28px; max-width: 560px; }.hero-label { display: none; }.play-card { padding: 20px; }.profile-strip .manager-name { display: none; } }
@media(max-width:700px) {
 .topbar { height: 76px; padding-inline: 16px; }.brand img { width: 145px; }.account-button { padding: 8px 10px; font-size: .8125rem; }.profile-strip .wallet { display: none; }.profile-strip { gap: 8px; }
 .main-nav button { min-height: 52px; }.matchday-hero { min-height: 440px; border-radius: 16px; }.hero-art { object-position: 63%; }.matchday-hero::after { background: linear-gradient(90deg,#130b26dc,#130b2640),linear-gradient(0deg,#130b26e6,transparent 60%); }
 .hero-copy { padding: 28px 22px; max-width: none; }.hero-kicker { font-size: .65rem; letter-spacing: .09em; }.hero-copy h1 { font-size: 47px; margin-top: 25px; }.hero-copy p { max-width: 280px; font-size: .875rem; }.hero-actions { margin-top: 24px; gap: 9px; }.hero-actions .button { padding: 12px 16px; }.hero-footnote { font-size: .6875rem; }
 .play-cards { grid-template-columns: 1fr; gap: 12px; }.play-card { min-height: 0; padding: 18px 20px; display: grid; grid-template-columns: 44px minmax(0,1fr); column-gap: 16px; }.play-card-top { grid-row: 1/3; width: 44px; margin: 0; align-self: center; }.play-card-top small { display: none; }.play-card>strong { font-size: 29px; }.play-card-detail { margin: 5px 0 0; font-size: .8rem; }.play-card-cta { grid-column: 1/-1; margin-top: 16px; padding-top: 12px; }.menu-heading h2 { font-size: .75rem; }.menu-heading>span { font-size: .7rem; }
 .club-section,.club-bottom { grid-template-columns: 1fr; gap: 16px; }.season-card { margin-top: 0; padding: 22px; }.club-bottom .panel { min-width: 0; }.account-layout { grid-template-columns: 1fr; margin-top: 0; }.account-pitch { min-height: 200px; }.account-pitch>img { object-position: 75% 55%; }.account-pitch>div { padding: 26px; }.account-pitch h1 { font-size: 38px; margin: 10px 0; }.account-pitch p { max-width: 280px; font-size: .875rem; }.account-panel { padding: 26px 22px; }.account-panel h2 { font-size: 28px; }
 html[lang=ja] .hero-copy h1,html[lang=ar] .hero-copy h1 { font-size: 36px; line-height: 1.35; }html[lang=ja] .play-card>strong,html[lang=ar] .play-card>strong { font-size: 25px; }
}
@media(max-width:380px) { .brand img { width: 126px; }.topbar { padding-inline: 12px; }.profile-strip { gap: 2px; }.hero-copy { padding: 26px 18px; }.hero-copy h1 { font-size: 40px; }.hero-actions .button { font-size: .8rem; }.hero-kicker { font-size: .6rem; }.hero-footnote { font-size: .65rem; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation: none!important; transition: none!important; scroll-behavior: auto!important; }.play-card:hover { transform: none; } }

#main:focus { outline: none; }

footer { flex-wrap: wrap; }
.footer-links { display: flex; flex-wrap: wrap; align-items: center; column-gap: 8px; row-gap: 6px; min-width: 0; }
.account-legal-links { line-height: 1.6; }

.google-button { font-family: "Google Sans",sans-serif; font-size: 14px; font-weight: 500; padding: 12px; gap: 10px; }.google-g { display: block; width: 20px; height: 20px; flex-shrink: 0; }

.guest-rooms>section:first-child { order: 2; }.guest-rooms>section:nth-child(2) { order: 1; }

.mobile-clubbar { display: none; }
@media(max-width:700px) { .mobile-clubbar { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 18px; color: var(--muted); font-size: .75rem; border-bottom: 1px solid #372844; }.mobile-clubbar>span { display: flex; align-items: center; gap: 5px; }.mobile-clubbar .icon { color: var(--lime); width: 14px; height: 14px; }.mobile-clubbar b { color: var(--white); } }

@media(max-width:700px) { .account-pitch { min-height: 112px; }.account-pitch>div { padding: 22px; }.account-pitch h1 { font-size: 32px; margin: 8px 0; }.account-pitch p { display: none; } }