/* =========================================================
   DIRTY MONEY — JUDGE PANEL
   Builds on styles.css tokens (--ink, --gold, --paper, etc.)
   ========================================================= */

.jp-body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--bg);
  min-height:100vh;
  overflow-x:hidden;
}

/* hidden attribute must beat the display: grid/flex rules below */
.jp-body [hidden],
[hidden]{ display:none !important;}

/* shared */
.jp-eyebrow{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-deep);
  padding-bottom:4px;
  border-bottom:2px solid var(--gold);
  margin-bottom:10px;
}
.jp-title{
  font-family:var(--font-disp);
  font-size:clamp(38px, 4.6vw, 64px);
  line-height:.95;
  letter-spacing:-.02em;
  margin:0 0 12px;
  color:var(--ink);
}
.jp-title .dot{ color:var(--gold-deep);}

/* =========================================================
   BUTTONS
   ========================================================= */
.jp-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 22px;
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
  background:var(--paper);
  color:var(--ink);
  border:1px solid var(--ink);
  transition:background .15s ease, color .15s ease, transform .12s ease, border-color .15s ease;
  white-space:nowrap;
}
.jp-btn:hover{ background:var(--gold); border-color:var(--ink); color:var(--ink);}
.jp-btn:active{ transform:translateY(1px);}
.jp-btn--primary{
  background:var(--gold);
  color:var(--ink);
  border-color:var(--ink);
}
.jp-btn--primary:hover{
  background:var(--ink);
  color:var(--gold);
  border-color:var(--ink);
}
.jp-btn--ghost{
  background:transparent;
}
.jp-btn--ghost:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink);}
.jp-btn__arrow{ font-size:16px; line-height:1;}
.jp-btn[disabled]{ opacity:.4; pointer-events:none;}

.jp-link{
  background:none; border:none; cursor:pointer;
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-2);
  padding:6px 0;
}
.jp-link:hover{ color:var(--gold-deep);}

/* =========================================================
   LOGIN
   ========================================================= */
.jp-login{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:40px 24px;
  position:relative;
}
.jp-login__bg{
  position:absolute; inset:0; z-index:0;
  background: #fafafa;
}
.jp-login__card{
  position:relative; z-index:1;
  width:min(520px, 100%);
  background:var(--paper);
  border:1px solid var(--ink);
  padding:36px 36px 22px;
  display:flex; flex-direction:column;
  gap:22px;
}
.jp-login__brand img{
  height:38px; width:auto; display:block;
}
.jp-login__head{ display:flex; flex-direction:column; gap:8px;}
.jp-login__lead{
  margin:0;
  color:var(--ink-2);
  font-size:15px;
  max-width:42ch;
}
.jp-login__form{
  display:flex; flex-direction:column; gap:16px;
  padding-top:8px;
  border-top:1px solid var(--rule-2);
}
.jp-login__err{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.05em;
  color:#a13c2a;
  background:#fdf0f0;
  border:1px solid #a13c2a55;
  padding:8px 12px;
}
.jp-login__hint{
  display:flex; gap:10px; align-items:flex-start;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--mute);
  padding:10px 12px;
  background:#f6f6f6;
  border:1px dashed var(--rule-2);
}
.jp-login__hint-k{
  flex-shrink:0;
  color:var(--gold-deep);
  letter-spacing:.18em;
  text-transform:uppercase;
}
.jp-login__hint b{ color:var(--ink);}
.jp-login__foot{
  display:flex; justify-content:space-between;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--mute);
  padding-top:14px;
  border-top:1px solid var(--rule-2);
}
.jp-login__lock{ color:var(--gold-deep);}

/* =========================================================
   FORM FIELDS
   ========================================================= */
.jp-field{ display:flex; flex-direction:column; gap:6px;}
.jp-field--full{ grid-column:1/-1;}
.jp-field label{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink);
}
.jp-field input,
.jp-field select,
.jp-field textarea{
  font-family:var(--font-body);
  font-size:15px;
  background:#fff;
  border:1px solid var(--ink);
  padding:11px 13px;
  color:var(--ink);
  outline:none;
  width:100%;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.jp-field input:focus,
.jp-field textarea:focus,
.jp-field select:focus{
  border-color:var(--gold-deep);
  box-shadow:0 0 0 3px #c8a55a40;
}
.jp-field textarea{ resize:vertical; min-height:80px;}

.jp-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:14px;
}

/* =========================================================
   APP SHELL HEADER
   ========================================================= */
