select { font: inherit; color: inherit; }
button:focus-visible, select:focus-visible, .dream-form input:focus-visible {
  outline: 3px solid #9181ce;
  outline-offset: 3px;
}
.lobby-games { display: grid; gap: 12px; margin-top: 28px; max-width: 550px; }
.game-card { display: flex; gap: 14px; align-items: center; text-align: left; padding: 17px; border: 1px solid #e2ddd4; border-radius: 17px; background: #fffaf4; color: #24273a; width: 100%; }
.game-card.selected { border-color: #fb806b; background: #fff; box-shadow: 0 5px 18px #f1806812; }
.game-card-icon { display: grid; place-items: center; flex: 0 0 46px; width: 46px; height: 46px; border-radius: 13px; color: #f46e54; background: #fff0e6; font-size: 30px; }
.game-card-icon.dream-icon { color: #8062b7; background: #eee7fa; }
.game-card strong { display: block; font-size: 17px; }
.game-card small { display: block; font-size: 12px; line-height: 1.6; color: #81808a; margin-top: 4px; }
.game-card-check { margin-left: auto; color: #f46e54; opacity: 0; }
.game-card.selected .game-card-check { opacity: 1; }
.welcome .mini-steps { margin-top: 25px; }
.mode-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 0 0 24px; }
.mode-bar label { font-size: 13px; font-weight: 700; }
.mode-bar select { min-height: 44px; padding: 9px 32px 9px 12px; border: 1px solid #e3dfd7; border-radius: 10px; background: #fff; font-size: 14px; max-width: 100%; }
.mode-bar > span { font-size: 12px; color: #8c8892; }
.mode-bar select:disabled, .dream-settings select:disabled { opacity: 1; color: #686175; background: #f8f5fb; }
.game[data-mode="dream"] .score { display: none; }
.game[data-mode="dream"] .round-bar { min-height: 95px; }
.game[data-mode="dream"] .phase-label { background: #eee8f7; color: #7859a4; }
.dream-panel { background: linear-gradient(155deg, #fffcf7, #f9f4ff); border: 1px solid #e6dfea; border-radius: 24px; padding: 28px; text-align: center; }
.dream-settings { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; text-align: left; }
.dream-settings label { display: flex; flex-direction: column; gap: 9px; font-size: 13px; font-weight: 700; color: #71647d; min-width: 0; }
.dream-settings select { width: 100%; min-width: 0; height: 46px; padding: 0 10px; border: 1px solid #dfd6e8; background: white; border-radius: 11px; font-size: 16px; }
.dream-rule { color: #8a7f92; font-size: 12px; line-height: 1.7; margin: 14px 0 23px; text-align: left; }
.dream-players { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.dream-person { min-width: 0; padding: 21px 12px; border: 1px dashed #d5c8e2; background: #ffffffab; border-radius: 17px; }
.dream-person.is-ready { border-style: solid; border-color: #bba4d5; background: #fff; }
.dream-person-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 700; }
.dream-person-value { display: block; margin: 10px 0; font-size: 44px; line-height: 1.2; color: #8061ad; font-variant-numeric: tabular-nums; }
.dream-person small { display: block; font-size: 12px; color: #95899e; line-height: 1.5; }
.dream-form { text-align: left; margin-top: 24px; }
.dream-form > label { display: block; margin-bottom: 10px; font-size: 14px; font-weight: 700; }
.dream-submit-row { display: flex; gap: 12px; }
.dream-submit-row input { width: 100%; min-width: 0; flex: 1; height: 52px; border: 1px solid #d9cfe4; border-radius: 12px; background: #fff; color: #564266; font-size: 22px; padding: 0 16px; }
.dream-submit-row .button { flex-shrink: 0; padding: 0 23px; }
.dream-panel .button-primary { background: #8765b3; box-shadow: 0 8px 18px #8061ad20; }
.dream-panel .button-primary:hover:not(:disabled) { background: #7754a4; }
.dream-form small { display: block; font-size: 12px; color: #8c8197; margin-top: 10px; line-height: 1.6; }
.dream-status { font-size: 13px; line-height: 1.7; color: #8a7d96; margin: 20px 0 12px; }
#dream-start { min-width: 200px; min-height: 48px; padding: 12px 28px; }
#dream-reset { color: #8a7d96; background: transparent; border-color: #e4daeb; }
.dream-result { margin-top: 22px; border-radius: 18px; padding: 20px; background: #f0edf7; color: #746784; animation: dream-appear .35s ease-out; }
.dream-result.is-success { background: #fff0d5; color: #a67433; }
.dream-result-icon { font-size: 42px; line-height: 1; }
.dream-equation { font-size: 19px; font-weight: 700; font-variant-numeric: tabular-nums; }
.dream-result h3 { font-size: 28px; margin: 10px 0; }
#dream-result-text { font-size: 14px; line-height: 1.8; margin: 0; }
@keyframes dream-appear { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .dream-result { animation: none; } }
@media (max-width: 760px) {
  .side-column { align-items: stretch; }
  .lobby-games { margin-top: 22px; gap: 10px; max-width: none; }
  .game-card { padding: 13px; gap: 11px; }
  .game-card strong { font-size: 16px; }
  .game-card small { font-size: 11px; }
  .mode-bar { gap: 9px; margin-bottom: 17px; }
  .mode-bar select { flex: 1; font-size: 16px; }
  .mode-bar > span { width: 100%; font-size: 11px; }
  .game[data-mode="dream"] .game-grid { grid-template-columns: 1fr; }
  .game[data-mode="dream"] .round-bar { min-height: auto; }
  .dream-panel { padding: 18px; border-radius: 19px; }
  .dream-settings { gap: 10px; }
  .dream-rule { margin-bottom: 17px; }
  .dream-players { gap: 10px; }
  .dream-person { padding: 17px 7px; }
  .dream-person-name { font-size: 12px; }
  .dream-person-value { font-size: 35px; }
  .dream-person small { font-size: 10px; }
  .dream-submit-row { gap: 9px; }
  .dream-submit-row .button { padding: 0 14px; font-size: 14px; }
  .dream-result { padding: 18px 12px; }
  .dream-result h3 { font-size: 23px; }
  .dream-equation { font-size: 16px; }
  #dream-result-text { font-size: 13px; }
  #dream-start { width: 100%; min-width: 0; }
}
@media (max-width: 340px) {
  .dream-panel { padding: 14px; }
  .dream-settings label { font-size: 12px; }
  .dream-settings select { font-size: 14px; }
  .dream-submit-row { flex-direction: column; }
  .dream-submit-row .button { min-height: 48px; }
}