/* FutpixelTV "Competições online" (competitions-ui.js): a full-screen dialog in the black/red TV theme. Tokens from
   styles.css / tv-theme.css with fallbacks so the screen also works on its own (tests/competitions-browser.cjs). */
.comp-dialog{position:fixed;inset:0;width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#060608;color:var(--ink,#f3f3f5);font-family:var(--tv-font,system-ui,sans-serif);display:none;flex-direction:column;overflow:hidden}
.comp-dialog[open]{display:flex}
.comp-dialog::backdrop{background:#000c}
.comp-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));border-bottom:3px solid var(--red,#e5173a);background:linear-gradient(90deg,#16060a,#060608 60%)}
.comp-head h2{margin:2px 0 0;font-size:clamp(20px,4vw,30px);letter-spacing:1px;text-transform:uppercase}
.comp-eyebrow{display:block;color:var(--red,#e5173a);font-size:11px;font-weight:800;letter-spacing:2px}
.comp-status{margin:0;padding:8px 16px;background:#1d2a1d;color:#b8f0b8;font-weight:700}
.comp-status[data-error="true"]{background:#3a0d14;color:#ffc0ca}
.comp-body{flex:1;overflow:auto;padding:16px max(16px,env(safe-area-inset-right)) 24px max(16px,env(safe-area-inset-left));overscroll-behavior:contain}
.comp-legend{display:flex;gap:16px;justify-content:flex-end;padding:6px 16px;border-top:1px solid #ffffff14;color:#a7a7b0;font-size:12px}
@media (pointer:coarse){.comp-legend{display:none}}
.comp-intro p,.comp-note{margin:0 0 12px;color:#b9b9c2;line-height:1.45;max-width:72ch}
.comp-loading,.comp-error{padding:24px 0;color:#d6d6dc}.comp-error{color:#ffc0ca}
.comp-section{margin:0 0 22px}
.comp-section-title{margin:0 0 10px;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;color:#fff;border-left:4px solid var(--red,#e5173a);padding-left:8px}
.comp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.comp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.comp-card{display:flex;gap:12px;align-items:center;width:100%;min-height:84px;padding:12px;border:1px solid #ffffff1f;border-left:4px solid var(--comp-accent,#e5173a);border-radius:var(--r-sm,6px);background:linear-gradient(135deg,#15151b,#0b0b0f);color:inherit;text-align:left;font:inherit;cursor:pointer}
.comp-card:hover,.comp-card:focus-visible,.comp-card:focus{outline:none;border-color:var(--red,#e5173a);box-shadow:0 0 0 2px var(--red,#e5173a),0 6px 18px #e5173a33}
.comp-card-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.comp-card-head{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.comp-card-name{font-size:16px;text-transform:uppercase;letter-spacing:.5px}
.comp-card-meta{color:#a9a9b3;font-size:12px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.comp-card-status,.comp-chips{display:flex;gap:6px;flex-wrap:wrap}
.comp-chip{display:inline-block;padding:2px 7px;border-radius:999px;background:#ffffff14;color:#e4e4ea;font-size:11px;font-weight:700;letter-spacing:.4px}
.comp-chip-open,.comp-chip-play{background:var(--red,#e5173a);color:#fff}
.comp-chip-running{background:#1f6f3f;color:#fff}.comp-chip-finished{background:#8d6a1f;color:#fff}.comp-chip-cancelled{background:#444}
.comp-trophy{aspect-ratio:auto;image-rendering:pixelated;flex:none;filter:drop-shadow(0 2px 0 #000)}
.comp-countdown{display:inline-flex;gap:6px;align-items:baseline;font-size:12px;color:#c8c8d0}
.comp-countdown strong{color:#fff;font-variant-numeric:tabular-nums}
.comp-gate{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:0 0 18px}
.comp-gate p{margin:0;max-width:60ch}
.comp-private-row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.comp-field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#b9b9c2;min-width:160px}
.comp-field input,.comp-field select{min-height:44px;padding:8px 10px;border:1px solid #ffffff33;border-radius:var(--r-sm,6px);background:#101015;color:#fff;font:700 15px/1.2 var(--tv-font,system-ui,sans-serif);letter-spacing:1px}
.comp-field input:focus,.comp-field select:focus{outline:2px solid var(--red,#e5173a)}
.comp-fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:10px}
.comp-actions{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
.comp-dialog .tv-btn{min-height:44px}
.comp-dialog .tv-btn:disabled{opacity:.45;cursor:not-allowed}
.comp-dialog .tv-btn:focus-visible,.comp-dialog .tv-btn:focus{outline:2px solid #fff;outline-offset:2px}
.comp-trophies{display:flex;gap:12px;flex-wrap:wrap}
.comp-trophy-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px;border:1px solid #ffffff1f;border-radius:6px;background:#111116;font-size:12px;text-align:center}
.comp-crest{width:22px;height:22px;object-fit:contain;flex:none;image-rendering:auto}
.comp-crest-text{display:inline-grid;place-items:center;border-radius:50%;background:#2a2a33;font-size:8px;font-weight:800}
.comp-club{display:inline-flex;align-items:center;gap:6px;min-width:0}
.comp-club-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* The club pick: the friendly's card (club-picker.js / club-picker.css), one friendly side wide. */
.comp-dialog .comp-picker{width:100%;max-width:620px}
/* Its confirm button stays in view while the card scrolls (the friendly's Pronto on phones). */
.comp-dialog .comp-pick-actions{position:sticky;bottom:0;z-index:2;max-width:620px;margin:0;padding:10px 0 12px;background:linear-gradient(180deg,#06060800,#060608 28%)}
.comp-season-head{display:flex;gap:16px;align-items:center;padding:12px;margin:0 0 14px;border-left:5px solid var(--comp-accent,#e5173a);background:linear-gradient(90deg,#17171d,#060608)}
.comp-season-title{margin:0 0 6px;font-size:clamp(20px,4.5vw,32px);text-transform:uppercase}
.comp-season-copy{display:flex;flex-direction:column;gap:6px;min-width:0}
.comp-round{margin:0;font-weight:700}
.comp-share{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 14px}
.comp-code{font-size:24px;letter-spacing:4px;color:#fff;margin-right:auto}
.comp-human-list{list-style:none;margin:0 0 8px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.comp-human-list li{display:flex;justify-content:space-between;gap:8px;padding:8px;border-radius:6px;background:#111116}
.comp-human-list li.is-you{outline:2px solid var(--red,#e5173a)}
.comp-human-name{color:#c8c8d0;font-size:12px}
.comp-you{display:flex;gap:8px;align-items:center;font-weight:700}
.comp-next{margin:0 0 16px}
.comp-next-stage{margin:6px 0;font-weight:700;color:#e4e4ea}
.comp-matchup{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;padding:6px 0}
.comp-matchup .comp-home{justify-content:flex-end;text-align:right}
.comp-matchup .comp-home .comp-crest{order:2}
.comp-score{min-width:56px;text-align:center;font-weight:800;font-variant-numeric:tabular-nums;color:#fff}
.comp-next .comp-matchup{font-size:clamp(15px,3.6vw,20px);font-weight:800}
.comp-rival{margin:4px 0;color:#c8c8d0}
.comp-sim{grid-column:1/-1;justify-self:center;color:#8f8f99;font-size:10px;text-transform:uppercase;letter-spacing:1px}
.comp-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 10px;border-bottom:1px solid #ffffff1f}
.comp-tab{min-height:44px;padding:8px 14px;border:0;border-bottom:3px solid transparent;background:none;color:#b9b9c2;font:800 13px/1 var(--tv-font,system-ui,sans-serif);letter-spacing:1px;text-transform:uppercase;cursor:pointer}
.comp-tab[aria-pressed="true"]{color:#fff;border-bottom-color:var(--red,#e5173a)}
.comp-tab:focus{outline:2px solid #fff;outline-offset:-2px}
.comp-table-wrap{overflow-x:auto}
.comp-table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.comp-table th{padding:6px 4px;color:#8f8f99;font-size:11px;text-align:center;border-bottom:1px solid #ffffff22}
.comp-table td{padding:6px 4px;text-align:center;border-bottom:1px solid #ffffff0f}
.comp-table .comp-table-club{text-align:left;max-width:220px}
.comp-table th:nth-child(2){text-align:left}
.comp-table tr.is-you td{background:#2a0a11}
.comp-table tr.is-qualified td:first-child{box-shadow:inset 3px 0 0 #1f9f5a}
.comp-pts{font-weight:800;color:#fff}
.comp-coach{display:block;color:var(--red,#ff6b81);font-size:10px;margin-left:28px}
.comp-group{margin:0 0 14px}.comp-group h4,.comp-round-box h4,.comp-bracket-stage h4{margin:0 0 6px;font-size:13px;text-transform:uppercase;letter-spacing:1px}
.comp-bracket{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:12px;overflow-x:auto;padding-bottom:6px}
.comp-tie{padding:6px 8px;margin:0 0 8px;border:1px solid #ffffff1f;border-radius:6px;background:#111116;font-size:13px}
.comp-tie.is-decided{border-color:#ffffff40}
.comp-rounds{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.comp-round-box{padding:10px;border:1px solid #ffffff1a;border-radius:6px;background:#0e0e12;font-size:13px}
.comp-round-box.is-current{border-color:var(--red,#e5173a)}
.comp-scorers{margin:0;padding-left:24px;max-width:520px}
.comp-scorers li{display:flex;gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid #ffffff0f}
.comp-scorer-name{flex:1}.comp-scorer-goals{color:#ffd35a}
.comp-champion{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0 0 16px;text-align:center;background:radial-gradient(circle at 50% 30%,#3a2a08,#0b0b0f 70%)}
.comp-champion .comp-eyebrow{font-size:16px;letter-spacing:6px}
.comp-champion-club{font-size:clamp(20px,5vw,30px);font-weight:900;text-transform:uppercase}
.comp-champion-club .comp-crest{width:40px;height:40px}
.comp-champion-you{margin:0;color:#ffd35a;font-weight:900;font-size:18px}
.comp-champion-coach{margin:0;color:#c8c8d0}
.comp-champion .comp-trophy{animation:comp-shine 2.4s ease-in-out infinite}
@keyframes comp-shine{50%{filter:drop-shadow(0 0 12px #ffd35a)}}
@media (prefers-reduced-motion:reduce){.comp-champion .comp-trophy{animation:none}}
.comp-toasts{position:fixed;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:2147483000;display:flex;flex-direction:column;gap:8px;max-width:min(380px,calc(100vw - 24px));pointer-events:none}
.comp-toasts>*{pointer-events:auto}
.comp-toast{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #ffffff22;border-left:4px solid var(--red,#e5173a);border-radius:6px;background:#0d0d11f2;color:#f3f3f5;box-shadow:0 8px 24px #000a;font-size:13px}
.comp-toast-copy{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.comp-toast .tv-btn{min-height:36px;padding:6px 10px}
.comp-toast-close{min-width:36px}
.comp-toast-more{align-self:flex-end;min-height:32px;padding:4px 12px;font-size:12px;background:#0d0d11f2}
/* Front menu entries (front-menu.js): the online screen's shortcut. */
.fm-competitions-entry{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:12px 0;padding:12px;border:1px solid #ffffff1f;border-left:4px solid var(--red,#e5173a);border-radius:var(--r-sm,6px);background:#0e0e12}
.fm-competitions-entry p{margin:0;max-width:60ch;color:#c8c8d0}
/* Phones: a single column; landscape keeps the header short. */
@media (max-width:560px){
  .comp-grid,.comp-cards,.comp-rounds{grid-template-columns:1fr}
  .comp-season-head{flex-direction:row;align-items:flex-start}
  .comp-season-head .comp-trophy{width:40px;height:auto}
  .comp-private-row>*{flex:1 1 100%}
  .comp-actions .tv-btn{flex:1 1 100%}
  .comp-table{font-size:12px}
  .comp-table th:nth-child(n+5):nth-child(-n+7),.comp-table td:nth-child(n+5):nth-child(-n+7){display:none}
}
@media (max-height:480px) and (orientation:landscape){
  .comp-head{padding-top:6px;padding-bottom:6px}.comp-head h2{font-size:18px}
  .comp-season-head{padding:6px}.comp-season-head .comp-trophy{width:36px;height:auto}
  .comp-legend{display:none}
}
.fm-competitions-home.fm-button{position:relative;justify-content:flex-start;gap:17px;width:100%;max-width:630px;min-height:64px;margin-top:10px;padding:10px 24px 10px 19px;text-align:left;border:1px solid #e5173a80;border-left:4px solid var(--red,#e5173a);border-radius:0;background:linear-gradient(90deg,#3a0d16d9,#2e323c33);transform:skew(-5deg)}
.fm-competitions-home>*{transform:skew(5deg)}
.fm-competitions-home>svg{width:28px;height:28px;color:#ffc42e}
.fm-competitions-home>svg:last-child{width:22px;height:22px;margin-left:auto;opacity:.7}
.fm-competitions-home .fm-mode-copy strong{font-size:20px}
.fm-competitions-home:hover,.fm-competitions-home:focus-visible{background:linear-gradient(110deg,#f22f4d,#b80f2d);color:#fff;transform:translateX(9px) skew(-5deg)}
.fm-competitions-home:hover small,.fm-competitions-home:focus-visible small{color:#ffe1e6}
@media (max-width:600px){.fm-competitions-home.fm-button{min-height:64px;padding:10px 13px;gap:12px}.fm-competitions-home .fm-mode-copy strong{font-size:18px}}
.comp-table-wrap{max-width:860px}
.comp-tbd{color:#8f8f99;font-style:italic}
.comp-tie .comp-club-name{white-space:normal;overflow-wrap:anywhere}