.jp-app{
  min-height:100vh;
  display:flex; flex-direction:column;
}
.jp-header{
  position:sticky; top:0; z-index:30;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:24px;
  padding:14px 28px;
  background:var(--bg);
  border-bottom:1px solid var(--ink);
}
.jp-header__brand img{ display:block; height:30px; width:auto;}
.jp-header__center{ display:flex; align-items:center;}
.jp-header__crumb{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-2);
}
/* Judged-progress pill — visible on dashboard + scoring */
.jp-header__progress{
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  margin-left:16px;
  padding:6px 14px;
  border:1px solid var(--ink);
  background:var(--ink);
  color:var(--paper);
}
.jp-header__progress[hidden]{ display:none;}
.jp-header__progress-k{
  font-family:var(--font-disp);
  font-size:22px;
  letter-spacing:-.01em;
  color:var(--gold);
}
.jp-header__progress-slash{ color:#888; margin:0 2px;}
.jp-header__progress-n{
  font-family:var(--font-disp);
  font-size:18px;
  color:var(--paper);
}
.jp-header__progress-t{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin-left:8px;
}

/* Scoring view back-row progress (in-context) */
.jp-score__progress{
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  padding:8px 14px;
  border:1.5px solid var(--ink);
  background:var(--paper);
}
.jp-score__progress-k{
  font-family:var(--font-disp);
  font-size:26px;
  letter-spacing:-.02em;
  color:var(--gold-deep);
}
.jp-score__progress-slash{ color:var(--rule-2);}
.jp-score__progress-n{
  font-family:var(--font-disp);
  font-size:20px;
  color:var(--ink);
}
.jp-score__progress-t{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-deep);
  margin-left:10px;
}
.jp-score__back-row{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap;
}
.jp-header__judge{
  display:flex; align-items:center; gap:14px;
  font-family:var(--font-mono);
}
.jp-header__role{
  font-size:10.5px;
  letter-spacing:.2em;
  color:var(--gold-deep);
}
.jp-header__name{
  font-family:var(--font-disp);
  font-size:18px;
  color:var(--ink);
  letter-spacing:-.005em;
}
.jp-header__avatar{
  width:34px; height:34px;
  border:1.5px solid var(--ink);
  border-radius:50%;
  background:#f0f0f0;
  display:grid; place-items:center;
  font-family:var(--font-disp);
  font-size:14px;
  color:var(--ink);
  text-transform:uppercase;
}
.jp-header__logout{
  background:none; border:none;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--mute);
  cursor:pointer;
  padding:6px 0;
}
.jp-header__logout:hover{ color:#a13c2a;}

/* =========================================================
   DASHBOARD
   ========================================================= */
.jp-dash{
  max-width:1480px;
  margin:0 auto;
  width:100%;
  padding:36px 28px 80px;
}
.jp-dash__head{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:36px;
  align-items:flex-end;
  padding-bottom:32px;
  border-bottom:1px solid var(--ink);
  margin-bottom:0;
}
.jp-dash__lead{
  margin:8px 0 0;
  color:var(--ink-2);
  font-size:16px;
  max-width:54ch;
}

.jp-progress{
  background:var(--ink);
  color:var(--paper);
  padding:24px 26px;
  display:flex; flex-direction:column; gap:12px;
}
.jp-progress__row{
  display:flex; align-items:baseline; gap:6px;
  font-family:var(--font-disp);
}
.jp-progress__k{
  font-size:64px;
  color:var(--gold);
  line-height:1;
  letter-spacing:-.02em;
}
.jp-progress__slash{
  font-size:38px;
  color:#ffffff44;
  margin:0 4px;
}
.jp-progress__total{ font-size:38px; color:#ffffffcc;}
.jp-progress__label{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold);
  margin-top:-4px;
}
.jp-progress__bar{
  height:6px;
  background:#ffffff1c;
  position:relative;
  overflow:hidden;
}
.jp-progress__fill{
  position:absolute; left:0; top:0; bottom:0;
  background:var(--gold);
  width:0%;
  transition:width .3s ease;
}
.jp-progress__meta{
  display:flex; justify-content:space-between;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:#ffffffaa;
}
.jp-progress__meta b{ color:var(--paper); font-weight:500;}
.jp-dot{
  display:inline-block;
  width:8px; height:8px; border-radius:50%;
  margin-right:6px;
  vertical-align:middle;
}
.jp-dot--gold{ background:var(--gold);}
.jp-dot--ink{ background:#ffffff66;}

/* Rider table */
.jp-table{
  border-top:1px solid var(--ink);
}
.jp-row-item{
  display:grid;
  grid-template-columns: 60px 1fr 1.2fr 1fr 130px 110px 30px;
  align-items:center;
  gap:18px;
  padding:18px 6px;
  border-bottom:1px solid var(--rule-2);
  cursor:pointer;
  transition:background .15s ease, padding .15s ease;
}
.jp-row-item:hover,
.jp-row-item.is-focus{
  background:var(--paper);
  padding-left:18px;
}
.jp-row-item__no{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.12em;
  color:var(--gold-deep);
}
.jp-row-item__team{
  font-family:var(--font-disp);
  font-size:22px;
  line-height:1;
  letter-spacing:-.01em;
  color:var(--ink);
}
.jp-row-item__rider{
  font-family:var(--font-body);
  font-size:14.5px;
  color:var(--ink-2);
}
.jp-row-item__rider b{ color:var(--ink); font-weight:600;}
.jp-row-item__meta{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--mute);
}
.jp-row-item__status{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  padding:5px 10px;
  border:1px solid var(--ink);
  text-align:center;
  white-space:nowrap;
}
.jp-row-item[data-status="pending"] .jp-row-item__status{
  color:var(--mute);
  border-color:var(--rule-2);
}
.jp-row-item[data-status="draft"] .jp-row-item__status{
  color:var(--gold-deep);
  border-color:var(--gold);
  background:#fdf8e8;
}
.jp-row-item[data-status="done"] .jp-row-item__status{
  background:var(--ink);
  color:var(--gold);
  border-color:var(--ink);
}
.jp-row-item__score{
  font-family:var(--font-disp);
  font-size:24px;
  color:var(--ink);
  letter-spacing:-.01em;
  text-align:right;
}
.jp-row-item__score--empty{ color:var(--rule-2);}
.jp-row-item__chev{
  font-family:var(--font-mono);
  font-size:18px;
  color:var(--mute);
  text-align:right;
}
.jp-row-item:hover .jp-row-item__chev,
.jp-row-item.is-focus .jp-row-item__chev{ color:var(--gold-deep);}

.jp-dash__foot{
  margin-top:24px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--mute);
}
.jp-dash__foot kbd{
  font-family:var(--font-mono);
  font-size:11px;
  background:#fff;
  border:1px solid var(--rule-2);
  border-bottom-width:2px;
  padding:1px 6px;
  border-radius:3px;
  color:var(--ink);
  margin:0 2px;
}

