/* GENERATED by tools/port_web_templates.py from the website's landing.css. Do not edit:
   change the script, or the website, and run it again. */
:root {
  
  --bg: #0b0b0d;
  --panel: #141418;
  --raised: #1c1c22;
  --border: rgba(255, 255, 255, 0.07);
  --border-strong: rgba(255, 255, 255, 0.16);
  --highlight: rgba(255, 255, 255, 0.05);   
  --nav-bg: rgba(11, 11, 13, 0.78);

  
  --text: #f4f4f5;
  --text-2: #a1a1aa;
  --text-muted: #8b8b95;

  
  --accent: #cc0000;
  --accent-hover: #a30000;
  --accent-text: #ff6b64;
  --on-accent: #ffffff;

  
  --win: #4ade80;
  --win-bg: rgba(74, 222, 128, 0.12);
  --loss: #f87171;
  --loss-bg: rgba(248, 113, 113, 0.12);
  --open: #d4a73a;
  --open-bg: rgba(212, 167, 58, 0.12);

  
  --edge: #8fb3cc;
  --edge-bg: rgba(143, 179, 204, 0.12);

  
  --seg-lead: #d4d4d8;
  --seg-lead-text: #18181b;
  --seg-1: #52525b;
  --seg-2: #3f3f46;

  
  --side-home: #a1a1aa;
  --side-away: #52525b;

  
  --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --text-xs: 0.75rem;     
  --text-sm: 0.875rem;    
  --text-md: 1rem;        
  --text-lg: 1.375rem;    
  --text-xl: 2rem;        
  --weight: 400;
  --weight-strong: 600;

  
  --s1: 0.25rem;
  --s2: 0.5rem;
  --s3: 0.75rem;
  --s4: 1rem;
  --s5: 1.5rem;
  --s6: 2rem;
  --s7: 3rem;
  --s8: 4rem;

  --radius: 12px;
  --radius-sm: 8px;
  --radius-pill: 999px;
  --page: 1100px;
  --topbar-h: 56px;
  --tabbar-h: 60px;
}

.icon { flex: 0 0 auto; vertical-align: middle;
}

.page-footnote {
  margin-top: var(--s6);
  padding-top: var(--s4);
  border-top: 1px solid var(--border);
  font-size: var(--text-xs);
  line-height: 1.6;
  color: var(--text-muted);
}

.page-footnote a { color: var(--accent-text);
}

@media (max-width: 800px) {
  .topbar-cta .icon { display: none; }
}

.chip {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--s2);
  border-radius: var(--radius-pill);
  background: var(--raised);
  border: 1px solid var(--border);
  color: var(--text-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-strong);
  line-height: 1.5;
}

.chip--quiet { color: var(--text-muted);
}

.chip--edge { background: var(--edge-bg); border-color: transparent; color: var(--edge);
}

.fixture-card,
.filter-bar,
.tile,
.proj-item {
  background: var(--panel);
  border: 1px solid var(--border);
  border-top-color: var(--border-strong);
  border-radius: var(--radius);
}

.empty-state-label { display: block; color: var(--text); font-weight: var(--weight-strong); margin-bottom: var(--s2);
}

.model-label {
  display: block;
  margin: 0 0 var(--s2);
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: var(--weight-strong);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.rbar { display: flex; flex-direction: column; gap: var(--s2);
}

.rbar-track { display: flex; gap: 2px; height: 28px; border-radius: var(--radius-sm); overflow: hidden;
}

.rbar-seg {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--seg-1);
  color: var(--text);
  font-size: var(--text-xs);
  font-weight: var(--weight-strong);
}

.rbar-seg:nth-child(2) { background: var(--seg-2);
}

.rbar-seg.is-lead { background: var(--seg-lead); color: var(--seg-lead-text);
}

.rbar-legend { display: grid; grid-template-columns: 1fr auto 1fr; gap: var(--s2); font-size: var(--text-xs); color: var(--text-2); line-height: 1.35;
}

.rbar-item { min-width: 0; overflow-wrap: anywhere;
}

.rbar-item--draw { text-align: center;
}

.rbar-item--away { text-align: right;
}

.rbar-item b { color: var(--text); font-weight: var(--weight-strong); white-space: nowrap;
}

