.asp-preview-page{padding:18px 0 40px}.asp-private-banner{display:flex;gap:14px;align-items:center;padding:10px 14px;margin-bottom:12px;border:1px solid #d79a00;background:#fff7dc;font-size:13px}.asp-private-banner strong{color:#8a5600}.asp-modebar{display:flex;gap:8px;margin:0 0 12px}.asp-mode{border:1px solid #0c5c9e;background:#fff;color:#0c5c9e;padding:9px 14px;font-weight:700;cursor:pointer}.asp-mode.is-active{background:#0c5c9e;color:#fff}.asp-shell{border:1px solid #b9cfe0;background:#edf6fd;box-shadow:0 6px 18px rgba(4,49,84,.08);overflow:hidden}.asp-hero-strip{min-height:150px;padding:24px 28px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:22px;background:linear-gradient(115deg,#073f72 0%,#0b67a8 52%,#dfeefa 100%);color:#fff}.asp-route-copy h1{font-size:38px;line-height:1;margin:8px 0}.asp-route-copy p{margin:0;font-weight:700;letter-spacing:.04em}.asp-live-pill,.asp-video-live{display:inline-block;background:#e43c31;color:#fff;padding:5px 9px;border-radius:4px;font-size:12px;font-weight:800}.asp-route-line{display:flex;align-items:center;gap:8px;color:#073f72;font-weight:800}.asp-route-line i{height:3px;background:#f28b22;flex:1}.asp-route-line b{width:12px;height:12px;border-radius:50%;background:#f28b22}.asp-clock-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px;background:#fff}.asp-clock-card{border:1px solid #bdd4e6;padding:12px 14px;text-align:center}.asp-clock-card span,.asp-clock-card small{display:block;color:#526a7c}.asp-clock-card strong{display:block;font-size:24px;color:#073f72;margin:4px 0}.asp-clock-card--accent{border-color:#f28b22;background:#fff7ee}.asp-primary-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:12px;padding:0 12px 12px}.asp-panel{background:#fff;border:1px solid #9ebfd7;box-shadow:0 2px 8px rgba(3,43,74,.08)}.asp-panel>header{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#073f72;color:#fff;padding:12px 14px}.asp-panel h2{margin:2px 0 0;font-size:20px;color:inherit}.asp-kicker{font-size:11px;font-weight:800;color:#ffd38d}.asp-update-dot{font-size:11px;display:flex;align-items:center;gap:6px}.asp-update-dot i{width:8px;height:8px;border-radius:50%;background:#36d26f}.asp-runner{display:grid;grid-template-columns:34px minmax(170px,1.2fr) 70px 86px minmax(85px,.8fr) 90px;gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid #e4edf4}.asp-rank{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e8eff5;color:#073f72;font-weight:800}.asp-runner-main strong,.asp-runner-main span,.asp-distance small{display:block}.asp-runner-main span,.asp-runner-cp,.asp-runner-time,.asp-distance small{font-size:12px;color:#62788a}.asp-progress{height:7px;background:#e8edf1;border-radius:999px;overflow:hidden}.asp-progress i{display:block;height:100%;background:#0b79cf}.asp-distance{font-weight:800;color:#073f72;text-align:right}.asp-leaderboard footer{padding:10px 12px;text-align:center}.asp-leaderboard footer a{display:inline-block;background:#0c5c9e;color:#fff;padding:8px 12px;text-decoration:none;font-weight:700}.asp-video-panel header{justify-content:flex-start}.asp-video-stage{aspect-ratio:16/9;background:linear-gradient(145deg,#071c2d,#174f77);display:grid;place-items:center}.asp-video-stage iframe{width:100%;height:100%;border:0}.asp-video-placeholder{text-align:center;color:#fff}.asp-play{display:grid;place-items:center;margin:0 auto 10px;width:54px;height:54px;border:2px solid #fff;border-radius:50%;font-size:20px}.asp-video-placeholder strong,.asp-video-placeholder small{display:block}.asp-video-tools{padding:10px 12px}.asp-video-tools label,.asp-video-tools small{display:block}.asp-video-tools>div{display:flex;gap:6px;margin:6px 0}.asp-video-tools input{min-width:0;flex:1;padding:7px}.asp-video-tools button{border:0;background:#0c5c9e;color:#fff;padding:7px 11px;font-weight:700}.asp-facts{display:grid;grid-template-columns:repeat(4,1fr);background:#073f72;color:#fff}.asp-facts div{padding:14px 16px;border-right:1px solid rgba(255,255,255,.18)}.asp-facts strong,.asp-facts span{display:block}.asp-facts strong{font-size:18px}.asp-facts span{font-size:12px;color:#cbe1f3}.asp-existing-ads{margin:16px 0}.asp-details{margin:18px 0;padding:18px;border:1px solid #c9dce9;background:#f7fbfe}.asp-section-heading span{font-size:12px;font-weight:800;color:#f28b22}.asp-section-heading h2{margin:4px 0 14px;color:#073f72}.asp-detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.asp-detail-grid article{background:#fff;border-left:4px solid #0c5c9e;padding:13px}.asp-detail-grid article strong{color:#073f72}.asp-detail-grid p{margin:6px 0 0}.asp-news-continuation{margin-top:22px}.asp-debug{margin-top:24px;border:1px dashed #6f8595;background:#f4f6f8}.asp-debug summary{cursor:pointer;padding:10px 12px;font-weight:800;color:#243847}.asp-debug-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 12px 12px}.asp-debug section{min-width:0}.asp-debug pre{max-height:300px;overflow:auto;white-space:pre-wrap;word-break:break-word;background:#101820;color:#dbe8ef;padding:10px;font-size:11px}.asp-mode-finish .asp-primary-grid,.asp-mode-events .asp-primary-grid{grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr)}.asp-mode-finish #asp-video-panel,.asp-mode-events #asp-video-panel{order:-1}.asp-mode-finish #asp-board-title{font-size:0}.asp-mode-finish #asp-board-title:after{content:'Πρώτοι τερματίσαντες';font-size:20px}.asp-mode-events #asp-board-title{font-size:0}.asp-mode-events #asp-board-title:after{content:'Αποτελέσματα αγώνα';font-size:20px}@media(max-width:900px){.asp-hero-strip{grid-template-columns:1fr}.asp-primary-grid,.asp-mode-finish .asp-primary-grid,.asp-mode-events .asp-primary-grid{grid-template-columns:1fr}.asp-clock-grid{grid-template-columns:1fr}.asp-facts{grid-template-columns:1fr 1fr}.asp-runner{grid-template-columns:30px 1fr 60px 74px}.asp-progress,.asp-distance{grid-column:2/5}.asp-distance{text-align:left}.asp-detail-grid,.asp-debug-grid{grid-template-columns:1fr}}@media(max-width:560px){.asp-hero-strip{padding:18px}.asp-route-copy h1{font-size:28px}.asp-modebar{overflow:auto}.asp-facts{grid-template-columns:1fr}.asp-runner{grid-template-columns:28px 1fr 56px}.asp-runner-time{grid-column:2}.asp-progress,.asp-distance{grid-column:2/4}}

/* 0.6.0: authoritative live ranking + athlete photos + official supplied logo */
.asp-brand-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.asp-spartathlon-logo{display:block;max-width:330px;width:100%;height:auto;background:#fff;padding:7px 10px;border-radius:4px;box-sizing:border-box}.asp-runner{grid-template-columns:30px 58px minmax(0,1fr) 68px 82px minmax(70px,120px) 78px;align-items:center}.asp-runner-photo{width:50px;height:58px;border-radius:3px;overflow:hidden;background:#e8eff5;display:grid;place-items:center;font-weight:800;color:#073f72}.asp-runner-photo img{width:100%;height:100%;object-fit:cover;display:block}.asp-runner-photo--empty{font-size:15px}.asp-runner-main{min-width:0}.asp-runner-main strong{white-space:normal}.asp-distance{min-width:0}@media(max-width:900px){.asp-spartathlon-logo{max-width:280px}.asp-runner{grid-template-columns:28px 52px minmax(0,1fr) 58px 72px}.asp-progress{grid-column:3/6}.asp-distance{grid-column:3/6;text-align:left}.asp-runner-photo{width:46px;height:54px}}@media(max-width:560px){.asp-spartathlon-logo{max-width:240px}.asp-runner{grid-template-columns:26px 46px minmax(0,1fr) 54px}.asp-runner-time{grid-column:3}.asp-progress,.asp-distance{grid-column:3/5}.asp-runner-photo{width:42px;height:50px}}


/* 0.8.0: stable larger photos, single-line names, compact timing */
.asp-runner{
  grid-template-columns:28px 72px minmax(0,1fr) 88px;
  gap:8px;
  min-height:88px;
  padding:7px 10px;
  align-items:center;
}
.asp-runner-photo{
  width:68px;
  height:78px;
  border-radius:4px;
  overflow:hidden;
  background:#e7eef4;
  display:grid;
  place-items:center;
  flex:none;
}
.asp-runner-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}
.asp-photo-placeholder{font-size:15px;font-weight:800;color:#7b91a2}
.asp-runner-main{min-width:0;align-self:center}
.asp-runner-name{
  display:block;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
  font-size:14px;
  line-height:1.2;
  font-weight:800;
  color:#111;
}
.asp-runner-name--lg{font-size:12.5px;letter-spacing:-.01em}
.asp-runner-name--xl{font-size:11px;letter-spacing:-.02em}
.asp-runner-meta{display:block;margin-top:4px;font-size:11px;color:#62788a;white-space:nowrap}
.asp-runner-main .asp-progress{margin-top:8px;width:100%;height:7px}
.asp-runner-timing{text-align:right;white-space:nowrap;align-self:center}
.asp-runner-timing .asp-runner-cp{display:block;font-size:12px;color:#0c5c9e;font-weight:800}
.asp-runner-timing .asp-runner-time{display:block;margin-top:5px;font-size:11px;color:#62788a}
.asp-runner>.asp-progress,.asp-runner>.asp-distance{display:none!important}
@media(max-width:900px){
  .asp-runner{grid-template-columns:28px 66px minmax(0,1fr) 82px;min-height:82px}
  .asp-runner-photo{width:62px;height:72px}
  .asp-runner-name{font-size:13.5px}
  .asp-runner-name--lg{font-size:12px}.asp-runner-name--xl{font-size:10.5px}
}
@media(max-width:560px){
  .asp-runner{grid-template-columns:26px 60px minmax(0,1fr) 72px;gap:6px;padding:7px 7px;min-height:76px}
  .asp-runner-photo{width:56px;height:66px}
  .asp-runner-name{font-size:13px}.asp-runner-name--lg{font-size:11.5px}.asp-runner-name--xl{font-size:10px}
  .asp-runner-meta{font-size:10px}.asp-runner-timing .asp-runner-cp{font-size:11px}.asp-runner-timing .asp-runner-time{font-size:10px}
}

/* 0.9.0: explain each athlete progress bar clearly */
.asp-runner-route{margin-top:7px;width:100%}
.asp-runner-route-labels,.asp-runner-route-captions{display:flex;align-items:center;justify-content:space-between;gap:8px;line-height:1}
.asp-runner-route-labels{margin-bottom:4px;font-size:9px;font-weight:800;letter-spacing:.04em;color:#0c5c9e}
.asp-runner-route-captions{margin-top:3px;font-size:8.5px;color:#8092a0}
.asp-runner-route .asp-progress{margin-top:0;width:100%;height:7px}
@media(max-width:560px){
  .asp-runner-route-labels{font-size:8.5px}.asp-runner-route-captions{font-size:8px}
}


/* 0.10.0: remove redundant LIVE-feed card, show official white logo on blue, remove duplicate loading rows */
.asp-clock-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.asp-spartathlon-logo{
  display:block;
  width:auto;
  height:58px;
  max-width:min(360px,100%);
  object-fit:contain;
  object-position:left center;
  background:transparent!important;
  padding:0!important;
  border-radius:0!important;
}
.asp-brand-row{align-items:center;gap:14px;flex-wrap:nowrap;}
@media(max-width:900px){
  .asp-clock-grid{grid-template-columns:1fr 1fr;}
  .asp-spartathlon-logo{height:50px;max-width:300px;}
}
@media(max-width:560px){
  .asp-clock-grid{grid-template-columns:1fr;}
  .asp-brand-row{flex-wrap:wrap;}
  .asp-spartathlon-logo{height:43px;max-width:255px;}
}


/* 0.11.0: single race view, year beside official logo, native APELA homepage continuation */
.asp-year{display:inline-block;color:#fff;font-size:30px;line-height:1;font-weight:900;letter-spacing:.02em;white-space:nowrap}
.asp-brand-row .asp-live-pill{flex:0 0 auto}
.asp-route-copy>p{margin-top:12px}
.asp-existing-ads{margin-bottom:18px}
@media(max-width:900px){.asp-year{font-size:26px}}
@media(max-width:560px){.asp-brand-row{gap:10px}.asp-year{font-size:23px}.asp-live-pill{font-size:10px;padding:4px 7px}}

/* 0.13.0: wider video, compact leaderboard, editor-driven live information */
.asp-primary-grid{
  grid-template-columns:minmax(0,.86fr) minmax(400px,1fr);
}
.asp-live-note{
  grid-column:1 / -1;
  background:#fff;
  border:1px solid #9ebfd7;
  box-shadow:0 2px 8px rgba(3,43,74,.08);
  overflow:hidden;
}
.asp-live-note>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:11px 14px;
  background:#f4f8fb;
  border-bottom:3px solid #f28b22;
}
.asp-live-note-kicker{
  display:block;
  font-size:11px;
  font-weight:900;
  color:#e26e00;
  letter-spacing:.04em;
}
.asp-live-note h2{
  margin:2px 0 0;
  color:#073f72;
  font-size:19px;
  line-height:1.2;
}
.asp-live-note-time{
  flex:0 0 auto;
  font-size:11px;
  color:#62788a;
  white-space:nowrap;
}
.asp-live-note-body{
  padding:14px 16px;
  font-size:16px;
  line-height:1.55;
  color:#1d2e3b;
  background:#fff;
}
.asp-live-note-body.is-empty{color:#728391;font-style:italic}
.asp-live-note-body>*:first-child{margin-top:0}
.asp-live-note-body>*:last-child{margin-bottom:0}
@media(max-width:900px){
  .asp-primary-grid{grid-template-columns:1fr}
  .asp-live-note{grid-column:auto}
}
@media(max-width:560px){
  .asp-live-note>header{align-items:flex-start;flex-direction:column;gap:5px}
  .asp-live-note h2{font-size:17px}
  .asp-live-note-body{font-size:15px;padding:12px 13px}
}


/* 0.14.0: live text moves under video; admin-managed text/video URL; no public controls */
.asp-video-tools{display:none!important}
.asp-live-note{display:none!important}
.asp-video-panel{display:flex;flex-direction:column}
.asp-live-note-inline{
  border-top:3px solid #f28b22;
  background:#fff;
  min-height:118px;
  padding:14px 16px;
  box-sizing:border-box;
}
.asp-live-note-inline .asp-live-note-body{
  padding:0;
  background:transparent;
  color:#1d2e3b;
  font-size:16px;
  line-height:1.55;
  font-style:normal;
}
.asp-live-note-inline .asp-live-note-body.is-empty{min-height:86px;color:inherit;font-style:normal}
.asp-live-note-inline .asp-live-note-body>*:first-child{margin-top:0}
.asp-live-note-inline .asp-live-note-body>*:last-child{margin-bottom:0}
@media(max-width:560px){
  .asp-live-note-inline{min-height:92px;padding:12px 13px}
  .asp-live-note-inline .asp-live-note-body{font-size:15px}
  .asp-live-note-inline .asp-live-note-body.is-empty{min-height:64px}
}

/* 0.15.0 — exact homepage "Η APELA προτείνει" mirror on the SPARTATHLON page.
   The PHP template is already the same as the homepage. The JS above restores the
   front-page-only main-card duplication/hover behaviour. */
@media (max-width: 767px) {
  .asp-home-recommends-mirror .asp-home-recommends-small-card {
    opacity: 1 !important;
    visibility: visible !important;
  }
}


/* 0.17.0: official country flag beside nationality */
.asp-runner-meta{display:flex;align-items:center;gap:0;min-width:0;overflow:hidden}
.asp-country-wrap{display:inline-flex;align-items:center;min-width:0}
.asp-country-flag{display:none;width:18px;height:12px;object-fit:contain;flex:0 0 auto;margin-right:4px;border-radius:1px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.asp-runner-country{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:560px){.asp-country-flag{width:16px;height:11px;margin-right:3px}}


/* 0.18.0: flag sits to the RIGHT of the country name */
.asp-country-wrap{display:inline-flex;align-items:center;gap:4px;min-width:0;white-space:nowrap}
.asp-country-flag{margin:0!important;order:2}
.asp-runner-country{order:1;display:inline-block!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:560px){.asp-country-wrap{gap:3px}}

/* 0.19.0: official LIVE results link spans the full white footer width with a lower profile */
.asp-leaderboard footer{
  padding:6px 0 0;
}
.asp-leaderboard footer a{
  display:block;
  width:100%;
  box-sizing:border-box;
  padding:6px 10px;
  line-height:1.15;
  font-size:13px;
  text-align:center;
  border-radius:0;
}
@media(max-width:560px){
  .asp-leaderboard footer a{padding:6px 8px;font-size:12.5px}
}


/* 0.20.0: align country flag with country label and add breathing room */
.asp-country-wrap{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0;
  white-space:nowrap;
  vertical-align:middle;
  line-height:1.25;
}
.asp-runner-country{
  order:1;
  display:inline-block!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  line-height:1.25;
}
.asp-country-flag{
  order:2;
  display:block;
  width:20px;
  height:14px;
  object-fit:contain;
  flex:0 0 auto;
  margin:0!important;
  align-self:center;
  vertical-align:middle;
  border-radius:1px;
}
@media(max-width:560px){
  .asp-country-wrap{gap:6px!important}
  .asp-country-flag{width:18px;height:12px}
}


/* 0.21.0: match official country row — flag first, small gap, then country; no stray separator; taller athlete photo */
.asp-runner{
  min-height:96px;
}
.asp-runner-photo{
  width:68px;
  height:86px;
}
.asp-runner-meta{
  display:flex!important;
  flex-direction:column;
  align-items:flex-start!important;
  gap:3px!important;
  margin-top:4px;
  min-width:0;
  overflow:visible;
  white-space:nowrap;
}
.asp-runner-bib{
  display:block!important;
  line-height:1.2;
}
.asp-meta-sep{display:none!important}
.asp-country-wrap{
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:6px!important;
  min-width:0;
  white-space:nowrap;
  line-height:1.2;
}
.asp-country-flag{
  order:1!important;
  display:block;
  width:20px;
  height:14px;
  object-fit:contain;
  flex:0 0 auto;
  margin:0!important;
  align-self:center;
  vertical-align:middle;
  border-radius:1px;
}
.asp-runner-country{
  order:2!important;
  display:inline-block!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  line-height:1.2;
}
@media(max-width:900px){
  .asp-runner{min-height:90px}
  .asp-runner-photo{width:62px;height:80px}
}
@media(max-width:560px){
  .asp-runner{min-height:82px}
  .asp-runner-photo{width:56px;height:72px}
  .asp-country-wrap{gap:5px!important}
  .asp-country-flag{width:18px;height:12px}
}

/* 0.22.0: tighter leaderboard, taller photos, no separator dot, shorter heading */
.asp-leaderboard>header{
  padding:8px 10px!important;
  min-height:0!important;
}
.asp-leaderboard>header .asp-kicker{
  font-size:9.5px!important;
  line-height:1.05!important;
}
.asp-leaderboard>header h2{
  margin:2px 0 0!important;
  font-size:18px!important;
  line-height:1.08!important;
}
.asp-leaderboard>header .asp-update-dot{
  font-size:9.5px!important;
  line-height:1.1!important;
}
.asp-runner{
  box-sizing:border-box;
  min-height:90px!important;
  padding:3px 8px!important;
  gap:7px!important;
  grid-template-columns:28px 72px minmax(0,1fr) 72px!important;
}
.asp-runner-photo{
  width:68px!important;
  height:88px!important;
}
.asp-runner-main{
  align-self:center!important;
}
.asp-runner-name{
  line-height:1.08!important;
}
.asp-runner-meta{
  margin-top:2px!important;
  gap:2px!important;
  line-height:1.05!important;
}
.asp-runner-bib,
.asp-country-wrap,
.asp-runner-country{
  line-height:1.05!important;
}
/* Kill separator dots from any old/cached markup or theme pseudo-elements. */
.asp-runner-meta::before,
.asp-runner-meta::after,
.asp-runner-bib::before,
.asp-runner-bib::after,
.asp-country-wrap::before,
.asp-country-wrap::after,
.asp-meta-sep{
  content:none!important;
  display:none!important;
}
.asp-runner-route{
  margin-top:4px!important;
}
.asp-runner-route-labels{
  margin-bottom:2px!important;
  line-height:1!important;
}
.asp-runner-route-captions{
  margin-top:2px!important;
  line-height:1!important;
  font-size:7.5px!important;
}
.asp-runner-route .asp-progress{
  height:6px!important;
}
.asp-runner-timing .asp-runner-time{
  margin-top:3px!important;
}
@media(max-width:900px){
  .asp-runner{min-height:86px!important;grid-template-columns:28px 66px minmax(0,1fr) 68px!important;padding:3px 7px!important}
  .asp-runner-photo{width:62px!important;height:82px!important}
}
@media(max-width:560px){
  .asp-leaderboard>header{padding:7px 8px!important}
  .asp-leaderboard>header h2{font-size:17px!important}
  .asp-runner{min-height:80px!important;grid-template-columns:26px 60px minmax(0,1fr) 64px!important;padding:3px 6px!important;gap:6px!important}
  .asp-runner-photo{width:56px!important;height:76px!important}
  .asp-runner-route{margin-top:3px!important}
  .asp-runner-route-captions{font-size:7px!important}
}


/* 0.26.0: mobile reliability/visibility hardening for the live Top 5 */
@media(max-width:900px){
  #asp-leaderboard-panel,
  #asp-runner-list,
  #asp-runner-list .asp-runner{
    display:block;
    visibility:visible!important;
    opacity:1!important;
    max-height:none!important;
  }
  #asp-runner-list .asp-runner{
    display:grid!important;
  }
  .asp-primary-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .asp-leaderboard{
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  .asp-runner-list{
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
}
@media(max-width:560px){
  .asp-primary-grid{padding-left:6px!important;padding-right:6px!important;gap:8px!important}
  .asp-runner{width:100%!important;min-width:0!important}
  .asp-runner-main{min-width:0!important}
  .asp-runner-name{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
}


/* 0.31.0: keep server-rendered athlete photos stable on mobile and hide the event facts strip there. */
@media(max-width:767px){
  .asp-facts{display:none!important;}
}


/* 0.32.0: make checkpoint progress explicit without making runner cards much taller. */
.asp-runner-cp{
  white-space:nowrap!important;
  font-size:11px!important;
  line-height:1.1!important;
}
.asp-runner-remaining{
  display:block!important;
  margin-top:2px!important;
  text-align:left!important;
  line-height:1!important;
}
.asp-runner-remaining small{
  display:block!important;
  width:100%!important;
  font-size:8px!important;
  font-weight:700!important;
  color:#6a7f90!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
@media(max-width:900px){
  .asp-runner-cp{font-size:10px!important}
  .asp-runner-remaining small{font-size:7.5px!important}
}
@media(max-width:560px){
  .asp-runner-cp{font-size:9px!important}
  .asp-runner-remaining small{font-size:7px!important}
}

/* 0.35.0: mobile-only compact single-line video heading. */
@media(max-width:560px){
  .asp-video-panel>header{
    padding:7px 8px!important;
    gap:6px!important;
    min-height:0!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
  }
  .asp-video-panel>header h2{
    margin:0!important;
    font-size:15px!important;
    line-height:1!important;
    white-space:nowrap!important;
    flex:0 1 auto!important;
  }
  .asp-video-panel>header .asp-video-live{
    padding:3px 6px!important;
    font-size:9px!important;
    line-height:1!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }
}


/* 0.36.0: clearly separate finishers from athletes still on course. */
.asp-runner-section{
  display:flex;
  align-items:center;
  min-height:22px;
  padding:4px 9px;
  box-sizing:border-box;
  font-size:10px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.asp-runner-section--finished{
  color:#176c35;
  background:#f2faf5;
  border-left:4px solid #1b8b45;
}
.asp-runner-section--course{
  color:#0c5c9e;
  background:#f4f8fc;
  border-left:4px solid #0c5c9e;
}
.asp-runner--finished{background:#fbfefc;}
.asp-runner--finished .asp-runner-cp{color:#17733a!important;}
.asp-runner--finished .asp-progress i{width:100%!important;}
@media(max-width:560px){
  .asp-runner-section{min-height:19px;padding:3px 6px;font-size:8.5px;}
  .asp-leaderboard>header h2{font-size:15px!important;line-height:1.15!important;}
}

/* 0.37.0: clearer checkpoint wording using the APELA orange accent. */
.asp-runner-cp{color:#f28b22!important;font-weight:800;}


/* 0.39.0: keep the full Checkpoint label inside each runner card. */
.asp-runner{
  grid-template-columns:28px 72px minmax(0,1fr) 108px!important;
}
.asp-runner-timing{
  min-width:0!important;
  width:100%!important;
  max-width:108px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
.asp-runner-timing .asp-runner-cp{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  text-align:right!important;
  white-space:nowrap!important;
  overflow:visible!important;
  letter-spacing:-.015em!important;
}
@media(max-width:900px){
  .asp-runner{grid-template-columns:28px 66px minmax(0,1fr) 100px!important;}
  .asp-runner-timing{max-width:100px!important;}
  .asp-runner-timing .asp-runner-cp{font-size:9.5px!important;letter-spacing:-.02em!important;}
}
@media(max-width:560px){
  .asp-runner{grid-template-columns:26px 60px minmax(0,1fr) 92px!important;}
  .asp-runner-timing{max-width:92px!important;}
  .asp-runner-timing .asp-runner-cp{font-size:8.5px!important;letter-spacing:-.025em!important;}
}


/* 0.40.0: desktop checkpoint fit + mobile leaderboard readability. */
/* Desktop: keep the complete checkpoint phrase inside the leaderboard card. */
@media(min-width:901px){
  .asp-runner{
    grid-template-columns:28px 72px minmax(0,1fr) 118px!important;
  }
  .asp-runner-timing{
    max-width:118px!important;
  }
  .asp-runner-timing .asp-runner-cp{
    font-size:9.5px!important;
    letter-spacing:-.03em!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }
}

/* Mobile only: use the full right side of each athlete card more efficiently. */
@media(max-width:560px){
  .asp-runner{
    grid-template-columns:26px 60px minmax(0,1fr) 92px!important;
    grid-template-rows:auto auto auto!important;
    column-gap:6px!important;
    row-gap:0!important;
    min-height:88px!important;
    padding:4px 6px!important;
    align-items:start!important;
  }

  .asp-rank{
    grid-column:1!important;
    grid-row:1 / 4!important;
    align-self:center!important;
  }
  .asp-runner-photo{
    grid-column:2!important;
    grid-row:1 / 4!important;
    width:56px!important;
    height:80px!important;
    align-self:center!important;
  }

  /* display:contents lets name/meta/route use the parent card grid. */
  .asp-runner-main{
    display:contents!important;
  }
  .asp-runner-name{
    grid-column:3 / 5!important;
    grid-row:1!important;
    align-self:end!important;
    margin:0 0 1px!important;
    padding:0!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    font-size:12.2px!important;
    line-height:1.05!important;
    letter-spacing:-.01em!important;
  }
  .asp-runner-name--lg{
    font-size:11.2px!important;
    letter-spacing:-.02em!important;
  }
  .asp-runner-name--xl{
    font-size:10.2px!important;
    letter-spacing:-.03em!important;
  }
  .asp-runner-meta{
    grid-column:3!important;
    grid-row:2!important;
    align-self:start!important;
    margin-top:0!important;
    gap:1px!important;
    font-size:9.5px!important;
    line-height:1!important;
  }

  /* Checkpoint + time sit slightly higher, as requested. */
  .asp-runner-timing{
    grid-column:4!important;
    grid-row:2!important;
    align-self:start!important;
    width:100%!important;
    max-width:none!important;
    overflow:visible!important;
    transform:translateY(-4px)!important;
  }
  .asp-runner-timing .asp-runner-cp{
    font-size:8.4px!important;
    line-height:1!important;
    letter-spacing:-.03em!important;
    overflow:visible!important;
  }
  .asp-runner-timing .asp-runner-time{
    margin-top:3px!important;
    font-size:9px!important;
    line-height:1!important;
  }

  /* Route spans both text columns, so the Athens–Sparta bar is much longer. */
  .asp-runner-route{
    grid-column:3 / 5!important;
    grid-row:3!important;
    width:100%!important;
    margin:2px 0 0!important;
    min-width:0!important;
  }
  .asp-runner-route-labels{
    width:100%!important;
    margin:0 0 2px!important;
    font-size:7.5px!important;
    line-height:1!important;
    letter-spacing:.01em!important;
  }
  .asp-runner-route .asp-progress{
    width:100%!important;
    height:7px!important;
    margin:0!important;
  }
  .asp-runner-remaining{
    width:100%!important;
    margin-top:2px!important;
  }
  .asp-runner-remaining small{
    width:100%!important;
    font-size:7.4px!important;
    line-height:1!important;
    letter-spacing:-.015em!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}


/* 0.41.0: final leaderboard spacing refinements requested for mobile + desktop. */

/* Desktop only: let the Athens-Sparta route use the full runner-card width,
   including the space below the checkpoint/time column. */
@media(min-width:901px){
  .asp-runner-main{
    overflow:visible!important;
  }
  .asp-runner-route{
    width:calc(100% + 125px)!important;
    max-width:none!important;
    margin-right:-125px!important;
    box-sizing:border-box!important;
  }
  .asp-runner-route-labels,
  .asp-runner-route .asp-progress,
  .asp-runner-remaining{
    width:100%!important;
    max-width:none!important;
  }
  .asp-runner-remaining small{
    width:100%!important;
    max-width:none!important;
    font-size:7.4px!important;
    letter-spacing:-.01em!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}

/* Mobile only: keep the board title on one line and move checkpoint/time
   slightly lower so they do not touch the athlete name. */
@media(max-width:560px){
  .asp-leaderboard>header{
    flex-wrap:nowrap!important;
    gap:5px!important;
  }
  .asp-leaderboard>header>div{
    flex:1 1 auto!important;
    min-width:0!important;
  }
  .asp-leaderboard>header h2{
    font-size:13px!important;
    line-height:1.05!important;
    letter-spacing:-.015em!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .asp-leaderboard>header .asp-update-dot{
    flex:0 0 auto!important;
    font-size:8.2px!important;
    gap:4px!important;
    white-space:nowrap!important;
  }
  .asp-leaderboard>header .asp-update-dot i{
    width:7px!important;
    height:7px!important;
  }

  .asp-runner-timing{
    transform:translateY(2px)!important;
  }
}

/* 0.42.0: desktop only - lift checkpoint/time slightly so they clear the Sparta route label. */
@media(min-width:901px){
  .asp-runner-timing{
    transform:translateY(-5px)!important;
  }
  .asp-runner-timing .asp-runner-time{
    margin-top:2px!important;
  }
}