/* =========================================================
   SCORING VIEW
   ========================================================= */
.jp-score{
  max-width:1640px;
  margin:0 auto;
  width:100%;
  padding:22px 28px 80px;
}
.jp-score__pos{
  font-family:var(--font-disp);
  font-size:28px;
  letter-spacing:-.01em;
  color:var(--ink);
}
.jp-score__pos span:first-child{ color:var(--gold-deep);}

.jp-score__grid{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:28px;
  align-items:flex-start;
}

/* ===== Video ===== */
.jp-video{
  background:var(--paper);
  border:1px solid var(--ink);
  display:flex; flex-direction:column;
}
.jp-video__chrome{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 16px;
  border-bottom:1px solid var(--ink);
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.jp-video__rec{ display:flex; align-items:center; gap:8px; color:var(--gold);}
.jp-video__rec i{
  width:8px; height:8px; border-radius:50%;
  background:var(--gold);
  animation:jpBlink 1.4s steps(2) infinite;
}
@keyframes jpBlink{50%{opacity:.25}}
.jp-video__name{ color:var(--paper);}
.jp-video__time{ color:#ffffff99;}
.jp-video__stage{
  position:relative;
  aspect-ratio: 16 / 9;
  background:#0a0a0a;
  overflow:hidden;
}
.jp-video__stage video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:contain;
  background:#0a0a0a;
}
.jp-video__overlay{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(120% 80% at 50% 40%, #1a1a1a 0%, #0a0a0a 70%);
  pointer-events:none;
}
.jp-video__placeholder{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:#ffffffcc;
  text-align:center;
}
.jp-video__num{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.2em;
  color:var(--gold);
}
.jp-video__title{
  font-family:var(--font-disp);
  font-size:38px;
  letter-spacing:-.01em;
  line-height:1;
  color:var(--paper);
}
.jp-video__sub{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.1em;
  color:#ffffff80;
}
.jp-video__meta{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:0;
  border-top:1px solid var(--ink);
}
.jp-video__meta > div{
  padding:14px 16px;
  display:flex; flex-direction:column; gap:4px;
  border-right:1px solid var(--rule-2);
}
.jp-video__meta > div:last-child{ border-right:none;}
.jp-video__meta > div > span:last-child{
  font-family:var(--font-disp);
  font-size:18px;
  color:var(--ink);
  letter-spacing:-.005em;
}
.jp-video__meta .jp-eyebrow{
  margin-bottom:0;
  border-bottom:none;
  padding-bottom:0;
}

/* ===== Panel ===== */
.jp-panel{
  background:var(--paper);
  border:1px solid var(--ink);
  padding:0 0 22px;
  display:flex; flex-direction:column;
}

/* tabs */
.jp-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-bottom:1px solid var(--ink);
}
.jp-tab{
  background:transparent;
  border:none;
  padding:18px 16px;
  font-family:var(--font-disp);
  font-size:18px;
  letter-spacing:-.005em;
  color:var(--mute);
  cursor:pointer;
  display:flex; align-items:baseline; gap:10px;
  text-align:left;
  border-right:1px solid var(--ink);
  transition:background .15s ease, color .15s ease;
}
.jp-tab:last-child{ border-right:none;}
.jp-tab__no{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--mute);
}
.jp-tab:hover{ background:var(--bg-2); color:var(--ink);}
.jp-tab.is-active{
  background:var(--ink);
  color:var(--paper);
}
.jp-tab.is-active .jp-tab__no{ color:var(--gold);}

