/* 심사 탭(#/events/…/judging · web/ui/eventJudging*.js · 10-31 오너: 심사위원 4인) — event.css 의 토큰 · 표면 · 반경만 쓴다. event.css 뒤에 싣는다.
 *   카드 = 왼쪽 9:16 포스터 + 오른쪽 정보 · 링크 · 내 기록. 재생하면 카드가 세로로 펴져 영상이 커진다(:has). 글자 크기는 사다리 값만. */

body.shell-v2 .ev-jh { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding: 28px 0 8px; }
body.shell-v2 .ev-jh-prog { margin: 0; color: var(--ink-80); font-size: var(--fs-caption); }
body.shell-v2 .ev-jbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 8px 0 16px; }
body.shell-v2 .ev-jchips { margin-left: 0; }
body.shell-v2 .ev-jsearch { flex: 1 1 200px; max-width: 320px; min-width: 0; margin-left: auto; padding: 8px 14px; border: 0; border-radius: var(--r-pill); background: var(--surface-1); box-shadow: inset 0 0 0 1px var(--hairline); color: var(--ink); font: inherit; font-size: var(--fs-caption); }
body.shell-v2 .ev-jsearch:focus-visible { outline: none; box-shadow: var(--ring-focus); }
body.shell-v2 .ev-jgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: var(--grid-gap); }
body.shell-v2 .ev-jgrid > .state-error, body.shell-v2 .ev-jgrid > .state-empty { grid-column: 1 / -1; }

body.shell-v2 .ev-jc { display: grid; grid-template-columns: 140px minmax(0, 1fr); grid-template-rows: auto auto 1fr; gap: 8px 16px; align-content: start; min-width: 0; padding: 16px; border-radius: var(--r-xl); background: var(--surface-1); box-shadow: inset 0 0 0 1px var(--hairline); }
body.shell-v2 .ev-jc > .ev-jv { grid-column: 1; grid-row: 1 / span 3; }
body.shell-v2 .ev-jc > :not(.ev-jv) { grid-column: 2; min-width: 0; }
body.shell-v2 .ev-jc:has(.ev-jv-media) { grid-template-columns: minmax(0, 1fr); }
body.shell-v2 .ev-jc:has(.ev-jv-media) > .ev-jv { grid-column: 1; grid-row: auto; justify-self: start; width: min(100%, 280px); }
body.shell-v2 .ev-jc:has(.ev-jv-media) > :not(.ev-jv) { grid-column: 1; }
body.shell-v2 .ev-jc--skel { min-height: 240px; background: linear-gradient(100deg, var(--surface-1) 30%, rgba(255,255,255,.06) 50%, var(--surface-1) 70%); background-size: 200% 100%; animation: ev-j-shimmer 1.4s linear infinite; }
@keyframes ev-j-shimmer { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { body.shell-v2 .ev-jc--skel { animation: none; } }

body.shell-v2 .ev-jv { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
body.shell-v2 .ev-jv-poster { position: relative; aspect-ratio: 9 / 16; overflow: hidden; border-radius: var(--r-lg); background: linear-gradient(160deg, #24232b, #121216); box-shadow: inset 0 0 0 1px var(--hairline); }
body.shell-v2 .ev-jv-poster[aria-busy='true'] .ev-jv-play { opacity: .5; cursor: progress; }
body.shell-v2 .ev-jv-art { position: absolute; inset: 0; display: grid; place-items: center; color: var(--ink-48); }
body.shell-v2 .ev-jv-play { top: 50%; width: 48px; height: 48px; }
body.shell-v2 .ev-jv-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }
body.shell-v2 .ev-jv-meta { display: flex; flex-direction: column; gap: 2px; }
body.shell-v2 .ev-jv-badge { align-self: flex-start; padding: 2px 8px; border-radius: var(--r-pill); background: rgba(255,255,255,.08); color: var(--ink-80); font-size: var(--fs-footnote); font-weight: 600; }
body.shell-v2 .ev-jv-badge--fresh { background: rgba(34,197,94,.12); color: #7ee2a2; }
body.shell-v2 .ev-jv-badge--stale { background: rgba(251,146,60,.16); color: #fdba74; }
body.shell-v2 .ev-jv-detail { color: var(--ink-48); font-size: var(--fs-footnote); }

body.shell-v2 .ev-jc-info { display: flex; flex-direction: column; gap: 4px; }
body.shell-v2 .ev-jc-title { margin: 0; font-size: var(--fs-title-3); font-weight: 700; color: var(--ink); overflow-wrap: anywhere; }
body.shell-v2 .ev-jc-logline { margin: 0; color: var(--ink-80); font-size: var(--fs-fine); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.shell-v2 .ev-jc-by { margin: 0; color: var(--ink-48); font-size: var(--fs-footnote); overflow-wrap: anywhere; }
body.shell-v2 .ev-jc-chips { display: flex; flex-wrap: wrap; gap: 6px; }
body.shell-v2 .ev-jc-chips:empty { display: none; }
body.shell-v2 .ev-jc-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: var(--r-pill); background: rgba(255,255,255,.08); color: var(--ink-80); font-size: var(--fs-footnote); font-weight: 600; }
body.shell-v2 .ev-jc-chip--none { color: var(--ink-48); }
body.shell-v2 .ev-jc-chip--pick { background: rgba(250,204,21,.14); color: #fde68a; }
body.shell-v2 .ev-jc-chip--pick svg { fill: currentColor; }
body.shell-v2 .ev-jc-links { display: flex; flex-wrap: wrap; gap: 8px; }
body.shell-v2 .ev-jc-link { gap: 6px; text-decoration: none; }

body.shell-v2 .ev-jn { display: flex; flex-direction: column; gap: 8px; }
body.shell-v2 .ev-jn-row { display: flex; gap: 8px; }
body.shell-v2 .ev-jn-memo { display: flex; flex-direction: column; gap: 4px; }
body.shell-v2 .ev-jn-label { color: var(--ink-48); font-size: var(--fs-footnote); font-weight: 600; }
body.shell-v2 .ev-jn-text { width: 100%; min-width: 0; box-sizing: border-box; resize: vertical; padding: 8px 12px; border: 0; border-radius: var(--r-md); background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--hairline); color: var(--ink); font: inherit; font-size: var(--fs-fine); }
body.shell-v2 .ev-jn-text:focus-visible { outline: none; box-shadow: var(--ring-focus); }
body.shell-v2 .ev-jn-foot { display: flex; align-items: center; gap: 10px; }
body.shell-v2 .ev-jn-count, body.shell-v2 .ev-jn-status { color: var(--ink-48); font-size: var(--fs-footnote); }
body.shell-v2 .ev-jn-status { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
body.shell-v2 .ev-jn-status.is-bad { color: #fca5a5; }
body.shell-v2 .ev-jn-save { margin-left: auto; }

@media (max-width: 900px) {
  body.shell-v2 .ev-jgrid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  body.shell-v2 .ev-jsearch { max-width: none; margin-left: 0; flex-basis: 100%; }
  body.shell-v2 .ev-jc { grid-template-columns: 108px minmax(0, 1fr); gap: 8px 12px; padding: 12px; }
}