/* 公開のライブボードの部品（/2026/jury/live/live.js が描く .lb の見た目・CEO 2026-10-26）。
   **どの頁にも載せられる**よう、規則は全部 .lb / .lb-card の下に閉じる。頁の帯や本文の色はここに書かない。
   /2026/jury/live/ は gen-live.py がこのファイルを読んで <style> に入れる。LP（PR C）は <link> で読む。
   文字の色は暗い地（--lb-bg）の上で読める値。scripts/check-contrast.py はクリーム地（--paper）で測るので、
   地を持たない規則では hex を直書きせず、この印で持つ */
:root{--lb-bg:#070b1f;--lb-ink:#eef2ff;--lb-dim:#9aa6c8;--lb-line:rgba(255,255,255,.1);--fc:#45c8ff;
  --lb-link:#b9c6ff;--lb-warn:#ffd9a8;--lb-rose:#ffd0d8;--lb-deep:#0a0f2a;--lb-sum:#cbd3ee;--lb-cta:#ffd43b;--lb-cta-hover:#ffe066;
  /* JS が要素ごとに上書きする印の既定（行の番号・回る秒数・タブの色） */
  --i:0;--rot:10s;--tc:#45c8ff}
/* ── 盤 ──────────────────────────────────────────── */
.lb{position:relative;min-height:calc(100svh - 56px);overflow:hidden;isolation:isolate;
  font-family:"Space Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans JP",sans-serif}
.lb h1,.lb h2{font-family:inherit;border:0;padding:0}
/* 背景の絵（4枚・assets/award/vote-open-261025・CEO 2026-10-26「これ背景に使って欲しい」）。full-bleed・中央やや上寄せ。
   分野が変わるたびに次の絵へクロスフェード（prefers-reduced-motion では 1 枚のまま） */
.lb-photo{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--lb-bg)}
.lb-ph{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.lb-ph.on{opacity:1}
.lb-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;display:block}
.lb canvas.lb-bg{position:absolute;inset:0;width:100%;height:100%;z-index:1;display:block}
.lb-grid{position:absolute;inset:0;z-index:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));
  gap:6px;padding:6px;opacity:.12;overflow:hidden;align-content:start}
.lb-grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;display:block;filter:saturate(.8)}
/* 読みやすさのための暗い幕。上下を濃く、中央は絵が見える程度 */
.lb-veil{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,11,31,.88) 0%,rgba(7,11,31,.46) 26%,rgba(7,11,31,.40) 56%,rgba(7,11,31,.95) 100%)}
.lb-ui{position:relative;z-index:3;max-width:1280px;margin:0 auto;padding:18px 16px 28px;display:grid;gap:14px}
.lb-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.lb-live{display:inline-flex;align-items:center;gap:8px;font-weight:700;letter-spacing:.18em;font-size:13px;
  padding:5px 10px;border:1px solid rgba(255,80,110,.6);border-radius:999px;color:var(--lb-rose)}
.lb-live .dot{width:9px;height:9px;border-radius:50%;background:#ff4f6e;box-shadow:0 0 0 0 rgba(255,79,110,.7);animation:lb-pulse 1.6s ease-out infinite}
@keyframes lb-pulse{0%{box-shadow:0 0 0 0 rgba(255,79,110,.7)}100%{box-shadow:0 0 0 12px rgba(255,79,110,0)}}
.lb-h1{margin:0;font-size:clamp(18px,2.6vw,26px);font-weight:700;letter-spacing:.02em;line-height:1.1}
.lb-h1 small{display:block;font-size:11px;font-weight:500;letter-spacing:.2em;color:var(--lb-dim);text-transform:uppercase}
.lb-asof{color:var(--lb-dim);font-size:13px;font-variant-numeric:tabular-nums}
.lb-cta{margin:0;display:inline-flex;align-items:center;gap:8px;order:9}
.lb-vote{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border-radius:999px;
  background:var(--lb-cta);color:var(--lb-deep);font-weight:700;font-size:16px;letter-spacing:.02em;text-decoration:none;
  box-shadow:0 6px 24px rgba(255,212,59,.35);border:2px solid var(--lb-cta)}
.lb-vote:hover{background:var(--lb-cta-hover);border-color:var(--lb-cta-hover)}
.lb-vote:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lb-gal{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--lb-line);
  color:var(--lb-ink);text-decoration:none;font-size:13px;background:rgba(255,255,255,.07)}