.rbar-item.is-lead b { color: var(--text);
}

.tile {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--s1);
  padding: var(--s3) var(--s3) var(--s5);
  overflow: hidden;
  min-width: 0;
}

.tile-pct { font-size: var(--text-xl); font-weight: var(--weight-strong); line-height: 1.1; color: var(--text);
}

.tile-label { font-size: var(--text-sm); color: var(--text-2); line-height: 1.35; overflow-wrap: anywhere;
}

.tile-meta { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s1); margin-top: var(--s2);
}

@media (max-width: 480px) {
  .fx-body,
.match-model { padding-left: var(--s3); padding-right: var(--s3); }
}

.tile .chip { white-space: nowrap; padding: 2px 6px;
}

.meta .chip { margin: var(--s2) 0;
}

.tile-league { font-size: var(--text-xs); color: var(--text-muted);
}

.tile-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--raised);
}

.tile-bar > span { display: block; height: 100%; background: var(--text-muted);
}

.tile--edge .tile-bar > span { background: var(--edge);
}

.proj { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s3);
}

.proj-item { display: flex; flex-direction: column; gap: var(--s1); padding: var(--s3) var(--s4); background: var(--raised);
}

.proj-label { font-size: var(--text-xs); color: var(--text-muted); font-weight: var(--weight-strong); text-transform: uppercase; letter-spacing: 0.06em;
}

.proj-value { font-size: var(--text-lg); font-weight: var(--weight-strong);
}

.tile-price,
.market-price { display: block; color: var(--text-muted); font-size: var(--text-xs); margin: var(--s2) 0 0;
}

.tile-group { margin-top: var(--s4);
}

.tile-group:first-child { margin-top: 0;
}

.tile-group-title { margin: 0 0 var(--s2); font-size: var(--text-xs); color: var(--text-muted); font-weight: var(--weight-strong); text-transform: uppercase; letter-spacing: 0.06em;
}

.updated { display: inline-flex; align-items: center; gap: var(--s2); margin: 0 0 var(--s3); padding: var(--s1) var(--s3); border: 1px solid var(--border); border-radius: 999px; color: var(--text-2); font-size: var(--text-xs); font-weight: var(--weight-strong);
}

.updated svg { color: var(--text-muted);
}

.day-heading {
  position: sticky;
  top: var(--topbar-h);
  z-index: 5;
  font-size: var(--text-sm);
  font-weight: var(--weight-strong);
  color: var(--text);
  margin: var(--s5) 0 var(--s3);
  padding: var(--s2) 0;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}

.league-heading {
  margin: var(--s4) 0 var(--s2);
  font-size: var(--text-xs);
  font-weight: var(--weight-strong);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.filter-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: end;
  gap: var(--s3);
  padding: var(--s4);
  margin: var(--s4) 0;
}

.filter-bar[hidden] { display: none;
}

.filter-field { display: flex; flex-direction: column; gap: var(--s1); min-width: 0;
}

.filter-field--wide { grid-column: span 3;
}

.filter-field label { color: var(--text-muted); font-size: var(--text-xs); font-weight: var(--weight-strong); text-transform: uppercase; letter-spacing: 0.06em;
}

.filter-field select,
.filter-field input {
  font-family: var(--font);
  font-size: var(--text-sm);
  color: var(--text);
  background: var(--bg);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: var(--s2) var(--s3);
  width: 100%;
  min-width: 0;
}

.filter-clear {
  font-family: var(--font);
  font-size: var(--text-sm);
  color: var(--text-2);
  background: none;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: var(--s2) var(--s4);
  cursor: pointer;
}

.filter-clear:hover { color: var(--text);
}

.filter-note { grid-column: 1 / -1; margin: 0; color: var(--text-muted); font-size: var(--text-xs);
}

.filter-count { color: var(--text-muted); font-size: var(--text-xs); margin: 0 0 var(--s2);
}

.filter-empty { color: var(--text-2); padding: var(--s5) 0;
}

@media (max-width: 720px) {
  .filter-bar { grid-template-columns: 1fr 1fr; }
  .filter-field--wide { grid-column: 1 / -1; }
}

.fixture-card { margin-bottom: var(--s3);
}

.fx > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: var(--s3);
  padding: var(--s4);
  position: relative;
}

