/* Pokédle */
    .pokedle-game-view {
      display: none;
      flex-direction: column;
      gap: clamp(1rem, 2vw, 1.6rem);
      width: min(1180px, 100%);
      margin: 0 auto;
    }

    .pokedle-game-view.active { display: flex; }

    .pokedle-header {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 1rem;
      align-items: center;
      background: linear-gradient(135deg, rgba(61,126,255,0.13), rgba(255,203,5,0.08));
      border: 1px solid var(--border);
      border-radius: var(--card-radius, 24px);
      padding: clamp(1rem, 2vw, 1.4rem);
      box-shadow: var(--shadow);
    }

    .pokedle-header h1 {
      margin: 0 0 0.35rem;
      color: var(--accent);
      font-family: 'Press Start 2P', monospace;
      font-size: clamp(0.8rem, 2.2vw, 1.15rem);
      line-height: 1.5;
    }

    .pokedle-header p {
      margin: 0;
      color: var(--muted);
      font-weight: 800;
      line-height: 1.45;
    }

    .pokedle-back-btn,
    .pokedle-submit-btn,
    .pokedle-reset-btn,
    .pokedle-gen-btn {
      min-height: 44px;
      border: 0;
      cursor: pointer;
      font-family: 'Nunito', sans-serif;
      font-weight: 900;
      transition: transform .16s ease, filter .16s ease, border-color .16s ease;
    }

    .pokedle-back-btn {
      border-radius: 999px;
      padding: 0.75rem 1rem;
      color: #0d1b2a;
      background: var(--accent);
      box-shadow: 0 8px 18px rgba(255,203,5,0.18);
    }

    .pokedle-back-btn:hover,
    .pokedle-submit-btn:hover,
    .pokedle-reset-btn:hover,
    .pokedle-gen-btn:hover { transform: translateY(-2px); filter: brightness(1.06); }

    .pokedle-shell {
      display: grid;
      grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.6fr);
      gap: clamp(1rem, 2vw, 1.4rem);
      align-items: start;
    }

    .pokedle-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--card-radius, 24px);
      padding: clamp(1rem, 2vw, 1.3rem);
      box-shadow: var(--shadow);
    }

    .pokedle-section-label {
      color: var(--accent);
      font-family: 'Press Start 2P', monospace;
      font-size: 0.62rem;
      line-height: 1.45;
      margin-bottom: 0.65rem;
    }

    .pokedle-help,
    .pokedle-message {
      color: var(--muted);
      font-weight: 800;
      line-height: 1.45;
    }

    .pokedle-gen-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 0.7rem;
      margin-top: 1rem;
    }

    .pokedle-gen-btn {
      display: grid;
      grid-template-columns: 48px 1fr;
      grid-template-areas: 'num title' 'num sub';
      gap: 0.1rem 0.75rem;
      align-items: center;
      text-align: left;
      border-radius: 18px;
      border: 1px solid rgba(61,126,255,0.28);
      background: rgba(61,126,255,0.08);
      color: #fff;
      padding: 0.85rem;
    }

    .pokedle-gen-btn.active {
      border-color: var(--accent);
      background: rgba(255,203,5,0.13);
      box-shadow: 0 0 18px rgba(255,203,5,0.13);
    }

    .pokedle-gen-btn span { grid-area: num; color: var(--accent); font-family:'Press Start 2P', monospace; font-size: 0.78rem; text-align:center; }
    .pokedle-gen-btn strong { grid-area: title; font-size: 1rem; }
    .pokedle-gen-btn small { grid-area: sub; color: var(--muted); font-weight: 900; }

    .pokedle-status-row {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.65rem;
      margin-bottom: 1rem;
    }

    .pokedle-status-chip {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 16px;
      padding: 0.75rem;
      display: grid;
      gap: 0.25rem;
    }

    .pokedle-status-chip span { color: var(--muted); font-size: 0.72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .4px; }
    .pokedle-status-chip strong { color: #fff; font-size: 1.08rem; }

    .pokedle-input-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto auto;
      gap: 0.6rem;
      align-items: center;
    }

    #pokedleGuessInput {
      min-height: 48px;
      border-radius: 16px;
      border: 1px solid rgba(255,255,255,0.12);
      background: rgba(255,255,255,0.07);
      color: #fff;
      padding: 0 1rem;
      font: 900 1rem 'Nunito', sans-serif;
      outline: none;
    }

    #pokedleGuessInput:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(255,203,5,0.12); }
    #pokedleGuessInput:disabled { opacity: .55; }

    .pokedle-submit-btn,
    .pokedle-reset-btn {
      border-radius: 16px;
      padding: 0.75rem 1rem;
    }

    .pokedle-submit-btn { background: linear-gradient(135deg, var(--accent), #ff9f1c); color: #0d1b2a; }
    .pokedle-reset-btn { background: rgba(61,126,255,0.15); color: #dce8ff; border: 1px solid rgba(61,126,255,0.35); }
    .pokedle-submit-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }

    .pokedle-message {
      min-height: 1.5rem;
      margin: 0.8rem 0 0.65rem;
    }
    .pokedle-message.win { color: #86efac; }
    .pokedle-message.lose { color: #fca5a5; }
    .pokedle-message.warn { color: var(--accent); }

    .pokedle-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 0.55rem 0.8rem;
      align-items: center;
      color: var(--muted);
      font-size: 0.76rem;
      font-weight: 900;
      margin-bottom: 0.8rem;
    }

    .pokedle-legend span { display: inline-flex; align-items: center; gap: 0.34rem; }
    .pokedle-legend i { width: 12px; height: 12px; border-radius: 4px; display:inline-block; }
    .pokedle-legend .match { background: #22c55e; }
    .pokedle-legend .partial { background: #f59e0b; }
    .pokedle-legend .miss { background: #ef4444; }
    .pokedle-arrow-note { width: 100%; opacity: .9; }

    .pokedle-table-wrap {
      overflow-x: auto;
      padding-bottom: 0.15rem;
    }

    .pokedle-table {
      min-width: 820px;
      display: grid;
      gap: 0.52rem;
    }

    .pokedle-row {
      display: grid;
      grid-template-columns: 180px repeat(7, minmax(82px, 1fr));
      gap: 0.45rem;
      align-items: stretch;
    }

    .pokedle-row.header .pokedle-cell {
      min-height: 34px;
      background: rgba(255,255,255,0.05);
      color: var(--muted);
      font-size: 0.66rem;
      text-transform: uppercase;
      letter-spacing: .5px;
    }

    .pokedle-cell {
      min-height: 58px;
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(255,255,255,0.045);
      color: #fff;
      display: grid;
      place-items: center;
      text-align: center;
      padding: 0.45rem;
      font-size: 0.78rem;
      font-weight: 900;
      line-height: 1.2;
    }

    .pokedle-pokemon-cell {
      grid-template-columns: 48px 1fr;
      place-items: center start;
      text-align: left;
      gap: 0.55rem;
    }

    .pokedle-pokemon-cell img { width: 46px; height: 46px; object-fit: contain; image-rendering: pixelated; }
    .pokedle-pokemon-cell small { color: var(--muted); font-weight: 900; }

    .pokedle-cell.match { background: rgba(34,197,94,0.22); border-color: rgba(34,197,94,0.62); }
    .pokedle-cell.partial { background: rgba(245,158,11,0.22); border-color: rgba(245,158,11,0.62); }
    .pokedle-cell.miss { background: rgba(239,68,68,0.22); border-color: rgba(248,113,113,0.62); color: #fee2e2; }

    @media (max-width: 980px) {
      .pokedle-shell { grid-template-columns: 1fr; }
      .pokedle-gen-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    }

    @media (max-width: 640px) {
      .pokedle-header { grid-template-columns: 1fr; }
      .pokedle-input-row { grid-template-columns: 1fr; }
      .pokedle-status-row { grid-template-columns: 1fr; }
      .pokedle-gen-grid { grid-template-columns: 1fr; }
      .pokedle-table { min-width: min(760px, 100%); }
    }