@charset "utf-8";
/* Football: a striped pitch with its lines, a scoreboard for the big moments, a ball
   bouncing by. */
:root[data-theme="football"] {
  --bg: #2f8a3a; --panel: #ffffff; --ink: #151515; --muted: #5b5b5b; --line: #dcdcdc;
  --accent: #0b3d91; --accent-ink: #ffffff; --mover: #eef7ee; --die: #ffffff; --die-edge: #151515;
  --pip: #151515; --held: #ffd400; --field: #ffffff; --good: #1b7f2a; --bad: #c62828;
  --title: #ffffff; --title-font: "Bebas Neue", Impact, sans-serif; --name-font: "Bebas Neue", Impact, sans-serif;
  --page-ink: #ffffff; --page-muted: #d6f0d8; --radius: 10px; --mark: "⚽";
  --pattern:
    linear-gradient(90deg, transparent calc(50% - 2px), rgba(255, 255, 255, .4) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)),
    radial-gradient(circle at 50% 50vh, transparent 118px, rgba(255, 255, 255, .4) 119px 123px, transparent 124px),
    repeating-linear-gradient(90deg, #2f8a3a 0 80px, #2a7d34 80px 160px);
}
[data-theme="football"] h1 { font-size: 56px; letter-spacing: 3px; font-weight: 400; text-shadow: 0 3px 0 #1d5e26; }
[data-theme="football"] .tray-head .name { font-size: 22px; letter-spacing: 1px; font-weight: 400; }
[data-theme="football"] .tray-head .total { font-size: 32px; font-weight: 400; }
[data-theme="football"] .sheet thead th { font-size: 17px; letter-spacing: 1px; font-weight: 400; }
[data-theme="football"] .sheet tr.total th, [data-theme="football"] .sheet tr.total td { font-size: 22px; font-weight: 400; }
[data-theme="football"] .tray.mover { border-width: 2px; }
[data-theme="football"] .die.held { box-shadow: 0 0 0 4px var(--held); }
[data-theme="football"] .die.fresh { animation: ball-bounce .55s cubic-bezier(.3, .7, .4, 1.4); }
@keyframes ball-bounce { 0% { transform: translateY(-26px) rotate(-180deg); } 60% { transform: translateY(0) rotate(0); } 80% { transform: translateY(-6px); } 100% { transform: none; } }
[data-theme="football"] .ambient .a1 { display: block; bottom: 12px; left: -50px; font-size: 32px; animation: ball-roll 18s linear infinite 3s; }
[data-theme="football"] .ambient .a1::before { content: "⚽"; display: inline-block; animation: ball-hop .8s ease-in-out infinite, spin 1.2s linear infinite; }
@keyframes ball-roll { 0% { transform: translateX(0); } 28%, 100% { transform: translateX(calc(100vw + 100px)); } }
@keyframes ball-hop { 50% { transform: translateY(-40px); } }
@keyframes spin { to { rotate: 360deg; } }
[data-theme="football"] .ambient .a2 { display: block; left: 1%; bottom: 0; font-size: 46px; transform-origin: bottom left; animation: corner-flag 3s ease-in-out infinite; }
[data-theme="football"] .ambient .a2::before { content: "🚩"; }
@keyframes corner-flag { 50% { transform: rotate(-6deg); } }