.fx > summary::-webkit-details-marker { display: none;
}

.fx-top { display: flex; align-items: center; gap: var(--s2); color: var(--text-2); font-size: var(--text-xs); padding-right: var(--s6);
}

.fx-time { color: var(--text); font-weight: var(--weight-strong); font-size: var(--text-sm);
}

.fx-tz { color: var(--text-muted); font-weight: var(--weight);
}

.fx-league { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.fx-teams { font-size: var(--text-md); font-weight: var(--weight-strong); line-height: 1.35; overflow-wrap: anywhere;
}

.fx-teams .v { color: var(--text-muted); font-weight: var(--weight); padding: 0 var(--s1);
}

.fx-chevron { position: absolute; top: var(--s4); right: var(--s4); color: var(--text-muted); transition: transform 0.15s;
}

.fx[open] .fx-chevron { transform: rotate(180deg);
}

.fx-body { padding: 0 var(--s4) var(--s4); display: flex; flex-direction: column; gap: var(--s4); border-top: 1px solid var(--border); padding-top: var(--s4);
}

.fx-link { align-self: flex-start; font-size: var(--text-sm); font-weight: var(--weight-strong); text-decoration: none;
}

.fx-link:hover { text-decoration: underline;
}

.fx-odds { font-size: var(--text-sm); color: var(--text-2);
}

.fx-odds summary { cursor: pointer;
}

.fx-odds ul { margin: var(--s2) 0 0; padding-left: var(--s4);
}

.fx-odds li span { color: var(--text);
}

.fixture-note { color: var(--text-2); font-size: var(--text-sm); margin: 0; padding-left: var(--s3); border-left: 2px solid var(--border-strong);
}

.fixture-head { display: flex; flex-direction: column; gap: var(--s1); padding: var(--s4);
}

.fixture-teams { font-weight: var(--weight-strong); font-size: var(--text-md); line-height: 1.35; overflow-wrap: anywhere;
}

.fixture-teams .v { color: var(--text-muted); font-weight: var(--weight); padding: 0 var(--s1);
}

.fixture-sub { display: block; color: var(--text-2); font-size: var(--text-xs);
}

.crest { display: inline-block; vertical-align: -0.35em;
}

img.crest { border-radius: 50%; object-fit: cover;
}

.crest.shirt { border-radius: 0;
}

.market-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--s3); margin: 0 var(--s4) var(--s3);
}

.market-grid:empty { display: none;
}

.market-grid .market { margin: 0;
}

.market-name { display: block; color: var(--text-muted); font-size: var(--text-xs); font-weight: var(--weight-strong); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: var(--s2);
}

.market-lines { list-style: none; margin: 0; padding: 0;
}

.market-lines li { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3); font-size: var(--text-sm); padding: var(--s1) 0;
}

.market-lines li span:first-child { color: var(--text-2); min-width: 0; overflow-wrap: anywhere;
}

.market-lines i { color: var(--text-muted); font-style: normal; font-size: var(--text-xs); margin-left: var(--s1);
}

.stat-value { display: inline-flex; align-items: baseline; gap: var(--s1); flex-shrink: 0; white-space: nowrap;
}

.stat-none { color: var(--text-muted); font-weight: var(--weight); font-style: italic; font-size: var(--text-xs);
}

.stat-badge { display: inline-block; padding: 0 var(--s2); border-radius: var(--radius-sm); font-weight: var(--weight-strong); background: var(--raised); color: var(--text);
}

.stat-badge--high { background: var(--seg-1); color: var(--text);
}

.stat-badge--mid { background: var(--raised); color: var(--text);
}

.stat-badge--low { background: var(--raised); color: var(--text-2);
}

.match-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: var(--s4);
}

.match-tabs {
  position: sticky;
  top: var(--topbar-h);
  z-index: 5;
  display: flex;
  gap: var(--s2);
  overflow-x: auto;
  background: var(--bg);
  padding: var(--s3) 0;
  margin: var(--s3) 0 var(--s2);
  border-bottom: 1px solid var(--border);
}

.match-tabs a {
  flex: 0 0 auto;
  padding: var(--s1) var(--s4);
  border-radius: var(--radius-pill);
  border: 1px solid var(--border-strong);
  color: var(--text-2);
  font-size: var(--text-sm);
  font-weight: var(--weight-strong);
  text-decoration: none;
  white-space: nowrap;
}

