/* MU GAME Classic, confronto direto da Arena */
.cf { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding-bottom: 30px; color: #f8f1f1; }
.cf > * { min-width: 0; }
.cf .i { width: 16px; height: 16px; flex: none; }
.cf-intro h1 { margin: 0; font: 800 34px/1.1 var(--f-title, inherit); color: #fff; }
.cf-intro p { margin: 8px 0 0; font-size: 15px; color: #d9c8c7; }
.cf-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.cf-form input { width: 180px; height: 42px; padding: 0 12px; border-radius: 8px; border: 1px solid rgba(255, 74, 61, .22); background: #140b0b; color: #fff; font: inherit; font-size: 15px; }
.cf-form input:focus { outline: 0; border-color: #ff4a3d; box-shadow: 0 0 0 3px rgba(255, 74, 61, .18); }
.cf-form > span { font: 800 18px var(--f-title, inherit); color: #715b5a; }
.cf-form button { height: 42px; padding: 0 20px; border: 0; border-radius: 8px; background: linear-gradient(180deg, #ffe6a8, #f2c46d 60%, #b8862b); color: #1a1205; font: 800 14px var(--f-body, inherit); cursor: pointer; }
.cf-form button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.cf-msg { margin: 0; font-size: 13.5px; color: #a68f8e; }
.cf-load { padding: 30px 0; text-align: center; color: #a68f8e; }
@media (max-width: 860px) {
  .cf-form { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
  .cf-form input { width: 100%; }
  .cf-form button { grid-column: 1 / -1; }
}