/* カラフル版（10/23 三科さん OK）。html[data-cx="c8"] のときだけ効く。章ごとに地と字の色を持ち、アメーバと固定の部品は 55% の所の章の色。
   作り元: motion/COLOR8（色の値は motion/COLOR8/scenes.json）。社内レビューで 2 パターンを見比べる間は左下に切り替えの部品を出していたが、10/23 の社内レビューでカラフル版に決まり、部品は本線から外した */
html[data-pal="c8-s1"]{--bg:#0b0b0d;--ink:#f3f3f0;--mid:#a6a6a2;--ac:#d4ff3a;--on-ac:#0b0b0d;--mid-ac:#55554f;--uv:#7b4dff;--sq:#d4ff3a}
html[data-pal="c8-s2"]{--bg:#2a46e0;--ink:#ffffff;--mid:#d7ddff;--ac:#f5c518;--on-ac:#14163d;--mid-ac:#4d4216;--uv:#f5c518;--sq:#f5c518}
html[data-pal="c8-s3"]{--bg:#15102b;--ink:#f1edff;--mid:#b9b0e0;--ac:#ff4fa3;--on-ac:#ffffff;--mid-ac:#ffffff;--uv:#ff4fa3;--sq:#ff4fa3}
html[data-pal="c8-s4"]{--bg:#0b0c0e;--ink:#eef6f7;--mid:#9fb2b5;--ac:#5ecfd8;--on-ac:#2b1a8f;--mid-ac:#3a1db8;--uv:#5ecfd8;--sq:#5ecfd8}
html[data-pal="c8-s5"]{--bg:#15102b;--ink:#f1edff;--mid:#b9b0e0;--ac:#efeee8;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#5ecfd8;--sq:#5ecfd8}
html[data-pal="c8-s6"]{--bg:#36f0b5;--ink:#2b1a8f;--mid:#3a1db8;--ac:#fff23d;--on-ac:#1f35d6;--mid-ac:#2a46e0;--uv:#6d3cf0;--sq:#2b1a8f}
html[data-pal="c8-s7"]{--bg:#15102b;--ink:#f1edff;--mid:#b9b0e0;--ac:#fff23d;--on-ac:#1f35d6;--mid-ac:#2a46e0;--uv:#2a46e0;--sq:#1f35d6}
html[data-pal="c8-s8"]{--bg:#8c4bff;--ink:#ffffff;--mid:#ffffff;--ac:#d4ff3a;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#d4ff3a;--sq:#d4ff3a}
html[data-pal="c8-s9"]{--bg:#ff8a1f;--ink:#15102b;--mid:#2b1a8f;--ac:#15102b;--on-ac:#f1edff;--mid-ac:#b9b0e0;--uv:#15102b;--sq:#15102b}
html[data-pal="c8-s10"]{--bg:#15102b;--ink:#f1edff;--mid:#b9b0e0;--ac:#d4ff3a;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#7b4dff;--sq:#d4ff3a}
html[data-pal="c8-pa"]{--bg:#2a46e0;--ink:#ffffff;--mid:#d7ddff;--ac:#ff4fa3;--on-ac:#ffffff;--mid-ac:#ffffff;--uv:#f5c518;--sq:#ff4fa3}
html[data-pal="c8-pb"]{--bg:#ff8a1f;--ink:#15102b;--mid:#2b1a8f;--ac:#d4ff3a;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#15102b;--sq:#d4ff3a}
html[data-pal="c8"]{--bg:#0b0b0d;--ink:#f3f3f0;--mid:#a6a6a2;--ac:#d4ff3a;--on-ac:#0b0b0d;--mid-ac:#55554f;--uv:#7b4dff;--sq:#d4ff3a}
html[data-cx="c8"] #fv{--bg:#0b0b0d;--ink:#f3f3f0;--mid:#a6a6a2;--ac:#d4ff3a;--on-ac:#0b0b0d;--mid-ac:#55554f;--uv:#7b4dff;--sq:#d4ff3a}
html[data-cx="c8"] #reel{--bg:#0b0b0d;--ink:#f3f3f0;--mid:#a6a6a2;--ac:#d4ff3a;--on-ac:#0b0b0d;--mid-ac:#55554f;--uv:#7b4dff;--sq:#d4ff3a}
html[data-cx="c8"] #about{--bg:#2a46e0;--ink:#ffffff;--mid:#d7ddff;--ac:#f5c518;--on-ac:#14163d;--mid-ac:#4d4216;--uv:#f5c518;--sq:#f5c518}
html[data-cx="c8"] #portal-a{--bg:#2a46e0;--ink:#ffffff;--mid:#d7ddff;--ac:#ff4fa3;--on-ac:#ffffff;--mid-ac:#ffffff;--uv:#f5c518;--sq:#ff4fa3}
html[data-cx="c8"] .about2{--bg:#15102b;--ac:#ff4fa3;--on-ac:#ffffff;--mid-ac:#ffffff;--ink:#ffffff;--mid:#ffffff;--uv:#ff4fa3;--sq:#ffffff}
html[data-cx="c8"] #what{--bg:#0b0c0e;--ac:#5ecfd8;--on-ac:#2b1a8f;--mid-ac:#3a1db8;--ink:#2b1a8f;--mid:#3a1db8;--uv:#5ecfd8;--sq:#2b1a8f}
html[data-cx="c8"] #work{--bg:#15102b;--ink:#f1edff;--mid:#b9b0e0;--ac:#efeee8;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#5ecfd8;--sq:#5ecfd8}
html[data-cx="c8"] #how{--bg:#36f0b5;--ink:#2b1a8f;--mid:#3a1db8;--ac:#fff23d;--on-ac:#1f35d6;--mid-ac:#2a46e0;--uv:#6d3cf0;--sq:#2b1a8f}
html[data-cx="c8"] #cases{--bg:#15102b;--ac:#fff23d;--on-ac:#1f35d6;--mid-ac:#2a46e0;--ink:#1f35d6;--mid:#2a46e0;--uv:#2a46e0;--sq:#1f35d6}
html[data-cx="c8"] #circuit{--bg:#8c4bff;--ink:#ffffff;--mid:#ffffff;--ac:#d4ff3a;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#d4ff3a;--sq:#d4ff3a}
html[data-cx="c8"] #team{--bg:#ff8a1f;--ink:#15102b;--mid:#2b1a8f;--ac:#15102b;--on-ac:#f1edff;--mid-ac:#b9b0e0;--uv:#15102b;--sq:#15102b}
html[data-cx="c8"] #portal-b{--bg:#ff8a1f;--ink:#15102b;--mid:#2b1a8f;--ac:#d4ff3a;--on-ac:#15102b;--mid-ac:#3e3566;--uv:#15102b;--sq:#d4ff3a}
html[data-cx="c8"] #contact{--bg:#15102b;--ac:#d4ff3a;--on-ac:#15102b;--mid-ac:#3e3566;--ink:#15102b;--mid:#3e3566;--uv:#7b4dff;--sq:#15102b}
html[data-cx="c8"] main>section:not(.ac){background:var(--bg);color:var(--ink)}
html[data-cx="c8"] #what+.band--rev{--ac:#5ecfd8;--bg:#15102b}
html[data-cx="c8"] #how+.band{background:#36f0b5;--ac:#fff23d}
html[data-cx="c8"] #circuit .log{background:#6d3ac7;color:var(--ink)}
html[data-cx="c8"] #circuit .log .c{color:var(--mid)}
html[data-cx="c8"] #circuit .log__bar{border-bottom-color:#8d65d3}
html[data-cx="c8"] .log__bar::before{background:var(--uv)}
html[data-cx="c8"] #circuit .quote__t,html[data-cx="c8"] #circuit .quote__label{mix-blend-mode:normal;color:var(--ink)}
html[data-cx="c8"] #circuit .quote__cells i{background:#2b1a8f}
/* 切り替えの部品（社内レビューの間だけ）。本線は字組みの案で隠しているので出す。PC は左下、スマホは上の真ん中 */
html[data-ty] .pal{display:block}
.pal{left:12px;top:auto;bottom:16px;transform:none}
@media (max-width:760px),(pointer:coarse){.pal{left:50%;top:12px;bottom:auto;transform:translateX(-50%)}.pal__list{width:180px;margin-left:-90px}}
.pal__b .pal__name{display:inline}