.match-tabs a:hover,
.match-tabs a:focus-visible { color: var(--text); background: var(--highlight);
}

.match-model { padding: var(--s4); display: flex; flex-direction: column; gap: var(--s4);
}

.match-model .fixture-note { margin: 0;
}

.overview-bars { display: flex; flex-direction: column; gap: var(--s3); margin-top: var(--s3);
}

.overview-row { display: grid; grid-template-columns: 2.75rem 1fr 2.75rem; align-items: center; gap: var(--s2);
}

.overview-value { font-size: var(--text-sm); font-weight: var(--weight-strong);
}

.overview-value-home { text-align: right;
}

.overview-track { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--raised);
}

.overview-half { flex: 1 1 50%; display: flex; height: 100%;
}

.overview-half-home { justify-content: flex-end;
}

.overview-bar { height: 100%; min-width: 2px;
}

.overview-bar-home { background: var(--side-home);
}

.overview-bar-away { background: var(--side-away);
}

.overview-label { grid-column: 1 / -1; order: -1; color: var(--text-muted); font-size: var(--text-xs); font-weight: var(--weight-strong); text-transform: uppercase; letter-spacing: 0.06em;
}

.overview-legend { display: flex; gap: var(--s4); margin-top: var(--s3); font-size: var(--text-xs); color: var(--text-2);
}

.overview-legend span { display: inline-flex; align-items: center; gap: var(--s2);
}

.overview-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px;
}

.dot-home { background: var(--side-home);
}

.dot-away { background: var(--side-away);
}

.h2h-split { display: flex; gap: 2px; height: 28px; border-radius: var(--radius-sm); overflow: hidden; margin: var(--s3) 0;
}

.h2h-split-seg { display: flex; align-items: center; justify-content: center; font-size: var(--text-xs); font-weight: var(--weight-strong); min-width: 0; overflow: hidden; white-space: nowrap; color: var(--text);
}

.h2h-split-home { background: var(--seg-1);
}

.h2h-split-draw { background: var(--seg-2);
}

.h2h-split-away { background: var(--seg-1);
}

.h2h-legend { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s2) var(--s4); margin-bottom: var(--s3);
}

.h2h-legend-item { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); font-size: var(--text-sm); color: var(--text-2);
}

.h2h-legend-item b { color: var(--text);
}

.h2h-legend-item:nth-child(2) { justify-content: center;
}

.h2h-legend-item:nth-child(3) { justify-content: flex-end;
}

.h2h-meeting-outcome { margin-right: var(--s2);
}

@media (max-width: 600px) {
  .h2h-legend { grid-template-columns: 1fr; }
  .h2h-legend-item:nth-child(n) { justify-content: flex-start; }
}

.form-w,
.form-d,
.form-l,
.form-x {
  display: inline-block;
  width: 1.25rem;
  text-align: center;
  border-radius: 4px;
  font-size: var(--text-xs);
  font-weight: var(--weight-strong);
  margin-right: var(--s2);
}

.form-w { background: var(--win-bg); color: var(--win);
}

.form-d { background: var(--raised); color: var(--text-2);
}

.form-l { background: var(--loss-bg); color: var(--loss);
}

.form-x { background: var(--raised); color: var(--text-muted);
}

.squad-table { width: 100%; border-collapse: collapse; margin-top: var(--s3); font-size: var(--text-sm); background: transparent;
}

.squad-table th { text-align: right; color: var(--text-muted); font-size: var(--text-xs); font-weight: var(--weight-strong); text-transform: uppercase; letter-spacing: 0.06em; padding: var(--s1) var(--s2); border-bottom: 1px solid var(--border); background: transparent;
}

.squad-table th:first-child,
.squad-table td:first-child { text-align: left;
}

.squad-table td { text-align: right; padding: var(--s1) var(--s2); border-bottom: 1px solid var(--border); font-size: var(--text-sm);
}

.squad-pos { color: var(--text-muted); font-size: var(--text-xs); margin-left: var(--s2);
}

/* Added by the app, not the website: CSP style-src 'self' refuses a style
   attribute, so the widths and colours the website sets inline are classes. */
