/* CN Club Membership v1.0.3 application UI
 * Mobile-first, progressive enhancement, WordPress-native design tokens.
 */
:root {
  --cncm-ui-bg: var(--wp-admin-theme-color-background, #f5f6f8);
  --cncm-ui-surface: #fff;
  --cncm-ui-surface-subtle: #f8fafc;
  --cncm-ui-border: #e2e6eb;
  --cncm-ui-border-strong: #c9d0d8;
  --cncm-ui-text: #1d2939;
  --cncm-ui-muted: #667085;
  --cncm-ui-primary: var(--wp-admin-theme-color, #1d2327);
  --cncm-ui-primary-hover: var(--wp-admin-theme-color-darker-10, #101418);
  --cncm-ui-danger: #b42318;
  --cncm-ui-success: #067647;
  --cncm-ui-warning: #b54708;
  --cncm-ui-radius-sm: 8px;
  --cncm-ui-radius: 12px;
  --cncm-ui-radius-lg: 18px;
  --cncm-ui-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 2px 8px rgba(16, 24, 40, .04);
  --cncm-ui-shadow: 0 16px 40px rgba(16, 24, 40, .12);
  --cncm-ui-touch: 44px;
}

html.cncm-ui-lock-scroll { overflow: hidden; }
body.cncm-admin-app { background: var(--cncm-ui-bg); }
body.cncm-admin-app #wpcontent { padding-left: 24px; }
body.cncm-admin-app .wrap { max-width: 1540px; margin: 22px 24px 48px 0; color: var(--cncm-ui-text); }
body.cncm-admin-app .wrap > h1:first-child { margin: 24px 0 18px; padding: 0; font-size: clamp(26px, 2vw, 34px); line-height: 1.12; font-weight: 760; letter-spacing: -.025em; color: #101828; }
body.cncm-admin-app .wrap > h1:first-child::after { content: none; }

/* React/WordPress-element application shell */
.cncm-admin-shell-root { margin: 18px 24px 0 0; }
.cncm-app-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 390px); gap: 18px; align-items: center; padding: 12px 14px; background: rgba(255,255,255,.94); border: 1px solid var(--cncm-ui-border); border-radius: var(--cncm-ui-radius-lg); box-shadow: var(--cncm-ui-shadow-sm); backdrop-filter: blur(14px); position: sticky; top: 42px; z-index: 70; }
.cncm-app-shell-main { min-width: 0; display: flex; align-items: center; gap: 20px; }
.cncm-app-brand { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.cncm-app-brand-mark { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: var(--cncm-ui-primary); color: #fff; font-weight: 800; letter-spacing: -.04em; }
.cncm-app-brand div { display: grid; line-height: 1.12; }
.cncm-app-brand strong { font-size: 14px; }
.cncm-app-brand span:not(.cncm-app-brand-mark) { margin-top: 3px; color: var(--cncm-ui-muted); font-size: 11px; }
.cncm-app-nav { min-width: 0; display: flex; gap: 3px; overflow-x: auto; scrollbar-width: none; }
.cncm-app-nav::-webkit-scrollbar { display: none; }
.cncm-app-nav-link { flex: 0 0 auto; min-height: 38px; display: inline-flex; align-items: center; padding: 0 11px; border-radius: 9px; color: #475467; text-decoration: none; font-weight: 650; }
.cncm-app-nav-link:hover { color: #101828; background: #f2f4f7; }
.cncm-app-nav-link.is-active { color: #fff; background: var(--cncm-ui-primary); }
.cncm-app-mobile-nav { display: none; }
.cncm-app-search { position: relative; z-index: 2; }
.cncm-app-search .components-search-control__input,
.cncm-app-search-fallback { width: 100%; min-height: 40px !important; border: 1px solid var(--cncm-ui-border-strong) !important; border-radius: 10px !important; background: #fff !important; }
.cncm-app-search-popover { position: absolute; top: calc(100% + 8px); right: 0; width: min(500px, 88vw); max-height: min(620px, 70vh); overflow: auto; padding: 8px; background: #fff; border: 1px solid var(--cncm-ui-border); border-radius: 14px; box-shadow: 0 20px 55px rgba(16,24,40,.18); }
.cncm-app-search-popover section + section { border-top: 1px solid #eef1f4; margin-top: 6px; padding-top: 6px; }
.cncm-app-search-popover h3 { margin: 7px 9px 5px; color: var(--cncm-ui-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.cncm-app-search-result { display: grid; gap: 3px; padding: 9px 10px; border-radius: 9px; color: var(--cncm-ui-text); text-decoration: none; }
.cncm-app-search-result:hover { background: #f8fafc; }
.cncm-app-search-result span { color: var(--cncm-ui-muted); font-size: 12px; }
.cncm-app-search-state { padding: 16px; color: var(--cncm-ui-muted); }
.cncm-app-search-state.is-error { color: var(--cncm-ui-danger); }

/* Surfaces and forms */
body.cncm-admin-app .cncm-panel,
body.cncm-admin-app .postbox,
body.cncm-admin-app .card { max-width: none !important; margin: 0 0 20px !important; padding: clamp(18px, 2vw, 26px) !important; border: 1px solid var(--cncm-ui-border) !important; border-radius: var(--cncm-ui-radius-lg) !important; background: var(--cncm-ui-surface) !important; box-shadow: var(--cncm-ui-shadow-sm) !important; }
body.cncm-admin-app .cncm-section-heading { gap: 18px; }
body.cncm-admin-app .cncm-section-heading h2,
body.cncm-admin-app .cncm-panel > h2 { color: #101828; letter-spacing: -.015em; }
body.cncm-admin-app .form-table { display: block; margin: 14px 0 20px; padding: 4px 20px; border: 1px solid var(--cncm-ui-border); border-radius: var(--cncm-ui-radius); background: #fff; box-shadow: none; }
body.cncm-admin-app .form-table tbody { display: table; width: 100%; }
body.cncm-admin-app .form-table th { width: 220px; padding: 18px 14px 18px 0; color: #344054; font-weight: 680; }
body.cncm-admin-app .form-table td { padding: 13px 0; }
body.cncm-admin-app input[type=text],
body.cncm-admin-app input[type=email],
body.cncm-admin-app input[type=tel],
body.cncm-admin-app input[type=date],
body.cncm-admin-app input[type=number],
body.cncm-admin-app input[type=password],
body.cncm-admin-app input[type=search],
body.cncm-admin-app input[type=url],
body.cncm-admin-app select,
body.cncm-admin-app textarea,
.cncm-ui-drawer input[type=text],
.cncm-ui-drawer input[type=email],
.cncm-ui-drawer input[type=tel],
.cncm-ui-drawer input[type=date],
.cncm-ui-drawer input[type=number],
.cncm-ui-drawer input[type=password],
.cncm-ui-drawer input[type=search],
.cncm-ui-drawer input[type=url],
.cncm-ui-drawer select,
.cncm-ui-drawer textarea { min-height: 42px; border: 1px solid var(--cncm-ui-border-strong) !important; border-radius: 9px !important; box-shadow: none !important; background: #fff; }
body.cncm-admin-app input:focus,
body.cncm-admin-app select:focus,
body.cncm-admin-app textarea:focus,
.cncm-ui-drawer input:focus,
.cncm-ui-drawer select:focus,
.cncm-ui-drawer textarea:focus { border-color: var(--cncm-ui-primary) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--cncm-ui-primary) 12%, transparent) !important; outline: 0 !important; }
body.cncm-admin-app .button,
body.cncm-admin-app .cncm-button,
.cncm-ui-drawer .button,
.cncm-ui-drawer .cncm-button { min-height: 38px !important; padding: 7px 14px !important; border-radius: 9px !important; font-weight: 680 !important; box-shadow: none !important; }
body.cncm-admin-app .button-primary,
.cncm-ui-drawer .button-primary,
body.cncm-admin-app .cncm-button:not(.cncm-button-secondary):not(.cncm-button-danger) { background: var(--cncm-ui-primary) !important; border-color: var(--cncm-ui-primary) !important; color: #fff !important; }
body.cncm-admin-app .button-primary:hover,
.cncm-ui-drawer .button-primary:hover { background: var(--cncm-ui-primary-hover) !important; }

/* Navigation */
body.cncm-admin-app .cncm-admin-nav,
body.cncm-admin-app .cncm-rta-nav,
.cncm-wrap .cncm-admin-nav { display: flex; gap: 4px; flex-wrap: wrap; margin: 0 0 20px; padding: 5px; border: 1px solid var(--cncm-ui-border); border-radius: 12px; background: #fff; box-shadow: var(--cncm-ui-shadow-sm); }
body.cncm-admin-app .cncm-admin-nav a,
body.cncm-admin-app .cncm-rta-nav a,
.cncm-wrap .cncm-admin-nav a { min-height: 38px; display: inline-flex; align-items: center; padding: 0 12px !important; border: 0 !important; border-radius: 8px !important; color: #475467 !important; background: transparent !important; text-decoration: none !important; font-weight: 650 !important; }
body.cncm-admin-app .cncm-admin-nav a.active,
body.cncm-admin-app .cncm-rta-nav a.active,
.cncm-wrap .cncm-admin-nav a.active { color: #fff !important; background: var(--cncm-ui-primary) !important; }

/* Tables */
.cncm-table-wrap { width: 100%; overflow-x: auto; border-radius: 12px; }
body.cncm-admin-app .widefat,
body.cncm-admin-app .cncm-table { width: 100%; border: 1px solid var(--cncm-ui-border) !important; border-collapse: separate !important; border-spacing: 0 !important; border-radius: 12px !important; overflow: hidden; background: #fff; box-shadow: none; }
body.cncm-admin-app .widefat thead th,
body.cncm-admin-app .cncm-table thead th { padding: 12px 13px; border-bottom: 1px solid var(--cncm-ui-border); background: #f8fafc; color: #667085; font-size: 11px; font-weight: 720; letter-spacing: .045em; text-transform: uppercase; }
body.cncm-admin-app .widefat td,
body.cncm-admin-app .cncm-table td { padding: 13px; border-bottom: 1px solid #eef1f4; vertical-align: middle; }
body.cncm-admin-app .widefat tbody tr:hover,
body.cncm-admin-app .cncm-table tbody tr:hover { background: #fbfcfe; }
body.cncm-admin-app .widefat tbody tr:last-child td,
body.cncm-admin-app .cncm-table tbody tr:last-child td { border-bottom: 0; }
.cncm-ui-status { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 9px; border: 1px solid #e4e7ec; border-radius: 999px; background: #f9fafb; color: #344054; font-size: 12px; font-weight: 680; }

/* Dashboard statistics */
body.cncm-admin-app .cncm-admin-stats { grid-template-columns: repeat(auto-fit, minmax(145px,1fr)); gap: 12px; margin-bottom: 20px; }
body.cncm-admin-app .cncm-admin-stats > div { padding: 17px !important; border: 1px solid var(--cncm-ui-border) !important; border-radius: 13px !important; background: #fff !important; box-shadow: var(--cncm-ui-shadow-sm); }
body.cncm-admin-app .cncm-admin-stats strong { color: #101828; font-size: 23px !important; }
body.cncm-admin-app .cncm-admin-stats span { color: var(--cncm-ui-muted) !important; }

/* Focused actions */
.cncm-ui-inline-action { margin: 0 0 12px; }
.cncm-ui-action-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 12px; margin: 0 0 20px; }
.cncm-ui-action-card { width: 100%; min-height: 74px; display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto; gap: 3px 14px; align-items: center; padding: 15px 17px; border: 1px solid var(--cncm-ui-border); border-radius: 13px; background: #fff; color: #101828; text-align: left; box-shadow: var(--cncm-ui-shadow-sm); cursor: pointer; }
.cncm-ui-action-card:hover { border-color: #b9c2ce; box-shadow: 0 8px 24px rgba(16,24,40,.08); transform: translateY(-1px); }
.cncm-ui-action-card strong { grid-column: 1; font-size: 14px; }
.cncm-ui-action-card span { grid-column: 1; color: var(--cncm-ui-muted); font-size: 12px; }
.cncm-ui-action-card b { grid-column: 2; grid-row: 1 / span 2; font-size: 20px; font-weight: 500; }

/* Accessible drawer / full-screen mobile sheet */
.cncm-ui-drawer-backdrop { position: fixed; inset: 0; z-index: 99990; opacity: 0; pointer-events: none; background: rgba(15,23,42,.44); backdrop-filter: blur(2px); transition: opacity .18s ease; }
.cncm-ui-drawer-backdrop.is-open { opacity: 1; pointer-events: auto; }
.cncm-ui-drawer { position: fixed; top: 0; right: 0; z-index: 99991; width: min(780px, 96vw); height: 100dvh; display: flex; flex-direction: column; background: #fff; box-shadow: -24px 0 64px rgba(15,23,42,.18); transform: translateX(102%); transition: transform .22s cubic-bezier(.2,.8,.2,1); outline: 0; }
.cncm-ui-drawer.is-open { transform: translateX(0); }
.cncm-ui-drawer-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--cncm-ui-border); background: rgba(255,255,255,.96); backdrop-filter: blur(12px); }
.cncm-ui-drawer-head > div { min-width: 0; display: grid; gap: 3px; }
.cncm-ui-drawer-kicker { color: var(--cncm-ui-muted); font-size: 10px; font-weight: 720; text-transform: uppercase; letter-spacing: .08em; }
.cncm-ui-drawer-head strong { overflow: hidden; color: #101828; font-size: 19px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.cncm-ui-drawer-close { width: var(--cncm-ui-touch); height: var(--cncm-ui-touch); flex: 0 0 var(--cncm-ui-touch); border: 0; border-radius: 10px; background: #f2f4f7; color: #344054; font-size: 24px; line-height: 1; cursor: pointer; }
.cncm-ui-drawer-close:hover { background: #e9edf2; }
.cncm-ui-drawer-progress { height: 3px; flex: 0 0 3px; overflow: hidden; background: transparent; }
.cncm-ui-drawer-progress.is-active::before { content: ""; display: block; width: 36%; height: 100%; background: var(--cncm-ui-primary); animation: cncm-progress 1s ease-in-out infinite; }
@keyframes cncm-progress { from { transform: translateX(-110%); } to { transform: translateX(310%); } }
.cncm-ui-drawer-body { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 20px; }
.cncm-ui-drawer-body > .cncm-ui-editor,
.cncm-ui-drawer-body > details.cncm-admin-form { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.cncm-ui-drawer-body > details.cncm-admin-form > summary { display: none; }
.cncm-ui-drawer-body .form-table { margin-top: 0 !important; }
.cncm-ui-drawer-body form { position: relative; }
.cncm-ui-drawer-body form > p.submit { position: sticky; bottom: -20px; z-index: 4; margin: 22px -20px -20px !important; padding: 13px 20px !important; border-top: 1px solid var(--cncm-ui-border); background: rgba(255,255,255,.96); backdrop-filter: blur(12px); }
.cncm-ui-busy { pointer-events: none; opacity: .72; }
.cncm-ui-refreshing { opacity: .64; transition: opacity .15s ease; }
.cncm-ui-skeleton { display: grid; gap: 12px; padding: 6px 0; }
.cncm-ui-skeleton span { display: block; height: 54px; border-radius: 11px; background: linear-gradient(90deg,#f1f3f5 20%,#fafbfc 40%,#f1f3f5 60%); background-size: 240% 100%; animation: cncm-skeleton 1.2s ease infinite; }
.cncm-ui-skeleton span:first-child { height: 108px; }
@keyframes cncm-skeleton { to { background-position: -120% 0; } }
.cncm-ui-error-state { padding: 22px; border: 1px solid #fda29b; border-radius: 12px; background: #fffbfa; color: #912018; }

/* Toasts and accessible live region */
.cncm-ui-live-region { position: fixed !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.cncm-ui-toast { position: fixed; right: 22px; bottom: 22px; z-index: 100000; max-width: min(390px,calc(100vw - 32px)); padding: 12px 15px; border-radius: 11px; color: #fff; background: #101828; box-shadow: 0 14px 36px rgba(16,24,40,.25); font-weight: 650; opacity: 0; transform: translateY(8px); transition: opacity .16s ease, transform .16s ease; }
.cncm-ui-toast.is-visible { opacity: 1; transform: translateY(0); }
.cncm-ui-toast.is-error { background: #912018; }
.cncm-ui-toast.is-success { background: #101828; }

/* Front-end workspace */
.cncm-wrap.cncm-ui-workspace .cncm-member-nav { position: sticky; top: 10px; z-index: 20; box-shadow: 0 8px 24px rgba(17,24,39,.06); }
.cncm-wrap.cncm-ui-workspace .cncm-member-nav a[href^="#"] { border: 1px solid transparent; }
.cncm-wrap.cncm-ui-workspace .cncm-member-nav a[href^="#"]:hover { border-color: #e5e7eb; background: #fff; }
.cncm-wrap.cncm-ui-workspace .cncm-ui-section-stub { display: none !important; }
.cncm-wrap .cncm-admin-nav { gap: 5px; flex-wrap: wrap; }

/* Mobile: app-like sheets and card lists instead of tiny wide tables. */
@media (max-width: 1100px) {
  .cncm-app-shell { grid-template-columns: 1fr; }
  .cncm-app-search { max-width: 100%; }
}

@media (max-width: 782px) {
  body.cncm-admin-app #wpcontent { padding-left: 10px; }
  body.cncm-admin-app .wrap { margin: 14px 10px 30px 0; }
  .cncm-admin-shell-root { margin: 10px 10px 0 0; }
  .cncm-app-shell { position: sticky; top: 46px; padding: 10px; border-radius: 14px; gap: 10px; }
  .cncm-app-shell-main { gap: 10px; }
  .cncm-app-brand div { display: none; }
  .cncm-app-brand-mark { width: 40px; height: 40px; }
  .cncm-app-nav { display: none; }
  .cncm-app-mobile-nav { display: block; min-width: 0; flex: 1; }
  .cncm-app-mobile-nav select { width: 100%; min-height: 42px; border-radius: 9px; }
  .cncm-app-search-popover { position: fixed; top: 150px; right: 10px; left: 10px; width: auto; max-height: calc(100dvh - 170px); }

  body.cncm-admin-app .form-table { padding: 8px 14px; }
  body.cncm-admin-app .form-table tbody,
  body.cncm-admin-app .form-table tr,
  body.cncm-admin-app .form-table th,
  body.cncm-admin-app .form-table td { display: block; width: auto; }
  body.cncm-admin-app .form-table th { padding: 12px 0 3px; }
  body.cncm-admin-app .form-table td { padding: 0 0 12px; }
  body.cncm-admin-app input.regular-text,
  body.cncm-admin-app select,
  body.cncm-admin-app textarea,
  .cncm-ui-drawer input.regular-text,
  .cncm-ui-drawer select,
  .cncm-ui-drawer textarea { width: 100%; max-width: none; }

  .cncm-ui-drawer { width: 100vw; max-width: none; }
  .cncm-ui-drawer-head { padding: 12px 14px; }
  .cncm-ui-drawer-body { padding: 14px; }
  .cncm-ui-drawer-body form > p.submit { bottom: -14px; margin: 20px -14px -14px !important; padding: 12px 14px calc(12px + env(safe-area-inset-bottom)) !important; }
  .cncm-ui-toast { right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); left: 16px; max-width: none; }

  /* Responsive card rows. JS supplies data-label from each table header. */
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] { display: block; border: 0 !important; background: transparent; overflow: visible; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] thead { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] tbody { display: grid; gap: 10px; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] tr { display: grid; gap: 0; padding: 10px 13px; border: 1px solid var(--cncm-ui-border); border-radius: 13px; background: #fff; box-shadow: var(--cncm-ui-shadow-sm); }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td { display: grid; grid-template-columns: minmax(90px, 34%) minmax(0, 1fr); gap: 12px; align-items: start; padding: 8px 0 !important; border: 0 !important; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td::before { content: attr(data-label); color: var(--cncm-ui-muted); font-size: 11px; font-weight: 720; letter-spacing: .035em; text-transform: uppercase; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td:empty { display: none; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label="Actions"],
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label=""] { grid-template-columns: 1fr; border-top: 1px solid #eef1f4 !important; margin-top: 4px; padding-top: 10px !important; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label="Actions"]::before,
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label=""]::before { display: none; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td .button,
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td .cncm-button { min-height: var(--cncm-ui-touch) !important; }

  .cncm-ui-action-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

/* Structured validation feedback inside focused editors. */
.cncm-ui-form-error { margin: 0 0 16px; padding: 11px 13px; border: 1px solid #fda29b; border-radius: 10px; background: #fffbfa; color: #912018; font-weight: 650; }
.cncm-ui-form-error:focus { outline: 2px solid #b42318; outline-offset: 2px; }
.cncm-app-search-result.is-static { cursor: default; }

/* v1.0.3 responsive hardening: the full membership experience must remain usable
 * without horizontal page scrolling on phones/tablets. Desktop tables become
 * labelled card rows; editors become single-column, touch-first workspaces.
 */
.cncm-wrap,
.cncm-portal,
.cncm-panel,
.cncm-ui-drawer-body,
body.cncm-admin-app .wrap { min-width: 0; }
.cncm-wrap img,
.cncm-portal img,
body.cncm-admin-app .wrap img,
.cncm-ui-drawer img { max-width: 100%; height: auto; }
.cncm-wrap pre,
.cncm-wrap code,
body.cncm-admin-app .wrap pre,
body.cncm-admin-app .wrap code { overflow-wrap: anywhere; word-break: break-word; }

@media (max-width: 782px) {
  html, body { max-width: 100%; }
  body.cncm-admin-app,
  .cncm-wrap.cncm-ui-workspace { overflow-x: clip; }

  body.cncm-admin-app #wpbody-content,
  body.cncm-admin-app #wpcontent,
  body.cncm-admin-app .wrap,
  .cncm-wrap,
  .cncm-portal,
  .cncm-panel,
  .cncm-ui-drawer-body { min-width: 0 !important; max-width: 100% !important; box-sizing: border-box; }

  /* Neutralise legacy inline minimum widths that were suitable only on desktop. */
  body.cncm-admin-app [style*="min-width:360px"],
  body.cncm-admin-app [style*="min-width: 360px"],
  body.cncm-admin-app [style*="min-width:180px"],
  body.cncm-admin-app [style*="min-width: 180px"] { min-width: 0 !important; width: 100%; }

  /* All application forms are one logical column on a mobile device. */
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-grid,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-grid-short,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-option-grid,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-readonly-grid,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-admin-detail-grid { grid-template-columns: minmax(0,1fr) !important; max-width: none !important; }

  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-field,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-field-full { min-width: 0; width: 100%; }

  /* 16px input type avoids iOS focus zoom; 48px controls improve touch use. */
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) select,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    font-size: 16px !important;
    box-sizing: border-box !important;
  }
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) textarea { min-height: 120px !important; }

  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .button,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-button,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) button:not(.cncm-ui-drawer-close) {
    min-height: 46px !important;
    white-space: normal;
  }

  /* Forms/actions that used to sit side-by-side now wrap and remain tappable. */
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-inline-form,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-row-actions,
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-submit-row {
    display: flex !important;
    width: 100%;
    max-width: 100%;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-inline-form input:not([type="hidden"]),
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) .cncm-inline-form select { flex: 1 1 160px; }

  /* Event/result capture is a primary field workflow on phones. */
  :is(.cncm-wrap, body.cncm-admin-app, .cncm-ui-drawer) form.cncm-admin-form,
  .cncm-ui-drawer details.cncm-admin-form form,
  .cncm-ui-drawer .cncm-admin-form form { width: 100%; min-width: 0; }
  .cncm-ui-drawer details.cncm-admin-form > summary { display: none; }
  .cncm-ui-drawer .cncm-subsection { margin-top: 20px; padding-top: 18px; }
  .cncm-ui-drawer .cncm-label { font-size: 13px; }
  .cncm-ui-drawer .cncm-field small { line-height: 1.45; }
  .cncm-ui-drawer form.cncm-mobile-form > .cncm-button:last-child,
  .cncm-ui-drawer form.cncm-mobile-form > button[type="submit"]:last-child,
  .cncm-ui-drawer form.cncm-mobile-form > input[type="submit"]:last-child {
    position: sticky;
    bottom: calc(-14px + env(safe-area-inset-bottom));
    z-index: 8;
    width: calc(100% + 28px) !important;
    margin: 22px -14px -14px !important;
    padding: 13px 16px calc(13px + env(safe-area-inset-bottom)) !important;
    border-radius: 0 !important;
  }

  /* Navigation should show every destination without pushing the page wider. */
  .cncm-wrap .cncm-member-nav,
  .cncm-wrap .cncm-admin-nav,
  body.cncm-admin-app .cncm-admin-nav,
  body.cncm-admin-app .cncm-rta-nav {
    width: 100%; max-width: 100%; box-sizing: border-box;
  }
  .cncm-wrap .cncm-member-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; }
  .cncm-wrap .cncm-member-nav a { min-width: 0; white-space: normal; text-align: center; display: flex; align-items: center; justify-content: center; }

  /* Responsive tables become cards. The wrapper itself must not reintroduce horizontal scrolling. */
  :is(body.cncm-admin-app, .cncm-wrap) .cncm-table-wrap,
  :is(body.cncm-admin-app, .cncm-wrap) .cncm-admin-table-wrap { overflow: visible !important; width: 100%; max-width: 100%; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] { width: 100% !important; max-width: 100% !important; min-width: 0 !important; table-layout: fixed; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td > * { max-width: 100%; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td form { min-width: 0; max-width: 100%; }

  /* Member identity/verification cards must fit narrow phones. */
  .cncm-member-identity,
  .cncm-admin-member-title-row,
  .cncm-admin-verification-card { min-width: 0; max-width: 100%; }
  .cncm-admin-verification-card { flex-direction: column; }
}

@media (max-width: 480px) {
  body.cncm-admin-app #wpcontent { padding-left: 6px; }
  body.cncm-admin-app .wrap { margin-right: 6px; }
  .cncm-admin-shell-root { margin-right: 6px; }
  .cncm-app-shell { border-radius: 12px; }
  .cncm-wrap { padding-left: 10px; padding-right: 10px; }
  .cncm-wrap .cncm-member-nav { grid-template-columns: minmax(0,1fr); }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td { grid-template-columns: minmax(78px,32%) minmax(0,1fr); gap: 9px; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label="Actions"],
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label=""] { display: block; }
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label="Actions"] .button,
  :is(body.cncm-admin-app, .cncm-wrap) table[data-cncm-responsive="1"] td[data-label="Actions"] .cncm-button { width: 100%; margin: 3px 0 !important; justify-content: center; }
}


.cncm-eligibility-options{grid-template-columns:repeat(2,minmax(0,1fr));max-width:320px}
.cncm-eligibility-options .cncm-option span{min-height:42px;font-weight:750}
.cncm-eligibility-field>small{max-width:520px;line-height:1.45}