/* ==========================================================================
       V16 — Google Sheet Sync (per mess, moderator only)
       Sheet ▸ Apps Script Web App ▸ (moderator browser) ▸ app ▸ Supabase ▸ members
       ========================================================================== */

    .sheet-sync-card {
      border: 1px solid var(--border);
    }

    .sheet-sync-state {
      padding: 5px 12px;
      border-radius: 999px;
      font-size: 0.7rem;
      font-weight: 900;
      letter-spacing: .04em;
      text-transform: uppercase;
      background: var(--tag-bg);
      color: var(--text2);
      white-space: nowrap;
    }

    .sheet-sync-state.on {
      background: rgba(23, 200, 106, .16);
      color: #0f9d58;
    }

    .sheet-sync-state.err {
      background: rgba(239, 68, 68, .16);
      color: #ef4444;
    }

    .sheet-sync-state.busy {
      background: rgba(107, 138, 253, .16);
      color: #4f6ef0;
    }

    .sheet-sync-help {
      display: block !important;
      text-align: left;
      font-size: 0.79rem;
      line-height: 1.6;
      color: var(--text2);
      background: rgba(15, 157, 88, .07);
      border: 1px solid rgba(15, 157, 88, .22);
      border-radius: 12px;
      padding: 11px 13px;
      margin-bottom: 14px;
    }

    .sheet-sync-help b {
      color: var(--text);
    }

    .sheet-sync-options {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 12px;
    }

    .sheet-sync-opt {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 8px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--surface2);
      font-size: 0.79rem;
      font-weight: 700;
      cursor: pointer;
      user-select: none;
    }

    .sheet-sync-opt input {
      width: 15px;
      height: 15px;
      accent-color: var(--accent);
      cursor: pointer;
    }

    .sheet-sync-log {
      margin-top: 12px;
      padding: 11px 13px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--surface2);
      font-size: 0.78rem;
      line-height: 1.6;
      color: var(--text2);
      white-space: pre-wrap;
      word-break: break-word;
      max-height: 190px;
      overflow-y: auto;
    }

    .sheet-sync-log b {
      color: var(--text);
    }

    .sheet-sync-log .ok {
      color: #0f9d58;
      font-weight: 800;
    }

    .sheet-sync-log .bad {
      color: #ef4444;
      font-weight: 800;
    }

    .sheet-map-title {
      margin: 16px 0 8px;
      font-size: 0.74rem;
      font-weight: 900;
      letter-spacing: .06em;
      text-transform: uppercase;
      color: var(--text2);
    }

    .sheet-map-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 9px;
    }

    .sheet-map-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
      align-items: center;
      gap: 8px;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--surface2);
    }

    .sheet-map-row .sheet-map-name {
      font-size: 0.82rem;
      font-weight: 800;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .sheet-map-row .sheet-map-name small {
      display: block;
      font-weight: 600;
      font-size: 0.68rem;
      color: var(--text2);
    }

    .sheet-map-row select {
      width: 100%;
      max-width: 100%;
      font-size: 0.79rem;
      padding: 6px 8px;
    }

    .sheet-map-row.unmatched {
      border-color: rgba(239, 68, 68, .45);
      background: rgba(239, 68, 68, .07);
    }

    /* Sheet-controlled tables get a clear banner + locked inputs */
    .sheet-lock-banner {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 9px;
      padding: 10px 13px;
      margin-bottom: 12px;
      border-radius: 12px;
      font-size: 0.79rem;
      font-weight: 700;
      color: #0f9d58;
      background: rgba(15, 157, 88, .1);
      border: 1px solid rgba(15, 157, 88, .28);
    }

    .sheet-lock-banner .spacer {
      flex: 1 1 auto;
    }

    .sheet-lock-banner small {
      font-weight: 600;
      color: var(--text2);
    }

    input.sheet-locked-input {
      background: repeating-linear-gradient(135deg, transparent, transparent 6px, rgba(15, 157, 88, .07) 6px, rgba(15, 157, 88, .07) 12px) !important;
      cursor: not-allowed !important;
    }

    @media (max-width: 620px) {
      .sheet-map-row {
        grid-template-columns: 1fr;
      }
    }