.overview-intro { margin-top: 0; }
.fixture-stale, .fixture-note.stale { color: var(--open); }
.w-0 { width: 0%; }
.w-1 { width: 1%; }
.w-2 { width: 2%; }
.w-3 { width: 3%; }
.w-4 { width: 4%; }
.w-5 { width: 5%; }
.w-6 { width: 6%; }
.w-7 { width: 7%; }
.w-8 { width: 8%; }
.w-9 { width: 9%; }
.w-10 { width: 10%; }
.w-11 { width: 11%; }
.w-12 { width: 12%; }
.w-13 { width: 13%; }
.w-14 { width: 14%; }
.w-15 { width: 15%; }
.w-16 { width: 16%; }
.w-17 { width: 17%; }
.w-18 { width: 18%; }
.w-19 { width: 19%; }
.w-20 { width: 20%; }
.w-21 { width: 21%; }
.w-22 { width: 22%; }
.w-23 { width: 23%; }
.w-24 { width: 24%; }
.w-25 { width: 25%; }
.w-26 { width: 26%; }
.w-27 { width: 27%; }
.w-28 { width: 28%; }
.w-29 { width: 29%; }
.w-30 { width: 30%; }
.w-31 { width: 31%; }
.w-32 { width: 32%; }
.w-33 { width: 33%; }
.w-34 { width: 34%; }
.w-35 { width: 35%; }
.w-36 { width: 36%; }
.w-37 { width: 37%; }
.w-38 { width: 38%; }
.w-39 { width: 39%; }
.w-40 { width: 40%; }
.w-41 { width: 41%; }
.w-42 { width: 42%; }
.w-43 { width: 43%; }
.w-44 { width: 44%; }
.w-45 { width: 45%; }
.w-46 { width: 46%; }
.w-47 { width: 47%; }
.w-48 { width: 48%; }
.w-49 { width: 49%; }
.w-50 { width: 50%; }
.w-51 { width: 51%; }
.w-52 { width: 52%; }
.w-53 { width: 53%; }
.w-54 { width: 54%; }
.w-55 { width: 55%; }
.w-56 { width: 56%; }
.w-57 { width: 57%; }
.w-58 { width: 58%; }
.w-59 { width: 59%; }
.w-60 { width: 60%; }
.w-61 { width: 61%; }
.w-62 { width: 62%; }
.w-63 { width: 63%; }
.w-64 { width: 64%; }
.w-65 { width: 65%; }
.w-66 { width: 66%; }
.w-67 { width: 67%; }
.w-68 { width: 68%; }
.w-69 { width: 69%; }
.w-70 { width: 70%; }
.w-71 { width: 71%; }
.w-72 { width: 72%; }
.w-73 { width: 73%; }
.w-74 { width: 74%; }
.w-75 { width: 75%; }
.w-76 { width: 76%; }
.w-77 { width: 77%; }
.w-78 { width: 78%; }
.w-79 { width: 79%; }
.w-80 { width: 80%; }
.w-81 { width: 81%; }
.w-82 { width: 82%; }
.w-83 { width: 83%; }
.w-84 { width: 84%; }
.w-85 { width: 85%; }
.w-86 { width: 86%; }
.w-87 { width: 87%; }
.w-88 { width: 88%; }
.w-89 { width: 89%; }
.w-90 { width: 90%; }
.w-91 { width: 91%; }
.w-92 { width: 92%; }
.w-93 { width: 93%; }
.w-94 { width: 94%; }
.w-95 { width: 95%; }
.w-96 { width: 96%; }
.w-97 { width: 97%; }
.w-98 { width: 98%; }
.w-99 { width: 99%; }
.w-100 { width: 100%; }
.fl-0 { flex: 0 1 0; }
.fl-1 { flex: 1 1 0; }
.fl-2 { flex: 2 1 0; }
.fl-3 { flex: 3 1 0; }
.fl-4 { flex: 4 1 0; }
.fl-5 { flex: 5 1 0; }
.fl-6 { flex: 6 1 0; }
.fl-7 { flex: 7 1 0; }
.fl-8 { flex: 8 1 0; }
.fl-9 { flex: 9 1 0; }
.fl-10 { flex: 10 1 0; }
.fl-11 { flex: 11 1 0; }
.fl-12 { flex: 12 1 0; }
.fl-13 { flex: 13 1 0; }
.fl-14 { flex: 14 1 0; }
.fl-15 { flex: 15 1 0; }
.fl-16 { flex: 16 1 0; }
.fl-17 { flex: 17 1 0; }
.fl-18 { flex: 18 1 0; }
.fl-19 { flex: 19 1 0; }
.fl-20 { flex: 20 1 0; }
.fl-21 { flex: 21 1 0; }
.fl-22 { flex: 22 1 0; }
.fl-23 { flex: 23 1 0; }
.fl-24 { flex: 24 1 0; }
.fl-25 { flex: 25 1 0; }
.fl-26 { flex: 26 1 0; }
.fl-27 { flex: 27 1 0; }
.fl-28 { flex: 28 1 0; }
.fl-29 { flex: 29 1 0; }
.fl-30 { flex: 30 1 0; }
.fl-31 { flex: 31 1 0; }
.fl-32 { flex: 32 1 0; }
.fl-33 { flex: 33 1 0; }
.fl-34 { flex: 34 1 0; }
.fl-35 { flex: 35 1 0; }
.fl-36 { flex: 36 1 0; }
.fl-37 { flex: 37 1 0; }
.fl-38 { flex: 38 1 0; }
.fl-39 { flex: 39 1 0; }
.fl-40 { flex: 40 1 0; }
.fl-41 { flex: 41 1 0; }
.fl-42 { flex: 42 1 0; }
.fl-43 { flex: 43 1 0; }
.fl-44 { flex: 44 1 0; }
.fl-45 { flex: 45 1 0; }
.fl-46 { flex: 46 1 0; }
.fl-47 { flex: 47 1 0; }
.fl-48 { flex: 48 1 0; }
.fl-49 { flex: 49 1 0; }
.fl-50 { flex: 50 1 0; }
.fl-51 { flex: 51 1 0; }
.fl-52 { flex: 52 1 0; }
.fl-53 { flex: 53 1 0; }
.fl-54 { flex: 54 1 0; }
.fl-55 { flex: 55 1 0; }
.fl-56 { flex: 56 1 0; }
.fl-57 { flex: 57 1 0; }
.fl-58 { flex: 58 1 0; }
.fl-59 { flex: 59 1 0; }
.fl-60 { flex: 60 1 0; }
.fl-61 { flex: 61 1 0; }
.fl-62 { flex: 62 1 0; }
.fl-63 { flex: 63 1 0; }
.fl-64 { flex: 64 1 0; }
.fl-65 { flex: 65 1 0; }
.fl-66 { flex: 66 1 0; }
.fl-67 { flex: 67 1 0; }
.fl-68 { flex: 68 1 0; }
.fl-69 { flex: 69 1 0; }
.fl-70 { flex: 70 1 0; }
.fl-71 { flex: 71 1 0; }
.fl-72 { flex: 72 1 0; }
.fl-73 { flex: 73 1 0; }
.fl-74 { flex: 74 1 0; }
.fl-75 { flex: 75 1 0; }
.fl-76 { flex: 76 1 0; }
.fl-77 { flex: 77 1 0; }
.fl-78 { flex: 78 1 0; }
.fl-79 { flex: 79 1 0; }
.fl-80 { flex: 80 1 0; }
.fl-81 { flex: 81 1 0; }
.fl-82 { flex: 82 1 0; }
.fl-83 { flex: 83 1 0; }
.fl-84 { flex: 84 1 0; }
.fl-85 { flex: 85 1 0; }
.fl-86 { flex: 86 1 0; }
.fl-87 { flex: 87 1 0; }
.fl-88 { flex: 88 1 0; }
.fl-89 { flex: 89 1 0; }
.fl-90 { flex: 90 1 0; }
.fl-91 { flex: 91 1 0; }
.fl-92 { flex: 92 1 0; }
.fl-93 { flex: 93 1 0; }
.fl-94 { flex: 94 1 0; }
.fl-95 { flex: 95 1 0; }
.fl-96 { flex: 96 1 0; }
.fl-97 { flex: 97 1 0; }
.fl-98 { flex: 98 1 0; }
.fl-99 { flex: 99 1 0; }
.fl-100 { flex: 100 1 0; }