.jp-tab-body{
  padding:24px 24px 8px;
  display:flex; flex-direction:column;
}

/* Criteria table */
.jp-criteria{
  margin-bottom:18px;
  border-top:1px solid var(--rule-2);
  border-bottom:1px solid var(--rule-2);
}
.jp-criteria__head{
  display:grid;
  grid-template-columns: 1.6fr 1fr 60px 70px;
  gap:14px;
  padding:8px 0;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--mute);
  border-bottom:1px solid var(--rule-2);
}
.jp-criteria__head > span:nth-child(3),
.jp-criteria__head > span:nth-child(4){ text-align:right;}

.jp-crit{
  display:grid;
  grid-template-columns: 1.6fr 1fr 60px 70px;
  gap:14px;
  align-items:center;
  padding:12px 0;
  border-bottom:1px dashed var(--rule-2);
}
.jp-crit:last-child{ border-bottom:none;}
.jp-crit__name{
  display:flex; flex-direction:column; gap:2px;
}
.jp-crit__name b{
  font-family:var(--font-body);
  font-size:14.5px;
  font-weight:600;
  color:var(--ink);
}
.jp-crit__hint{
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--mute);
  letter-spacing:.03em;
}
.jp-crit__slider{
  display:flex; align-items:center; gap:10px;
}
.jp-crit__slider input[type=range]{
  flex:1;
  -webkit-appearance:none; appearance:none;
  height:4px;
  background:linear-gradient(to right, var(--gold) var(--p,0%), var(--rule-2) var(--p,0%));
  outline:none;
  cursor:pointer;
}
.jp-crit__slider input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:18px; height:18px;
  background:var(--ink);
  border:2px solid var(--gold);
  cursor:grab;
}
.jp-crit__slider input[type=range]::-moz-range-thumb{
  width:18px; height:18px;
  background:var(--ink);
  border:2px solid var(--gold);
  cursor:grab;
}
.jp-crit__value{
  font-family:var(--font-disp);
  font-size:18px;
  width:30px;
  text-align:right;
  letter-spacing:-.005em;
  color:var(--ink);
}
.jp-crit__weight{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--mute);
  text-align:right;
}
.jp-crit__points{
  font-family:var(--font-disp);
  font-size:20px;
  text-align:right;
  color:var(--gold-deep);
  letter-spacing:-.01em;
}

.jp-total{
  display:flex; align-items:baseline; gap:14px;
  padding:18px 20px;
  background:var(--ink);
  color:var(--paper);
  margin-bottom:18px;
}
.jp-total .jp-eyebrow{
  color:var(--gold);
  border-bottom-color:var(--gold);
  margin-bottom:0;
}
.jp-total__num{
  font-family:var(--font-disp);
  font-size:42px;
  letter-spacing:-.02em;
  color:var(--gold);
  margin-left:auto;
}
.jp-total__max{
  font-family:var(--font-mono);
  font-size:14px;
  color:#ffffff88;
  letter-spacing:.06em;
}

