/* ---- Community vote ($CLAUDIA Contest), Nov 2026 ---- */
.sxv2-vote { margin-right: 2px; }
.sxv2-vote[hidden] { display: none; }
.sxv2-vote.on { color: var(--ink); }
.sxv2-vote .ck { display: inline-block; margin-left: 4px; font-size: 1.05em; }
.sxv2-tile { position: relative; flex: 0 0 auto; width: 66px; aspect-ratio: 16/9; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  padding: 0; border: 1px solid rgba(243,235,227,.55); border-radius: 5px; background: rgba(16,14,13,.45); color: var(--ink); cursor: pointer;
  font: 300 7px/1.1 Outfit, sans-serif; letter-spacing: .1em; text-transform: uppercase; -webkit-tap-highlight-color: transparent; scroll-snap-align: start; }
.sxv2-tile svg { width: 11px; height: 11px; fill: var(--ink); }
.sxv2-tile:hover, .sxv2-tile:focus-visible { background: rgba(243,235,227,.16); }
.strip.collapsed .sxv2-tile { width: 24px; border-radius: 2px; } .strip.collapsed .sxv2-tile span { display: none; } .strip.collapsed .sxv2-tile svg { width: 8px; height: 8px; }
@media (max-width: 860px) { .sxv2-tile { width: 56px; } .strip.collapsed .sxv2-tile { width: 26px; } }
.sxv2-panel { position: fixed; z-index: 36; top: 76px; left: 50%; transform: translateX(-50%); width: min(440px, calc(100vw - 28px)); max-height: min(70vh, 620px);
  display: flex; flex-direction: column; padding: 10px 8px 8px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 14px; background: rgba(16,14,13,.84);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 10px 30px rgba(0,0,0,.4); color: var(--ink); font: 300 13px/1.3 Outfit, system-ui, sans-serif; }