.lb-gal:hover{background:rgba(255,255,255,.14)}
.lb-cd{margin-left:auto;text-align:right;line-height:1.05}
.lb-cd b{display:block;font-size:clamp(20px,3vw,30px);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.lb-cd small{color:var(--lb-dim);font-size:11px;letter-spacing:.08em}
.lb-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.lb-stat{background:rgba(255,255,255,.05);border:1px solid var(--lb-line);border-radius:10px;padding:8px 12px;backdrop-filter:blur(6px)}
.lb-stat b{display:block;font-size:clamp(20px,2.4vw,28px);font-variant-numeric:tabular-nums;line-height:1.1}
.lb-stat span{color:var(--lb-dim);font-size:12px}
.lb-field{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-top:6px}
.lb-fieldno{font-size:12px;letter-spacing:.22em;color:var(--lb-dim);text-transform:uppercase}
.lb-fieldname{margin:0;font-size:clamp(34px,7vw,76px);font-weight:700;line-height:.95;letter-spacing:-.01em;
  color:var(--fc);text-shadow:0 0 28px color-mix(in srgb,var(--fc) 55%,transparent),0 2px 0 rgba(0,0,0,.4);
  transition:color .4s}
.lb-cast{font-size:14px;color:var(--lb-dim);font-variant-numeric:tabular-nums}
/* ⏸/▶ と残りの秒数（「分野 n / 10」の隣）。止まっている理由が何であれ、ここが ▶ なら押せば回り出す */
.lb-ctl{appearance:none;border:1px solid var(--lb-line);background:rgba(255,255,255,.07);color:var(--lb-ink);border-radius:999px;
  height:26px;padding:0 10px 0 9px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font:600 12px/1 inherit;
  font-variant-numeric:tabular-nums;align-self:center}
.lb-ctl i{font-style:normal;font-size:11px}
.lb-ctl b{min-width:2.2em;text-align:left;font-weight:600}
.lb-ctl.off{color:var(--lb-rose);border-color:rgba(255,80,110,.5)}
.lb-ctl:hover{background:rgba(255,255,255,.14)}
.lb-main{position:relative;min-height:420px}
.lb-rank{list-style:none;margin:0;padding:0;display:grid;gap:7px}
/* 広い画面では 1〜5 を左、6〜10 を右（横に読ませない） */
@media (min-width:960px){.lb-rank{grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-template-rows:repeat(5,auto)}}
.lb-item{animation:lb-in .5s ease both;min-width:0}
.lb-item:nth-child(n+2){animation-delay:calc(var(--i) * 45ms)}
/* 札はその作品のギャラリーの頁へのリンク（kiosk では span）。色は継承、下線は無し */
.lb-row{display:grid;grid-template-columns:52px 60px 1fr auto;align-items:center;gap:10px;
  padding:7px 12px 7px 8px;border-radius:12px;background:rgba(10,16,44,.72);border:1px solid var(--lb-line);
  backdrop-filter:blur(8px);position:relative;overflow:hidden;color:inherit;text-decoration:none;cursor:default}
a.lb-row{cursor:pointer}
a.lb-row:hover{border-color:color-mix(in srgb,var(--fc) 55%,transparent);background:rgba(14,22,60,.86)}
a.lb-row:focus-visible,a.lb-mini:focus-visible,.lb-ctl:focus-visible,.lb-tab:focus-visible{outline:3px solid #fff;outline-offset:2px}
@keyframes lb-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.lb-row.r1{border-color:color-mix(in srgb,var(--fc) 70%,transparent);background:rgba(14,22,60,.78)}
.lb-row.r1 .lb-badge{background:var(--fc);color:var(--lb-deep);box-shadow:0 0 18px color-mix(in srgb,var(--fc) 70%,transparent)}
.lb-row.r2 .lb-badge{background:#dfe6ff;color:#0a0f2a}
.lb-row.r3 .lb-badge{background:#c9a86a;color:#0a0f2a}
.lb-badge{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:700;font-size:20px;
  background:rgba(255,255,255,.1);color:var(--lb-ink);font-variant-numeric:tabular-nums}
.lb-thumb{width:60px;height:60px;border-radius:10px;object-fit:cover;background:#121a3f;display:block;border:1px solid var(--lb-line)}
.lb-row.r1 .lb-thumb{width:60px;height:60px}
.lb-meta{min-width:0}
.lb-title{display:block;font-weight:700;font-size:15px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-creator{display:block;color:var(--lb-dim);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-bar{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.08);margin-top:6px;overflow:hidden}
.lb-bar i{display:block;height:100%;width:0;border-radius:3px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--fc) 60%,#fff 0%),var(--fc));transition:width .9s cubic-bezier(.2,.8,.2,1)}
.lb-score{text-align:right;font-variant-numeric:tabular-nums;line-height:1}
.lb-score b{display:block;font-size:20px}
.lb-score small{color:var(--lb-dim);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.lb-rest{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px;color:var(--lb-dim);font-size:12px}
.lb-rest .lb-mini{display:inline-flex;align-items:center;gap:5px;padding:3px 8px 3px 3px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid var(--lb-line);color:var(--lb-ink);font-size:12px;max-width:220px;text-decoration:none}
a.lb-mini:hover{border-color:color-mix(in srgb,var(--fc) 55%,transparent);background:rgba(255,255,255,.12)}
.lb-mini img{width:24px;height:24px;border-radius:50%;object-fit:cover;background:#121a3f}
.lb-mini span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-mini em{font-style:normal;color:var(--lb-dim);font-variant-numeric:tabular-nums}
.lb-empty{color:var(--lb-dim);padding:24px 0}
.lb-tabs{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-top:4px}
.lb-tab{appearance:none;border:0;background:rgba(255,255,255,.07);border-radius:6px;height:34px;padding:0 6px;cursor:pointer;
  position:relative;overflow:hidden;color:var(--lb-dim);font:600 11px/1 inherit;letter-spacing:.02em;text-align:left;white-space:nowrap;text-overflow:ellipsis}
.lb-tab span{position:relative;z-index:1;display:block;overflow:hidden;text-overflow:ellipsis}
.lb-tab i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--tc);opacity:.75}
.lb-tab[aria-current]{color:var(--lb-deep);background:color-mix(in srgb,var(--tc) 28%,rgba(255,255,255,.07))}
/* いまの分野の帯は JS が同じ時計から幅を書く（⏸/▶ の秒数と必ず一致する。CSS の animation だと再開のときにずれた） */
.lb-tab[aria-current] i{transition:width .2s linear}
.lb-note{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--lb-dim);font-size:12px;margin:0}
.lb-note .lb-frozen{color:var(--lb-warn)}
.lb-note .lb-paused{color:var(--lb-rose)}
.lb-note a{color:var(--lb-link)}
.lb-bgoff{color:var(--lb-dim);font-size:12px}
/* 浮かぶ札（縦 2:3）。乗っているあいだだけ。pointer-events は無し（指の端末で出したときだけ押せる） */
.lb-card{position:fixed;z-index:80;left:0;top:0;width:min(320px,calc(100vw - 24px));pointer-events:none;opacity:0;
  transition:opacity .16s ease;background:rgba(8,12,34,.95);border:1px solid var(--lb-line);border-radius:14px;overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.55);display:grid;color:var(--lb-ink);font-size:12.5px;line-height:1.4;text-align:left}
.lb-card.on{opacity:1}
.lb-card.touch{pointer-events:auto}
.lb-card-pic{display:block;aspect-ratio:16/9;background:#121a3f;border-bottom:2px solid var(--fc)}
.lb-card-pic img{width:100%;height:100%;object-fit:cover;display:block}
.lb-card-body{display:grid;gap:4px;padding:10px 12px 12px}
.lb-card-field{color:var(--fc);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.lb-card-title{font-size:14.5px;line-height:1.25}
.lb-card-creator{color:var(--lb-dim)}
.lb-card-rank{font-variant-numeric:tabular-nums;color:var(--lb-dim)}
.lb-card-rank em{font-style:normal;font-weight:700;color:var(--fc)}
.lb-card-rank b{color:var(--lb-ink)}
.lb-card-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.lb-card-chips span{display:inline-flex;gap:4px;align-items:baseline;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.08);font-size:11px;color:var(--lb-dim)}
.lb-card-chips b{color:var(--lb-ink);font-variant-numeric:tabular-nums}
.lb-card-sum{color:var(--lb-sum);font-size:12px;margin-top:4px;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.lb-card-go{display:none;margin-top:8px;text-align:center;padding:9px;border-radius:8px;background:var(--fc);color:var(--lb-deep);font-weight:700;text-decoration:none}
.lb-card.touch .lb-card-go{display:block}
/* クレジット（頁の下に固定・7言語とも同じ1行）。Marsha Arancia が写っているので表示時に必須 */
.lb-credit{position:fixed;right:10px;bottom:8px;z-index:70;margin:0;font-size:11px;line-height:1.3;color:var(--lb-dim);
  background:rgba(7,11,31,.66);padding:4px 9px;border-radius:6px;backdrop-filter:blur(4px);max-width:calc(100vw - 20px)}
.lb-credit a{color:var(--lb-dim)}
@media (max-width:720px){
  .lb-ui{padding:12px 12px 92px}   /* 下に固定した「投票する」の帯のぶん空ける（帯に隠れる行を作らない） */
  .lb-cd{margin-left:0;text-align:left;flex-basis:100%}
  .lb-cta{position:fixed;left:0;right:0;bottom:0;z-index:75;margin:0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(7,11,31,0),rgba(7,11,31,.92) 40%);display:flex;gap:8px}
  .lb-vote{flex:1 1 auto;min-height:48px;font-size:17px}
  /* 狭い画面では固定にしない（順位の札の上に被る）。盤の最後に 1 行、流れの中に置く */
  .lb-credit{position:static;margin:0 12px 10px;display:inline-block;max-width:none}
  .lb-row{grid-template-columns:40px 48px 1fr auto;gap:8px;padding:6px 10px 6px 6px}
  .lb-badge{width:34px;height:34px;font-size:16px;border-radius:9px}
  .lb-thumb,.lb-row.r1 .lb-thumb{width:48px;height:48px}
  .lb-score b{font-size:16px}
  .lb-tabs{grid-template-columns:repeat(5,1fr)}
  .lb-tab{height:28px;font-size:10px}
}
/* 会場の画面（kiosk）: 盤だけ・リンクも主ボタンも無し（頁の外枠を消すのは頁側の CSS） */
.lb.kiosk .lb-cta{display:none}
.lb.kiosk .lb-ui{padding-bottom:28px}
.lb.kiosk{min-height:100svh}
/* LP の最初の画面に載せる compact（上位 5・数字 3 つ・主ボタン・「ライブボードを見る →」）。高さは 100svh 前後 */
.lb.compact{min-height:100svh}
.lb.compact .lb-rest,.lb.compact .lb-cd,.lb.compact .lb-asof{display:none}
/* 脚注のうち、キーの案内と「一時停止中」は出さない。**凍結の一文は compact でも出す** —
   締切前 24 時間は数字が止まっているので、止まっていることを隠さない（何も無ければ脚注は高さ 0） */
.lb.compact .lb-note .lb-keys,.lb.compact .lb-note .lb-paused{display:none}
.lb.compact .lb-stats{grid-template-columns:repeat(3,1fr)}
.lb.compact .lb-rank{grid-template-columns:1fr;grid-auto-flow:row;grid-template-rows:none;max-width:760px;gap:4px}
.lb.compact .lb-main{min-height:0}
/* **最初の画面に収める密度**（1440×900 で、上位 5 と分野のタブまでが帯の上に入る）。
   フルの盤より分野名を小さく、札を詰める。幅 760px の 1 列（右は背景の絵を見せる） */
.lb.compact .lb-ui{gap:8px;padding-bottom:6px}
.lb.compact .lb-fieldname{font-size:clamp(30px,4.6vw,56px)}
.lb.compact .lb-field{margin-top:0}
/* 数字 3 つ（投票者／投票済み／10 分野そろえた人）。**キャラクターの絵の上では、ガラスの札は読めなかった**
   （CEO 2026-10-26・1920）。不透明の暗い地、数字は 1440 で 32px 以上、ラベルは 13px で地の文字色。
   左に寄せた 1 つの群（最大 720px）にして、絵の上まで横いっぱいに伸ばさない。compact だけ（フルの盤はそのまま） */
.lb.compact .lb-stats{grid-template-columns:repeat(3,minmax(0,1fr));max-width:720px;gap:8px}
.lb.compact .lb-stat{padding:9px 14px 10px;background:var(--lb-deep);border-color:rgba(255,255,255,.16);backdrop-filter:none;border-radius:12px}
.lb.compact .lb-stat span{font-size:13px;color:var(--lb-ink);line-height:1.3;display:block;margin-top:2px}
.lb.compact .lb-stat b{font-size:clamp(30px,2.6vw,40px);line-height:1}
/* 分野名と「この分野に入った票 N」の後ろにも、控えめな暗い板（どの絵の上でも読める） */
.lb.compact .lb-field{width:fit-content;max-width:100%;padding:8px 16px 10px 14px;border-radius:14px;
  background:rgba(7,11,31,.78);box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.lb.compact .lb-row{padding:4px 10px 4px 6px}
.lb.compact .lb-badge{width:34px;height:34px;font-size:16px;border-radius:9px}
.lb.compact .lb-h1 small{display:none}   /* 載せた頁の帯に同じ名前がある */
.lb.compact .lb-thumb,.lb.compact .lb-row.r1 .lb-thumb{width:44px;height:44px}
.lb.compact .lb-row{grid-template-columns:44px 52px 1fr auto}
.lb.compact .lb-title{font-size:14px}
.lb.compact .lb-bar{margin-top:4px;height:5px}
.lb.compact .lb-score b{font-size:17px}
.lb.compact .lb-tabs{margin-top:0}
.lb.compact .lb-tab{height:28px}
.lb.compact .lb-more{display:inline-flex}
.lb.compact .lb-credit{position:static;margin:0 16px 6px;display:inline-block;max-width:none;font-size:10.5px}   /* 分野のタブの上に被らない */
.lb-more{display:none;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--lb-line);
  color:var(--lb-ink);text-decoration:none;font-size:13px;background:rgba(255,255,255,.07)}
.lb-more:hover{background:rgba(255,255,255,.14)}
@media (prefers-reduced-motion:reduce){
  .lb-item{animation:none}.lb-live .dot{animation:none}.lb-bar i{transition:none}
  .lb-ph{transition:none}.lb-card{transition:none}.lb-tab[aria-current] i{transition:none}
}

/* 暫定値の注記（CEO 2026-10-26「ランキング全ページに明記」）。compact でも kiosk でも出す */
.lb-prov{margin:10px 0 0;font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.72)}
/* 注記とクレジットは1つの行（.lb-foot）。compact（LP の最初の画面）では 100svh に収めるため、2行に分けない（2026-10-26・1440×900 で 22px 足りなかった） */
.lb-foot{margin:8px 0 0;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;font-size:12px;line-height:1.5;color:rgba(255,255,255,.72)}
.lb.compact .lb-foot{font-size:10.5px;line-height:1.3;margin-top:4px}
.lb.compact .lb-credit{position:static;margin:0;display:inline;max-width:none;font-size:inherit}