* { box-sizing: border-box; }
html, body {
    margin: 0; padding: 0; min-height: 100%;
    background: #1b1330; color: #f3ecff;
    font-family: system-ui, "Segoe UI", Roboto, sans-serif;
    display: flex; align-items: center; justify-content: center;
}
#game-container { width: 100%; max-width: 460px; padding: 12px; text-align: center; }
.rps h2 { margin: 0 0 4px; font-size: 20px; }
.rps-hint { margin: 0 0 10px; opacity: .85; font-size: 13px; }
.rps-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 10px; }
.rps-btn { background: #5b3fa8; color: #fff; border: 0; border-radius: 10px; padding: 10px 12px; font-size: 14px; cursor: pointer; min-width: 120px; }
.rps-btn:disabled { opacity: .45; cursor: default; }
.rps-area { display: flex; gap: 12px; justify-content: center; margin: 10px 0; }
.rps-side { flex: 1; background: #2a2050; border-radius: 10px; padding: 10px; }
.rps-side .lab { font-size: 13px; opacity: .8; }
.rps-side .ch { font-size: 22px; font-weight: 800; min-height: 28px; }
.rps-msg { min-height: 24px; margin: 8px 0; font-size: 16px; font-weight: 700; color: #ffd166; }
.rps-score { font-size: 14px; opacity: .9; }
.rps-bar { display: flex; gap: 8px; justify-content: center; }
.rps-new { background: #3a2f63; }