/* Shared case palette. Attributes replace each other; no colour overlays are mounted. */
html[data-arcade-case="red"] { --case:#b52d48; --case-light:#e86676; --case-shade:#7f1834; --case-dark:#3e0d21; --case-glint:#ffb497; }
html[data-arcade-case="green"] { --case:#328c50; --case-light:#79c777; --case-shade:#1d623d; --case-dark:#0c3024; --case-glint:#bcf0a3; }
html[data-arcade-case="blue"] { --case:#246eab; --case-light:#69b4da; --case-shade:#184873; --case-dark:#0b233d; --case-glint:#b7e8f4; }
html[data-arcade-case="purple"] { --case:#73469d; --case-light:#ae87cc; --case-shade:#4b2a70; --case-dark:#241738; --case-glint:#e4b6f2; }
html[data-arcade-case="white"] { --case:#c8cfd5; --case-light:#f3f3ea; --case-shade:#8796a4; --case-dark:#354655; --case-glint:#fffdf0; }
html[data-arcade-case="yellow"] { --case:#cca029; --case-light:#f2d26c; --case-shade:#997017; --case-dark:#4e350f; --case-glint:#fff0aa; }
html[data-arcade-case="pink"] { --case:#bc537e; --case-light:#ed97b6; --case-shade:#823557; --case-dark:#411f35; --case-glint:#ffd0de; }

/* Only the physical frame uses the palette. The existing page, game and
   player chrome backgrounds keep their own styles. Snake has its own case. */
html[data-arcade-surface="player"] #game-wrap { border:3px solid var(--case); }
html[data-arcade-surface="player"] body.player--console #game-wrap { border:0; }
.profile-case-picker { display:grid; grid-template-columns:repeat(auto-fit,minmax(76px,1fr)); gap:8px; padding:8px 14px 16px; }
.profile-case-choice { min-height:64px; border:2px solid transparent; border-radius:10px; padding:7px 3px; background:var(--panel,#151b22); color:var(--txt,#f2f2f7); font-size:10px; }
.profile-case-choice i { display:block; margin:0 auto 6px; width:30px; height:20px; background:var(--preview-case); border-radius:4px; }
.profile-case-choice[aria-pressed="true"] { border-color:var(--acc,#a78bfa); }
.profile-case-choice:focus-visible { outline:2px solid var(--acc,#a78bfa); outline-offset:2px; }
.profile-case-dot { display:block; width:18px; height:18px; border-radius:4px; background:var(--case); }