.sxv2-panel[hidden] { display: none; }
.sxv2-head { display: flex; align-items: flex-start; gap: 8px; padding: 2px 6px 6px; }
.sxv2-ttl { flex: 1 1 auto; min-width: 0; }
.sxv2-ttl h2 { margin: 0; font: 500 22px/1 "Bodoni Moda", Didot, serif; letter-spacing: -.02em; }
.sxv2-ttl h2 em { font-style: italic; font-weight: 400; }
.sxv2-ttl p { margin: 5px 0 0; font-size: 9px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.sxv2-acct { display: flex; align-items: center; gap: 8px; margin: 4px 4px 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: rgba(0,0,0,.18); font-size: 12px; }
.sxv2-acct .who { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }
.sxv2-acct .who b { font-weight: 400; color: var(--ink); }
.sxv2-left { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.sxv2-dots { display: inline-flex; gap: 3px; margin-right: 3px; } .sxv2-dots i { width: 7px; height: 7px; border-radius: 50%; border: 1px solid var(--ink); }
.sxv2-dots i.full { background: var(--ink); }
.sxv2-list { flex: 1 1 auto; min-height: 0; list-style: none; margin: 0; padding: 0 2px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.sxv2-list li { display: flex; align-items: center; gap: 9px; padding: 6px 6px; border-radius: 10px; }
.sxv2-list li:hover { background: rgba(243,235,227,.06); }
.sxv2-list li.mine { background: rgba(243,235,227,.11); }
.sxv2-list li.cur .sxv2-t { text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; }
.sxv2-rk { flex: 0 0 22px; text-align: right; font: italic 400 17px/1 "Bodoni Moda", Didot, serif; color: var(--muted); font-variant-numeric: tabular-nums; }
.sxv2-list li.top .sxv2-rk { color: var(--ink); }
.sxv2-play { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 9px; padding: 0; border: 0; background: none; color: inherit; text-align: left; cursor: pointer; font: inherit; }
.sxv2-play img { flex: 0 0 auto; width: 58px; height: 33px; object-fit: cover; border-radius: 5px; background: rgba(255,255,255,.06); }
.sxv2-txt { min-width: 0; display: flex; flex-direction: column; }
.sxv2-t { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sxv2-b { font-size: 10px; color: var(--muted); opacity: .78; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sxv2-n { flex: 0 0 auto; min-width: 34px; text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; }
.sxv2-n small { display: block; font-size: 7.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.sxv2-btn { flex: 0 0 auto; height: 24px; min-width: 64px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; background: rgba(0,0,0,.2); color: var(--ink); cursor: pointer;
  font: 400 9px/22px Outfit, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.sxv2-btn:hover, .sxv2-btn:focus-visible { background: rgba(243,235,227,.14); }
.sxv2-btn.pri, .sxv2-btn[aria-pressed="true"] { background: var(--ink); color: #16120f; border-color: var(--ink); }
.sxv2-btn[aria-pressed="true"]:hover { background: rgba(243,235,227,.75); }
.sxv2-btn:disabled { opacity: .35; cursor: default; }
.sxv2-btn.x { min-width: 0; width: 24px; padding: 0; font-size: 13px; letter-spacing: 0; }
.sxv2-foot { padding: 8px 8px 2px; font-size: 10.5px; line-height: 1.45; color: var(--muted); opacity: .85; }
.sxv2-wrap { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; background: rgba(8,7,6,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sxv2-wrap[hidden] { display: none; }
.sxv2-sheet { position: relative; width: min(380px, calc(100vw - 28px)); padding: 22px 20px 16px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 16px; background: rgba(22,19,17,.94);
  box-shadow: 0 16px 50px rgba(0,0,0,.5); color: var(--ink); font: 300 13px/1.45 Outfit, system-ui, sans-serif; text-align: center; }
.sxv2-sheet.cap { width: min(560px, calc(100vw - 20px)); padding: 18px 14px 14px; }
.sxv2-sheet h3 { margin: 0 0 6px; font: 500 24px/1.05 "Bodoni Moda", Didot, serif; letter-spacing: -.02em; }
.sxv2-sheet h3 em { font-style: italic; font-weight: 400; }
.sxv2-sheet p { margin: 0 0 14px; color: var(--muted); font-size: 12.5px; }
.sxv2-sheet .close { position: absolute; top: 10px; right: 10px; }
.sxv2-prov { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 42px; margin: 0 0 9px; border: 1px solid var(--line); border-radius: 999px;
  background: rgba(243,235,227,.06); color: var(--ink); font: 400 13px/1 Outfit, system-ui, sans-serif; letter-spacing: .02em; cursor: pointer; text-decoration: none; }
.sxv2-prov:hover, .sxv2-prov:focus-visible { background: rgba(243,235,227,.14); }
.sxv2-prov svg { width: 16px; height: 16px; }
.sxv2-prov.off { opacity: .4; cursor: not-allowed; }
.sxv2-prov small { font-size: 10px; color: var(--muted); }
.sxv2-test { margin: 12px 0 4px; padding-top: 12px; border-top: 1px dashed var(--line); }
.sxv2-test label { display: block; margin-bottom: 7px; font-size: 9px; letter-spacing: .18em; text-transform: uppercase; color: #e9b48a; }
.sxv2-test form { display: flex; gap: 6px; }
.sxv2-test input { flex: 1 1 auto; min-width: 0; height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px; background: rgba(0,0,0,.25); color: var(--ink); font: 300 14px/30px Outfit, sans-serif; outline: none; }
.sxv2-fine { margin: 12px 0 0 !important; font-size: 10.5px !important; opacity: .75; }
.sxv2-stage { position: relative; width: 100%; aspect-ratio: 16/9; border-radius: 10px; overflow: hidden; background: #000; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; overscroll-behavior: contain; }
.sxv2-stage img.bg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; -webkit-touch-callout: none; }
.sxv2-piece { position: absolute; left: 0; top: 0; cursor: grab; touch-action: none; filter: drop-shadow(0 3px 6px rgba(0,0,0,.6)) drop-shadow(0 0 1px rgba(243,235,227,.9)); transition: scale .12s; -webkit-user-drag: none; -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; }
.sxv2-piece.drag { cursor: grabbing; transition: none; scale: 1.08; }
.sxv2-piece.hint { animation: sxv2Nudge 1.6s ease-in-out 2; }
@keyframes sxv2Nudge { 50% { translate: 6px -4px; rotate: 8deg; } }
.sxv2-stage.ok::after { content: "✓"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font: 400 54px/1 Outfit; color: var(--ink); background: rgba(16,14,13,.35); }
.sxv2-stage.bad { animation: sxv2Shake .35s; }
@keyframes sxv2Shake { 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
.sxv2-capbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; font-size: 11px; color: var(--muted); }
.sxv2-ts { max-height: 0; overflow: hidden; opacity: 0; transition: max-height .25s, opacity .25s, margin .25s; }
.sxv2-ts.show { max-height: 140px; opacity: 1; margin-top: 12px; }
.sxv2-ts-note { font-size: 11px; color: #e9b48a; margin-bottom: 6px; }
.sxv2-stage .sxv2-spin { position: absolute; right: 10px; bottom: 10px; width: 18px; height: 18px; border: 2px solid rgba(243,235,227,.25); border-top-color: var(--ink); border-radius: 50%; opacity: 0; pointer-events: none; animation: sxv2Spin .8s linear infinite; transition: opacity .2s; }
.sxv2-stage.busy .sxv2-spin { opacity: 1; }
@keyframes sxv2Spin { to { transform: rotate(360deg); } }
.sxv2-toast { position: fixed; z-index: 80; left: 50%; top: 18px; transform: translateX(-50%); max-width: calc(100vw - 28px); padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px;
  background: rgba(16,14,13,.88); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); color: var(--ink); font: 300 12.5px/1.3 Outfit, system-ui, sans-serif; letter-spacing: .02em; opacity: 0; pointer-events: none; transition: opacity .25s; }
.sxv2-toast.show { opacity: 1; }
.sxv2-pv { display: inline-block; margin-left: 6px; padding: 1px 6px; border: 1px solid #e9b48a; border-radius: 999px; color: #e9b48a; font-size: 7.5px; letter-spacing: .16em; vertical-align: 3px; }
body.clean .sxv2-panel, body.clean .sxv2-tile { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
@media (max-width: 860px) { .sxv2-panel { top: 92px; } }
@media (max-width: 560px) {
  .sxv2-panel { top: calc(134px + env(safe-area-inset-top)); bottom: calc(172px + env(safe-area-inset-bottom)); left: 10px; transform: none; width: calc(100vw - 20px); max-height: none; min-height: 300px; border-radius: 16px; }   /* between the Vote/Leaderboard buttons and the expand + logo corner */
  .sxv2-wrap { align-items: flex-end; }
  .sxv2-sheet { width: 100vw; border-radius: 18px 18px 0 0; padding-bottom: calc(18px + env(safe-area-inset-bottom)); border-bottom: 0; }
  .sxv2-sheet.cap { width: 100vw; }
  .sxv2-play img { width: 50px; height: 28px; }
  .sxv2-btn { min-width: 58px; height: 28px; line-height: 26px; }
  .sxv2-test input { font-size: 16px; }
  .sxv2-acct .who .pre { display: none; }
}

/* ---- Vote / Leaderboard call-to-action (top right, every tab) ---- */
.sxv2-cta { position: fixed; z-index: 37; top: 96px; right: 28px; display: flex; gap: 8px; align-items: center; transition: opacity .3s, visibility .3s; }
.sxv2-cta button { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 16px; border-radius: 999px; cursor: pointer; -webkit-tap-highlight-color: transparent;
  font: 400 11px/1 Outfit, system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; }
.sxv2-cta-vote { position: relative; border: 1px solid var(--ink); background: var(--ink); color: #14110f; box-shadow: 0 0 0 0 rgba(243,235,227,.55), 0 4px 18px rgba(0,0,0,.35); animation: sxv2Glow 2.6s ease-in-out infinite; }
.sxv2-cta-vote svg { width: 13px; height: 13px; fill: #e8833a; filter: drop-shadow(0 0 3px rgba(232,131,58,.6)); }
.sxv2-cta-vote:hover { background: #fff; }
.sxv2-cta-vote.done { background: rgba(16,14,13,.6); color: var(--ink); animation: none; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.sxv2-cta-vote.got { animation: sxv2Got .7s cubic-bezier(.3,1.6,.5,1); }
.sxv2-cta-lb { border: 1px solid rgba(243,235,227,.6); background: rgba(16,14,13,.45); color: var(--ink); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.sxv2-cta-lb:hover, .sxv2-cta-lb:focus-visible { background: rgba(243,235,227,.16); }
@keyframes sxv2Glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(243,235,227,.45), 0 4px 18px rgba(0,0,0,.35); } 50% { box-shadow: 0 0 0 7px rgba(243,235,227,0), 0 0 22px rgba(232,131,58,.45); } }
@keyframes sxv2Got { 0% { scale: 1; } 35% { scale: 1.18; box-shadow: 0 0 26px rgba(232,131,58,.7); } 100% { scale: 1; } }
body.clean .sxv2-cta, body.sxv2-board-on .sxv2-cta { opacity: 0; visibility: hidden; pointer-events: none; }
@media (max-width: 560px) {
  .sxv2-cta { top: calc(92px + env(safe-area-inset-top)); right: 14px; gap: 6px; }
  .sxv2-cta button { height: 32px; padding: 0 12px; font-size: 10px; letter-spacing: .13em; }
}
@media (prefers-reduced-motion: reduce) { .sxv2-cta-vote, .sxv2-cta-vote.got { animation: none; } }
.sxv2-hb { display: flex; gap: 6px; align-items: center; }
.sxv2-panel.done .sxv2-acct { border-color: rgba(232,131,58,.6); }

/* ---- Leaderboard page (#leaderboard) ---- */
.sxv2-board { position: fixed; z-index: 55; inset: 0; overflow-y: auto; overscroll-behavior: contain; background: rgba(10,9,8,.88); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  color: var(--ink); font: 300 13px/1.3 Outfit, system-ui, sans-serif; animation: sxv2In .25s ease-out; }
.sxv2-board[hidden] { display: none; }
@keyframes sxv2In { from { opacity: 0; } }
.sxv2-bin { max-width: 660px; margin: 0 auto; padding: calc(28px + env(safe-area-inset-top)) 18px calc(40px + env(safe-area-inset-bottom)); }
.sxv2-bhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.sxv2-kick { margin: 0 0 8px; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.sxv2-bhead h2 { margin: 0; font: 500 44px/1 "Bodoni Moda", Didot, serif; letter-spacing: -.03em; } .sxv2-bhead h2 em { font-style: italic; font-weight: 400; }
.sxv2-bact { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0 14px; }
.sxv2-bact .sxv2-btn svg { width: 11px; height: 11px; fill: #e8833a; margin-right: 5px; vertical-align: -1px; }
.sxv2-bmeta { margin-left: auto; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.sxv2-blist { list-style: none; margin: 0; padding: 0; }
.sxv2-blist li { display: flex; align-items: center; gap: 10px; padding: 8px 8px; border-bottom: 1px solid rgba(243,235,227,.08); }
.sxv2-blist li.top .sxv2-rk { color: var(--ink); font-size: 22px; } .sxv2-blist li.r1 .sxv2-rk { color: #e8833a; }
.sxv2-blist .sxv2-rk { flex-basis: 30px; }
.sxv2-blist .sxv2-play img { width: 72px; height: 41px; }
.sxv2-blist .sxv2-my { color: #e8833a; font-size: 11px; }
.sxv2-bar { flex: 0 0 120px; height: 4px; border-radius: 4px; background: rgba(243,235,227,.08); overflow: hidden; } .sxv2-bar i { display: block; height: 100%; background: var(--ink); border-radius: 4px; transition: width .6s; }
.sxv2-blist li.r1 .sxv2-bar i { background: #e8833a; }
.sxv2-bfoot { margin: 16px 8px 0; font-size: 11px; color: var(--muted); }
@media (max-width: 560px) { .sxv2-bhead h2 { font-size: 34px; } .sxv2-bar { flex-basis: 44px; } .sxv2-blist .sxv2-play img { width: 56px; height: 32px; } .sxv2-bmeta { margin-left: 0; width: 100%; } }

/* ---- phones/tablets: Turnstile-only check (no star puzzle) ---- */
.sxv2-sheet [hidden] { display: none !important; }
.sxv2-sheet.ts-only .sxv2-capbar { justify-content: flex-start; font-size: 12.5px; color: var(--ink); margin-top: 6px; min-height: 30px; }
.sxv2-sheet.ts-only #sxv2CapNew { margin-left: auto; }
.sxv2-mspin { flex: 0 0 auto; width: 16px; height: 16px; border: 2px solid rgba(243,235,227,.25); border-top-color: var(--ink); border-radius: 50%; animation: sxv2Spin .8s linear infinite; display: none; }
.sxv2-wrap.sxv2-mwait .sxv2-mspin { display: inline-block; }
.sxv2-wrap.sxv2-mok .sxv2-mspin { display: none; }
.sxv2-toast.show button { pointer-events: auto; }   /* the Retry button inside the toast must be tappable */
/* voting deadline notice + countdown */
.sxv2-dl { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin: 2px 6px 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(255,255,255,.05); font-size: 12px; line-height: 1.3; }
.sxv2-dl:empty { display: none; }
.sxv2-dl b { font-weight: 600; letter-spacing: .01em; }
.sxv2-dl .sxv2-cd { font-variant-numeric: tabular-nums; color: var(--muted); white-space: nowrap; }
.sxv2-dl.ended { border-color: rgba(255,255,255,.28); }
.sxv2-dl.ended span { color: var(--muted); }
.sxv2-board .sxv2-dl { margin: 14px 0 6px; font-size: 13px; }
body.sxv2-closed .sxv2-vote, body.sxv2-closed #sxv2CtaVote, body.sxv2-closed #sxv2BVote { display: none !important; }
body.sxv2-closed .sxv2-list .sxv2-btn[aria-pressed] { display: none; }

body:not([data-section="claudia-contest-2"]) .sxv2-cta {display:none}
body[data-section="claudia-contest-2"] .sxv-cta {display:none}
body.round2-empty #film {opacity:.16}
body.round2-empty #credit,body.round2-empty #plAdd,body.round2-empty #sound,body.round2-empty #tapPlay,body.round2-empty #nextRow,body.round2-empty #seek,body.round2-empty .strip,body.round2-empty #xv {display:none!important}
#round2Empty[hidden] {display:none}
#round2Empty {position:fixed;inset:188px 18px 28px;z-index:18;overflow:auto;overscroll-behavior:contain;display:flex;justify-content:center}
.round2-card {width:min(680px,100%);align-self:flex-start;padding:28px 34px;border:1px solid var(--line);border-radius:16px;background:rgba(16,14,13,.88);color:var(--ink);font:300 15px/1.55 "Outfit",system-ui,sans-serif;box-sizing:border-box}
.round2-card h1 {font:italic 400 34px/1.15 "Bodoni Moda",Georgia,serif;margin:8px 0 16px}.round2-card h2 {font-size:17px;margin:22px 0 8px}.round2-kicker {font-size:10px;letter-spacing:.15em}.round2-card li {padding:4px 0}.round2-card ol{padding-left:22px}.round2-card blockquote{margin:8px 0;padding:10px 12px;border-left:2px solid #e8833a;background:rgba(255,255,255,.04)}.round2-card a{color:inherit}.round2-fine{font-size:12px;opacity:.65}.round2-prizes{padding-top:12px;border-top:1px solid var(--line)}
@media(max-width:600px){#round2Empty{inset:179px 12px 16px}.round2-card{padding:20px;font-size:13px}.round2-card h1{font-size:28px}.round2-card h2{font-size:15px;margin-top:18px}}
