/* The Free Tournament Manager (fc-kit.js and its four scenes). Set up and Codes: the organiser's desktop window, at every
   width. Score from a code: the printed card and two phones (the marker's and a friend's); on a narrow screen, the two
   phones. On the TV: one TV. Devices drawn as Competitions & Leagues draws them (cp.css). */
.fc-win { left: 26px; top: 20px; width: 848px; height: 500px; }
.fc-win .dv-url-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.fc-who { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap: 5px;
  font: 600 8.5px/1 Geist, Arial, sans-serif; color: #4a463d; white-space: nowrap; }
.fc-who i { width: 15px; height: 15px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 6.5px; letter-spacing: .02em; color: #fff; }
[data-mode="narrow"] .fc-who span { display: none; }

.fc-dev { position: absolute; }
.fc-view { position: absolute; overflow: hidden; }
.fc-page { position: absolute; inset: 0; overflow: hidden; background: #fff; }
.fc-if { position: absolute; left: 0; top: 0; border: 0; transform-origin: 0 0; pointer-events: none; background: #fff; }
/* A page change on the same device: later pages lie over earlier ones and cross-fade in (0.5 s). */
.fc-later { opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility 0s .5s; }
.fc-later.is-on { opacity: 1; visibility: visible; transition: opacity .5s ease, visibility 0s; }
.fc-loading .fc-page { visibility: hidden; }   /* an empty device while a page loads: never a page loading on camera */

.fc-phone { border-radius: 30px; background: #1b1a17; box-shadow: 0 0 0 1px rgba(27, 26, 23, .08), 0 22px 50px -18px rgba(27, 26, 23, .45); }
.fc-phone .fc-view { left: 7px; top: 7px; right: 7px; bottom: 7px; border-radius: 24px; background: #F2F4F9; }
.fc-phone .fc-page, .fc-phone .fc-if { background: #F2F4F9; }
.fc-sheet { background: #fff; border-radius: 3px; box-shadow: 0 0 0 1px rgba(27, 26, 23, .1), 0 16px 34px -16px rgba(27, 26, 23, .45); transform: rotate(-2deg); }
.fc-sheet .fc-view { inset: 0; border-radius: 3px; }
.fc-tv-bezel { position: absolute; left: 0; right: 0; top: 0; padding: 9px; border-radius: 9px; background: #15161a;
  box-shadow: 0 0 0 1px rgba(27, 26, 23, .12), 0 26px 50px -20px rgba(27, 26, 23, .5); }
.fc-tv .fc-view { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 2px; background: #F2F4F9; }
.fc-tv-stand { position: absolute; left: 50%; width: 150px; height: 20px; transform: translateX(-50%); border-radius: 0 0 6px 6px;
  background: linear-gradient(#2a2b30, #15161a); clip-path: polygon(18% 0, 82% 0, 100% 100%, 0 100%); }
.fc-label { position: absolute; left: 0; right: 0; text-align: center; font: 600 9px/1 Geist, Arial, sans-serif; color: #6e6a60; letter-spacing: .02em; white-space: nowrap; }
.fc-phone .fc-label { bottom: -15px; }
.fc-sheet .fc-label { bottom: -18px; transform: rotate(2deg); }

/* Score from a code: the card from the printed sheet, the marker's phone, and a friend's phone. */
.fc-L-phones .fc-dev-a { left: 44px; top: 118px; width: 196px; height: 268px; }
.fc-L-phones .fc-dev-b { left: 318px; top: 12px; width: 236px; height: 498px; }
.fc-L-phones .fc-dev-c { left: 616px; top: 12px; width: 236px; height: 498px; transition: opacity .5s ease, filter .5s ease; }
.fc-L-phones .fc-dev-c:not(.is-on) { opacity: .35; filter: saturate(.4); }
.fc-L-phones .fc-dev-c:not(.is-on) .fc-page { visibility: hidden; }
[data-mode="narrow"].fc-L-phones .fc-dev-a { display: none; }
[data-mode="narrow"].fc-L-phones .fc-phone { top: 8px; width: 158px; height: 398px; border-radius: 22px; }
[data-mode="narrow"].fc-L-phones .fc-phone .fc-view { left: 5px; top: 5px; right: 5px; bottom: 5px; border-radius: 17px; }
[data-mode="narrow"].fc-L-phones .fc-dev-b { left: 8px; }
[data-mode="narrow"].fc-L-phones .fc-dev-c { left: 174px; }
[data-mode="narrow"].fc-L-phones .fc-label { bottom: -16px; font-size: 10px; }

/* On the TV: one TV, large. */
.fc-L-tv .fc-tv { left: 84px; top: 34px; width: 732px; }
.fc-L-tv .fc-tv .fc-tv-stand { top: calc((732px - 18px) * 9 / 16 + 18px); }
.fc-L-tv .fc-tv .fc-label { top: calc((732px - 18px) * 9 / 16 + 50px); }
[data-mode="narrow"].fc-L-tv .fc-tv { left: 10px; top: 150px; width: 320px; }
[data-mode="narrow"].fc-L-tv .fc-tv .fc-tv-bezel { padding: 6px; border-radius: 7px; }
[data-mode="narrow"].fc-L-tv .fc-tv .fc-tv-stand { top: calc((320px - 12px) * 9 / 16 + 12px); width: 80px; height: 10px; }
[data-mode="narrow"].fc-L-tv .fc-tv .fc-label { top: calc((320px - 12px) * 9 / 16 + 30px); }
/* The live line over the TV: what the viewer is watching is live (as cp.css's). */
.fc-live { position: absolute; z-index: 30; left: 50%; top: 6px; display: flex; align-items: center; gap: 6px; padding: 5px 10px 5px 8px; border-radius: 999px;
  background: rgba(10, 20, 48, .92); color: #fff; font: 600 9px/1 Geist, Arial, sans-serif; letter-spacing: .02em; white-space: nowrap;
  opacity: 0; transform: translate(-50%, -6px); transition: opacity .35s ease, transform .5s cubic-bezier(.2, .85, .2, 1); pointer-events: none; }
.fc-live i { width: 7px; height: 7px; border-radius: 50%; background: #E75055; animation: fc-pulse 1.6s ease-out infinite; }
@keyframes fc-pulse { 0% { box-shadow: 0 0 0 0 rgba(231, 80, 85, .55); } 80%, 100% { box-shadow: 0 0 0 7px rgba(231, 80, 85, 0); } }
.fc-live.is-on { opacity: 1; transform: translate(-50%, 0); }
[data-mode="narrow"] .fc-live { top: 110px; }

/* A finger, not a mouse, on the phones (Adam, 28 October 2026; as qs.css): the kit's pointer drawn as a soft dot. */
.fc-L-phones .cd-pointer { left: -12px; top: -12px; width: 24px; height: 24px; border-radius: 50%;
  background: rgba(27, 26, 23, .26); box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .8), 0 3px 8px rgba(27, 26, 23, .22);
  filter: none; transition: opacity .3s, width .12s ease, height .12s ease, left .12s ease, top .12s ease, background-color .12s ease; }
.fc-L-phones .cd-pointer path { display: none; }
.fc-L-phones .cd-pointer.is-down { left: -10px; top: -10px; width: 20px; height: 20px; background: rgba(27, 26, 23, .4); }
[data-mode="narrow"].fc-L-phones .cd-pointer { left: -9px; top: -9px; width: 18px; height: 18px; }
[data-mode="narrow"].fc-L-phones .cd-pointer.is-down { left: -7.5px; top: -7.5px; width: 15px; height: 15px; }
.fc-L-phones .cd-ring { width: 40px; height: 40px; margin: -20px 0 0 -20px; border: 0; background: rgba(27, 26, 23, .2); }

@media (prefers-reduced-motion: reduce) {
  .fc-later, .fc-later.is-on, .fc-L-phones .fc-dev-c, .fc-live, .fc-live.is-on { transition: none; }
  .fc-live i { animation: none; }
  .fc-L-phones .cd-pointer { transition: opacity .3s; }
}