.jp-actions{
  display:grid;
  grid-template-columns:auto auto 1fr;
  gap:10px;
  padding:0 24px;
}
.jp-actions .jp-btn--primary{ justify-self:end;}
.jp-save-status{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--mute);
  padding:14px 24px 0;
  text-align:right;
  min-height:14px;
  transition:color .2s ease;
}
.jp-save-status.is-saving{ color:var(--gold-deep);}
.jp-save-status.is-saved{ color:var(--moss, #5c7a3a);}

/* =========================================================
   DONE VIEW
   ========================================================= */
.jp-done{
  flex:1;
  display:grid; place-items:center;
  padding:60px 24px;
}
.jp-done__card{
  position:relative;
  max-width:560px;
  width:100%;
  background:var(--paper);
  border:1px solid var(--ink);
  padding:48px 38px 32px;
  text-align:center;
}
.jp-done__stamp{
  position:absolute; top:-14px; right:-14px;
  background:var(--gold);
  color:var(--ink);
  font-family:var(--font-disp);
  font-size:16px;
  letter-spacing:.14em;
  padding:6px 14px;
  border:1.5px solid var(--ink);
  transform:rotate(6deg);
}
.jp-done__icon{ color:var(--gold-deep); display:flex; justify-content:center; margin-bottom:8px;}
.jp-done h2{
  font-family:var(--font-disp);
  font-size:38px;
  letter-spacing:-.01em;
  margin:8px 0 6px;
  color:var(--ink);
}
.jp-done p{ margin:4px 0; color:var(--ink-2);}
.jp-done__sub{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.06em;
  color:var(--mute);
  margin-top:14px;
}
.jp-done__actions{
  display:flex; justify-content:center; gap:12px;
  margin-top:26px;
}

/* =========================================================
   TOAST
   ========================================================= */
.jp-toast{
  position:fixed; bottom:24px; left:50%;
  transform:translateX(-50%) translateY(12px);
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.1em;
  padding:12px 22px;
  border:1px solid var(--ink);
  border-left:3px solid var(--gold);
  z-index:9999;
  opacity:0;
  transition:opacity .25s ease, transform .25s ease;
  pointer-events:none;
}
.jp-toast.is-on{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1180px){
  .jp-score__grid{ grid-template-columns:1fr;}
  .jp-dash__head{ grid-template-columns:1fr; gap:24px;}
  .jp-progress{ width:100%;}
}

@media (max-width: 860px){
  .jp-header{ grid-template-columns:auto 1fr; gap:14px; padding:12px 16px;}
  .jp-header__center{ display:none;}
  .jp-header__judge{ gap:8px;}
  .jp-header__role{ display:none;}
  .jp-header__name{ font-size:14px;}
  .jp-header__avatar{ width:28px; height:28px; font-size:11px;}
  .jp-header__logout{ font-size:10px;}

  .jp-dash{ padding:24px 16px 60px;}
  .jp-row-item{
    grid-template-columns: 40px 1fr 100px 30px;
    gap:10px;
    padding:14px 6px;
  }
  .jp-row-item__rider,
  .jp-row-item__meta,
  .jp-row-item__score{ display:none;}
  .jp-row-item__team{ font-size:18px;}

  .jp-score{ padding:16px 16px 60px;}
  .jp-video__meta{ grid-template-columns:repeat(2, 1fr);}
  .jp-video__meta > div:nth-child(2n){ border-right:none;}
  .jp-tab{ font-size:15px; padding:14px 12px;}
  .jp-tab-body{ padding:18px 16px 4px;}
  .jp-criteria__head{
    grid-template-columns: 1.6fr 1fr 40px 56px;
    gap:8px;
  }
  .jp-crit{
    grid-template-columns: 1.6fr 1fr 40px 56px;
    gap:8px;
  }
  .jp-actions{
    grid-template-columns:1fr; padding:0 16px;
  }
  .jp-actions .jp-btn--primary{ justify-self:stretch;}
  .jp-save-status{ padding:10px 16px 0;}
  .jp-row{ grid-template-columns:1fr;}

  .jp-login__card{ padding:26px 20px 16px;}
  .jp-login__hint{ flex-direction:column; gap:4px;}
}

@media (prefers-reduced-motion: reduce){
  .jp-video__rec i{ animation:none;}
}