/*
 * 6oy.uk — Neural Expressive Design System (Phase 0)
 * Material 3 Expressive + Google I/O 2026 inspired tokens & primitives.
 * Use .ne-page as module root; compose with .ne-card, .ne-hero, etc.
 */

:root {
  /* Motion */
  --ne-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ne-ease-out: cubic-bezier(0.22, 1, 0.36, 1);

  /* Color — Google-aligned */
  --ne-primary: #1a73e8;
  --ne-primary-2: #8ab4f8;
  --ne-primary-rgb: 26, 115, 232;
  --ne-primary-active: #1557b0;
  --ne-violet: #7c4dff;
  --ne-cyan: #12b5cb;
  --ne-amber: #f9ab00;
  --ne-amber-text: #b06000; /* AA-safe amber for TEXT/ICONS on light bg; --ne-amber (#f9ab00) is ~1.9:1, invisible in sunlight. Keep --ne-amber for solid fills under white text. */
  --ne-error: #c5221f;
  --ne-ink: #1b1b1f;
  --ne-muted: #4a4d52; /* Improved contrast from #5f6368 */
  --ne-hint: #5f6368; /* Improved contrast from #80868b */
  --ne-line: rgba(26, 115, 232, 0.12);
  --ne-border: #e8eaed;

  /* Surfaces */
  --ne-bg-app: #F2F2F7; /* P2: seamless gray app background (was #f0f4f9) */
  --ne-surface: rgba(255, 255, 255, 0.92);
  --ne-surface-2: #f0f4f9;
  --ne-surface-solid: #ffffff;

  /* Radius (M3 expressive) */
  --ne-radius-xl: 28px;
  --ne-radius-lg: 20px;
  --ne-radius-md: 16px;
  --ne-radius-sm: 12px;

  /* Elevation */
  --ne-shadow-card:
    0 1px 2px rgba(60, 64, 67, 0.06),
    0 6px 18px rgba(60, 64, 67, 0.06);
  --ne-shadow-hero:
    0 1px 2px rgba(26, 115, 232, 0.12),
    0 12px 32px rgba(66, 133, 244, 0.2);

  /* Legacy bridge (Notion vars → Neural) — keeps old modules working */
  --primary: var(--ne-primary);
  --primary-rgb: var(--ne-primary-rgb);
  --primary-active: var(--ne-primary-active);
  --bg-color: var(--ne-bg-app);
  --card-bg: var(--ne-surface-solid);
  --text-primary: var(--ne-ink);
  --text-secondary: var(--ne-muted);
  --text-muted: var(--ne-hint);
  --badge-blue-bg: #e8f0fe;
  --badge-blue-text: var(--ne-primary);
  --md3-radius: var(--ne-radius-md);
  --hover-bg: rgba(var(--ne-primary-rgb), 0.08);
  --skeleton-bg: linear-gradient(90deg, #e8eaed 25%, #f0f4f9 50%, #e8eaed 75%);
  
  /* Accessibility focus styles */
  --focus-ring: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.4);
  --focus-ring-offset: 2px;
}

/* в”Ђв”Ђ Performance Optimizations в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
/* GPU acceleration for animated elements */
.ne-card,
.ne-btn,
.ne-header-btn,
.dmc {
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Reduce paint complexity for scrolling containers */
#module-container,
.ne-shop-chips,
.ne-srv-chips,
.tg-chip-container,
.filter-pills-row {
  contain: layout style paint;
}

/* в”Ђв”Ђ Accessibility & Focus States в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
/* Global focus styles for keyboard navigation */
*:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-ring-offset);
  border-radius: 4px;
}

/* Remove default outline but keep visible focus */
*:focus {
  outline: none;
}

/* Ensure focus is visible on interactive elements */
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--ne-primary);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Skip to main content link for screen readers */
.skip-to-main {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--ne-primary);
  color: white;
  padding: 8px 16px;
  z-index: 10000;
  text-decoration: none;
  border-radius: 0 0 4px 0;
  transition: top 0.3s;
}

.skip-to-main:focus {
  top: 0;
}

/* в”Ђв”Ђ Page shell в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-page {
  padding: 0 0 96px;
  font-family: 'Inter', system-ui, sans-serif;
  background:
    linear-gradient(180deg, #f8f9ff 0%, var(--ne-bg-app) 38%, #ffffff 100%);
  animation: ne-fade-in 0.34s var(--ne-ease-out) both;
}

@keyframes ne-fade-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* в”Ђв”Ђ Hero в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-hero {
  position: relative;
  margin: 12px 16px 16px;
  background: linear-gradient(145deg, #1a73e8 0%, #4285f4 52%, #6f5cf6 100%);
  border-radius: var(--ne-radius-xl);
  padding: 28px 20px 24px;
  text-align: left;
  color: #fff;
  overflow: hidden;
  box-shadow: var(--ne-shadow-hero);
}

.ne-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(125deg, rgba(255,255,255,0.22) 0%, transparent 46%, rgba(255,255,255,0.08) 100%);
  pointer-events: none;
  z-index: 0;
}

.ne-hero > * { position: relative; z-index: 1; }

.ne-hero__logo {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255,255,255,0.2);
  border: 1px solid rgba(255,255,255,0.35);
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.04em;
  margin-bottom: 16px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
}

.ne-hero__title {
  font-size: 26px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 10px;
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.ne-hero__sub {
  font-size: 14px;
  color: rgba(255,255,255,0.9);
  line-height: 1.55;
  margin: 0 0 22px;
  max-width: 520px;
}

/* в”Ђв”Ђ Stat grid (inside hero) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}

.ne-stat {
  background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: var(--ne-radius-md);
  padding: 12px 4px;
  text-align: center;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform 0.2s var(--ne-ease-out), background 0.2s ease;
}

.ne-stat:active { transform: scale(0.97); background: rgba(255,255,255,0.24); }

.ne-stat__val {
  display: block;
  font-size: 19px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
}

.ne-stat__lbl {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
  letter-spacing: 0.08em;
  margin-top: 4px;
  text-transform: uppercase;
}

/* в”Ђв”Ђ Cards в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-card {
  margin: 12px 16px;
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 20px;
  border: 1px solid var(--ne-line);
  box-shadow: var(--ne-shadow-card);
  /* backdrop-filter removed (P1): --ne-surface is 92% opaque over a near-flat app
     bg, so the blur was invisible but ran a GPU layer on every content card. */
  transition: transform 0.22s var(--ne-ease-out), box-shadow 0.22s ease;
}

@keyframes ne-card-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

.ne-card__title {
  font-size: 17px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 10px;
  letter-spacing: -0.02em;
}

.ne-card__desc {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.55;
  margin: 0 0 14px;
}

.ne-card__hint {
  font-size: 12px;
  color: var(--ne-hint);
  line-height: 1.5;
  margin: 12px 0 0;
}

.ne-card--warn {
  background: linear-gradient(135deg, #fef7e0 0%, #fffef5 100%);
  border-color: rgba(249, 171, 0, 0.35);
}

.ne-card--warn .ne-card__warn-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  color: #b06000;
}

.ne-card--warn .ne-card__warn-text {
  font-size: 13px;
  color: #7c4a00;
  line-height: 1.6;
  margin: 0;
}

.ne-callout--danger {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 16px;
  padding: 14px;
  background: linear-gradient(135deg, #fce8e6, #fff8f7);
  border: 1px solid #f9ab9d;
  border-radius: var(--ne-radius-md);
  font-size: 13px;
  color: var(--ne-error);
  line-height: 1.55;
}

/* в”Ђв”Ђ Bar chart (quotas, metrics) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-bar-chart {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 14px 0 4px;
}

.ne-bar-row {
  display: grid;
  grid-template-columns: 40px 1fr 44px;
  align-items: center;
  gap: 10px;
}

.ne-bar-row__label {
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-hint);
}

.ne-bar-row__track {
  height: 10px;
  border-radius: 999px;
  background: var(--ne-border);
  overflow: hidden;
  position: relative;
}

.ne-bar-row__fill {
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  width: var(--ne-pct, 100%);
  border-radius: 999px;
  animation: ne-bar-grow 0.9s var(--ne-ease-out) both;
}

/* Quota bar — light blue background */
.ne-bar-row__fill--quota {
  background: rgba(26,115,232,0.18);
  animation-duration: 0.9s;
}

/* Issued visas bar — solid blue, on top */
.ne-bar-row__fill--issued {
  background: linear-gradient(90deg, var(--ne-primary-2), var(--ne-primary));
  animation-duration: 1.1s;
}

/* 2026 active — quota bar red tint */
.ne-bar-row__fill--active {
  background: rgba(234,67,53,0.18);
}

.ne-bar-row__value {
  font-size: 13px;
  font-weight: 700;
  color: #3c4043;
  text-align: right;
}

/* Sub-label: issued count shown below the bar */
.ne-bar-row__issued {
  grid-column: 2 / 3;
  font-size: 11px;
  color: var(--ne-hint);
  margin-top: -4px;
  padding-left: 2px;
  letter-spacing: 0.01em;
}

.ne-bar-row--active .ne-bar-row__label,
.ne-bar-row--active .ne-bar-row__value {
  color: var(--ne-error);
  font-weight: 800;
}

/* Legend */
.ne-bar-legend {
  display: flex;
  gap: 16px;
  margin: 6px 0 2px;
  flex-wrap: wrap;
}
.ne-bar-legend__item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--ne-hint);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-weight: 600;
}
.ne-bar-legend__dot {
  width: 8px; height: 8px;
  border-radius: 999px;
  flex-shrink: 0;
}
.ne-bar-legend__dot--quota  { background: var(--ne-primary-2); }
.ne-bar-legend__dot--issued { background: #0d47a1; }

@keyframes ne-bar-grow {
  from { width: 0; opacity: 0.6; }
  to { width: var(--ne-pct); opacity: 1; }
}

/* в”Ђв”Ђ List rows (links, operators) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-list { display: flex; flex-direction: column; gap: 8px; }

.ne-list-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  text-decoration: none;
  background: var(--ne-surface-solid);
  color: inherit;
  transition: transform 0.2s var(--ne-ease-out), border-color 0.2s, box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.ne-list-row:active {
  transform: scale(0.97);
  box-shadow: 0 2px 8px rgba(var(--ne-primary-rgb), 0.12);
  border-color: rgba(var(--ne-primary-rgb), 0.25);
}

.ne-list-row__badge {
  width: 40px;
  height: 40px;
  border-radius: var(--ne-radius-sm);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  box-shadow: 0 4px 12px rgba(0,0,0,0.12), inset 0 1px 0 rgba(255,255,255,0.3);
}

.ne-list-row__title {
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-ink);
  flex: 1;
  letter-spacing: -0.01em;
}

.ne-list-row__meta { font-size: 11px; color: var(--ne-hint); }

.ne-list-row__chev {
  color: #bdc1c6;
  font-size: 20px;
  transition: transform 0.3s var(--ne-ease-spring), color 0.2s;
}

.ne-list-row:active .ne-list-row__chev {
  transform: translateX(3px);
  color: var(--ne-primary);
}

.ne-list-row__icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-variation-settings: 'FILL' 1;
}

.ne-list-row__icon--primary {
  background: linear-gradient(135deg, #e8f0fe, #d2e3fc);
  color: var(--ne-primary);
}

.ne-list-row__icon--success {
  background: linear-gradient(135deg, #e6f4ea, #ceead6);
  color: #137333;
}

.ne-list-row__body { flex: 1; min-width: 0; }

.ne-list-row__subtitle { font-size: 12px; color: var(--ne-hint); }

.ne-icon-muted { color: #bdc1c6; font-size: 18px; flex-shrink: 0; }

/* в”Ђв”Ђ Timeline (process steps) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-timeline { display: flex; flex-direction: column; margin-top: 4px; }

.ne-timeline__step {
  display: flex;
  gap: 14px;
  padding: 0 0 20px;
}

.ne-timeline__step--last { padding-bottom: 0; }

.ne-timeline__rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  width: 36px;
}

.ne-timeline__rail::after {
  content: "";
  flex: 1;
  width: 2px;
  margin-top: 6px;
  background: linear-gradient(180deg, var(--ne-primary) 0%, rgba(138, 180, 248, 0.35) 100%);
  border-radius: 2px;
  min-height: 24px;
}

.ne-timeline__step--last .ne-timeline__rail::after { display: none; }

.ne-timeline__num {
  width: 36px;
  height: 36px;
  border-radius: var(--ne-radius-sm);
  flex-shrink: 0;
  background: linear-gradient(145deg, var(--ne-primary), var(--ne-violet));
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 16px rgba(var(--ne-primary-rgb), 0.28);
}

.ne-timeline__panel {
  flex: 1;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  padding: 12px 14px;
  border: 1px solid rgba(var(--ne-primary-rgb), 0.08);
}

.ne-timeline__title {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 4px;
  letter-spacing: -0.01em;
}

.ne-timeline__desc {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.55;
}

/* в”Ђв”Ђ Checklist rows в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-checklist {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 8px;
}

.ne-checklist__item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13.5px;
  color: #3c4043;
  padding: 10px 12px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
}

.ne-checklist__icon {
  font-size: 22px;
  color: var(--ne-primary);
  flex-shrink: 0;
  font-variation-settings: 'FILL' 1;
}

/* в”Ђв”Ђ FAQ accordion в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-faq-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

.ne-faq {
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  overflow: hidden;
  background: var(--ne-surface-solid);
  transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.25s;
}

.ne-faq[open] {
  border-color: rgba(var(--ne-primary-rgb), 0.35);
  background: linear-gradient(180deg, #f8f9ff 0%, #fff 100%);
  box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.1);
}

.ne-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
  font-size: 14px;
  font-weight: 600;
  color: var(--ne-ink);
  -webkit-tap-highlight-color: transparent;
}

.ne-faq__q::-webkit-details-marker { display: none; }

.ne-faq__chev {
  font-size: 22px;
  color: var(--ne-hint);
  transition: transform 0.4s var(--ne-ease-spring), color 0.2s;
}

.ne-faq[open] .ne-faq__chev {
  transform: rotate(180deg);
  color: var(--ne-primary);
}

.ne-faq__a {
  padding: 0 16px 14px;
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.6;
  animation: ne-faq-open 0.35s var(--ne-ease-out);
}

@keyframes ne-faq-open {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* в”Ђв”Ђ Buttons (shared primitives for upcoming phases) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: var(--ne-radius-sm);
  font-weight: 700;
  font-size: 14px;
  border: none;
  cursor: pointer;
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.ne-btn:active { transform: scale(0.97); }

.ne-btn:focus-visible {
  outline: 2px solid var(--ne-primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(var(--ne-primary-rgb), 0.2);
}

.ne-btn--primary {
  background: var(--ne-primary);
  color: #fff;
}

.ne-btn--primary:active { background: var(--ne-primary-active); }

.ne-btn--secondary {
  background: var(--ne-surface-solid);
  color: var(--ne-ink);
  border: 1px solid var(--ne-border);
}

/* в”Ђв”Ђ Footer в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-footer {
  text-align: center;
  padding: 20px 16px 8px;
  font-size: 11px;
  color: #bdc1c6;
  letter-spacing: 0.04em;
}

/* в”Ђв”Ђ Filled material icons helper в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-icon-fill { font-variation-settings: 'FILL' 1; }

/* в”Ђв”Ђ Orientation-specific optimizations в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
@media (orientation: landscape) and (max-height: 600px) {
  /* Compact layout for landscape on small screens */
  .ne-hero {
    padding: 16px 20px;
    margin: 8px 16px 12px;
  }
  
  .ne-hero__title {
    font-size: 20px;
    margin-bottom: 8px;
  }
  
  .ne-hero__sub {
    font-size: 13px;
    margin-bottom: 16px;
    max-width: 400px;
  }
  
  .ne-page {
    padding: 0 0 60px;
  }
  
  .ne-card {
    margin: 8px 16px;
    padding: 16px;
  }
}

@media (max-width: 420px) {
  .ne-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (orientation: portrait) and (min-width: 768px) {
  /* Enhanced layout for portrait tablets */
  .ne-shop-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .course-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* в”Ђв”Ђ Intermediate breakpoints в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
@media (min-width: 840px) {
  /* Between tablet and desktop */
  .sponsors-cards-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  
  .timeline-log {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 900px) and (max-width: 1023px) {
  /* Small desktop optimization */
  .wiki-root {
    max-width: 1000px;
    margin: 0 auto;
  }
  
  .ne-shop-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* в”Ђв”Ђ Reduced motion в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
@media (prefers-reduced-motion: reduce) {
  .ne-page,
  .ne-card,
  .ne-bar-row__fill,
  .ne-faq__a { animation: none; }
  .ne-stat,
  .ne-list-row,
  .ne-faq__chev,
  .ne-btn { transition-duration: 0.01ms; }
}

/* Broad catch-all: the per-selector block above missed ~7 of 43 keyframe loops.
   Kill every animation loop + transition for users who ask for reduced motion. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* в”Ђв”Ђ Dark mode (system) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
@media not all {
  :root {
    --ne-ink: #e8eaed;
    --ne-muted: #9aa0a6;
    --ne-hint: #9aa0a6;
    --ne-surface: rgba(32, 33, 36, 0.94);
    --ne-surface-2: #292a2d;
    --ne-surface-solid: #292a2d;
    --ne-line: rgba(138, 180, 248, 0.15);
    --ne-border: rgba(255, 255, 255, 0.08);
    --ne-bg-app: #16181c;
    --card-bg: var(--ne-surface-solid);
    --bg-color: #0d1117;
  }

  .ne-page {
    background:
      linear-gradient(180deg, #0d1117 0%, var(--ne-bg-app) 50%, #0d1117 100%);
  }

  .ne-hero {
    background: linear-gradient(155deg, #174ea6 0%, var(--ne-primary) 40%, #5e35b1 85%);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
  }

  .ne-card { box-shadow: 0 4px 20px rgba(0,0,0,0.35); }

  .ne-list-row,
  .ne-faq { background: var(--ne-surface-solid); }

  .ne-bar-row__track { background: #3c4043; }

  .ne-faq[open] {
    background: linear-gradient(180deg, #1e3a5f 0%, var(--ne-surface-solid) 100%);
  }

  .ne-card--warn {
    background: rgba(249, 171, 0, 0.12);
    border-color: rgba(249, 171, 0, 0.3);
  }

  .ne-card--warn .ne-card__warn-head { color: #fdd663; }
  .ne-card--warn .ne-card__warn-text { color: #fce8b2; }

  .ne-callout--danger {
    background: rgba(234, 67, 53, 0.12);
    border-color: rgba(234, 67, 53, 0.25);
    color: #f28b82;
  }

  .ne-checklist__item { color: #e8eaed; }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 2 — App shell (header, drawer, module area)
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* в”Ђв”Ђ Brand mark в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-logo {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
}

.ne-logo--lg { font-size: 22px; }

.ne-logo__six { color: var(--ne-primary); }
.ne-logo__oy { color: var(--ne-ink); }
.ne-logo__tld { color: var(--ne-hint); font-weight: 700; }

.ne-logo--center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
}

.ne-logo--link {
  pointer-events: auto;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* в”Ђв”Ђ Top header в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
#top-header.ne-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 100;
  padding: 5px 16px;
  padding-top: max(5px, env(safe-area-inset-top, 0px));
  background: #F2F2F7; /* P2: seamless gray canonical header — same on every tab */
  border-bottom: none;
  box-shadow: none;
  /* backdrop-filter removed (P1): header bg is 90% opaque so the frost was barely
     visible, but the blur re-sampled on every scroll frame — a cheap-Android cost. */
}

.ne-header-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: none;
  border-radius: var(--ne-radius-sm);
  background: transparent;
  color: var(--ne-ink);
  cursor: pointer;
  transition: transform 0.18s var(--ne-ease-out), background 0.2s, color 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.ne-header-btn--menu { margin-right: auto; }

/* Right-side action group: sync + profile, kept together flush-right.
   margin-left:auto pairs with the menu button's margin-right:auto so the
   header reads: ☰ (left) · logo (center) · sync+profile (right). */
.ne-header-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}
.ne-header-btn--sync {
  color: var(--ne-primary);
  position: relative;
}
.ne-header-btn--profile { color: var(--ne-ink); }
/* Persistent SOS / safeguarding entry — calm amber "help" accent (not alarming
   red), distinct from the blue sync button. Guide lives in the drawer now. */
.ne-header-btn--sos .material-symbols-outlined { color: #b06000; }
.ne-header-btn--profile.active .material-symbols-outlined {
  color: var(--ne-primary);
  font-variation-settings: 'FILL' 1;
}

/* Update-available indicator — pulsing orange dot on the sync (🔄) button.
   Toggled by adding .ne-header-btn--has-update when a new version is ready. */
.ne-header-btn--has-update::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 5px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #F97316; /* orange-500 */
  border: 1.5px solid #fff;
  box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.55);
  animation: ne-update-pulse 1.8s ease-out infinite;
  pointer-events: none;
}
@keyframes ne-update-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.55); }
  70%  { box-shadow: 0 0 0 7px rgba(249, 115, 22, 0); }
  100% { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0); }
}

.ne-header-btn:active {
  transform: scale(0.97);
  background: rgba(var(--ne-primary-rgb), 0.1);
}

.ne-header-btn:focus-visible {
  background: rgba(var(--ne-primary-rgb), 0.15);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.3);
}

.ne-header-btn .material-symbols-outlined { font-size: 22px; }

/* в”Ђв”Ђ Module viewport в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
#module-container {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  padding: var(--spacing-md, 16px);
  background:
    linear-gradient(180deg, #f8f9ff 0%, var(--ne-bg-app) 32%, #ffffff 100%);
}

#module-container:has(.ne-page:not(.ne-page--inset)) {
  padding: 0;
}

#module-container:has(.ne-page--inset) {
  padding: var(--spacing-md, 16px);
}

.module-pane {
  animation: ne-module-in 0.32s var(--ne-ease-out) both;
}

@keyframes ne-module-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.skeleton-wrapper { margin-top: 32px; padding: 0 4px; }

.skeleton {
  background: var(--skeleton-bg);
  background-size: 200% 100%;
  animation: ne-skeleton-shimmer 1.6s infinite ease-in-out;
  border-radius: var(--ne-radius-md);
}

@keyframes ne-skeleton-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* в”Ђв”Ђ Drawer backdrop в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
#menu-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(27, 27, 31, 0.38);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s var(--ne-ease-out);
}

#menu-drawer-backdrop.open {
  opacity: 1;
  pointer-events: all;
}

/* в”Ђв”Ђ Drawer panel в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
#menu-drawer {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1001;
  width: min(300px, 88vw);
  display: flex;
  flex-direction: column;
  padding-bottom: env(safe-area-inset-bottom, 16px);
  overflow-y: auto;
  background:
    linear-gradient(180deg, rgba(var(--ne-primary-rgb), 0.035) 0%, transparent 96px),
    var(--ne-surface-solid);
  border-right: 1px solid var(--ne-line);
  box-shadow: 8px 0 28px rgba(60, 64, 67, 0.1);
  transform: translateX(-100%);
  transition: transform 0.28s var(--ne-ease-out);
}

#menu-drawer.open { transform: translateX(0); }

.mdr-handle-bar,
.mdr-handle { display: none; }

/* Profile block (Telegram-style) */
.mdr-profile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: max(20px, env(safe-area-inset-top, 16px)) 16px 16px;
  border-bottom: 1px solid var(--ne-line);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s;
}
.mdr-profile:active { background: rgba(var(--ne-primary-rgb), 0.06); }

.mdr-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #8e8e93;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 600;
  flex-shrink: 0;
  letter-spacing: 0;
}

.mdr-profile-info {
  flex: 1;
  min-width: 0;
}

.mdr-user-name {
  font-size: 16px;
  font-weight: 600;
  color: var(--ne-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mdr-user-sub {
  font-size: 13px;
  color: var(--ne-muted);
  margin-top: 2px;
}

.mdr-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: var(--ne-radius-sm);
  background: var(--ne-surface-2);
  color: var(--ne-muted);
  cursor: pointer;
  transition: transform 0.18s var(--ne-ease-out), background 0.2s;
}

.mdr-close:active {
  transform: scale(0.97);
  background: rgba(var(--ne-primary-rgb), 0.12);
}

.mdr-close .material-symbols-outlined { font-size: 20px; }

.mdr-list {
  display: flex;
  flex-direction: column;
  padding: 8px 0 20px;
}

.ne-drawer-divider {
  height: 1px;
  margin: 10px 6px;
  background: var(--ne-line);
}

/* Drawer menu rows (Telegram-style) */
.dmc {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 20px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  transition: background 0.15s;
  -webkit-tap-highlight-color: transparent;
}

.dmc:active { background: rgba(var(--ne-primary-rgb), 0.06); transform: none; }

.dmc:focus-visible { outline: 2px solid var(--ne-primary); outline-offset: -2px; }

.dmc.active .dmc__label { color: var(--ne-primary); font-weight: 600; }
.dmc.active .dmc__icon-wrap { background: rgba(var(--ne-primary-rgb), 0.12); }
.dmc.active .dmc__icon { color: var(--ne-primary); }

.dmc__icon-wrap {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(var(--ne-primary-rgb), 0.08);
  transition: background 0.15s;
}

.dmc__icon {
  font-size: 22px;
  color: var(--ne-primary);
  font-variation-settings: 'FILL' 1;
}

.dmc__label {
  flex: 1;
  font-size: 15px;
  font-weight: 500;
  color: var(--ne-ink);
  letter-spacing: -0.01em;
}

.dmc__arrow {
  font-size: 18px;
  color: var(--ne-muted);
  opacity: 0.5;
}

/* в”Ђв”Ђ PWA install banner в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
/* PWA install banner styles removed (P2): the banner was retired in June; install now
   lives on the Settings card. Deleted .ne-pwa-banner*, .pulse-install-btn, @keyframes ne-pwa-pulse. */

.spin-animation {
  animation: ne-spin 0.8s linear infinite !important;
  display: inline-block;
}

@keyframes ne-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Desktop persistent-sidebar variant disabled — the drawer behaves as a
   slide-in (toggled by ☰) on all viewports, consistent with the bottom nav. */

@media not all {
  #top-header.ne-header {
    background: rgba(32, 33, 36, 0.9);
    border-bottom-color: var(--ne-line);
  }

  #module-container {
    background:
      linear-gradient(180deg, #0d1117 0%, var(--ne-bg-app) 40%, #0d1117 100%);
  }

  #menu-drawer {
    background:
      linear-gradient(180deg, rgba(var(--ne-primary-rgb), 0.12) 0%, transparent 140px),
      var(--ne-surface-solid);
  }

  .dmc { background: #292a2d; }
  .dmc.active {
    background: linear-gradient(135deg, #1e3a5f 0%, #292a2d 100%);
  }

  .mdr-close { background: #3c4043; color: #e8eaed; }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 3 — Light modules (Flights, Services, Settings)
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.ne-page--inset {
  padding: 0 0 88px;
  min-height: 100%;
}

.ne-page--embed {
  padding: 0 0 40px;
  min-height: calc(100vh - 72px);
}

/* Segmented control (tabs) */
.ne-seg-control {
  display: flex;
  width: 100%;
  gap: 4px;
  margin-bottom: 20px;
  padding: 3px;
  border-radius: var(--ne-radius-sm);
  background: rgba(var(--ne-primary-rgb), 0.08);
}

.ne-seg-item {
  flex: 1;
  padding: 10px 8px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  color: var(--ne-muted);
  cursor: pointer;
  opacity: 0.75;
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s, color 0.2s, opacity 0.2s, box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.ne-seg-item.active {
  opacity: 1;
  color: var(--ne-primary);
  background: var(--ne-surface-solid);
  box-shadow: 0 2px 10px rgba(var(--ne-primary-rgb), 0.12);
}

.ne-seg-item:active { transform: scale(0.97); }

/* в”Ђв”Ђ Flights в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-flights-loader {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 48px 20px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--ne-muted);
}

.ne-flights-loader__icon {
  width: 52px;
  height: 52px;
  border-radius: var(--ne-radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(145deg, var(--ne-cyan), var(--ne-primary));
  box-shadow: 0 8px 20px rgba(var(--ne-primary-rgb), 0.28);
  animation: ne-flights-pulse 1.5s ease-in-out infinite;
}

.ne-flights-loader__icon .material-symbols-outlined {
  font-size: 28px;
  font-variation-settings: 'FILL' 1;
}

@keyframes ne-flights-pulse {
  0%, 100% { opacity: 0.85; transform: scale(0.96); }
  50% { opacity: 1; transform: scale(1.04); }
}

.ne-flights-widget { margin-bottom: 12px; }

/* Travelpayouts watermark hide */
.ne-flights-widget .tpwl-watermark,
.ne-flights-widget .tpwl-powered,
.ne-flights-widget .tpwl-footer,
.ne-flights-widget a[href*="travelpayouts.com"],
#tpwl-tickets .tpwl-watermark,
#tpwl-tickets .tpwl-powered,
#tpwl-tickets a[href*="travelpayouts.com"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
}

/* в”Ђв”Ђ Services (TransferGo / Aviasales) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-srv-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 16px;
  padding: 12px 14px;
  border-radius: var(--ne-radius-md);
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-primary);
  background: linear-gradient(135deg, #e8f0fe 0%, #f8f9ff 100%);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.15);
}

.ne-srv-banner .material-symbols-outlined {
  font-size: 19px;
  line-height: 1;
}

.ne-srv-field {
  margin-bottom: 16px;
  padding: 16px;
  border-radius: var(--ne-radius-md);
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
}

.ne-srv-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ne-muted);
}

.ne-srv-label .material-symbols-outlined {
  font-size: 16px;
  line-height: 1;
  color: var(--ne-primary);
}

.ne-srv-input-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: var(--ne-radius-sm);
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
}

.ne-srv-input-row input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 22px;
  font-weight: 800;
  color: var(--ne-ink);
  font-family: inherit;
}

.ne-srv-currency {
  font-size: 15px;
  font-weight: 800;
  color: var(--ne-primary);
}

.ne-srv-chips {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.ne-srv-chips::-webkit-scrollbar { display: none; }

.ne-srv-chip {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  color: var(--ne-primary);
  background: rgba(var(--ne-primary-rgb), 0.08);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.18);
  cursor: pointer;
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s;
}

.ne-srv-chip:active {
  transform: scale(0.95);
  background: rgba(var(--ne-primary-rgb), 0.14);
}

.ne-srv-rate {
  margin: 16px 0;
  padding: 14px;
  border-radius: var(--ne-radius-md);
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--ne-ink);
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
}

.ne-srv-rate__live {
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.ne-srv-rate__live .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-primary);
}

.ne-srv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 10px;
  padding: 16px;
  border: none;
  border-radius: var(--ne-radius-md);
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  cursor: pointer;
  background: linear-gradient(145deg, var(--ne-primary), var(--ne-primary-active));
  box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.22);
  transition: transform 0.35s var(--ne-ease-spring);
}

.ne-srv-btn .material-symbols-outlined {
  font-size: 20px;
  line-height: 1;
}

.ne-srv-btn:active { transform: scale(0.97); }

.ne-srv-btn--success {
  background: linear-gradient(145deg, #34a853, #137333);
  box-shadow: 0 4px 14px rgba(19, 115, 51, 0.2);
}

.ne-srv-btn--row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.ne-srv-shimmer {
  display: inline-block;
  width: 80px;
  height: 18px;
  border-radius: 4px;
  vertical-align: middle;
  background: var(--ne-surface-2);
  background-image: linear-gradient(90deg, var(--ne-surface-2) 0%, #fff 50%, var(--ne-surface-2) 100%);
  background-size: 200% 100%;
  animation: ne-skeleton-shimmer 1.2s linear infinite;
}

.ne-av-hero {
  margin-bottom: 20px;
  padding: 32px 24px;
  border-radius: var(--ne-radius-lg);
  text-align: center;
  color: #fff;
  background: linear-gradient(145deg, var(--ne-cyan) 0%, #0088b3 55%, var(--ne-primary) 100%);
  box-shadow: var(--ne-shadow-hero);
}

.ne-av-hero__icon {
  font-size: 48px;
  margin-bottom: 12px;
  font-variation-settings: 'FILL' 1;
}

.ne-av-hero__title {
  margin: 0 0 8px;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.ne-av-hero__sub {
  margin: 0;
  font-size: 14px;
  opacity: 0.92;
}

.ne-av-route {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding: 18px;
  border-radius: var(--ne-radius-md);
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  box-shadow: var(--ne-shadow-card);
}

.ne-av-route__cell {
  flex: 1;
  padding: 14px 10px;
  border-radius: var(--ne-radius-sm);
  text-align: center;
  background: var(--ne-surface-2);
}

.ne-av-route__lbl {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ne-hint);
  margin-bottom: 6px;
}

.ne-av-route__val {
  font-size: 17px;
  font-weight: 800;
  color: var(--ne-ink);
}

.ne-av-route__meta {
  font-size: 11px;
  color: var(--ne-hint);
  margin-top: 4px;
}

.ne-av-route__plane {
  color: var(--ne-primary-2);
  font-size: 22px;
}

.ne-av-footnote {
  margin-top: 20px;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  color: var(--ne-muted);
  line-height: 1.5;
}

/* в”Ђв”Ђ Settings в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings .ne-page__title {
  font-size: 26px;
  font-weight: 800;
  color: var(--ne-ink);
  letter-spacing: -0.02em;
  margin: 0 0 14px;
  padding: 8px 16px 0;
}

.ne-settings .finance-card,
.ne-settings .welcome-motivational {
  margin-left: 16px;
  margin-right: 16px;
  border-radius: var(--ne-radius-md) !important;
  border: 1px solid var(--ne-line) !important;
  box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06) !important;
}

.ne-settings .welcome-motivational {
  background: linear-gradient(145deg, #f8f9ff 0%, #fff 100%) !important;
}

.ne-settings .wiki-tabs,
.ne-settings .ne-seg-control {
  margin-left: 16px;
  margin-right: 16px;
}

.ne-settings .ne-seg-control.settings-mobile-tabs {
  margin-left: 0;
  margin-right: 0;
}

.ne-settings h1[style*="Lora"],
.ne-settings h2[style*="Lora"],
.ne-settings .desktop-column-header {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--ne-ink) !important;
}

.ne-settings .settings-mobile-tabs .ne-seg-item,
.ne-settings .desktop-column-header,
.ne-settings .ne-settings-panel__head,
.ne-settings-status {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ne-settings .settings-mobile-tabs .material-symbols-outlined,
.ne-settings .desktop-column-header .material-symbols-outlined,
.ne-settings .ne-settings-panel__head .material-symbols-outlined {
  font-size: 20px;
  line-height: 1;
  color: var(--ne-primary);
}

.ne-settings-status {
  justify-content: flex-start;
}

.ne-settings-status .material-symbols-outlined {
  font-size: 16px;
  line-height: 1;
}

.ne-settings-status--updated {
  color: #10b981;
}

.ne-settings .settings-item-right-small,
.ne-settings select.settings-item-right-small {
  border-color: var(--ne-border) !important;
  color: var(--ne-primary) !important;
  background-color: var(--ne-surface-2) !important;
}

.ne-settings .settings-item-right-small:focus {
  border-color: rgba(var(--ne-primary-rgb), 0.4) !important;
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.1) !important;
}

.ne-settings .md3-switch.active { background: var(--ne-primary); }

.ne-settings .checklist-item .icon.done { color: #34a853; }

@media (min-width: 1024px) {
  .ne-settings {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 4 — Menu & Shop
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.ne-page__title {
  font-size: 26px;
  font-weight: 800;
  color: var(--ne-ink);
  letter-spacing: -0.02em;
  margin: 0 0 4px;
}

.ne-page__sub {
  font-size: 13px;
  color: var(--ne-muted);
  margin: 0;
  line-height: 1.45;
}

/* в”Ђв”Ђ Menu в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-menu__head {
  padding: 8px 16px 20px;
}

.ne-menu__nav {
  padding: 0 16px;
  margin-bottom: 18px;
  gap: 7px;
}

.ne-menu .ne-list-row {
  min-height: 64px;
  padding: 10px 12px;
  gap: 11px;
  border-radius: 15px;
  border-color: rgba(60, 64, 67, 0.13);
  box-shadow: 0 1px 3px rgba(60, 64, 67, 0.08);
}

.ne-menu .ne-list-row:active {
  transform: scale(0.985);
  box-shadow: 0 2px 8px rgba(var(--ne-primary-rgb), 0.12);
}

.ne-menu-nav__icon {
  color: #fff !important;
  width: 40px;
  height: 40px;
  border-radius: 13px;
  font-size: 21px;
  box-shadow: 0 2px 8px rgba(60, 64, 67, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.ne-menu .ne-list-row__title {
  font-size: 14px;
  font-weight: 760;
}

.ne-menu .ne-list-row__subtitle {
  font-size: 11px;
  line-height: 1.3;
}

.ne-menu-settings {
  margin: 0 16px 16px;
  padding: 0;
  overflow: hidden;
}

.ne-menu-settings__head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: var(--ne-surface-2);
  border-bottom: 1px solid var(--ne-border);
}

.ne-menu-settings__head-icon {
  font-size: 18px;
  color: var(--ne-muted);
}

.ne-menu-settings__head-label {
  flex: 1;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ne-muted);
}

.ne-menu-settings__head-goto {
  font-size: 18px;
  color: var(--ne-hint);
  cursor: pointer;
  transition: color 0.2s;
}

.ne-menu-settings__head-goto:active { color: var(--ne-primary); }

.ne-menu-srow {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--ne-border);
}

.ne-menu-srow:last-of-type { border-bottom: none; }

.ne-menu-srow__left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.ne-menu-srow__icon {
  font-size: 15px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ne-menu-srow__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-ink);
}

.ne-menu-srow__ctrl {
  border: 1px solid var(--ne-border);
  border-radius: 10px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-primary);
  background: var(--ne-surface-2);
  text-align: center;
  font-family: inherit;
  outline: none;
  max-width: 140px;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%231a73e8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  padding-right: 24px;
}

input.ne-menu-srow__ctrl {
  background-image: none;
  padding-right: 10px;
  text-align: right;
}

.ne-menu-srow__ctrl:focus {
  border-color: rgba(var(--ne-primary-rgb), 0.4);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.1);
}

.ne-menu-settings__full-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 14px;
  background: none;
  border: none;
  border-top: 1px solid var(--ne-border);
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-primary);
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s;
}

.ne-menu-settings__full-btn:active {
  background: rgba(var(--ne-primary-rgb), 0.08);
}

.ne-menu__version {
  text-align: center;
  margin-top: 8px;
  padding-bottom: 24px;
  font-size: 11px;
  color: var(--ne-hint);
  letter-spacing: 0.06em;
}

/* в”Ђв”Ђ Shop в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-page--shop {
  padding: 0 0 96px;
}

.ne-shop-hero {
  margin: 0;
  border-radius: 0;
  text-align: center;
  padding: 36px 20px 32px;
}

.ne-shop-hero .ne-hero__title {
  text-align: center;
  font-family: 'Lora', Georgia, serif;
}

.ne-shop-hero .ne-hero__sub {
  text-align: center;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
  color: rgba(255, 255, 255, 0.88);
}

.ne-shop-chips {
  display: flex;
  gap: 8px;
  padding: 14px 16px;
  overflow-x: auto;
  background: var(--ne-surface-solid);
  border-bottom: 1px solid var(--ne-border);
  position: sticky;
  top: 0;
  z-index: 50;
  -webkit-overflow-scrolling: touch;
}

.ne-shop-chips::-webkit-scrollbar { display: none; }

.ne-shop-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1.5px solid var(--ne-border);
  border-radius: 999px;
  background: var(--ne-surface-solid);
  color: var(--ne-muted);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  font-family: inherit;
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s, color 0.2s, border-color 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.ne-shop-chip .material-symbols-outlined { font-size: 18px; }

.ne-shop-chip.active {
  background: var(--ne-ink);
  border-color: var(--ne-ink);
  color: #fff;
}

.ne-shop-chip:active { transform: scale(0.96); }

.ne-shop-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding: 16px;
}

@media (min-width: 600px) {
  .ne-shop-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
}

@media (min-width: 768px) {
  .ne-shop-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
}

@media (min-width: 900px) {
  .ne-shop-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 1000px; margin: 0 auto; }
}

@media (min-width: 1024px) {
  .ne-shop-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 1200px; margin: 0 auto; }
}

.ne-shop-card {
  background: var(--ne-surface-solid);
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  box-shadow: var(--ne-shadow-card);
  transition: transform 0.35s var(--ne-ease-spring), box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
  animation: ne-fade-in 0.45s var(--ne-ease-out) both;
}

.ne-shop-card:active {
  transform: scale(0.97);
}

.ne-shop-card__gallery {
  position: relative;
  width: 100%;
  padding-top: 130%;
  background: var(--ne-surface-2);
  overflow: hidden;
}

.ne-shop-card__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.ne-shop-card__price {
  position: absolute;
  bottom: 8px;
  left: 8px;
  background: rgba(27, 27, 31, 0.88);
  color: #fff;
  padding: 4px 10px;
  border-radius: 12px;
  font-weight: 800;
  font-size: 13px;
  backdrop-filter: blur(6px);
}

.ne-shop-card__brand {
  position: absolute;
  top: 8px;
  left: 8px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--ne-ink);
  padding: 2px 8px;
  border-radius: 8px;
  font-weight: 700;
  font-size: 10px;
  text-transform: uppercase;
  border: 1px solid var(--ne-border);
}

.ne-shop-card__body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.ne-shop-card__meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.ne-shop-card__tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 700;
  color: var(--ne-muted);
  background: var(--ne-surface-2);
  padding: 2px 6px;
  border-radius: 6px;
  text-transform: uppercase;
}

.ne-shop-card__tag .material-symbols-outlined { font-size: 11px; }

.ne-shop-card__title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-ink);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2; /* Standard property for future compatibility */
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 36px;
}

.ne-shop-skeleton__fill {
  position: absolute;
  inset: 0;
  background: var(--ne-border);
  animation: ne-skeleton-pulse 1.5s infinite ease-in-out;
}

.ne-shop-skeleton-line {
  animation: ne-skeleton-pulse 1.5s infinite ease-in-out;
}

.ne-shop-skeleton-line {
  height: 12px;
  background: var(--ne-border);
  border-radius: 4px;
  margin-bottom: 6px;
}

.ne-shop-skeleton-line--short { width: 40%; }
.ne-shop-skeleton-line--half { width: 60%; }

@keyframes ne-skeleton-pulse {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}

.ne-shop-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 48px 24px;
  color: var(--ne-hint);
}

.ne-shop-empty__icon {
  font-size: 48px;
  margin-bottom: 12px;
  color: var(--ne-muted);
}

.ne-shop-empty__title {
  font-size: 16px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 6px;
}

.ne-shop-empty__desc { font-size: 13px; }

/* Modal sheet (Shop + shared) */
.ne-modal-overlay,
.zoir-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: rgba(27, 27, 31, 0.45);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  backdrop-filter: blur(6px);
  animation: ne-modal-fade-in 0.3s var(--ne-ease-out);
}

.ne-modal-overlay.fade-out,
.zoir-modal-overlay.fade-out {
  animation: ne-modal-fade-out 0.28s ease forwards;
}

.ne-modal-sheet,
.zoir-modal-sheet {
  width: 100%;
  max-height: 92vh;
  background: var(--ne-surface-solid);
  border-radius: var(--ne-radius-xl) var(--ne-radius-xl) 0 0;
  box-shadow: 0 -12px 48px rgba(27, 27, 31, 0.18);
  display: flex;
  flex-direction: column;
  animation: ne-modal-slide-up 0.4s var(--ne-ease-out) both;
}

.ne-modal-sheet.slide-down,
.zoir-modal-sheet.slide-down {
  animation: ne-modal-slide-down 0.3s var(--ne-ease-out) forwards;
}

.ne-modal-handle {
  width: 40px;
  height: 4px;
  margin: 10px auto 0;
  border-radius: 4px;
  background: var(--ne-border);
  cursor: pointer;
}

.ne-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px 8px;
  gap: 12px;
}

.ne-modal-header__title {
  font-size: 16px;
  font-weight: 700;
  color: var(--ne-ink);
  font-family: 'Lora', Georgia, serif;
}

.ne-modal-header__close {
  cursor: pointer;
  color: var(--ne-muted);
  font-size: 24px;
}

.ne-shop-modal__body {
  flex: 1;
  overflow-y: auto;
  padding: 0 0 16px;
  display: flex;
  flex-direction: column;
}

.ne-shop-modal__gallery {
  position: relative;
  width: 100%;
  padding-top: 100%;
  background: var(--ne-surface-2);
  overflow: hidden;
}

.ne-shop-modal__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ne-shop-gallery-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ne-ink);
  cursor: pointer;
  box-shadow: var(--ne-shadow-card);
  backdrop-filter: blur(4px);
  z-index: 10;
}

.ne-shop-gallery-btn--prev { left: 16px; }
.ne-shop-gallery-btn--next { right: 16px; }

.ne-shop-modal__badge {
  position: absolute;
  bottom: 16px;
  right: 16px;
  background: rgba(27, 27, 31, 0.78);
  color: #fff;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 700;
}

.ne-shop-gallery-dots {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 6px;
}

.ne-shop-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transition: 0.2s;
}

.ne-shop-dot.active {
  width: 16px;
  border-radius: 3px;
  background: #fff;
}

.ne-shop-modal__info { padding: 20px; }

.ne-shop-modal__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 16px;
}

.ne-shop-modal__title {
  font-size: 18px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 4px;
  line-height: 1.3;
}

.ne-shop-modal__brand {
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.ne-shop-modal__price {
  font-size: 24px;
  font-weight: 900;
  color: var(--ne-ink);
  flex-shrink: 0;
}

.ne-shop-spec-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}

.ne-shop-spec {
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.ne-shop-spec .material-symbols-outlined {
  color: var(--ne-muted);
  font-size: 20px;
}

.ne-shop-spec__lbl {
  display: block;
  font-size: 9px;
  font-weight: 700;
  color: var(--ne-hint);
  letter-spacing: 0.05em;
}

.ne-shop-spec__val {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-ink);
}

.ne-shop-modal__desc {
  border-top: 1px solid var(--ne-border);
  padding-top: 16px;
}

.ne-shop-modal__desc-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin: 0 0 8px;
}

.ne-shop-modal__desc-text {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.6;
  margin: 0;
}

.ne-shop-modal__actions {
  padding: 16px 20px;
  border-top: 1px solid var(--ne-border);
}

.ne-btn--block {
  width: 100%;
  justify-content: center;
  gap: 8px;
}

.ne-btn--pulse {
  animation: ne-btn-pulse 2s ease-in-out infinite;
}

@keyframes ne-btn-pulse {
  0%, 100% { box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.35); }
  50% { box-shadow: 0 6px 22px rgba(var(--ne-primary-rgb), 0.5); }
}

@keyframes ne-modal-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes ne-modal-fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes ne-modal-slide-up {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

@keyframes ne-modal-slide-down {
  from { transform: translateY(0); }
  to { transform: translateY(100%); }
}

@media (min-width: 768px) {
  .ne-modal-overlay,
  .zoir-modal-overlay { align-items: center; padding: 20px; }
  .ne-modal-sheet,
  .zoir-modal-sheet {
    max-width: 500px;
    border-radius: var(--ne-radius-xl);
    animation: ne-modal-scale-in 0.32s var(--ne-ease-out) both;
  }
  .ne-modal-sheet.slide-down,
  .zoir-modal-sheet.slide-down {
    animation: ne-modal-scale-out 0.28s var(--ne-ease-out) forwards;
  }
}

@keyframes ne-modal-scale-in {
  from { opacity: 0; transform: scale(0.94); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes ne-modal-scale-out {
  from { opacity: 1; transform: scale(1); }
  to { opacity: 0; transform: scale(0.94); }
}

@media not all {
  .ne-menu-settings__head { background: #292a2d; }
  .ne-menu-srow__ctrl { background: #3c4043; border-color: #5f6368; color: #8ab4f8; }

  .ne-shop-chips { background: #292a2d; border-color: rgba(255, 255, 255, 0.08); }
  .ne-shop-chip { background: #3c4043; border-color: #5f6368; color: #9aa0a6; }
  .ne-shop-chip.active { background: #e8eaed; color: #1b1b1f; border-color: #e8eaed; }

  .ne-shop-card { background: #292a2d; border-color: rgba(255, 255, 255, 0.08); }
  .ne-shop-card__brand { background: rgba(60, 64, 67, 0.92); color: #e8eaed; }
  .ne-shop-card__tag { background: #3c4043; color: #9aa0a6; }

  .ne-modal-sheet,
  .zoir-modal-sheet { background: #292a2d; }
  .ne-shop-spec { background: #3c4043; border-color: rgba(255, 255, 255, 0.06); }
  .ne-shop-gallery-btn { background: rgba(60, 64, 67, 0.9); color: #e8eaed; }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 5 — Wiki (jobs) & Finance
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* Wiki shell + seg bridge */
.ne-wiki.wiki-root {
  background: #F2F2F7;
  min-height: 100%;
}

.ne-wiki .wiki-header {
  background: var(--ne-bg-app);
  border-bottom-color: var(--ne-border);
}

.ne-wiki .ne-seg-control.wiki-tabs {
  margin: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 6px 8px;
  border-radius: 0;
  gap: 2px;
  /* 5 chips (incl. Map): fill width when they fit, scroll horizontally on 360px */
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ne-wiki .ne-seg-control.wiki-tabs::-webkit-scrollbar { display: none; }

.ne-wiki .ne-seg-item.wiki-tab {
  position: relative;
  flex: 1 0 auto;
  font-size: 14px;
  font-weight: 500;
  gap: 5px;
  padding: 6px 12px;
  min-height: unset;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  line-height: 1.2;
  white-space: nowrap;
  color: #6B7280;
  border-radius: 100px;
  background: none;
  border: none;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  opacity: 1;
}
.ne-wiki .ne-seg-item.wiki-tab:not(.active):hover {
  background: rgba(0,0,0,0.04);
}

.ne-wiki .ne-seg-item.wiki-tab.active {
  background: #EBF3FF;
  color: #2563EB;
  font-weight: 600;
  box-shadow: none;
}

.ne-wiki .ne-seg-item.wiki-tab:active {
  transform: scale(0.97);
}

.ne-wiki .wiki-tab-badge {
  position: static;
  background: #E5E7EB;
  color: #6B7280;
  font-size: 11px;
  font-weight: 600;
  min-width: 20px;
  height: 20px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  line-height: 1;
  margin-left: 1px;
  box-shadow: none;
  pointer-events: none;
}

.ne-wiki .ne-seg-item.wiki-tab.active .wiki-tab-badge {
  background: #2563EB;
  color: #fff;
  box-shadow: none;
}

.ne-wiki .fab-add {
  background: var(--ne-primary);
  box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.28);
}

.ne-wiki .farm-btn-prim,
.ne-wiki .farm-btn-filled {
  background: var(--ne-primary) !important;
  box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.22);
}

.ne-wiki .meta-tag.crop { color: var(--ne-primary); }

/* Finance shell */
.ne-finance.finance-root {
  animation: ne-fade-in 0.45s var(--ne-ease-out) both;
  /* Soft green-tinted wash so the frosted-glass cards have something to blur
     (glass over flat gray is invisible). Fades to the neutral app gray. */
  background: linear-gradient(180deg, #e7f4ec 0%, #eef0f4 240px) fixed;
}

/* Frosted-glass cards (same effect as the floating tabs) — translucent white +
   backdrop blur. Excludes the green agent promo card, which keeps its identity.
   NOTE: backdrop-filter blur is GPU-heavy; kept moderate for cheap Androids. */
.ne-finance .finance-card:not(.ne-finance-agent-card) {
  background: rgba(255, 255, 255, 0.66) !important;
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.06) !important;
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  backdrop-filter: blur(18px) saturate(180%);
}
.ne-finance .finance-card.ne-finance-workplace {
  border-left: none !important;
}

/* Finance tabs — same floating capsule as the wiki tabs (white frosted pill,
   equal segments, active = light-blue pill + blue text). */
.ne-finance .ne-seg-control.finance-tabs {
  display: flex;
  gap: 2px;
  width: auto;
  box-sizing: border-box;
  align-self: stretch;
  margin: 4px 12px 12px;
  padding: 4px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.ne-finance .ne-seg-item.finance-tab {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 7px 6px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: #8e8e93;
  background: transparent;
  border: none;
  box-shadow: none;
  line-height: 1.1;
  text-align: center;
  transition: background 0.18s ease, color 0.15s;
}

/* Icons hidden — clean text-only tabs like the wiki module. */
.ne-finance .ne-seg-item.finance-tab .material-symbols-outlined {
  display: none;
}

.ne-finance .ne-seg-item.finance-tab.active {
  color: #3390ec;
  background: #eaf2fb;
  font-weight: 600;
  box-shadow: none;
}

.ne-finance .finance-card {
  border-radius: var(--ne-radius-md);
  border-color: var(--ne-border);
  box-shadow: var(--ne-shadow-card);
}

.ne-finance .md3-button {
  background: var(--ne-primary);
  box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.22);
}

.ne-finance .settings-item-right-small {
  color: var(--ne-primary) !important;
  border-color: var(--ne-border) !important;
}

.ne-finance .tg-btn-calc,
.ne-finance .premium-tg-btn {
  border-radius: var(--ne-radius-sm);
}

.ne-finance .tg-btn-calc {
  background: var(--ne-primary);
}

/* в”Ђв”Ђ Wiki module (extracted) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.wiki-root { display: flex; flex-direction: column; gap: 0; min-height: 100%; position: relative; background: var(--ne-bg-app); }

      .wiki-header {
        position: sticky;
        top: 0;
        z-index: 100;
        background: var(--ne-bg-app);
        margin: 0 -16px 0;
        padding: 4px 16px 8px;
        border-bottom: 1px solid var(--ne-border);
      }

      .wiki-search-container {
        display: flex;
        align-items: center;
        gap: 6px;
        margin: 8px auto 12px;
        width: 100%;
        max-width: 600px;
        box-sizing: border-box;
        padding: 0 8px;
        animation: wikiCardIn 0.4s ease;
      }
      .wiki-search-bar {
        flex: 1;
        flex-shrink: 1;
        min-width: 0;
        height: 44px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        gap: 8px;
        background: var(--ne-surface-solid);
        border-radius: 12px; 
        padding: 0 12px;
        border: 1px solid var(--ne-border);
        box-shadow: 0 1px 4px rgba(0,0,0,0.03);
        transition: all 0.2s;
        position: relative;
      }
      .wiki-search-bar:focus-within {
        border-color: var(--primary);
        box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.1);
      }
      .wiki-search-bar .material-symbols-outlined.search-icon { 
        color: var(--primary); 
        font-size: 20px; 
        font-weight: 600;
        flex-shrink: 0;
      }
      .wiki-search-input {
        flex: 1;
        border: none;
        outline: none;
        background: transparent;
        font-size: 14px;
        color: var(--ne-ink);
        font-family: inherit;
        padding: 0;
        height: 100%;
      }
      .wiki-search-clear {
        color: var(--ne-hint);
        cursor: pointer;
        font-size: 18px;
        padding: 4px;
        border-radius: 50%;
        transition: background 0.2s;
        flex-shrink: 0;
      }
      .wiki-search-clear:hover { background: rgba(0,0,0,0.05); }

      .wiki-filter-btn {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        box-sizing: border-box;
        flex-shrink: 0;
        background: var(--ne-surface-solid);
        border: 1px solid var(--ne-border);
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--ne-ink);
        cursor: pointer;
        transition: all 0.2s;
        position: relative;
        box-shadow: 0 1px 4px rgba(0,0,0,0.03);
      }
      .wiki-filter-btn.active {
        background: var(--primary);
        color: #fff;
        border-color: var(--primary);
      }
      .wiki-filter-btn .filter-dot {
        position: absolute;
        top: 8px;
        right: 8px;
        width: 8px;
        height: 8px;
        background: var(--accent-orange);
        border: 2px solid var(--ne-surface-solid);
        border-radius: 50%;
      }

      /* в”Ђв”Ђ Crop Tags Enrichment в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .crop-tags-container {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-top: 8px;
        transition: all 0.3s ease;
      }
      .crop-tag {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 4px 8px;
        background: rgba(var(--ne-primary-rgb), 0.06);
        color: var(--primary);
        border-radius: 20px;
        font-size: 11px;
        font-weight: 700;
        border: 1px solid rgba(var(--ne-primary-rgb), 0.05);
        white-space: nowrap;
      }
      .crop-tag.more {
        background: var(--accent-warm);
        color: var(--accent-orange);
        cursor: pointer;
        border-color: rgba(221,91,0,0.1);
      }
      .crop-tag:active { transform: scale(0.95); }

      /* в”Ђв”Ђ Tabs (Segmented Control) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .wiki-tab-badge {
        background: var(--accent-orange);
        color: #fff;
        font-size: 9px;
        font-weight: 800;
        min-width: 16px;
        height: 16px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
      }

      /* в”Ђв”Ђ List Layout в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .wiki-list { padding: 4px 0 120px; display: flex; flex-direction: column; gap: 16px; }

      /* в”Ђв”Ђ Compact & Premium Farm Card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .farm-card {
        background: var(--ne-surface-solid);
        border: 1px solid var(--ne-border);
        border-radius: 20px; 
        box-shadow: var(--ne-shadow-card);
        padding: 14px;
        transition: transform 0.1s ease, box-shadow 0.1s ease;
        animation: wikiCardIn 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;
      }
      .farm-card:active { transform: scale(0.985); }
      @keyframes wikiCardIn {
        from { opacity: 0; transform: translateY(16px) scale(0.97); }
        to   { opacity: 1; transform: translateY(0) scale(1);    }
      }

      .farm-card-main { cursor: pointer; }
      .farm-card-name { font-family: 'Lora', serif; font-size: 16px; font-weight: 800; color: var(--ne-ink); margin: 0; line-height: 1.25; letter-spacing: -0.2px; }
      
      .meta-tag { font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 6px; background: rgba(0,0,0,0.04); color: var(--ne-hint); display: inline-flex; align-items: center; gap: 3px; }
      .meta-tag.crop { background: rgba(9,127,232,0.06); color: #097fe8; }
      
      .farm-rating-pill { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 1px; min-width: 42px; padding: 4px 8px; border-radius: 10px; font-weight: 800; font-size: 14px; border-width: 1px; border-style: solid; text-align: center; }
      .farm-rating-pill.green  { background: #f2f9f5; color: var(--accent-green); border-color: rgba(26,174,57,0.15); }
      .farm-rating-pill.orange { background: #fff8f2; color: var(--accent-orange); border-color: rgba(221,91,0,0.15); }
      .farm-rating-pill.red    { background: #fff5f5; color: #d32f2f; border-color: rgba(211,47,47,0.15); }
      .farm-rating-pill.grey   { background: #f8f8f8; color: var(--ne-hint); border-color: rgba(0,0,0,0.05); }

      .farm-bottom-row { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; padding-top: 12px; border-top: 1px dashed rgba(0,0,0,0.08); }
      .farm-mini-stats { display: flex; gap: 12px; font-size: 12px; font-weight: 700; color: var(--ne-muted); }
      .mini-stat { display: flex; align-items: center; gap: 4px; }
      
      .farm-btn {
        display: flex; align-items: center; justify-content: center; gap: 6px;
        padding: 8px 16px; border-radius: 10px; border: none; font-family: inherit;
        font-size: 13px; font-weight: 700; cursor: pointer; transition: all 0.2s;
      }
      .farm-btn:active { transform: scale(0.97); opacity: 0.9; }
      .farm-btn:disabled { opacity: 0.5; cursor: not-allowed; filter: grayscale(0.5); }
      
      .farm-btn-filled { background: var(--primary) !important; color: #fff !important; box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.2); }
      .farm-btn-sec { background: rgba(0,0,0,0.05) !important; color: var(--ne-muted) !important; }
      .farm-btn-sec:hover { background: rgba(0,0,0,0.08) !important; }
      /* в”Ђв”Ђ Vacancies (Jobs) Redesign в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .job-item {
        background: var(--ne-surface-solid);
        border-radius: 20px;
        padding: 20px;
        margin-bottom: 16px;
        border: 1px solid rgba(0,0,0,0.04);
        box-shadow: 0 8px 24px rgba(0,0,0,0.04);
        position: relative;
        overflow: hidden;
        transition: all 0.3s ease;
      }
      .job-item:active { transform: scale(0.98); }
      .job-hiring-badge {
         font-size: 10px; font-weight: 850; text-transform: uppercase;
         letter-spacing: 0.1em; padding: 4px 10px; border-radius: 50px;
         background: #fff4f2; color: #ff5722; border: 1px solid rgba(255,87,34,0.1);
         display: inline-flex; align-items: center; gap: 5px;
      }
      .job-hiring-badge::before {
        content: ""; width: 6px; height: 6px; background: #ff5722; border-radius: 50%;
        animation: wikiSpin 1.5s infinite ease-in-out;
      }
      .jobs-hero-container {
        position: relative;
        padding: 24px 20px 30px;
        margin: -16px -16px 20px;
        background: linear-gradient(135deg, rgba(var(--ne-primary-rgb), 0.03) 0%, rgba(var(--ne-primary-rgb), 0.08) 100%);
        border-bottom: 1px solid rgba(var(--ne-primary-rgb), 0.05);
        overflow: hidden;
      }
      .jobs-hero-container::before {
        content: "";
        position: absolute;
        top: -100px; right: -50px;
        width: 250px; height: 250px;
        background: radial-gradient(circle, rgba(var(--ne-primary-rgb), 0.1) 0%, transparent 70%);
        filter: blur(40px);
        animation: wikiPulse 8s infinite ease-in-out;
      }
      @keyframes wikiPulse {
        0%, 100% { transform: scale(1) translate(0, 0); opacity: 0.5; }
        50% { transform: scale(1.2) translate(-20px, 20px); opacity: 0.8; }
      }
      .jobs-hero-h1 {
        font-family: 'Lora', serif;
        font-size: 28px;
        font-weight: 900;
        color: var(--ne-ink);
        margin: 0 0 8px;
        padding: 0;
        letter-spacing: -1px;
        animation: wikiCardIn 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) both;
      }
      .jobs-live-label {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 10px;
        font-weight: 850;
        color: #ff5722;
        background: rgba(255,87,34,0.1);
        padding: 3px 8px;
        border-radius: 6px;
        margin-bottom: 12px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }
      .jobs-live-dot {
        width: 6px; height: 6px;
        background: #ff5722;
        border-radius: 50%;
        box-shadow: 0 0 8px #ff5722;
        animation: wikiSpin 1.5s infinite ease-in-out;
      }
      .jobs-hero-desc {
        font-size: 13px;
        line-height: 1.6;
        color: var(--ne-muted);
        margin: 0;
        font-weight: 500;
        opacity: 0.9;
      }
      .jobs-disclaimer-box {
        margin-top: 16px;
        background: rgba(255, 255, 255, 0.8);
        border: 1px solid rgba(var(--ne-primary-rgb), 0.15);
        border-radius: 16px;
        padding: 16px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.02);
        animation: wikiCardIn 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) both;
      }
      .jobs-disclaimer-tag {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: 10px;
        font-weight: 850;
        color: var(--primary);
        text-transform: uppercase;
        letter-spacing: 0.8px;
        margin-bottom: 10px;
      }
      .job-item {
        background: var(--ne-surface-solid);
        border-radius: 20px;
        padding: 16px;
        margin-bottom: 14px;
        border: 1px solid rgba(0,0,0,0.03);
        box-shadow: 0 12px 30px rgba(0,0,0,0.04);
        position: relative;
        overflow: hidden;
        transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
        animation: wikiCardIn 0.5s ease both;
      }
      .job-item::after {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at top right, rgba(var(--ne-primary-rgb), 0.03), transparent 70%);
        pointer-events: none;
      }
      .job-item:active { transform: scale(0.975) translateY(2px); box-shadow: 0 4px 10px rgba(0,0,0,0.02); }
      .job-farm-title { font-size: 20px; font-weight: 900; color: var(--ne-ink); margin: 12px 0 6px; letter-spacing: -0.6px; }
      .job-sub-title { font-size: 13px; color: var(--ne-hint); font-weight: 600; margin-bottom: 16px; }
      .job-perks-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
      .job-perk-chip {
        font-size: 11px; font-weight: 700; color: var(--primary);
        background: rgba(var(--ne-primary-rgb), 0.05);
        padding: 5px 12px; border-radius: 10px; display: flex; align-items: center; gap: 4px;
      }
      .job-action-bar { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgba(0,0,0,0.04); padding-top: 12px; }
      
      .feed-card {
        background: var(--ne-surface-solid);
        border: 1px solid var(--ne-border);
        border-radius: 20px;
        padding: 18px;
        margin-bottom: 20px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.03);
        transition: transform 0.2s, box-shadow 0.2s;
        position: relative;
        overflow: hidden;
      }
      .feed-card:active { transform: scale(0.98); }
      .feed-farm-name { font-size: 16px; font-weight: 800; color: var(--ne-ink); letter-spacing: -0.3px; }
      .feed-review-text { 
        font-family: 'Lora', serif; 
        font-size: 15px; 
        line-height: 1.5; 
        color: var(--ne-ink); 
        margin: 12px 0; 
        font-style: italic;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        line-clamp: 4; /* Standard property for future compatibility */
        -webkit-box-orient: vertical;
        overflow: hidden;
      }
      .feed-stat-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; padding-top: 12px; border-top: 1px dashed rgba(0,0,0,0.06); }
      .feed-mini-chip { 
        font-size: 11px; font-weight: 700; color: var(--ne-muted); 
        background: #f8f8f7; padding: 4px 10px; border-radius: 8px;
        display: flex; align-items: center; gap: 4px;
      }
      .feed-author-meta { font-size: 11px; color: var(--ne-hint); font-weight: 600; display: flex; align-items: center; gap: 6px; }
      
      .fab-top {
        position: fixed;
        bottom: 90px;
        right: 20px;
        width: 46px;
        height: 46px;
        background: var(--ne-surface-solid);
        color: var(--primary);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 6px 16px rgba(0,0,0,0.12);
        z-index: 1000;
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
        border: 1px solid rgba(0,0,0,0.05);
        animation: wikiFadeIn 0.3s ease;
      }
      .fab-top:active { transform: scale(0.9); }

      /* в”Ђв”Ђ Jobs UI в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .job-card {
        background: var(--ne-surface-solid);
        border: 1px solid var(--ne-border);
        border-radius: 20px; 
        padding: 16px;
        margin-bottom: 14px;
        box-shadow: var(--ne-shadow-card);
        transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
        animation: wikiCardIn 0.35s both;
      }
      .job-card:active { transform: scale(0.985); }
      .job-card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; gap: 12px; }
      .job-card-title { font-family: 'Lora', serif; font-size: 17px; font-weight: 700; color: var(--ne-ink); line-height: 1.25; }

      /* ── Skeleton Loaders — Instagram-style shimmer ─────────────── */
      @keyframes sk-shimmer {
        0%   { background-position: -400px 0; }
        100% { background-position:  400px 0; }
      }
      .sk {
        border-radius: 8px;
        background: linear-gradient(90deg, #ede9e4 25%, #f5f2ef 50%, #ede9e4 75%);
        background-size: 800px 100%;
        animation: sk-shimmer 1.4s ease-in-out infinite;
        display: block;
      }
      /* Skeleton elements */
      .sk-h   { height: 20px; margin-bottom: 10px; }
      .sk-sm  { height: 13px; width: 55%; margin-bottom: 16px; }
      .sk-row { display: flex; gap: 8px; margin-bottom: 8px; }
      .sk-box { height: 40px; flex: 1; border-radius: 10px; }
      .sk-pill { height: 28px; width: 52px; border-radius: 8px; }
      .sk-tag  { height: 22px; width: 64px; border-radius: 20px; display: inline-block; }
      .sk-badge { height: 18px; width: 18px; border-radius: 9px; display: inline-block; }
      /* Full card skeleton wrapper */
      .wiki-skeleton-card {
        background: var(--ne-surface-solid);
        border-radius: 16px;
        padding: 16px;
        border: 1px solid var(--ne-border);
        margin-bottom: 16px;
        overflow: hidden;
      }

      /* в”Ђв”Ђ Modals / Sheets в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .wiki-modal-overlay {
        position: fixed; inset: 0; z-index: 2000;
        background: rgba(0,0,0,0.4);
        display: flex; align-items: flex-end; justify-content: center;
        padding: 12px;
        animation: overlayIn 0.25s ease;
        backdrop-filter: blur(2px);
      }
      @keyframes overlayIn { from { opacity: 0; } to { opacity: 1; } }

      .wiki-modal-sheet {
        width: 100%;
        max-width: 500px;
        max-height: 88vh;
        background: var(--ne-surface-solid);
        border-radius: 24px;
        margin-bottom: 24px;
        overflow: visible;
        display: flex;
        flex-direction: column;
        animation: sheetUp 0.35s cubic-bezier(0.32, 0.72, 0, 1);
        box-shadow: 0 10px 40px rgba(0,0,0,0.2);
        transition: transform 0.25s cubic-bezier(0.32, 0.72, 0, 1);
      }
      .wiki-modal-root.closing .wiki-modal-sheet { transform: translateY(100%); }
      .wiki-modal-root.closing .wiki-modal-overlay { opacity: 0; }
      @keyframes sheetUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

      .modal-handle {
        width: 38px; height: 5px; background: rgba(0,0,0,0.1);
        border-radius: 10px; margin: 10px auto 4px;
        flex-shrink: 0;
      }
      .modal-header {
        display: flex; align-items: center; justify-content: space-between;
        padding: 12px 16px 12px;
        border-bottom: 1px solid var(--ne-border);
        background: var(--ne-surface-solid);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        z-index: 10;
        flex-shrink: 0;
      }
      .modal-title { font-family: 'Lora', serif; font-size: 18px; font-weight: 700; margin: 0; color: var(--ne-ink); letter-spacing: -0.3px; }
      .modal-close {
        background: rgba(0,0,0,0.05); border: none; border-radius: 50%;
        width: 44px; height: 44px; min-width: 44px; min-height: 44px; cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        color: var(--text-color); transition: all 0.2s;
      }
      .modal-close:active { background: rgba(0,0,0,0.1); transform: scale(0.9); }
      .modal-body { overflow-y: auto; overflow-x: visible; padding: 16px 16px 120px; flex: 1; scroll-behavior: smooth; }

      .rating-badge { min-width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px; border-width: 1px; border-style: solid; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
      .rating-badge.green  { background: #f2f9f5; color: var(--accent-green); border-color: rgba(26,174,57,0.15); }
      .rating-badge.orange { background: #fff8f2; color: var(--accent-orange); border-color: rgba(221,91,0,0.15); }
      .rating-badge.red    { background: #fff5f5; color: #d32f2f; border-color: rgba(211,47,47,0.15); }
      .rating-badge.grey   { background: #f5f5f5; color: #888; border-color: rgba(0,0,0,0.05); }

      /* в”Ђв”Ђ Dropdowns / Selects (Premium Multi-select Vibe) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .zoir-dropdown { position: relative; width: 100%; user-select: none; }
      .zoir-dropdown-trigger {
        background: #fdfdfd; border: 1px solid #e2e8f0; border-radius: 14px; padding: 12px 14px; 
        font-size: 14px; font-weight: 600; color: var(--primary);
        cursor: pointer; display: flex; align-items: center; justify-content: space-between;
        transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: 0 1px 2px rgba(0,0,0,0.02);
      }
      .zoir-dropdown-trigger::after {
        content: "\e5cf"; font-family: "Material Symbols Outlined"; font-size: 20px; 
        color: var(--ne-hint); transition: transform 0.3s;
        font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        font-style: normal; font-weight: normal; line-height: 1;
        display: inline-block; vertical-align: middle;
      }
      .zoir-dropdown.open .zoir-dropdown-trigger { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.1); }
      .zoir-dropdown.open .zoir-dropdown-trigger::after { transform: rotate(180deg); }
      
      .zoir-dropdown-list {
        position: absolute; top: calc(100% + 6px); left: 0; right: 0;
        background: var(--ne-surface-solid); border: 1px solid #e2e8f0; border-radius: 16px;
        box-shadow: 0 12px 28px rgba(0,0,0,0.12); z-index: 3000;
        max-height: 280px; overflow-y: auto; display: none;
        animation: wikiSlideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        padding: 6px;
      }
      .zoir-dropdown.open .zoir-dropdown-list { display: block; }
      
      .zoir-dropdown-item {
        padding: 10px 14px; font-size: 14px; color: var(--ne-ink); border-radius: 10px;
        cursor: pointer; transition: all 0.2s; display: flex; align-items: center; gap: 8px;
        font-weight: 500; white-space: nowrap; flex-wrap: nowrap; overflow: hidden; text-overflow: ellipsis;
      }
      .zoir-dropdown-item:hover { background: rgba(var(--ne-primary-rgb), 0.05); color: var(--primary); }
      .zoir-dropdown-item.selected { background: rgba(var(--ne-primary-rgb), 0.08); color: var(--primary); font-weight: 700; }
      
      .zoir-dropdown.multi .zoir-dropdown-item .material-symbols-outlined { font-size: 18px; color: var(--ne-hint); }
      .zoir-dropdown.multi .zoir-dropdown-item.selected .material-symbols-outlined { color: var(--primary); }
      
      .zoir-dropdown-done-wrap {
        padding: 8px; border-top: 1px solid #f1f5f9; background: #fff;
        position: sticky; bottom: -6px; margin: 0 -6px -6px;
      }
      .zoir-dropdown-done {
        width: 100%; padding: 8px; border: none; border-radius: 10px;
        background: var(--primary); color: #fff; font-weight: 700; font-size: 13px;
        cursor: pointer; transition: opacity 0.2s;
      }
      .zoir-dropdown-done:active { opacity: 0.8; }

      @keyframes wikiSlideUp {
        from { opacity: 0; transform: translateY(12px) scale(0.98); }
        to   { opacity: 1; transform: translateY(0) scale(1); }
      }

      /* в”Ђв”Ђ Reviews UI в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .review-item { padding: 12px 0; border-bottom: 1px solid var(--ne-border); animation: wikiCardIn 0.4s ease both; }
      .review-item:last-child { border-bottom: none; }
      .review-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
      .review-author { font-size: 13px; color: var(--ne-muted); font-weight: 700; display: flex; align-items: center; gap: 6px; }
      .review-date   { font-size: 11px; color: var(--ne-hint); font-weight: 600; }
      .review-text { font-size: 14px; color: var(--ne-ink); line-height: 1.5; margin: 8px 0; white-space: pre-wrap; }
      
      .rmr-chip {
        display: inline-flex; align-items: center; gap: 3px;
        background: var(--ne-surface-2); border-radius: 8px; border: 1px solid var(--ne-border);
        padding: 4px 6px; font-size: 12px; color: var(--ne-muted); font-weight: 700;
        margin: 0; transition: transform 0.2s;
        white-space: nowrap; flex-shrink: 1; min-width: 0;
      }
      .rmr-chip .rmr-label { font-size: 10px; opacity: 0.6; font-weight: 500; margin-left: 1px; }
      .rmr-chip:active { transform: scale(0.95); }

      /* в”Ђв”Ђ Forms (Compact Settings Style) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .form-group-card {
        background: #fff; border-radius: 16px; margin-bottom: 12px;
        border: 1px solid rgba(0,0,0,0.04); box-shadow: 0 2px 8px rgba(0,0,0,0.02);
      }
      .form-group-header {
        padding: 8px 14px; font-size: 10px; font-weight: 800;
        text-transform: uppercase; color: #94a3b8; background: #fafafa;
        border-bottom: 1px solid #f1f5f9; letter-spacing: 0.5px;
        border-top-left-radius: 16px; border-top-right-radius: 16px;
      }
      .review-form-row { 
        display: flex; justify-content: space-between; align-items: center; 
        padding: 10px 14px; border-bottom: 1px solid #f1f5f9; 
        gap: 8px; flex-wrap: nowrap;
      }
      .review-form-row:last-child { border-bottom: none; }
      .review-form-label { font-size: 12px; font-weight: 600; color: var(--ne-ink); flex: 1; min-width: 0; line-height: 1.2; }
      .review-input-wrap { display: flex; justify-content: flex-end; flex-shrink: 0; min-width: 195px; }
      
      .star-btn { font-size: 21px; background: none; border: none; color: #e0e0de; cursor: pointer; transition: all 0.15s; padding: 1px; }
      .star-btn.lit { color: #fbbc05; text-shadow: 0 0 8px rgba(251,188,5,0.3); }
      
      .review-textarea {
        width: 100%; border-radius: 10px; border: 1px solid #e2e8f0;
        background: #fff; padding: 12px; font-size: 14px; font-family: inherit;
        outline: none; box-sizing: border-box; line-height: 1.5; resize: none;
      }

      .crop-chip {
        padding: 8px 16px; border-radius: 50px; font-size: 13px; font-weight: 600;
        cursor: pointer; transition: all 0.2s; background: var(--ne-surface-2); color: var(--ne-muted);
        border: 1px solid var(--ne-border); margin: 0 8px 10px 0;
      }
      .crop-chip.selected { background: rgba(var(--ne-primary-rgb), 0.1); color: var(--ne-primary); border-color: var(--ne-primary); font-weight: 800; box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.15); }

      .fab-add {
        width: 44px; height: 44px; border-radius: 12px;
        background: var(--primary); color: #fff;
        display: flex; align-items: center; justify-content: center;
        box-shadow: 0 4px 12px rgba(0, 117, 222, 0.3); 
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
      }
      .fab-add span { font-size: 24px !important; }
      .fab-add:active { transform: scale(0.9) rotate(90deg); }

      /* в”Ђв”Ђ Hiring Marker Pulse в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .hiring-pulse-ring {
        position: absolute; top: 0; left: 0; width: 32px; height: 32px;
        background: rgba(255, 87, 34, 0.3); border-radius: 50%;
        z-index: -1; animation: pinPulse 2s infinite ease-out;
      }
      @keyframes pinPulse { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(2.8); opacity: 0; } }

      /* в”Ђв”Ђ Vacancy Details specific в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .vacancy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0; }
      .vacancy-stat { background: #f9f9f8; padding: 12px; border-radius: 12px; border: 1px solid var(--ne-border); }
      .v-label { font-size: 10px; font-weight: 700; color: var(--ne-hint); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 4px; }
      .v-value { font-size: 14px; font-weight: 700; color: var(--ne-ink); }

      /* в”Ђв”Ђ AI Insight (Memoriki Style) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .ai-insight-card {
        background: linear-gradient(135deg, #fff 0%, #f9faff 100%);
        border: 1px solid rgba(0, 117, 222, 0.1);
        border-radius: 18px;
        padding: 18px;
        margin: 12px 0 24px;
        position: relative;
        overflow: hidden;
        box-shadow: 0 4px 16px rgba(0, 117, 222, 0.06);
        animation: wikiCardIn 0.5s ease both;
      }
      .ai-insight-card::before {
        content: "";
        position: absolute;
        top: 0; left: 0; right: 0; height: 4px;
        background: linear-gradient(90deg, var(--ne-primary), #8ab4f8, var(--ne-primary));
        background-size: 200% 100%;
        animation: ai-shimmer 3.5s linear infinite;
      }
      @keyframes ai-shimmer {
        0% { background-position: 100% 0; }
        100% { background-position: -100% 0; }
      }
      .ai-header { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
      .ai-title { font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: 0.12em; color: var(--primary); display: flex; align-items: center; gap: 6px; }
      .ai-sparkle { font-size: 18px; animation: ai-float 2s ease-in-out infinite; }
      @keyframes ai-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
      .ai-content { font-family: 'Lora', serif; font-size: 16px; line-height: 1.6; color: var(--ne-ink); font-style: italic; }
      .ai-disclaimer { font-size: 10px; color: var(--ne-hint); margin-top: 10px; font-weight: 600; }

      /* в”Ђв”Ђ Sponsored Ads в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .wiki-ad-item {
        background: linear-gradient(135deg, #f9faff 0%, #ffffff 100%);
        border: 1px solid rgba(0, 117, 222, 0.08);
        border-radius: 20px;
        padding: 16px;
        margin: 0 0 20px 0;
        position: relative;
        box-shadow: 0 4px 15px rgba(0, 117, 222, 0.03);
      }
      .wiki-ad-header { margin-bottom: 12px; }
      .wiki-ad-badge { font-size: 10px; font-weight: 800; color: var(--ne-hint); text-transform: uppercase; letter-spacing: 0.1em; background: rgba(0,0,0,0.05); padding: 2px 8px; border-radius: 4px; }
      .wiki-ad-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
      .wiki-ad-logo { width: 44px; height: 44px; background: var(--primary); color: #fff; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: 18px; box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.2); }
      .wiki-ad-brand-name { font-size: 17px; font-weight: 800; color: var(--ne-ink); margin: 0; }
      .wiki-ad-brand-sub { font-size: 11px; color: var(--ne-hint); margin: 0; font-weight: 600; }
      .wiki-ad-desc { font-size: 14px; color: var(--ne-muted); line-height: 1.5; margin: 10px 0; }
      .review-mini-ratings { display: flex; flex-wrap: nowrap; gap: 4px; overflow-x: visible; padding-bottom: 4px; justify-content: space-between; }
      .review-mini-ratings::-webkit-scrollbar { display: none; }
      .wiki-ad-perks { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
      .wiki-ad-perk { font-size: 11px; font-weight: 700; color: var(--primary); background: rgba(var(--ne-primary-rgb), 0.08); padding: 4px 10px; border-radius: 8px; }
      .wiki-ad-cta { width: 100%; padding: 12px; background: #fff; border: 1px solid var(--primary); color: var(--primary); border-radius: 12px; font-weight: 700; font-size: 14px; cursor: pointer; transition: all 0.2s; display: flex; align-items: center; justify-content: center; gap: 8px; }
      .wiki-ad-cta:active { background: rgba(var(--ne-primary-rgb), 0.1); transform: scale(0.98); }
      .wiki-ad-footer { font-size: 10px; color: var(--ne-hint); text-align: center; margin-top: 10px; opacity: 0.8; }

      /* в”Ђв”Ђ New Premium Additions в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      .farm-btn-prim {
        background: var(--primary); color: white; border: none;
        box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.2);
      }
      .farm-btn-prim:active { background: var(--ne-primary-active); transform: scale(0.96); }

      .wiki-toast {
        position: fixed; bottom: 100px; left: 50%; transform: translateX(-50%) translateY(20px);
        background: rgba(30, 41, 59, 0.95); color: white; padding: 12px 24px;
        border-radius: 50px; font-size: 14px; font-weight: 700; z-index: 9999;
        opacity: 0; pointer-events: none; transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
        backdrop-filter: blur(10px); box-shadow: 0 8px 24px rgba(0,0,0,0.2);
        white-space: nowrap; border: 1px solid rgba(255,255,255,0.1);
      }
      .wiki-toast.visible { opacity: 1; transform: translateX(-50%) translateY(0); }

      @keyframes wikiSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
      @keyframes wikiFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
      
      .sync-spinner { display: flex; align-items: center; justify-content: center; animation: wikiSpin 1.2s linear infinite; }

      /* в”Ђв”Ђ Desktop Grid Layout в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
      @media (min-width: 768px) {
        .wiki-root {
          max-width: 1400px;
          margin: 0 auto;
          width: 100%;
          box-sizing: border-box;
          padding: 0 24px;
        }
        .wiki-list {
          display: grid;
          grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
          row-gap: 32px;
          column-gap: 24px;
          padding-top: 24px;
          padding-bottom: 120px;
        }
        .farm-card, .job-item, .feed-card, .wiki-skeleton-card, .promo-item, .wiki-ad-item {
          margin-bottom: 0 !important;
          display: flex;
          flex-direction: column;
        }
        .farm-bottom-row, .job-action-bar, .feed-bottom-row {
          margin-top: auto !important;
        }
      }
    

/* в”Ђв”Ђ Finance module (extracted) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */

        .finance-root { display: flex; flex-direction: column; gap: 20px; animation: fadeIn 0.3s ease; }
        @media (min-width: 1024px) {
          .finance-root { max-width: 1200px; margin: 0 auto; padding-left: 24px !important; padding-right: 24px !important; }
        }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
        
        .finance-card { 
          background: white; 
          border: 1px solid var(--ne-border); 
          border-radius: 20px; 
          padding: 24px; 
          margin-bottom: 0; 
          box-shadow: var(--ne-shadow-card); 
          transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
        }
        .animate-fade-in {
          animation: financeFadeIn 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) both;
        }
        @keyframes financeFadeIn {
          from { opacity: 0; transform: translateY(16px) scale(0.97); }
          to { opacity: 1; transform: translateY(0) scale(1); }
        }
        
        .finance-section-title { font-family: 'Lora', serif; font-size: 16px; font-weight: 700; margin: 0 0 12px 0; color: var(--ne-ink); }
        
        .farm-record-card { border-radius: 12px; border: 1px solid rgba(0,0,0,0.03); padding: 16px; margin-bottom: 0px; position: relative; background: #f8f9fa; }
        .remove-record { position: absolute; top: 10px; right: 10px; color: var(--ne-hint); cursor: pointer; font-size: 20px; }
        .remove-record:hover { color: #ff3b30; }
        
        .input-label { display: block; font-size: 10px; font-weight: 700; color: var(--ne-muted); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.05em; }
        .finance-input, .finance-select { width: 100%; border-radius: 8px; border: 1px solid var(--ne-border); padding: 12px; font-size: 14px; background: #fff; outline: none; transition: 0.2s; box-sizing: border-box; font-family: inherit; }
        .finance-input:focus, .finance-select:focus { border-color: var(--ne-ink); }
        .finance-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; }
        
        .live-summary { background: rgba(var(--ne-primary-rgb), 0.04); border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; display: flex; justify-content: space-around; border: 1px solid var(--ne-border); }
        .live-summary-item { text-align: center; }
        .live-summary-label { font-size: 10px; color: var(--ne-muted); font-weight: 700; text-transform: uppercase; }
        .live-summary-value { font-size: 18px; font-weight: 700; color: var(--ne-ink); margin-top: 4px; }

        .md3-button { background: var(--primary); color: white; border: none; border-radius: 12px; padding: 12px 24px; font-weight: 600; font-size: 15px; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb),0.2); transition: 0.2s; }
        .md3-button:active { transform: scale(0.97); }
        .md3-button.secondary { background: rgba(0,0,0,0.03); color: var(--ne-ink); box-shadow: none; }
        .md3-button.danger { background: rgba(255, 77, 79, 0.08); color: #ff4d4f; }

        /* Infinite green box-shadow halo on the calc CTA removed (P1): repaint-heavy on
           cheap Android + a loud always-on attention pulse. The button reads fine static. */
        .pulse-btn { animation: none; }

        /* TransferGo Integrated Styles */
        .tg-form-group {
          background: #f8fafc; border-radius: 12px; padding: 16px; margin-bottom: 16px; border: 1px solid #f1f5f9;
        }
        .tg-label {
          font-size: 11px; color: #64748b; font-weight: 800; margin-bottom: 8px; display: block; text-transform: uppercase; letter-spacing: 0.05em;
        }
        .tg-input-box {
          background: white; border: 1px solid #e2e8f0; border-radius: 12px; padding: 12px 16px; display: flex; align-items: center; gap: 12px;
        }
        .tg-input-box input {
          background: transparent; border: none; outline: none; color: #1e293b; font-size: 20px; font-weight: 800; width: 100%; text-align: left;
        }
        .tg-currency { font-weight: 800; font-size: 14px; color: #0052ff; }
        .tg-currency-select {
          font-weight: 800; font-size: 14px; color: #0052ff;
          background: transparent; border: none; outline: none; cursor: pointer;
          font-family: inherit; appearance: none; -webkit-appearance: none;
          padding: 2px 18px 2px 4px; flex-shrink: 0;
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='%230052ff' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
          background-repeat: no-repeat; background-position: right 2px center; background-size: 14px;
        }
        .tg-currency-select:focus { outline: none; }
        .tg-rate-info { margin: 16px 0; padding: 4px; font-size: 13px; color: #64748b; text-align: center; font-weight: 600; }
        .tg-btn-calc {
          background: #0052ff; color: #fff; width: 100%; border: none; border-radius: 12px; padding: 16px;
          font-size: 15px; font-weight: 800; cursor: pointer; margin-bottom: 12px; transition: 0.2s;
        }
        .tg-btn-calc:active { transform: scale(0.98); }
        .tg-chip-container { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; padding-bottom: 4px; mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent); -webkit-mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent); }
        .tg-chip-container::-webkit-scrollbar { display: none; }
        .tg-chip {
          background: rgba(0, 82, 255, 0.05); color: #0052ff; padding: 6px 12px; border: 1px solid rgba(0, 82, 255, 0.1);
          border-radius: 10px; font-size: 12px; font-weight: 700; white-space: nowrap; cursor: pointer; transition: 0.1s;
        }
        .tg-chip:active { transform: scale(0.95); background: rgba(0, 82, 255, 0.1); }
        .shimmer-s {
          background: #e2e8f0; border-radius: 4px; width: 60px; height: 14px; display: inline-block; animation: shimmerS 1.5s linear infinite;
        }
        @keyframes shimmerS { 0% { opacity:0.5; } 50% { opacity:1; } 100% { opacity:0.5; } }

        /* Validation Styles */
        .field-error { border: 1.5px solid #ef4444 !important; background: #fef2f2 !important; }
        .error-hint { color: #ef4444; font-size: 10px; font-weight: 700; margin-top: 4px; display: none; }
        .field-error + .error-hint { display: block; }

        .premium-tg-btn {
          width: 100%;
          background: #22c55e;
          color: white;
          border: none;
          border-radius: 16px;
          padding: 14px 20px;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          gap: 2px;
          cursor: pointer;
          transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
          box-shadow: 0 8px 20px rgba(34, 197, 94, 0.25);
          border: 1px solid rgba(255,255,255,0.1);
          margin-bottom: 24px;
        }
        .premium-tg-btn:active {
          transform: scale(0.97);
          box-shadow: 0 4px 10px rgba(34, 197, 94, 0.2);
        }

        /* Premium Input Box Styles */
        .input-box {
          border: 1px solid #e2e8f0;
          background: #f8fafc;
          transition: 0.2s all;
          box-sizing: border-box;
          overflow: hidden;
        }
        .input-box:focus-within {
          border-color: #94a3b8;
          background: #ffffff;
          box-shadow: 0 2px 8px rgba(0,0,0,0.04);
        }
        .input-box .label {
          font-weight: 800;
          color: #94a3b8;
          letter-spacing: 0.05em;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }
        .input-box input, .input-box select {
          background: transparent;
          outline: none;
        }
        .input-box select {
          -webkit-appearance: none;
          appearance: none;
          background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
          background-repeat: no-repeat;
          background-position: right center;
          padding-right: 16px !important;
          cursor: pointer;
        }

        /* в•ђв•ђв•ђ Unified Settings-List Design System в•ђв•ђв•ђ */
        .settings-list { padding: 0; }
        .settings-item-small { 
          display: flex; justify-content: space-between; align-items: center; 
          padding: 12px 16px; border-bottom: 1px solid #f1f5f9; transition: background 0.15s;
        }
        .settings-item-left { display: flex; align-items: center; gap: 12px; color: #1e293b; font-size: 13px; font-weight: 600; }
        .s-icon-small { 
          font-size: 16px; padding: 6px; border-radius: 10px; width: 28px; height: 28px;
          display: flex; align-items: center; justify-content: center;
        }
        .settings-item-right-small { 
          border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px 10px;
          font-size: 13px; font-weight: 700; color: #097fe8; background: #f8fafc;
          text-align: center; font-family: inherit; outline: none; transition: 0.2s;
          box-sizing: border-box;
        }
        .settings-item-right-small:focus { border-color: #94a3b8; background: #ffffff; box-shadow: 0 0 0 3px rgba(9, 127, 232, 0.08); }
        select.settings-item-right-small { 
          -webkit-appearance: none; appearance: none; cursor: pointer; 
          text-align: center; text-align-last: center; padding-right: 22px;
          background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23097fe8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
          background-repeat: no-repeat;
          background-position: right 6px center;
          background-color: #f8fafc;
        }
        
        /* Refund Financial Highlight Rows */
        .refund-highlight-row {
          background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
          border-left: 3px solid #16a34a;
        }
        .refund-input-box {
          display: flex; align-items: center; gap: 6px;
          background: white; border: 1.5px solid #bae6fd; border-radius: 10px; padding: 6px 10px;
          transition: 0.2s;
        }
        .refund-input-box:focus-within { border-color: #0ea5e9; box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.1); }
        .refund-input-box .currency-sign { font-size: 14px; font-weight: 800; color: #0369a1; flex-shrink: 0; }
        .refund-input-box input {
          border: none; background: transparent; outline: none; font-size: 14px; font-weight: 700; 
          color: #0369a1; width: 80px; text-align: center; font-family: inherit;
        }
        
        /* Add Workplace Outlined Button */
        .add-workplace-btn {
          display: flex; align-items: center; justify-content: center; gap: 8px;
          width: 100%; padding: 12px; border: 1.5px dashed #cbd5e1; border-radius: 12px;
          background: transparent; color: #64748b; font-size: 13px; font-weight: 600;
          cursor: pointer; transition: 0.2s; font-family: inherit;
        }
        .add-workplace-btn:hover { border-color: #94a3b8; color: #475569; background: #f8fafc; }
        .add-workplace-btn:active { transform: scale(0.98); }
      


        .finance-desktop-dashboard { display: block; }
        .finance-dashboard-right { margin-top: 16px; }
        
        @media (min-width: 1024px) {
          .finance-desktop-dashboard { 
            display: grid; 
            grid-template-columns: 1.5fr 1fr; 
            gap: 16px; 
            align-items: stretch; 
          }
          .finance-dashboard-left { display: flex; flex-direction: column; gap: 16px; }
          .finance-dashboard-right { margin-top: 0; display: flex; flex-direction: column; min-height: 0; }
          .finance-dashboard-right > .finance-card { 
            height: 0; flex-grow: 1; display: flex; flex-direction: column; overflow: hidden; margin-bottom: 0 !important; 
          }
          
          /* Compact Desktop Styles to prevent scrolling */
          .finance-card { padding: 16px !important; } 
          #heroNet { font-size: 32px !important; }
          .sch-cal-cell { aspect-ratio: auto !important; height: 48px; }
          .promo-button-card { margin: 8px 0 !important; padding: 8px !important; }
          .finance-tabs { margin-bottom: 8px !important; }
          .hero-v3-header { margin-top: 12px !important; }
        }

        /* Settings-list styles inherited from common <style> block */

        /* MD3 Toggle Switch */
        .md3-switch {
          width: 44px; height: 24px; background: #e2e8f0; border-radius: 12px;
          position: relative; cursor: pointer; transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .md3-switch.active { background: #3b82f6; }
        .switch-thumb {
          position: absolute; top: 2px; left: 2px; width: 20px; height: 20px;
          background: white; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,0.1);
          transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .md3-switch.active .switch-thumb { left: 22px; }
        .sch-shift-row { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,0.05); cursor: pointer; }
        .sch-row-main { font-size: 14px; font-weight: 700; }
        .sch-row-sub { font-size: 12px; color: #94a3b8; margin-top: 2px; }
        .sch-row-amount { font-size: 14px; font-weight: 800; color: #22c55e; }
        
        .weekly-summary-box { background: #f0f7ff; border: 1px dashed #bfdbfe; border-radius: 12px; padding: 16px; margin: 16px 0; }
        .ws-header { display: flex; justify-content: space-between; margin-bottom: 8px; }
        .ws-title { font-size: 10px; font-weight: 800; color: #3b82f6; }
        .ws-val { font-size: 20px; font-weight: 800; color: #22c55e; }
        .ws-details { font-size: 11px; color: #94a3b8; margin-top: 8px; border-top: 1px solid rgba(59,130,246,0.1); padding-top: 8px; }

        /* Modal specific styles for Shift Editor */
        .type-picker { display: flex; gap: 4px; background: #f1f3f5; padding: 4px; border-radius: 14px; margin-bottom: 12px; }
        .type-item { 
          flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
          padding: 8px 4px; border-radius: 11px; cursor: pointer; transition: 0.2s; border: none; background: transparent;
          color: #94a3b8;
        }
        .type-item.active.work { background: #ecfdf5; color: #10b981 !important; }
        .type-item.active.off { background: #fff1f2; color: #f43f5e !important; }
        .type-item.active.holiday { background: #eff6ff; color: #3b82f6 !important; }
        .type-item.active.sick { background: #f5f3ff; color: #8b5cf6 !important; }
        
        .type-item span { font-size: 10px; font-weight: 700; }
        .type-item .material-symbols-outlined { font-size: 18px; }
        
        .input-box { background: #f8f9fa; border-radius: 14px; padding: 10px 14px; display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
        .input-box .label { font-size: 10px; font-weight: 800; color: #adb5bd; text-transform: uppercase; margin-bottom: 1px; }
        .input-box input { border: none; background: transparent; font-size: 16px; font-weight: 700; color: #212529; width: 100%; outline: none; }

        /* Calendar Type Styles */
        .sch-cal-cell { 
          aspect-ratio: 1; border-radius: 10px; border: none; background: #f8fafc;
          display: flex; flex-direction: column; align-items: center; justify-content: center;
          cursor: pointer; position: relative; transition: 0.2s; padding: 0; font-family: inherit;
          width: 100%;
        }
        .sch-cal-cell:active { transform: scale(0.94); }
        .sch-cal-cell.today { border: 2.5px solid #097fe8 !important; }
        
        .sch-cal-cell.type-work { background-color: #ecfdf5; }
        .sch-cal-cell.type-work .sch-cal-dot { background-color: #10b981; }
        
        .sch-cal-cell.type-off { background-color: #fff1f2; }
        .sch-cal-cell.type-off .sch-cal-dot { background-color: #f43f5e; }
        
        .sch-cal-cell.type-holiday { background-color: #eff6ff; }
        .sch-cal-cell.type-holiday .sch-cal-dot { background-color: #3b82f6; }
        
        .sch-cal-cell.type-sick { background-color: #f5f3ff; }
        .sch-cal-cell.type-sick .sch-cal-dot { background-color: #8b5cf6; }
        
        .sch-cal-dot { 
          width: 4px; height: 4px; border-radius: 50%;
          position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%);
        }
        .sch-cal-num { font-size: 13px; font-weight: 700; color: #334155; }
        
        /* Interactive Promo Card */
        .promo-button-card { 
          transition: transform 0.1s ease, box-shadow 0.1s ease; 
          animation: softPulse 3s ease-in-out infinite;
        }
        .promo-button-card:active { transform: scale(0.97) !important; box-shadow: 0 1px 4px rgba(0,0,0,0.02) !important; animation: none !important; }
        .promo-button-card:hover { border-color: #cbd5e1; }

        @keyframes softPulse {
          0% { transform: scale(1); }
          50% { transform: scale(1.015); }
          100% { transform: scale(1); }
        }

        @keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 6 — Sponsors
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.ne-sponsors.sponsors-root {
  background: transparent;
  padding-bottom: 96px;
  padding-left: clamp(8px, 1.4vw, 24px);
  padding-right: clamp(8px, 1.4vw, 24px);
  box-sizing: border-box;
  width: min(100%, 1480px);
  margin-left: auto;
  margin-right: auto;
  gap: 12px;
}

@media (max-width: 480px) {
  .ne-sponsors.sponsors-root {
    padding-left: 8px;
    padding-right: 8px;
  }
}

@media (min-width: 1024px) {
  .ne-sponsors.sponsors-root {
    padding-left: clamp(18px, 1.6vw, 28px);
    padding-right: clamp(18px, 1.6vw, 28px);
  }
}

.ne-sponsors .sponsors-banner {
  margin: 0;
  border-radius: 20px;
  background:
    radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.18) 0 0, transparent 30%),
    linear-gradient(135deg, #1a73e8 0%, #2b7de9 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  box-shadow: 0 4px 14px rgba(26, 115, 232, 0.18);
}

.ne-sponsors .sponsors-banner-content .banner-title {
  font-family: 'Inter', system-ui, sans-serif;
  letter-spacing: -0.02em;
  color: #fff;
}

.ne-sponsors .sponsors-banner .banner-icon,
.ne-sponsors .sponsors-banner .banner-help-link,
.ne-sponsors .sponsors-banner .banner-help-link .material-symbols-outlined {
  color: #fff !important;
  opacity: 1;
}

.ne-sponsors .sponsors-banner .banner-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
  flex: 0 0 42px;
}

.ne-sponsors .sponsors-banner .banner-help-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  margin-top: -2px;
}

.ne-sponsors .sponsors-banner .banner-desc {
  color: rgba(255, 255, 255, 0.9) !important;
}

.ne-sponsors .ne-seg-control.sponsors-nav-tabs {
  margin: 0;
  padding: 5px;
  background: #f8fafd;
  border: 1px solid rgba(60, 64, 67, 0.12);
  border-radius: 18px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  gap: 4px;
  box-shadow: 0 2px 8px rgba(60, 64, 67, 0.08);
}

.ne-sponsors .ne-seg-control.sponsors-nav-tabs::-webkit-scrollbar { display: none; }

.ne-sponsors .ne-seg-item.nav-tab-btn {
  flex: 1;
  min-width: 52px;
  border: none;
  background: transparent;
  font-family: inherit;
  gap: 6px;
  padding: 10px 6px;
  color: var(--ne-muted);
  border-radius: 14px;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.18s ease-out;
}

.ne-sponsors .ne-seg-item.nav-tab-btn.active {
  background:
    radial-gradient(circle at 82% 12%, rgba(255, 255, 255, 0.2) 0 0, transparent 30%),
    linear-gradient(135deg, #1a73e8 0%, #2b7de9 100%);
  color: #fff;
  box-shadow: 0 3px 10px rgba(26, 115, 232, 0.18);
}

.ne-sponsors .ne-seg-item.nav-tab-btn:active {
  transform: scale(0.98);
}

.ne-sponsors .ne-seg-item.nav-tab-btn .nav-tab-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.ne-sponsors .ne-seg-item.nav-tab-btn .material-symbols-outlined {
  font-size: 18px;
}

.ne-sponsors-tgo-promo {
  margin: 0;
  border-radius: 20px;
  cursor: pointer;
  grid-column: 1 / -1;
}

@media (max-width: 480px) {
  .ne-sponsors .ne-seg-item.nav-tab-btn .nav-tab-label { display: none; }
  .ne-sponsors .ne-seg-item.nav-tab-btn { padding: 12px 4px; gap: 0; }
  .ne-sponsors .ne-seg-item.nav-tab-btn .material-symbols-outlined { font-size: 20px; }
}

.ne-sponsors .sponsors-search-box {
  border-color: var(--ne-border);
  box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
}

.ne-sponsors .sponsors-search-box:focus-within {
  border-color: rgba(var(--ne-primary-rgb), 0.4);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.1);
}

.ne-sponsors .filters-panel,
.ne-sponsors .sponsor-card,
.ne-sponsors .change-card,
.ne-sponsors .stats-grid-card {
  border-color: var(--ne-border);
  box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
}

.ne-sponsors .nav-tab-btn.active,
.ne-sponsors .filter-chip.active,
.ne-sponsors .sponsor-job-search-btn {
  color: var(--ne-primary);
}

.ne-sponsors .md3-button,
.ne-sponsors .load-more-btn {
  background: var(--ne-surface-solid);
  color: var(--ne-primary);
  border: 1.5px solid var(--ne-line);
}

/* в”Ђв”Ђ Sponsors module (extracted) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */

          .sponsors-root {
            display: flex;
            flex-direction: column;
            gap: 16px;
            padding-bottom: 32px;
            font-family: 'Inter', -apple-system, sans-serif;
            color: var(--ne-ink);
          }

          /* рџЏ›пёЏ Premium Gradient Banner */
          .sponsors-banner {
            position: relative;
            background:
              radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.18) 0 0, transparent 30%),
              linear-gradient(135deg, #1a73e8 0%, #2b7de9 100%);
            border: 1px solid rgba(255, 255, 255, 0.18);
            border-radius: 20px;
            padding: 24px;
            color: #fff;
            box-shadow: 0 4px 14px rgba(26, 115, 232, 0.18);
            overflow: hidden;
          }
          .sponsors-banner-overlay {
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: linear-gradient(180deg, rgba(255,255,255,0.08), transparent 54%);
            z-index: 1;
          }
          .sponsors-banner-content {
            position: relative;
            z-index: 2;
            display: flex;
            flex-direction: column;
            gap: 8px;
          }
          .sponsors-banner-heading {
            display: flex;
            align-items: center;
            gap: 10px;
          }
          .sponsors-banner-content .banner-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.16);
            color: #fff;
            opacity: 1;
            flex: 0 0 42px;
          }
          .sponsors-banner-content .banner-title {
            font-size: 22px;
            font-weight: 800;
            margin: 0;
            letter-spacing: -0.02em;
            line-height: 1.2;
          }
          .sponsors-banner-content .banner-desc {
            font-size: 13px;
            color: rgba(255,255,255,0.9);
            margin: 0;
            line-height: 1.4;
          }

          /* рџ“Љ Navigation controls */
          .nav-tab-btn {
              padding: 12px 4px;
              gap: 0;
            }
            .nav-tab-btn span.material-symbols-outlined {
              font-size: 20px;
            }

          /* рџ”Ќ Search Input */
          .sponsors-search-box {
            position: relative;
            display: flex;
            align-items: center;
            background: var(--ne-surface-solid);
            border: 1px solid var(--ne-border);
            border-radius: 14px;
            padding: 0 14px;
            height: 48px;
            box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
            margin-bottom: 4px;
          }
          .sponsors-search-box .search-icon {
            font-size: 20px;
            color: var(--ne-hint);
            margin-right: 10px;
          }
          .sponsors-input-element {
            flex: 1;
            background: none;
            border: none;
            outline: none;
            font-size: 14px;
            font-weight: 500;
            color: var(--ne-ink);
            width: 100%;
            height: 100%;
          }
          .sponsors-input-element::placeholder {
            color: var(--ne-hint);
          }
          .sponsors-search-clear {
            display: none;
            align-items: center;
            justify-content: center;
            background: var(--hover-bg);
            border: none;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            cursor: pointer;
            color: var(--ne-muted);
            padding: 0;
          }
          .sponsors-search-clear span {
            font-size: 14px;
          }

          /* рџ’Љ Filters Row */
          .filters-panel {
            display: flex;
            flex-direction: column;
            gap: 12px;
            background: var(--ne-surface-solid);
            border-radius: 14px;
            border: 1px solid var(--ne-border);
            padding: 14px;
            box-shadow: var(--ne-shadow-card);
            margin-bottom: 4px;
          }
          @media (min-width: 1400px) {
            .filters-panel {
              flex-direction: row;
              align-items: center;
              gap: 32px;
            }
          }
          .filter-group {
            display: flex;
            flex-direction: column;
            gap: 6px;
          }
          @media (min-width: 1400px) {
            .filter-group {
              flex-direction: row;
              align-items: center;
              gap: 8px;
            }
            .filter-label {
              flex-shrink: 0;
              margin-right: 4px;
            }
          }
          .filter-label {
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: var(--ne-hint);
          }
          .filter-pills-row {
            display: flex;
            gap: 6px;
            overflow-x: auto;
            scrollbar-width: none;
            -ms-overflow-style: none;
            -webkit-overflow-scrolling: touch;
            flex-wrap: nowrap;
            padding-bottom: 2px;
          }
          .filter-pills-row::-webkit-scrollbar {
            display: none;
          }
          .filter-pill {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            background: var(--ne-bg-app);
            border: 1px solid var(--ne-border);
            padding: 6px 12px;
            border-radius: 20px;
            font-size: 12px;
            font-weight: 600;
            color: var(--ne-muted);
            cursor: pointer;
            white-space: nowrap;
            transition: all 0.15s ease;
            flex-shrink: 0;
          }
          .filter-pill-icon {
            font-size: 15px;
            line-height: 1;
          }
          .filter-pill .rating-dot--a {
            background: var(--accent-green);
            box-shadow: 0 0 0 3px rgba(52, 168, 83, 0.14);
          }
          .filter-pill .rating-dot--b {
            background: #f59e0b;
            box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.16);
          }
          .filter-pill.active {
            background: var(--primary);
            border-color: var(--primary);
            color: #ffffff;
          }
          @media (max-width: 480px) {
            .filter-pills-row {
              flex-wrap: wrap;
              overflow-x: visible;
              gap: 8px;
            }
          }

          /* Select Dropdown Styling */
          .custom-select-wrapper {
            position: relative;
            display: inline-flex;
            align-items: center;
            flex-shrink: 0;
          }
          .filter-select-element {
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background: var(--ne-bg-app);
            border: 1px solid var(--ne-border);
            padding: 6px 30px 6px 12px;
            border-radius: 20px;
            font-size: 12px;
            font-weight: 600;
            color: var(--ne-muted);
            cursor: pointer;
            outline: none;
            transition: all 0.15s ease;
            max-width: 150px;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            font-family: inherit;
          }
          .filter-select-element:focus {
            border-color: var(--primary);
          }
          .filter-select-element.active {
            background: var(--primary);
            border-color: var(--primary);
            color: #ffffff;
          }
          .custom-select-wrapper .select-arrow {
            position: absolute;
            right: 8px;
            font-size: 18px;
            color: var(--ne-hint);
            pointer-events: none;
            transition: color 0.15s ease;
            display: flex;
            align-items: center;
            justify-content: center;
          }
          .filter-select-element.active + .select-arrow {
            color: #ffffff;
          }

          /* рџЋґ Sponsor Card Styles */
          .sponsors-cards-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 12px;
          }
          @media (min-width: 500px) {
            .sponsors-cards-grid {
              grid-template-columns: 1fr;
              gap: 14px;
            }
          }
          @media (min-width: 600px) {
            .sponsors-cards-grid {
              grid-template-columns: repeat(2, 1fr);
              gap: 16px;
            }
          }
          @media (min-width: 840px) {
            .sponsors-cards-grid {
              grid-template-columns: repeat(2, 1fr);
              gap: 20px;
            }
          }
          @media (min-width: 900px) {
            .sponsors-cards-grid {
              grid-template-columns: repeat(2, 1fr);
              gap: 20px;
            }
          }
          @media (min-width: 1400px) {
            .sponsors-cards-grid {
              grid-template-columns: repeat(3, 1fr);
              gap: 20px;
            }
          }
          .sponsors-cards-grid .skeleton-list {
            grid-column: 1 / -1;
          }
          .sponsor-card {
            position: relative;
            background: var(--ne-surface-solid);
            border-radius: 16px;
            border: 1px solid var(--ne-border);
            padding: 16px;
            box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
            display: flex;
            flex-direction: column;
            gap: 12px;
            transition: transform 0.18s ease-out, box-shadow 0.18s ease-out;
          }
          .sponsor-card:active {
            transform: scale(0.99);
          }
          
          /* Route accent for key Seasonal Worker cards */
          .sponsor-card.border-accent-sw {
            border-left: 4px solid #f97316;
          }

          /* рџЊџ Watchlist Star Button */
          .watchlist-btn {
            position: absolute;
            top: 14px;
            right: 14px;
            background: var(--ne-bg-app);
            border: 1px solid var(--ne-border);
            width: 32px;
            height: 32px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            color: var(--ne-hint);
            padding: 0;
            transition: all 0.2s ease;
          }
          .watchlist-btn span {
            font-size: 18px;
            font-variation-settings: 'FILL' 0, 'wght' 400;
          }
          .watchlist-btn.active {
            background: rgba(245, 158, 11, 0.15);
            border-color: rgba(245, 158, 11, 0.3);
            color: #d97706;
          }
          .watchlist-btn.active span {
            font-variation-settings: 'FILL' 1, 'wght' 400;
          }

          /* Card Internals */
          .sponsor-org-name {
            font-size: 15px;
            font-weight: 700;
            margin: 0;
            line-height: 1.3;
            color: var(--ne-ink);
            max-width: 85%;
            word-wrap: break-word;
          }
          .sponsor-location {
            display: flex;
            align-items: center;
            gap: 4px;
            font-size: 12px;
            color: var(--ne-muted);
            margin-top: 4px;
          }
          .sponsor-location span.material-symbols-outlined {
            font-size: 14px;
            color: var(--ne-hint);
          }

          .sponsor-meta-table {
            display: flex;
            flex-direction: column;
            gap: 6px;
            border-top: 1px solid var(--ne-border);
            border-bottom: 1px solid var(--ne-border);
            padding: 8px 0;
          }
          .meta-row-group {
            display: flex;
            flex-direction: column;
            gap: 6px;
          }
          @media (min-width: 1024px) {
            .meta-row-group {
              flex-direction: row;
              justify-content: space-between;
              align-items: center;
              gap: 8px;
            }
            .meta-row-group .meta-row {
              justify-content: flex-start;
              gap: 6px;
            }
          }
          .meta-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 12px;
          }
          .meta-label {
            color: var(--ne-hint);
            font-weight: 500;
          }
          .meta-value {
            font-weight: 600;
            color: var(--ne-ink);
          }
          .meta-text-small {
            font-size: 11px;
            color: var(--ne-muted);
          }

          /* Custom Badge Pill Designs */
          .sponsor-badge {
            display: inline-flex;
            padding: 2px 8px;
            border-radius: 20px;
            font-size: 10px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.02em;
          }
          .badge-sw {
            background: rgba(249, 115, 22, 0.15);
            color: #ea580c;
          }
          .badge-sk {
            background: rgba(59, 130, 246, 0.15);
            color: #2563eb;
          }
          .badge-secondary {
            background: var(--ne-bg-app);
            color: var(--ne-muted);
            border: 1px solid var(--ne-border);
          }

          /* Rating indicator */
          .rating-indicator {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 11px;
            font-weight: 700;
          }
          .rating-dot {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            display: inline-block;
          }
          .rating-a {
            color: var(--accent-green);
          }
          .rating-a .rating-dot {
            background: var(--accent-green);
            box-shadow: 0 0 0 3px rgba(52, 168, 83, 0.14);
          }
          .rating-b {
            color: #d97706;
          }
          .rating-b .rating-dot {
            background: #f59e0b;
            box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.16);
          }

          .pulsing {
            animation: none;
          }
          @keyframes sponsorsPulse {
            0% { transform: scale(0.9); opacity: 0.6; }
            100% { transform: scale(1.15); opacity: 1; }
          }

          .sponsor-card-dates {
            display: flex;
            justify-content: space-between;
            font-size: 10px;
            color: var(--ne-hint);
            margin-top: auto;
          }
          .date-item {
            display: flex;
            gap: 4px;
          }

          /* рџ“€ Statistics Cards Dashboard */
          .stats-grid {
            display: flex;
            flex-direction: column;
            gap: 12px;
            margin-bottom: 16px;
          }
          .stat-card {
            background: var(--ne-surface-solid);
            border-radius: 16px;
            border: 1px solid var(--ne-border);
            padding: 16px;
            display: flex;
            align-items: center;
            gap: 14px;
            box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
          }
          .border-top-primary {
            border-top: 4px solid var(--primary);
          }
          .stat-icon-wrap {
            width: 44px;
            height: 44px;
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
          }
          .bg-primary-soft {
            background: rgba(var(--ne-primary-rgb), 0.1);
          }
          .text-primary {
            color: var(--primary);
          }
          .stat-meta {
            display: flex;
            flex-direction: column;
          }
          .stat-value {
            font-size: 20px;
            font-weight: 800;
            letter-spacing: -0.01em;
            line-height: 1;
            color: var(--ne-ink);
          }
          .stat-label {
            font-size: 11px;
            font-weight: 600;
            color: var(--ne-muted);
            margin-top: 4px;
          }

          /* Today's changes panel */
          .stats-today-container {
            background: var(--ne-surface-solid);
            border-radius: 16px;
            border: 1px solid var(--ne-border);
            padding: 16px;
            box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
            display: flex;
            flex-direction: column;
            gap: 12px;
          }
          .stats-today-title {
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: var(--ne-muted);
            margin: 0;
          }
          .stats-today-row {
            display: flex;
            justify-content: space-between;
          }
          .today-stat-item {
            display: flex;
            align-items: center;
            gap: 8px;
            flex: 1;
          }
          .today-stat-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            flex-shrink: 0;
          }
          .dot-green { background: var(--accent-green); }
          .dot-red { background: #ef4444; }
          .dot-orange { background: #f97316; }
          
          .today-stat-info {
            display: flex;
            flex-direction: column;
          }
          .today-stat-val {
            font-size: 16px;
            font-weight: 800;
            line-height: 1;
            color: var(--ne-ink);
          }
          .today-stat-label {
            font-size: 10px;
            color: var(--ne-hint);
            margin-top: 2px;
            white-space: nowrap;
          }

          /* рџ•’ Timeline Feed Updates */
          .timeline-wrapper {
            display: flex;
            flex-direction: column;
            gap: 12px;
          }
          .section-title {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 13px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: var(--ne-hint);
            margin: 8px 0 0 0;
          }
          .section-title span {
            font-size: 16px;
          }

          .timeline-log {
            position: relative;
            padding-left: 16px;
            display: flex;
            flex-direction: column;
            gap: 16px;
          }
          @media (min-width: 600px) {
            .timeline-log {
              display: grid;
              grid-template-columns: repeat(2, 1fr);
              gap: 16px;
              padding-left: 0;
            }
            .timeline-log::before {
              display: none;
            }
            .timeline-item {
              display: flex;
              flex-direction: column;
            }
            .timeline-marker {
              display: none;
            }
            .timeline-info {
              height: 100%;
              box-sizing: border-box;
            }
          }
          @media (min-width: 1024px) {
            .timeline-log {
              grid-template-columns: repeat(3, 1fr);
            }
          }
          .timeline-log::before {
            content: '';
            position: absolute;
            top: 8px;
            left: 5px;
            bottom: 8px;
            width: 2px;
            background: var(--hover-bg);
            z-index: 1;
          }
          .timeline-item {
            position: relative;
            display: flex;
            gap: 12px;
            z-index: 2;
          }
          .timeline-marker {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: var(--ne-bg-app);
            border: 2px solid var(--ne-surface-solid);
            display: flex;
            align-items: center;
            justify-content: center;
            position: absolute;
            left: -17px;
            z-index: 3;
            box-shadow: 0 0 0 4px var(--ne-bg-app);
          }
          .timeline-marker span {
            font-size: 14px;
            font-weight: bold;
          }
          .timeline-marker.type-added {
            background: rgba(26, 174, 57, 0.15);
            color: var(--accent-green);
          }
          .timeline-marker.type-removed {
            background: rgba(239, 68, 68, 0.15);
            color: #ef4444;
          }
          .timeline-marker.type-downgrade {
            background: rgba(249, 115, 22, 0.15);
            color: #ea580c;
          }
          .timeline-marker.type-rating {
            background: rgba(59, 130, 246, 0.15);
            color: #2563eb;
          }

          .timeline-info {
            flex: 1;
            background: var(--ne-surface-solid);
            border: 1px solid var(--ne-border);
            border-radius: 14px;
            padding: 12px;
            display: flex;
            flex-direction: column;
            gap: 6px;
          }
          .timeline-item.highlight-sw .timeline-info {
            border: 1px solid rgba(249, 115, 22, 0.4);
            background: rgba(249, 115, 22, 0.02);
          }
          .timeline-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
          }
          .timeline-badge {
            font-size: 9px;
            font-weight: 800;
            text-transform: uppercase;
            padding: 1px 6px;
            border-radius: 6px;
          }
          .timeline-badge.type-added {
            background: rgba(26, 174, 57, 0.15);
            color: var(--accent-green);
          }
          .timeline-badge.type-removed {
            background: rgba(239, 68, 68, 0.15);
            color: #ef4444;
          }
          .timeline-badge.type-downgrade {
            background: rgba(249, 115, 22, 0.15);
            color: #ea580c;
          }
          .timeline-badge.type-rating {
            background: rgba(59, 130, 246, 0.15);
            color: #2563eb;
          }
          .timeline-date {
            font-size: 10px;
            color: var(--ne-hint);
          }
          .timeline-org-name {
            font-size: 13px;
            font-weight: 700;
            margin: 0;
            color: var(--ne-ink);
          }
          .timeline-details {
            display: flex;
            gap: 12px;
            font-size: 11px;
            color: var(--ne-muted);
          }
          .timeline-meta-item {
            display: flex;
            align-items: center;
            gap: 4px;
          }
          .timeline-meta-item span {
            font-size: 12px;
            color: var(--ne-hint);
          }
          .timeline-diff {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            font-size: 11px;
            background: var(--ne-bg-app);
            padding: 4px 8px;
            border-radius: 6px;
            align-self: flex-start;
            font-weight: 600;
            color: var(--ne-muted);
            margin-top: 2px;
          }
          .timeline-diff .diff-old {
            color: #ef4444;
            text-decoration: line-through;
          }
          .timeline-diff .diff-new {
            color: var(--accent-green);
          }
          .timeline-diff-icon {
            font-size: 14px;
            color: var(--ne-hint);
          }
          .sw-alert-indicator {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            font-size: 9px;
            font-weight: 700;
            background: rgba(249, 115, 22, 0.1);
            color: #ea580c;
            padding: 3px 6px;
            border-radius: 4px;
            align-self: flex-start;
            text-transform: uppercase;
            letter-spacing: 0.02em;
          }
          .sw-alert-indicator .material-symbols-outlined {
            font-size: 13px;
          }

          /* рџ“­ Empty state styling */
          .sponsors-empty-state {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 40px 20px;
            background: var(--ne-surface-solid);
            border-radius: 20px;
            border: 1px solid var(--ne-border);
            text-align: center;
          }
          .sponsors-empty-state .empty-icon {
            font-size: 48px;
            color: var(--ne-hint);
            margin-bottom: 12px;
          }
          .sponsors-empty-state p {
            font-size: 13px;
            font-weight: 500;
            color: var(--ne-muted);
            margin: 0;
            line-height: 1.4;
          }

          .sponsors-error {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 16px;
            text-align: center;
            color: #ef4444;
            font-weight: 600;
            font-size: 13px;
            background: rgba(239, 68, 68, 0.05);
            border-radius: 12px;
            border: 1px dashed rgba(239, 68, 68, 0.2);
          }
          .sponsors-error .material-symbols-outlined {
            font-size: 18px;
          }

          /* рџ”„ Skeletal Loading & Loading more items */
          .skeleton-list {
            display: grid;
            grid-template-columns: 1fr;
            gap: 12px;
          }
          @media (min-width: 600px) {
            .skeleton-list {
              grid-template-columns: repeat(2, 1fr);
              gap: 16px;
            }
          }
          @media (min-width: 1024px) {
            .skeleton-list {
              grid-template-columns: repeat(3, 1fr);
              gap: 16px;
            }
          }
          .skeleton-card {
            background: var(--ne-surface-solid);
            border-radius: 16px;
            border: 1px solid var(--ne-border);
            padding: 16px;
            display: flex;
            flex-direction: column;
            gap: 10px;
          }
          .skeleton-title {
            height: 16px;
            width: 70%;
          }
          .skeleton-subtitle {
            height: 12px;
            width: 40%;
          }
          .skeleton-row {
            height: 12px;
            width: 90%;
            margin-top: 4px;
          }

          .load-more-btn {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            background: var(--ne-surface-solid);
            border: 1px solid var(--ne-border);
            padding: 12px;
            border-radius: 14px;
            font-size: 13px;
            font-weight: 700;
            color: var(--primary);
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
          }
          .load-more-btn:active {
            transform: scale(0.98);
            background: var(--hover-bg);
          }
          .load-more-btn:disabled {
            opacity: 0.6;
            cursor: not-allowed;
          }

          .sponsors-spin {
            animation: sponsorsSpin 1s linear infinite;
          }
          @keyframes sponsorsSpin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
          }

          /* Glow card hover/active accent */
          .card-glow {
            box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
          }

          /* Micro transition classes */
          .anim-fade-in {
            animation: sponsorsFade 0.2s ease-out;
          }
          @keyframes sponsorsFade {
            from { opacity: 0.6; transform: translateY(6px); }
            to { opacity: 1; transform: translateY(0); }
          }
          
          .font-accent {
            font-family: 'Inter', system-ui, -apple-system, sans-serif;
          }

          /* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
             🗺️ MAP TAB STYLES — Premium Leaflet Integration
             в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

          /* Map Container */
          .sponsors-map-element {
            height: 450px;
            border-radius: 16px;
            overflow: hidden;
            border: 1px solid var(--ne-border);
            background: var(--ne-surface-solid);
            position: relative;
          }
          @media (max-width: 480px) {
            .sponsors-map-element {
              height: 380px;
              border-radius: 12px;
            }
          }

          /* Custom Marker Styling */
          .sponsors-map-marker-wrapper {
            background: transparent !important;
            border: none !important;
          }
          .sponsors-map-marker {
            width: 22px;
            height: 22px;
            border-radius: 50%;
            background: var(--ne-surface-solid);
            border: 2.5px solid rgba(0,0,0,0.15);
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 8px rgba(0,0,0,0.18);
            transition: transform 0.15s ease;
          }
          .sponsors-map-marker:hover {
            transform: scale(1.3);
          }
          .sponsors-marker-dot {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            display: block;
            animation: sponsorsMapPulse 2.5s ease-in-out 2;
          }
          @keyframes sponsorsMapPulse {
            0% { transform: scale(0.85); opacity: 0.7; }
            100% { transform: scale(1.2); opacity: 1; }
          }

          /* Cluster Icon Styling */
          .sponsors-cluster-wrapper {
            background: transparent !important;
            border: none !important;
          }
          .sponsors-cluster-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            font-family: 'Inter', system-ui, sans-serif;
            font-weight: 800;
            color: #ffffff;
            box-shadow: 0 3px 12px rgba(79, 70, 229, 0.35);
            transition: transform 0.2s ease;
          }
          .sponsors-cluster-icon:hover {
            transform: scale(1.1);
          }
          .sponsors-cluster-small {
            width: 34px;
            height: 34px;
            font-size: 11px;
            background: linear-gradient(135deg, #818cf8, #6366f1);
          }
          .sponsors-cluster-medium {
            width: 42px;
            height: 42px;
            font-size: 13px;
            background: linear-gradient(135deg, #6366f1, #4f46e5);
            box-shadow: 0 4px 16px rgba(79, 70, 229, 0.4);
          }
          .sponsors-cluster-large {
            width: 50px;
            height: 50px;
            font-size: 15px;
            background: linear-gradient(135deg, #4f46e5, #4338ca);
            box-shadow: 0 4px 20px rgba(67, 56, 202, 0.5);
          }

          /* Leaflet Popup Override */
          .sponsors-leaflet-popup .leaflet-popup-content-wrapper {
            background: var(--ne-surface-solid);
            border-radius: 14px;
            border: 1px solid var(--ne-border);
            box-shadow: 0 8px 32px rgba(0,0,0,0.12);
            padding: 0;
            overflow: hidden;
          }
          .sponsors-leaflet-popup .leaflet-popup-content {
            margin: 0;
            font-family: 'Inter', system-ui, sans-serif;
            color: var(--ne-ink);
            width: auto !important;
          }
          .sponsors-leaflet-popup .leaflet-popup-tip {
            background: var(--ne-surface-solid);
            border: 1px solid var(--ne-border);
          }
          .sponsors-leaflet-popup .leaflet-popup-close-button {
            color: var(--ne-hint);
            font-size: 18px;
            padding: 6px 8px;
            z-index: 10;
          }
          .sponsors-leaflet-popup .leaflet-popup-close-button:hover {
            color: var(--ne-ink);
          }

          /* Popup Card Inner */
          .sponsors-popup-card {
            padding: 14px;
            display: flex;
            flex-direction: column;
            gap: 8px;
            min-width: 200px;
          }
          .popup-org-name {
            font-size: 14px;
            font-weight: 700;
            margin: 0;
            line-height: 1.3;
            color: var(--ne-ink);
            max-width: 240px;
            word-wrap: break-word;
          }
          .popup-location {
            font-size: 11px;
            color: var(--ne-muted);
            display: flex;
            align-items: center;
            gap: 4px;
          }
          .popup-meta {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
          }
          .popup-rating-pill {
            font-size: 11px;
            font-weight: 700;
            display: inline-flex;
            align-items: center;
          }
          .popup-watchlist-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
            margin-top: 4px;
            padding: 7px 12px;
            border-radius: 10px;
            border: 1px solid var(--ne-border);
            background: var(--ne-bg-app);
            color: var(--ne-muted);
            font-family: 'Inter', system-ui, sans-serif;
            font-size: 11px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.15s ease;
          }
          .popup-watchlist-btn:active {
            transform: scale(0.97);
          }
          .popup-watchlist-btn.active {
            background: rgba(245, 158, 11, 0.12);
            border-color: rgba(245, 158, 11, 0.3);
            color: #d97706;
          }

          /* Override Leaflet default MarkerCluster styles for dark mode */
          .leaflet-container a {
            color: var(--primary);
          }
          .leaflet-control-zoom a {
            background: var(--ne-surface-solid) !important;
            color: var(--ne-ink) !important;
            border-color: rgba(0,0,0,0.1) !important;
          }
          .leaflet-control-attribution {
            background: rgba(255,255,255,0.7) !important;
            font-size: 9px !important;
          }
          @media not all {
            .leaflet-control-attribution {
              background: rgba(30,35,41,0.85) !important;
              color: #9ca3af !important;
            }
            .leaflet-control-attribution a {
              color: #7dd3fc !important;
            }
            .leaflet-control-zoom a {
              background: #1e2329 !important;
              color: rgba(255,255,255,0.9) !important;
              border-color: rgba(255,255,255,0.1) !important;
            }
          }

          /* рџЊџ ONBOARDING OVERLAY STYLES */
          .sponsors-onboarding-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 99999;
            background: rgba(0, 0, 0, 0.45);
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
            animation: onboardingFadeIn 0.3s ease-out;
          }
          @keyframes onboardingFadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
          }
          .sponsors-onboarding-card {
            background: var(--ne-surface-solid);
            border: 1px solid var(--ne-border);
            border-radius: 24px;
            padding: 28px 24px 20px 24px;
            max-width: 340px;
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            position: relative;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0.15);
            animation: onboardingSlideUp 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
          }
          @keyframes onboardingSlideUp {
            from { transform: translateY(30px) scale(0.95); opacity: 0; }
            to { transform: translateY(0) scale(1); opacity: 1; }
          }
          
          .onboarding-close-btn {
            position: absolute;
            top: 14px;
            right: 14px;
            background: transparent;
            border: none;
            color: var(--ne-hint);
            cursor: pointer;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.15s ease;
          }
          .onboarding-close-btn:active {
            background: var(--hover-bg);
            color: var(--ne-ink);
          }

          .onboarding-icon-container {
            width: 72px;
            height: 72px;
            border-radius: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 20px;
            box-shadow: inset 0 2px 4px rgba(255,255,255,0.2);
            transition: all 0.3s ease;
          }
          .onboarding-icon {
            font-size: 38px !important;
          }

          .onboarding-content {
            margin-bottom: 24px;
          }
          .onboarding-title {
            font-size: 19px;
            font-weight: 800;
            margin: 0 0 10px 0;
            color: var(--ne-ink);
            line-height: 1.3;
          }
          .onboarding-desc {
            font-size: 13px;
            line-height: 1.5;
            color: var(--ne-muted);
            margin: 0;
            padding: 0 6px;
          }

          .onboarding-bullets {
            display: flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 24px;
          }
          .onboarding-bullet {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--ne-hint);
            opacity: 0.4;
            transition: all 0.25s ease;
          }
          .onboarding-bullet.active {
            width: 20px;
            border-radius: 3px;
            background: var(--primary);
            opacity: 1;
          }

          .onboarding-actions {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
          }
          .onboarding-btn {
            font-family: 'Inter', system-ui, sans-serif;
            font-size: 13px;
            font-weight: 700;
            padding: 10px 16px;
            border-radius: 12px;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
          }
          .onboarding-btn:active {
            transform: scale(0.96);
          }
          .onboarding-btn.primary-btn {
            background: var(--primary);
            color: #ffffff;
            flex-grow: 1.5;
            box-shadow: 0 4px 12px rgba(79, 70, 229, 0.25);
          }
          .onboarding-btn.primary-btn.finish-btn {
            background: #10b981;
            box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);
          }
          .onboarding-btn.secondary-btn {
            background: var(--hover-bg);
            border: 1px solid var(--ne-border);
            color: var(--ne-muted);
            flex-grow: 1;
          }
          .onboarding-btn.text-btn {
            background: transparent;
            color: var(--ne-hint);
            font-weight: 600;
            flex-grow: 1;
          }

          /* Replay Help Link in Banner */
          .banner-help-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            vertical-align: middle;
            margin-left: 6px;
            color: rgba(255,255,255,0.7);
            background: rgba(255,255,255,0.15);
            border-radius: 50%;
            width: 20px;
            height: 20px;
            cursor: pointer;
            transition: all 0.15s ease;
          }
          .banner-help-link:active {
            background: rgba(255,255,255,0.3);
            color: #ffffff;
            transform: scale(0.9);
          }
          .banner-help-link .material-symbols-outlined {
            font-size: 13px !important;
          }

          /* 💼 JOBS TAB STYLES — Premium Workspace */
          .jobs-workspace {
            display: flex;
            flex-direction: column;
            gap: 16px;
          }
          
          .jobs-hero-card {
            position: relative;
            background: linear-gradient(135deg, #e8f0fe 0%, #ffffff 100%);
            border-radius: 16px;
            border: 1px solid rgba(var(--ne-primary-rgb), 0.16);
            padding: 20px;
            color: var(--ne-ink);
            overflow: hidden;
            display: flex;
            justify-content: space-between;
            align-items: center;
            box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
          }
          @media not all {
            .jobs-hero-card {
              background: linear-gradient(135deg, #202124, #171719);
              color: #f8fafd;
            }
          }
          .jobs-hero-content {
            position: relative;
            z-index: 2;
            max-width: 80%;
          }
          .jobs-hero-badge {
            display: inline-block;
            font-size: 9px;
            font-weight: 800;
            text-transform: uppercase;
            background: rgba(var(--ne-primary-rgb), 0.1);
            color: var(--ne-primary);
            padding: 2px 8px;
            border-radius: 20px;
            margin-bottom: 8px;
            letter-spacing: 0.05em;
          }
          .jobs-hero-title {
            font-size: 18px;
            font-weight: 800;
            margin: 0 0 6px 0;
            line-height: 1.3;
          }
          .jobs-hero-desc {
            font-size: 12px;
            color: var(--ne-muted);
            margin: 0;
            line-height: 1.45;
          }
          .hero-decoration-icon {
            font-size: 72px !important;
            color: rgba(var(--ne-primary-rgb), 0.08);
            position: absolute;
            right: 12px;
            bottom: -8px;
            pointer-events: none;
            z-index: 1;
          }
          
          .jobs-search-form-card {
            background: var(--ne-surface-solid);
            border-radius: 16px;
            border: 1px solid var(--ne-border);
            padding: 16px;
            display: flex;
            flex-direction: column;
            gap: 14px;
          }
          .jobs-form-title {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 13px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: var(--ne-hint);
            margin: 0;
          }
          .jobs-form-title span.material-symbols-outlined {
            font-size: 16px;
          }
          
          .jobs-form-grid {
            display: flex;
            flex-direction: column;
            gap: 12px;
          }
          @media (min-width: 600px) {
            .jobs-form-grid {
              display: grid;
              grid-template-columns: repeat(3, 1fr);
              gap: 12px;
            }
          }
          .jobs-input-group {
            display: flex;
            flex-direction: column;
            gap: 6px;
          }
          .jobs-label {
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.02em;
            color: var(--ne-hint);
          }
          .jobs-input-wrapper, .jobs-select-wrapper {
            position: relative;
            display: flex;
            align-items: center;
            background: var(--ne-bg-app);
            border: 1px solid var(--ne-border);
            border-radius: 12px;
            height: 40px;
            padding: 0 10px;
            transition: border-color 0.15s ease;
          }
          .jobs-input-wrapper:focus-within {
            border-color: var(--primary);
          }
          .jobs-input-wrapper .input-icon {
            font-size: 18px;
            color: var(--ne-hint);
            margin-right: 8px;
          }
          .jobs-input-wrapper .jobs-input-element {
            flex: 1;
            background: none;
            border: none;
            outline: none;
            font-size: 13px;
            font-weight: 600;
            color: var(--ne-ink);
            width: 100%;
          }
          .jobs-input-wrapper .jobs-input-element::placeholder {
            color: var(--ne-hint);
            font-weight: 500;
          }
          
          .jobs-select-wrapper {
            padding: 0;
          }
          .jobs-select-element {
            -webkit-appearance: none;
            appearance: none;
            width: 100%;
            height: 100%;
            background: none;
            border: none;
            outline: none;
            font-size: 13px;
            font-weight: 600;
            color: var(--ne-ink);
            padding: 0 32px 0 10px;
            cursor: pointer;
            font-family: inherit;
          }
          .jobs-select-wrapper .select-arrow {
            position: absolute;
            right: 8px;
            font-size: 18px;
            color: var(--ne-hint);
            pointer-events: none;
          }
          
          .jobs-search-btn {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            background: var(--primary);
            color: #ffffff;
            border: none;
            padding: 12px;
            border-radius: 12px;
            font-size: 13px;
            font-weight: 700;
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 4px 12px rgba(79, 70, 229, 0.15);
          }
          .jobs-search-btn:active {
            transform: scale(0.98);
            opacity: 0.95;
          }
          
          .jobs-categories-section {
            display: flex;
            flex-direction: column;
            gap: 12px;
          }
          .jobs-categories-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 10px;
          }
          @media (min-width: 600px) {
            .jobs-categories-grid {
              grid-template-columns: repeat(2, 1fr);
              gap: 12px;
            }
          }
          @media (min-width: 1024px) {
            .jobs-categories-grid {
              grid-template-columns: repeat(3, 1fr);
              gap: 12px;
            }
          }
          
          .jobs-cat-card {
            background: var(--ne-surface-solid);
            border-radius: 14px;
            border: 1px solid var(--ne-border);
            padding: 12px;
            display: flex;
            align-items: center;
            gap: 12px;
            cursor: pointer;
            transition: transform 0.2s, box-shadow 0.2s;
          }
          .jobs-cat-card:active {
            transform: scale(0.98);
          }
          
          .cat-icon-container {
            width: 40px;
            height: 40px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
          }
          .cat-icon-container span {
            font-size: 20px;
          }
          .bg-care { background: rgba(26, 174, 57, 0.12); color: var(--accent-green); }
          .bg-it { background: rgba(59, 130, 246, 0.12); color: #2563eb; }
          .bg-agri { background: rgba(249, 115, 22, 0.12); color: #ea580c; }
          .bg-hosp { background: rgba(236, 72, 153, 0.12); color: #db2777; }
          .bg-logi { background: rgba(139, 92, 246, 0.12); color: #7c3aed; }
          .bg-const { background: rgba(107, 114, 128, 0.12); color: #4b5563; }
          
          .cat-info {
            flex: 1;
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 2px;
          }
          .cat-name {
            font-size: 13px;
            font-weight: 700;
            margin: 0;
            color: var(--ne-ink);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }
          .cat-query {
            font-size: 10px;
            color: var(--ne-hint);
            margin: 0;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }
          .cat-arrow {
            font-size: 16px !important;
            color: var(--ne-hint);
            transition: transform 0.2s;
          }
          .jobs-cat-card:hover .cat-arrow {
            transform: translateX(2px);
            color: var(--primary);
          }

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 7 — English module shell
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.ne-english.english-root {
  background: transparent;
  padding-bottom: 96px;
  animation: ne-fade-in 0.34s var(--ne-ease-out) both;
}

.ne-english .english-hero {
  margin: 0 0 20px;
  padding: 28px 20px 32px;
  border-radius: var(--ne-radius-xl);
  border-bottom: none;
  background: linear-gradient(145deg, #1a73e8 0%, #4285f4 52%, #6f5cf6 100%);
  box-shadow: var(--ne-shadow-hero);
  color: #fff;
  text-align: left;
  overflow: hidden;
}

.ne-english .english-hero::before {
  background: linear-gradient(125deg, rgba(255,255,255,0.16) 0%, transparent 58%);
}

.ne-english .english-hero-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 26px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
}

.ne-english .english-hero-desc {
  color: rgba(255, 255, 255, 0.9);
  max-width: 100%;
}

.ne-english .course-card {
  border-radius: var(--ne-radius-md);
  border-color: var(--ne-border);
  box-shadow: var(--ne-shadow-card);
}

.ne-english .course-card::after {
  background: var(--course-color, var(--ne-primary));
}

.ne-english .course-cta,
.ne-english .course-badge {
  color: var(--course-color, var(--ne-primary));
}

/* Course iframe viewer (fullscreen in module) */
.ne-english-course.course-view-container {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--ne-bg-app);
  z-index: 1005;
  animation: ne-english-slide-in 0.35s var(--ne-ease-out);
}

@keyframes ne-english-slide-in {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.ne-english-course .course-view-header {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ne-border);
}

.ne-english-course .ne-english-level-tabs {
  flex: 1;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 8px;
  mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent);
}

.ne-english-course .ne-english-level-tabs::-webkit-scrollbar { display: none; }

.ne-english-course .ne-english-level-chip {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  color: var(--ne-muted);
  background: rgba(var(--ne-primary-rgb), 0.08);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.12);
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s, color 0.2s;
}

.ne-english-course .ne-english-level-chip.active {
  background: var(--ne-primary);
  color: #fff;
  border-color: var(--ne-primary);
  box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.28);
}

.ne-english-course .course-iframe {
  flex: 1;
  border: none;
  width: 100%;
  background: var(--ne-bg-app);
}

.ne-english-course .course-skeleton {
  background: var(--ne-bg-app);
}

.ne-english-course .skel-block {
  background: var(--ne-skeleton-bg, linear-gradient(90deg, #e8eaed 25%, #f0f4f9 50%, #e8eaed 75%));
  background-size: 400% 100%;
}

/* в”Ђв”Ђ English home (extracted) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */

.course-view-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  background: var(--ne-surface-solid);
  z-index: 1005;
  animation: slideIn 0.35s cubic-bezier(0.32, 0.72, 0, 1);
}

@keyframes slideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.course-view-header {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  background: var(--ne-surface-solid);
  border-bottom: 1px solid var(--ne-border);
  gap: 12px;
  height: 60px;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  position: sticky;
  top: 0;
  z-index: 10;
}

.course-view-back {
  background: rgba(0,0,0,0.04);
  border: none;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  color: var(--ne-ink);
}

.course-view-back:active {
  background: rgba(0,0,0,0.1);
  transform: scale(0.9);
}

/* Level Switcher Tabs */
.course-tabs {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 16px;
  scrollbar-width: none;
  -ms-overflow-style: none;
  mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.course-tabs::-webkit-scrollbar { display: none; }

.level-tab {
  padding: 8px 16px;
  background: rgba(0,0,0,0.035);
  border: 1px solid rgba(0,0,0,0.02);
  border-radius: 12px;
  font-size: 13px;
  font-weight: 750;
  color: var(--ne-muted);
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  scroll-snap-align: center;
}

.level-tab.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
  box-shadow: 0 4px 12px rgba(0, 117, 222, 0.3);
  transform: scale(1.05);
}

.course-iframe {
  flex: 1;
  border: none;
  width: 100%;
  background: var(--bg-color, #f3f2f1);
  position: relative;
  z-index: 2;
}

.course-skeleton {
  position: absolute;
  top: 60px; left: 0; right: 0; bottom: 0;
  background: var(--bg-color, #f3f2f1);
  display: flex;
  flex-direction: column;
  padding: 24px 16px;
  gap: 16px;
  z-index: 8;
}

.skel-block {
  background: linear-gradient(90deg, rgba(0,0,0,0.05) 25%, rgba(0,0,0,0.08) 50%, rgba(0,0,0,0.05) 75%);
  background-size: 400% 100%;
  animation: skelPulse 1.4s ease infinite;
  border-radius: 12px;
}

.skel-title { height: 28px; width: 65%; }
.skel-sub   { height: 14px; width: 45%; margin-top: -8px; }
.skel-card  { height: 130px; width: 100%; border-radius: 20px; }

@keyframes skelPulse {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   P0 + Phase 2–3 finish — Onboarding, Story, Shell, Settings
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

#zoir-onboarding {
  position: fixed;
  inset: 0;
  z-index: 200000;
  background: var(--ne-bg-app);
  display: flex;
  flex-direction: column;
  font-family: 'Inter', system-ui, sans-serif;
  animation: ne-ob-fadeIn 0.4s var(--ne-ease-out);
  overflow-y: auto;
  color: var(--ne-ink);
  -webkit-overflow-scrolling: touch;
}
@keyframes ne-ob-fadeIn { from { opacity: 0; } to { opacity: 1; } }

.ob-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ob-glow {
  position: absolute;
  top: -120px;
  left: 50%;
  transform: translateX(-50%);
  width: 500px;
  height: 400px;
  background: radial-gradient(ellipse, rgba(var(--ne-primary-rgb), 0.12), transparent 70%);
  pointer-events: none;
}
.ob-content {
  padding: 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
  max-width: 400px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
  z-index: 1;
  position: relative;
  justify-content: center;
  text-align: center;
}
.ob-brand {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  margin-bottom: 4px;
  color: var(--ne-ink);
}
.ob-brand em { font-style: normal; color: var(--ne-primary); }
.ob-brand span { color: var(--ne-hint); font-weight: 700; }
.ob-brand.sm { font-size: 1.35rem; margin-bottom: 16px; }
.ob-uk-flag { margin-bottom: 20px; }
.ob-uk-flag svg { border-radius: 4px; box-shadow: var(--ne-shadow-card); }
.ob-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 6px;
  line-height: 1.3;
  color: var(--ne-ink);
}
.ob-desc { color: var(--ne-muted); font-size: 0.82rem; margin-bottom: 22px; line-height: 1.5; }
.ob-lang-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
.ob-lang-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  padding: 14px 16px;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s var(--ne-ease-out);
  font-family: inherit;
  box-shadow: var(--ne-shadow-card);
  text-align: left;
  -webkit-tap-highlight-color: transparent;
}
.ob-lang-iso { font-size: 1.1rem; font-weight: 800; color: var(--ne-ink); width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.ob-lang-card.active,
.ob-lang-card:hover {
  border-color: var(--ne-primary);
  background: rgba(var(--ne-primary-rgb), 0.06);
  box-shadow: 0 0 0 1px var(--ne-primary);
}
.ob-lang-card.active .ob-lang-iso { color: var(--ne-primary); }
.ob-lang-card:active { transform: scale(0.96); }
.ob-lang-card.error { border-color: var(--ne-error); background: #fce8e6; }
.ob-exp-grid { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; width: 100%; }
.ob-exp-card {
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  padding: 18px 16px;
  cursor: pointer;
  text-align: left;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  transition: all 0.25s var(--ne-ease-out);
  font-family: inherit;
  box-shadow: var(--ne-shadow-card);
  -webkit-tap-highlight-color: transparent;
}
.ob-exp-card:hover { transform: translateY(-2px); }
.ob-exp-card:active { transform: scale(0.97); }
.ob-exp-emoji { font-size: 1.6rem; margin-top: 2px; }
.ob-exp-label { font-size: 0.92rem; font-weight: 700; margin-bottom: 2px; color: var(--ne-ink); }
.ob-exp-sub { font-size: 0.75rem; color: var(--ne-muted); line-height: 1.4; }
.rotate-text, .rotate-text2 { transition: opacity 0.5s ease, transform 0.4s ease; }
.rotate-text.fade-out, .rotate-text2.fade-out { opacity: 0; transform: translateY(-6px); }
.ob-slide-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px auto 16px;
}
.ob-slide-icon .material-symbols-outlined { font-size: 40px; }
.ob-slide-icon--finance { background: rgba(26, 115, 232, 0.12); color: var(--ne-primary); }
.ob-slide-icon--housing { background: rgba(26, 174, 57, 0.12); color: #1aae39; }
.ob-slide-icon--english { background: rgba(124, 77, 255, 0.12); color: var(--ne-violet); }
.ob-dots { display: flex; gap: 6px; justify-content: center; margin: 16px 0; }
.ob-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ne-border); transition: all 0.2s; }
.ob-dot.active { background: var(--ne-primary); width: 20px; border-radius: 4px; }
.ob-step--center { text-align: center; }
.ob-step__spacer { margin-top: 20px; }
.ob-emoji-flag { font-size: 3rem; margin-bottom: 12px; }
.ob-setup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.setup-field { margin-bottom: 16px; text-align: left; width: 100%; }
.setup-label {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--ne-hint);
  margin-bottom: 8px;
  display: block;
}
.setup-input, .setup-select {
  width: 100%;
  padding: 14px;
  border-radius: var(--ne-radius-sm);
  border: 1px solid var(--ne-border);
  font-size: 15px;
  font-weight: 600;
  background: var(--ne-surface-solid);
  outline: none;
  transition: 0.2s;
  box-sizing: border-box;
  font-family: inherit;
}
.setup-input:focus, .setup-select:focus { border-color: var(--ne-primary); }
.setup-input.error, .setup-select.error { border-color: var(--ne-error); }
.setup-input--date { padding: 14px 8px; }
.ob-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--ne-primary);
  color: #fff;
  font-weight: 700;
  font-size: 0.92rem;
  padding: 14px 24px;
  border-radius: var(--ne-radius-md);
  box-shadow: 0 4px 16px rgba(var(--ne-primary-rgb), 0.25);
  transition: all 0.25s var(--ne-ease-out);
  border: none;
  cursor: pointer;
  width: 100%;
  margin-top: 24px;
  font-family: inherit;
}
.ob-btn:hover { transform: translateY(-2px); }
.ob-btn:active { transform: scale(0.96); }
.ob-btn.shake { animation: ne-ob-shake 0.2s ease-in-out 0s 2; }
@keyframes ne-ob-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}
.ob-step { display: flex; flex-direction: column; flex: 1; align-items: center; width: 100%; }
.ob-head { margin-bottom: 4px; }
.ob-title--lg { font-size: 24px; margin-bottom: 16px; }

/* Onboarding New Step 2 Design */
.ob-hero-card {
  background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
  color: #ffffff;
  padding: 24px 20px;
  border-radius: 24px;
  text-align: left;
  margin-bottom: 16px;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.3);
}
.ob-hero-card::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 60%);
  pointer-events: none;
}
.ob-hero-badge {
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 10px;
  border-radius: 99px;
  margin-bottom: 14px;
}
.ob-hero-title {
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0 0 10px 0;
  line-height: 1.3;
}
.ob-hero-desc {
  font-size: 0.8rem;
  line-height: 1.4;
  margin: 0;
  opacity: 0.9;
}
.ob-task-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  margin-bottom: 24px;
}
.ob-task-card {
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  border-radius: 18px;
  padding: 14px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 14px;
  transition: all 0.2s ease-in-out;
  box-shadow: var(--ne-shadow-card);
  -webkit-tap-highlight-color: transparent;
  width: 100%;
  box-sizing: border-box;
}
.ob-task-card:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--ne-primary-rgb), 0.3);
}
.ob-task-card:active {
  transform: scale(0.98);
}
.ob-task-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  flex-shrink: 0;
}
.ob-task-icon-wrap.farms { background: rgba(52, 168, 83, 0.1); color: #34a853; }
.ob-task-icon-wrap.income { background: rgba(26, 115, 232, 0.1); color: #1a73e8; }
.ob-task-icon-wrap.transfers { background: rgba(26, 115, 232, 0.1); color: #1a73e8; }
.ob-task-icon-wrap.tax { background: rgba(124, 77, 255, 0.1); color: #7c4dff; }
.ob-task-icon-wrap.agencies { background: rgba(100, 116, 139, 0.1); color: #64748b; }
.ob-task-icon-wrap.help { background: rgba(234, 88, 12, 0.1); color: #ea580c; }

.ob-task-info {
  flex: 1;
  min-width: 0;
  text-align: left;
}
.ob-task-label {
  font-size: 0.92rem;
  font-weight: 750;
  color: var(--ne-ink);
  margin-bottom: 2px;
}
.ob-task-sub {
  font-size: 0.76rem;
  color: var(--ne-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ob-task-arrow {
  font-size: 18px !important;
  color: var(--ne-hint);
}
.ob-footer-note {
  font-size: 0.72rem;
  color: var(--ne-muted);
  margin-top: auto;
  padding: 10px 0;
  line-height: 1.4;
}


#story-ad-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: ne-story-fadeIn 0.5s ease;
  font-family: 'Inter', sans-serif;
  overflow: hidden;
}
@keyframes ne-story-fadeIn { from { opacity: 0; } to { opacity: 1; } }
.story-bg-blur {
  position: absolute;
  inset: -20px;
  background-size: cover;
  background-position: center;
  filter: blur(30px) brightness(0.6);
  transform: scale(1.1);
  z-index: 1;
}
.story-content {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  z-index: 2;
  max-width: 500px;
}
.story-img-container {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Symmetric vertical padding centres the card; 16px sides keep it off the
     screen edges on narrow phones (the story has no bottom CTA anymore). */
  padding: 60px 16px;
}
.story-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 15px 35px rgba(0, 0, 0, 0.5));
  animation: ne-story-imgIn 0.6s cubic-bezier(0.19, 1, 0.22, 1) both;
}
@keyframes ne-story-imgIn {
  from { transform: scale(0.9) translateY(20px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}
.story-top-bars {
  position: absolute;
  top: 12px;
  left: 10px;
  right: 10px;
  display: flex;
  gap: 4px;
  z-index: 5;
}
.story-bar-bg { flex: 1; height: 3px; background: rgba(255, 255, 255, 0.2); border-radius: 10px; overflow: hidden; }
.story-bar-fill { height: 100%; width: 0%; background: #fff; transition: width linear; }
.story-close-btn {
  position: absolute;
  top: 24px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.1);
  cursor: pointer;
  z-index: 10;
  opacity: 0;
  pointer-events: none;
  transform: scale(0.8);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: all 0.3s var(--ne-ease-spring);
}
.story-close-btn.visible { opacity: 1; pointer-events: auto; transform: scale(1); }
.story-close-btn:active { transform: scale(0.9); background: rgba(255, 255, 255, 0.3); }
.story-close-btn .material-symbols-outlined { font-size: 24px; }
.story-brand {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  height: 24px;
  z-index: 10;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));
}
.story-cta {
  position: absolute;
  bottom: 50px;
  left: 24px;
  right: 24px;
  background: #fff;
  color: var(--ne-ink);
  padding: 20px;
  border-radius: var(--ne-radius-lg);
  font-weight: 800;
  font-size: 16px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  animation: ne-story-slideUp 0.7s 0.3s both;
  text-transform: uppercase;
  letter-spacing: -0.02em;
}
.story-cta .material-symbols-outlined { font-size: 24px; }
@keyframes ne-story-slideUp {
  from { transform: translateY(30px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.ne-module-error {
  padding: 24px;
  text-align: center;
  color: var(--ne-error);
  font-family: 'Inter', system-ui, sans-serif;
}
.ne-module-error h3 { margin: 0 0 8px; font-size: 1.1rem; }
.ne-module-error p { margin: 0; font-size: 13px; color: var(--ne-muted); }

.dmc--farms .dmc__icon-wrap    { background: linear-gradient(135deg, #4ade80 0%, #16a34a 100%); }
.dmc--income .dmc__icon-wrap   { background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%); }
.dmc--transfer .dmc__icon-wrap { background: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%); }
.dmc--tax .dmc__icon-wrap      { background: linear-gradient(135deg, #34d399 0%, #059669 100%); }
.dmc--agencies .dmc__icon-wrap { background: linear-gradient(135deg, #818cf8 0%, #4f46e5 100%); }
.dmc--help .dmc__icon-wrap     { background: linear-gradient(135deg, #2dd4bf 0%, #0d9488 100%); }

.dmc--jobs .dmc__icon-wrap {
  background: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%);
  box-shadow: 0 8px 16px rgba(59, 130, 246, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--sponsors .dmc__icon-wrap {
  background: linear-gradient(135deg, #818cf8 0%, #4f46e5 100%);
  box-shadow: 0 8px 16px rgba(79, 70, 229, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--finance .dmc__icon-wrap {
  background: linear-gradient(135deg, #34d399 0%, #059669 100%);
  box-shadow: 0 8px 16px rgba(16, 185, 129, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--english .dmc__icon-wrap {
  background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%);
  box-shadow: 0 8px 16px rgba(245, 158, 11, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--flights .dmc__icon-wrap {
  background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
  box-shadow: 0 8px 16px rgba(14, 165, 233, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--visa_checker .dmc__icon-wrap {
  background: linear-gradient(135deg, #5b8dee 0%, #3b5bdb 100%);
  box-shadow: 0 8px 16px rgba(59, 91, 219, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--shop .dmc__icon-wrap {
  background: linear-gradient(135deg, #a78bfa 0%, #7c4dff 100%);
  box-shadow: 0 8px 16px rgba(124, 77, 255, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--profile .dmc__icon-wrap {
  background: linear-gradient(135deg, #c084fc 0%, #7c3aed 100%);
  box-shadow: 0 8px 16px rgba(124, 58, 237, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--guide .dmc__icon-wrap {
  background: linear-gradient(135deg, #f87171 0%, #dc2626 100%);
  box-shadow: 0 8px 16px rgba(220, 38, 38, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--forum .dmc__icon-wrap {
  background: linear-gradient(135deg, #2dd4bf 0%, #0d9488 100%);
  box-shadow: 0 8px 16px rgba(13, 148, 136, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--settings .dmc__icon-wrap {
  background: linear-gradient(135deg, #94a3b8 0%, #475569 100%);
  box-shadow: 0 8px 16px rgba(100, 116, 139, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
.dmc--services .dmc__icon-wrap {
  background: linear-gradient(135deg, #fb923c 0%, #ea580c 100%);
  box-shadow: 0 8px 16px rgba(234, 88, 12, 0.3), inset 0 2px 4px rgba(255, 255, 255, 0.4);
}
}

.ne-settings-welcome { margin-bottom: 24px; position: relative; overflow: hidden; }
.ne-settings-welcome__bg-icon {
  position: absolute;
  top: -20px;
  right: -20px;
  opacity: 0.06;
  pointer-events: none;
}
.ne-settings-welcome__bg-icon .material-symbols-outlined { font-size: 140px; color: var(--ne-primary); }
.ne-settings-welcome__inner { position: relative; z-index: 1; }
.ne-settings-welcome__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.ne-settings-welcome__head .material-symbols-outlined { color: var(--ne-primary); font-size: 28px; }
.ne-settings-welcome__title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: var(--ne-ink);
  margin: 0;
}
.ne-settings-welcome__desc {
  font-size: 13.5px;
  color: var(--ne-muted);
  line-height: 1.6;
  margin-bottom: 20px;
  font-weight: 500;
}
.ne-settings-progress__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10px;
  font-weight: 800;
  margin-bottom: 8px;
  color: var(--ne-hint);
  letter-spacing: 0.05em;
}
.ne-settings-progress__pct { color: var(--ne-primary); }
.ne-settings-progress__track {
  height: 8px;
  background: var(--ne-border);
  border-radius: 99px;
  overflow: hidden;
}
.ne-settings-progress__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--ne-primary), var(--ne-violet));
  border-radius: 99px;
  transition: width 0.4s var(--ne-ease-out);
}
.ne-srv-live-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  background: #34a853;
  border-radius: 50%;
  margin-left: 8px;
  box-shadow: 0 0 5px #34a853;
}
.ne-srv-live-label { font-size: 10px; color: #34a853; vertical-align: middle; font-weight: 800; }

.ne-srv-rate__live[hidden]{display:none!important;}
.ne-srv-rate__live:not([hidden]){display:inline-flex;}
.ne-settings-progress{margin-bottom:24px;}
.ne-settings-checklist{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.ne-settings-checklist .checklist-item{color:var(--ne-muted);font-size:12px;}
.ne-wiki-sync-banner {
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--ne-primary);
  padding: 4px;
  background: rgba(var(--ne-primary-rgb), 0.06);
  border-radius: 8px;
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-shadow: inset 0 0 0 1px rgba(var(--ne-primary-rgb), 0.12);
}

/* Phase 5 finish — Finance NE components */
.ne-finance-refund-hero {
  padding: 14px;
  margin-top: 12px;
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  box-shadow: none;
  position: relative;
  overflow: hidden;
}

.ne-finance-refund-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--ne-surface-solid);
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--ne-border);
}

.ne-finance-stat { text-align: left; }
.ne-finance-stat--right { text-align: right; }
.ne-finance-stat__label {
  font-size: 11px;
  font-weight: 800;
  color: var(--ne-hint);
  text-transform: uppercase;
}
.ne-finance-stat__val { font-size: 14px; font-weight: 700; color: var(--ne-ink); }
.ne-finance-stat__val--tax { color: var(--ne-error); }
.ne-finance-stat-divider { width: 1px; background: var(--ne-border); height: 24px; flex-shrink: 0; }

.ne-finance-workplace {
  padding: 0;
  overflow: hidden;
  margin-bottom: 16px;
  background: var(--ne-surface-solid);
}
.ne-finance-workplace__head {
  padding: 12px 16px;
  border-bottom: 1px solid var(--ne-border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ne-finance-workplace__title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ne-primary);
}
.ne-finance-workplace__title .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-primary);
  font-variation-settings: 'FILL' 1;
}
.ne-finance-workplace__remove {
  font-size: 20px;
  color: var(--ne-hint);
  cursor: pointer;
  transition: color 0.15s;
}
.ne-finance-workplace__remove:hover { color: var(--ne-error); }


/* Finance screen accent = green (money/refund). Scope the token so dropdowns,
   pay icons, accent labels and the refund-highlight rows all read one green
   instead of the previous green-button-vs-blue-links split. Value-only. */
.finance-root {
  --ne-primary: #16a34a;
  --ne-primary-rgb: 22, 163, 74;
  --ne-primary-active: #15803d;
}

.ne-finance-forms { display: flex; flex-direction: column; gap: 12px; }
.ne-finance-actions { margin-top: 16px; display: flex; gap: 8px; }
.ne-finance-btn-calc {
  flex: 1;
  height: 48px;
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
  font-size: 14px;
  border-radius: var(--ne-radius-sm) !important;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2) !important;
}
.ne-finance-btn-reset {
  width: 48px;
  height: 48px;
  border: none !important;
  /* Neutral, not red — a quiet "start over", not a danger zone next to Calculate */
  background: #eef0f3 !important;
  color: #6b7280 !important;
  padding: 0 !important;
  flex-shrink: 0;
  border-radius: var(--ne-radius-sm) !important;
}
.ne-finance-btn-reset .material-symbols-outlined { font-size: 20px; margin: 0; }
.add-workplace-btn .material-symbols-outlined { font-size: 18px; }

#refund-results-area[hidden] { display: none !important; }
#refund-results-area:not([hidden]) { margin-top: 16px; transition: 0.3s; }

.ne-ficon--muted { background: #f1f5f9 !important; color: #475569 !important; }
.ne-ficon--blue { background: #f0f9ff !important; color: #0369a1 !important; }
.ne-ficon--violet { background: #fdf4ff !important; color: #a21caf !important; }
.ne-ficon--green { background: #f0fdf4 !important; color: #166534 !important; }
.ne-ficon--orange { background: #fff7ed !important; color: #f97316 !important; }
.ne-ficon--pay { background: #e8f0fe !important; color: var(--ne-primary) !important; }
.ne-finance-label--accent { color: var(--ne-primary); font-weight: 800; }
.settings-item-right-small--farm { width: 120px; }
.settings-item-right-small--culture { max-width: 140px; }
.refund-highlight-row--last { border-bottom: none !important; }

.ne-finance-shift-hero {
  padding: 24px;
  position: relative;
  overflow: hidden;
  background: var(--ne-surface-solid);
}
.ne-finance-shift-settings {
  position: absolute;
  top: 12px;
  right: 12px;
  border: none;
  background: none;
  color: var(--ne-hint);
  cursor: pointer;
  z-index: 10;
  padding: 4px;
}
.ne-finance-shift-settings .material-symbols-outlined { font-size: 20px; }
.ne-finance-shift-grid {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  background: var(--ne-surface-2);
  padding: 12px;
  border-radius: var(--ne-radius-sm);
}
.ne-finance-shift-grid--3 { grid-template-columns: repeat(3, 1fr); }
.ne-finance-shift-grid--4 { grid-template-columns: repeat(4, 1fr); }
.ne-finance-metric { text-align: center; }
.ne-finance-metric__label { font-size: 11px; font-weight: 800; color: var(--ne-hint); }
.ne-finance-metric__val { font-size: 13px; font-weight: 700; color: var(--ne-ink); }
.ne-finance-metric__val--danger { color: var(--ne-error); }
.ne-finance-metric__val--warn { color: var(--ne-amber-text); }
.ne-finance-net-block { margin-top: 20px; text-align: center; }
.ne-finance-net-label {
  font-size: 11px;
  font-weight: 800;
  color: var(--ne-hint);
  letter-spacing: 0.1em;
  display: block;
  margin-bottom: 4px;
}
.ne-finance-net-val {
  font-size: 42px;
  font-weight: 800;
  color: var(--ne-primary);
  font-family: 'Inter', system-ui, sans-serif;
}
.ne-finance-net-uzs {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-hint);
  margin-top: 4px;
}
.ne-finance-net-uzs[hidden] { display: none !important; }
.ne-finance-shift-divider { height: 1px; background: var(--ne-border); margin: 16px -24px 12px; }
.ne-finance-promo {
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  padding: 10px;
  margin: 0;
  text-align: center;
  cursor: pointer;
}
.ne-finance-promo__title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-muted);
  margin-bottom: 6px;
}
.ne-finance-promo__row { display: flex; justify-content: center; align-items: center; gap: 12px; }
.ne-finance-promo__divider { width: 1px; height: 10px; background: var(--ne-border); }
.ne-finance-promo__stores { display: flex; align-items: center; gap: 8px; }
.ne-finance-promo__stores img { height: 11px; opacity: 0.5; }
.ne-finance-promo__stores img:first-child { height: 14px; }
.ne-finance-calendar-card { padding: 16px; }

/* Phase 5b — Finance refund results, shifts, TransferGo tab */
.ne-finance-results { display: flex; flex-direction: column; gap: 16px; }
.ne-finance-result-card { padding: 0; overflow: hidden; }
.ne-finance-result-head {
  padding: 12px 16px;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--ne-hint);
  border-bottom: 1px solid var(--ne-border);
  display: flex;
  align-items: center;
  gap: 8px;
}
.ne-finance-result-head .material-symbols-outlined { font-size: 16px; }
.ne-finance-result-val {
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-ink);
  text-align: right;
}
.ne-finance-result-val--danger { color: var(--ne-error); }
.ne-ficon--rose { background: #fff1f2 !important; color: #e11d48 !important; }

.ne-finance-tax-breakdown { padding: 16px; background: var(--ne-surface-2); }
.ne-finance-tax-breakdown__title {
  font-size: 10px;
  font-weight: 800;
  color: var(--ne-hint);
  text-transform: uppercase;
  margin-bottom: 12px;
  letter-spacing: 0.05em;
}
.ne-finance-breakdown-row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  margin-bottom: 6px;
  color: var(--ne-muted);
}
.ne-finance-breakdown-row__val { font-weight: 700; color: var(--ne-ink); }
.ne-finance-breakdown-divider { height: 1px; background: var(--ne-border); margin: 12px 0; }
.ne-finance-refund-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-weight: 800;
  color: var(--ne-primary, #16a34a);
}
.ne-finance-refund-total__amt { font-size: 20px; font-weight: 800; }
.ne-finance-disclaimer {
  font-size: 10px;
  color: var(--ne-hint);
  line-height: 1.4;
  margin-top: 10px;
  font-weight: 500;
  text-align: right;
}

/* Calculator → review bridge card */
.ne-finance-review-bridge {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
  background: #eaf2fb;
  border: 1px solid rgba(37,99,235,0.18);
}
.ne-finance-review-bridge__icon { font-size: 26px; flex-shrink: 0; }
.ne-finance-review-bridge__body { flex: 1; min-width: 0; }
.ne-finance-review-bridge__title { font-size: 13.5px; font-weight: 600; color: var(--ne-ink, #111827); line-height: 1.35; }
.ne-finance-review-bridge__farm { font-size: 12px; color: var(--ne-hint, #6b7280); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ne-finance-review-bridge__btn { flex-shrink: 0; border: none; background: var(--ne-primary, #1a73e8); color: #fff; font-size: 13px; font-weight: 600; padding: 9px 14px; border-radius: 20px; cursor: pointer; font-family: inherit; }
.ne-finance-review-bridge__btn:active { background: var(--ne-primary-active, #1d4fd0); }

.ne-finance-agent-card {
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, #fff 0%, #f0fdf4 100%);
  border-top: 5px solid #1aae39;
  border-radius: var(--ne-radius-lg);
}
.ne-finance-agent-deco {
  position: absolute;
  right: -15px;
  top: -15px;
  font-size: 120px;
  color: rgba(26, 174, 57, 0.04);
  transform: rotate(15deg);
  pointer-events: none;
}
.ne-finance-agent-inner { position: relative; z-index: 1; }
.ne-finance-agent-head { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.ne-finance-agent-icon {
  background: #dcfce7;
  color: #1aae39;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 10px rgba(22, 197, 94, 0.1);
}
.ne-finance-agent-icon .material-symbols-outlined { font-size: 26px; }
.ne-finance-agent-title { font-weight: 900; font-size: 18px; color: var(--ne-ink); letter-spacing: -0.04em; }
.ne-finance-agent-sub {
  font-size: 11px;
  color: #1aae39;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ne-finance-agent-desc { font-size: 14px; color: var(--ne-muted); line-height: 1.6; margin-bottom: 24px; font-weight: 500; }
.ne-finance-agent-tip {
  margin-top: 16px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px dashed rgba(26, 174, 57, 0.3);
  padding: 14px;
  border-radius: 14px;
  font-size: 12.5px;
  color: var(--ne-muted);
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.ne-finance-agent-tip .material-symbols-outlined { color: #1aae39; font-size: 18px; flex-shrink: 0; }
.ne-finance-agent-btn {
  width: 100%;
  height: 56px;
  background: #1aae39 !important;
  border: none !important;
  border-radius: 18px !important;
  color: #fff !important;
  font-size: 16px;
  font-weight: 800;
  box-shadow: 0 8px 24px rgba(26, 174, 57, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  cursor: pointer;
}
.ne-finance-agent-btn .material-symbols-outlined { font-size: 22px; }

.ne-finance-shifts-panel { padding: 16px; display: flex; flex-direction: column; }
.ne-finance-section-head { margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.ne-finance-section-head .material-symbols-outlined { color: var(--ne-primary); }
.ne-finance-shifts-list { margin-top: 0; flex: 1; min-height: 0; overflow-y: auto; padding-right: 4px; }
.ne-finance-period-card { padding: 0 20px 16px; overflow: visible; margin-bottom: 16px; background: var(--ne-surface-solid); }
.ne-finance-weekly-summary {
  background: rgba(var(--ne-primary-rgb), 0.06);
  border: 1px dashed rgba(var(--ne-primary-rgb), 0.25);
  border-radius: var(--ne-radius-md);
  padding: 16px;
  margin: 16px 0;
  min-width: 0;
  box-sizing: border-box;
}
.ne-finance-weekly-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 12px; }
.ne-finance-weekly-label {
  font-size: 11px;
  font-weight: 800;
  color: var(--ne-primary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ne-finance-weekly-net { margin-top: 12px; display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap; }
.ne-finance-weekly-net__val { font-size: 22px; font-weight: 800; color: #1aae39; }
.ne-finance-weekly-net__lbl { font-size: 13px; color: var(--ne-muted); }
.ne-finance-weekly-meta { text-align: right; flex-shrink: 0; max-width: 45%; min-width: 0; }
.ne-finance-weekly-date { font-size: 11px; color: var(--ne-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ne-finance-weekly-hours { font-size: 13px; font-weight: 600; color: var(--ne-muted); margin-top: 4px; }
.ne-finance-weekly-divider { height: 1px; background: rgba(var(--ne-primary-rgb), 0.15); margin: 12px 0; }
.ne-finance-weekly-foot { font-size: 11px; color: var(--ne-muted); line-height: 1.5; }
.ne-finance-badge { font-size: 10px; padding: 2px 8px; border-radius: 6px; display: inline-block; margin: 4px 0; }
.ne-finance-badge--current { background: var(--ne-border); color: var(--ne-muted); }
.ne-finance-badge--done { background: #dcfce7; color: #1aae39; font-weight: 600; }
.ne-finance-warn { color: var(--ne-amber-text); margin-top: 8px; font-size: 11px; font-weight: 700; }
.sch-row-right { text-align: right; }
.sch-row-amount--muted { color: var(--ne-hint); font-size: 12px; }
.sch-row-amount--sick { color: var(--ne-violet); }
.sch-row-amount--holiday { color: var(--ne-primary); }

.ne-finance-tg-hero { padding: 20px 24px; text-align: center; margin-bottom: 16px; }
.ne-finance-tg-logo { height: 24px; margin-bottom: 12px; }
.ne-finance-tg-title { font-size: 18px; line-height: 1.3; margin-bottom: 4px; color: var(--ne-ink); font-weight: 700; }
.ne-finance-tg-sub { font-size: 13px; color: var(--ne-muted); font-style: italic; opacity: 0.9; }
.ne-finance-tg-promo {
  border-top: 1px solid var(--ne-border);
  padding-top: 16px;
  display: flex;
  gap: 12px;
  align-items: center;
}
.ne-finance-tg-promo img { width: 32px; height: 32px; }
.ne-finance-tg-promo p { font-size: 12px; color: var(--ne-muted); line-height: 1.4; margin: 0; }
.premium-tg-btn__main { font-size: 16px; font-weight: 800; letter-spacing: -0.01em; }
.premium-tg-btn__sub { font-size: 11px; font-weight: 600; opacity: 0.9; }
#tg_rate_content[hidden] { display: none !important; }

/* Phase 6 — Sponsors onboarding icon steps */
.onboarding-icon-container--step0 { background: rgba(99, 102, 241, 0.1); color: #6366f1; }
.onboarding-icon-container--step1 { background: rgba(16, 185, 129, 0.1); color: #10b981; }
.onboarding-icon-container--step2 { background: rgba(6, 182, 212, 0.1); color: #06b6d4; }
.onboarding-btn .material-symbols-outlined { font-size: 18px; vertical-align: middle; }
.onboarding-btn--back .material-symbols-outlined { margin-right: 4px; }
.onboarding-btn--next .material-symbols-outlined { margin-left: 4px; }
.onboarding-btn--finish .material-symbols-outlined { margin-right: 4px; }
.sponsors-search-clear[hidden] { display: none !important; }

.sponsors-search-clear:not([hidden]){display:flex;align-items:center;justify-content:center;}
/* Phase 5c — Finance shift modal & calendar */
.ne-finance-shift-modal .modal-header {
  border-bottom: none;
  padding-bottom: 0;
}
.ne-finance-shift-modal .modal-drag-handle { margin-bottom: 8px; }
.ne-finance-shift-head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ne-finance-shift-head .material-symbols-outlined {
  color: var(--ne-primary);
  font-size: 22px;
}
.ne-finance-shift-modal .modal-title { font-size: 17px; margin: 0; }
.ne-finance-shift-date {
  font-size: 11px;
  color: var(--ne-hint);
  margin-top: 2px;
}
.ne-finance-type-picker { margin-bottom: 12px; }
.ne-finance-type-picker .type-item .material-symbols-outlined { font-size: 16px; }
#modal-shift-inputs[hidden] { display: none !important; }
.ne-finance-shift-fields {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 10px;
}
.ne-finance-rate-row {
  display: flex;
  align-items: center;
  gap: 4px;
}
.ne-finance-rate-prefix { font-size: 13px; color: var(--ne-hint); }
.ne-finance-shift-modal #modal-rate { font-size: 16px; }
.ne-finance-note-box { margin-top: 4px; }
.ne-finance-shift-modal #modal-note {
  font-size: 13px;
  font-weight: 400;
}
.ne-finance-shift-save {
  width: 100%;
  height: 48px;
  margin-top: 16px;
  border-radius: var(--ne-radius-sm) !important;
  font-size: 15px;
}
.ne-finance-shift-delete {
  width: 100%;
  margin-top: 8px;
  height: 40px;
  font-size: 13px;
  color: var(--ne-error) !important;
}
/* Pay-setup modal — clean, stacked header (don't inherit the flex-row .modal-header) */
.ne-finance-setup-modal .modal-header {
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0 18px 14px;
  border-bottom: 1px solid var(--ne-border);
}
.ne-finance-setup-modal .modal-drag-handle {
  width: 40px;
  height: 4px;
  border-radius: 4px;
  background: var(--ne-border);
  margin: 10px auto 14px;
}
.ne-finance-setup-title {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ne-finance-setup-title .material-symbols-outlined {
  color: var(--ne-primary);
  font-size: 22px;
  flex-shrink: 0;
}
.ne-finance-setup-modal .modal-title {
  font-size: 18px;
  line-height: 1.2;
  margin: 0;
}
.ne-finance-setup-desc {
  margin: 8px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--ne-muted);
}
.ne-finance-setup-modal .modal-body {
  padding: 16px 18px 22px;
}

/* Collapsible "Advanced / optional" section inside the pay-setup modal */
.ne-finance-adv-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 14px;
  padding: 12px 14px;
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ne-ink);
  cursor: pointer;
  transition: background 0.15s ease;
}
.ne-finance-adv-toggle:active { background: rgba(0, 0, 0, 0.05); }
.ne-finance-adv-toggle__left { display: flex; align-items: center; gap: 8px; }
.ne-finance-adv-toggle__left .material-symbols-outlined { font-size: 18px; color: var(--ne-primary); }
.ne-finance-adv-toggle__chev { font-size: 20px; color: var(--ne-muted); transition: transform 0.2s ease; }
.ne-finance-adv-toggle.open .ne-finance-adv-toggle__chev { transform: rotate(180deg); }
.ne-finance-adv-body { display: none; margin-top: 8px; }
.ne-finance-adv-body.open { display: block; animation: ne-modal-fade-in 0.2s var(--ne-ease-out); }

/* ── Section accordion toggle (card-header style) ── */
.ne-finance-sect-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 16px;
  background: transparent;
  border: none;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
}
.ne-finance-sect-toggle__left { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; }
.ne-finance-sect-toggle__chev { font-size: 20px; color: var(--ne-muted); transition: transform 0.2s ease; flex-shrink: 0; }
.ne-finance-sect-toggle.open .ne-finance-sect-toggle__chev { transform: rotate(180deg); }
.ne-finance-sect-body { display: none; }
.ne-finance-sect-body.open { display: block; animation: ne-modal-fade-in 0.2s var(--ne-ease-out); }
/* Card padding reset when used with accordion toggle */
.ne-settings-panel:has(.ne-finance-sect-toggle),
.ne-finance-howto-card:has(.ne-finance-sect-toggle) { padding: 0; }
.ne-finance-howto-card:has(.ne-finance-sect-toggle) { border-left: none; border-right: none; margin: 0; }
/* body inside card needs its own padding */
.ne-finance-sect-body > .settings-list,
.ne-finance-sect-body > .ne-finance-howto-steps { padding: 0; }
.ne-finance-sect-body > .ne-finance-howto-steps { padding: 8px 16px 0; }
.ne-finance-sect-body > .ne-finance-howto-btn { margin: 12px 16px 0; width: calc(100% - 32px); }
.ne-finance-sect-body > .ne-finance-howto-warn { margin: 10px 16px 12px; }

/* Tax rules variant — matches original ne-settings-panel__head style */
.ne-finance-sect-toggle--tax {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  border-bottom: 1px solid #f1f5f9;
}
.ne-finance-sect-toggle--tax.open { border-bottom-color: transparent; }
.ne-finance-sect-toggle--tax .material-symbols-outlined { font-size: 16px; color: var(--ne-primary); }
/* Howto variant — matches original ne-finance-howto-head style */
.ne-finance-sect-toggle--green { font-size: 15px; font-weight: 700; color: #137333; }
.ne-finance-sect-toggle--green .material-symbols-outlined { font-size: 22px; font-variation-settings: 'FILL' 1; color: #137333; }

/* Single consolidated save-status chip (sits under the progress bar) */
.ne-finance-setup-status {
  min-height: 16px;
  margin: -10px 0 12px;
  text-align: right;
  font-size: 11px;
  font-weight: 600;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.ne-finance-setup-status__saving { color: #94a3b8; }

.ne-finance-cal-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding: 0 4px;
  overflow: hidden;
}
.ne-finance-cal-nav__btn {
  border: none;
  background: none;
  color: var(--ne-muted);
  font-size: 20px;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
}
.ne-finance-cal-title {
  font-weight: 800;
  font-size: 14px;
  color: var(--ne-ink);
  text-transform: capitalize;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0 8px;
  flex: 1;
  text-align: center;
}
.ne-finance-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}
.ne-finance-cal-dow {
  text-align: center;
  font-size: 10px;
  font-weight: 800;
  color: var(--ne-hint);
  margin-bottom: 4px;
}
.sch-cal-spacer { aspect-ratio: 1; pointer-events: none; }

/* Phase 5 — Wiki farm card quick wins */
.ne-wiki-farm-card__meta { font-size: 12px; color: var(--ne-muted); }
.ne-wiki-empty-hint {
  text-align: center;
  padding: 32px 16px;
  color: var(--ne-muted);
  font-size: 14px;
}

/* Phase 5 — Wiki farm & job cards NE cleanup */
.farm-card { animation-delay: var(--ne-delay, 0s); }
.ne-wiki-farm-top { display: flex; flex-direction: column; gap: 4px; }
.ne-wiki-farm-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.ne-wiki-farm-top .farm-card-name { margin: 0; }
.meta-tag.meta-tag--pin { flex-shrink: 0; margin-top: 2px; }
.ne-wiki-crops { margin-top: 2px; }
.ne-wiki-farm-bottom {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
  padding-top: 8px;
  align-items: stretch;
}
.ne-wiki-farm-stats-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.farm-rating-pill.ne-wiki-rating-pill {
  flex-direction: column;
  padding: 5px 10px;
  min-width: 48px;
  border-radius: 10px;
  gap: 1px;
  text-align: center;
}
.ne-wiki-rating-val { font-size: 13px; font-weight: 800; line-height: 1; }
.ne-wiki-farm-actions { display: flex; gap: 8px; }
.farm-btn.ne-wiki-btn-flex { flex: 1; }
.review-count-badge.ne-wiki-review-badge {
  background:
    radial-gradient(circle at 80% 15%, rgba(255, 255, 255, 0.22) 0 0, transparent 32%),
    #1a73e8;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  min-width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  padding: 0 4px;
  margin-left: 2px;
  box-shadow: 0 2px 6px rgba(26, 115, 232, 0.24);
}
.ne-wiki-review-zero {
  min-width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(60, 64, 67, 0.08);
  color: var(--ne-hint);
  font-size: 10px;
  font-weight: 800;
  margin-left: 2px;
}
.sk.ne-wiki-sk-badge {
  width: 18px;
  height: 18px;
  border-radius: 9px;
  margin-left: 2px;
  display: inline-block;
}
.farm-btn .material-symbols-outlined { font-size: 14px; vertical-align: middle; }

.wiki-op-chip {
  display: inline-flex;
  align-items: center;
  background: rgba(var(--ne-primary-rgb), 0.08);
  color: var(--ne-primary);
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
}
.wiki-op-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.wiki-op-more {
  cursor: pointer;
  background: var(--ne-bg-app);
  border: 1px solid var(--ne-border);
}
.wiki-op-extra { display: none; }
.wiki-op-extra.is-open { display: contents; }

@keyframes wikiUrgentPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}
.wiki-urgency {
  font-size: 10px;
  border-radius: 8px;
  padding: 3px 8px;
  display: flex;
  align-items: center;
  gap: 4px;
  align-self: flex-start;
  margin-top: -4px;
  white-space: nowrap;
  background: rgba(0, 0, 0, 0.04);
  color: var(--ne-muted);
}
.wiki-urgency--hot {
  background: #ff4d4f;
  color: #fff;
  font-weight: 800;
  box-shadow: 0 4px 10px rgba(255, 77, 79, 0.3);
  animation: wikiUrgentPulse 1.5s ease-in-out infinite;
}
.wiki-urgency--warn {
  background: #dd5b00;
  color: #fff;
  font-weight: 800;
}
.wiki-urgency .material-symbols-outlined { font-size: 13px; }

.job-item { animation-delay: var(--ne-delay, 0s); }
.ne-wiki-job-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.ne-wiki-job-title-row { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; }
.ne-wiki-job-icon {
  width: 36px;
  height: 36px;
  background: rgba(var(--ne-primary-rgb), 0.08);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
.ne-wiki-job-title-wrap { min-width: 0; flex: 1; }
.job-farm-title.ne-wiki-job-title {
  margin: 0;
  line-height: 1.2;
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ne-wiki-job-actions { gap: 8px; margin-top: 12px; border-top: 1px dashed var(--ne-border); padding-top: 10px; }
.ne-wiki-job-btn { flex: 1; height: 36px; padding: 0; display: flex; align-items: center; justify-content: center; border-radius: 12px; font-size: 13px; font-weight: 800; }
.ne-wiki-job-btn-icon { width: 36px; height: 36px; flex-shrink: 0; padding: 0; display: flex; align-items: center; justify-content: center; border-radius: 12px; }
.ne-wiki-job-btn-icon .material-symbols-outlined { font-size: 18px; }

.ne-sponsors-popup-pin { font-size: 13px; vertical-align: middle; }
.ne-sponsors-popup-route { font-size: 9px; }
.ne-sponsors-popup-rating { color: var(--ne-primary); }
.ne-sponsors-popup-rating--b { color: var(--ne-amber-text); }
.ne-sponsors-popup-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 3px; vertical-align: middle; }
.ne-sponsors-popup-actions { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; width: 100%; }
.popup-watchlist-btn .ne-sponsors-star { font-size: 14px; vertical-align: middle; }
.sponsor-job-search-btn.ne-sponsors-job-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 7px 12px;
  border-radius: 10px;
  border: 1px solid var(--ne-border);
  background: var(--ne-surface-solid);
  color: var(--ne-primary);
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
}
.sponsor-job-search-btn.ne-sponsors-job-link .material-symbols-outlined { font-size: 13px; vertical-align: middle; }
.ne-sponsors-card-footer {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: auto;
  border-top: 1px dashed var(--ne-border);
  padding-top: 10px;
}
.ne-sponsors-card-footer .sponsor-card-dates { margin-top: 0; }

/* Wiki — TransferGo promo card (jobs tab) */
.ne-wiki-promo {
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-primary-active) 100%) !important;
  border: none !important;
  padding: 18px 20px;
  box-shadow: 0 10px 25px rgba(var(--ne-primary-rgb), 0.2);
  animation: wikiCardIn 0.5s ease both;
  animation-delay: 0.2s;
  border-radius: 20px;
  margin-bottom: 16px;
}
.ne-wiki-promo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.ne-wiki-promo-logo {
  height: 14px;
  width: auto;
  filter: brightness(0) invert(1);
}
.ne-wiki-promo-badge {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 8px;
  font-weight: 800;
  padding: 3px 10px;
  border-radius: 6px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ne-wiki-promo-body {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 16px;
}
.ne-wiki-promo-icon-wrap {
  background: #fff;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.ne-wiki-promo-icon-wrap img { width: 26px; height: 26px; }
.ne-wiki-promo-title {
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  margin-bottom: 4px;
}
.ne-wiki-promo-desc {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.95);
  line-height: 1.4;
  font-weight: 500;
}
.ne-wiki-promo-btn {
  background: #fff !important;
  color: var(--ne-primary) !important;
  width: 100%;
  height: 40px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 800;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.ne-wiki-promo-btn .material-symbols-outlined { font-size: 18px; }

/* Live exchange-rate line */
.ne-wiki-promo-rate {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 2px;
  padding: 4px 10px;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
}
.ne-wiki-promo-rate__flag { font-size: 14px; line-height: 1; }
.ne-wiki-promo-rate__pair b { font-weight: 800; }

/* Dual title: desktop shows --desktop, mobile shows --mobile */
.ne-wiki-promo-title--mobile { display: none; }
@media (max-width: 640px) {
  .ne-wiki-promo-title--desktop { display: none; }
  .ne-wiki-promo-title--mobile { display: block; }
}

/* ── Promo card: mobile — compact horizontal row ── */
@media (max-width: 640px) {
  .job-item.promo-item.ne-wiki-promo {
    padding: 12px 14px !important;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 10px;
  }
  .job-item.promo-item .ne-wiki-promo-head {
    display: none;
  }
  .job-item.promo-item .ne-wiki-promo-body {
    flex: 1;
    min-width: 0;
    margin-bottom: 0;
    align-items: center;
    gap: 6px;
  }
  .job-item.promo-item .ne-wiki-promo-icon-wrap {
    display: none;
  }
  .job-item.promo-item .ne-wiki-promo-title {
    font-size: 13px;
    margin-bottom: 4px;
    line-height: 1.3;
  }
  .job-item.promo-item .ne-wiki-promo-desc {
    display: none;
  }
  .job-item.promo-item .ne-wiki-promo-rate {
    margin: 0;
    padding: 3px 8px;
    font-size: 11.5px;
  }
  .job-item.promo-item .ne-wiki-promo-rate__flag { font-size: 12px; }
  .job-item.promo-item .ne-wiki-promo-btn {
    align-self: center;
    width: auto;
    height: 36px;
    padding: 0 14px;
    border-radius: 10px;
    font-size: 12px;
    flex-shrink: 0;
    white-space: nowrap;
  }
  .job-item.promo-item .ne-wiki-promo-btn .material-symbols-outlined {
    display: none;
  }
}

.ne-wiki-jobs-list--flush { padding-top: 0; }
.jobs-disclaimer-tag .material-symbols-outlined { font-size: 14px; }

/* Sponsors — jobs, modal, map (phase 6b) */
.job-urgent-tag.urgent-week {
  background: rgba(249, 115, 22, 0.12);
  color: #ea580c;
}
.sponsors-vacancy-p {
  margin: 0 0 12px 0;
  line-height: 1.5;
  color: var(--ne-text);
  font-size: 14px;
}
.sponsors-vacancy-spacer { height: 8px; }
.ne-sponsors-meta-muted {
  font-size: 11px;
  font-weight: normal;
  color: var(--ne-muted);
}
.ne-sponsors-compliance-title {
  color: #991b1b;
  font-size: 13px;
  display: block;
  margin-bottom: 2px;
}
.ne-sponsors-compliance-text {
  font-size: 12px;
  line-height: 1.4;
  color: #7f1d1d;
}
.ne-sponsors-spin-icon { font-size: 16px; }
.ne-sponsors-map-error { margin: 24px; }
.sponsors-map-marker {
  border-color: var(--marker-border, rgba(0, 0, 0, 0.15));
}
.sponsors-marker-dot {
  background: var(--marker-dot, var(--ne-primary));
  box-shadow: 0 0 6px var(--marker-dot, var(--ne-primary));
}
.ne-sponsors-popup-dot {
  background: var(--marker-dot, var(--ne-primary));
}
.ne-sponsors-map-legend {
  margin-top: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--ne-text-secondary);
  font-weight: 500;
}
.ne-sponsors-map-legend .material-symbols-outlined { font-size: 16px; }
.ne-sponsors-map-hint {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  font-size: 11.5px;
  line-height: 1.45;
  color: var(--ne-muted);
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.ne-sponsors-map-hint .material-symbols-outlined {
  font-size: 15px;
  color: var(--ne-primary);
  flex-shrink: 0;
  margin-top: 1px;
}

/* Wiki — filter & reviews modals */
.ne-wiki-filter-desc {
  font-size: 14px;
  color: var(--ne-text-secondary);
  margin-bottom: 20px;
  line-height: 1.5;
}
.ne-wiki-filter-chips {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
}
.ne-wiki-filter-actions {
  display: flex;
  gap: 12px;
}
.ne-wiki-modal-btn {
  flex: 1;
  height: 48px;
  border-radius: 14px;
}

.ne-wiki-sync-overlay {
  position: absolute;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  animation: wikiFadeIn 0.3s ease;
  border-radius: 0 0 24px 24px;
}
.ne-wiki-sync-card {
  text-align: center;
  padding: 32px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 32px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.8);
}
.ne-wiki-sync-spinner {
  color: var(--ne-primary);
  margin-bottom: 16px;
  animation: wikiSpin 1s linear infinite;
}
.ne-wiki-sync-spinner .material-symbols-outlined { font-size: 48px; }
.ne-wiki-sync-title {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-text);
  letter-spacing: -0.5px;
}
.ne-wiki-sync-sub {
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--ne-muted);
  font-weight: 500;
}

.ne-wiki-reviews-loading-wrap { position: relative; min-height: 300px; }
.ne-wiki-reviews-loading-pill-wrap {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  pointer-events: none;
}
.ne-wiki-reviews-loading-pill {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(4px);
  padding: 8px 16px;
  border-radius: 30px;
  border: 1px solid var(--ne-border);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  gap: 8px;
}
.ne-wiki-reviews-loading-pill .sync-spinner { color: var(--ne-primary); animation: wikiSpin 1s linear infinite; }
.ne-wiki-reviews-loading-pill .material-symbols-outlined { font-size: 18px; }
.ne-wiki-reviews-loading-label { font-size: 12px; font-weight: 800; color: var(--ne-text); }

.review-item.sk-loading {
  border-bottom: 1px solid var(--ne-border);
  padding: 20px 0;
  animation-delay: var(--wiki-sk-delay, 0s);
}
.ne-wiki-sk-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
}
.ne-wiki-sk-line--40 { width: 40%; height: 14px; }
.ne-wiki-sk-line--20 { width: 20%; height: 12px; }
.ne-wiki-sk-line--90 { width: 90%; height: 16px; margin-bottom: 8px; }
.ne-wiki-sk-line--70 { width: 70%; height: 16px; margin-bottom: 16px; }
.ne-wiki-sk-chips { display: flex; gap: 8px; }
.ne-wiki-sk-pill { width: 60px; height: 24px; border-radius: 50px; }

.ne-wiki-empty-reviews {
  padding: 60px 24px;
  text-align: center;
  color: var(--ne-muted);
  animation: wikiCardIn 0.4s ease both;
}
.ne-wiki-empty-icon-wrap {
  width: 80px;
  height: 80px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.ne-wiki-empty-icon-wrap .material-symbols-outlined { font-size: 40px; opacity: 0.4; }
.ne-wiki-empty-title {
  font-size: 18px;
  color: var(--ne-text);
  margin-bottom: 8px;
  font-weight: 800;
}
.ne-wiki-empty-desc { font-size: 14px; line-height: 1.5; }

.meta-tag.crop.ne-wiki-crop-tag-sm {
  font-size: 9px;
  padding: 2px 6px;
  border-radius: 6px;
  flex-shrink: 0;
}
.meta-tag.crop.ne-wiki-crop-more {
  font-size: 9px;
  padding: 2px 6px;
  border-radius: 6px;
  flex-shrink: 0;
  cursor: pointer;
  background: rgba(var(--ne-primary-rgb), 0.1);
  color: var(--ne-primary);
}

.review-item { animation-delay: var(--wiki-review-delay, 0s); }
.ne-wiki-review-meta { margin-bottom: 10px; }
.ne-wiki-review-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  flex-wrap: wrap;
}
.ne-wiki-review-author-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  max-width: 100%;
}
.ne-wiki-review-avatar {
  width: 24px;
  height: 24px;
  background: rgba(var(--ne-primary-rgb), 0.1);
  color: var(--ne-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex-shrink: 0;
}
.review-author.ne-wiki-review-author {
  color: var(--ne-text);
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 1;
}
.ne-wiki-review-crops { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.review-date.ne-wiki-review-date { font-weight: 600; opacity: 0.5; flex-shrink: 0; }
.review-mini-ratings.ne-wiki-review-ratings { margin-bottom: 12px; }
.ne-wiki-review-meta-line {
  margin-bottom: 12px;
  font-size: 11px;
  color: var(--ne-muted);
  line-height: 1.45;
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}
.ne-wiki-review-meta-sep { opacity: 0.2; margin: 0 2px; }
.review-text.ne-wiki-review-text {
  font-size: 15px;
  color: var(--ne-text);
  line-height: 1.55;
  margin-bottom: 8px;
}
.ne-wiki-review-trans {
  display: none;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.55;
  color: #374151;
  padding: 8px 10px;
  background: #EFF6FF;
  border-radius: 8px;
  font-style: italic;
}
.ne-wiki-review-trans.is-visible { display: block; animation: fadeUpWrv .25s ease both; }
.translate-btn.ne-wiki-translate-btn {
  background: none;
  border: none;
  color: #9CA3AF;
  font-size: 12px;
  font-weight: 500;
  padding: 0 0 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: color 0.15s;
}
.translate-btn.ne-wiki-translate-btn:hover { color: #6366f1; text-decoration: underline; }
.translate-btn.ne-wiki-translate-btn .material-symbols-outlined { font-size: 14px; }
.ne-wiki-review-reactions { display: flex; gap: 8px; margin-bottom: 4px; align-items: center; }
.ne-wiki-rxn-up,
.ne-wiki-rxn-down {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 12px;
  border: none;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.ne-wiki-rxn-up {
  background: rgba(var(--ne-primary-rgb), 0.06);
  color: var(--ne-primary);
}
.ne-wiki-rxn-down {
  justify-content: center;
  gap: 4px;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.04);
  color: var(--ne-muted);
}
.ne-wiki-rxn-up .material-symbols-outlined,
.ne-wiki-rxn-down .material-symbols-outlined { font-size: 16px; }
.ne-wiki-rxn-cnt { opacity: 0.6; font-size: 11px; margin-left: 2px; }
.ne-wiki-rxn-down .ne-wiki-rxn-cnt { margin-left: 0; }
.ne-wiki-review-amenities {
  margin-top: 10px;
  font-size: 11px;
  color: var(--ne-muted);
  line-height: 1.45;
  background: rgba(0, 0, 0, 0.02);
  padding: 8px 12px;
  border-radius: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ne-wiki-reviews-header-main { flex: 1; min-width: 0; padding-right: 12px; }
.ne-wiki-reviews-farm-name {
  font-size: 12px;
  color: var(--ne-muted);
  margin-top: 3px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ne-wiki-reviews-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.rating-badge.ne-wiki-reviews-rating {
  min-width: 44px;
  height: 44px;
  font-size: 16px;
  border-radius: 12px;
}
.ne-wiki-reviews-sync .material-symbols-outlined { font-size: 20px; }
.ne-wiki-reviews-sync { color: var(--ne-primary); animation: wikiSpin 1.2s linear infinite; }
.modal-close .material-symbols-outlined { font-size: 22px; }
.ne-wiki-modal-body {
  position: relative;
  min-height: 300px;
  overflow-y: auto;
}
.ne-wiki-modal-body--lock { overflow-y: hidden; }
.ne-wiki-reviews-footer {
  padding: 16px 20px 28px;
  border-top: 1px solid var(--ne-border);
  flex-shrink: 0;
  background: var(--ne-surface-solid);
  z-index: 11;
  border-bottom-left-radius: 24px;
  border-bottom-right-radius: 24px;
}
.ne-wiki-reviews-add-btn {
  background: var(--ne-primary) !important;
  color: #fff !important;
  border: none;
  width: 100%;
  height: 52px;
  border-radius: 16px;
  font-weight: 800;
  box-shadow: 0 6px 20px rgba(var(--ne-primary-rgb), 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.ne-wiki-reviews-add-btn .material-symbols-outlined { font-size: 20px; }
.ne-wiki-reviews-add-btn span { line-height: 1; }

.ne-wiki-trans-label{font-size:10px;font-weight:800;color:var(--ne-primary);display:block;margin-bottom:4px;text-transform:uppercase;letter-spacing:.8px;opacity:.8}
.ne-wiki-trans-text{display:block;}

/* Wiki — add-review form, feed, job modal, dropdown */
@keyframes neSpin { to { transform: rotate(360deg); } }

.zoir-dropdown-item .ne-wiki-dd-check { font-size: 16px; }
.zoir-dropdown-trigger .ne-wiki-dd-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ne-wiki-form-identity { margin-bottom: 16px; padding: 16px; }
.ne-wiki-form-identity-header {
  margin-bottom: 12px;
  color: var(--ne-primary);
  font-family: 'Lora', serif;
  font-size: 14px;
}
.ne-wiki-identity-toggle { display: flex; gap: 10px; margin-bottom: 12px; }
.ne-wiki-identity-btn {
  flex: 1;
  height: 42px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 700;
  transition: all 0.2s;
}
.ne-wiki-reviewer-name-input {
  height: 42px;
  padding: 0 14px;
  font-size: 14px;
  margin-bottom: 0;
}
#wiki-work-hint.ne-wiki-work-hint {
  font-size: 11px;
  color: var(--ne-muted);
  margin-top: 4px;
  font-weight: 500;
}
#wiki-earnings-section.review-form-row {
  animation: wikiCardIn 0.35s ease;
}
#wiki-earnings-section.is-hidden { display: none !important; }

.ne-wiki-form-card--new {
  background: #f9f9f8;
  padding: 16px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: none;
}
.ne-wiki-form-label--primary {
  color: var(--ne-primary);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  font-weight: 800;
  font-family: 'Lora', serif;
}
.ne-wiki-field-label {
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  display: block;
  margin-bottom: 6px;
}
.ne-wiki-field-input {
  height: 40px;
  padding: 0 14px;
  font-size: 14px;
}
.ne-wiki-field-input--mb { margin-bottom: 14px; }
.review-textarea.is-invalid,
.ne-wiki-field-input.is-invalid { border-color: var(--ne-amber) !important; }

.ne-wiki-form-card--warn {
  background: rgba(255, 107, 53, 0.05);
  padding: 16px;
  border: 1px solid rgba(255, 107, 53, 0.12);
  box-shadow: none;
}
.ne-wiki-form-label--warn {
  color: var(--ne-amber-text);
  margin-bottom: 6px;
  display: block;
}
.ne-wiki-warn-hint {
  font-size: 12px;
  color: #64748b;
  display: block;
  margin-bottom: 10px;
  font-weight: 500;
}

.review-form-row.ne-wiki-work-row { align-items: flex-start; }
.review-form-row.ne-wiki-work-row .review-form-label { padding-top: 4px; }
.review-input-wrap.ne-wiki-work-wrap {
  flex-direction: column;
  align-items: flex-end;
}

.ne-wiki-comment-card { padding: 10px 14px; margin-bottom: 8px; }
.ne-wiki-comment-card .review-form-label {
  display: block;
  margin-bottom: 8px;
}
#wiki-review-text.ne-wiki-comment-text { min-height: 90px; }

.ne-wiki-submit-btn {
  background: var(--ne-primary) !important;
  color: #fff !important;
  border: none;
  width: 100%;
  height: 46px;
  border-radius: 12px;
  font-weight: 800;
  box-shadow: 0 6px 16px rgba(var(--ne-primary-rgb), 0.2);
}
.ne-wiki-submit-btn .material-symbols-outlined { font-size: 20px; }
.ne-wiki-submit-btn .ne-wiki-submit-spin {
  animation: neSpin 1s linear infinite;
  font-size: 20px;
}
#wiki-submit-warning.ne-wiki-submit-warning {
  text-align: center;
  font-size: 12px;
  color: var(--ne-amber-text);
  margin-top: 12px;
  font-weight: 600;
}
.ne-wiki-form-spacer { height: 36px; }

.wiki-ad-item.ne-wiki-promo {
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-primary-active) 100%) !important;
  color: #fff;
  padding: 11px 14px !important;
  border-radius: 14px !important;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-head {
  margin-bottom: 8px;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-logo {
  height: 12px;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-body {
  margin-bottom: 8px;
  align-items: center;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-icon-wrap {
  width: 32px;
  height: 32px;
  border-radius: 8px;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-icon-wrap img {
  width: 18px;
  height: 18px;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-desc {
  display: none;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-title {
  font-size: 13px;
  margin-bottom: 0;
}
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-btn {
  height: 32px;
  font-size: 13px;
  border-radius: 9px !important;
}

.ne-wiki-empty-feed { padding: 60px 20px; }

.feed-card { animation-delay: var(--wiki-feed-delay, 0s); cursor: pointer; }
.ne-wiki-feed-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.ne-wiki-feed-farm-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ne-wiki-feed-crop-icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  background: var(--ne-amber-soft, rgba(255, 107, 53, 0.12));
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.ne-wiki-feed-farm-meta { min-width: 0; }
.feed-farm-name.ne-wiki-feed-farm-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.feed-author-meta .material-symbols-outlined { font-size: 12px; color: var(--ne-primary); }
.rating-badge.ne-wiki-feed-rating {
  font-size: 13px;
  height: 44px;
  min-height: 44px;
  padding: 0 12px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.03);
  display: flex;
  align-items: center;
  justify-content: center;
}
.feed-stat-row.ne-wiki-feed-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  margin: 12px 0 14px;
  flex-wrap: nowrap;
}
.ne-wiki-feed-chips-left,
.ne-wiki-feed-chips-right {
  display: flex;
  align-items: center;
  gap: 4px;
}
.ne-wiki-feed-chips-right { flex-shrink: 0; }
.ne-wiki-feed-pill {
  background: rgba(var(--ne-primary-rgb), 0.05);
  color: var(--ne-primary);
  font-size: 11px;
  font-weight: 800;
  padding: 4px 8px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.ne-wiki-feed-pill .material-symbols-outlined { font-size: 13px; }
.ne-wiki-feed-pill--earn {
  background: var(--ne-amber-soft, rgba(255, 107, 53, 0.12));
  color: var(--ne-amber-text);
}
.ne-wiki-feed-author-name {
  font-family: 'Inter', system-ui, sans-serif;
  font-style: normal;
  font-weight: 800;
  color: var(--ne-text);
}
.ne-wiki-feed-review-body { color: var(--ne-text-secondary); }
.ne-wiki-feed-no-text { opacity: 0.4; }
.ne-wiki-feed-trans {
  display: none;
  font-family: 'Lora', serif;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ne-text);
  margin: -8px 0 12px;
  padding: 8px;
  background: rgba(var(--ne-primary-rgb), 0.03);
  border-radius: 10px;
  border-left: 3px solid var(--ne-primary);
  font-style: italic;
}
.ne-wiki-feed-trans.is-visible { display: block; }
.translate-btn.ne-wiki-feed-translate {
  background: none;
  border: none;
  color: #9CA3AF;
  font-size: 12px;
  font-weight: 500;
  padding: 0 0 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: -8px;
  transition: color 0.15s;
}
.translate-btn.ne-wiki-feed-translate:hover { color: #6366f1; text-decoration: underline; }
.translate-btn.ne-wiki-feed-translate .material-symbols-outlined { font-size: 14px; }
.feed-bottom-row.ne-wiki-feed-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed rgba(0, 0, 0, 0.05);
}
.ne-wiki-feed-details-link {
  font-size: 11px;
  font-weight: 800;
  color: var(--ne-primary);
  display: flex;
  align-items: center;
  gap: 4px;
}
.ne-wiki-feed-details-link .material-symbols-outlined { font-size: 14px; }
.ne-wiki-feed-list {
  padding-bottom: 30px;
  background: rgba(0, 0, 0, 0.01);
  position: relative;
}

.wiki-modal-sheet.ne-wiki-job-sheet { padding: 0; overflow: visible; }
.ne-wiki-job-handle {
  background: rgba(255, 255, 255, 0.6);
  z-index: 10;
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
}
.ne-wiki-job-hero {
  position: relative;
  width: 100%;
  height: 180px;
  background-image: var(--wiki-job-hero-img);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  flex-shrink: 0;
}
.ne-wiki-job-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
}
.ne-wiki-job-hero-content {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
}
.job-hiring-badge.ne-wiki-job-badge {
  background: #4caf50;
  color: #fff;
  border: none;
  margin-bottom: 8px;
}
.ne-wiki-job-hero-title {
  margin: 0;
  color: #fff;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.5px;
  line-height: 1.2;
}
.ne-wiki-job-close {
  position: absolute;
  top: 16px;
  right: 16px;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  border: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.ne-wiki-job-close .material-symbols-outlined { font-size: 20px; }
.ne-wiki-job-body { padding: 24px; }
.ne-wiki-job-head-block { margin-bottom: 24px; }
.ne-wiki-job-title {
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-text);
  margin-bottom: 4px;
  font-family: 'Lora', serif;
}
.ne-wiki-job-employer {
  font-size: 15px;
  font-weight: 600;
  color: var(--ne-text-secondary);
}
.ne-wiki-job-location {
  font-size: 14px;
  color: var(--ne-muted);
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
}
.ne-wiki-job-location .material-symbols-outlined { font-size: 16px; }
.vacancy-grid.ne-wiki-vacancy-grid { margin-top: 0; }
.vacancy-stat.ne-wiki-vacancy-stat {
  background: rgba(var(--ne-primary-rgb), 0.03);
  border: none;
}
.vacancy-stat .v-value.ne-wiki-v-closing { color: var(--ne-amber-text); }
.vacancy-stat .v-value.ne-wiki-v-crop { color: var(--ne-primary); }
.ne-wiki-job-desc {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ne-text);
  margin-bottom: 30px;
  white-space: pre-wrap;
}
.ne-wiki-job-hint-box {
  background: var(--ne-surface-solid);
  border-radius: 12px;
  padding: 18px;
  border: 1px solid var(--ne-border);
  border-left: 5px solid var(--ne-primary);
  margin-bottom: 20px;
}
.ne-wiki-job-hint-box p {
  margin: 0;
  font-size: 13px;
  color: var(--ne-text-secondary);
  font-weight: 500;
  line-height: 1.5;
}
.ne-wiki-job-review-btn {
  width: 100%;
  height: 50px;
  border-radius: 14px;
  font-weight: 800;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--ne-primary);
  color: #fff;
  border: none;
  box-shadow: 0 4px 15px rgba(var(--ne-primary-rgb), 0.2);
}
.ne-wiki-job-review-btn .material-symbols-outlined { font-size: 20px; }

/* Wiki — skeletons, loading, empty, map (phase 5d) */
.wiki-skeleton-card {
  animation: wikiCardIn 0.4s ease both;
  animation-delay: var(--wiki-sk-card-delay, 0s);
}
.ne-wiki-sk-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}
.sk.sk-h.ne-wiki-sk-title { width: var(--sk-w, 60%); margin-bottom: 0; }
.sk.sk-tag.ne-wiki-sk-postcode { width: 72px; height: 22px; flex-shrink: 0; }
.ne-wiki-sk-crops { display: flex; gap: 6px; margin-bottom: 16px; }
.sk.sk-tag.ne-wiki-sk-crop--72 { width: 72px; }
.sk.sk-tag.ne-wiki-sk-crop--58 { width: 58px; }
.sk.sk-tag.ne-wiki-sk-crop--50 { width: 50px; }
.ne-wiki-sk-divider {
  height: 1px;
  background: rgba(0, 0, 0, 0.05);
  margin-bottom: 14px;
}
.ne-wiki-sk-stats {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}
.ne-wiki-sk-stat-chips { display: flex; gap: 8px; }
.sk.ne-wiki-sk-stat { width: 44px; height: 22px; border-radius: 6px; }
.ne-wiki-sk-actions { display: flex; gap: 8px; }
.sk.ne-wiki-sk-btn { height: 38px; flex: 1; border-radius: 10px; }

.ne-wiki-empty-error .material-symbols-outlined {
  font-size: 56px;
  color: var(--ne-amber-text);
  margin-bottom: 20px;
}
.ne-wiki-empty-error p {
  font-weight: 800;
  font-size: 18px;
  color: var(--ne-text);
}
.ne-wiki-empty-retry { margin-top: 16px; }

/* ── Offline / Error screen ────────────────────────────────────────── */
.ne-offline-screen {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 32px 40px;
  text-align: center;
  animation: ne-fade-in 0.4s ease both;
}
.ne-offline-icon-wrap {
  position: relative;
  width: 96px;
  height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 28px;
}
.ne-offline-icon {
  font-size: 48px;
  color: #94a3b8;
  font-variation-settings: 'FILL' 0, 'wght' 300;
  position: relative;
  z-index: 1;
}
.ne-offline-pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(148, 163, 184, 0.12);
  animation: ne-offline-pulse 2s ease-in-out infinite;
}
@keyframes ne-offline-pulse {
  0%, 100% { transform: scale(1);   opacity: 1; }
  50%       { transform: scale(1.2); opacity: 0.4; }
}
.ne-offline-title {
  font-size: 20px;
  font-weight: 800;
  color: #1e293b;
  margin: 0 0 8px;
  line-height: 1.3;
}
.ne-offline-desc {
  font-size: 14px;
  color: #94a3b8;
  margin: 0 0 32px;
  line-height: 1.5;
}
.ne-offline-retry-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  border-radius: 14px;
  border: none;
  background: #1a73e8;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(26, 115, 232, 0.35);
  transition: transform 0.2s var(--ne-ease-spring), box-shadow 0.2s;
}
.ne-offline-retry-btn .material-symbols-outlined { font-size: 20px; }
.ne-offline-retry-btn:active {
  transform: scale(0.96);
  box-shadow: 0 2px 8px rgba(26, 115, 232, 0.2);
}
.ne-wiki-empty-feed-error {
  padding: 40px 20px;
}
.ne-wiki-empty-feed-error .material-symbols-outlined {
  color: var(--ne-amber-text);
  font-size: 48px;
  margin-bottom: 12px;
}
.ne-wiki-empty-feed-error p { font-weight: 700; }
.ne-wiki-empty-feed-retry {
  padding: 10px 24px;
  margin-top: 16px;
}

.ne-wiki-load-status {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(var(--ne-primary-rgb), 0.07);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.12);
  border-radius: 12px;
  padding: 10px 14px;
  margin-bottom: 16px;
  animation: wikiCardIn 0.3s ease both;
}
.ne-wiki-load-spinner {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2.5px solid var(--ne-primary);
  border-top-color: transparent;
  animation: wikiSpin 0.8s linear infinite;
  flex-shrink: 0;
}
.ne-wiki-load-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-primary);
}
.ne-wiki-load-dots {
  margin-left: auto;
  display: flex;
  gap: 3px;
  align-items: center;
}
.ne-wiki-load-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ne-primary);
  opacity: 0.4;
  animation: sk-shimmer 1.4s ease-in-out infinite;
}
.ne-wiki-load-dot:nth-child(2) { animation-delay: 0.2s; }
.ne-wiki-load-dot:nth-child(3) { animation-delay: 0.4s; }

.ne-wiki-feed-loading-wrap {
  position: relative;
  min-height: 80vh;
}
.ne-wiki-feed-sync-fixed {
  position: fixed;
  inset: 0;
  top: 130px;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  animation: wikiFadeIn 0.3s ease;
}
.wiki-skeleton-card.ne-wiki-feed-sk {
  margin-bottom: 16px;
  opacity: 0.3;
}
.wiki-skeleton-card.ne-wiki-feed-sk .sk.sk-h { width: 60%; }
.wiki-skeleton-card.ne-wiki-feed-sk .sk.sk-row { height: 40px; }

.ne-wiki-trans-spin {
  animation: neSpin 1s linear infinite;
  width: 12px;
  height: 12px;
  border: 2px solid var(--ne-primary);
  border-top-color: transparent;
  border-radius: 50%;
  display: inline-block;
}
.ne-wiki-submit-spin-icon { animation: neSpin 1s linear infinite; }
.ne-wiki-review-zero-inline { opacity: 0.4; font-size: 11px; margin-left: 2px; }

/* Map view — moved from WikiModule inline <style> */
.wiki-map-container {
  height: calc(100vh - 240px);
  width: 100%;
  border-radius: 32px;
  margin: 0;
  overflow: hidden;
  clip-path: inset(0 round 32px);
  filter: drop-shadow(0 4px 16px rgba(0,0,0,0.13));
}
#wiki-leaflet-container { height: 100%; width: 100%; }
.farm-marker-v3 { will-change: transform; }
.farm-marker-wrapper { filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2)); position: relative; }
.farm-marker-wrapper:active .farm-marker-v3 {
  transform: scale(1.1);
  transition: transform 0.1s ease-out;
}
.hiring-pulse-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 44px;
  height: 44px;
  border: 2px solid #ff5722;
  border-radius: 50%;
  animation: mapPulse 2s infinite ease-out;
  pointer-events: none;
}
@keyframes mapPulse {
  0% { transform: translate(-50%, -50%) scale(0.6); opacity: 0.8; }
  100% { transform: translate(-50%, -50%) scale(1.4); opacity: 0; }
}
.wiki-map-promo-static {
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-primary-active) 100%);
  border-radius: 0;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0;
  box-shadow: 0 10px 25px rgba(var(--ne-primary-rgb), 0.1);
  animation: wikiCardIn 0.5s ease both;
  cursor: pointer;
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  flex-shrink: 0;
}
.wiki-map-promo-static:active { transform: scale(0.98); }
.leaflet-control-attribution { display: none !important; }

/* Zoom controls */
.leaflet-bar {
  box-shadow: none !important;
  border: none !important;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.leaflet-bar a,
.leaflet-bar a:hover {
  width: 36px !important;
  height: 36px !important;
  line-height: 36px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  background: rgba(255,255,255,0.92) !important;
  color: #374151 !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}
.leaflet-bar a:first-child,
.leaflet-bar a:last-child {
  border-radius: 12px !important;
}
.leaflet-bar a:active { transform: scale(0.92); }

/* Map crop filter chips */
.ne-wiki-map-filters {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px 6px;
  overflow-x: auto;
  flex-shrink: 0;
  background: #F2F2F7;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ne-wiki-map-filters::-webkit-scrollbar { display: none; }
.ne-wiki-map-filters__spacer { flex: 1 1 auto; min-width: 4px; }
.ne-wiki-map-compose-btn {
  flex-shrink: 0; gap: 6px; border-radius: 20px;
  height: 36px; padding: 0 16px; font-size: 13px; font-weight: 500;
  background: #fff !important; color: #374151 !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.10) !important;
}
.ne-wiki-map-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  border-radius: 20px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  color: #374151;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0,0,0,0.10);
  transition: background 0.15s, color 0.15s, transform 0.1s;
  -webkit-tap-highlight-color: transparent;
}
.ne-wiki-map-filter-chip.active {
  background: #2563EB;
  color: #fff;
}
.ne-wiki-map-filter-chip:active { transform: scale(0.95); }

#wiki-map-root.ne-wiki-map-root {
  padding: 0;
  margin-top: 0;
  height: calc(100vh - 205px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
  background: #F2F2F7;
}
.wiki-map-container.ne-wiki-map-container {
  border-radius: 32px;
  box-shadow: none;
  flex: 1;
  min-height: 0;
  width: auto;
  margin: 0 12px 12px;
  position: relative;
}
.wiki-map-container.ne-wiki-map-container::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 5px solid rgba(255,255,255,0.85);
  border-radius: 32px;
  pointer-events: none;
  z-index: 1000;
}
#wiki-leaflet-container.ne-wiki-leaflet-fill { height: 100%; }

/* ── Map filter chip extras ── */
.ne-wiki-mcf-arr { font-size: 10px; opacity: 0.7; margin-left: 2px; }
.ne-wiki-mcf-x {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; border-radius: 50%;
  background: rgba(255,255,255,0.35); font-size: 10px; font-weight: 700;
  margin-left: 4px; vertical-align: middle; cursor: pointer;
}
.ne-wiki-map-filter-chip.has-specific { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }

/* ── Map crop filter dropdown ── */
.ne-wiki-mcf-dropdown {
  position: relative;
}
.ne-wiki-mcf-popup {
  display: none;
  position: fixed;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.13), 0 1px 4px rgba(0,0,0,0.07);
  border: 1px solid #E5E7EB;
  z-index: 9000;
  min-width: 190px;
  padding: 5px;
  flex-direction: column;
}
.ne-wiki-mcf-dropdown.open .ne-wiki-mcf-popup {
  display: flex;
}
.ne-wiki-mcf-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  border-radius: 10px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.ne-wiki-mcf-item:hover { background: #F3F4F6; }
.ne-wiki-mcf-item.active {
  background: #EFF6FF;
  color: #1e40af;
  font-weight: 600;
}

.ne-wiki-map-promo-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.ne-wiki-map-promo-icon {
  background: #fff;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.ne-wiki-map-promo-icon img { width: 20px; height: 20px; }
.ne-wiki-map-promo-text { min-width: 0; }
.ne-wiki-map-promo-title {
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}
.ne-wiki-map-promo-sub {
  color: rgba(255, 255, 255, 0.85);
  font-size: 10px;
  font-weight: 500;
}
/* Compact rate line inside the slim map promo bar */
.ne-wiki-map-promo-text .ne-wiki-promo-rate {
  margin: 4px 0 0;
  padding: 2px 8px;
  font-size: 11px;
}
.ne-wiki-map-promo-text .ne-wiki-promo-rate__flag { font-size: 12px; }
.ne-wiki-map-promo-cta {
  background: #fff;
  color: var(--ne-primary);
  padding: 6px 14px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 800;
  flex-shrink: 0;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.farm-marker-v3 {
  width: 32px;
  height: 32px;
  background: var(--fm-bg, #e1f5fe);
  backdrop-filter: var(--fm-blur, none);
  -webkit-backdrop-filter: var(--fm-blur, none);
  border-radius: 50% 50% 50% 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  transform: rotate(-45deg);
  border: 2px solid var(--fm-border, var(--ne-primary));
}
.farm-marker-v3 .ne-wiki-marker-emoji {
  transform: rotate(45deg);
  font-size: 16px;
}

.ne-wiki-map-popup {
  font-family: inherit;
  width: 160px;
  padding: 4px;
}
.ne-wiki-map-hiring-badge {
  background: #ff5722;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
  margin-bottom: 4px;
  display: inline-block;
  animation: hiringPulse 1.5s infinite;
}
.ne-wiki-map-popup-name {
  font-weight: 800;
  font-size: 15px;
  margin-bottom: 4px;
  line-height: 1.2;
}
.ne-wiki-map-popup-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.farm-rating-pill.ne-wiki-map-rating { padding: 2px 6px; font-size: 11px; }
.ne-wiki-map-postcode { font-size: 11px; color: #888; }
.ne-wiki-map-vacancy {
  font-size: 11px;
  color: #e65100;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 8px;
  border-left: 2px solid #ff5722;
  padding-left: 6px;
}
.ne-wiki-map-popup-actions { display: flex; gap: 6px; }
.ne-wiki-map-btn-reviews {
  flex: 1;
  padding: 7px 4px;
  background: #f5f5f5;
  color: #333;
  border: none;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ne-wiki-map-btn-review {
  flex: 1;
  padding: 7px 4px;
  background: var(--ne-primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.ne-wiki-map-btn-review .material-symbols-outlined { font-size: 12px; }
.ne-wiki-map-review-badge {
  background: var(--ne-amber);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  min-width: 14px;
  height: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  margin-left: 4px;
  margin-top: -1px;
}
.ne-wiki-map-review-zero { opacity: 0.4; font-size: 9px; margin-left: 3px; }

.update-dot.ne-wiki-update-dot {
  width: 8px;
  height: 8px;
  background: var(--ne-amber);
  border-radius: 50%;
  display: inline-block;
  margin-left: 5px;
  box-shadow: 0 0 5px var(--ne-amber);
}

/* Menu — settings row icon tints (Phase 4) */
.ne-menu-srow__icon.ne-menu-icon--lang { background: #f3e8ff; color: #9333ea; }
.ne-menu-srow__icon.ne-menu-icon--region { background: #e0f7fa; color: #0891b2; }
.ne-menu-srow__icon.ne-menu-icon--doc { background: #fff7ed; color: #f97316; }
.ne-menu-srow__icon.ne-menu-icon--farm { background: #e8f0fe; color: #1a73e8; }
.ne-menu-srow__icon.ne-menu-icon--pay { background: #e6f4ea; color: #137333; }
.ne-menu-settings-link .material-symbols-outlined:first-child { font-size: 18px; }
.ne-menu-settings-link .material-symbols-outlined:last-child {
  font-size: 16px;
  margin-left: auto;
}
.ne-list-row__icon.ne-menu-nav__icon {
  background:
    radial-gradient(circle at 76% 14%, rgba(255, 255, 255, 0.2) 0 0, transparent 34%),
    var(--menu-item-gradient, var(--ne-primary));
  filter: saturate(0.9);
}

/* Wiki — toast, FAB, body lock, search clear (phase 5e) */
@keyframes neToastIn {
  from { opacity: 0; transform: translateX(-50%) translateY(20px); }
  to { opacity: 1; transform: translateX(-50%) translateY(0); }
}
.ne-wiki-toast {
  position: fixed;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--ne-text);
  color: var(--ne-surface-solid);
  padding: 10px 20px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  z-index: 9999;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
  animation: neToastIn 0.3s ease;
}
.fab-top.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.fab-top:not(.is-visible) {
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
}
.wiki-search-clear[hidden] { display: none !important; }
body.ne-body-lock {
  overflow: hidden;
  height: 100vh;
  position: fixed;
  width: 100%;
}

/* English — course grid NE cleanup (phase 7b) */
.ne-english .course-view-header.is-hidden { display: none !important; }
.ne-english .course-badge.ne-eng-maint-badge {
  background: #fff1f0;
  color: #cf1322;
  margin-left: 8px;
}
.ne-english .course-icon .material-symbols-outlined { font-size: 18px; }
.ne-english .course-footer .ne-eng-course-arrow {
  color: var(--course-color, var(--ne-primary));
  font-size: 18px;
}

/* Wiki — JS-driven states (phase 5f) */
.ne-rxn-pulse {
  transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transform: scale(1.1);
}
.translate-btn.is-loading,
.ne-wiki-translate-btn.is-loading {
  pointer-events: none;
  opacity: 0.7;
}
.wiki-modal-overlay.ne-modal-no-anim,
.wiki-modal-overlay.ne-modal-no-anim .wiki-modal-sheet {
  animation: none !important;
}

/* Settings — panels & rows (phase 3a) */
.ne-settings-head { padding: 8px 0 12px; }
.ne-settings-progress__fill { width: var(--progress-width, 0%); }
.ne-settings-panel {
  background: #fff;
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  margin-bottom: 16px;
  border: 1px solid var(--ne-border);
  box-shadow: var(--ne-shadow-card);
}
.ne-settings-panel__head {
  padding: 10px 16px;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  color: #94a3b8;
  border-bottom: 1px solid #f1f5f9;
}
.ne-settings-item--last { border-bottom: none !important; }
.ne-settings-item__label {
  font-size: 12px;
  font-weight: 700;
}
.s-icon-small.ne-settings-icon--lang { background: #f3e8ff; color: #9333ea; }
.s-icon-small.ne-settings-icon--region { background: #f0fafb; color: #0891b2; }
.s-icon-small.ne-settings-icon--doc { background: #fff7ed; color: #f97316; }
.s-icon-small.ne-settings-icon--farm { background: #f0f9ff; color: #0ea5e9; }
.s-icon-small.ne-settings-icon--pay { background: #f0fdf4; color: #22c55e; }
.s-icon-small.ne-settings-icon--date { background: #fff1f2; color: #e11d48; }
.s-icon-small.ne-settings-icon--payments { background: #fff7ed; color: #f97316; }
.s-icon-small.ne-settings-icon--holiday { background: #fefce8; color: #ca8a04; }
.ne-settings-input--w60 { width: 60px; }
.ne-settings-input--w85 { width: 85px; }
.ne-settings-input--w120 { width: 120px; }
.ne-settings-input--w140 { width: 140px; text-align: center; }
.ne-settings-input--center {
  border: none;
  background: transparent;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-primary);
  width: 100%;
  text-align: center;
  outline: none;
  padding: 6px 0;
}
.ne-settings-pct-suffix {
  font-size: 12px;
  font-weight: 800;
  color: #cbd5e1;
}
.ne-settings-holiday-wrap {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 0 8px;
  width: 85px;
  position: relative;
}
.ne-btn.ne-settings-finance-cta { margin-top: 24px; }

/* Settings — holiday preview, tax chips, support (phase 3b) */
.ne-settings-holiday-preview {
  margin: 0 16px 16px;
  background: #fdfcfb;
  border: 1px dashed #e2e8f0;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02);
}
.ne-settings-holiday-preview__col { display: flex; flex-direction: column; gap: 4px; }
.ne-settings-holiday-preview__label {
  font-size: 9px;
  font-weight: 800;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.ne-settings-holiday-preview__row { display: flex; align-items: baseline; gap: 6px; }
.ne-settings-holiday-preview__amount {
  font-family: 'Lora', serif;
  font-size: 24px;
  font-weight: 800;
  color: #1e293b;
}
.ne-settings-holiday-preview__pct {
  background: #ecfdf5;
  color: #059669;
  font-size: 9px;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 8px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.ne-settings-holiday-preview__icon {
  width: 44px;
  height: 44px;
  background: #fefce8;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ne-settings-holiday-preview__icon .material-symbols-outlined {
  color: #ca8a04;
  font-size: 24px;
}
.ne-settings-chip--green { color: #166534; background: #f0fdf4; border: none; }
.ne-settings-chip--blue { background: #eff6ff; border: none; }
.ne-settings-chip--amber { background: #fefce8; border: none; }
.ne-settings-chip--rose { background: #fff1f2; border: none; }
.s-icon-small.ne-settings-icon--tax-green { background: #f0fdf4; color: #166534; }
.s-icon-small.ne-settings-icon--tax-blue { background: #eff6ff; color: #2563eb; }
.s-icon-small.ne-settings-icon--tax-amber { background: #fefce8; color: #ca8a04; }
.s-icon-small.ne-settings-icon--tax-rose { background: #fff1f2; color: #e11d48; }
.s-icon-small.ne-settings-icon--link { background: #f8fafc; color: #64748b; }
.s-icon-small.ne-settings-icon--sick { background: #fff1f2; color: #e11d48; }
.s-icon-small.ne-settings-icon--days { background: #f0f9ff; color: #0369a1; }
.s-icon-small.ne-settings-icon--pension { background: #f1f5f9; color: #475569; }
.ne-settings-external-icon { font-size: 16px; color: #cbd5e1; }
.ne-settings-item--click { cursor: pointer; }
.ne-settings-list--pad { padding-top: 8px; }
.ne-settings-support-card {
  margin: 0 16px 16px;
  border-radius: 16px;
  padding: 12px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: transform 0.2s;
}
.ne-settings-support-card:active { transform: scale(0.97); }
.ne-settings-support-card--uzb {
  margin: 8px 16px 16px;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border: 1px solid #bae6fd;
}
.ne-settings-support-card--rus {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
  border: 1px solid #bbf7d0;
}
.ne-settings-support-card--ads {
  background: linear-gradient(135deg, #fffbf0 0%, #fef3c7 100%);
  border: 1px solid #fde68a;
}
.ne-settings-support-card__left { display: flex; align-items: center; gap: 12px; }
.ne-settings-support-card__icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ne-settings-support-card--uzb .ne-settings-support-card__icon {
  background: linear-gradient(135deg, #229ED9 0%, #2AABEE 100%);
  box-shadow: 0 4px 12px rgba(34, 158, 217, 0.3);
}
.ne-settings-support-card--uzb .ne-settings-support-card__icon .material-symbols-outlined {
  color: #fff;
  font-size: 22px;
  transform: rotate(-10deg) translateX(2px);
}
.ne-settings-support-card--rus .ne-settings-support-card__icon {
  background: linear-gradient(135deg, #10b981 0%, #34d399 100%);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}
.ne-settings-support-card--rus .ne-settings-support-card__icon .material-symbols-outlined {
  color: #fff;
  font-size: 22px;
}
.ne-settings-support-card--ads .ne-settings-support-card__icon {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.3);
}
.ne-settings-support-card--ads .ne-settings-support-card__icon .material-symbols-outlined {
  color: #fff;
  font-size: 22px;
}
.ne-settings-support-card__text { display: flex; flex-direction: column; }
.ne-settings-support-card--uzb .ne-settings-support-card__title { font-size: 13px; font-weight: 800; color: #0369a1; }
.ne-settings-support-card--uzb .ne-settings-support-card__sub { font-size: 9px; font-weight: 700; color: #0ea5e9; text-transform: uppercase; letter-spacing: 0.1em; }
.ne-settings-support-card--rus .ne-settings-support-card__title { font-size: 13px; font-weight: 800; color: #065f46; }
.ne-settings-support-card--rus .ne-settings-support-card__sub { font-size: 9px; font-weight: 700; color: #10b981; text-transform: uppercase; letter-spacing: 0.1em; }
.ne-settings-support-card--ads .ne-settings-support-card__title { font-size: 13px; font-weight: 800; color: #92400e; }
.ne-settings-support-card--ads .ne-settings-support-card__sub { font-size: 9px; font-weight: 700; color: #b45309; text-transform: uppercase; letter-spacing: 0.1em; }
.ne-settings-support-card__action {
  background: #fff;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.ne-settings-support-card--uzb .ne-settings-support-card__action .material-symbols-outlined { color: #0ea5e9; font-size: 18px; }
.ne-settings-support-card--rus .ne-settings-support-card__action .material-symbols-outlined { color: #10b981; font-size: 18px; }
.ne-settings-support-card--ads .ne-settings-support-card__action .material-symbols-outlined { color: #d97706; font-size: 18px; }
.s-icon-small.ne-settings-icon--notify-jobs { background: #eff6ff; color: #3b82f6; }
.s-icon-small.ne-settings-icon--notify-reviews { background: #fefce8; color: #eab308; }
.ne-settings-input--w90 { width: 90px; }
.ne-settings-notify-pad { padding: 16px; }
.ne-settings-notify-tip {
  background: #fffbeb;
  border-radius: 8px;
  padding: 12px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid #fde68a;
}
.ne-settings-notify-tip__icon { color: #d97706; font-size: 20px; flex-shrink: 0; }
.ne-settings-notify-tip__text {
  margin: 0 0 8px;
  font-size: 13px;
  color: #92400e;
  font-weight: 500;
  line-height: 1.4;
}
.ne-settings-notify-tip__btn {
  background: #229ED9;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
}
.ne-settings-notify-tip__btn .material-symbols-outlined { font-size: 16px; }

.finance-card.ne-settings-panel--mb20{margin-bottom:20px}
.s-icon-small.ne-settings-icon--danger { background: #fee2e2; color: #ef4444; }
.ne-settings-item__label--danger { color: #ef4444; font-weight: 700; }
.ne-settings-version { font-size: 12px; font-weight: 700; color: #94a3b8; }


/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 4 — Shared form rows (Settings + Finance)
   Replaces: .finance-card, .settings-list, .settings-item-small,
             .settings-item-left, .settings-item-right-small, .s-icon-small
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* finance-card в†’ ne-card alias (keeps old HTML working during migration) */
.finance-card {
  margin: 12px 16px;
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 20px;
  border: 1px solid var(--ne-line);
  box-shadow: var(--ne-shadow-card);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* в”Ђв”Ђ Form row list в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-form-list,
.settings-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ne-form-item,
.settings-item-small {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--ne-border);
  min-height: 48px;
}

.ne-form-item:last-child,
.settings-item-small:last-child,
.ne-settings-item--last {
  border-bottom: none;
}

.ne-form-item__left,
.settings-item-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
}

.ne-form-item__icon,
.s-icon-small {
  font-size: 20px;
  flex-shrink: 0;
  color: var(--ne-muted);
  font-variation-settings: 'FILL' 1;
}

/* Icon color modifiers (ne-ficon--*) */
.ne-ficon--muted  { color: var(--ne-hint); }
.ne-ficon--blue   { color: var(--ne-primary); }
.ne-ficon--violet { color: var(--ne-violet); }
.ne-ficon--green  { color: #137333; }
.ne-ficon--orange { color: var(--ne-amber-text); }
.ne-ficon--pay    { color: #0d652d; }

/* Settings icon color helpers (legacy aliases) */
.ne-settings-icon--lang   { color: var(--ne-primary); }
.ne-settings-icon--region { color: var(--ne-cyan); }
.ne-settings-icon--doc    { color: var(--ne-violet); }
.ne-settings-icon--farm   { color: #137333; }

/* в”Ђв”Ђ Right-side control (select / input) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-form-item__ctrl,
.settings-item-right-small {
  flex-shrink: 0;
  max-width: 52%;
  font-size: 13px;
  font-weight: 500;
  color: var(--ne-ink);
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  padding: 7px 10px;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  font-family: inherit;
}

.ne-form-item__ctrl:focus,
.settings-item-right-small:focus {
  border-color: var(--ne-primary);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.12);
}

.settings-item-right-small--farm {
  max-width: 52%;
}

.settings-item-right-small--culture {
  max-width: 52%;
  font-size: 12px;
}

/* в”Ђв”Ђ Field status slot (saving / updated feedback) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.field-status-slot {
  font-size: 11px;
  font-weight: 600;
  padding: 0 0 4px 32px;
  opacity: 0;
  transition: opacity 0.3s ease;
  min-height: 16px;
}

/* в”Ђв”Ђ Settings-specific panel card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-panel {
  margin: 0 0 12px;
  padding: 16px 20px;
}

.ne-settings-panel__head {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ne-muted);
  margin-bottom: 12px;
}

/* в”Ђв”Ђ Settings page layout в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-head {
  padding: 0 16px 12px;
}

.ne-page__title {
  font-size: 22px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 12px;
  letter-spacing: -0.02em;
}

.settings-mobile-tabs { margin-bottom: 0; }

/* Desktop two-column grid */
.settings-desktop-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

@media (min-width: 768px) {
  .settings-desktop-grid {
    grid-template-columns: 1fr 1fr;
    gap: 0 24px;
    padding: 0 16px;
  }
}

.settings-tab-content { display: none; }
.settings-tab-content.active { display: block; }

.desktop-column-header {
  display: none;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 12px;
}

@media (min-width: 768px) {
  .settings-tab-content { display: block; }
  .desktop-column-header { display: block; }
}

/* в”Ђв”Ђ Settings checklist items в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.checklist-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--ne-muted);
  padding: 6px 0;
}

.checklist-item .icon { font-size: 18px; color: var(--ne-border); }
.checklist-item .icon.done { color: #137333; }

/* в”Ђв”Ђ MD3 Toggle Switch в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.md3-switch {
  position: relative;
  width: 60px;
  height: 32px;
  flex-shrink: 0;
  cursor: pointer;
}

.md3-switch input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

/* Legacy switch-thumb (used elsewhere) */
.switch-thumb {
  position: absolute;
  inset: 0;
  background: var(--ne-border);
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.25s var(--ne-ease-out);
}

.switch-thumb::after {
  content: '';
  position: absolute;
  width: 22px;
  height: 22px;
  left: 5px;
  top: 5px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.25s var(--ne-ease-out);
  box-shadow: 0 1px 4px rgba(0,0,0,0.15);
}

.md3-switch input:checked + .switch-thumb {
  background: var(--ne-primary);
}

.md3-switch input:checked + .switch-thumb::after {
  transform: translateX(24px);
}

/* New track+knob switch (pension toggle) */
.switch-track {
  width: 100%;
  height: 100%;
  background: var(--ne-border);
  border-radius: 999px;
  overflow: hidden;
  transition: background 0.25s var(--ne-ease-out);
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

.switch-knob {
  width: 22px;
  height: 22px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
  flex-shrink: 0;
  margin-left: 5px;
  transition: margin-left 0.25s var(--ne-ease-out);
}

/* div-based switch active state */
.md3-switch.active > .switch-track {
  background: var(--ne-primary);
}

.md3-switch.active > .switch-track > .switch-knob {
  margin-left: calc(100% - 22px - 5px);
}

/* в”Ђв”Ђ ne-btn block modifier в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-btn--block {
  width: 100%;
  margin-top: 16px;
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 4b — Finance Module classes
   Replaces: .finance-desktop-dashboard, .hero-v3, .finance-card (hero),
             .tax-chart-*, .refund-input-box, .md3-button, .animate-fade-in
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* в”Ђв”Ђ Finance layout в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-layout,
.finance-desktop-dashboard {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

@media (min-width: 900px) {
  .ne-finance-layout,
  .finance-desktop-dashboard {
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
    padding: 0 16px;
  }
}

.finance-dashboard-left,
.finance-dashboard-right { min-width: 0; }

/* в”Ђв”Ђ Finance section heading в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-section-head,
.finance-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ne-muted);
  margin-bottom: 12px;
}

.ne-finance-section-head .material-symbols-outlined,
.finance-section-title .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-primary);
}

/* в”Ђв”Ђ Finance calendar card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-calendar-card,
.finance-calendar-card { padding: 16px; }

/* в”Ђв”Ђ Finance shifts panel в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-shifts-list { display: flex; flex-direction: column; gap: 4px; }
.ne-finance-shifts-panel { padding: 16px 20px; }

/* в”Ђв”Ђ Finance refund input box в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.refund-input-box {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  padding: 8px 12px;
  flex-shrink: 0;
  max-width: 52%;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.refund-input-box:focus-within {
  border-color: var(--ne-primary);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.12);
}

.refund-input-box input {
  border: none;
  outline: none;
  background: transparent;
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-ink);
  font-family: inherit;
  width: 80px;
}

.currency-sign {
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-primary);
  flex-shrink: 0;
}

.refund-highlight-row { background: rgba(var(--ne-primary-rgb), 0.03); border-radius: var(--ne-radius-sm); padding: 4px 8px; }
.refund-highlight-row--last { margin-bottom: 4px; }

/* в”Ђв”Ђ Finance action buttons в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-actions {
  display: flex;
  gap: 10px;
  padding: 0 16px 16px;
  align-items: center;
}

.ne-finance-btn-calc {
  flex: 1;
  padding: 14px 20px;
  background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet));
  color: #fff;
  border: none;
  border-radius: var(--ne-radius-md);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 4px 16px rgba(var(--ne-primary-rgb), 0.3);
  transition: transform 0.35s var(--ne-ease-spring), box-shadow 0.2s;
}

.ne-finance-btn-calc:active { transform: scale(0.97); }

.ne-finance-btn-reset {
  width: 52px;
  height: 52px;
  padding: 0;
  background: #eef0f3;
  color: #6b7280;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: var(--ne-radius-md);
  font-size: 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s;
}

.ne-finance-btn-reset:active { transform: scale(0.94); background: rgba(197, 34, 31, 0.15); }

/* md3-button legacy alias */
.md3-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: var(--ne-radius-md);
  font-weight: 700;
  font-size: 14px;
  border: none;
  cursor: pointer;
  transition: transform 0.35s var(--ne-ease-spring);
}

.md3-button:active { transform: scale(0.97); }
.md3-button.pulse-btn { background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet)); color: #fff; }
.md3-button.danger { background: rgba(197, 34, 31, 0.08); color: var(--ne-error); border: 1px solid rgba(197, 34, 31, 0.2); }

/* в”Ђв”Ђ Tax chart в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-chart,
.tax-chart-container {
  margin: 16px 0 8px;
}

.ne-chart__bar,
.tax-chart-bar {
  height: 12px;
  border-radius: 999px;
  background: var(--ne-border);
  overflow: hidden;
  display: flex;
}

.ne-chart__seg--net,
.chart-seg-net {
  height: 100%;
  background: linear-gradient(90deg, #34a853, #1aae39);
  border-radius: 999px 0 0 999px;
  transition: width 0.6s var(--ne-ease-out);
}

.ne-chart__seg--tax,
.chart-seg-tax {
  height: 100%;
  background: linear-gradient(90deg, #ea4335, #c5221f);
  border-radius: 0 999px 999px 0;
  transition: width 0.6s var(--ne-ease-out);
}

.ne-chart__legend,
.chart-legend {
  display: flex;
  gap: 16px;
  margin-top: 10px;
}

.ne-chart__legend-item,
.legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--ne-muted);
  font-weight: 500;
}

.ne-chart__dot,
.legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.legend-dot.net { background: #1aae39; }
.legend-dot.tax { background: #c5221f; }

/* в”Ђв”Ђ animate-fade-in (Finance legacy) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.animate-fade-in {
  animation: ne-card-in 0.45s var(--ne-ease-out) both;
}

/* в”Ђв”Ђ Finance forms container в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-forms { padding: 0 0 8px; }

.ne-finance-label--accent {
  font-weight: 700;
  color: var(--ne-ink);
}

/* в”Ђв”Ђ Finance workplace card head в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-workplace__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 12px;
}

.ne-finance-workplace__title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ne-finance-workplace__title .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-primary);
}

.ne-finance-workplace__remove {
  font-size: 20px;
  color: var(--ne-error);
  cursor: pointer;
  transition: transform 0.2s var(--ne-ease-spring);
}

.ne-finance-workplace__remove:active { transform: scale(0.9); }

/* ── Workplace card: vertical stacked form (ne-wp-*) ────────────────────── */
.ne-wp-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px;
}

.ne-wp-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.ne-wp-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.ne-wp-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--ne-hint);
  line-height: 1;
}

.ne-wp-select,
.ne-wp-input {
  width: 100%;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  padding: 10px 12px;
  outline: none;
  font-family: inherit;
  transition: border-color 0.18s, box-shadow 0.18s;
  -webkit-appearance: auto;
  appearance: auto;
}

.ne-wp-select:focus,
.ne-wp-input:focus {
  border-color: var(--ne-primary);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.12);
}

.ne-wp-select:not(:focus):invalid,
.ne-wp-input:not(:focus):invalid {
  border-color: var(--ne-error, #ef4444);
  box-shadow: none;
}

.ne-wp-input-box:has(input:not(:focus):invalid) {
  border-color: var(--ne-error, #ef4444);
}

.ne-wp-input-box {
  display: flex;
  align-items: center;
  background: var(--ne-surface-2);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  overflow: hidden;
  transition: border-color 0.18s, box-shadow 0.18s;
}

.ne-wp-input-box:focus-within {
  border-color: var(--ne-primary);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.12);
}

.ne-wp-currency {
  padding: 10px 6px 10px 12px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ne-hint);
  flex-shrink: 0;
  line-height: 1;
}

.ne-wp-input-box input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 10px 12px 10px 2px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
  font-family: inherit;
  outline: none;
  min-width: 0;
}

.ne-wp-farm-wrap {
  position: relative;
}

.ne-wp-farm-suggest {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 20;
  max-height: 220px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--ne-surface, #fff);
  border: 1.5px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}

.ne-wp-farm-suggest[hidden] { display: none; }

.ne-wp-farm-suggest__item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 14px;
  border: none;
  border-bottom: 1px solid var(--ne-border);
  background: none;
  font: inherit;
  font-size: 14px;
  color: var(--ne-ink);
  cursor: pointer;
}

.ne-wp-farm-suggest__item:last-child { border-bottom: none; }
.ne-wp-farm-suggest__item:active { background: var(--ne-surface-2); }

/* в”Ђв”Ђ Add workplace button в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.add-workplace-btn {
  width: calc(100% - 32px);
  margin: 8px 16px;
  padding: 12px;
  background: transparent;
  border: 1.5px dashed rgba(var(--ne-primary-rgb), 0.4);
  border-radius: var(--ne-radius-md);
  color: var(--ne-primary);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background 0.2s, border-color 0.2s, transform 0.35s var(--ne-ease-spring);
}

.add-workplace-btn:active {
  transform: scale(0.98);
  background: rgba(var(--ne-primary-rgb), 0.06);
  border-color: var(--ne-primary);
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 4c — Wiki Module classes
   Replaces: .farm-card, .farm-btn, .wiki-search-*, .wiki-modal-*,
             .crop-tag, .meta-tag, .job-item, .farm-rating-pill
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* в”Ђв”Ђ Wiki page header в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */

/* Remove transform from wiki-root animation — transform on a parent breaks
   position:sticky inside it (creates new stacking context). Use opacity only. */
@keyframes wiki-fade-in { from { opacity: 0; } to { opacity: 1; } }
.wiki-root {
  padding-bottom: 96px;
  animation-name: wiki-fade-in;
}

.wiki-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  margin: 0 -16px 0;
  padding: 6px 16px;
  border-bottom: 1px solid var(--ne-line);
}

.wiki-tabs { margin-bottom: 0; }

.wiki-tab-badge {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 16px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e8f0fe;
  color: #1a73e8;
  font-size: 9px;
  font-weight: 800;
  margin-left: 1px;
  box-shadow: inset 0 0 0 1px rgba(26, 115, 232, 0.12);
  pointer-events: none;
}

/* в”Ђв”Ђ Wiki search bar в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.wiki-search-container {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}

.wiki-search-bar {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--ne-surface-solid);
  border: 1.5px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  padding: 12px 16px;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.wiki-search-bar:focus-within {
  border-color: var(--ne-primary);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.12), 0 2px 8px rgba(0,0,0,0.06);
}

.wiki-search-bar .search-icon { font-size: 20px; color: var(--ne-primary); flex-shrink: 0; }

.wiki-search-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
  font-family: inherit;
}

.wiki-search-clear {
  font-size: 18px;
  color: var(--ne-hint);
  cursor: pointer;
  flex-shrink: 0;
  transition: color 0.2s;
}

.wiki-search-clear:hover { color: var(--ne-error); }

/* в”Ђв”Ђ FAB add button в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.fab-add {
  width: 44px;
  height: 44px;
  border-radius: var(--ne-radius-md);
  background: var(--ne-primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.35);
  transition: transform 0.35s var(--ne-ease-spring), box-shadow 0.2s;
}

.fab-add:active { transform: scale(0.94); }
.fab-add--square { border-radius: var(--ne-radius-sm); }

/* в”Ђв”Ђ Wiki sync banner в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-wiki-sync-banner {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ne-primary);
  padding: 6px 0 2px;
}

.ne-wiki-sync-banner .material-symbols-outlined {
  font-size: 16px;
  animation: ne-spin 1s linear infinite;
}

/* в”Ђв”Ђ Farm card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.farm-card {
  margin: 6px 16px;
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-line);
  border-radius: var(--ne-radius-lg);
  overflow: hidden;
  box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: ne-card-in 0.45s var(--ne-ease-out) both;
  animation-delay: var(--ne-delay, 0s);
  transition: transform 0.35s var(--ne-ease-spring), box-shadow 0.25s;
}

.farm-card-main {
  padding: 0;
  cursor: pointer;
}

.farm-card-name {
  font-size: 15px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 4px;
  letter-spacing: -0.02em;
}

.farm-bottom-row {
  padding: 8px 14px 10px;
  border-top: 1px solid var(--ne-border);
  background: var(--ne-surface-2);
}

/* в”Ђв”Ђ Farm stats row в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-wiki-farm-stats-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.farm-mini-stats {
  display: flex;
  gap: 6px;
}

.mini-stat {
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-muted);
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-sm);
  padding: 3px 7px;
}

/* в”Ђв”Ђ Farm rating pill в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.farm-rating-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  background: var(--ne-surface-2);
  color: var(--ne-muted);
  border: 1px solid var(--ne-border);
}

.farm-rating-pill.good, .farm-rating-pill.green { background: #e6f4ea; color: #137333; border-color: #ceead6; }
.farm-rating-pill.ok, .farm-rating-pill.orange   { background: #fef7e0; color: #b06000; border-color: #fde68a; }
.farm-rating-pill.bad, .farm-rating-pill.red      { background: #fce8e6; color: var(--ne-error); border-color: #f9ab9d; }
.farm-rating-pill.grey { background: #f0f4f9; color: var(--ne-hint); border-color: var(--ne-border); }

/* в”Ђв”Ђ Farm action buttons в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-wiki-farm-actions {
  display: flex;
  gap: 8px;
}

/* ── Wiki sort dropdown ───────────────────────────────────────── */
.wiki-sort-chips {
  padding: 8px 16px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

/* Compact inline search in sort row */
.wiki-inline-search {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 20px;
  padding: 0 12px;
  height: 36px;
  min-width: 0;
  box-shadow: 0 1px 4px rgba(0,0,0,0.10);
}
.wiki-inline-search:focus-within {
  background: #fff;
  border-color: #2563EB;
  box-shadow: 0 0 0 2px rgba(37,99,235,0.15), 0 1px 4px rgba(0,0,0,0.08);
}
.wiki-inline-search__icon { font-size: 17px; color: #6B7280; flex-shrink: 0; }
.wiki-inline-search__input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 13.5px;
  font-weight: 500;
  color: #111827;
  font-family: inherit;
  min-width: 0;
}
.wiki-inline-search__input::placeholder { color: #9CA3AF; font-weight: 400; }
.wiki-inline-search .wiki-search-clear { font-size: 18px; color: #9CA3AF; cursor: pointer; flex-shrink: 0; }
.wiki-inline-search .wiki-search-map {
  font-size: 21px;
  color: var(--ne-primary, #3390ec);
  cursor: pointer;
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #eaf2fb;
  border: 1px solid rgba(51,144,236,0.20);
  border-radius: 11px;
  margin-left: 6px;
  margin-right: -4px;
  box-shadow: 0 1px 3px rgba(51,144,236,0.12);
  transition: background .15s, transform .1s;
}
.wiki-inline-search .wiki-search-map:active { background: #d8e7fa; transform: scale(.92); }
.wiki-sort-dropdown {
  position: relative;
  display: inline-block;
}
.wiki-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 20px;
  background: #166534;
  color: #fff;
  border: none;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  transition: background 0.15s;
}
.wiki-sort-btn:active { background: #14532D; }
.wiki-sort-arrow {
  font-size: 12px;
  display: inline-block;
  transition: transform 0.2s;
}
.wiki-sort-dropdown.open .wiki-sort-arrow {
  transform: rotate(180deg);
}
.wiki-sort-popup {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.13), 0 1px 4px rgba(0,0,0,0.07);
  border: 1px solid #E5E7EB;
  z-index: 300;
  min-width: 190px;
  padding: 5px;
  flex-direction: column;
}
.wiki-sort-dropdown.open .wiki-sort-popup {
  display: flex;
}
.wiki-sort-btn--crop-active { background: #1E40AF; }
.wiki-sort-btn--crop-active:active { background: #1E3A8A; }
.wiki-crop-popup { left: auto; right: 0; }
.wiki-sort-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  font-size: 13px;
  font-weight: 500;
  color: #374151;
  cursor: pointer;
  border-radius: 10px;
  font-family: inherit;
  transition: background 0.1s;
}
.wiki-sort-option.on {
  background: #F0FDF4;
  color: #166534;
  font-weight: 700;
}
.wiki-sort-option:active { background: #F3F4F6; }
.wiki-sort-check {
  font-size: 13px;
  color: #166534;
}

/* ── Farm rank badge ──────────────────────────────────────────── */
.farm-rank-badge {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex-shrink: 0;
}

/* ── ScoreCell — colored mini-card with progress bar ─────────── */
.farm-score-cells {
  display: flex;
  gap: 8px;
  margin: 10px 0 0;
}
.score-cell {
  flex: 1;
  padding: 8px 10px;
  border-radius: 11px;
  border: 1.5px solid #e2e8f0;
}
.score-cell__top {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 5px;
}
.score-cell__emoji { font-size: 13px; }
.score-cell__val   { font-size: 14px; font-weight: 800; }
.score-cell__bar   { display: flex; gap: 2px; }
.score-cell__seg   { flex: 1; height: 3px; border-radius: 2px; }

.farm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: var(--ne-radius-sm);
  font-size: 13px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transition: transform 0.35s var(--ne-ease-spring), background 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.farm-btn:active { transform: scale(0.96); }

.farm-btn-sec {
  background: var(--ne-surface-solid);
  color: var(--ne-ink);
  border: 1px solid var(--ne-border);
  flex: 1;
}

.farm-btn-prim {
  background: var(--ne-primary);
  color: #fff;
  flex: 1;
  box-shadow: 0 2px 8px rgba(var(--ne-primary-rgb), 0.25);
}

/* в”Ђв”Ђ Crop tags в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.crop-tags-container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}

.crop-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 600;
  background: var(--ne-surface-2);
  color: var(--ne-muted);
  border: 1px solid var(--ne-border);
}

.crop-tag.more {
  background: rgba(var(--ne-primary-rgb), 0.08);
  color: var(--ne-primary);
  border-color: rgba(var(--ne-primary-rgb), 0.2);
  cursor: pointer;
}

/* в”Ђв”Ђ Meta tags (postcode, etc.) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.meta-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--ne-hint);
}

.meta-tag--pin { color: var(--ne-muted); }

/* в”Ђв”Ђ Wiki review count badge в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.review-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background:
    radial-gradient(circle at 80% 15%, rgba(255, 255, 255, 0.22) 0 0, transparent 32%),
    #1a73e8;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  box-shadow: 0 2px 6px rgba(26, 115, 232, 0.24);
}

.ne-wiki-review-zero {
  min-width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(60, 64, 67, 0.08);
  color: var(--ne-hint);
  font-size: 10px;
  font-weight: 800;
}

.sk {
  display: inline-block;
  width: 24px;
  height: 14px;
  border-radius: 999px;
  background: var(--skeleton-bg);
  background-size: 200% 100%;
  animation: ne-skeleton-shimmer 1.6s infinite ease-in-out;
}

/* в”Ђв”Ђ Job item card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.job-item {
  margin: 8px 16px;
  background: var(--ne-surface);
  border: 1px solid var(--ne-line);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  box-shadow: var(--ne-shadow-card);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  cursor: pointer;
  animation: ne-card-in 0.45s var(--ne-ease-out) both;
  animation-delay: var(--ne-delay, 0s);
  transition: transform 0.35s var(--ne-ease-spring), box-shadow 0.25s;
}

.job-item:active { transform: scale(0.99); }

.job-farm-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0;
  letter-spacing: -0.02em;
}

.job-action-bar {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

/* в”Ђв”Ђ Operator chips в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.wiki-op-chips { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; max-height: 2.2em; overflow: hidden; }

.wiki-op-chip {
  display: inline-flex;
  padding: 1px 5px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  background: rgba(var(--ne-primary-rgb), 0.08);
  color: var(--ne-primary);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.15);
  white-space: nowrap;
  flex-shrink: 0;
}

.wiki-op-more { cursor: pointer; }
.wiki-op-extra { display: none; }
.wiki-op-extra.is-open { display: contents; }

/* в”Ђв”Ђ Wiki urgency badge в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
/* Styles defined earlier in this file (search for wikiUrgentPulse) */

/* в”Ђв”Ђ Wiki modal (bottom sheet) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.wiki-modal-overlay,
.ne-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: rgba(27, 27, 31, 0.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  animation: ne-fade-in 0.25s var(--ne-ease-out) both;
}

.wiki-modal-sheet,
.ne-modal-sheet {
  position: relative;
  bottom: auto;
  left: auto;
  right: auto;
  z-index: 2001;
  width: 100%;
  background: var(--ne-surface-solid);
  border-radius: var(--ne-radius-xl) var(--ne-radius-xl) 0 0;
  max-height: 92vh;
  overflow-y: auto;
  padding-bottom: env(safe-area-inset-bottom, 20px);
  animation: ne-sheet-up 0.38s var(--ne-ease-spring) both;
}

@media (min-width: 768px) {
  .wiki-modal-overlay,
  .ne-modal-overlay {
    align-items: center;
    padding: 20px;
  }
  .wiki-modal-sheet,
  .ne-modal-sheet {
    max-width: 560px;
    border-radius: var(--ne-radius-xl);
    animation: ne-modal-scale-in 0.32s var(--ne-ease-out) both;
  }
}

@keyframes ne-sheet-up {
  from { transform: translateY(100%); opacity: 0.6; }
  to   { transform: translateY(0);    opacity: 1; }
}

.modal-handle {
  width: 40px;
  height: 4px;
  border-radius: 999px;
  background: var(--ne-border);
  margin: 12px auto 0;
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  border-bottom: 1px solid var(--ne-line);
  font-size: 17px;
  font-weight: 800;
  color: var(--ne-ink);
}

.modal-body { padding: 16px 20px; }

/* в”Ђв”Ђ Wiki promo card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.promo-item { cursor: pointer; }

.ne-wiki-promo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.ne-wiki-promo-logo { height: 22px; }

/* ne-wiki-promo-badge/title/desc/body/icon — defined above in Phase 5 with correct white colors.
   These Phase 4 duplicates are overridden to restore white text on blue background. */
.ne-wiki-promo-badge {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 999px;
  padding: 2px 8px;
}

.ne-wiki-promo-body {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.ne-wiki-promo-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: var(--ne-radius-sm);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.ne-wiki-promo-icon-wrap img { width: 24px; height: 24px; }

.ne-wiki-promo-title {
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  margin-bottom: 4px;
}

.ne-wiki-promo-desc {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.5;
  font-weight: 500;
}

.ne-wiki-promo-btn {
  width: 100%;
  padding: 11px;
  background: #fff !important;
  color: var(--ne-primary) !important;
  border: none;
  border-radius: var(--ne-radius-sm);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: transform 0.35s var(--ne-ease-spring);
}

.ne-wiki-promo-btn:active { transform: scale(0.97); }

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 4d — Sponsors Module classes
   Replaces: .sponsors-banner, .card-glow, .primary-btn/.secondary-btn,
             .onboarding-*, .inapp-job-card, .rating-pill, .route-pill
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.sponsors-root { padding-bottom: 96px; }

/* в”Ђв”Ђ Sponsors hero banner в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.sponsors-banner {
  position: relative;
  margin: 12px 16px 16px;
  background:
    radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.18) 0 0, transparent 30%),
    linear-gradient(135deg, #1a73e8 0%, #2b7de9 100%);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  padding: 24px 20px 20px;
  color: #fff;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(26, 115, 232, 0.18);
}

.sponsors-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,0.08), transparent 54%);
  pointer-events: none;
}

.sponsors-banner-content { position: relative; z-index: 1; }

.sponsors-banner-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.banner-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.16);
  font-size: 24px;
  color: #fff;
  opacity: 1;
  flex: 0 0 42px;
  font-variation-settings: 'FILL' 1;
}

.banner-title {
  font-size: 20px;
  font-weight: 800;
  margin: 0;
  letter-spacing: -0.02em;
}

.banner-desc {
  font-size: 13px;
  color: rgba(255,255,255,0.88);
  line-height: 1.55;
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.banner-help-link {
  cursor: pointer;
  color: #fff;
  opacity: 0.85;
  flex-shrink: 0;
  margin-top: 1px;
}

.banner-help-link .material-symbols-outlined { font-size: 18px; }

/* в”Ђв”Ђ Sponsors nav tabs в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.sponsors-nav-tabs { margin: 0 0 16px; }

.nav-tab-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 8px 4px;
  font-size: 10px;
}

.nav-tab-btn .material-symbols-outlined { font-size: 20px; }
.nav-tab-label { font-size: 10px; font-weight: 700; }

/* в”Ђв”Ђ Sponsors search box в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.sponsors-search-box {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  background: var(--ne-surface-solid);
  border: 1.5px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  padding: 12px 16px;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-shadow: 0 2px 10px rgba(60, 64, 67, 0.05);
}
.sponsors-search-box:focus-within {
  border-color: var(--ne-primary);
  box-shadow: 0 0 0 3px rgba(var(--ne-primary-rgb), 0.1);
}

.sponsors-search-box .search-icon { font-size: 20px; color: var(--ne-primary); flex-shrink: 0; }

.sponsors-input-element {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
  font-family: inherit;
}

.sponsors-search-clear {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  background: var(--ne-border);
  border-radius: 50%;
  cursor: pointer;
  color: var(--ne-muted);
  flex-shrink: 0;
  transition: background 0.2s;
}

.sponsors-search-clear:active { background: rgba(var(--ne-primary-rgb), 0.12); }

/* в”Ђв”Ђ Glassmorphic card (card-glow) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.card-glow {
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-line);
  border-radius: var(--ne-radius-md);
  box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

/* в”Ђв”Ђ Sponsors button variants в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.primary-btn,
.finish-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--ne-primary);
  color: #fff;
  border: none;
  border-radius: var(--ne-radius-md);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.18s ease-out, background 0.2s;
  font-family: inherit;
}

.primary-btn:active,
.finish-btn:active { transform: scale(0.97); background: var(--ne-primary-active); }

.secondary-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--ne-surface-solid);
  color: var(--ne-ink);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-md);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.18s ease-out;
  font-family: inherit;
}

.secondary-btn:active { transform: scale(0.97); }

.text-btn {
  background: transparent;
  border: none;
  color: var(--ne-primary);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  padding: 8px 12px;
  border-radius: var(--ne-radius-sm);
  font-family: inherit;
  transition: background 0.2s;
}

.text-btn:active { background: rgba(var(--ne-primary-rgb), 0.08); }

/* в”Ђв”Ђ Sponsors onboarding overlay в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.sponsors-onboarding-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  background: rgba(27, 27, 31, 0.42);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: ne-fade-in 0.3s var(--ne-ease-out) both;
}

.sponsors-onboarding-card {
  width: 100%;
  max-width: 340px;
  background: var(--ne-surface-solid);
  border-radius: var(--ne-radius-xl);
  padding: 28px 24px 32px;
  animation: ne-sheet-up 0.4s var(--ne-ease-spring) both;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 12px 28px rgba(0,0,0,0.18);
}

.onboarding-icon-container {
  width: 64px;
  height: 64px;
  border-radius: var(--ne-radius-lg);
  background: linear-gradient(135deg, #e8f0fe, #d2e3fc);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
}

.onboarding-icon-container .material-symbols-outlined {
  font-size: 32px;
  color: var(--ne-primary);
  font-variation-settings: 'FILL' 1;
}

.onboarding-title {
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-ink);
  text-align: center;
  margin: 0 0 10px;
  letter-spacing: -0.02em;
}

.onboarding-desc {
  font-size: 14px;
  color: var(--ne-muted);
  text-align: center;
  line-height: 1.6;
  margin: 0 0 20px;
}

.onboarding-bullets {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}

.onboarding-bullet {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ne-hint);
  opacity: 0.4;
  transition: all 0.25s ease;
}

.onboarding-bullet.active {
  width: 20px;
  border-radius: 3px;
  background: var(--ne-primary);
  opacity: 1;
}

.onboarding-actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

/* в”Ђв”Ђ Tab pane animation в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.tab-pane-view,
.anim-fade-in {
  animation: ne-fade-in 0.3s var(--ne-ease-out) both;
}

/* в”Ђв”Ђ Sponsors job card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.inapp-job-card {
  margin: 8px 16px;
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-line);
  border-radius: var(--ne-radius-md);
  overflow: hidden;
  box-shadow: 0 3px 14px rgba(60, 64, 67, 0.06);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  animation: none;
  transition: transform 0.18s ease-out;
}

.job-card-header {
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--ne-border);
}

.job-card-body { padding: 12px 16px; }

.job-card-footer {
  padding: 10px 16px 14px;
  display: flex;
  gap: 8px;
}

.job-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  background: #e6f4ea;
  color: #137333;
  border: 1px solid #ceead6;
}

.job-org-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--ne-muted);
  margin-bottom: 4px;
}

.job-title-line {
  font-size: 15px;
  font-weight: 800;
  color: var(--ne-ink);
  letter-spacing: -0.02em;
}

.job-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.job-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--ne-muted);
  font-weight: 500;
}

.job-meta-item .material-symbols-outlined { font-size: 14px; }

.job-tags-group { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }

.job-details-btn {
  flex: 1;
  padding: 10px;
  background: var(--ne-primary);
  color: #fff;
  border: none;
  border-radius: var(--ne-radius-sm);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: transform 0.35s var(--ne-ease-spring);
  font-family: inherit;
}

.job-details-btn:active { transform: scale(0.97); }

/* в”Ђв”Ђ Sponsors pill badges в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.rating-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: var(--ne-surface-2);
  color: var(--ne-muted);
  border: 1px solid var(--ne-border);
}

.route-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  background: rgba(var(--ne-primary-rgb), 0.08);
  color: var(--ne-primary);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.15);
}

.sector-tag {
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  background: var(--ne-surface-2);
  color: var(--ne-muted);
  border: 1px solid var(--ne-border);
}

.pulse-indicator {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #137333;
  box-shadow: 0 0 0 3px rgba(19, 115, 51, 0.12);
  flex-shrink: 0;
}

@keyframes ne-pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.8); }
}

.watchlist-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--ne-radius-sm);
  border: 1px solid var(--ne-border);
  background: var(--ne-surface-solid);
  color: var(--ne-hint);
  cursor: pointer;
  transition: transform 0.35s var(--ne-ease-spring), color 0.2s, background 0.2s;
  flex-shrink: 0;
}

.watchlist-btn.active { color: var(--ne-amber-text); background: #fef7e0; border-color: #fde68a; }
.watchlist-btn:active { transform: scale(0.9); }

/* в”Ђв”Ђ Sponsors map в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.sponsors-map-element {
  width: 100%;
  height: 340px;
  border-radius: var(--ne-radius-lg);
  overflow: hidden;
  border: 1px solid var(--ne-line);
}

.sponsors-map-marker {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ne-primary);
  border: 3px solid #fff;
  box-shadow: 0 2px 8px rgba(var(--ne-primary-rgb), 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
}

.sponsors-cluster-icon {
  background: var(--ne-primary);
  border-radius: 50%;
  color: #fff;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid #fff;
  box-shadow: 0 2px 8px rgba(var(--ne-primary-rgb), 0.4);
}

.sponsors-popup-card {
  padding: 8px;
  min-width: 180px;
  font-family: 'Inter', system-ui, sans-serif;
}

/* в”Ђв”Ђ Sponsors error / empty states в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.sponsors-error {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 48px 20px;
  text-align: center;
  color: var(--ne-muted);
  font-size: 14px;
}

.sponsors-error .material-symbols-outlined {
  font-size: 18px;
  color: #dc2626;
}

.sponsors-vacancy-p {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.6;
  padding: 0 16px;
}

.sponsors-vacancy-spacer { height: 24px; }

/* в”Ђв”Ђ Sponsors modal hero в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.modal-org-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--ne-muted);
  margin-bottom: 4px;
}

.modal-hero-title-section { margin-bottom: 16px; }

.modal-rating-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.modal-sector-wrap { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }

.modal-vacancy-headline {
  font-size: 18px;
  font-weight: 800;
  color: var(--ne-ink);
  letter-spacing: -0.02em;
  margin: 0 0 8px;
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 4e — English Module classes
   Replaces: .course-card, .course-grid, .course-badge, .english-hero
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.english-root { padding-bottom: 96px; }

/* в”Ђв”Ђ English hero в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.english-hero {
  margin: 12px 16px 16px;
  background: linear-gradient(145deg, #1a73e8 0%, #4285f4 50%, #12b5cb 100%);
  border-radius: var(--ne-radius-xl);
  padding: 24px 20px;
  color: #fff;
  overflow: hidden;
  position: relative;
  box-shadow: var(--ne-shadow-hero);
}

.english-hero-title {
  font-size: 22px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 8px;
  letter-spacing: -0.02em;
}

.english-hero-desc {
  font-size: 13px;
  color: rgba(255,255,255,0.88);
  line-height: 1.55;
  margin: 0;
}

/* в”Ђв”Ђ Course grid в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.course-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 0 16px;
}

@media (min-width: 400px) {
  .course-grid { grid-template-columns: 1fr; gap: 14px; }
}

@media (min-width: 480px) {
  .course-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
}

@media (min-width: 600px) {
  .course-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; max-width: 800px; margin: 0 auto; }
}

@media (min-width: 768px) {
  .course-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
}

@media (min-width: 1024px) {
  .course-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1000px; margin: 0 auto; }
}

/* в”Ђв”Ђ Course card в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.course-card {
  background: var(--ne-surface);
  border: 1px solid var(--ne-line);
  border-radius: var(--ne-radius-lg);
  padding: 16px 14px;
  cursor: pointer;
  box-shadow: var(--ne-shadow-card);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  animation: none;
  transition: transform 0.18s ease-out, box-shadow 0.22s ease-out;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.course-card:active { transform: scale(0.97); }

.course-icon {
  font-size: 28px;
  line-height: 1;
  flex-shrink: 0;
}

.course-badge {
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  background: rgba(var(--ne-primary-rgb), 0.1);
  color: var(--ne-primary);
  align-self: flex-start;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.course-title {
  font-size: 14px;
  font-weight: 800;
  color: var(--ne-ink);
  letter-spacing: -0.01em;
  margin: 0;
}

.course-desc {
  font-size: 12px;
  color: var(--ne-muted);
  line-height: 1.5;
  margin: 0;
  flex: 1;
}

.course-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
}

.course-cta {
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-primary);
}

/* course-card-top: wrap badges on narrow cards */
.course-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 4px;
}

/* в”Ђв”Ђ Course iframe wrapper в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.course-iframe {
  width: 100%;
  border: none;
  border-radius: var(--ne-radius-md);
  min-height: calc(100vh - 120px);
}

.course-skeleton {
  height: 200px;
  border-radius: var(--ne-radius-md);
  background: var(--skeleton-bg);
  background-size: 200% 100%;
  animation: ne-skeleton-shimmer 1.6s infinite ease-in-out;
  margin: 16px;
}

/* в”Ђв”Ђ Dark mode additions for Phase 4 в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
@media not all {
  .wiki-header {
    background: rgba(22, 24, 28, 0.92);
    border-bottom-color: var(--ne-line);
  }

  .farm-card,
  .job-item,
  .inapp-job-card,
  .course-card {
    background: var(--ne-surface);
    border-color: var(--ne-line);
  }

  .farm-bottom-row { background: var(--ne-surface-2); }

  .finance-card,
  .ne-settings-panel { background: var(--ne-surface); }

  .refund-input-box,
  .wiki-search-bar,
  .sponsors-search-box { background: var(--ne-surface-2); border-color: var(--ne-border); }

  .sponsors-onboarding-card,
  .wiki-modal-sheet,
  .ne-modal-sheet { background: var(--ne-surface-solid); }

  .checklist-item .icon { color: #3c4043; }
  .checklist-item .icon.done { color: #34a853; }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Phase 5 — Settings Module specific classes
   (moved from inline <style> block in SettingsModule.js)
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* в”Ђв”Ђ Settings item label helpers в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-item__label { font-weight: 600; }
.ne-settings-item__label--danger { color: var(--ne-error); }
.ne-settings-item--click { cursor: pointer; transition: background 0.2s; }
.ne-settings-item--click:active { background: rgba(var(--ne-primary-rgb), 0.05); }

.ne-settings-external-icon { font-size: 18px; color: var(--ne-hint); flex-shrink: 0; }
.ne-settings-version { font-size: 12px; font-weight: 700; color: var(--ne-hint); }

/* ── PWA Card inside Settings ──────────────────────────────────────────── */
.ne-pwa-settings-card {
  margin: 16px 16px 8px;
  background: linear-gradient(135deg, #1a73e8 0%, #0d47a1 100%);
  border-radius: 20px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(26, 115, 232, 0.35);
}
.ne-pwa-settings-card__icon {
  width: 48px;
  height: 48px;
  background: rgba(255,255,255,0.18);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ne-pwa-settings-card__icon .material-symbols-outlined {
  font-size: 26px;
  color: #fff;
  font-variation-settings: 'FILL' 1;
}
.ne-pwa-settings-card__body { display: flex; flex-direction: column; gap: 2px; }
.ne-pwa-settings-card__title { font-size: 18px; font-weight: 800; color: #fff; }
.ne-pwa-settings-card__sub { font-size: 13px; color: rgba(255,255,255,0.8); }
.ne-pwa-settings-card__btn {
  background: #fff;
  color: #1a73e8;
  border: none;
  border-radius: 100px;
  padding: 13px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  width: 100%;
  transition: transform 0.12s;
}
.ne-pwa-settings-card__btn:active { transform: scale(0.97); }

/* One-time install nudge — a delicate, dismissible prompt shown once on a
   RETURN visit when the PWA is installable and not already installed. Reuses
   installPWA() (the Settings-card action). Off-screen when closed (no opacity-
   only click-trap); slides up via .is-open. Under prefers-reduced-motion the
   P1 catch-all drops the transition, so it simply appears. */
.ne-install-nudge {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(74px + env(safe-area-inset-bottom, 0px));
  z-index: 950;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 11px 12px;
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.16), 0 2px 8px rgba(0, 0, 0, 0.07);
  transform: translateY(170%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
}
.ne-install-nudge.is-open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.ne-install-nudge__icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, #3390ec, #1a73e8);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ne-install-nudge__icon .material-symbols-outlined {
  color: #fff;
  font-size: 23px;
  font-variation-settings: 'FILL' 1;
}
.ne-install-nudge__body { flex: 1; min-width: 0; }
.ne-install-nudge__title {
  font-size: 14px;
  font-weight: 700;
  color: #1c1c1e;
  line-height: 1.2;
}
.ne-install-nudge__sub {
  font-size: 12px;
  color: #8e8e93;
  line-height: 1.3;
  margin-top: 1px;
}
.ne-install-nudge__btn {
  flex-shrink: 0;
  background: #3390ec;
  color: #fff;
  border: none;
  border-radius: 100px;
  padding: 9px 15px;
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.1s;
}
.ne-install-nudge__btn:active { transform: scale(0.95); }
.ne-install-nudge__close {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  cursor: pointer;
  color: #8e8e93;
  font-size: 18px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  -webkit-tap-highlight-color: transparent;
}
.ne-install-nudge__close:active { background: rgba(0, 0, 0, 0.06); }

/* Shared empty-state — a friendly SVG illustration + message (+ optional CTA)
   for "nothing here yet" surfaces (Profile reviews/saved, search no-results,
   forum, sponsors). Rendered via window.zoirEmptyHTML(illus, title, opts);
   illustrations live in window.ZoirEmptyIllus. One look everywhere. */
.ne-empty { text-align: center; padding: 44px 24px 40px; }
.ne-empty__illus { width: 80px; height: 80px; margin: 0 auto 16px; }
.ne-empty__illus svg { width: 100%; height: 100%; display: block; }
.ne-empty__title {
  font-size: 14px;
  color: #8e8e93;
  line-height: 1.5;
  max-width: 280px;
  margin: 0 auto;
}
.ne-empty__cta {
  margin-top: 18px;
  padding: 11px 24px;
  border-radius: 14px;
  border: none;
  background: #3390ec;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(51, 144, 236, 0.22);
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.1s;
}
.ne-empty__cta:active { transform: scale(0.97); }

/* Hamburger (☰) restored: opens the slide-in drawer menu. Drawer + backdrop
   are controlled by their .open class (transform/opacity), so no display:none. */

/* ── Side nav — hidden on mobile ─────────────────────────────────── */
.zoir-side-nav { display: none; }

/* ── Desktop layout (≥ 1024px): fixed sidebar + content column ─────
   The [side nav + content] block (220 + 1000 = 1220px) is centred as ONE unit
   on wide screens (X/Twitter style): symmetric gray margins on both sides
   instead of all the empty space dumped on the right. The two calc() offsets
   below derive from that 1220px group width — keep them in sync:
     group left  = (100vw − 1220) / 2  = 50vw − 610px   → side nav `left`
     content left = group left + 220   = 50vw − 390px   → #app-shell margin-left
   max() keeps the block flush-left once the viewport is narrower than 1220px. */
@media (min-width: 1024px) {
  :root { --snav-width: 220px; }
  body { background: #e8eaed; }

  .zoir-side-nav {
    display: flex;
    flex-direction: column;
    position: fixed;
    left: max(0px, calc(50vw - 610px)); top: 0; bottom: 0;
    width: var(--snav-width);
    box-sizing: border-box;
    background: #fff;
    border-right: 1px solid rgba(0,0,0,.07);
    padding: 0 8px 20px;
    z-index: 200;
    overflow-y: auto;
  }
  .zoir-side-nav__logo {
    display: flex; align-items: center; justify-content: center;
    padding: 18px 8px 22px;
    font-size: 22px; font-weight: 800; cursor: pointer; letter-spacing: -0.3px;
    user-select: none; text-decoration: none;
  }
  .zoir-side-nav__logo .ne-logo__six { color: #2d6cdf; }
  .zoir-side-nav__logo .ne-logo__oy  { color: #1c1c1e; }
  .zoir-side-nav__logo .ne-logo__tld { color: #8e8e93; font-size: 0.68em; vertical-align: 0.1em; }
  .zoir-side-nav__items { flex: 1; display: flex; flex-direction: column; gap: 2px; }
  .zoir-side-nav__bottom {
    display: flex; flex-direction: column; gap: 2px;
    border-top: 1px solid rgba(0,0,0,.06); padding-top: 10px; margin-top: 8px;
  }
  .zoir-side-nav__item {
    display: flex; align-items: center; gap: 12px;
    padding: 9px 14px; border-radius: 12px;
    border: none; background: transparent; cursor: pointer;
    width: 100%; text-align: left; font-family: inherit;
    font-size: 14px; font-weight: 500; color: #3c3c43;
    transition: background 0.12s; -webkit-tap-highlight-color: transparent;
  }
  .zoir-side-nav__item:hover { background: rgba(0,0,0,.04); }
  .zoir-side-nav__item:active { background: rgba(0,0,0,.07); }
  .zoir-side-nav__item .material-symbols-outlined {
    font-size: 22px; color: #3c3c43; flex-shrink: 0; transition: color 0.12s;
  }
  .zoir-side-nav__item--active { background: #EAF4FD; color: #3390EC; }
  .zoir-side-nav__item--active .material-symbols-outlined { color: #3390EC; }

  #app-shell { margin-left: max(var(--snav-width), calc(50vw - 390px)); max-width: 1000px; background: #fff; }
  .zoir-bottom-nav { display: none !important; }
  .ne-header-btn--menu { visibility: hidden !important; pointer-events: none !important; }
}

/* ── Hide Guide tabs — navigation via bottom nav buttons only ─────────── */
.guide-module .guide-seg-control,
.guide-module .guide-seg-row2 {
  display: none !important;
}
/* ── Bottom nav — Telegram-style floating pill ──────────────────────────
   Detached rounded bar inset from the screen edges, frosted white, soft
   shadow. Active item = light-blue rounded highlight with OUTLINE blue icon
   (Telegram keeps icons outline even when active). */
.zoir-bottom-nav {
  position: fixed;
  bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  left: 10px;
  right: 10px;
  height: 56px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(0, 0, 0, 0.05);
  /* Full capsule — rounded ends like the Telegram reference (radius clamps to
     half the height, giving semicircular left/right ends). */
  border-radius: 999px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.06);
  display: flex;
  align-items: stretch;
  z-index: 900;
  padding: 6px 12px;
  gap: 2px;
  /* Keep the active item's highlight inside the capsule's rounded ends. */
  overflow: hidden;
}
.zoir-bottom-nav__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  cursor: pointer;
  border: none;
  background: transparent;
  border-radius: 18px;
  padding: 4px;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.18s ease, color 0.15s;
  position: relative;
}
.zoir-bottom-nav__item:active { background: rgba(0, 0, 0, 0.04); }
.zoir-bottom-nav__icon {
  font-size: 24px;
  color: #1c1c1e;
  font-variation-settings: 'FILL' 0, 'wght' 400;
  transition: color 0.15s;
}
.zoir-bottom-nav__label {
  font-size: 11px;
  font-weight: 500;
  color: #1c1c1e;
  transition: color 0.15s, font-weight 0.1s;
  line-height: 1.05;
  text-align: center;
}
.zoir-bottom-nav__item--active {
  background: #EAF4FD;
}
.zoir-bottom-nav__item--active .zoir-bottom-nav__icon {
  color: #3390EC;
  font-variation-settings: 'FILL' 0, 'wght' 500;
}
.zoir-bottom-nav__item--active .zoir-bottom-nav__label {
  color: #3390EC;
  font-weight: 600;
}
/* Scent badge — count of farm reviews added since the worker last opened
   «Фермы». Self-clearing: baseline is re-stored every time the tab is opened,
   so it only lights up for genuinely new activity (no permanent nag).
   Populated by window.updateFarmsScent() in index.html; decorative (the
   reviews themselves live in-tab), so aria-hidden on the span. */
.zoir-bottom-nav__badge {
  position: absolute;
  top: 3px;
  left: calc(50% + 3px);
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #3390EC;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  border-radius: 999px;
  border: 1.5px solid rgba(255, 255, 255, 0.95);
  pointer-events: none;
}
.zoir-bottom-nav__badge[hidden] { display: none; }
/* Side-nav variant (desktop): the item is a horizontal row, so the badge sits
   at the far right via margin-left:auto rather than absolute-over-the-icon. */
.zoir-side-nav__badge {
  margin-left: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #3390EC;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  border-radius: 999px;
  pointer-events: none;
}
.zoir-side-nav__badge[hidden] { display: none; }
/* Push content above the floating bottom nav (height + gaps + breathing).
   Plain modules use this; inset pages override the shared padding shorthand
   (line ~980) so re-assert bottom clearance for them too. Full-bleed pages
   (.ne-page, e.g. the wiki list) already reserve their own bottom space. */
#module-container { padding-bottom: 86px; }
#module-container:has(.ne-page--inset) {
  padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}
#module-container:has(.ne-finance) { padding: 0; }

/* Finance tab pill needs a little breathing room since container padding is gone */
.ne-finance .ne-seg-control.finance-tabs { margin: 12px 16px 0; }

/* Hero bleeds edge-to-edge, card section gets side padding */
.ne-finance-hero { margin-bottom: 0; border-radius: 0 0 var(--ne-radius-xl) var(--ne-radius-xl); }
.ne-finance-forms { padding: 12px 16px 0; }
.ne-finance-actions { padding: 0 16px; }
.ne-finance .finance-card.ne-finance-workplace { margin-bottom: 0; }
.ne-finance-forms { gap: 10px; }

/* Accordion sections */
.ne-finance .finance-card:not(.ne-finance-workplace):not(.hero-v3):not(.ne-finance-agent-card):not(.finance-desktop-dashboard) {
  margin: 0 16px;
}

/* в”Ђв”Ђ Settings input width helpers в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-input--w60  { width: 60px; }
.ne-settings-input--w90  { width: 90px; }
.ne-settings-input--w120 { width: 120px; }
.ne-settings-input--w140 { width: 140px; }
.ne-settings-input--center { text-align: center; width: 60px; }

/* в”Ђв”Ђ Settings holiday wrap в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-holiday-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
}

.ne-settings-pct-suffix {
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-primary);
}

/* в”Ђв”Ђ Holiday preview block в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-holiday-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  margin: 8px 0;
  background: linear-gradient(135deg, #e8f0fe 0%, #f8f9ff 100%);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.15);
  border-radius: var(--ne-radius-md);
}

.ne-settings-holiday-preview__col { display: flex; flex-direction: column; gap: 4px; }

.ne-settings-holiday-preview__label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ne-muted);
}

.ne-settings-holiday-preview__row { display: flex; align-items: baseline; gap: 8px; }

.ne-settings-holiday-preview__amount {
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-primary);
  letter-spacing: -0.02em;
}

.ne-settings-holiday-preview__pct {
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-muted);
}

.ne-settings-holiday-preview__icon .material-symbols-outlined {
  font-size: 28px;
  color: var(--ne-primary);
  opacity: 0.4;
  font-variation-settings: 'FILL' 1;
}

/* в”Ђв”Ђ Tax rate chips в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-chip--green { background: #e6f4ea; color: #137333; border-radius: var(--ne-radius-sm); padding: 4px 10px; font-size: 12px; font-weight: 700; }
.ne-settings-chip--blue  { background: #e8f0fe; color: var(--ne-primary); border-radius: var(--ne-radius-sm); padding: 4px 10px; font-size: 12px; font-weight: 700; }
.ne-settings-chip--amber { background: #fef7e0; color: #b06000; border-radius: var(--ne-radius-sm); padding: 4px 10px; font-size: 12px; font-weight: 700; }
.ne-settings-chip--rose  { background: #fce8e6; color: var(--ne-error); border-radius: var(--ne-radius-sm); padding: 4px 10px; font-size: 12px; font-weight: 700; }

/* в”Ђв”Ђ Settings icon color helpers (extended) в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-icon--pay      { color: #0d652d; }
.ne-settings-icon--date     { color: var(--ne-cyan); }
.ne-settings-icon--payments { color: var(--ne-primary); }
.ne-settings-icon--holiday  { color: var(--ne-amber-text); }
.ne-settings-icon--sick     { color: var(--ne-error); }
.ne-settings-icon--days     { color: var(--ne-violet); }
.ne-settings-icon--pension  { color: var(--ne-muted); }
.ne-settings-icon--notify-jobs    { color: #137333; }
.ne-settings-icon--notify-reviews { color: var(--ne-primary); }
.ne-settings-icon--danger   { color: var(--ne-error); }
.ne-settings-icon--link     { color: var(--ne-primary); }
.ne-settings-icon--tax-green { color: #137333; }
.ne-settings-icon--tax-blue  { color: var(--ne-primary); }
.ne-settings-icon--tax-amber { color: var(--ne-amber-text); }
.ne-settings-icon--tax-rose  { color: var(--ne-error); }

/* в”Ђв”Ђ Support cards в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-support-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-radius: var(--ne-radius-md);
  margin-bottom: 8px;
  cursor: pointer;
  transition: transform 0.35s var(--ne-ease-spring), box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.ne-settings-support-card:active { transform: scale(0.98); }

.ne-settings-support-card--uzb {
  background: linear-gradient(135deg, #e8f0fe 0%, #f8f9ff 100%);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.2);
}

.ne-settings-support-card--rus {
  background: linear-gradient(135deg, #e6f4ea 0%, #f8fff9 100%);
  border: 1px solid rgba(26, 174, 57, 0.2);
}

.ne-settings-support-card--ads {
  background: linear-gradient(135deg, #fef7e0 0%, #fffef5 100%);
  border: 1px solid rgba(249, 171, 0, 0.25);
}

.ne-settings-support-card__left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ne-settings-support-card__icon {
  width: 40px;
  height: 40px;
  border-radius: var(--ne-radius-sm);
  background: rgba(var(--ne-primary-rgb), 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ne-settings-support-card__icon .material-symbols-outlined {
  font-size: 20px;
  color: var(--ne-primary);
}

.ne-settings-support-card__title {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
}

.ne-settings-support-card__sub {
  display: block;
  font-size: 11px;
  color: var(--ne-muted);
  margin-top: 2px;
}

.ne-settings-support-card__action .material-symbols-outlined {
  font-size: 20px;
  color: var(--ne-hint);
}

/* в”Ђв”Ђ Notification tip в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-notify-pad { padding: 12px 16px; }

.ne-settings-notify-tip {
  display: flex;
  gap: 12px;
  padding: 14px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
}

.ne-settings-notify-tip__icon {
  font-size: 20px;
  color: var(--ne-primary);
  flex-shrink: 0;
  font-variation-settings: 'FILL' 1;
}

.ne-settings-notify-tip__text {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.55;
  margin: 0 0 12px;
}

.ne-settings-notify-tip__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--ne-primary);
  color: #fff;
  border: none;
  border-radius: var(--ne-radius-sm);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  transition: transform 0.35s var(--ne-ease-spring);
}

.ne-settings-notify-tip__btn:active { transform: scale(0.97); }
.ne-settings-notify-tip__btn .material-symbols-outlined { font-size: 16px; }

/* в”Ђв”Ђ Settings panel bottom margin variant в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-panel--mb20 { margin-bottom: 20px; }

/* в”Ђв”Ђ Settings list padding variant в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-list--pad .ne-settings-support-card:last-child { margin-bottom: 0; }

/* в”Ђв”Ђ Finance CTA button in settings в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-settings-finance-cta {
  margin-top: 16px;
  width: 100%;
  padding: 13px 20px;
  background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet));
  box-shadow: 0 4px 16px rgba(var(--ne-primary-rgb), 0.3);
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Rights Module — "My Rights on the Farm"
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* Header */
.rights-module-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 0 4px;
}

.rights-module-icon {
  width: 52px;
  height: 52px;
  border-radius: var(--ne-radius-md);
  background: linear-gradient(145deg, var(--ne-primary), var(--ne-violet));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 6px 18px rgba(var(--ne-primary-rgb), 0.28);
}

.rights-module-icon .material-symbols-outlined {
  font-size: 28px;
  color: #fff;
  font-variation-settings: 'FILL' 1;
}

.rights-module-title {
  font-size: 22px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 4px;
  letter-spacing: -0.02em;
}

.rights-module-sub {
  font-size: 13px;
  color: var(--ne-muted);
  margin: 0;
}

/* Segmented tabs with icons */
.rights-seg-control {
  margin-bottom: 16px;
}

.rights-seg-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 8px 4px;
  font-size: 11px;
}

.rights-seg-item .material-symbols-outlined {
  font-size: 18px;
  font-variation-settings: 'FILL' 0;
}

.rights-seg-item.active .material-symbols-outlined {
  font-variation-settings: 'FILL' 1;
}

/* Hero badge inside card */
.rights-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(var(--ne-primary-rgb), 0.08);
  color: var(--ne-primary);
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 16px;
}

.rights-hero-badge .material-symbols-outlined { font-size: 16px; }

.rights-hero-badge--warn {
  background: rgba(249, 171, 0, 0.12);
  color: #b06000;
}

.rights-hero-badge--violet {
  background: rgba(124, 77, 255, 0.1);
  color: var(--ne-violet);
}

.rights-hero-badge--red {
  background: rgba(197, 34, 31, 0.08);
  color: var(--ne-error);
}

/* Section title */
.rights-section-title {
  font-size: 16px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 14px;
  letter-spacing: -0.02em;
}

/* Right item row */
.rights-right-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 14px 0;
  border-bottom: 1px solid var(--ne-border);
}

.rights-right-item:last-child { border-bottom: none; }

.rights-right-icon {
  width: 44px;
  height: 44px;
  border-radius: var(--ne-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.rights-right-icon .material-symbols-outlined {
  font-size: 22px;
  font-variation-settings: 'FILL' 1;
}

.rights-right-icon--green  { background: #e6f4ea; color: #137333; }
.rights-right-icon--blue   { background: #e8f0fe; color: var(--ne-primary); }
.rights-right-icon--amber  { background: #fef7e0; color: #b06000; }
.rights-right-icon--violet { background: rgba(124,77,255,0.1); color: var(--ne-violet); }

.rights-right-body { flex: 1; min-width: 0; }

.rights-right-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 4px;
}

.rights-right-value {
  font-size: 18px;
  font-weight: 800;
  color: var(--ne-primary);
  margin-bottom: 4px;
  letter-spacing: -0.02em;
}

.rights-right-note {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.55;
}

/* Illegal list */
.ne-card--danger {
  background: linear-gradient(135deg, #fce8e6 0%, #fff8f7 100%);
  border-color: rgba(197, 34, 31, 0.25);
}

.ne-card--danger .ne-card__warn-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-error);
}

.rights-illegal-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rights-illegal-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: #c5221f;
  line-height: 1.5;
}

.rights-illegal-item .material-symbols-outlined {
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 1px;
  color: var(--ne-error);
}

/* Callout info */
.ne-callout--info {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 14px;
  background: linear-gradient(135deg, #e8f0fe, #f8faff);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.2);
  border-radius: var(--ne-radius-md);
  font-size: 13px;
  color: var(--ne-primary-active);
  line-height: 1.55;
}

/* Callout warn */
.ne-callout--warn {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 12px;
  padding: 14px;
  background: linear-gradient(135deg, #fef7e0, #fffef5);
  border: 1px solid rgba(249, 171, 0, 0.3);
  border-radius: var(--ne-radius-md);
  font-size: 13px;
  color: #7c4a00;
  line-height: 1.55;
}

/* Cost table */
.rights-cost-table {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 8px;
}

.rights-cost-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--ne-border);
}

.rights-cost-row:last-child { border-bottom: none; }

.rights-cost-row--total {
  padding-top: 14px;
  margin-top: 4px;
  border-top: 2px solid var(--ne-border);
  border-bottom: none;
}

.rights-cost-icon {
  font-size: 20px;
  color: var(--ne-muted);
  flex-shrink: 0;
  width: 24px;
  text-align: center;
}

.rights-cost-body { flex: 1; min-width: 0; }

.rights-cost-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--ne-ink);
}

.rights-cost-note {
  font-size: 11px;
  color: var(--ne-hint);
  margin-top: 2px;
}

.rights-cost-amount {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  white-space: nowrap;
}

.rights-cost-amount--total {
  font-size: 16px;
  color: var(--ne-primary);
}

.rights-costs-intro {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.55;
  margin: 0 0 16px;
}

/* Scam examples */
.rights-scam-examples {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}

.rights-scam-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ne-error);
  font-style: italic;
}

.rights-scam-item .material-symbols-outlined {
  font-size: 16px;
  flex-shrink: 0;
}

/* Earnings grid */
.rights-earnings-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 8px;
}

.rights-earnings-card {
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  padding: 14px 10px;
  text-align: center;
  border: 1px solid var(--ne-border);
}

.rights-earnings-card--highlight {
  background: linear-gradient(135deg, #e8f0fe, #f0f4ff);
  border-color: rgba(var(--ne-primary-rgb), 0.2);
}

.rights-earnings-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--ne-hint);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 6px;
}

.rights-earnings-value {
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-primary);
  letter-spacing: -0.02em;
}

.rights-earnings-note {
  font-size: 10px;
  color: var(--ne-hint);
  margin-top: 4px;
}

/* Contact items */
.rights-contact-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--ne-border);
}

.rights-contact-item:last-child { border-bottom: none; }

.rights-contact-item--emergency {
  background: linear-gradient(135deg, #fce8e6, #fff8f7);
  margin: 0 -20px;
  padding: 14px 20px;
  border-radius: var(--ne-radius-md);
  border: 1px solid rgba(197, 34, 31, 0.2);
  margin-bottom: 8px;
}

.rights-contact-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--ne-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.rights-contact-icon .material-symbols-outlined {
  font-size: 24px;
  font-variation-settings: 'FILL' 1;
}

.rights-contact-item--emergency .rights-contact-icon {
  background: var(--ne-error);
  color: #fff;
}

.rights-contact-icon--blue   { background: #e8f0fe; color: var(--ne-primary); }
.rights-contact-icon--green  { background: #e6f4ea; color: #137333; }
.rights-contact-icon--violet { background: rgba(124,77,255,0.1); color: var(--ne-violet); }
.rights-contact-icon--amber  { background: #fef7e0; color: #b06000; }

.rights-contact-body { flex: 1; min-width: 0; }

.rights-contact-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 2px;
}

.rights-contact-number {
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-primary);
  letter-spacing: -0.02em;
  margin-bottom: 4px;
}

.rights-contact-note {
  font-size: 12px;
  color: var(--ne-muted);
  line-height: 1.5;
}

.rights-call-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: var(--ne-primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: transform 0.2s var(--ne-ease-spring), background 0.2s;
  box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.3);
}

.rights-call-btn:active {
  transform: scale(0.93);
  background: var(--ne-primary-active);
}

.rights-call-btn .material-symbols-outlined { font-size: 20px; }

/* в”Ђв”Ђ Finance: How-to Tax Refund block в”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђв”Ђ */
.ne-finance-howto-card {
  border-left: none;
}

.ne-finance-howto-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: #137333;
  margin-bottom: 16px;
}

.ne-finance-howto-head .material-symbols-outlined {
  font-size: 22px;
  font-variation-settings: 'FILL' 1;
}

.ne-finance-howto-steps-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ne-hint);
  padding: 12px 0 4px;
}

.ne-finance-howto-steps {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 16px;
}

.ne-finance-howto-step {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.ne-finance-howto-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, #137333, #1aae39);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}

.ne-finance-howto-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
}

.ne-finance-howto-text strong {
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-ink);
}

.ne-finance-howto-text span {
  font-size: 12px;
  color: var(--ne-muted);
  line-height: 1.5;
}

.ne-finance-howto-btn {
  width: 100%;
  background: linear-gradient(135deg, #137333, #1aae39);
  color: #fff;
  border: none;
  border-radius: var(--ne-radius-sm);
  padding: 12px 16px;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  margin-bottom: 12px;
  transition: transform 0.2s var(--ne-ease-spring), opacity 0.2s;
}

.ne-finance-howto-btn:active {
  transform: scale(0.97);
  opacity: 0.9;
}

.ne-finance-howto-warn {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 10px 12px;
  background: rgba(249, 171, 0, 0.1);
  border: 1px solid rgba(249, 171, 0, 0.3);
  border-radius: var(--ne-radius-sm);
  font-size: 12px;
  color: #7c4a00;
  line-height: 1.5;
}

.ne-finance-howto-warn .material-symbols-outlined {
  font-size: 16px;
  color: var(--ne-amber-text);
  flex-shrink: 0;
  margin-top: 1px;
  font-variation-settings: 'FILL' 1;
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Guide Module v2 — tabs, first steps, pack checklist
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

/* Segmented tabs with icons */
.guide-seg-control {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 8px;
  padding: 6px;
  border-radius: 20px;
  background:
    radial-gradient(circle at 12% 0%, rgba(var(--ne-primary-rgb), 0.10), transparent 34%),
    linear-gradient(180deg, rgba(248, 250, 255, 0.96), rgba(241, 246, 253, 0.92));
  border: 1px solid rgba(var(--ne-primary-rgb), 0.12);
  box-shadow: 0 2px 8px rgba(60, 64, 67, 0.08);
}

.guide-seg-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 0;
  min-height: 52px;
  padding: 9px 8px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  color: #5f6368;
  opacity: 1;
  background: transparent;
  transition: transform 0.2s var(--ne-ease-spring), background 0.2s, color 0.2s, box-shadow 0.2s;
}

.guide-seg-item span:not(.material-symbols-outlined) {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.guide-seg-item .material-symbols-outlined {
  font-size: 20px;
  color: #6f747c;
  font-variation-settings: 'FILL' 0;
}

.guide-seg-item.active {
  color: #fff;
  background:
    radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.26), transparent 38%),
    linear-gradient(135deg, #1a73e8 0%, #4285f4 100%);
  box-shadow: 0 6px 16px rgba(var(--ne-primary-rgb), 0.24);
}

.guide-seg-item.active .material-symbols-outlined {
  color: #fff;
  font-variation-settings: 'FILL' 1;
}

/* Badge inside card */
.guide-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  margin-bottom: 16px;
}
.guide-badge .material-symbols-outlined { font-size: 15px; }
.guide-badge--blue   { background: rgba(var(--ne-primary-rgb), 0.08); color: var(--ne-primary); }
.guide-badge--amber  { background: rgba(249,171,0,0.1); color: #b06000; }

/* Day timeline */
.guide-day-timeline { display: flex; flex-direction: column; gap: 20px; }

.guide-day-block { display: flex; flex-direction: column; gap: 10px; }

.guide-day-label {
  display: flex;
  align-items: center;
  gap: 10px;
}

.guide-day-num {
  min-width: 36px;
  height: 36px;
  border-radius: var(--ne-radius-sm);
  background: linear-gradient(145deg, var(--ne-primary), var(--ne-violet));
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(var(--ne-primary-rgb), 0.25);
}

.guide-day-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-ink);
  letter-spacing: -0.01em;
}

.guide-day-items {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 46px;
}

.guide-day-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
}

.guide-day-item .material-symbols-outlined {
  font-size: 20px;
  color: var(--ne-primary);
  flex-shrink: 0;
  margin-top: 1px;
  font-variation-settings: 'FILL' 1;
}

.guide-day-item strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 4px;
}

.guide-day-item p {
  font-size: 12px;
  color: var(--ne-muted);
  line-height: 1.55;
  margin: 0;
}

.guide-day-item--warn {
  background: linear-gradient(135deg, #fef7e0, #fffef5);
  border-color: rgba(249,171,0,0.3);
}
.guide-day-item--warn .material-symbols-outlined { color: #b06000; }

.guide-day-item--critical {
  background: linear-gradient(135deg, #fce8e6, #fff8f7);
  border-color: rgba(197,34,31,0.2);
}
.guide-day-item--critical .material-symbols-outlined { color: var(--ne-error); }

.guide-day-item--green {
  background: linear-gradient(135deg, #e6f4ea, #f2f9f5);
  border-color: rgba(19,115,51,0.2);
}
.guide-day-item--green .material-symbols-outlined { color: #137333; }

/* Action button inside day item */
.guide-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 8px 14px;
  border: none;
  border-radius: var(--ne-radius-sm);
  background: var(--ne-primary);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.2s var(--ne-ease-spring);
}
.guide-action-btn:active { transform: scale(0.97); }
.guide-action-btn--green { background: #137333; }
.guide-action-btn .material-symbols-outlined { font-size: 15px; }

/* Phone row */
.guide-phone-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--ne-muted);
}
.guide-phone-row .material-symbols-outlined { font-size: 15px; color: var(--ne-primary); }

/* Mini checklist */
.guide-checklist-mini {
  list-style: none;
  padding: 0;
  margin: 6px 0 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.guide-checklist-mini li {
  font-size: 12px;
  color: var(--ne-muted);
  padding-left: 14px;
  position: relative;
}
.guide-checklist-mini li::before { content: "\2022"; position: absolute; left: 0; color: #137333; }
.guide-checklist-mini--red li::before { color: var(--ne-error); }

/* Emergency contacts grid */
.guide-contacts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}

.guide-contact-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border-radius: var(--ne-radius-md);
  text-decoration: none;
  border: 1px solid var(--ne-border);
  transition: transform 0.2s var(--ne-ease-spring);
}
.guide-contact-item:active { transform: scale(0.97); }

.guide-contact-num {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.guide-contact-desc { font-size: 11px; color: var(--ne-muted); line-height: 1.3; }

.guide-contact-item--red   { background: #fce8e6; border-color: rgba(197,34,31,0.2); }
.guide-contact-item--red .guide-contact-num { color: var(--ne-error); }
.guide-contact-item--blue  { background: #e8f0fe; border-color: rgba(var(--ne-primary-rgb),0.2); }
.guide-contact-item--blue .guide-contact-num { color: var(--ne-primary); }
.guide-contact-item--green { background: #e6f4ea; border-color: rgba(19,115,51,0.2); }
.guide-contact-item--green .guide-contact-num { color: #137333; }
.guide-contact-item--violet { background: rgba(124,77,255,0.08); border-color: rgba(124,77,255,0.2); }
.guide-contact-item--violet .guide-contact-num { color: var(--ne-violet); }

/* Pack checklist */
.guide-pack-list { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }

.guide-pack-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
}

.guide-pack-icon { font-size: 22px; flex-shrink: 0; margin-top: 1px; }

.guide-pack-item strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 3px;
}
.guide-pack-item p { font-size: 12px; color: var(--ne-muted); line-height: 1.5; margin: 0; }

.guide-pack-item--critical {
  background: linear-gradient(135deg, #e8f0fe, #f0f4ff);
  border-color: rgba(var(--ne-primary-rgb), 0.2);
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Guide NI Number tab styles
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.guide-badge--red {
  background: rgba(197,34,31,0.08);
  color: var(--ne-error);
}

.guide-ni-hero { margin: 4px 0 8px; }

.guide-ni-stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.guide-ni-stat {
  padding: 12px 8px;
  border-radius: var(--ne-radius-md);
  text-align: center;
  border: 1px solid var(--ne-border);
}

.guide-ni-stat__val {
  display: block;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 4px;
}

.guide-ni-stat__lbl {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--ne-hint);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.3;
}

.guide-ni-stat--red   { background: #fce8e6; border-color: rgba(197,34,31,0.2); }
.guide-ni-stat--red .guide-ni-stat__val { color: var(--ne-error); }
.guide-ni-stat--green { background: #e6f4ea; border-color: rgba(19,115,51,0.2); }
.guide-ni-stat--green .guide-ni-stat__val { color: #137333; }
.guide-ni-stat--blue  { background: #e8f0fe; border-color: rgba(var(--ne-primary-rgb),0.2); }
.guide-ni-stat--blue .guide-ni-stat__val { color: var(--ne-primary); }

/* Tax code cards */
.guide-ni-codes { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }

.guide-ni-code {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
}

.guide-ni-code__name {
  font-size: 14px;
  font-weight: 800;
  font-family: monospace;
  min-width: 72px;
  flex-shrink: 0;
  padding: 4px 8px;
  border-radius: 6px;
  text-align: center;
  margin-top: 1px;
}

.guide-ni-code strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 3px;
}

.guide-ni-code p {
  font-size: 12px;
  color: var(--ne-muted);
  line-height: 1.5;
  margin: 0;
}

.guide-ni-code--green { background: #e6f4ea; border-color: rgba(19,115,51,0.2); }
.guide-ni-code--green .guide-ni-code__name { background: #137333; color: #fff; }

.guide-ni-code--red { background: #fce8e6; border-color: rgba(197,34,31,0.2); }
.guide-ni-code--red .guide-ni-code__name { background: var(--ne-error); color: #fff; }

.guide-ni-code--amber { background: #fef7e0; border-color: rgba(249,171,0,0.3); }
.guide-ni-code--amber .guide-ni-code__name { background: #b06000; color: #fff; }

/* Timeline table */
.guide-ni-timeline-table { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }

.guide-ni-trow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-sm);
  border: 1px solid var(--ne-border);
}

.guide-ni-trow__period { font-size: 13px; color: var(--ne-ink); font-weight: 600; }

.guide-ni-trow__time {
  font-size: 13px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
}

.guide-ni-trow__time--warn { background: #fef7e0; color: #b06000; }
.guide-ni-trow__time--ok   { background: #e6f4ea; color: #137333; }

/* Phone items */
.guide-ni-phones { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }

.guide-ni-phone-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s var(--ne-ease-spring);
}

.guide-ni-phone-item:active { transform: scale(0.97); }

.guide-ni-phone-item .material-symbols-outlined {
  font-size: 22px;
  color: var(--ne-primary);
  flex-shrink: 0;
  font-variation-settings: 'FILL' 1;
}

.guide-ni-phone-item strong {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: var(--ne-primary);
  letter-spacing: -0.01em;
}

.guide-ni-phone-item span {
  font-size: 11px;
  color: var(--ne-muted);
  line-height: 1.3;
}

/* Scam list */
.guide-ni-scams { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }

.guide-ni-scam {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--ne-error);
  padding: 8px 12px;
  background: rgba(197,34,31,0.05);
  border-radius: var(--ne-radius-sm);
  line-height: 1.5;
}

.guide-ni-scam .material-symbols-outlined {
  font-size: 16px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Wiki Risk Score badge
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.ne-wiki-farm-head-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.wiki-risk-badge {
  font-size: 16px;
  line-height: 1;
  cursor: help;
  flex-shrink: 0;
  transition: transform 0.2s var(--ne-ease-spring);
}

.wiki-risk-badge:hover { transform: scale(1.2); }

.wiki-risk-badge--green { filter: none; }
.wiki-risk-badge--amber { filter: none; }
.wiki-risk-badge--red   { filter: none; animation: wiki-risk-pulse 2s ease-in-out infinite; }

@keyframes wiki-risk-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Guide — Country operator matrix
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.guide-country-matrix { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }

.guide-country-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  border: 1px solid var(--ne-border);
}

.guide-country-flag { font-size: 28px; flex-shrink: 0; margin-top: 2px; }

.guide-country-body { flex: 1; min-width: 0; }

.guide-country-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 8px;
}

.guide-country-ops {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

.guide-op-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid var(--ne-border);
  background: var(--ne-surface-solid);
  color: var(--ne-ink);
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.2s var(--ne-ease-spring), background 0.2s;
}

.guide-op-chip:active { transform: scale(0.95); }

.guide-op-chip--primary {
  background: var(--ne-primary);
  color: #fff;
  border-color: var(--ne-primary);
}

.guide-country-note {
  font-size: 11px;
  color: var(--ne-hint);
  line-height: 1.4;
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Guide — second row of tabs (Rights)
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.guide-seg-row2 {
  margin-top: 0;
  margin-bottom: 16px;
  background:
    radial-gradient(circle at 88% 0%, rgba(124, 77, 255, 0.10), transparent 32%),
    linear-gradient(180deg, rgba(250, 248, 255, 0.96), rgba(244, 241, 253, 0.92));
  border-color: rgba(124, 77, 255, 0.12);
}

.guide-seg-row2 .ne-seg-item.active {
  color: #fff;
  background:
    radial-gradient(circle at 20% 12%, rgba(255, 255, 255, 0.24), transparent 38%),
    linear-gradient(135deg, #1a73e8 0%, #6f5cf6 100%);
  box-shadow: 0 6px 16px rgba(124, 77, 255, 0.22);
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   Guide — bottom tab navigation buttons ← →
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */

.guide-nav-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 16px 16px 32px;
}

.guide-nav-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  border: none;
  border-radius: var(--ne-radius-md);
  background: linear-gradient(135deg, var(--ne-primary), #4285f4);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.2s var(--ne-ease-spring), box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 4px 14px rgba(var(--ne-primary-rgb), 0.3);
  max-width: 48%;
  min-height: 52px;
}

.guide-nav-btn:active {
  transform: scale(0.96);
  box-shadow: 0 2px 8px rgba(var(--ne-primary-rgb), 0.2);
}

.guide-nav-btn .material-symbols-outlined {
  font-size: 22px;
  flex-shrink: 0;
}

.guide-nav-btn--prev {
  flex-direction: row;
  background: linear-gradient(135deg, #5f6368, #3c4043);
  box-shadow: 0 4px 14px rgba(60,64,67,0.25);
}

.guide-nav-btn--next {
  flex-direction: row;
  margin-left: auto;
}

.guide-nav-btn span:not(.material-symbols-outlined) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}



/* ══════════════════════════════════════════════════════════════════════════════
 * VISA CHECKER MODULE — Phase 11
 * 80% Material 3 Expressive · 20% Neural Expressive
 * ══════════════════════════════════════════════════════════════════════════════ */

/* ── Utility ─────────────────────────────────────────────────────────────── */
.ne-muted {
  color: var(--ne-muted);
  font-size: 14px;
  line-height: 1.55;
}

/* ── Visa type list ──────────────────────────────────────────────────────── */
.vc-visa-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 8px 0 0;
}

/* Each visa card — full-width row, like ne-list-row */
.vc-visa-card {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 20px;
  margin: 0 0 1px;
  background: var(--ne-surface-solid);
  border: none;
  border-bottom: 1px solid var(--ne-border);
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s ease;
}

.vc-visa-card:first-child {
  border-radius: var(--ne-radius-lg) var(--ne-radius-lg) 0 0;
  margin: 0 16px 0;
}

.vc-visa-card:last-child {
  border-radius: 0 0 var(--ne-radius-lg) var(--ne-radius-lg);
  border-bottom: none;
  margin: 0 16px 0;
}

.vc-visa-card:only-child {
  border-radius: var(--ne-radius-lg);
}

.vc-visa-card:active {
  background: var(--ne-surface-2);
}

/* Recommended — M3 tonal container */
.vc-visa-card--recommended {
  background: linear-gradient(135deg, #e8f0fe 0%, #f0f4ff 100%);
}

.vc-visa-card--recommended:active {
  background: #dce8fd;
}

/* Icon container */
.vc-visa-card__icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: var(--ne-radius-md);
  background: var(--ne-surface-2);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--ne-primary);
  font-size: 22px;
  transition: transform 0.18s var(--ne-ease-spring);
}

.vc-visa-card--recommended .vc-visa-card__icon-wrap {
  background: linear-gradient(135deg, var(--ne-primary), #4285f4);
  color: #fff;
  box-shadow: 0 4px 12px rgba(26,115,232,0.28);
}

.vc-visa-card:active .vc-visa-card__icon-wrap {
  transform: scale(0.9);
}

.vc-visa-card__body {
  flex: 1;
  min-width: 0;
}

.vc-visa-card__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}

.vc-visa-card__title {
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-ink);
  letter-spacing: -0.01em;
}

.vc-visa-card__desc {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.4;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vc-visa-card__arrow {
  font-size: 20px;
  color: var(--ne-hint);
  flex-shrink: 0;
}

/* Recommended badge pill */
.vc-recommended-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: rgba(26,115,232,0.12);
  color: var(--ne-primary);
  border: 1px solid rgba(26,115,232,0.2);
  white-space: nowrap;
}

/* ── Back button ─────────────────────────────────────────────────────────── */
.vc-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 8px 16px 4px;
  padding: 8px 12px 8px 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ne-muted);
  background: transparent;
  border: none;
  border-radius: var(--ne-radius-sm);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.15s ease, background 0.15s ease;
}

.vc-back-btn:active {
  color: var(--ne-primary);
  background: rgba(var(--ne-primary-rgb), 0.08);
}

.vc-back-btn .material-symbols-outlined {
  font-size: 20px;
}

/* ── Quiz header ─────────────────────────────────────────────────────────── */
.vc-quiz-header {
  padding: 4px 16px 0;
}

.vc-quiz-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.vc-quiz-visa-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-muted);
}

.vc-quiz-visa-chip .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-primary);
}

.vc-step-counter {
  font-size: 13px;
  font-weight: 700;
  color: var(--ne-hint);
  background: var(--ne-surface-2);
  padding: 3px 10px;
  border-radius: 999px;
}

/* Progress bar */
.vc-progress-bar {
  height: 4px;
  border-radius: 999px;
  background: var(--ne-border);
  overflow: hidden;
  margin-bottom: 4px;
}

.vc-progress-bar__fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--ne-primary-2), var(--ne-primary));
  transition: width 0.4s var(--ne-ease-out);
  min-width: 4px;
}

/* ── Question card ───────────────────────────────────────────────────────── */
.vc-question-card {
  margin-top: 8px;
}

.vc-question-text {
  font-size: 18px;
  font-weight: 700;
  color: var(--ne-ink);
  line-height: 1.4;
  margin: 0 0 20px;
  letter-spacing: -0.01em;
}

/* Options container */
.vc-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Boolean: two big buttons side by side */
.vc-options--bool {
  flex-direction: row;
  gap: 10px;
}

.vc-options--bool .vc-option-btn {
  flex: 1;
}

/* Option button — M3 Expressive tonal */
.vc-option-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 52px;
  padding: 12px 16px;
  border-radius: var(--ne-radius-md);
  border: 1.5px solid var(--ne-border);
  background: var(--ne-surface-solid);
  color: var(--ne-ink);
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    transform 0.15s var(--ne-ease-spring);
}

.vc-option-btn:active {
  transform: scale(0.97);
}

/* Selected state */
.vc-option-btn.vc-option--active {
  background: linear-gradient(135deg, #e8f0fe 0%, #dce8fd 100%);
  border-color: var(--ne-primary);
  color: var(--ne-primary);
}

.vc-option-btn__icon {
  font-size: 22px;
  flex-shrink: 0;
}

.vc-option-btn__radio {
  font-size: 20px;
  flex-shrink: 0;
  color: var(--ne-hint);
}

.vc-option--active .vc-option-btn__radio {
  color: var(--ne-primary);
}

.vc-option-btn__label {
  flex: 1;
  line-height: 1.35;
}

/* Boolean yes/no icons */
.vc-options--bool .vc-option-btn:first-child .vc-option-btn__icon { color: #137333; }
.vc-options--bool .vc-option-btn:last-child  .vc-option-btn__icon { color: var(--ne-error); }
.vc-options--bool .vc-option-btn.vc-option--active:first-child {
  background: linear-gradient(135deg, #e6f4ea, #ceead6);
  border-color: #137333;
  color: #137333;
}
.vc-options--bool .vc-option-btn.vc-option--active:last-child {
  background: linear-gradient(135deg, #fce8e6, #f9c6c3);
  border-color: var(--ne-error);
  color: var(--ne-error);
}

/* ── Result hero ─────────────────────────────────────────────────────────── */
.vc-result-hero {
  margin: 12px 16px 0;
  border-radius: var(--ne-radius-xl);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
}

.vc-result-hero--green {
  background: linear-gradient(145deg, #e6f4ea 0%, #f0faf2 100%);
  border: 1px solid rgba(19,115,51,0.2);
}

.vc-result-hero--amber {
  background: linear-gradient(145deg, #fef7e0 0%, #fffef5 100%);
  border: 1px solid rgba(176,96,0,0.2);
}

.vc-result-hero--red {
  background: linear-gradient(145deg, #fce8e6 0%, #fff8f7 100%);
  border: 1px solid rgba(197,34,31,0.2);
}

.vc-result-hero__icon {
  font-size: 52px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
  animation: vc-pop 0.45s var(--ne-ease-spring) both;
}

@keyframes vc-pop {
  from { transform: scale(0.4); opacity: 0; }
  to   { transform: scale(1);   opacity: 1; }
}

.vc-result-hero--green .vc-result-hero__icon {
  background: linear-gradient(135deg, #e6f4ea, #ceead6);
  color: #137333;
}

.vc-result-hero--amber .vc-result-hero__icon {
  background: linear-gradient(135deg, #fef7e0, #fde68a);
  color: #b06000;
}

.vc-result-hero--red .vc-result-hero__icon {
  background: linear-gradient(135deg, #fce8e6, #f9c6c3);
  color: var(--ne-error);
}

.vc-result-hero__title {
  font-size: 20px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0;
  letter-spacing: -0.02em;
}

.vc-result-hero__date {
  font-size: 12px;
  color: var(--ne-hint);
  margin: 0;
}

/* ── Flag rows (inside ne-card) ──────────────────────────────────────────── */
.vc-flag-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--ne-border);
}

.vc-flag-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.vc-flag-row:first-child {
  padding-top: 0;
}

.vc-flag-row__icon {
  font-size: 22px;
  flex-shrink: 0;
  margin-top: 1px;
}

.vc-flag-row--critical .vc-flag-row__icon { color: var(--ne-error); }
.vc-flag-row--high     .vc-flag-row__icon { color: #b06000; }
.vc-flag-row--medium   .vc-flag-row__icon { color: var(--ne-primary); }

.vc-flag-row__body {
  flex: 1;
  min-width: 0;
}

.vc-flag-row__title {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  margin: 0 0 3px;
}

.vc-flag-row__text {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.5;
  margin: 0 0 6px;
}

.vc-flag-row__rec {
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-ink);
  line-height: 1.45;
  margin: 0;
  padding: 7px 10px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-sm);
  border-left: 3px solid;
}

.vc-flag-row--critical .vc-flag-row__rec { border-color: var(--ne-error); }
.vc-flag-row--high     .vc-flag-row__rec { border-color: #b06000; }
.vc-flag-row--medium   .vc-flag-row__rec { border-color: var(--ne-primary); }

/* ── GOV.UK link ─────────────────────────────────────────────────────────── */
.vc-gov-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border-radius: var(--ne-radius-sm);
  background: rgba(var(--ne-primary-rgb), 0.08);
  color: var(--ne-primary);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  margin-top: 4px;
  transition: background 0.15s ease;
}

.vc-gov-link:active {
  background: rgba(var(--ne-primary-rgb), 0.15);
}

.vc-gov-link .material-symbols-outlined {
  font-size: 18px;
}

/* ── Reduced motion ──────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .vc-result-hero__icon { animation: none; }
  .vc-progress-bar__fill { transition: none; }
  .vc-option-btn,
  .vc-visa-card { transition: none; }
}

/* ══════════════════════════════════════════════════════════════════════════════
 * VISA CHECKER — rollback to first M3/Neural expressive pass
 * Large M3 cards, pill buttons, soft progress, tonal result states.
 * ══════════════════════════════════════════════════════════════════════════════ */

.vc-page {
  max-width: 760px;
  margin: 0 auto;
  padding: 6px 0 32px;
  background:
    linear-gradient(135deg, rgba(255, 250, 231, 0.74), rgba(230, 246, 242, 0.88) 42%, rgba(247, 249, 255, 0.8)),
    radial-gradient(circle at 88% 0%, rgba(var(--ne-primary-rgb), 0.12), transparent 34%);
}

.vc-page .ne-hero {
  min-height: auto;
  margin: 12px 16px 16px;
  padding: 22px;
  color: var(--ne-ink);
  border: 1px solid rgba(var(--ne-primary-rgb), 0.14);
  border-radius: 28px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.97), rgba(232, 248, 243, 0.92)),
    repeating-linear-gradient(135deg, rgba(var(--ne-primary-rgb), 0.07) 0 1px, transparent 1px 18px);
  box-shadow: 0 18px 36px rgba(21, 37, 34, 0.09);
}

.vc-page .ne-hero::before {
  display: none;
}

.vc-page .ne-hero__logo {
  min-height: 32px;
  margin-bottom: 10px;
  padding: 6px 10px;
  color: var(--ne-primary);
  background: rgba(var(--ne-primary-rgb), 0.1);
  border-color: rgba(var(--ne-primary-rgb), 0.14);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  letter-spacing: 0;
}

.vc-page .ne-hero__title {
  margin: 0 0 6px;
  color: var(--ne-ink);
  font-size: clamp(24px, 6vw, 34px);
  line-height: 1.05;
  letter-spacing: 0;
}

.vc-page .ne-hero__sub {
  margin: 0;
  color: var(--ne-muted);
  font-size: 15px;
  line-height: 1.45;
}

.vc-visa-list {
  display: grid;
  gap: 12px;
  margin: 0 16px 16px;
}

.vc-visa-card,
.vc-visa-card:first-child,
.vc-visa-card:last-child,
.vc-visa-card:only-child {
  min-height: 96px;
  margin: 0;
  padding: 16px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(var(--ne-primary-rgb), 0.12);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 12px 26px rgba(21, 37, 34, 0.07);
  transition: transform 0.18s var(--ne-ease-out), box-shadow 0.18s var(--ne-ease-out), border-color 0.18s var(--ne-ease-out);
}

.vc-visa-card:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--ne-primary-rgb), 0.26);
  box-shadow: 0 20px 40px rgba(21, 37, 34, 0.12);
}

.vc-visa-card--recommended {
  background: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(215,244,237,0.86));
  border-color: rgba(var(--ne-primary-rgb), 0.26);
}

.vc-visa-card__icon-wrap {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  background: rgba(var(--ne-primary-rgb), 0.11);
  color: var(--ne-primary);
  box-shadow: none;
}

.vc-visa-card--recommended .vc-visa-card__icon-wrap {
  background: var(--ne-primary-container, rgba(var(--ne-primary-rgb), 0.14));
  color: var(--ne-primary);
  box-shadow: none;
}

.vc-visa-card__title-row {
  flex-wrap: wrap;
  gap: 8px;
}

.vc-visa-card__desc {
  white-space: normal;
  line-height: 1.38;
}

.vc-visa-card__arrow {
  transition: transform 0.18s var(--ne-ease-out);
}

.vc-visa-card:hover .vc-visa-card__arrow {
  transform: translateX(3px);
}

.vc-recommended-badge {
  min-height: 24px;
  padding: 4px 10px;
  background: rgba(var(--ne-primary-rgb), 0.11);
  border-color: rgba(var(--ne-primary-rgb), 0.18);
  letter-spacing: 0;
}

.vc-page .ne-card--warn {
  margin-top: 8px;
  border-color: rgba(180, 95, 6, 0.28);
  background: rgba(255, 248, 225, 0.82);
}

.vc-back-btn {
  min-height: 44px;
  margin-bottom: 12px;
  border-radius: 999px;
}

.vc-quiz-header {
  margin: 0 16px 16px;
  padding: 14px;
  border: 1px solid rgba(var(--ne-primary-rgb), 0.12);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.58);
}

.vc-progress-bar {
  height: 8px;
  margin-bottom: 0;
}

.vc-progress-bar__fill {
  background: linear-gradient(90deg, var(--ne-primary), #2f5fbe);
}

.vc-question-card {
  padding: 22px;
}

.vc-option-btn {
  min-height: 52px;
  border-radius: 999px;
}

.vc-options--choice .vc-option-btn {
  border-radius: 18px;
}

.vc-result-hero {
  box-shadow: 0 16px 34px rgba(21, 37, 34, 0.09);
}

@media (min-width: 680px) {
  .vc-visa-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* ══════════════════════════════════════════════════════════════════════════════
   Jobs Paywall — Premium gate for the Вакансии tab
   ══════════════════════════════════════════════════════════════════════════════ */

.jobs-paywall-wrap {
  padding: 24px 16px 120px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 60vh;
  animation: wikiCardIn 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.jobs-paywall-card {
  width: 100%;
  max-width: 480px;
  padding: 32px 24px 28px;
  text-align: center;
  border: 1px solid var(--ne-line);
  position: relative;
  overflow: hidden;
}

/* Subtle gradient glow behind the card */
.jobs-paywall-card::before {
  content: '';
  position: absolute;
  inset: -40px;
  background: radial-gradient(ellipse at 50% 0%, rgba(124, 77, 255, 0.08) 0%, transparent 70%);
  pointer-events: none;
}

.jobs-paywall-icon {
  font-size: 52px;
  line-height: 1;
  margin-bottom: 16px;
  display: block;
}

.jobs-paywall-title {
  font-size: 22px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 10px;
  letter-spacing: -0.3px;
}

.jobs-paywall-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ne-muted);
  margin: 0 0 24px;
}

.jobs-paywall-features {
  display: flex;
  flex-direction: column;
  gap: 10px;
  text-align: left;
  margin-bottom: 28px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  padding: 16px;
}

.jobs-paywall-feature {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
}

.jobs-paywall-feature .material-symbols-outlined {
  font-size: 20px;
  flex-shrink: 0;
  font-variation-settings: 'FILL' 1;
}

.jobs-paywall-price-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  margin-bottom: 20px;
}

.jobs-paywall-price {
  font-family: 'Lora', serif;
  font-size: 48px;
  font-weight: 700;
  color: var(--ne-ink);
  letter-spacing: -1px;
  line-height: 1;
}

.jobs-paywall-period {
  font-size: 16px;
  font-weight: 600;
  color: var(--ne-muted);
}

.jobs-paywall-cta {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px 24px;
  font-size: 16px;
  font-weight: 700;
  border-radius: var(--ne-radius-sm);
  text-decoration: none;
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-violet) 100%);
  color: #fff;
  border: none;
  cursor: pointer;
  transition: transform 0.15s var(--ne-ease-spring), box-shadow 0.15s ease;
  box-shadow: 0 4px 16px rgba(26, 115, 232, 0.35);
  margin-bottom: 14px;
}

.jobs-paywall-cta:active {
  transform: scale(0.97);
  box-shadow: 0 2px 8px rgba(26, 115, 232, 0.25);
}

.jobs-paywall-cta .material-symbols-outlined {
  font-size: 20px;
  font-variation-settings: 'FILL' 1;
}

.jobs-paywall-note {
  font-size: 12px;
  color: var(--ne-hint);
  line-height: 1.5;
  margin: 0;
}

@media (min-width: 600px) {
  .jobs-paywall-wrap {
    padding: 40px 24px 120px;
  }
}


/* ══════════════════════════════════════════════════════════════════════════════
   Jobs Locked Card — blurred premium card for non-subscribers
   ══════════════════════════════════════════════════════════════════════════════ */

.job-card-locked {
  position: relative;
  border-radius: var(--ne-radius-lg);
  overflow: hidden;
  background: var(--ne-surface);
  border: 1px solid var(--ne-line);
  box-shadow: var(--ne-shadow-card);
  cursor: pointer;
  animation: wikiCardIn 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) var(--ne-delay, 0s) both;
  transition: transform 0.15s var(--ne-ease-spring);
  min-height: 100px;
}

.job-card-locked:active {
  transform: scale(0.98);
}

/* Blurred content underneath */
.job-card-locked__blur {
  padding: 16px;
  filter: blur(5px);
  user-select: none;
  pointer-events: none;
  opacity: 0.5;
}

.job-card-locked__top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.job-card-locked__emoji {
  font-size: 28px;
  flex-shrink: 0;
}

.job-card-locked__name {
  font-size: 16px;
  font-weight: 800;
  color: var(--ne-ink);
  background: var(--ne-border);
  border-radius: 4px;
  height: 18px;
  width: 160px;
}

.job-card-locked__meta {
  font-size: 13px;
  color: var(--ne-muted);
  margin-top: 4px;
}

.job-card-locked__tags {
  display: flex;
  gap: 6px;
}

.job-card-locked__tag {
  background: var(--ne-border);
  border-radius: 20px;
  height: 22px;
  width: 70px;
  display: inline-block;
}

/* Lock overlay */
.job-card-locked__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.job-card-locked__lock {
  width: 40px;
  height: 40px;
  background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet));
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(26, 115, 232, 0.35);
  margin-bottom: 4px;
}

.job-card-locked__lock .material-symbols-outlined {
  color: #fff;
  font-size: 20px;
  font-variation-settings: 'FILL' 1;
}

.job-card-locked__label {
  font-size: 13px;
  font-weight: 800;
  color: var(--ne-ink);
}

.job-card-locked__sub {
  font-size: 11px;
  color: var(--ne-muted);
  text-align: center;
  padding: 0 16px;
}

/* ══════════════════════════════════════════════════════════════════════════════
   Jobs Paywall Banner — sticky CTA below locked cards
   ══════════════════════════════════════════════════════════════════════════════ */

.jobs-paywall-banner {
  margin: 8px 0 100px;
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-violet) 100%);
  border-radius: var(--ne-radius-lg);
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(26, 115, 232, 0.3);
  animation: wikiCardIn 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) 0.2s both;
  flex-wrap: wrap;
}

.jobs-paywall-banner__icon {
  font-size: 28px;
  flex-shrink: 0;
}

.jobs-paywall-banner__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.jobs-paywall-banner__text strong {
  font-size: 14px;
  font-weight: 800;
  color: #fff;
}

.jobs-paywall-banner__text span {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.3;
}

.jobs-paywall-banner__price {
  display: flex;
  align-items: baseline;
  gap: 2px;
  flex-shrink: 0;
}

.jobs-paywall-banner__amount {
  font-family: 'Lora', serif;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

.jobs-paywall-banner__period {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  font-weight: 600;
}

.jobs-paywall-banner__cta {
  background: #fff;
  color: var(--ne-primary);
  font-size: 13px;
  font-weight: 800;
  padding: 10px 18px;
  border-radius: var(--ne-radius-sm);
  text-decoration: none;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  transition: transform 0.15s var(--ne-ease-spring);
  white-space: nowrap;
}

.jobs-paywall-banner__cta:active {
  transform: scale(0.96);
}

/* Locked card — date badge positioned at top of overlay */
.job-card-locked__date {
  position: absolute;
  top: 10px;
  right: 10px;
}
.job-card-locked__date .wiki-urgency {
  font-size: 10px;
  padding: 3px 8px;
}


/* ══════════════════════════════════════════════════════════════════════════════
   Wiki Registration Gate Card — blends into farm-card style
   ══════════════════════════════════════════════════════════════════════════════ */
.wiki-locked-card { cursor: pointer; user-select: none; }
.wiki-locked-card:active { opacity: 0.82; transform: scale(0.985); }
.wiki-locked-card__inner { opacity: 0.35; pointer-events: none; }
.wiki-locked-card__cta {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  margin: 12px -16px -16px;
  background: #2563EB;
  border-radius: 0 0 16px 16px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  font-family: inherit;
}
.wiki-locked-card__cta svg { flex-shrink: 0; opacity: 0.9; }
.wiki-locked-card__arrow { margin-left: auto; font-size: 18px; opacity: 0.7; }

/* Reviews modal registration gate */
.wrv-reg-wall { cursor: pointer; border-radius: 16px; overflow: hidden; margin-top: 8px; }
.wrv-reg-wall:active { opacity: 0.85; }
.wrv-reg-wall__locked { position: relative; padding: 8px 16px 0; background: #F8FAFC; }
.wrv-reg-wall__locked::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(248,250,252,0.1) 0%, rgba(248,250,252,0.97) 100%);
  pointer-events: none;
}
.wrv-sk-card--dim { opacity: 0.5; }
.wrv-reg-wall__cta {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: #2563EB;
  color: #fff;
}
.wrv-reg-wall__cta svg { flex-shrink: 0; }

/* Registration gate bottom sheet — shown when unregistered user taps a farm card */
.wiki-reg-gate-sheet { padding: 8px 24px 40px; text-align: center; }
.wiki-reg-gate-sheet__icon {
  width: 60px; height: 60px; background: #2563EB; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 20px auto 18px; color: #fff;
}
.wiki-reg-gate-sheet__title { font-size: 18px; font-weight: 700; color: var(--ne-text-primary, #0a0a0a); margin-bottom: 10px; line-height: 1.3; }
.wiki-reg-gate-sheet__desc { font-size: 14px; color: var(--ne-text-secondary, #6b7280); line-height: 1.5; margin-bottom: 24px; }
.wiki-reg-gate-sheet__cta { width: 100%; margin-bottom: 10px; }
.wiki-reg-gate-sheet__cancel { width: 100%; }

/* Locked farm row — compact list-item format (matches .tg-farm-row) */
.wiki-locked-row { cursor: pointer; user-select: none; position: relative; pointer-events: auto; }
.wiki-locked-row:active { opacity: 0.82; transform: scale(0.985); }
.wiki-locked-row .tg-farm-body { opacity: 0.35; pointer-events: none; }
.wiki-locked-row .tg-farm-avatar { pointer-events: none; }
.wiki-locked-row__cta {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  margin: 6px -14px -10px;
  background: #2563EB;
  border-radius: 0 0 14px 14px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
}
.wiki-locked-row__cta svg { flex-shrink: 0; opacity: 0.9; }
.wiki-locked-row__cta span:last-child { margin-left: auto; font-size: 16px; opacity: 0.7; }

/* ══════════════════════════════════════════════════════════════════════════════
   Premium Modal — shown on locked job card click
   ══════════════════════════════════════════════════════════════════════════════ */

.ne-premium-modal-sheet {
  padding-bottom: 32px;
}

.ne-premium-modal-hero {
  text-align: center;
  padding: 8px 24px 20px;
}

.ne-premium-modal-icon {
  font-size: 52px;
  line-height: 1;
  margin-bottom: 12px;
}

.ne-premium-modal-title {
  font-size: 22px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 8px;
  letter-spacing: -0.3px;
}

.ne-premium-modal-sub {
  font-size: 14px;
  color: var(--ne-muted);
  line-height: 1.5;
  margin: 0;
}

.ne-premium-modal-features {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--ne-surface-2);
  border-radius: var(--ne-radius-md);
  padding: 16px;
  margin: 0 20px 20px;
}

.ne-premium-modal-feature {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
}

.ne-premium-modal-feature .material-symbols-outlined {
  font-size: 20px;
  color: var(--ne-primary);
  flex-shrink: 0;
  font-variation-settings: 'FILL' 1;
}

.ne-premium-modal-price-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  margin-bottom: 20px;
}

.ne-premium-modal-price {
  font-family: 'Lora', serif;
  font-size: 48px;
  font-weight: 700;
  color: var(--ne-ink);
  letter-spacing: -1px;
  line-height: 1;
}

.ne-premium-modal-period {
  font-size: 16px;
  font-weight: 600;
  color: var(--ne-muted);
}

.ne-premium-modal-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 20px;
  margin-bottom: 16px;
}

.ne-premium-modal-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px 24px;
  font-size: 16px;
  font-weight: 700;
  border-radius: var(--ne-radius-sm);
  text-decoration: none;
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-violet) 100%);
  color: #fff;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(26, 115, 232, 0.35);
  transition: transform 0.15s var(--ne-ease-spring);
}

.ne-premium-modal-cta:active { transform: scale(0.97); }

.ne-premium-modal-cta .material-symbols-outlined {
  font-size: 20px;
  font-variation-settings: 'FILL' 1;
}

.ne-premium-modal-cancel {
  color: var(--ne-muted);
  font-size: 14px;
  font-weight: 600;
  padding: 12px;
  border: none;
  background: none;
  cursor: pointer;
}

.ne-premium-modal-note {
  font-size: 12px;
  color: var(--ne-hint);
  text-align: center;
  line-height: 1.5;
  margin: 0;
  padding: 0 24px;
}


/* Premium modal — mobile compact fixes */
.ne-premium-modal-sheet {
  padding-bottom: env(safe-area-inset-bottom, 16px);
}

.ne-premium-modal-hero {
  padding: 4px 20px 12px;
}

.ne-premium-modal-icon {
  font-size: 40px;
  margin-bottom: 8px;
}

.ne-premium-modal-title {
  font-size: 20px;
  margin: 0 0 6px;
}

.ne-premium-modal-sub {
  font-size: 13px;
}

.ne-premium-modal-features {
  gap: 8px;
  padding: 12px 14px;
  margin: 0 16px 14px;
}

.ne-premium-modal-feature {
  font-size: 13px;
}

.ne-premium-modal-price-row {
  margin-bottom: 14px;
}

.ne-premium-modal-price {
  font-size: 40px;
}

.ne-premium-modal-period {
  font-size: 14px;
}

.ne-premium-modal-actions {
  gap: 8px;
  padding: 0 16px;
  margin-bottom: 10px;
}

.ne-premium-modal-cta {
  padding: 14px 20px;
  font-size: 15px;
}

.ne-premium-modal-cancel {
  font-size: 13px;
  padding: 8px;
}

.ne-premium-modal-note {
  font-size: 11px;
  padding: 0 20px;
}


/* ══════════════════════════════════════════════════════════════════════════════
   Visa Assistant v2 — Material 3 Expressive + Neural Expressive + Telegram 2026
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Page shell ─────────────────────────────────────────────────────────────── */
.vc-page { padding-bottom: 80px; }

/* ── Hero ───────────────────────────────────────────────────────────────────── */
.vc2-hero {
  padding: 28px 20px 24px;
  background: linear-gradient(145deg, var(--ne-primary) 0%, #4285f4 55%, var(--ne-violet) 100%);
  border-radius: 0 0 var(--ne-radius-xl) var(--ne-radius-xl);
  margin: 0 0 20px;
  position: relative;
  overflow: hidden;
}

.vc2-hero::before {
  content: '';
  position: absolute;
  inset: -50%;
  background: radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.12) 0%, transparent 60%);
  pointer-events: none;
}

.vc2-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.18);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 9999px;
  margin-bottom: 16px;
  backdrop-filter: blur(8px);
}

.vc2-hero__eyebrow .material-symbols-outlined { font-size: 14px; }

.vc2-hero__title {
  font-size: 26px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 8px;
  letter-spacing: -0.4px;
  line-height: 1.2;
}

.vc2-hero__sub {
  font-size: 14px;
  color: rgba(255,255,255,0.82);
  margin: 0;
  line-height: 1.5;
}

/* ── Visa type grid ─────────────────────────────────────────────────────────── */
.vc2-visa-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 16px;
}

.vc2-visa-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border-radius: var(--ne-radius-lg);
  border: none;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: transform 0.15s var(--ne-ease-spring), box-shadow 0.15s ease;
  animation: wikiCardIn 0.4s cubic-bezier(0.2, 0.8, 0.2, 1) var(--vc2-card-delay, 0s) both;
  position: relative;
  overflow: hidden;
}

.vc2-visa-card:active { transform: scale(0.97); }

.vc2-visa-card--primary {
  background: linear-gradient(135deg, #e8f0fe 0%, #d2e3fc 100%);
  border: 1.5px solid rgba(26,115,232,0.25);
  box-shadow: 0 4px 16px rgba(26,115,232,0.12);
}

.vc2-visa-card--surface {
  background: var(--ne-surface);
  border: 1px solid var(--ne-border);
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  backdrop-filter: blur(12px);
}

.vc2-visa-card__icon-wrap {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.vc2-visa-card--primary .vc2-visa-card__icon-wrap {
  background: var(--ne-primary);
  box-shadow: 0 4px 12px rgba(26,115,232,0.35);
}
.vc2-visa-card--primary .vc2-visa-card__icon-wrap .material-symbols-outlined { color: #fff; font-size: 24px; font-variation-settings: 'FILL' 1; }

.vc2-visa-card--surface .vc2-visa-card__icon-wrap {
  background: var(--ne-surface-2);
}
.vc2-visa-card--surface .vc2-visa-card__icon-wrap .material-symbols-outlined { color: var(--ne-muted); font-size: 24px; font-variation-settings: 'FILL' 0; }

.vc2-visa-card__body { flex: 1; min-width: 0; }

.vc2-visa-card__title {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-ink);
  margin-bottom: 3px;
}

.vc2-visa-card--primary .vc2-visa-card__title { color: #1557b0; }

.vc2-visa-card__desc {
  display: block;
  font-size: 12px;
  color: var(--ne-muted);
  line-height: 1.4;
}

.vc2-visa-card__arrow {
  color: var(--ne-hint);
  font-size: 20px;
  flex-shrink: 0;
  transition: transform 0.2s var(--ne-ease-spring);
}
.vc2-visa-card:hover .vc2-visa-card__arrow,
.vc2-visa-card:active .vc2-visa-card__arrow { transform: translateX(3px); }
.vc2-visa-card--primary .vc2-visa-card__arrow { color: var(--ne-primary); }

/* ── Right column (arrow / soon-badge + counter) ────────────────────────────── */
.vc2-visa-card__right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

/* ── Fraud banner ───────────────────────────────────────────────────────────── */
.vc2-fraud-banner {
  margin: 16px 16px 0;
  background: #fff8e6;
  border: 1.5px solid rgba(249,171,0,0.4);
  border-radius: var(--ne-radius-lg);
  padding: 14px 16px;
}

.vc2-fraud-banner__head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: #7a4f00;
  margin-bottom: 8px;
}

.vc2-fraud-banner__head .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-amber-text);
  font-variation-settings: 'FILL' 1;
}

.vc2-fraud-banner p {
  font-size: 12px;
  color: #7a4f00;
  line-height: 1.5;
  margin: 0 0 4px;
}
.vc2-fraud-banner p:last-child { margin: 0; }

/* ── "Rules updated on gov.uk" banner ───────────────────────────────────────── */
.vc2-rules-banner {
  margin: 16px 16px 0;
  background: #e8f1ff;
  border: 1.5px solid rgba(51,144,236,0.4);
  border-radius: var(--ne-radius-lg);
  padding: 14px 16px;
}

.vc2-rules-banner__head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: #0d4a8f;
  margin-bottom: 8px;
}

.vc2-rules-banner__head .material-symbols-outlined {
  font-size: 18px;
  color: #3390ec;
  font-variation-settings: 'FILL' 1;
}

.vc2-rules-banner__body {
  font-size: 12px;
  color: #0d4a8f;
  line-height: 1.5;
  margin: 0 0 10px;
}

.vc2-rules-banner__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.vc2-rules-banner__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: #3390ec;
  text-decoration: none;
}

.vc2-rules-banner__link .material-symbols-outlined { font-size: 14px; }

.vc2-rules-banner__dismiss {
  border: none;
  background: rgba(51,144,236,0.12);
  color: #0d4a8f;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 999px;
  cursor: pointer;
}

/* ── Resume screen ──────────────────────────────────────────────────────────── */
.vc2-resume-actions {
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* ── Shared buttons ─────────────────────────────────────────────────────────── */
.vc2-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 15px 24px;
  border-radius: 9999px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  border: none;
  transition: transform 0.15s var(--ne-ease-spring), box-shadow 0.15s ease;
  width: 100%;
}
.vc2-btn:active { transform: scale(0.97); }
.vc2-btn .material-symbols-outlined { font-size: 20px; }

.vc2-btn--primary {
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-violet) 100%);
  color: #fff;
  box-shadow: 0 4px 16px rgba(26,115,232,0.35);
}

.vc2-btn--secondary {
  background: var(--ne-surface);
  color: var(--ne-primary);
  border: 1.5px solid var(--ne-line);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.vc2-btn--ghost {
  background: transparent;
  color: var(--ne-muted);
  border: 1px solid var(--ne-border);
}

/* ── Quiz screen ────────────────────────────────────────────────────────────── */
.vc2-quiz-screen { padding: 0; }

.vc2-quiz-topbar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px 8px;
}

.vc2-back-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  background: var(--ne-surface-2);
  border: none;
  border-radius: 9999px;
  padding: 6px 12px 6px 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-ink);
  cursor: pointer;
  margin-right: 4px;
  transition: background 0.15s;
}
.vc2-back-btn:active { background: var(--ne-border); }
.vc2-back-btn .material-symbols-outlined { font-size: 18px; }

.vc2-quiz-chip {
  display: flex;
  align-items: center;
  gap: 5px;
  background: rgba(26,115,232,0.1);
  color: var(--ne-primary);
  font-size: 12px;
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 9999px;
  flex: 1;
  min-width: 0;
}
.vc2-quiz-chip .material-symbols-outlined { font-size: 14px; font-variation-settings: 'FILL' 1; }

.vc2-step-pill {
  background: var(--ne-surface-2);
  color: var(--ne-muted);
  font-size: 12px;
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 9999px;
  flex-shrink: 0;
}

/* Progress bar */
.vc2-progress-track {
  height: 4px;
  background: var(--ne-border);
  margin: 4px 16px 16px;
  border-radius: 9999px;
  overflow: hidden;
}

.vc2-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--ne-primary), var(--ne-violet));
  border-radius: 9999px;
  transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Question card */
.vc2-question-card {
  margin: 0 16px;
  background: var(--ne-surface);
  border-radius: var(--ne-radius-xl);
  padding: 24px 20px 20px;
  border: 1px solid var(--ne-line);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  backdrop-filter: blur(20px);
}

.vc2-question-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet));
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  border-radius: 9999px;
  margin-bottom: 12px;
}

.vc2-question-text {
  font-size: 17px;
  font-weight: 700;
  color: var(--ne-ink);
  line-height: 1.4;
  margin: 0 0 20px;
  letter-spacing: -0.2px;
}

/* Boolean options — two large pill buttons */
.vc2-bool-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.vc2-bool-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px 12px;
  border-radius: var(--ne-radius-md);
  border: 2px solid var(--ne-border);
  background: var(--ne-surface-2);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.18s var(--ne-ease-spring);
  color: var(--ne-muted);
}
.vc2-bool-btn:active { transform: scale(0.96); }
.vc2-bool-btn .material-symbols-outlined { font-size: 28px; }

.vc2-bool-btn--yes-active,
.vc2-bool-btn--yes:active {
  background: #e6f4ea;
  border-color: #1aae39;
  color: #137333;
  box-shadow: 0 4px 12px rgba(26,174,57,0.2);
}
.vc2-bool-btn--yes-active .material-symbols-outlined { color: #1aae39; }

.vc2-bool-btn--no-active,
.vc2-bool-btn--no:active {
  background: #fce8e6;
  border-color: #c5221f;
  color: #a50e0e;
  box-shadow: 0 4px 12px rgba(197,34,31,0.2);
}
.vc2-bool-btn--no-active .material-symbols-outlined { color: #c5221f; }

/* Choice options — vertical list */
.vc2-choice-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.vc2-choice-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: var(--ne-radius-md);
  border: 2px solid var(--ne-border);
  background: var(--ne-surface-2);
  text-align: left;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: var(--ne-ink);
  transition: all 0.18s var(--ne-ease-spring);
  width: 100%;
}
.vc2-choice-btn:active { transform: scale(0.98); }

.vc2-choice-btn--active {
  background: #e8f0fe;
  border-color: var(--ne-primary);
  color: #1557b0;
  box-shadow: 0 4px 12px rgba(26,115,232,0.15);
}

.vc2-choice-btn__radio .material-symbols-outlined {
  font-size: 20px;
  color: var(--ne-border);
  font-variation-settings: 'FILL' 1;
  flex-shrink: 0;
}
.vc2-choice-btn--active .vc2-choice-btn__radio .material-symbols-outlined { color: var(--ne-primary); }

.vc2-choice-btn__label { flex: 1; }

/* ── Result screen ──────────────────────────────────────────────────────────── */
.vc2-result-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 20px;
  margin: 0 0 16px;
  border-radius: 0 0 var(--ne-radius-xl) var(--ne-radius-xl);
}

.vc2-result-hero--green  { background: linear-gradient(135deg, #1aae39 0%, #137333 100%); }
.vc2-result-hero--amber  { background: linear-gradient(135deg, #f9ab00 0%, #dd5b00 100%); }
.vc2-result-hero--red    { background: linear-gradient(135deg, #c5221f 0%, #a50e0e 100%); }

.vc2-result-hero__icon-wrap {
  width: 56px;
  height: 56px;
  border-radius: 9999px;
  background: rgba(255,255,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.vc2-result-hero__icon-wrap .material-symbols-outlined {
  font-size: 32px;
  color: #fff;
  font-variation-settings: 'FILL' 1;
}

.vc2-result-hero__body { flex: 1; min-width: 0; }

.vc2-result-hero__title {
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 4px;
  line-height: 1.2;
}

.vc2-result-hero__meta {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: rgba(255,255,255,0.8);
  margin: 0;
}
.vc2-result-hero__meta .material-symbols-outlined { font-size: 13px; }

/* Section headings */
.vc2-section-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ne-muted);
  padding: 0 16px 8px;
}
.vc2-section-head .material-symbols-outlined { font-size: 16px; color: var(--ne-primary); font-variation-settings: 'FILL' 1; }

/* Flags list */
.vc2-flags-list {
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}

.vc2-flag {
  border-radius: var(--ne-radius-lg);
  padding: 14px 16px;
  border-left: 4px solid transparent;
}

.vc2-flag--critical { background: #fce8e6; border-color: #c5221f; }
.vc2-flag--high     { background: #fff3e0; border-color: #f9ab00; }
.vc2-flag--medium   { background: #e8f0fe; border-color: var(--ne-primary); }

.vc2-flag__header {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}

.vc2-flag__header .material-symbols-outlined {
  font-size: 16px;
  font-variation-settings: 'FILL' 1;
  flex-shrink: 0;
}
.vc2-flag--critical .vc2-flag__header .material-symbols-outlined { color: #c5221f; }
.vc2-flag--high     .vc2-flag__header .material-symbols-outlined { color: #f9ab00; }
.vc2-flag--medium   .vc2-flag__header .material-symbols-outlined { color: var(--ne-primary); }

.vc2-flag__severity {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 2px 7px;
  border-radius: 9999px;
}
.vc2-flag--critical .vc2-flag__severity { background: #c5221f; color: #fff; }
.vc2-flag--high     .vc2-flag__severity { background: #f9ab00; color: #fff; }
.vc2-flag--medium   .vc2-flag__severity { background: var(--ne-primary); color: #fff; }

.vc2-flag__title {
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-ink);
  flex: 1;
}

.vc2-flag__body {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.5;
  margin: 0 0 8px;
}

.vc2-flag__rec {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ne-ink);
  background: rgba(255,255,255,0.6);
  border-radius: 8px;
  padding: 8px 10px;
}
.vc2-flag__rec .material-symbols-outlined { font-size: 14px; color: var(--ne-primary); font-variation-settings: 'FILL' 1; flex-shrink: 0; margin-top: 1px; }

.vc2-no-flags {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #e6f4ea;
  border-radius: var(--ne-radius-md);
  padding: 14px 16px;
  font-size: 14px;
  font-weight: 600;
  color: #137333;
}
.vc2-no-flags .material-symbols-outlined { font-size: 22px; color: #1aae39; font-variation-settings: 'FILL' 1; }

/* Next steps card */
.vc2-next-card {
  margin: 0 16px 16px;
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  border: 1px solid var(--ne-line);
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.vc2-next-card__head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 800;
  color: var(--ne-ink);
  margin-bottom: 8px;
}
.vc2-next-card__head .material-symbols-outlined { font-size: 18px; color: var(--ne-primary); font-variation-settings: 'FILL' 1; }

.vc2-next-card__body {
  font-size: 13px;
  color: var(--ne-muted);
  line-height: 1.5;
  margin: 0 0 14px;
}

/* gov.uk link */
.vc2-gov-link {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f0f4f9;
  border-radius: var(--ne-radius-md);
  padding: 12px 14px;
  text-decoration: none;
  border: 1px solid var(--ne-border);
  transition: background 0.15s;
}
.vc2-gov-link:active { background: var(--ne-border); }

.vc2-gov-link__icon {
  width: 36px;
  height: 36px;
  background: #00703c;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.vc2-gov-link__icon .material-symbols-outlined { color: #fff; font-size: 18px; }

.vc2-gov-link__text { flex: 1; min-width: 0; }
.vc2-gov-link__label { display: block; font-size: 13px; font-weight: 700; color: var(--ne-ink); }
.vc2-gov-link__url { display: block; font-size: 11px; color: #00703c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.vc2-gov-link__arrow { color: var(--ne-hint); font-size: 18px; flex-shrink: 0; }

/* Disclaimer */
.vc2-disclaimer {
  margin: 0 16px 16px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: #fff8e6;
  border-radius: var(--ne-radius-md);
  padding: 12px 14px;
  border: 1px solid rgba(249,171,0,0.3);
}
.vc2-disclaimer .material-symbols-outlined { font-size: 18px; color: var(--ne-amber-text); flex-shrink: 0; margin-top: 1px; font-variation-settings: 'FILL' 1; }
.vc2-disclaimer p { font-size: 12px; color: #7a4f00; line-height: 1.5; margin: 0; }

/* Restart button */
.vc2-restart-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: calc(100% - 32px);
  margin: 0 16px 32px;
  padding: 14px;
  border-radius: 9999px;
  border: 1.5px solid var(--ne-border);
  background: transparent;
  color: var(--ne-muted);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
}
.vc2-restart-btn:active { background: var(--ne-surface-2); }
.vc2-restart-btn .material-symbols-outlined { font-size: 18px; }

/* ── Coming Soon card variant ──────────────────────────────────────────── */
.vc2-visa-card--coming-soon {
  opacity: 0.65;
  cursor: pointer;
}
.vc2-visa-card__soon-badge {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #fff;
  background: #94a3b8;
  border-radius: 100px;
  padding: 3px 8px;
  white-space: nowrap;
  transition: opacity 0.25s ease, transform 0.25s ease;
}
/* Hidden until first click */
.vc2-visa-card__soon-badge--hidden {
  opacity: 0;
  pointer-events: none;
  transform: scale(0.7);
}

/* ── Click counter badge ─────────────────────────────────────────────────────── */
.vc2-visa-card__click-counter {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 600;
  color: #64748b;
  background: rgba(100, 116, 139, 0.1);
  border: 1px solid rgba(100, 116, 139, 0.2);
  border-radius: 100px;
  padding: 2px 7px;
  white-space: nowrap;
}
.vc2-visa-card__click-counter::before {
  content: '👆';
  font-size: 9px;
}
.vc2-visa-card__click-counter::after {
  content: attr(data-count);
}
@keyframes vc2ClickPulse {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.3); }
  100% { transform: scale(1); }
}
.vc2-click-badge--pulse {
  animation: vc2ClickPulse 0.35s ease;
}

/* ── Financial Summary Card ─────────────────────────────────────────────────── */
.vc2-fin-summary {
  margin: 0 16px 20px;
  background: var(--ne-surface-1, #f8f9fa);
  border-radius: 16px;
  padding: 16px;
  border: 1px solid var(--ne-border, #e2e6ea);
}
.vc2-fin-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid var(--ne-border, #e2e6ea);
  font-size: 13px;
}
.vc2-fin-row:last-of-type { border-bottom: none; }
.vc2-fin-label { color: var(--ne-text-2, #6c757d); }
.vc2-fin-value { font-weight: 600; color: var(--ne-text-1, #1e293b); }
.vc2-fin-unit { font-weight: 400; font-size: 11px; color: var(--ne-text-2, #6c757d); margin-left: 2px; }

/* Index row */
.vc2-fin-indices {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
.vc2-fin-index {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--ne-bg-app, #fff);
  border-radius: 10px;
  padding: 8px 12px;
  border: 1px solid var(--ne-border, #e2e6ea);
}
.vc2-fin-index__val {
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-text-1, #1e293b);
  min-width: 36px;
}
.vc2-fin-index__hint {
  font-size: 12px;
  color: var(--ne-text-2, #6c757d);
  margin-left: auto;
  text-align: right;
}

/* Traffic-light dot */
.vc2-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.vc2-dot--green  { background: #22c55e; }
.vc2-dot--amber  { background: #f59e0b; }
.vc2-dot--red    { background: #ef4444; }

/* Ties Score bar */
.vc2-ties-bar { margin-top: 16px; }
.vc2-ties-bar__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  color: var(--ne-text-2, #6c757d);
  margin-bottom: 6px;
}
.vc2-ties-bar__score {
  font-size: 18px;
  font-weight: 700;
}
.vc2-ties-bar__score--green { color: #22c55e; }
.vc2-ties-bar__score--amber { color: #f59e0b; }
.vc2-ties-bar__score--red   { color: #ef4444; }
.vc2-ties-bar__max { font-size: 12px; font-weight: 400; color: var(--ne-text-2, #6c757d); }
.vc2-ties-track {
  height: 8px;
  background: var(--ne-border, #e2e6ea);
  border-radius: 4px;
  overflow: hidden;
}
.vc2-ties-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.4s ease;
}
.vc2-ties-fill--green { background: #22c55e; }
.vc2-ties-fill--amber { background: #f59e0b; }
.vc2-ties-fill--red   { background: #ef4444; }
.vc2-ties-legend {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: var(--ne-text-2, #6c757d);
  margin-top: 4px;
}

/* ── Currency Input Question ─────────────────────────────────────────────────── */
.vc2-currency-input {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 4px 0;
}
.vc2-currency-input__row {
  display: flex;
  align-items: center;
  background: var(--ne-bg-app, #fff);
  border: 2px solid var(--ne-primary, #4f5a70);
  border-radius: 14px;
  overflow: hidden;
  padding: 0 16px;
  height: 56px;
}
.vc2-currency-input__symbol {
  font-size: 15px;
  font-weight: 700;
  color: var(--ne-primary, #4f5a70);
  margin-right: 10px;
  white-space: nowrap;
}
.vc2-currency-input__field {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 22px;
  font-weight: 700;
  color: var(--ne-text-1, #1e293b);
  width: 100%;
}
.vc2-currency-input__field::placeholder { color: #ccd; }
.vc2-currency-input__gbp {
  font-size: 20px;
  font-weight: 700;
  color: #16a34a;
  text-align: center;
  min-height: 28px;
  transition: all 0.2s;
}
.vc2-currency-input__rate {
  font-size: 11px;
  color: var(--ne-text-2, #6c757d);
  text-align: center;
}
.vc2-currency-input__confirm {
  margin-top: 4px;
  width: 100%;
}
.vc2-action-plan {
  margin: 0 16px 20px;
  background: #f0fdf4;
  border-radius: 16px;
  padding: 16px;
  border: 1px solid #bbf7d0;
}
.vc2-action-plan__sub {
  font-size: 12px;
  color: var(--ne-text-2, #6c757d);
  margin: 4px 0 12px;
}
.vc2-action-steps {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vc2-action-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: #fff;
  border-radius: 10px;
  padding: 10px 12px;
  border: 1px solid #bbf7d0;
}
.vc2-action-step__num {
  min-width: 22px;
  height: 22px;
  background: #16a34a;
  color: #fff;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}
.vc2-action-step__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}
.vc2-action-step__head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-text-1, #1e293b);
}
.vc2-action-step__head .material-symbols-outlined {
  font-size: 16px;
  color: #16a34a;
}
.vc2-action-step__doc {
  font-size: 11px;
  color: var(--ne-text-2, #6c757d);
  padding-left: 22px;
}

/* ── Services Hub ────────────────────────────────────────────────────────────── */
.srv-hub { padding: 16px 0; }
.srv-hub__head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ne-text-2, #6c757d);
  padding: 0 16px 12px;
}
.srv-hub__head .material-symbols-outlined { font-size: 18px; }
.srv-hub__grid { display: flex; flex-direction: column; gap: 8px; padding: 0 16px; }
.srv-hub-card {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--ne-surface-1, #f8f9fa);
  border: 1px solid var(--ne-border, #e2e6ea);
  border-radius: 16px;
  padding: 14px 16px;
  cursor: pointer;
  transition: background 0.15s, transform 0.12s;
  -webkit-tap-highlight-color: transparent;
}
.srv-hub-card:active { background: var(--ne-surface-2, #eef0f3); transform: scale(0.98); }
.srv-hub-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.srv-hub-card__icon .material-symbols-outlined { font-size: 22px; font-variation-settings: 'FILL' 1; }
.srv-hub-card__body { flex: 1; min-width: 0; }
.srv-hub-card__title {
  font-size: 15px;
  font-weight: 600;
  color: var(--ne-text-1, #1e293b);
  margin-bottom: 2px;
}
.srv-hub-card__desc {
  font-size: 12px;
  color: var(--ne-text-2, #6c757d);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.srv-hub-card__arrow {
  font-size: 20px;
  color: var(--ne-text-2, #b0b7c3);
  flex-shrink: 0;
}

/* ── Responsive ──────────────────────────────────────────────────────────────── */
@media (min-width: 600px) {
  .vc2-visa-grid { display: grid; grid-template-columns: 1fr 1fr; }
  .vc2-hero { border-radius: var(--ne-radius-xl); margin: 16px 16px 20px; }
  .vc2-result-hero { border-radius: var(--ne-radius-xl); margin: 16px 16px; }
}


/* ══════════════════════════════════════════════════════════════════════════════
   Sponsor Module v2 — Material 3 Expressive + Telegram 2026 + gov.uk
   ══════════════════════════════════════════════════════════════════════════════ */

.sp2-root { background: var(--ne-bg-app); min-height: 100vh; padding-bottom: 80px; }

/* ── Hero ─────────────────────────────────────────────────────────────────── */
.sp2-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 20px 16px;
  background: linear-gradient(145deg, var(--ne-primary) 0%, #4285f4 55%, var(--ne-violet) 100%);
  border-radius: 0 0 var(--ne-radius-xl) var(--ne-radius-xl);
  margin-bottom: 8px;
  position: relative;
  overflow: hidden;
}
.sp2-hero::before {
  content: '';
  position: absolute;
  inset: -40%;
  background: radial-gradient(ellipse at 80% 10%, rgba(255,255,255,0.1) 0%, transparent 60%);
  pointer-events: none;
}
.sp2-hero__inner { flex: 1; min-width: 0; }
.sp2-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.18);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 9999px;
  margin-bottom: 0;
  backdrop-filter: blur(8px);
  max-width: calc(100% - 48px);
}
.sp2-hero__eyebrow .material-symbols-outlined { font-size: 14px; font-variation-settings: 'FILL' 1; }
.sp2-hero__sub {
  font-size: 13px;
  color: rgba(255,255,255,0.8);
  margin: 8px 0 0;
  line-height: 1.4;
}
.sp2-hero__help {
  width: 36px;
  height: 36px;
  background: rgba(255,255,255,0.18);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  backdrop-filter: blur(8px);
  transition: background 0.15s;
}
.sp2-hero__help:active { background: rgba(255,255,255,0.3); }
.sp2-hero__help .material-symbols-outlined { color: #fff; font-size: 20px; }

/* ── Finance refund hero ─────────────────────────────────────────────────── */
.ne-finance-hero {
  padding: 20px 20px 16px;
  background: linear-gradient(145deg, #137333 0%, #1a8f44 55%, #0d5c28 100%);
  border-radius: 0 0 var(--ne-radius-xl) var(--ne-radius-xl);
  margin-bottom: 0;
  position: relative;
  overflow: hidden;
}
.ne-finance-hero::before {
  content: '';
  position: absolute;
  inset: -40%;
  background: radial-gradient(ellipse at 80% 10%, rgba(255,255,255,0.1) 0%, transparent 60%);
  pointer-events: none;
}
.ne-finance-hero__inner { min-width: 0; }
.ne-finance-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.18);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 9999px;
  margin-bottom: 0;
  backdrop-filter: blur(8px);
}
.ne-finance-hero__eyebrow .material-symbols-outlined { font-size: 14px; font-variation-settings: 'FILL' 1; }
.ne-finance-hero__sub {
  font-size: 13px;
  color: rgba(255,255,255,0.85);
  margin: 8px 0 0;
  line-height: 1.4;
}

/* ── Tab Navigation ──────────────────────────────────────────────────────── */
.sp2-nav {
  display: flex;
  gap: 4px;
  padding: 0 12px 10px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.sp2-nav::-webkit-scrollbar { display: none; }
.sp2-nav__item {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  border-radius: 9999px;
  border: 1px solid var(--ne-border);
  background: var(--ne-surface);
  color: var(--ne-muted);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: all 0.18s var(--ne-ease-spring);
}
.sp2-nav__item .material-symbols-outlined { font-size: 16px; }
.sp2-nav__item--active {
  background: var(--ne-primary);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 12px rgba(26,115,232,0.3);
}
.sp2-nav__item:active { transform: scale(0.96); }

/* ══════════════════════════════════════════════════════════════════
   Reviews modal v2 (wrv-) — farm profile per reference design
   ══════════════════════════════════════════════════════════════════ */
.wrv-sheet { background: #F5F7F6; padding: 0; overflow: hidden; }
.wrv-topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px 8px 16px; background: rgba(245,247,246,.96);
  border-bottom: 1px solid #E5E7EB; flex-shrink: 0;
}
.wrv-topbar-label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #9CA3AF; font-weight: 600; }
.wrv-close { width: 38px; height: 38px; min-width: 38px; min-height: 38px; background: rgba(0,0,0,.05); }
.wrv-sync-spin { display: inline-flex; animation: wrvSpin 1s linear infinite; color: #9CA3AF; }
.wrv-sync-spin .material-symbols-outlined { font-size: 16px; }
@keyframes wrvSpin { to { transform: rotate(360deg); } }

.wrv-body { padding: 14px 14px 28px; background: #F5F7F6; overflow-y: auto; overflow-x: clip; flex: 1; }

/* Hero card */
.wrv-hero { background: #fff; border-radius: 20px; border: 1.5px solid #E5E7EB; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,.05); animation: fadeUpWrv .35s ease both; }
@keyframes fadeUpWrv { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.wrv-hero-top { padding: 16px 18px 14px; background: #F0FDF4; border-bottom: 1.5px solid #BBF7D0; }
.wrv-hero-name-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.wrv-hero-id { min-width: 0; }
.wrv-hero-name { font-size: 20px; font-weight: 800; color: #14532D; letter-spacing: -.4px; line-height: 1.2; }
.wrv-hero-pcode { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 600; color: #166534; background: #fff; border: 1px solid #BBF7D0; padding: 3px 9px; border-radius: 12px; margin-top: 6px; }
.wrv-hero-ovr { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 70px; padding: 10px; border-radius: 16px; background: #fff; border: 1.5px solid #BBF7D0; flex-shrink: 0; }
.wrv-hero-ovr-num { font-size: 28px; font-weight: 800; color: #166534; line-height: 1; }
.wrv-hero-stars { display: flex; gap: 1px; margin-top: 4px; font-size: 11px; }
.wrv-star { color: #E5E7EB; }
.wrv-star.on { color: #F59E0B; }
.wrv-hero-ovr-cnt { font-size: 10px; color: #4ADE80; font-weight: 600; margin-top: 3px; }
.wrv-hero-crops { display: flex; flex-wrap: wrap; gap: 5px; }
.wrv-hero-ops { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.wrv-tag { display: flex; flex: 1 1 auto; justify-content: center; font-size: 12px; font-weight: 500; padding: 3px 9px; border-radius: 12px; background: #DCFCE7; color: #166534; }
.wrv-tag--op { background: #DBEAFE; color: #1E40AF; }

/* Aggregate scores */
.wrv-agg { padding: 16px 20px; border-bottom: 1px solid #F3F4F6; }
.wrv-agg-title { font-size: 11px; font-weight: 700; color: #9CA3AF; letter-spacing: .5px; margin-bottom: 12px; }
.wrv-agg-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.wrv-agg-row:last-child { margin-bottom: 0; }
.wrv-agg-label { display: flex; align-items: center; gap: 6px; width: 110px; flex-shrink: 0; font-size: 13px; color: #374151; }
.wrv-agg-track { flex: 1; height: 7px; border-radius: 4px; background: #F3F4F6; overflow: hidden; }
.wrv-agg-fill { height: 100%; border-radius: 4px; transition: width .6s ease; }
.wrv-agg-val { width: 30px; text-align: right; font-size: 13px; font-weight: 800; flex-shrink: 0; }

/* Distribution */
.wrv-dist { padding: 14px 20px; border-bottom: 1px solid #F3F4F6; }
.wrv-dist-row { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.wrv-dist-row:last-child { margin-bottom: 0; }
.wrv-dist-star { font-size: 11px; color: #6B7280; width: 28px; flex-shrink: 0; display: flex; align-items: center; gap: 2px; }
.wrv-dist-track { flex: 1; height: 6px; border-radius: 3px; background: #F3F4F6; overflow: hidden; }
.wrv-dist-fill { height: 100%; background: #F59E0B; border-radius: 3px; transition: width .6s ease; }
.wrv-dist-cnt { width: 18px; text-align: right; font-size: 11px; color: #9CA3AF; flex-shrink: 0; }

/* CTA row */
.wrv-cta-row { padding: 14px 20px; display: flex; gap: 8px; }
.wrv-cta-work { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 12px; border-radius: 12px; background: #1D4ED8; border: none; cursor: pointer; font-size: 14px; font-weight: 700; color: #fff; font-family: inherit; transition: filter .15s, transform .1s; }
.wrv-cta-work:hover { filter: brightness(.9); }
.wrv-cta-work:active { transform: scale(.98); filter: brightness(.92); }
.wrv-cta-icon { width: 46px; border-radius: 12px; border: 1.5px solid #E5E7EB; background: #fff; cursor: pointer; font-size: 17px; transition: border-color .15s, background .15s; }
.wrv-cta-icon:hover { border-color: #166534; background: #F0FDF4; }
.wrv-cta-icon:active { border-color: #166534; background: #F0FDF4; }
.wrv-cta-icon.wrv-saved { border-color: #1D4ED8; background: #EFF6FF; }

/* Reviews header */
.wrv-rev-hdr { display: flex; align-items: center; gap: 8px; margin: 20px 0 10px; }
.wrv-rev-hdr-emoji { font-size: 18px; }
.wrv-rev-hdr h3 { font-size: 15px; font-weight: 700; color: #111827; margin: 0; }
.wrv-cnt-chip { font-size: 13px; font-weight: 600; padding: 1px 8px; border-radius: 10px; background: #F3F4F6; color: #6B7280; }

/* Filter pills */
.wrv-filter-row { display: flex; gap: 5px; margin-bottom: 12px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.wrv-filter-row::-webkit-scrollbar { display: none; }
.wrv-fpill { display: inline-flex; align-items: center; gap: 3px; padding: 5px 9px; border-radius: 16px; background: #fff; border: 1.5px solid #E5E7EB; font-size: 11.5px; font-weight: 600; color: #6B7280; cursor: pointer; white-space: nowrap; transition: all .15s; flex-shrink: 0; font-family: inherit; }
.wrv-fpill .material-symbols-outlined { font-size: 13px; }
.wrv-fpill.on { background: #166534; color: #fff; border-color: #166534; }
.wrv-fpill:not(.on):hover { border-color: #166534; color: #166534; }

/* Review cards */
.wrv-rev-list { display: flex; flex-direction: column; gap: 10px; }
.wrv-card { background: #fff; border-radius: 16px; border: 1.5px solid #EBEBEB; padding: 14px 16px; transition: border-color .15s, box-shadow .15s, transform .1s; animation: fadeUpWrv .3s ease both; animation-delay: var(--wiki-review-delay, 0s); }
.wrv-card:hover { border-color: #D1D5DB; box-shadow: 0 4px 16px rgba(0,0,0,.06); }
.wrv-card:active { transform: scale(.997); }
.wrv-card-meta { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.wrv-user { display: flex; align-items: center; gap: 8px; min-width: 0; }
.wrv-avatar { width: 32px; height: 32px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; flex-shrink: 0; }
.wrv-uname { font-weight: 700; font-size: 13px; color: #111827; }
.wrv-date { font-size: 11px; color: #9CA3AF; margin-top: 1px; }
.wrv-rating { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 700; padding: 3px 9px; border-radius: 16px; flex-shrink: 0; }
.wrv-card-crops { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.wrv-tag-sm { font-size: 11px; font-weight: 500; padding: 2px 7px; border-radius: 10px; background: #DCFCE7; color: #166534; }
.wrv-tag-more { background: #F3F4F6; color: #6B7280; cursor: pointer; }
.wrv-tag-more:active { background: #E5E7EB; }
.wrv-sections { display: flex; flex-direction: column; gap: 5px; margin: 2px 0 8px; }
.wrv-section { display: flex; flex-direction: column; gap: 6px; }
.wrv-section-title { font-size: 10px; font-weight: 800; color: #64748B; text-transform: uppercase; letter-spacing: 0.05em; }
.wrv-text { font-size: 13px; line-height: 1.55; color: #374151; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 10px; white-space: pre-wrap; }
.wrv-text--empty { color: #9CA3AF; font-style: italic; }
.wrv-card--open .wrv-text { -webkit-line-clamp: unset; display: block; }
.wrv-detail { display: none; margin-top: 8px; }
.wrv-card--open .wrv-detail { display: block; animation: fadeUpWrv .25s ease both; }
.wrv-subratings { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.wrv-sub-chip { display: inline-flex; align-items: center; gap: 4px; background: #F9FAFB; border: 1px solid #F3F4F6; border-radius: 8px; padding: 4px 8px; font-size: 12px; font-weight: 700; color: #374151; }
.wrv-sub-lbl { font-weight: 500; color: #9CA3AF; }
.wrv-meta-line { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 12px; color: #6B7280; margin-bottom: 8px; }
.wrv-meta-sep { color: #D1D5DB; }
.wrv-detail-actions { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.wrv-trans-btn { display: inline-flex; align-items: center; gap: 4px; background: #EFF6FF; border: 1px solid #DBEAFE; border-radius: 10px; padding: 6px 10px; font-size: 12px; font-weight: 600; color: #1D4ED8; cursor: pointer; font-family: inherit; }
.wrv-down { display: inline-flex; align-items: center; gap: 4px; background: #EFF6FF; border: 1px solid #DBEAFE; border-radius: 10px; padding: 6px 10px; font-size: 12px; font-weight: 600; color: #1D4ED8; cursor: pointer; font-family: inherit; }
.wrv-trans-btn .material-symbols-outlined, .wrv-down .material-symbols-outlined { font-size: 16px; }
.wrv-discuss { display: inline-flex; align-items: center; gap: 4px; background: #EFF6FF; border: 1px solid #DBEAFE; border-radius: 10px; padding: 6px 8px; font-size: 11px; font-weight: 600; color: #1D4ED8; cursor: pointer; font-family: inherit; white-space: nowrap; }
.wrv-discuss:active { background: #DBEAFE; }
.wrv-amenities { display: flex; flex-wrap: wrap; gap: 6px; }
.wrv-amenities span { font-size: 11px; color: #6B7280; background: #F9FAFB; border: 1px solid #F3F4F6; border-radius: 8px; padding: 3px 7px; }
.wrv-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 6px; border-top: 1px solid #F9FAFB; padding-top: 9px; }
.wrv-card-actions { display: flex; align-items: center; gap: 6px; }
.wrv-like { display: inline-flex; align-items: center; gap: 4px; background: #EFF6FF; border: 1px solid #DBEAFE; border-radius: 10px; padding: 6px 10px; cursor: pointer; font-size: 12px; color: #1D4ED8; font-family: inherit; font-weight: 600; transition: transform .15s; }
.wrv-like.ne-rxn-pulse { transform: scale(1.2); }
.wrv-like-icon { font-size: 14px; }
.wrv-open { display: inline-flex; align-items: center; gap: 5px; padding: 4px 0; margin-bottom: 4px; border: none; background: transparent; color: #15803d; font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; border-radius: 20px; }
.wrv-open:active { opacity: .7; }
.wrv-link-box { margin: 8px 0 4px; }

/* Empty / loading */
.wrv-empty { text-align: center; padding: 40px 20px; }
.wrv-empty-icon { width: 56px; height: 56px; border-radius: 50%; background: #F0FDF4; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }
.wrv-empty-icon .material-symbols-outlined { font-size: 28px; color: #4ADE80; }
.wrv-empty-title { font-size: 15px; font-weight: 700; color: #111827; margin: 0 0 4px; }
.wrv-empty-desc { font-size: 13px; color: #9CA3AF; margin: 0; }
.wrv-loading { display: flex; flex-direction: column; gap: 10px; }
.wrv-sk-card { background: #fff; border-radius: 16px; border: 1.5px solid #EBEBEB; padding: 14px 16px; }
.wrv-sk-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.wrv-sk-avatar { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; }
.wrv-sk-line-40 { height: 12px; width: 40%; border-radius: 6px; }
.wrv-sk-line-70 { height: 12px; width: 70%; border-radius: 6px; margin-top: 6px; }
.wrv-sk-line-90 { height: 12px; width: 90%; border-radius: 6px; }
.wrv-sk-badge { height: 20px; width: 44px; border-radius: 10px; margin-left: auto; }

/* Desktop: center as dialog */
@media (min-width: 600px) {
  .wrv-overlay { align-items: center; }
  .wrv-sheet { max-width: 460px; max-height: 90vh; margin-bottom: 0; border-radius: 22px; }
}

/* ── Content ─────────────────────────────────────────────────────────────── */
.sp2-content { padding: 0; }
.sp2-tab-view { animation: wikiCardIn 0.35s cubic-bezier(0.2,0.8,0.2,1) both; }

/* ── Search bar ──────────────────────────────────────────────────────────── */
.sp2-search-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--ne-surface);
  border: 1px solid var(--ne-border);
  border-radius: 9999px;
  padding: 10px 16px;
  margin: 0 16px 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  backdrop-filter: blur(12px);
}
.sp2-search-bar .material-symbols-outlined { color: var(--ne-hint); font-size: 20px; flex-shrink: 0; }
.sp2-search-input {
  flex: 1;
  border: none;
  background: transparent;
  font-size: 15px;
  color: var(--ne-ink);
  outline: none;
  font-family: inherit;
}
.sp2-search-input::placeholder { color: var(--ne-hint); }
.sp2-search-clear {
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px;
  color: var(--ne-hint);
  display: flex;
  align-items: center;
}
.sp2-search-clear .material-symbols-outlined { font-size: 18px; }
.sp2-search-clear[hidden] { display: none; }

/* ── Filter chips ────────────────────────────────────────────────────────── */
.sp2-filters { padding: 0 16px 12px; display: flex; flex-direction: column; gap: 8px; }
.sp2-chips-row {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}
.sp2-chips-row::-webkit-scrollbar { display: none; }

.sp2-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-radius: 9999px;
  border: 1.5px solid var(--ne-border);
  background: var(--ne-surface);
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-muted);
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s var(--ne-ease-spring);
  flex-shrink: 0;
}
.sp2-chip .material-symbols-outlined { font-size: 14px; }
.sp2-chip:active { transform: scale(0.95); }
.sp2-chip--active { background: var(--ne-primary); color: #fff; border-color: transparent; }
.sp2-chip--sw.sp2-chip--active { background: #f97316; }
.sp2-chip--sk.sp2-chip--active { background: #3b82f6; }
.sp2-chip--sm { padding: 5px 10px; font-size: 12px; }

.sp2-chip__dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.sp2-chip__dot--a { background: #1aae39; }
.sp2-chip__dot--b { background: #f9ab00; }

.sp2-chip-select-wrap {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.sp2-chip-select {
  appearance: none;
  padding: 6px 28px 6px 12px;
  border-radius: 9999px;
  border: 1.5px solid var(--ne-border);
  background: var(--ne-surface);
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-muted);
  cursor: pointer;
  font-family: inherit;
}
.sp2-chip-select-wrap .material-symbols-outlined {
  position: absolute;
  right: 8px;
  font-size: 14px;
  color: var(--ne-hint);
  pointer-events: none;
}
.sp2-chip-select.sp2-chip--active { background: var(--ne-primary); color: #fff; border-color: transparent; }

/* ── Sponsor card ────────────────────────────────────────────────────────── */
.sp2-cards-list { display: flex; flex-direction: column; gap: 10px; padding: 0 16px; }

.sp2-card {
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  border: 1px solid var(--ne-border);
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  backdrop-filter: blur(12px);
  animation: wikiCardIn 0.3s cubic-bezier(0.2,0.8,0.2,1) both;
  margin-bottom: 0;
}
.sp2-card--sw { border-left: 3px solid #f97316; }

.sp2-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.sp2-card__title-wrap { flex: 1; min-width: 0; }
.sp2-card__name {
  font-size: 15px;
  font-weight: 800;
  color: var(--ne-ink);
  margin: 0 0 4px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp2-card__location {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 12px;
  color: var(--ne-muted);
}
.sp2-card__location .material-symbols-outlined { font-size: 14px; color: var(--ne-hint); }

.sp2-card__star {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: var(--ne-surface-2);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.15s var(--ne-ease-spring);
}
.sp2-card__star .material-symbols-outlined { font-size: 18px; color: var(--ne-hint); font-variation-settings: 'FILL' 0; }
.sp2-card__star--active { background: #fff3e0; }
.sp2-card__star--active .material-symbols-outlined { color: #f9ab00; font-variation-settings: 'FILL' 1; }
.sp2-card__star:active { transform: scale(0.88); }

.sp2-card__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }

.sp2-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 9999px;
}
.sp2-badge--route { }
.sp2-route--sw { background: #fff3e0; color: #f97316; }
.sp2-route--sk { background: #e8f0fe; color: #1557b0; }
.sp2-route--other { background: var(--ne-surface-2); color: var(--ne-muted); }

.sp2-badge--rating { }
.sp2-badge__dot { width: 7px; height: 7px; border-radius: 50%; }
.sp2-rating--a { background: #e6f4ea; color: #137333; }
.sp2-rating--a .sp2-badge__dot { background: #1aae39; }
.sp2-rating--b { background: #fff8e1; color: #b45309; }
.sp2-rating--b .sp2-badge__dot { background: #f9ab00; }

.sp2-badge--type { background: var(--ne-surface-2); color: var(--ne-muted); font-size: 10px; }
/* Factual "on the official licensed register" badge — green, reinforces the
   official-vs-scam signal (every result IS from the UK register). States licence
   status only, never "safe/verified/recommended". */
.sp2-badge--official { background: #e6f4ea; color: #137333; }
.sp2-badge--official .material-symbols-outlined { font-size: 13px; }

.sp2-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--ne-border);
}
.sp2-card__date {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--ne-hint);
}
.sp2-card__date .material-symbols-outlined { font-size: 14px; }
.sp2-card__jobs-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ne-primary);
  text-decoration: none;
  background: rgba(26,115,232,0.08);
  padding: 5px 10px;
  border-radius: 9999px;
  transition: background 0.15s;
}
.sp2-card__jobs-btn:active { background: rgba(26,115,232,0.15); }
.sp2-card__jobs-btn .material-symbols-outlined { font-size: 14px; }

/* ── Load more ───────────────────────────────────────────────────────────── */
.sp2-load-more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: calc(100% - 32px);
  margin: 12px 16px;
  padding: 14px;
  border-radius: 9999px;
  border: 1.5px solid var(--ne-border);
  background: var(--ne-surface);
  color: var(--ne-muted);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.sp2-load-more:active { background: var(--ne-surface-2); }
.sp2-load-more .material-symbols-outlined { font-size: 18px; }

/* ── Empty state ─────────────────────────────────────────────────────────── */
.sp2-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 48px 24px;
  text-align: center;
  color: var(--ne-muted);
  font-size: 14px;
}
.sp2-empty .material-symbols-outlined { font-size: 48px; color: var(--ne-border); }

/* ── Skeleton ────────────────────────────────────────────────────────────── */
.sp2-skeleton {
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  margin: 0 16px 10px;
  border: 1px solid var(--ne-border);
}
.sp2-skeleton__line {
  height: 14px;
  border-radius: 7px;
  background: linear-gradient(90deg, var(--ne-border) 25%, var(--ne-surface-2) 50%, var(--ne-border) 75%);
  background-size: 200% 100%;
  animation: sk-shimmer 1.4s ease-in-out infinite;
  margin-bottom: 8px;
}
.sp2-skeleton__line--title { width: 65%; height: 16px; }
.sp2-skeleton__line--sub { width: 40%; height: 12px; }
.sp2-skeleton__badges { display: flex; gap: 6px; margin-top: 12px; }
.sp2-skeleton__badge { width: 70px; height: 22px; border-radius: 9999px; background: var(--ne-border); animation: sk-shimmer 1.4s ease-in-out infinite; }

/* ── Stats ───────────────────────────────────────────────────────────────── */
.sp2-stats { padding: 0 16px 16px; display: flex; flex-direction: column; gap: 10px; }

.sp2-stat-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  background: linear-gradient(135deg, var(--ne-primary) 0%, var(--ne-violet) 100%);
  border-radius: var(--ne-radius-lg);
  padding: 20px;
  color: #fff;
}
.sp2-stat-hero .material-symbols-outlined { font-size: 36px; font-variation-settings: 'FILL' 1; color: rgba(255,255,255,0.9); }
.sp2-stat-hero__num { font-size: 36px; font-weight: 800; line-height: 1; font-family: 'Lora', serif; }
.sp2-stat-hero__label { font-size: 13px; color: rgba(255,255,255,0.8); margin-top: 4px; }

.sp2-stat-today {
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  border: 1px solid var(--ne-border);
}
.sp2-stat-today__title { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ne-muted); margin: 0 0 12px; }
.sp2-stat-today__row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.sp2-stat-today__item { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 8px; border-radius: var(--ne-radius-md); }
.sp2-stat-today__item--green { background: #e6f4ea; }
.sp2-stat-today__item--red { background: #fce8e6; }
.sp2-stat-today__item--amber { background: #fff8e1; }
.sp2-stat-today__num { font-size: 28px; font-weight: 800; line-height: 1; }
.sp2-stat-today__item--green .sp2-stat-today__num { color: #137333; }
.sp2-stat-today__item--red .sp2-stat-today__num { color: #c5221f; }
.sp2-stat-today__item--amber .sp2-stat-today__num { color: #b45309; }
.sp2-stat-today__item span:last-child { font-size: 10px; font-weight: 700; color: var(--ne-muted); text-align: center; }

/* ── Section heading ─────────────────────────────────────────────────────── */
.sp2-section-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ne-muted);
  padding: 0 16px 10px;
}
.sp2-section-head .material-symbols-outlined { font-size: 16px; color: var(--ne-primary); font-variation-settings: 'FILL' 1; }

/* ── Timeline ────────────────────────────────────────────────────────────── */
.sp2-timeline { padding: 0 16px; display: flex; flex-direction: column; gap: 10px; }

.sp2-tl-item {
  display: flex;
  gap: 12px;
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 14px;
  border: 1px solid var(--ne-border);
  border-left: 4px solid var(--ne-border);
  animation: wikiCardIn 0.3s cubic-bezier(0.2,0.8,0.2,1) both;
}
.sp2-tl--added { border-left-color: #1aae39; }
.sp2-tl--removed { border-left-color: #c5221f; }
.sp2-tl--downgrade { border-left-color: #f9ab00; }
.sp2-tl--rating { border-left-color: var(--ne-primary); }
.sp2-tl-item--sw { background: #fff8f0; }

.sp2-tl-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sp2-tl--added .sp2-tl-icon { background: #e6f4ea; }
.sp2-tl--added .sp2-tl-icon .material-symbols-outlined { color: #1aae39; font-size: 18px; font-variation-settings: 'FILL' 1; }
.sp2-tl--removed .sp2-tl-icon { background: #fce8e6; }
.sp2-tl--removed .sp2-tl-icon .material-symbols-outlined { color: #c5221f; font-size: 18px; font-variation-settings: 'FILL' 1; }
.sp2-tl--downgrade .sp2-tl-icon { background: #fff8e1; }
.sp2-tl--downgrade .sp2-tl-icon .material-symbols-outlined { color: #f9ab00; font-size: 18px; }
.sp2-tl--rating .sp2-tl-icon { background: #e8f0fe; }
.sp2-tl--rating .sp2-tl-icon .material-symbols-outlined { color: var(--ne-primary); font-size: 18px; }

.sp2-tl-body { flex: 1; min-width: 0; }
.sp2-tl-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.sp2-tl-badge { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; padding: 2px 7px; border-radius: 9999px; }
.sp2-tl--added .sp2-tl-badge { background: #1aae39; color: #fff; }
.sp2-tl--removed .sp2-tl-badge { background: #c5221f; color: #fff; }
.sp2-tl--downgrade .sp2-tl-badge { background: #f9ab00; color: #fff; }
.sp2-tl--rating .sp2-tl-badge { background: var(--ne-primary); color: #fff; }
.sp2-tl-date { font-size: 11px; color: var(--ne-hint); }
.sp2-tl-name { font-size: 14px; font-weight: 700; color: var(--ne-ink); margin: 0 0 6px; }
.sp2-tl-meta { display: flex; gap: 12px; flex-wrap: wrap; }
.sp2-tl-meta span { display: flex; align-items: center; gap: 3px; font-size: 12px; color: var(--ne-muted); }
.sp2-tl-meta .material-symbols-outlined { font-size: 13px; }
.sp2-tl-diff { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 12px; font-weight: 700; }
.sp2-tl-diff .material-symbols-outlined { font-size: 14px; color: var(--ne-hint); }
.sp2-tl-diff__old { background: #fce8e6; color: #c5221f; padding: 2px 8px; border-radius: 9999px; }
.sp2-tl-diff__new { background: #e6f4ea; color: #137333; padding: 2px 8px; border-radius: 9999px; }

/* ── Map ─────────────────────────────────────────────────────────────────── */
.sp2-map-element { height: calc(100vh - 280px); min-height: 300px; border-radius: var(--ne-radius-lg); margin: 0 16px; overflow: hidden; border: 1px solid var(--ne-border); }
.sp2-map-hint { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; color: var(--ne-hint); padding: 8px 16px; line-height: 1.4; }
.sp2-map-hint .material-symbols-outlined { font-size: 14px; flex-shrink: 0; margin-top: 1px; }

@media (min-width: 600px) {
  .sp2-hero { border-radius: var(--ne-radius-xl); margin: 12px 12px 8px; }
  .sp2-cards-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
}


/* ══════════════════════════════════════════════════════════════════════════════
   Sponsor Module v2 — Onboarding, Job Cards, Job Modal
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Onboarding ──────────────────────────────────────────────────────────── */
.sp2-ob-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(6px);
  display: flex; align-items: flex-end; justify-content: center;
  padding: 16px;
  animation: wikiFadeIn 0.2s ease;
}
.sp2-ob-card {
  background: var(--ne-surface-solid);
  border-radius: var(--ne-radius-xl);
  padding: 28px 24px 24px;
  width: 100%; max-width: 420px;
  position: relative;
  box-shadow: 0 24px 48px rgba(0,0,0,0.2);
  animation: wikiCardIn 0.3s cubic-bezier(0.2,0.8,0.2,1) both;
}
.sp2-ob-close {
  position: absolute; top: 16px; right: 16px;
  width: 32px; height: 32px; border-radius: 50%;
  border: none; background: var(--ne-surface-2);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--ne-muted);
}
.sp2-ob-close .material-symbols-outlined { font-size: 18px; }
.sp2-ob-icon {
  width: 64px; height: 64px; border-radius: 20px;
  background: var(--ob-color, var(--ne-primary));
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 20px;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--ob-color, var(--ne-primary)) 40%, transparent);
}
.sp2-ob-icon .material-symbols-outlined { font-size: 32px; color: #fff; font-variation-settings: 'FILL' 1; }
.sp2-ob-title { font-size: 20px; font-weight: 800; color: var(--ne-ink); text-align: center; margin: 0 0 10px; }
.sp2-ob-desc { font-size: 14px; color: var(--ne-muted); text-align: center; line-height: 1.5; margin: 0 0 24px; }
.sp2-ob-dots { display: flex; justify-content: center; gap: 6px; margin-bottom: 24px; }
.sp2-ob-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ne-border); transition: all 0.2s; }
.sp2-ob-dot--active { width: 24px; background: var(--ne-primary); border-radius: 4px; }
.sp2-ob-actions { display: flex; gap: 10px; }
.sp2-ob-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 13px 16px; border-radius: 9999px;
  font-size: 14px; font-weight: 700; cursor: pointer; border: none;
  font-family: inherit; transition: transform 0.15s var(--ne-ease-spring);
}
.sp2-ob-btn:active { transform: scale(0.96); }
.sp2-ob-btn .material-symbols-outlined { font-size: 18px; }
.sp2-ob-btn--primary { background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet)); color: #fff; box-shadow: 0 4px 14px rgba(26,115,232,0.3); }
.sp2-ob-btn--ghost { background: var(--ne-surface-2); color: var(--ne-muted); }

/* ── Job cards ───────────────────────────────────────────────────────────── */
.sp2-job-card {
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  border: 1px solid var(--ne-border);
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  margin-bottom: 10px;
  cursor: pointer;
  transition: transform 0.15s var(--ne-ease-spring);
  animation: wikiCardIn 0.3s cubic-bezier(0.2,0.8,0.2,1) both;
}
.sp2-job-card--urgent { border-left: 3px solid #c5221f; }
.sp2-job-card:active { transform: scale(0.98); }

.sp2-job-card__header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.sp2-job-sector-icon {
  width: 44px; height: 44px; border-radius: 14px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.sp2-job-sector-icon .material-symbols-outlined { font-size: 22px; font-variation-settings: 'FILL' 1; }
.sp2-sector-bg-care   { background: #fce4ec; } .sp2-sector-bg-care   .material-symbols-outlined { color: #c62828; }
.sp2-sector-bg-it     { background: #e8f5e9; } .sp2-sector-bg-it     .material-symbols-outlined { color: #2e7d32; }
.sp2-sector-bg-agri   { background: #f1f8e9; } .sp2-sector-bg-agri   .material-symbols-outlined { color: #558b2f; }
.sp2-sector-bg-hosp   { background: #fff3e0; } .sp2-sector-bg-hosp   .material-symbols-outlined { color: #e65100; }
.sp2-sector-bg-logi   { background: #e3f2fd; } .sp2-sector-bg-logi   .material-symbols-outlined { color: #1565c0; }
.sp2-sector-bg-const  { background: #fafafa; } .sp2-sector-bg-const  .material-symbols-outlined { color: #616161; }

.sp2-job-card__info { flex: 1; min-width: 0; }
.sp2-job-card__live { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; color: #c5221f; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 4px; }
.sp2-pulse { width: 6px; height: 6px; background: #c5221f; border-radius: 50%; animation: hiringPulse 1.5s infinite; flex-shrink: 0; }
.sp2-job-card__name { font-size: 15px; font-weight: 800; color: var(--ne-ink); margin: 0 0 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp2-job-card__badges { display: flex; flex-wrap: wrap; gap: 4px; }
.sp2-job-card__title { font-size: 13px; color: var(--ne-muted); margin: 0 0 10px; line-height: 1.4; }
.sp2-job-card__footer { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-top: 10px; border-top: 1px solid var(--ne-border); }
.sp2-job-card__meta { display: flex; align-items: center; gap: 3px; font-size: 12px; color: var(--ne-muted); }
.sp2-job-card__meta .material-symbols-outlined { font-size: 13px; }
.sp2-job-urgent { font-size: 10px; font-weight: 800; padding: 2px 8px; border-radius: 9999px; }
.sp2-job-urgent--hot { background: #c5221f; color: #fff; }
.sp2-job-urgent--warn { background: #f9ab00; color: #fff; }

/* ── Job details modal ───────────────────────────────────────────────────── */
.sp2-jm-overlay {
  position: fixed; inset: 0; z-index: 9990;
  background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
  opacity: 0; transition: opacity 0.3s ease;
}
.sp2-jm-overlay.active { opacity: 1; }
.sp2-jm-sheet {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9991;
  background: var(--ne-surface-solid);
  border-radius: var(--ne-radius-xl) var(--ne-radius-xl) 0 0;
  max-height: 90vh; overflow-y: auto;
  transform: translateY(100%); transition: transform 0.3s cubic-bezier(0.22,1,0.36,1);
  padding-bottom: env(safe-area-inset-bottom, 20px);
}
.sp2-jm-sheet.active { transform: translateY(0); }
.sp2-jm-handle-bar { padding: 12px 0 4px; display: flex; justify-content: center; }
.sp2-jm-handle { width: 36px; height: 4px; border-radius: 2px; background: var(--ne-border); }
.sp2-jm-top-actions { display: flex; align-items: center; justify-content: space-between; padding: 0 16px 8px; }
.sp2-jm-close { width: 36px; height: 36px; border-radius: 50%; border: none; background: var(--ne-surface-2); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.sp2-jm-close .material-symbols-outlined { font-size: 20px; color: var(--ne-muted); }
.sp2-jm-content { padding: 0 16px 24px; }
.sp2-jm-hero { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 12px; }
.sp2-jm-sector-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ne-muted); }
.sp2-jm-name { font-size: 20px; font-weight: 800; color: var(--ne-ink); margin: 4px 0 0; line-height: 1.2; }
.sp2-jm-vacancy-title { font-size: 15px; font-weight: 700; color: var(--ne-ink); margin: 0 0 12px; }
.sp2-jm-desc { background: var(--ne-surface-2); border-radius: var(--ne-radius-md); padding: 14px; margin-bottom: 16px; }
.sp2-jm-p { font-size: 13px; color: var(--ne-muted); line-height: 1.6; margin: 0 0 6px; }
.sp2-jm-p:last-child { margin: 0; }
.sp2-jm-meta-grid { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.sp2-jm-meta-item { display: flex; align-items: center; gap: 12px; background: var(--ne-surface-2); border-radius: var(--ne-radius-md); padding: 12px 14px; }
.sp2-jm-meta-item > .material-symbols-outlined { font-size: 20px; color: var(--ne-primary); font-variation-settings: 'FILL' 1; flex-shrink: 0; }
.sp2-jm-meta-label { font-size: 11px; color: var(--ne-muted); font-weight: 600; }
.sp2-jm-meta-val { font-size: 14px; font-weight: 700; color: var(--ne-ink); margin-top: 2px; }
.sp2-jm-compliance { display: flex; gap: 10px; align-items: flex-start; background: #fff8e1; border-radius: var(--ne-radius-md); padding: 12px 14px; margin-bottom: 16px; border: 1px solid rgba(249,171,0,0.3); }
.sp2-jm-compliance .material-symbols-outlined { font-size: 18px; color: var(--ne-amber-text); flex-shrink: 0; margin-top: 1px; font-variation-settings: 'FILL' 1; }
.sp2-jm-compliance p { font-size: 12px; color: #7a4f00; line-height: 1.5; margin: 0; }
.sp2-jm-apply h3 { font-size: 16px; font-weight: 800; color: var(--ne-ink); margin: 0 0 6px; }
.sp2-jm-apply p { font-size: 13px; color: var(--ne-muted); margin: 0 0 12px; }
.sp2-jm-email { display: flex; align-items: center; gap: 8px; background: var(--ne-surface-2); border-radius: var(--ne-radius-md); padding: 12px 14px; margin-bottom: 12px; font-size: 14px; color: var(--ne-ink); font-weight: 600; }
.sp2-jm-email .material-symbols-outlined { font-size: 18px; color: var(--ne-primary); }
.sp2-jm-apply-btn { width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 15px; border-radius: 9999px; background: linear-gradient(135deg, var(--ne-primary), var(--ne-violet)); color: #fff; font-size: 15px; font-weight: 700; border: none; cursor: pointer; font-family: inherit; box-shadow: 0 4px 14px rgba(26,115,232,0.3); }
.sp2-jm-apply-btn .material-symbols-outlined { font-size: 20px; }


/* ── Jobs tab ────────────────────────────────────────────────────────────── */
.sp2-jobs-hero {
  position: relative;
  background: linear-gradient(135deg, #1557b0 0%, var(--ne-primary) 50%, #12b5cb 100%);
  border-radius: var(--ne-radius-xl);
  padding: 24px 20px;
  margin: 0 16px 16px;
  overflow: hidden;
}
.sp2-jobs-hero__badge {
  display: inline-block;
  background: rgba(255,255,255,0.2);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 9999px;
  margin-bottom: 10px;
}
.sp2-jobs-hero__title { font-size: 20px; font-weight: 800; color: #fff; margin: 0 0 8px; line-height: 1.2; max-width: 75%; }
.sp2-jobs-hero__desc { font-size: 12px; color: rgba(255,255,255,0.8); line-height: 1.5; margin: 0; max-width: 75%; }
.sp2-jobs-hero__icon { position: absolute; right: -8px; bottom: -8px; font-size: 80px; color: rgba(255,255,255,0.1); font-variation-settings: 'FILL' 1; pointer-events: none; }

.sp2-jobs-form {
  background: var(--ne-surface);
  border-radius: var(--ne-radius-lg);
  padding: 16px;
  margin: 0 16px 16px;
  border: 1px solid var(--ne-border);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sp2-jobs-form__field { display: flex; flex-direction: column; gap: 6px; }
.sp2-jobs-form__label { font-size: 12px; font-weight: 700; color: var(--ne-muted); text-transform: uppercase; letter-spacing: 0.06em; }

.sp2-job-cats {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 16px 20px;
}
.sp2-job-cat {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--ne-surface);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-lg);
  padding: 12px 14px;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: transform 0.15s var(--ne-ease-spring), box-shadow 0.15s;
}
.sp2-job-cat:active { transform: scale(0.98); box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
.sp2-job-cat__name { flex: 1; font-size: 14px; font-weight: 700; color: var(--ne-ink); }
.sp2-job-cat__arrow { color: var(--ne-hint); font-size: 20px; }


/* ── Other routes custom dropdown ─────────────────────────────────────────── */
.sp2-chip--dropdown {
  gap: 4px;
}
.sp2-chip__other-label {
  max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp2-chip__chevron {
  font-size: 16px;
  transition: transform 0.2s var(--ne-ease-spring);
}
.sp2-chip__chevron--open {
  transform: rotate(180deg);
}

.sp2-other-dropdown {
  background: var(--ne-surface-solid);
  border: 1px solid var(--ne-border);
  border-radius: var(--ne-radius-lg);
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
  overflow: hidden;
  animation: wikiCardIn 0.2s cubic-bezier(0.2,0.8,0.2,1) both;
  margin-bottom: 4px;
}

.sp2-other-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 16px;
  border: none;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  color: var(--ne-ink);
  cursor: pointer;
  text-align: left;
  border-bottom: 1px solid var(--ne-border);
  font-family: inherit;
  transition: background 0.12s;
}
.sp2-other-item:last-of-type { border-bottom: none; }
.sp2-other-item:active { background: var(--ne-surface-2); }

.sp2-other-item .material-symbols-outlined {
  font-size: 18px;
  color: var(--ne-hint);
  flex-shrink: 0;
  font-variation-settings: 'FILL' 0;
}
.sp2-other-item--active {
  background: #e8f0fe;
  color: var(--ne-primary);
  font-weight: 700;
}
.sp2-other-item--active .material-symbols-outlined {
  color: var(--ne-primary);
  font-variation-settings: 'FILL' 1;
}

.sp2-other-clear {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 10px 16px;
  border: none;
  border-top: 1px solid var(--ne-border);
  background: #fce8e6;
  font-size: 12px;
  font-weight: 700;
  color: #c5221f;
  cursor: pointer;
  font-family: inherit;
}
.sp2-other-clear .material-symbols-outlined { font-size: 16px; }


/* ── Sponsor nav as select ───────────────────────────────────────────────── */
.sp2-nav {
  padding: 0 16px 10px;
}
.sp2-nav-select-wrap {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--ne-surface);
  border: 1.5px solid var(--ne-primary);
  border-radius: 9999px;
  padding: 0 14px;
  height: 40px;
  box-shadow: 0 2px 8px rgba(26,115,232,0.12);
}
.sp2-nav-select__icon {
  font-size: 18px;
  color: var(--ne-primary);
  font-variation-settings: 'FILL' 1;
  flex-shrink: 0;
  margin-right: 6px;
}
.sp2-nav-select {
  flex: 1;
  appearance: none;
  border: none;
  background: transparent;
  font-size: 14px;
  font-weight: 700;
  color: var(--ne-primary);
  font-family: inherit;
  cursor: pointer;
  outline: none;
  padding-right: 4px;
}
.sp2-nav-select__arrow {
  font-size: 20px;
  color: var(--ne-primary);
  pointer-events: none;
  flex-shrink: 0;
}


/* ── Sponsor filters as select row ───────────────────────────────────────── */
.sp2-filter-row {
  display: flex;
  gap: 8px;
}
.sp2-filter-row .sp2-nav-select-wrap {
  min-width: 0;
}
.sp2-filter-row .sp2-nav-select-wrap:first-child {
  flex: 1.8;
}
.sp2-filter-row .sp2-nav-select-wrap:last-child {
  flex: 1;
}


/* ── Sponsor topbar — all selects in one row ─────────────────────────────── */
.sp2-topbar {
  display: flex;
  gap: 6px;
  padding: 0 16px 10px;
  align-items: center;
}
.sp2-topbar__nav    { flex: 1.4; min-width: 0; }
.sp2-topbar__filter { flex: 1.6; min-width: 0; }
.sp2-topbar__rating { flex: 0.8; min-width: 0; }

/* Ensure nav padding is removed now that topbar handles it */
.sp2-nav { padding: 0; }


/* ── Topbar compact fix for mobile ──────────────────────────────────────── */
.sp2-topbar__rating {
  flex: 0 0 auto;
  width: auto;
}
.sp2-topbar__rating .sp2-nav-select {
  min-width: 48px;
  max-width: 68px;
}
.sp2-topbar__nav { flex: 1.2; }
.sp2-topbar__filter { flex: 1.4; }


/* ── Sponsor history modal ───────────────────────────────────────────────── */
.sp2-hm-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 48px 24px;
  font-size: 14px;
  color: var(--ne-muted);
}
.sp2-hm-timeline { padding-bottom: 16px; }
.sp2-card { cursor: pointer; transition: transform 0.15s var(--ne-ease-spring), box-shadow 0.15s; }
.sp2-card:active { transform: scale(0.98); box-shadow: 0 4px 16px rgba(0,0,0,0.08); }

/* ── Companies House check (sponsor history modal) ──────────────────────────── */
.sp2-ch-section {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--ne-border);
}

.sp2-ch-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid rgba(51,144,236,0.4);
  border-radius: var(--ne-radius-lg);
  background: #e8f1ff;
  color: #0d4a8f;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.sp2-ch-btn:active { transform: scale(0.98); }
.sp2-ch-btn .material-symbols-outlined { font-size: 18px; color: #3390ec; }

#sp2-ch-result { margin-top: 12px; }

.sp2-ch-row {
  display: flex;
  gap: 10px;
  padding: 12px;
  border-radius: var(--ne-radius-lg);
  margin-bottom: 8px;
  border: 1.5px solid var(--ne-border);
  background: var(--ne-surface);
}
.sp2-ch-row--ok   { border-color: rgba(52,168,83,0.45);  background: #ecf8ef; }
.sp2-ch-row--bad  { border-color: rgba(217,48,37,0.45);  background: #fdeeed; }
.sp2-ch-row--warn { border-color: rgba(249,171,0,0.45);  background: #fff8e6; }

.sp2-ch-row__icon { font-size: 20px; flex-shrink: 0; font-variation-settings: 'FILL' 1; }
.sp2-ch-row--ok   .sp2-ch-row__icon { color: #34a853; }
.sp2-ch-row--bad  .sp2-ch-row__icon { color: #d93025; }
.sp2-ch-row--warn .sp2-ch-row__icon { color: var(--ne-amber-text); }

.sp2-ch-row__body { min-width: 0; }
.sp2-ch-row__name { font-size: 13px; font-weight: 800; color: var(--ne-ink); }
.sp2-ch-row__status { font-size: 12px; color: var(--ne-ink); margin-top: 2px; }
.sp2-ch-row__addr { font-size: 11px; color: var(--ne-muted); margin-top: 2px; }

.sp2-ch-young {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  font-size: 11px;
  font-weight: 700;
  color: #7a4f00;
}
.sp2-ch-young .material-symbols-outlined { font-size: 14px; }

.sp2-ch-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  border-radius: var(--ne-radius-lg);
  font-size: 12px;
  line-height: 1.5;
}
.sp2-ch-note--muted { background: var(--ne-surface-2); color: var(--ne-muted); }
.sp2-ch-note .material-symbols-outlined { font-size: 18px; flex-shrink: 0; }

.sp2-ch-source {
  margin-top: 8px;
  font-size: 10px;
  color: var(--ne-muted);
  text-align: right;
}

/* ── Sponsors — Material 3 · Blue skin ──────────────────────────────────────
   Scoped token remap under .sp2-root: all sp2-* children inherit M3 Blue
   values. Nothing outside #sponsors is affected.
   ─────────────────────────────────────────────────────────────────────────── */
.sp2-root {
  /* --ne-primary inherits #1a73e8 from :root (identical value) — no local
     re-declare needed; .sp2-root is a top-level module root, never nested
     under a tg-scope that would override it. */
  --ne-primary-active:    #1557b0;
  --ne-primary-container: #e8f0fe;
  --ne-violet:            #7c4dff;
  --ne-amber:             #f9ab00;
  --ne-success:           #1e8e3e;
  --ne-error:             #c5221f;
  --ne-ink:               #1b1b1f;
  --ne-muted:             #4a4d52;
  --ne-hint:              #5f6368;
  --ne-border:            #e8eaed;
  --ne-bg-app:            #F2F2F7;
  --ne-surface:           #ffffff;
  --ne-surface-solid:     #ffffff;
  --ne-surface-2:         #f0f4f9;
  --ne-radius-sm:         12px;
  --ne-radius-md:         16px;
  --ne-radius-lg:         20px;
  --ne-radius-xl:         28px;
  --ne-ease-spring:       cubic-bezier(0.34, 1.56, 0.64, 1);
  --ne-ease-out:          cubic-bezier(0.22, 1, 0.36, 1);
}
/* M3 hero: primary → primary-2 (blue only, no violet) */
.sp2-root .sp2-hero {
  background: linear-gradient(90deg, #1a73e8, #8ab4f8);
}

/* M3 card shadow */
.sp2-root .sp2-card {
  backdrop-filter: none;
  box-shadow: 0 1px 2px rgba(60,64,67,.06), 0 6px 18px rgba(60,64,67,.06);
}
.sp2-root .sp2-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 1px 2px rgba(26,115,232,.12), 0 12px 32px rgba(66,133,244,.20);
}

/* M3 outer tab bar (Agencies / Guide) */
.sp2-root .sp2-outer-tabs {
  margin: 8px 16px 12px;
  background: #e8eaed;
  border-radius: 999px;
  padding: 3px;
  display: flex;
  gap: 0;
  border: none;
}
.sp2-root .sp2-outer-tabs .ne-seg-item {
  flex: 1;
  text-align: center;
  border-radius: 999px;
  padding: 9px 0;
  font-size: 13.5px;
  font-weight: 700;
  color: #5f6368;
  background: transparent;
  transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1);
  border: none;
}
.sp2-root .sp2-outer-tabs .ne-seg-item.active {
  background: #ffffff;
  color: #1a73e8;
  box-shadow: 0 1px 2px rgba(60,64,67,.12), 0 4px 10px rgba(60,64,67,.08);
}

/* M3 search bar */
.sp2-root .sp2-search-bar {
  background: #ffffff;
  border: 1px solid #e8eaed;
  border-radius: 16px;
  box-shadow: none;
  backdrop-filter: none;
}
.sp2-root .sp2-search-bar:focus-within {
  border-color: #1a73e8;
  box-shadow: 0 0 0 3px rgba(26,115,232,.18);
}

/* M3 onboarding primary button */
.sp2-root .sp2-ob-btn--primary {
  background: #1a73e8;
  box-shadow: 0 6px 18px rgba(26,115,232,.28);
}
.sp2-root .sp2-ob-btn--primary:hover { background: #1557b0; }

/* M3 load-more button */
.sp2-root .sp2-load-more {
  background: #ffffff;
  border: 1px solid #e8eaed;
  color: #1a73e8;
  border-radius: 999px;
  font-weight: 700;
  box-shadow: none;
}
.sp2-root .sp2-load-more:hover { background: #e8f0fe; }

/* M3 stat hero card */
.sp2-root .sp2-stat-hero {
  background: linear-gradient(90deg, #1a73e8, #1557b0);
  border-radius: 20px;
  box-shadow: 0 6px 18px rgba(26,115,232,.28);
}

/* M3 jobs hero */
.sp2-root .sp2-jobs-hero {
  background: linear-gradient(90deg, #1a73e8, #8ab4f8);
  border-radius: 20px;
}
.sp2-root .sp2-jobs-hero__badge {
  background: rgba(255,255,255,.22);
  color: #fff;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 999px;
}

/* M3 primary action buttons (solid blue, no violet gradient) */
.sp2-root .sp2-jm-apply-btn,
.sp2-root .sp2-ob-btn--primary {
  background: #1a73e8;
  box-shadow: 0 6px 18px rgba(26,115,232,.28);
}
.sp2-root .sp2-jm-apply-btn:hover,
.sp2-root .sp2-ob-btn--primary:hover { background: #1557b0; }

/* ── Finance: stale NMW rates banner ────────────────────────────────────────── */
.fin-stale-warn {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 16px 0;
  padding: 10px 14px;
  background: #fff8e6;
  border: 1.5px solid rgba(249,171,0,0.4);
  border-radius: var(--ne-radius-lg);
  font-size: 12px;
  color: #7a4f00;
  line-height: 1.4;
}
.fin-stale-warn .material-symbols-outlined { font-size: 18px; color: var(--ne-amber-text); flex-shrink: 0; }

/* ==========================================================================
   Guide + Rights refresh (Telegram 2026 mood + gov.uk clarity)
   Blend target: 20% Neural Expressive / 80% Material 3 Expressive
   ========================================================================== */

.guide-module,
.rights-module {
  --gr-accent: #1f6feb;
  --gr-accent-2: #5b8cff;
  --gr-focus: rgba(31, 111, 235, 0.2);
}

.guide-module {
  background:
    radial-gradient(1200px 520px at 100% -12%, rgba(26, 115, 232, 0.12), transparent 56%),
    radial-gradient(900px 420px at 0% -8%, rgba(0, 122, 255, 0.08), transparent 48%),
    var(--ne-bg-app);
}

.guide-module .ne-card,
.rights-module .ne-card {
  border-radius: 22px;
  border: 1px solid rgba(26, 61, 111, 0.1);
  box-shadow: 0 4px 18px rgba(21, 33, 56, 0.06), 0 1px 2px rgba(12, 26, 48, 0.04);
}

.guide-module .ne-card__title,
.rights-module .ne-card__title,
.rights-module .rights-section-title {
  color: #0b2a50;
  letter-spacing: -0.015em;
}

.guide-module .guide-seg-control,
.guide-module .guide-seg-row2,
.rights-module .rights-seg-control {
  padding: 6px;
  border-radius: 18px;
  border: 1px solid rgba(31, 111, 235, 0.12);
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(239, 246, 255, 0.92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

/* Sticky top controls like modern Telegram sheets */
.guide-module .guide-seg-control,
.guide-module .guide-seg-row2,
.rights-module .rights-seg-control {
  position: sticky;
  z-index: 12;
  backdrop-filter: saturate(140%) blur(8px);
}

.guide-module .guide-seg-control { top: 8px; }
.guide-module .guide-seg-row2 { top: 78px; }
.rights-module .rights-seg-control { top: 8px; }

.guide-module .guide-seg-item,
.rights-module .rights-seg-item {
  border-radius: 14px;
  color: #4d5563;
}

.guide-module .guide-seg-item.active,
.rights-module .rights-seg-item.active {
  background: linear-gradient(135deg, var(--gr-accent), var(--gr-accent-2));
  color: #fff;
  box-shadow: 0 6px 14px rgba(31, 111, 235, 0.26);
}

.guide-module .guide-seg-item:focus-visible,
.rights-module .rights-seg-item:focus-visible,
.guide-module .guide-action-btn:focus-visible,
.guide-module .guide-nav-btn:focus-visible,
.rights-module .rights-call-btn:focus-visible {
  outline: 3px solid #ffdd00;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--gr-focus);
}

.guide-module .ne-hero {
  border-radius: 24px;
  border: 1px solid rgba(31, 111, 235, 0.12);
  background:
    linear-gradient(164deg, rgba(255, 255, 255, 0.96), rgba(233, 243, 255, 0.9)),
    radial-gradient(circle at 18% 12%, rgba(69, 144, 245, 0.2), transparent 40%);
}

.guide-module .ne-hero__logo {
  border-radius: 999px;
  border: 1px solid rgba(26, 115, 232, 0.22);
  background: rgba(255, 255, 255, 0.8);
  color: #0b3b7e;
}

.guide-module .guide-day-item,
.guide-module .guide-pack-item,
.rights-module .rights-right-item,
.rights-module .rights-cost-row,
.rights-module .rights-contact-item {
  border-radius: 14px;
  border: 1px solid rgba(26, 61, 111, 0.12);
  background: #fbfdff;
}

/* Reply-like compact heading strip for sections */
.guide-module .ne-card__title,
.rights-module .ne-card__title,
.rights-module .rights-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 8px;
  border-left: 3px solid rgba(31, 111, 235, 0.42);
}

.guide-module .guide-day-item,
.guide-module .guide-pack-item,
.rights-module .rights-right-item,
.rights-module .rights-cost-row {
  padding: 12px;
}

.rights-module .rights-module-header {
  padding: 14px 0 10px;
}

.rights-module .rights-module-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: linear-gradient(145deg, #155bcf, #4f86ff);
  box-shadow: 0 6px 16px rgba(21, 91, 207, 0.24);
}

.rights-module .rights-module-sub {
  color: #586579;
}

.guide-module .guide-action-btn,
.guide-module .guide-nav-btn,
.rights-module .rights-call-btn {
  background: linear-gradient(135deg, #155bcf, #4f86ff);
}

.guide-module .guide-nav-btn--prev {
  background: linear-gradient(135deg, #4d5563, #2f3642);
}

.guide-module .ne-callout--info,
.rights-module .ne-callout--info {
  border-radius: 16px;
  border: 1px solid rgba(31, 111, 235, 0.18);
  background: linear-gradient(135deg, #ecf4ff, #f7fbff);
  color: #174b93;
}

.guide-module .ne-callout--warn,
.rights-module .ne-callout--warn {
  border-radius: 16px;
}

/* Avatar-like markers for semantic rows */
.guide-module .guide-day-item,
.guide-module .guide-pack-item,
.rights-module .rights-right-item,
.rights-module .rights-cost-row,
.rights-module .rights-contact-item {
  position: relative;
  padding-left: 44px;
}

.guide-module .guide-day-item::before,
.guide-module .guide-pack-item::before,
.rights-module .rights-right-item::before,
.rights-module .rights-cost-row::before,
.rights-module .rights-contact-item::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 12px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #7fb1ff, #1f6feb);
  box-shadow: 0 2px 6px rgba(31, 111, 235, 0.3);
}

.guide-module .guide-day-item--warn::before,
.rights-module .ne-card--danger .rights-illegal-item::before {
  background: radial-gradient(circle at 30% 30%, #ffd48a, #d97706);
}

.guide-module .guide-day-item--critical::before,
.guide-module .ne-card--warn .ne-card__warn-head::before,
.rights-module .ne-card--danger .ne-card__warn-head::before {
  content: "";
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #ff9f97, #d4351c);
  box-shadow: 0 2px 6px rgba(212, 53, 28, 0.35);
}

.guide-module .guide-day-item--green::before {
  background: radial-gradient(circle at 30% 30%, #8ee3c7, #00796b);
}

/* Keep internal icon alignment after marker padding */
.guide-module .guide-day-item .material-symbols-outlined,
.guide-module .guide-pack-icon,
.rights-module .rights-right-icon,
.rights-module .rights-cost-icon,
.rights-module .rights-contact-icon {
  margin-left: -4px;
}

@media (max-width: 720px) {
  .guide-module .guide-seg-item,
  .rights-module .rights-seg-item {
    font-size: 10px;
  }

  .guide-module .guide-nav-row {
    padding: 14px 4px 24px;
  }

  .guide-module .guide-nav-btn {
    padding: 12px 14px;
    min-height: 48px;
    max-width: 50%;
  }

  .guide-module .guide-seg-control { top: 6px; }
  .guide-module .guide-seg-row2 { top: 70px; }
  .rights-module .rights-seg-control { top: 6px; }

  .guide-module .guide-day-item,
  .guide-module .guide-pack-item,
  .rights-module .rights-right-item,
  .rights-module .rights-cost-row,
  .rights-module .rights-contact-item {
    padding-left: 40px;
  }
}

/* Telegram-like flow rhythm and transitions */
.guide-tab-content,
.rights-tab-content {
  display: grid;
  gap: 12px;
}

.guide-tab-content > .ne-card,
.guide-tab-content > .ne-hero,
.rights-tab-content > .ne-card {
  animation: gr-chat-rise 260ms cubic-bezier(0.2, 0.8, 0.2, 1);
  transform-origin: 50% 100%;
}

@keyframes gr-chat-rise {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.995);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Message-like card accent edge */
.guide-module .ne-card,
.rights-module .ne-card {
  position: relative;
  overflow: hidden;
}

.guide-module .ne-card::after,
.rights-module .ne-card::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, rgba(31, 111, 235, 0.55), rgba(31, 111, 235, 0.08));
  opacity: 0.75;
}

/* Stronger gov.uk-like warning emphasis */
.guide-module .ne-card--warn,
.rights-module .ne-card--danger {
  border-left: 5px solid #d4351c;
}

.guide-module .ne-card--warn::after,
.rights-module .ne-card--danger::after {
  display: none;
}

/* Telegram-inspired compact status line in Rights header */
.rights-module .rights-module-statusline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(31, 111, 235, 0.18);
  background: rgba(240, 246, 255, 0.9);
  color: #33537c;
  font-size: 11px;
  font-weight: 600;
}

.rights-module .rights-module-statusline__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #00a884;
  box-shadow: 0 0 0 3px rgba(0, 168, 132, 0.16);
}

/* More tactile interactive elements */
.guide-module .guide-seg-item,
.rights-module .rights-seg-item,
.guide-module .guide-nav-btn,
.guide-module .guide-action-btn,
.rights-module .rights-call-btn {
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.2s ease, color 0.2s ease;
}

.guide-module .guide-seg-item:active,
.rights-module .rights-seg-item:active {
  transform: scale(0.97);
}

/* Higher readability in dense text sections */
.guide-module .guide-day-item p,
.guide-module .guide-pack-item p,
.rights-module .rights-right-note,
.rights-module .rights-cost-note,
.rights-module .rights-contact-note {
  color: #49576c;
}

@media (max-width: 720px) {
  .rights-module .rights-module-statusline {
    font-size: 10px;
    gap: 6px;
  }
}

/* Tab swap transition polish */
.guide-tab-content.tab-swap,
.rights-tab-content.tab-swap {
  animation: gr-tab-swap 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

@keyframes gr-tab-swap {
  from {
    opacity: 0.45;
    transform: translateY(8px);
    filter: blur(1px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

/* Micro visual feedback for CTA/call controls */
.guide-module .guide-action-btn:active,
.guide-module .guide-nav-btn:active,
.rights-module .rights-call-btn:active {
  transform: scale(0.96) translateY(1px);
}

.guide-module .guide-action-btn::after,
.guide-module .guide-nav-btn::after,
.rights-module .rights-call-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.24), transparent 60%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.guide-module .guide-action-btn:active::after,
.guide-module .guide-nav-btn:active::after,
.rights-module .rights-call-btn:active::after {
  opacity: 1;
}

.guide-module .guide-action-btn,
.guide-module .guide-nav-btn,
.rights-module .rights-call-btn {
  position: relative;
  overflow: hidden;
}

/* Dark mode for Guide/Rights only */
@media (prefers-color-scheme: dark) {
  .guide-module,
  .rights-module {
    --gr-focus: rgba(124, 170, 255, 0.24);
    background:
      radial-gradient(1100px 500px at 100% -12%, rgba(39, 108, 255, 0.22), transparent 56%),
      radial-gradient(900px 420px at 0% -8%, rgba(0, 153, 255, 0.15), transparent 48%),
      #0d141f;
  }

  .guide-module .ne-card,
  .rights-module .ne-card,
  .guide-module .ne-hero,
  .guide-module .guide-day-item,
  .guide-module .guide-pack-item,
  .rights-module .rights-right-item,
  .rights-module .rights-cost-row,
  .rights-module .rights-contact-item {
    background: linear-gradient(180deg, #151f2e, #111a28);
    border-color: rgba(133, 171, 232, 0.18);
    color: #e7eefc;
  }

  .guide-module .ne-card__title,
  .rights-module .ne-card__title,
  .rights-module .rights-section-title,
  .rights-module .rights-module-title,
  .guide-module .ne-hero__title {
    color: #f1f5ff;
  }

  .guide-module .ne-card__desc,
  .guide-module .ne-card__hint,
  .guide-module .guide-day-item p,
  .guide-module .guide-pack-item p,
  .rights-module .rights-right-note,
  .rights-module .rights-cost-note,
  .rights-module .rights-contact-note,
  .rights-module .rights-module-sub {
    color: #b6c5de;
  }

  .guide-module .guide-seg-control,
  .guide-module .guide-seg-row2,
  .rights-module .rights-seg-control {
    background: linear-gradient(180deg, rgba(24, 38, 58, 0.96), rgba(17, 28, 44, 0.92));
    border-color: rgba(112, 150, 218, 0.28);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  }

  .guide-module .guide-seg-item,
  .rights-module .rights-seg-item {
    color: #c3d2ea;
  }

  .guide-module .ne-callout--info,
  .rights-module .ne-callout--info {
    background: linear-gradient(135deg, #12253e, #152c47);
    border-color: rgba(90, 143, 237, 0.34);
    color: #d8e7ff;
  }
}

/* ── A/B UI variant switch (Guide + Rights) ─────────────────────────────── */
.gr-ui-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 12px;
  padding: 6px;
  border-radius: 16px;
  border: 1px solid rgba(26, 61, 111, 0.12);
  background: rgba(255, 255, 255, 0.88);
  position: sticky;
  top: 0;
  z-index: 14;
  backdrop-filter: saturate(140%) blur(10px);
}

.gr-ui-switch__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: #4d5563;
  font-size: 12px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, transform 0.16s ease;
}

.gr-ui-switch__btn .material-symbols-outlined {
  font-size: 17px;
}

.gr-ui-switch__btn.active {
  color: #fff;
  background: linear-gradient(135deg, var(--gr-accent, #1f6feb), var(--gr-accent-2, #5b8cff));
  box-shadow: 0 4px 12px rgba(31, 111, 235, 0.22);
}

.gr-ui-switch__btn:active {
  transform: scale(0.98);
}

/* Variant A — gov.uk (strict, flat, accessible) */
.guide-module.gr-ui--gov,
.rights-module.gr-ui--gov {
  --gr-accent: #1d70b8;
  --gr-accent-2: #1d70b8;
  background: #f3f2f1;
}

.guide-module.gr-ui--gov .ne-card,
.rights-module.gr-ui--gov .ne-card,
.guide-module.gr-ui--gov .guide-day-item,
.guide-module.gr-ui--gov .guide-pack-item,
.rights-module.gr-ui--gov .rights-right-item,
.rights-module.gr-ui--gov .rights-cost-row,
.rights-module.gr-ui--gov .rights-contact-item {
  border-radius: 0;
  box-shadow: none;
  background: #fff;
  border: 1px solid #b1b4b6;
  border-left: 4px solid #1d70b8;
}

.guide-module.gr-ui--gov .ne-card::after,
.rights-module.gr-ui--gov .ne-card::after,
.guide-module.gr-ui--gov .guide-day-item::before,
.guide-module.gr-ui--gov .guide-pack-item::before,
.rights-module.gr-ui--gov .rights-right-item::before,
.rights-module.gr-ui--gov .rights-cost-row::before,
.rights-module.gr-ui--gov .rights-contact-item::before {
  display: none;
}

.guide-module.gr-ui--gov .guide-day-item,
.guide-module.gr-ui--gov .guide-pack-item,
.rights-module.gr-ui--gov .rights-right-item,
.rights-module.gr-ui--gov .rights-cost-row,
.rights-module.gr-ui--gov .rights-contact-item {
  padding-left: 12px;
}

.guide-module.gr-ui--gov .ne-card__title,
.rights-module.gr-ui--gov .ne-card__title,
.rights-module.gr-ui--gov .rights-section-title {
  border-left: 4px solid #1d70b8;
  padding-left: 10px;
  color: #0b0c0c;
}

.guide-module.gr-ui--gov .guide-seg-control,
.guide-module.gr-ui--gov .guide-seg-row2,
.rights-module.gr-ui--gov .rights-seg-control,
.guide-module.gr-ui--gov .gr-ui-switch {
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  backdrop-filter: none;
}

.guide-module.gr-ui--gov .guide-seg-item.active,
.rights-module.gr-ui--gov .rights-seg-item.active,
.guide-module.gr-ui--gov .gr-ui-switch__btn.active {
  background: #1d70b8;
  box-shadow: none;
}

.guide-module.gr-ui--gov .ne-hero {
  border-radius: 0;
  background: #1d70b8;
  border-color: #1d70b8;
}

.guide-module.gr-ui--gov .ne-hero__title,
.guide-module.gr-ui--gov .ne-hero__sub {
  color: #fff;
}

.guide-module.gr-ui--gov .guide-tab-content > .ne-card,
.guide-module.gr-ui--gov .guide-tab-content > .ne-hero,
.rights-module.gr-ui--gov .rights-tab-content > .ne-card,
.guide-module.gr-ui--gov .guide-tab-content.tab-swap,
.rights-module.gr-ui--gov .rights-tab-content.tab-swap {
  animation: none;
}

.guide-module.gr-ui--gov .guide-action-btn,
.guide-module.gr-ui--gov .guide-nav-btn,
.rights-module.gr-ui--gov .rights-call-btn {
  border-radius: 0;
  background: #00703c;
  box-shadow: none;
}

.guide-module.gr-ui--gov .guide-nav-btn--prev {
  background: #505a5f;
}

/* Variant B — Telegram (dynamic, expressive) */
.guide-module.gr-ui--telegram,
.rights-module.gr-ui--telegram {
  --gr-accent: #2aabee;
  --gr-accent-2: #229ed9;
}

.guide-module.gr-ui--telegram .guide-seg-control,
.guide-module.gr-ui--telegram .guide-seg-row2,
.rights-module.gr-ui--telegram .rights-seg-control,
.guide-module.gr-ui--telegram .gr-ui-switch,
.rights-module.gr-ui--telegram .gr-ui-switch {
  backdrop-filter: saturate(160%) blur(14px);
}

.guide-module.gr-ui--telegram .ne-card,
.rights-module.gr-ui--telegram .ne-card {
  border-radius: 24px;
}

.guide-module.gr-ui--telegram .guide-seg-item.active,
.rights-module.gr-ui--telegram .rights-seg-item.active,
.guide-module.gr-ui--telegram .gr-ui-switch__btn.active,
.rights-module.gr-ui--telegram .gr-ui-switch__btn.active {
  background: linear-gradient(135deg, #2aabee, #229ed9);
  box-shadow: 0 8px 18px rgba(42, 171, 238, 0.28);
}

.rights-module.gr-ui--telegram .rights-module-statusline__dot {
  background: #2aabee;
  box-shadow: 0 0 0 3px rgba(42, 171, 238, 0.2);
}

@media (prefers-color-scheme: dark) {
  .gr-ui-switch {
    background: rgba(17, 28, 44, 0.92);
    border-color: rgba(112, 150, 218, 0.28);
  }

  .gr-ui-switch__btn {
    color: #c3d2ea;
  }

  .guide-module.gr-ui--gov,
  .rights-module.gr-ui--gov {
    background: #0b0c0c;
  }

  .guide-module.gr-ui--gov .ne-card,
  .rights-module.gr-ui--gov .ne-card {
    background: #1a1a1a;
    border-color: #4a4a4a;
    border-left-color: #1d70b8;
  }
}

/* v20260604d */

/* ============================================================================
   TG-FARMS — Telegram Web A style pilot for the «Фермы» (Rating) tab.
   Scoped to the `.tg-farms` root + the `.tg-farm-*` markup emitted by
   WikiModule._buildFarmCard. Self-contained palette (Telegram blue #3390EC).
   REVERSIBLE: delete this whole block + revert _buildFarmCard + remove the
   `tg-farms` root class and the two `tg-farm-list` class additions.
   Does NOT touch the forum/map tab content.
   ============================================================================ */

/* ── List: flat, divider-separated (no card gaps) ── */
/* Floating-card list — one card per farm, matching the income tab (.wiki-income-*)
   so both Farms sub-screens share a single card paradigm. */
.tg-farm-list {
  margin: 4px 16px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: transparent;
  border-radius: 0;
  overflow: visible;
}

/* The TransferGo promo is injected into the farm list (after the 3rd card). It
   carries its own legacy margin/radius (8px 16px / 20px) which leaves it inset
   and narrower than the .tg-farm-row cards. Pin it flush to the list so the ad
   shares the exact width + corner radius of the surrounding farm cards. */
.tg-farm-list > .ne-wiki-promo {
  margin: 0 !important;
  width: 100%;
  box-sizing: border-box;
  border-radius: 16px;
}

/* The Lebara ad (.qd-ad) is injected into the farm list wrapped in the generic
   .job-item card (margin 8px 16px + its own padding/border/background) — that
   legacy wrapper doubles up with .qd-ad's own card styling, leaving it inset
   and narrower than the .tg-farm-row cards. Strip the wrapper so .qd-ad is
   flush and full width, matching the surrounding farm cards. */
.tg-farm-list > .job-item.promo-item {
  margin: 0 !important;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ── Row → card (vertical: info row on top, action row below) ── */
.tg-farm-row {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 16px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  animation: ne-card-in 0.4s var(--ne-ease-out, ease) both;
  animation-delay: var(--ne-delay, 0s);
}
.tg-farm-row:active { background: #f7f8fa; }

/* info row: avatar + body */
.tg-farm-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ── Avatar (rounded square, pastel tint) ── */
.tg-farm-avatar {
  flex-shrink: 0;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;            /* crop emoji */
  line-height: 0;             /* removes ascender/descender bias so emoji centers visually */
  user-select: none;
}

/* ── Body (name+rating, then meta line) ── */
.tg-farm-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

/* line 1: name + overall rating */
.tg-farm-l1 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tg-farm-name {
  flex: 1;
  min-width: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  color: #111418;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* line 2: 📍 postcode · 🌱 crop · 👷 agency */
.tg-farm-meta-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.3;
}
.tg-meta { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.tg-meta-loc  { color: #e0518f; }
.tg-meta-crop { color: #2f9e6f; }
.tg-meta-op   { color: #d98324; }
.tg-meta-dot  { color: #c2c6cc; font-weight: 700; }
.tg-farm-more {
  font-size: 10.5px;
  font-weight: 700;
  color: #8e8e93;
  background: #f0f1f3;
  border-radius: 6px;
  padding: 0 4px;
}
.tg-farm-rating {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: #f0f1f3;
  color: #8e8e93;
}
.tg-farm-rating .tg-star { font-size: 10px; line-height: 1; }
.tg-rating--green  { background: #e3f5e9; color: #1f8b4c; }
.tg-rating--orange { background: #fff4d6; color: #b07a00; }
.tg-rating--red    { background: #fde7e7; color: #c0392b; }
.tg-rating--grey   { background: #f0f1f3; color: #8e8e93; }

/* action row: Отзывы (compact) + Я тут работал (wide, filled) */
.tg-farm-actions {
  display: flex;
  align-items: stretch;
  gap: 8px;
}
.tg-reviews-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex-shrink: 0;
  padding: 9px 14px;
  border-radius: 12px;
  border: none;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  background: #f0f1f4;
  color: #3c4043;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s, transform 0.2s;
}
.tg-reviews-btn:active { background: #e4e6ea; transform: scale(0.97); }
.tg-reviews-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #3390ec;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}
.tg-write-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 1;
  padding: 9px 14px;
  border-radius: 12px;
  border: none;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  background: #3390ec;
  color: #fff;
  box-shadow: 0 2px 8px rgba(51,144,236,0.28);
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s, transform 0.2s;
}
.tg-write-btn:active { background: #2b7fd4; transform: scale(0.98); }

/* ── Page background: white (Telegram style) ── */
/* Recolor the whole Farms screen's accent Google-blue → Telegram-blue via the
   token, so income figures, buttons, map icon, chevrons — anything reading
   var(--ne-primary) — match the tab accent. One blue per screen (mirrors
   .tg-guide). Value-only change; no .ne-* selector rewrite. */
.tg-farms.ne-wiki,
.tg-farms.wiki-root {
  background: #F2F2F7;
  --ne-primary: #3390ec;
  --ne-primary-rgb: 51, 144, 236;
  --ne-primary-active: #1557b0;
}
/* Like the bottom nav: no background/blur AROUND the tabs — only the capsule has
   a (frosted) fill; the surrounding header is transparent so the list shows
   through in the margins. */
.tg-farms .wiki-header {
  background: transparent !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding-bottom: 12px;
}

/* P2: farms tab uses the canonical seamless-gray header + #F2F2F7 app bg (base rule). */

/* ── Tabs: floating capsule (like the bottom nav) — white pill track, soft
   shadow, equal segments, active = light-blue pill + blue text ── */
.tg-farms .ne-seg-control.wiki-tabs {
  display: flex;
  gap: 2px;
  /* width auto + border-box so the base .ne-seg-control width:100% + our
     padding/border don't push the capsule past the viewport (was clipping the
     "Карта" tab). */
  width: auto;
  box-sizing: border-box;
  margin: 4px 12px 4px;
  padding: 4px;
  /* Frosted like the bottom nav — content scrolls visibly behind it instead of
     being hidden by a solid white fill. */
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border-radius: 22px;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
}
.tg-farms .ne-seg-item.wiki-tab {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 6px 6px;
  border-radius: 18px;
  font-size: 12px;
  font-weight: 500;
  color: #8e8e93;
  background: transparent;
  border: none;
  box-shadow: none !important;
  transition: background 0.18s ease, color 0.15s;
  /* Allow long labels (Farm List / Farms (income)) to wrap to 2 lines so all
     4 tabs fit on narrow screens instead of overflowing. */
  white-space: normal;
  text-align: center;
  line-height: 1.15;
}
/* Tab labels render each word in a .wt-w span inside a .wt-label wrapper. On
   phones, stack the two words onto separate lines so all three tabs share the
   same height and align; on wider screens they stay inline (they fit there). */
.tg-farms .ne-seg-item.wiki-tab .wt-label { text-align: center; }
@media (max-width: 480px) {
  .tg-farms .ne-seg-item.wiki-tab .wt-w { display: block; }
}
.tg-farms .ne-seg-item.wiki-tab.active {
  color: #3390ec;
  background: #eaf2fb;
  font-weight: 600;
  border-radius: 18px;
  box-shadow: none !important;
}
/* gold star on the Rating tab */
.tg-farms .wiki-tabs .tg-tab-star {
  color: #f2b600;
  font-size: 13px;
  line-height: 1;
  margin-right: 1px;
}

/* ── Search: full-width grey pill, no sort button ── */
.tg-farms .wiki-sort-btn { display: none !important; }
/* Equalize the gap above the search with the gap above the tabs (both ~10px):
   the tabs' 4px margin-bottom + header's 6px padding-bottom already give 10px,
   so drop the search container's own top padding. */
.tg-farms .wiki-sort-chips { padding-top: 0 !important; }
.tg-farms .wiki-inline-search {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 20px;
  height: 38px;
  flex: 1;
  box-shadow: 0 1px 4px rgba(0,0,0,0.10);
}
.tg-farms .wiki-inline-search:focus-within {
  background: #fff;
  border-color: #2563EB;
  box-shadow: 0 0 0 2px rgba(37,99,235,0.15), 0 1px 4px rgba(0,0,0,0.08);
}
.tg-farms .wiki-sort-option.on { background: #eaf2fb; color: #3390ec; }
.tg-farms .wiki-sort-check { color: #3390ec; }

/* Cards are separated by gap now — no inter-row divider. */



/* ============================================================================
   DRAWER — Telegram-style floating popover (not a sidebar)
   Replaces translateX slide with a scale+fade popover anchored top-left.
   ============================================================================ */

/* Backdrop: transparent click-catcher only (no dim/blur for a popover) */
#menu-drawer-backdrop {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Popover panel */
#menu-drawer {
  top: 54px;
  bottom: auto;
  left: 8px;
  width: min(280px, calc(100vw - 16px));
  max-height: calc(100dvh - 70px);
  border-radius: 14px;
  border-right: none;
  background: #fff;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 2px 8px rgba(0, 0, 0, 0.10);
  transform-origin: top left;
  transform: scale(0.88) translateY(-10px) rotate(-5deg);
  opacity: 0;
  /* Closed popover must be fully inert — opacity:0 alone keeps it in the
     hit-test layer and steals taps from the header/tabs underneath (→ a tap on
     the Wiki tabs landed on .mdr-profile and opened Profile). */
  pointer-events: none;
  visibility: hidden;
  transition: transform 0.26s cubic-bezier(0.34, 1.36, 0.64, 1), opacity 0.18s ease, visibility 0s linear 0.26s;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
#menu-drawer.open {
  transform: scale(1) translateY(0) rotate(0deg);
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transition: transform 0.26s cubic-bezier(0.34, 1.36, 0.64, 1), opacity 0.18s ease, visibility 0s;
}

@keyframes dmc-in {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: translateX(0); }
}
#menu-drawer.open .dmc {
  animation: dmc-in 0.18s ease both;
}
#menu-drawer.open .dmc:nth-child(1) { animation-delay: 0.06s; }
#menu-drawer.open .dmc:nth-child(2) { animation-delay: 0.10s; }
#menu-drawer.open .dmc:nth-child(3) { animation-delay: 0.14s; }
#menu-drawer.open .dmc:nth-child(4) { animation-delay: 0.17s; }
#menu-drawer.open .dmc:nth-child(5) { animation-delay: 0.20s; }
#menu-drawer.open .dmc:nth-child(6) { animation-delay: 0.23s; }
#menu-drawer.open .dmc:nth-child(7) { animation-delay: 0.25s; }
#menu-drawer.open .dmc:nth-child(8) { animation-delay: 0.27s; }
#menu-drawer.open .dmc:nth-child(9) { animation-delay: 0.29s; }
#menu-drawer.open .dmc:nth-child(10) { animation-delay: 0.31s; }

/* ── Profile row (avatar + name + close) ── */
.mdr-profile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 12px 14px 16px;
  border-bottom: 1px solid #f0f0f0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.mdr-profile:active { background: #f4f5f7; }

.mdr-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 0;
  flex-shrink: 0;
  background: #65AADD;
}

.mdr-profile-info { flex: 1; min-width: 0; }
.mdr-user-name {
  font-size: 15px;
  font-weight: 600;
  color: #111418;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mdr-user-sub {
  font-size: 12px;
  color: #8e8e93;
  margin-top: 1px;
}

.mdr-close {
  flex-shrink: 0;
  margin: 0;
  align-self: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #f0f2f5;
  color: #8e8e93;
}
.mdr-close .material-symbols-outlined { font-size: 18px; }

/* ── List ── */
.mdr-list {
  padding: 6px 8px 12px;
  gap: 1px;
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.ne-drawer-divider {
  margin: 4px 12px;
  background: #f0f0f0;
}

/* ── Flat rows — no card borders ── */
.dmc {
  border: none;
  box-shadow: none;
  border-radius: 10px;
  background: transparent;
  padding: 10px 12px;
  gap: 12px;
  transition: background 0.12s;
}
.dmc:active               { transform: none; background: #f0f2f5; }
.dmc.active               { background: #eaf2fb; box-shadow: none; border: none; }
.dmc.active .dmc__label   { color: #3390ec; }
.dmc.active .dmc__icon    { color: #3390ec; }

.dmc__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.dmc__label {
  font-size: 15px;
  font-weight: 500;
  color: #111418;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dmc__desc {
  font-size: 12px;
  color: #8e8e93;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dmc__text { display: none; }

.dmc__icon-wrap {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  flex-shrink: 0;
}
.dmc__icon { font-size: 20px; }

/* No trailing chevron — Telegram-style rows that open a module directly have
   no arrow (an arrow implies a submenu). Removed from markup; hidden here too. */
.dmc__arrow { display: none; }

/* ── Telegram outline icons: reset all colored icon-wrap backgrounds ── */
[class*="dmc--"] .dmc__icon-wrap {
  background: none !important;
  box-shadow: none !important;
}
[class*="dmc--"] .dmc__icon {
  color: #3c3c43;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.dmc.active [class*="dmc--"] .dmc__icon,
.dmc.active .dmc__icon { color: #3390ec; }

/* ── Dark mode ── */
@media (prefers-color-scheme: dark) {
  #menu-drawer        { background: #1c1c1e; box-shadow: 0 8px 32px rgba(0,0,0,.5); }
  .mdr-profile        { border-bottom-color: #2c2c2e; }
  .mdr-profile:active { background: #2c2c2e; }
  .mdr-user-name      { color: #f2f2f7; }
  .mdr-close          { background: #3a3a3c; color: #ebebf5; }
  .ne-drawer-divider  { background: #2c2c2e; }
  .dmc                { border: none; box-shadow: none; background: transparent; }
  .dmc:active         { background: #2c2c2e; }
  .dmc.active         { background: rgba(51,144,236,.18); border: none; }
  .dmc__label         { color: #f2f2f7; }
  .dmc::after         { color: #48484a; }
  [class*="dmc--"] .dmc__icon { color: #ebebf5; }
}

/* ══ Profile module — TG capsule style (mirrors tg-farms) ══════════════════ */
/* P2: profile uses the canonical seamless-gray header + #F2F2F7 app bg (base rule). */

/* Capsule container padding */
.tg-profile .pf-tabs-capsule {
  padding: 8px 0 10px;
}

/* Floating frosted-pill tab track (same as tg-farms .wiki-tabs) */
.tg-profile .ne-seg-control.wiki-tabs {
  display: flex;
  gap: 2px;
  width: auto;
  box-sizing: border-box;
  margin: 0 12px;
  padding: 4px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
}

/* Tab items */
.tg-profile .ne-seg-item.wiki-tab {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 8px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: #8e8e93;
  background: transparent;
  border: none;
  box-shadow: none !important;
  transition: background 0.18s ease, color 0.15s;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.tg-profile .ne-seg-item.wiki-tab.active {
  color: #3390ec;
  background: #eaf2fb;
  font-weight: 600;
  box-shadow: none !important;
}
.tg-profile .ne-seg-item.wiki-tab:not(.active):hover {
  background: rgba(0, 0, 0, 0.04);
}

/* ══ Guide module — TG capsule style (mirrors tg-farms / tg-profile) ════════ */
/* Recolor the module's primary accent Google-blue → Telegram-blue. Cascades to
   action buttons, badges, bar charts, info callouts, NI stats — anything reading
   var(--ne-primary). Hero + tabs are overridden explicitly below. */
.tg-guide {
  --ne-primary: #3390ec;
  --ne-primary-rgb: 51, 144, 236;
  --ne-primary-active: #1557b0;
  background: #f2f2f7;
}

/* P2: guide uses the canonical seamless-gray header + #F2F2F7 app bg (base rule). */

/* ── Tab rows: iOS/Telegram segmented control — gray track, white active pill,
   text-only (icons hidden per reference) ── */
.tg-guide .guide-seg-control,
.tg-guide .guide-seg-row2 {
  background: #e9e9eb;
  border: none;
  border-radius: 12px;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  padding: 3px;
  gap: 2px;
  margin: 0 0 8px;
}
.tg-guide .guide-seg-row2 { margin-bottom: 12px; }

/* Hide tab icons — labels only */
.tg-guide .guide-seg-item .material-symbols-outlined { display: none; }

/* Segment: single-line text pill, muted gray when inactive */
.tg-guide .guide-seg-item {
  min-height: 0;
  padding: 7px 4px;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #8e8e93;
  background: transparent;
  box-shadow: none;
}

/* Active segment: white pill + blue text, subtle lift */
.tg-guide .guide-seg-control .guide-seg-item.active,
.tg-guide .guide-seg-row2 .guide-seg-item.active {
  color: #3390ec;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.14), 0 1px 1px rgba(0, 0, 0, 0.04);
}

/* 4 descriptive labels in one row → allow wrap to 2 lines instead of ellipsis */
.tg-guide .guide-seg-item span:not(.material-symbols-outlined) {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.12;
}

/* ── Cards: float on gray with TG radius + soft shadow ── */
.tg-guide .ne-card {
  border-radius: 16px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.07);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
/* Plain cards solid white, no border; keep amber bg/border on --warn variant */
.tg-guide .ne-card:not(.ne-card--warn) {
  background: #fff;
  border: none;
}

/* ── Hero: white card (dark text, light-gray stat tiles) per reference ── */
.tg-guide .ne-hero {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.07);
  padding: 18px 18px 16px;
  margin: 0 16px 12px;
}
.tg-guide .ne-hero__logo { display: none; }
.tg-guide .ne-hero__title {
  font-size: 19px;
  color: #111827;
  margin-bottom: 6px;
}
.tg-guide .ne-hero__sub {
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 16px;
}
.tg-guide .ne-stat {
  background: #f2f2f7;
  border: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.tg-guide .ne-stat:active { background: #e9e9eb; }
.tg-guide .ne-stat__val { color: #111827; }
.tg-guide .ne-stat__lbl { color: #8e8e93; }

/* Timeline step numbers: flat TG blue→cyan (drop the violet end) */
.tg-guide .ne-timeline__num {
  background: linear-gradient(145deg, #3390ec, #2aabee);
}

/* Footer caption muted on gray */
.tg-guide .ne-footer {
  color: #8e8e93;
}

/* Collapsible reference card (quota history, etc.) — tappable summary + chevron,
   collapsed by default so heavy reference doesn't clutter the default screen */
.tg-guide .guide-collapse > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
  list-style: none;
  -webkit-tap-highlight-color: transparent;
}
.tg-guide .guide-collapse > summary::-webkit-details-marker { display: none; }
.tg-guide .guide-collapse__summary .ne-card__title { margin: 0; }
.tg-guide .guide-collapse__chev {
  color: #8e8e93;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
.tg-guide .guide-collapse[open] .guide-collapse__chev { transform: rotate(180deg); }
.tg-guide .guide-collapse > :not(summary) { margin-top: 12px; }
/* Force-hide content when collapsed — children set their own display (e.g. the
   bar chart is display:flex), which otherwise defeats the native <details> toggle */
.tg-guide .guide-collapse:not([open]) > :not(summary) { display: none; }


/* ── Fermalar (daromad) income tab ─────────────────────────────────────── */
.wiki-income-view { display:flex; flex-direction:column; gap:0; }
.wiki-income-header { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:700; color:var(--ne-ink); padding:16px 16px 8px; }
.wiki-income-header .material-symbols-outlined { font-size:20px; color:var(--ne-primary); }

/* Live social-proof stat line (replaces the redundant tab-name header) */
.wiki-income-social { padding:14px 16px 8px; font-size:13px; font-weight:600; color:var(--ne-hint); letter-spacing:.01em; }
.wiki-income-social.is-live { color:var(--ne-muted, #4a4d52); }
.wiki-income-loading { display:flex; justify-content:center; padding:40px; color:var(--ne-hint); }
.wiki-income-spin { animation:ne-spin 1s linear infinite; display:inline-block; }
@keyframes ne-spin { to { transform:rotate(360deg); } }
.wiki-income-empty { text-align:center; padding:40px 24px; color:var(--ne-hint); font-size:14px; line-height:1.6; }
.wiki-income-list { display:flex; flex-direction:column; gap:10px; padding:4px 16px; }
.wiki-income-card { display:flex; flex-direction:column; gap:10px; padding:14px 16px; background:var(--ne-surface, #fff); border-radius:16px; box-shadow:0 1px 4px rgba(0,0,0,.06); }
/* .forum-feed-ad's 0 12px margin is sized for the forum feed (no list padding);
   wiki-income-list already has 16px padding, so zero it here to match card width. */
.wiki-income-list .forum-feed-ad { margin-left:0; margin-right:0; }
.wiki-income-body { flex:1; min-width:0; }

/* head: name (left) + first-operator tint pill + "+N" (right) */
.wiki-income-cardhead { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.wiki-income-name { flex:1; min-width:0; font-size:15px; font-weight:700; color:var(--ne-ink); letter-spacing:-.01em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wiki-income-op { flex-shrink:0; display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.wiki-income-op-pill { display:inline-block; max-width:120px; overflow:hidden; text-overflow:ellipsis; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:700; line-height:1.3; }
.wiki-income-op-more { font-size:11px; font-weight:600; color:var(--ne-hint); }

/* report-count badge — same tappable pattern as the farm-card "Отзывы N" button:
   grey pill + icon + label + count in a filled circle. Confidence tier (few/many
   reports) is encoded by the circle colour, not by the pill. */
.wiki-income-badge { flex-shrink:0; margin-left:auto; display:inline-flex; align-items:center; gap:6px; padding:7px 10px; border-radius:12px; font-size:13px; font-weight:600; white-space:nowrap; line-height:1; background:#f0f1f4; color:#3c4043; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:background .15s, transform .2s; }
.wiki-income-badge:active { background:#e4e6ea; transform:scale(.97); }
.wiki-income-badge-count { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; color:#fff; font-size:11px; font-weight:700; line-height:1; }
.wiki-income-badge--high .wiki-income-badge-count { background:#1f8b4c; }
.wiki-income-badge--mid  .wiki-income-badge-count { background:#d6900a; }
.wiki-income-badge--low  .wiki-income-badge-count { background:#d0473f; }

/* big honest range headline */
.wiki-income-range { font-size:22px; font-weight:800; color:var(--ne-primary, #3390ec); letter-spacing:-.02em; line-height:1.1; }

/* mini slider: £0→£25k, green zone = tax-free (≤£12,570), blue = taxable */
.wiki-income-slider-row { display:flex; align-items:center; gap:10px; }
/* 52% target; shrinkable (0 1) so the count button never overflows on narrow phones */
.wiki-income-slider { flex:0 1 52%; min-width:0; position:relative; padding:4px 0; }
.wiki-income-track { position:relative; height:6px; border-radius:999px; background:linear-gradient(90deg, rgba(34,197,94,.13) 50.28%, var(--ne-surface-variant, #eef0f3) 50.28%); }
.wiki-income-fill { position:absolute; top:0; bottom:0; border-radius:999px; background:linear-gradient(90deg, #6fb1f5, var(--ne-primary, #3390ec)); }
.wiki-income-fill-tax { position:absolute; top:0; bottom:0; border-radius:999px; background:linear-gradient(90deg, rgba(34,197,94,.5), rgba(34,197,94,.75)); }
.wiki-income-tick-tax { position:absolute; top:-3px; bottom:-3px; width:1.5px; transform:translateX(-50%); background:rgba(34,197,94,.55); border-radius:2px; }
.wiki-income-knob { position:absolute; top:50%; width:16px; height:16px; transform:translate(-50%, -50%); border-radius:50%; background:#fff; border:3px solid var(--ne-primary, #3390ec); box-shadow:0 1px 3px rgba(0,0,0,.2); }

/* section legend — explains the slider green zone ONCE for the whole list */
.wiki-income-legend { display:flex; align-items:flex-start; gap:7px; margin:0 16px 8px; font-size:12px; line-height:1.4; color:var(--ne-hint); }
.wiki-income-legend-dot { flex-shrink:0; width:11px; height:11px; margin-top:2px; border-radius:3px; background:rgba(34,197,94,.6); }

.wiki-income-note { font-size:12px; color:var(--ne-hint); padding:12px 16px 20px; line-height:1.5; margin:0; border-top:1px solid var(--ne-outline-variant); }

/* ── Income tab: invitation modal + banner ─────────────────────────────── */
.wiki-income-banner { display:flex; align-items:center; gap:12px; margin:0 16px 10px; padding:14px 14px 14px 16px; background:linear-gradient(135deg, var(--ne-primary, #1a73e8) 0%, #2f6fe0 100%); border-radius:16px; box-shadow:0 4px 14px rgba(26,115,232,0.28); }
.wiki-income-banner__txt { flex:1; font-size:13px; font-weight:500; color:#fff; line-height:1.4; }
.wiki-income-banner__cta { flex-shrink:0; display:inline-flex; align-items:center; gap:3px; border:none; background:var(--ne-primary-active, #1557b0); color:#fff; font-size:13px; font-weight:700; padding:9px 15px; border-radius:999px; cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,0.18); transition:transform .15s; }
.wiki-income-banner__cta:active { transform:scale(0.96); }
.wiki-income-banner__plus { font-size:15px; font-weight:700; line-height:1; }

.wiki-income-modal-overlay { position:fixed; inset:0; z-index:9000; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(0,0,0,.5); animation:ne-fade-in .2s var(--ne-ease-out) both; }
.wiki-income-modal { background:var(--ne-surface, #fff); border-radius:22px; max-width:380px; width:100%; padding:28px 22px 22px; text-align:center; box-shadow:0 18px 48px rgba(0,0,0,.28); animation:ne-pop-in .26s var(--ne-ease-out) both; }
@keyframes ne-pop-in { from { transform:scale(.94); opacity:0; } to { transform:scale(1); opacity:1; } }
.wiki-income-modal__icon { font-size:44px; margin-bottom:10px; }
.wiki-income-modal__title { font-size:19px; font-weight:800; color:var(--ne-ink); letter-spacing:-.02em; line-height:1.25; margin:0 0 12px; }
.wiki-income-modal__body { font-size:14px; color:var(--ne-hint); line-height:1.55; margin:0 0 14px; }
.wiki-income-modal__reciprocity { font-size:14px; font-weight:600; color:var(--ne-ink); line-height:1.5; margin:0 0 16px; }
.wiki-income-modal__privacy { display:flex; align-items:flex-start; gap:8px; text-align:left; background:var(--ne-surface-variant, #f2f4f7); border-radius:12px; padding:10px 12px; font-size:12.5px; color:var(--ne-on-surface-variant, #555); line-height:1.45; margin-bottom:14px; }
.wiki-income-modal__privacy .material-symbols-outlined { font-size:18px; color:#2e7d32; flex-shrink:0; }
.wiki-income-modal__social { font-size:13px; font-weight:600; color:var(--ne-primary, #3390ec); margin-bottom:18px; }
.wiki-income-modal__actions { display:flex; flex-direction:column; gap:8px; }
.wiki-income-modal__actions .ne-btn { width:100%; }

/* ── Farm calculations detail modal (card click) ───────────────────────── */
.wiki-income-card { cursor:pointer; transition:background .15s; }
.wiki-income-card:active { background:var(--ne-surface-variant, #f2f4f7); }
.wiki-calcs-modal { position:relative; max-width:420px; text-align:left; padding:24px 20px 20px; max-height:84vh; display:flex; flex-direction:column; }
.wiki-calcs-close { position:absolute; top:14px; right:14px; width:30px; height:30px; border:none; border-radius:50%; background:var(--ne-surface-variant, #eef0f3); color:var(--ne-hint); font-size:15px; cursor:pointer; line-height:1; }
.wiki-calcs-title { font-size:18px; font-weight:800; color:var(--ne-ink); letter-spacing:-.02em; margin:0 32px 10px 0; line-height:1.25; }
.wiki-calcs-summary { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; padding-bottom:14px; margin-bottom:8px; border-bottom:1px solid var(--ne-outline-variant, #e8eaed); }
.wiki-calcs-sum-main { font-size:24px; font-weight:800; color:var(--ne-primary, #1a73e8); letter-spacing:-.02em; }
.wiki-calcs-sum-sub { font-size:12.5px; color:var(--ne-hint); }
.wiki-calcs-list { overflow-y:auto; flex:1; margin:0 -4px; }
.wiki-calcs-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 4px; border-bottom:1px solid var(--ne-outline-variant, #f0f1f3); }
.wiki-calcs-row:last-child { border-bottom:none; }
.wiki-calcs-row__meta { font-size:12.5px; color:var(--ne-hint); line-height:1.4; flex:1; min-width:0; }
.wiki-calcs-row__nums { text-align:right; flex-shrink:0; }
.wiki-calcs-row__income { display:block; font-size:15px; font-weight:700; color:var(--ne-ink); }
.wiki-calcs-row__refund { display:block; font-size:11.5px; color:#2e7d32; }
.wiki-calcs-empty { text-align:center; color:var(--ne-hint); font-size:14px; padding:30px 10px; }
.wiki-calcs-cta { width:100%; margin-top:14px; flex-shrink:0; }

/* ── Aggregate context (operators + stability) — sits high, under the headline
   figure and above the per-worker rows. ─────────────────────────────────── */
.wiki-calcs-agg:empty { display:none; }
.wiki-calcs-agg { flex-shrink:0; }
.wiki-calcs-agg .wiki-calcs-insight { margin-bottom:0; }       /* last item → list border handles the gap */
.wiki-calcs-agg + .wiki-calcs-list { border-top:1px solid var(--ne-outline-variant, #f0f1f3); margin-top:12px; padding-top:4px; }

/* ── CTA block under the calc list: primary action · hint · reviews link ──── */
.wiki-calcs-extra { flex-shrink:0; padding-top:12px; margin-top:4px; border-top:1px solid var(--ne-outline-variant, #e8eaed); }

/* operators on this farm */
.wiki-calcs-ops { margin-bottom:12px; }
.wiki-calcs-ops__label { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ne-hint); margin-bottom:8px; }
.wiki-calcs-ops__chips { display:flex; flex-wrap:wrap; gap:6px; }
.wiki-calcs-op-chip { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:999px; background:var(--ne-surface-variant, #f2f4f7); font-size:12.5px; font-weight:600; color:var(--ne-ink); }

/* stability insight box */
.wiki-calcs-insight { display:flex; align-items:flex-start; gap:8px; padding:10px 12px; border-radius:12px; font-size:13px; font-weight:500; line-height:1.4; margin-bottom:14px; }
.wiki-calcs-insight__icon { flex-shrink:0; font-size:14px; line-height:1.3; }
.wiki-calcs-insight--stable { background:#e8f6ed; color:#1f7a44; }
.wiki-calcs-insight--variable,
.wiki-calcs-insight--lowdata { background:#fff4e0; color:#9a6700; }

/* CTA = the income-tab solidarity banner, duplicated into the modal. Reuses the
   .wiki-income-banner styles; only its outer margin is neutralised here so it
   sits flush inside the modal's padded body. */
.wiki-calcs-extra .wiki-income-banner { margin:0; }
.wiki-calcs-reviews-link { display:block; width:100%; margin-top:12px; padding:6px 0; border:none; background:none; font:inherit; font-size:13px; font-weight:600; color:var(--ne-primary, #1a73e8); cursor:pointer; text-align:center; }
.wiki-calcs-reviews-link:active { opacity:.6; }

/* ── Income contribution modal (in-tab "share your income" form) ─────────── */
.wiki-ic-modal { max-width:440px; width:100%; text-align:left; padding:0; max-height:90vh; display:flex; flex-direction:column; overflow:hidden; }
.wiki-ic-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px; border-bottom:1px solid var(--ne-outline-variant, #e8eaed); flex-shrink:0; }
.wiki-ic-cancel { border:none; background:none; font:inherit; font-size:14px; font-weight:600; color:var(--ne-hint); padding:5px 6px; border-radius:8px; cursor:pointer; }
.wiki-ic-cancel:active { background:var(--ne-surface-variant, #f2f4f7); }
.wiki-ic-headtitle { font-size:16px; font-weight:800; color:var(--ne-ink); letter-spacing:-.01em; }
.wiki-ic-headspacer { width:54px; flex-shrink:0; }
.wiki-ic-body { flex:1; overflow-y:auto; padding:16px; -webkit-overflow-scrolling:touch; }
.wiki-ic-intro { display:flex; gap:10px; align-items:flex-start; background:var(--ne-surface-variant, #f2f4f7); border-radius:14px; padding:12px 14px; margin-bottom:4px; font-size:13px; line-height:1.5; color:var(--ne-on-surface-variant, #555); }
.wiki-ic-intro__icon { font-size:18px; flex-shrink:0; }
.wiki-ic-label { display:flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--ne-ink); margin:16px 0 8px; }
.wiki-ic-optional { margin-left:auto; font-size:11px; font-weight:500; color:var(--ne-hint); }
.wiki-ic-input { width:100%; padding:12px 14px; border-radius:12px; border:1.5px solid var(--ne-outline-variant, #e5e7eb); background:var(--ne-surface, #fff); font:inherit; font-size:15px; color:var(--ne-ink); box-sizing:border-box; }
.wiki-ic-input:focus { outline:none; border-color:var(--ne-primary, #3390ec); }
/* farm autosuggest — custom dropdown, appears only after ≥2 letters, ranked by similarity */
.wiki-ic-farm-wrap { position:relative; }
.wiki-ic-suggest { position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:20; max-height:240px; overflow-y:auto; -webkit-overflow-scrolling:touch; background:var(--ne-surface, #fff); border:1.5px solid var(--ne-outline-variant, #e5e7eb); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.14); }
.wiki-ic-suggest[hidden] { display:none; }
.wiki-ic-suggest__item { display:block; width:100%; text-align:left; padding:11px 14px; border:none; border-bottom:1px solid var(--ne-outline-variant, #f0f1f3); background:none; font:inherit; font-size:14px; color:var(--ne-ink); cursor:pointer; }
.wiki-ic-suggest__item:last-child { border-bottom:none; }
.wiki-ic-suggest__item:active { background:var(--ne-surface-variant, #f2f4f7); }
/* operator picker — native dropdown (curated list, no free text) with a chevron */
.wiki-ic-select { width:100%; padding:12px 36px 12px 14px; border-radius:12px; border:1.5px solid var(--ne-outline-variant, #e5e7eb); background-color:var(--ne-surface, #fff); font:inherit; font-size:15px; color:var(--ne-ink); box-sizing:border-box; cursor:pointer; -webkit-appearance:none; -moz-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%239aa0a6' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; }
.wiki-ic-select:focus { outline:none; border-color:var(--ne-primary, #3390ec); }
.wiki-ic-select:invalid { color:var(--ne-hint); }   /* greys the placeholder until a real option is picked */
/* free-text operator field — shown only when "Other" is picked */
.wiki-ic-other-wrap { margin-top:8px; }
.wiki-ic-other-wrap[hidden] { display:none; }
.wiki-ic-money { display:flex; align-items:center; gap:8px; background:var(--ne-surface, #fff); border:1.5px solid var(--ne-outline-variant, #e5e7eb); border-radius:12px; padding:11px 14px; }
.wiki-ic-money:focus-within { border-color:var(--ne-primary, #3390ec); }
.wiki-ic-money__sym { font-size:17px; font-weight:800; color:var(--ne-hint); }
.wiki-ic-money__in { flex:1; min-width:0; border:none; outline:none; background:none; font:inherit; font-size:17px; font-weight:700; color:var(--ne-ink); }
.wiki-ic-taxhint { font-size:11.5px; color:var(--ne-hint); margin-top:6px; line-height:1.4; }
.wiki-ic-refund { margin-top:14px; }
.wiki-ic-refund:empty { display:none; }
.wiki-ic-refund__main { font-size:15px; font-weight:800; color:#1f7a44; letter-spacing:-.01em; line-height:1.35; }
.wiki-ic-refund__main--zero { color:var(--ne-ink); }
.wiki-ic-refund__main--info { font-size:13px; font-weight:600; }
.wiki-ic-refund__note { font-size:11.5px; color:var(--ne-hint); margin-top:3px; line-height:1.4; }
.wiki-ic-warn { font-size:12px; color:#9a6700; margin-top:8px; line-height:1.4; }
.wiki-ic-warn:empty { display:none; }
.wiki-ic-foot { flex-shrink:0; padding:12px 16px; border-top:1px solid var(--ne-outline-variant, #e8eaed); background:var(--ne-surface, #fff); }
.wiki-ic-submit { width:100%; padding:14px; border-radius:14px; border:none; background:var(--ne-primary, #3390ec); color:#fff; font:inherit; font-size:15px; font-weight:800; cursor:pointer; transition:filter .15s, transform .1s; }
.wiki-ic-submit:disabled { background:var(--ne-outline-variant, #c7d2fe); cursor:not-allowed; opacity:.7; }
.wiki-ic-submit:not(:disabled):active { transform:scale(.99); filter:brightness(.94); }
/* thank-you screen (step transition) */
.wiki-ic-thanks { padding:32px 24px 24px; text-align:center; }
.wiki-ic-thanks__icon { font-size:48px; margin-bottom:14px; animation:ne-pop-in .34s var(--ne-ease-out) both; }
.wiki-ic-thanks__title { font-size:20px; font-weight:800; color:var(--ne-ink); letter-spacing:-.02em; margin:0 0 10px; line-height:1.25; }
.wiki-ic-thanks__body { font-size:14px; color:var(--ne-hint); line-height:1.55; margin:0 0 14px; }
.wiki-ic-thanks__body b { color:var(--ne-ink); }
.wiki-ic-thanks__note { font-size:12.5px; color:var(--ne-on-surface-variant, #6b7280); background:var(--ne-surface-variant, #f2f4f7); border-radius:12px; padding:10px 12px; line-height:1.45; margin-bottom:18px; text-align:left; }
.wiki-ic-thanks__actions { display:flex; flex-direction:column; gap:8px; }
.wiki-ic-rate { width:100%; padding:13px; border-radius:14px; border:none; background:var(--ne-surface-variant, #f2f4f7); color:var(--ne-ink); font:inherit; font-size:14px; font-weight:700; cursor:pointer; transition:transform .1s; }
.wiki-ic-rate:active { transform:scale(.99); }
/* freshly-contributed farm highlight in the income list */
.wiki-income-card--new { animation:wiki-ic-pulse 2.4s var(--ne-ease-out, ease-out) both; }
@keyframes wiki-ic-pulse { 0% { box-shadow:0 0 0 0 rgba(51,144,236,0); } 15% { box-shadow:0 0 0 3px rgba(51,144,236,.45); } 100% { box-shadow:0 1px 4px rgba(0,0,0,.06); } }

/* ── Jobs card v2 — farm-card format + community income + neutral date ─────────
   Header + action buttons reuse the global .tg-farm-* / .tg-reviews-btn /
   .tg-write-btn rules; this block only styles the vacancy-specific bits. */
.job2-card { gap: 11px; }
.job2-card .tg-farm-top { align-items: flex-start; }

.job2-ops { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.job2-op {
  display: inline-flex; align-items: center;
  padding: 2px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700; line-height: 1.5;
  max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.job2-op--more { background: #eef0f2 !important; color: #6b7280 !important; }

/* Community income range — soft green block */
.job2-income { background: #e9f7ef; border: 1px solid #cdedd9; border-radius: 12px; padding: 9px 12px; margin: 5px 0; }
.job2-income-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 8px; }
.job2-income-label { flex: 1 1 55%; font-size: 12px; font-weight: 600; color: #4b7a5e; }
.job2-income-range { flex: 0 0 auto; font-size: 16px; font-weight: 800; color: #157f4a; letter-spacing: -0.01em; white-space: nowrap; }
.job2-income-src { margin-top: 3px; font-size: 10.5px; color: #87a394; line-height: 1.35; }
.job2-income--clickable { cursor: pointer; transition: background 0.15s, border-color 0.15s; }
.job2-income--clickable:hover, .job2-income--clickable:focus-visible { background: #d4f0e2; border-color: #9dd5b8; outline: none; }

/* No community data yet → soft amber nudge to contribute */
.job2-noinfo { background: #fff7e6; border: 1px solid #f6e2b8; border-radius: 12px; padding: 9px 12px; font-size: 12px; font-weight: 600; color: #9a6b00; margin: 5px 0; }

/* Footer: neutral "added" date (left) + actions (right) */
.job2-foot { display: flex; align-items: center; gap: 10px; margin-top: 2px; padding-top: 11px; border-top: 1px dashed var(--ne-border, #e6e8eb); }
.job2-date { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: #8e8e93; white-space: nowrap; }
.job2-date--new { color: #1f8b4c; }
.job2-dot { width: 7px; height: 7px; border-radius: 50%; background: #34c759; box-shadow: 0 0 0 3px rgba(52,199,89,.16); }
.job2-foot-actions { flex: 1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.job2-rev, .job2-details { flex: 1 1 50%; min-width: 0; height: 40px; border-radius: 12px; box-sizing: border-box; justify-content: center; }
.job2-rev { gap: 5px; padding: 0 10px !important; }
.job2-details { font-weight: 700; }

/* Closing date pill (top-right, replaces rating) — neutral, no urgency colour */
.job2-card .tg-farm-name { flex: 1 1 auto; min-width: 0; }
.job2-close {
  margin-left: auto; flex-shrink: 0;
  gap: 3px !important; padding: 3px 8px !important; border-radius: 999px !important;
  font-size: 11px !important; font-weight: 600 !important;
  background: #f0f1f3 !important; color: #8e8e93 !important; animation: none !important;
}
.job2-close .material-symbols-outlined { font-size: 13px; }

/* ── Lebara promo (Wiki) — text brand mark + SIM icon ─────────────────────────
   Additive, scoped: reuses the .ne-wiki-promo card; only adds a text logo and the
   in-card SIM glyph (the old TransferGo logo was an <img> styled by .ne-wiki-promo-logo). */
.ne-wiki-promo-brand {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 17px;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.3px;
}
.ne-wiki-promo-brand .material-symbols-outlined { font-size: 20px; }
.ne-wiki-promo-icon-wrap .ne-wiki-promo-sim { font-size: 26px; color: var(--ne-primary); }
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-brand { font-size: 14px; }
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-brand .material-symbols-outlined { font-size: 16px; }
.wiki-ad-item.ne-wiki-promo .ne-wiki-promo-icon-wrap .ne-wiki-promo-sim { font-size: 18px; }

/* ── Lebara story slide (StoryAdManager) — reuses the forum .qd-ad card ────────── */
.story-ad-card {
  width: 100%;
  max-width: 420px;
  animation: ne-story-imgIn 0.6s cubic-bezier(0.19, 1, 0.22, 1) both;
}
.story-ad-card .qd-ad { margin-bottom: 0; }

/* ── Global search overlay (GlobalSearch.js, UX Phase 2) ────────────────────
   One input → farm card or agency verify-box. Hidden state uses
   visibility+pointer-events (never opacity alone — click-trap). */
#gs-overlay {
  position: fixed;
  inset: 0;
  z-index: 9600;
  background: rgba(15, 18, 26, 0.45);
  backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, visibility 0.18s;
}
#gs-overlay.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.gs-panel {
  max-width: 560px;
  margin: 0 auto;
  padding: max(12px, env(safe-area-inset-top)) 12px 12px;
  transform: translateY(-8px);
  transition: transform 0.18s ease;
}
#gs-overlay.open .gs-panel { transform: translateY(0); }
.gs-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--ne-surface-solid, #fff);
  border: 1px solid var(--ne-border, rgba(0, 0, 0, 0.08));
  border-radius: 16px;
  padding: 10px 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
}
.gs-bar__icon { color: var(--ne-muted); font-size: 22px; flex-shrink: 0; }
.gs-bar input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-size: 16px; /* ≥16px — no iOS zoom */
  color: var(--ne-ink);
}
.gs-bar__close {
  border: none;
  background: var(--ne-surface-2, #f0f4f9);
  border-radius: 10px;
  padding: 4px 6px;
  cursor: pointer;
  color: var(--ne-muted);
  display: flex;
  flex-shrink: 0;
}
.gs-list {
  margin-top: 10px;
  background: var(--ne-surface-solid, #fff);
  border-radius: 16px;
  overflow: hidden;
  overflow-y: auto;
  max-height: min(60vh, 480px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.14);
}
.gs-list:empty { display: none; }
.gs-section {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ne-muted);
  padding: 12px 16px 4px;
}
.gs-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  cursor: pointer;
}
.gs-row:active { background: var(--ne-surface-2, #f0f4f9); }
.gs-row__icon { color: var(--ne-primary); font-size: 22px; flex-shrink: 0; }
.gs-row__body { flex: 1; min-width: 0; }
.gs-row__title {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ne-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gs-row__sub {
  font-size: 12.5px;
  color: var(--ne-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gs-row__chev { color: var(--ne-hint, #9aa0a6); font-size: 20px; flex-shrink: 0; }
.gs-empty {
  padding: 18px 16px;
  font-size: 13.5px;
  color: var(--ne-muted);
  text-align: center;
}

/* ── Farm profile honesty pass (2026-07-03) ─────────────────────────────── */
/* Half star: left half colored via clipped overlay */
.wrv-star.half {
  position: relative;
}
.wrv-star.half::before {
  content: '★';
  position: absolute;
  inset: 0;
  width: 50%;
  overflow: hidden;
  color: #F59E0B;
}
.wrv-hero-ovr--low {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.wrv-low-note {
  font-size: 11px;
  font-weight: 600;
  color: #92400E;
  background: #FEF3C7;
  border-radius: 999px;
  padding: 3px 9px;
  white-space: nowrap;
}
.wrv-quote {
  margin-top: 10px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.65);
  border-left: 3px solid #94A3B8;
  border-radius: 8px;
  cursor: pointer;
}
.wrv-quote-text {
  font-size: 13.5px;
  line-height: 1.45;
  color: #1F2937;
  font-style: italic;
}
.wrv-quote-meta {
  margin-top: 4px;
  font-size: 11.5px;
  color: #6B7280;
}
.wrv-similar {
  margin: 14px 0 4px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  background: #F7F8FA;
  border-radius: 12px;
  padding: 12px 14px;
}
.wrv-sim-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  cursor: pointer;
}
.wrv-sim-row:first-of-type { border-top: none; }
.wrv-sim-emoji { font-size: 18px; flex-shrink: 0; }
.wrv-sim-body { flex: 1; min-width: 0; }
.wrv-sim-name {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wrv-sim-sub {
  display: block;
  font-size: 11.5px;
  color: #6B7280;
}
.wrv-sim-rating {
  flex-shrink: 0;
  font-size: 12.5px;
  font-weight: 700;
  color: #92400E;
  background: #FEF3C7;
  border-radius: 999px;
  padding: 3px 9px;
}
.wrv-sim-rating--none {
  color: #6B7280;
  background: #F3F4F6;
  font-weight: 500;
}

/* ══════════════════════════════════════════════════════════════════════════
   «Мой сезон» dashboard (Phase 3) — scoped block, NE-token driven.
   ══════════════════════════════════════════════════════════════════════════ */
.season { padding-bottom: 24px; }
.season__head { margin: 4px 2px 14px; }
.season__title {
  font-size: 22px;
  font-weight: 800;
  color: var(--ne-text-1, #202124);
  margin: 0;
  letter-spacing: -0.01em;
}
.season__offline {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--ne-amber-soft, #fef3c7);
  color: #92400e;
  font-size: 13px;
  font-weight: 600;
}
.season__offline .material-symbols-outlined { font-size: 19px; }
.season__grid { display: grid; gap: 12px; }

.season-card {
  padding: 16px;
  border-radius: var(--ne-radius-lg, 20px);
}
.season-card[hidden] { display: none; }
.season-card__head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.season-card__head .material-symbols-outlined {
  font-size: 20px;
  color: var(--ne-primary, #1a73e8);
}
.season-card__ttl {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ne-text-2, #5f6368);
}
.season-card__count {
  margin-left: auto;
  font-size: 12px;
  font-weight: 600;
  color: var(--ne-primary, #1a73e8);
  background: var(--ne-primary-container, #e8f0fe);
  border-radius: 999px;
  padding: 3px 10px;
}
.season-card__empty {
  font-size: 14px;
  color: var(--ne-text-2, #5f6368);
  margin-bottom: 12px;
}
.season-skel {
  height: 40px;
  border-radius: 10px;
  background: var(--ne-skeleton-bg, #eceff3);
  animation: season-pulse 1.4s ease-in-out infinite;
}
@keyframes season-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.5; } }

.season-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
  border-radius: 999px;
  padding: 9px 16px;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
}
.season-btn .material-symbols-outlined { font-size: 18px; }
.season-btn--primary { background: var(--ne-primary, #1a73e8); color: #fff; }
.season-btn--ghost {
  background: transparent;
  color: var(--ne-primary, #1a73e8);
  border: 1px solid var(--ne-border, #e8eaed);
}

.season-farm { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.season-farm__name {
  font-size: 17px;
  font-weight: 700;
  color: var(--ne-text-1, #202124);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.season-calc__label { font-size: 12.5px; color: var(--ne-text-2, #5f6368); }
.season-calc__amt {
  font-size: 28px;
  font-weight: 800;
  color: var(--ne-success, #1e8e3e);
  letter-spacing: -0.02em;
  margin: 2px 0 2px;
}
.season-calc__amt--neg { color: var(--ne-error, #c5221f); }
.season-calc__farm { font-size: 13px; color: var(--ne-text-2, #5f6368); margin-bottom: 12px; }

.season-fx__rate { font-size: 20px; color: var(--ne-text-1, #202124); }
.season-fx__rate b { font-weight: 800; }
.season-fx__sub { font-size: 12px; color: var(--ne-text-2, #5f6368); margin-top: 2px; }
.season-fx__conv {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--ne-border, #e8eaed);
  font-size: 13px;
  font-weight: 600;
  color: var(--ne-text-1, #202124);
}

.season-news { display: grid; gap: 4px; }
.season-news__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 8px;
  margin: 0 -8px;
  border-radius: 12px;
  cursor: pointer;
}
.season-news__row:active { background: var(--ne-surface-2, #f1f3f4); }
.season-news__body { flex: 1; min-width: 0; }
.season-news__farm {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--ne-text-1, #202124);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.season-news__meta { font-size: 12px; color: var(--ne-text-2, #5f6368); margin-top: 1px; }
.season-news__arrow { color: var(--ne-text-2, #9aa0a6); font-size: 20px; }

/* Desktop: two-column dashboard grid. */
@media (min-width: 640px) {
  .season__grid { grid-template-columns: 1fr 1fr; }
}