/* ==============================================
   STYLES JEU SPYFALL
   ============================================== */

.sf-section { max-width: 560px; }
.sf-round { font-size: 0.55em; color: #636e72; font-weight: 600; }
.sf-subtitle { font-size: 0.9em; color: #636e72; }
.sf-wait { font-style: italic; color: #636e72; }
.sf-error { color: #d63031; font-weight: bold; min-height: 1em; }
.sf-rules { margin: 10px 0; font-size: 0.9em; text-align: left; }
.sf-rules summary { cursor: pointer; font-weight: 600; }
.sf-players { margin: 0 0 12px 0; }
.sf-players li { font-size: 0.95em; padding: 6px 8px; text-align: left; overflow-wrap: anywhere; }
.sf-minutes { margin-bottom: 12px; }
.sf-minutes span { display: block; margin-bottom: 6px; font-size: 0.9em; }
.sf-minutes button { width: auto; display: inline-block; margin: 2px; padding: 8px 12px; background: #d6eaf8; color: #1b4f72; border: 2px solid #aed6f1; }
.sf-minutes button.sf-selected { background: #1b4f72; color: #fff; border-color: #154360; }

.sf-card { background: #1b4f72; color: #fff; border-radius: 12px; padding: 14px; margin-bottom: 10px; overflow-wrap: anywhere; }
.sf-card:empty { display: none; }
.sf-card small { display: block; opacity: 0.75; margin-top: 4px; }
.sf-card-spy { background: #7b241c; }
.sf-big { font-size: 1.7em; font-weight: 800; line-height: 1.2; }
.sf-role { font-size: 1.2em; font-weight: 700; }
.sf-timer { font-size: 2em; font-weight: 800; margin-bottom: 8px; }
.sf-info { font-size: 1.05em; line-height: 1.5; margin: 0 0 12px 0; overflow-wrap: anywhere; }
.sf-info strong { color: #1b4f72; }
.sf-roles { text-align: left; font-size: 0.85em; margin: 8px 0 0 0; padding-left: 18px; }
.sf-pick-title { font-weight: 600; margin-bottom: 8px; }
.sf-pick-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.sf-pick-list button { margin: 0; overflow-wrap: anywhere; }
.sf-vote-buttons { display: flex; gap: 8px; }
.sf-vote-buttons button { margin: 0; }
.sf-loc-list { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-bottom: 10px; }
.sf-loc { background: var(--light); border-radius: 14px; padding: 5px 10px; font-size: 0.85em; }
.sf-loc-btn { width: auto; margin: 0; border: 2px solid #aed6f1; background: #d6eaf8; color: #1b4f72; cursor: pointer; }