/* the home page and the server's own pages (rooms, worklog #24): style.css underneath */
body.homePage { height: auto; min-height: 100%; }
.homeMain { max-width: 620px; margin: 0 auto; padding: 28px 18px 60px; display: flex; flex-direction: column; gap: 14px; }
.homeTitle { font-size: 34px; font-weight: 800; color: #ffd166; letter-spacing: .02em; margin: 0; }
.homeTitle a { color: inherit; text-decoration: none; }
.homeLead { font-size: 17px; color: #e8eef2; margin: 4px 0; }
.homeTagline { color: #ffd166; font-size: 18px; font-style: italic; margin-top: -8px; }
.homeSub { color: #9fb3c8; font-size: 15px; }
.homeCard { background: #142130; border: 1px solid #2f4357; border-radius: 14px; padding: 18px 20px; display: flex; flex-direction: column; gap: 10px; }
.homeCard h2 { margin: 0; }
.homeRow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.homeRow label { min-width: 170px; color: #c9d6e3; }
.homeRow select, .homeRow input { flex: 1; min-width: 180px; background: #0c1219; color: #e8eef2; border: 1px solid #2a3a4a; border-radius: 6px; padding: 8px 9px; font: inherit; }
.homePitch { font-size: 13px; color: #9fb3c8; min-height: 18px; }
.homeBtn, button.homeBtn { display: inline-block; min-height: 44px; font-size: 17px; font-weight: 700; padding: 8px 18px; border-radius: 10px; text-decoration: none; }
a.homeBtn { background: #223142; color: #dde6ee; border: 1px solid #2f4357; line-height: 26px; }
.homeBtn.primary { background: #1f6feb; border-color: #1f6feb; color: #fff; }
.homeErr { color: #ff9b9b; min-height: 18px; margin: 0; }
.homeReady { background: #173a22; border: 1px solid #3fb950; border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.homeReady .code, .homeList .code { color: #ffd166; font-weight: 800; letter-spacing: .1em; }
.homeReady .bigCode { font-size: 30px; }
.homeLink { word-break: break-all; color: #4fa3ff; }
.homeList, .homeHistory { padding-left: 20px; } .homeHistory li { margin: 8px 0; } .homeHistory .hv { color: #ffd166; font-weight: 700; } .homeHistory .hc { color: #9fb3c8; font-size: 13px; }
.homeMain a { color: #4fa3ff; }
.homeFoot { color: #7b8d9e; font-size: 13px; }
@media (max-width: 600px) { .homeRow label { min-width: 0; width: 100%; } .homeRow select, .homeRow input { font-size: 16px; } }
/* the waiting page's window on a game in progress (public/wait.js) */
.watchSec { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.watchHead { font-size: 18px; margin: 0; color: #e8eef2; }
.watchBar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.watchTitle { font-weight: 700; color: #ffd166; }
.watchBar .homeBtn { margin-left: auto; min-height: 36px; font-size: 15px; padding: 4px 14px; }
.watchCanvas { width: 100%; height: auto; aspect-ratio: 4 / 3; background: #000; border-radius: 8px; border: 1px solid #2f4357; }