:root {
  --agr-forest: #0077FF;
  --agr-forest-deep: #0B2545;
  --agr-forest-surface: #F0F7FF;
  --agr-field: #0077FF;
  --agr-field-light: #0099FF;
  --agr-leaf: #00A86B;
  --agr-mint: #E8F5FF;
  --agr-mint-soft: #F4F9FD;
  --agr-gold: #0077FF;
  --agr-gold-bright: #0099FF;
  --agr-amber: #00A86B;
  --agr-champagne: #BAE8FD;
  --agr-white: #FFFFFF;
  --agr-offwhite: #F4F9FD;
  --agr-card-bg: #FFFFFF;
  --agr-divider: rgba(180, 215, 255, 0.6);
  --agr-text-primary: #0B2545;
  --agr-text-secondary: #5A738E;
  --agr-text-muted: #7A96B2;
  --agr-text-inverse: #FFFFFF;
  --mp-text-primary: #0B2545;
  --mp-text-secondary: #5A738E;
  --mp-text-muted: #7A96B2;
  --agr-danger: #E53935;
  --agr-danger-bg: rgba(229, 57, 53, 0.1);
  --agr-success: #00A86B;
  --agr-warning: #0077FF;
  --agr-info: #0077FF;

  --medplus-cyan: #0077FF;
  --medplus-blue-electric: #0077FF;
  --medplus-blue-cobalt: #0055CC;
  --medplus-blue-deep: #0B2545;
  --medplus-chrome-light: #5A738E;
  --medplus-chrome-mid: #6E88A4;
  --medplus-chrome-dark: #0B2545;

  --agr-radius-sm: 8px;
  --agr-radius-md: 14px;
  --agr-radius-lg: 20px;
  --agr-radius-xl: 28px;
  --agr-radius-2xl: 36px;
  --agr-radius-full: 9999px;

  --agr-shadow-sm: 0 2px 8px rgba(2, 27, 77, 0.05);
  --agr-shadow-md: 0 8px 24px rgba(2, 27, 77, 0.08);
  --agr-shadow-lg: 0 16px 36px rgba(2, 27, 77, 0.14);
  --agr-shadow-gold: 0 8px 24px rgba(0, 229, 255, 0.3);
  --agr-shadow-inner-gold: inset 0 0 0 1px rgba(0, 229, 255, 0.35);

  --agr-font-display: 'Plus Jakarta Sans', 'Sora', system-ui, -apple-system, sans-serif;
  --agr-font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --agr-transition: 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --agr-transition-slow: 380ms cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}

html {
  font-size: 16px;
  background-color: #DCEEFF;
  color: var(--agr-text-primary);
  font-family: var(--agr-font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  min-height: 100vh;
  min-height: 100dvh;
  background: #DCEEFF;
  background-image: linear-gradient(180deg, #CEEBFF 0%, #EEF7FF 32%, #DAEEFF 68%, #C2E3FF 100%);
  background-attachment: fixed;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow-x: hidden;
}

.agr-app-container {
  width: 100%;
  max-width: 480px;
  min-height: 100vh;
  min-height: 100dvh;
  background-color: transparent;
  position: relative;
  box-shadow: 0 0 40px rgba(0, 80, 160, 0.08);
  overflow-x: hidden;
  padding-bottom: 96px;
  display: flex;
  flex-direction: column;
}

.agr-app-container.auth-mode {
  padding-bottom: 24px;
}

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

.agr-bento-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 18px 16px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--agr-shadow-md);
  border: 1px solid rgba(10, 61, 31, 0.06);
  transition: transform var(--agr-transition), box-shadow var(--agr-transition);
}

.agr-bento-card:active {
  transform: scale(0.985);
}

.agr-bento-col-2 {
  grid-column: span 2;
}

.agr-bento-hero {
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 60%, var(--agr-field) 100%);
  color: var(--agr-white);
  border: 1px solid rgba(242, 183, 5, 0.22);
  box-shadow: var(--agr-shadow-lg);
  padding: 24px 20px;
}

.agr-bento-hero::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: radial-gradient(rgba(242, 183, 5, 0.12) 1px, transparent 1px),
                    radial-gradient(rgba(46, 158, 79, 0.1) 1px, transparent 1px);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
  opacity: 0.6;
  pointer-events: none;
}

.agr-bento-hero::after {
  content: '';
  position: absolute;
  right: -24px;
  bottom: -24px;
  width: 140px;
  height: 140px;
  background: radial-gradient(circle, rgba(242, 183, 5, 0.22) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.agr-bento-mint {
  background: var(--agr-mint-soft);
  border: 1px solid rgba(20, 107, 46, 0.12);
}

.agr-bento-gold {
  background: linear-gradient(145deg, #FFF9E6 0%, #FFF1C2 100%);
  border: 1px solid rgba(242, 183, 5, 0.4);
}

.agr-hero-editorial {
  background: linear-gradient(145deg, var(--agr-forest-deep) 0%, var(--agr-forest) 55%, #0D4523 100%);
  color: var(--agr-white);
  padding: 32px 20px 48px;
  position: relative;
  overflow: hidden;
}

.agr-hero-editorial::before {
  content: '';
  position: absolute;
  top: -40px;
  right: -40px;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, rgba(242, 183, 5, 0.14) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.agr-hero-wave {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  pointer-events: none;
}

.agr-hero-wave svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 28px;
}

.agr-hero-wave .shape-fill {
  fill: var(--agr-offwhite);
}

.agr-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  position: relative;
  z-index: 2;
}

.agr-topbar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

.agr-topbar-logo {
  height: 34px;
  width: auto;
}

.agr-topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.agr-icon-btn {
  width: 38px;
  height: 38px;
  border-radius: var(--agr-radius-full);
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: var(--agr-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
  transition: all var(--agr-transition);
  text-decoration: none;
}

.agr-icon-btn:hover, .agr-icon-btn:active {
  background: rgba(242, 183, 5, 0.25);
  border-color: var(--agr-gold);
  color: var(--agr-gold);
  transform: translateY(-1px);
}

.agr-header-internal {
  padding: 18px 20px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--agr-white);
  border-bottom: 1px solid var(--agr-divider);
  position: sticky;
  top: 0;
  z-index: 30;
}

.agr-header-internal.dark {
  background: var(--agr-forest);
  color: var(--agr-white);
  border-bottom: 1px solid rgba(242, 183, 5, 0.18);
}

.agr-header-title {
  font-family: var(--agr-font-display);
  font-size: 18px;
  font-weight: 700;
  color: inherit;
  letter-spacing: -0.02em;
}

.agr-back-circle {
  width: 36px;
  height: 36px;
  border-radius: var(--agr-radius-full);
  background: var(--agr-mint);
  color: var(--agr-field);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
  text-decoration: none;
  transition: all var(--agr-transition);
}

.agr-header-internal.dark .agr-back-circle {
  background: rgba(255, 255, 255, 0.15);
  color: var(--agr-white);
}

.agr-back-circle:active {
  transform: scale(0.92);
}

.agr-collapsing-header {
  padding: 16px 20px 8px;
}

.agr-collapsing-title {
  font-family: var(--agr-font-display);
  font-size: 26px;
  font-weight: 800;
  color: var(--agr-text-primary);
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.agr-collapsing-subtitle {
  font-size: 13px;
  color: var(--agr-text-secondary);
  margin-top: 4px;
}

.agr-display-num {
  font-family: var(--agr-font-display);
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}

.agr-display-num.sm {
  font-size: 28px;
}

.agr-display-num.lg {
  font-size: 44px;
}

.agr-label-caps {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--agr-text-muted);
}

.agr-label-caps.inverse {
  color: rgba(255, 255, 255, 0.75);
}

.agr-label-caps.gold {
  color: var(--agr-gold-bright);
}

.agr-badge-seal {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: var(--agr-radius-full);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.agr-badge-seal.gold {
  background: linear-gradient(135deg, var(--agr-gold-bright) 0%, var(--agr-amber) 100%);
  color: var(--agr-forest-deep);
  box-shadow: 0 2px 6px rgba(217, 154, 0, 0.3);
}

.agr-badge-seal.green {
  background: rgba(46, 158, 79, 0.15);
  color: var(--agr-leaf);
  border: 1px solid rgba(46, 158, 79, 0.25);
}

.agr-badge-seal.dark {
  background: rgba(10, 61, 31, 0.85);
  color: var(--agr-champagne);
  border: 1px solid rgba(242, 183, 5, 0.3);
}

.agr-pill-scroller {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 4px 16px 12px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.agr-pill-scroller::-webkit-scrollbar {
  display: none;
}

.agr-pill-item {
  flex-shrink: 0;
  scroll-snap-align: start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: var(--agr-radius-full);
  background: var(--agr-white);
  border: 1px solid var(--agr-divider);
  color: var(--agr-text-primary);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: var(--agr-shadow-sm);
  transition: all var(--agr-transition);
  cursor: pointer;
}

.agr-pill-item i {
  color: var(--agr-field);
  font-size: 15px;
}

.agr-pill-item:active, .agr-pill-item.active {
  background: var(--agr-forest);
  border-color: var(--agr-gold);
  color: var(--agr-white);
  transform: translateY(-1px);
  box-shadow: var(--agr-shadow-md);
}

.agr-pill-item:active i, .agr-pill-item.active i {
  color: var(--agr-gold);
}

.agr-shortcuts-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-lg);
  border: 1px solid var(--agr-divider);
  padding: 14px 10px;
  box-shadow: var(--agr-shadow-sm);
}

.agr-shortcuts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 8px;
}

.agr-shortcut-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 6px;
  padding: 10px 4px;
  border-radius: var(--agr-radius-md);
  text-decoration: none;
  color: var(--agr-text-primary);
  background: #F9FAF8;
  border: 1px solid rgba(10, 61, 31, 0.05);
  transition: all var(--agr-transition);
  cursor: pointer;
}

.agr-shortcut-tile:hover {
  background: var(--agr-cream);
  border-color: rgba(20, 107, 46, 0.2);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(10, 61, 31, 0.06);
}

.agr-shortcut-tile:active {
  transform: scale(0.96);
}

.agr-shortcut-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #FFFFFF 0%, #F4F8F5 100%);
  box-shadow: 0 4px 14px rgba(10, 61, 31, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(242, 183, 5, 0.28);
  transition: transform var(--agr-transition), border-color var(--agr-transition), box-shadow var(--agr-transition);
}

.agr-shortcut-tile:hover .agr-shortcut-icon {
  transform: translateY(-2px) scale(1.05);
  border-color: rgba(242, 183, 5, 0.55);
  box-shadow: 0 8px 18px rgba(10, 61, 31, 0.12);
}

.agr-shortcut-icon .agr-svg-icon {
  width: 32px;
  height: 32px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 2px 4px rgba(10, 61, 31, 0.18));
  transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.agr-shortcut-tile:hover .agr-shortcut-icon .agr-svg-icon {
  transform: scale(1.12);
}

.agr-shortcut-icon.green,
.agr-shortcut-icon.gold,
.agr-shortcut-icon.forest,
.agr-shortcut-icon.amber,
.agr-shortcut-icon.purple,
.agr-shortcut-icon.emerald,
.agr-shortcut-icon.teal,
.agr-shortcut-icon.blue,
.agr-shortcut-icon.earth {
  background: linear-gradient(145deg, #FFFFFF 0%, #F4F8F5 100%);
  border-color: rgba(242, 183, 5, 0.32);
}

.agr-shortcut-label {
  font-size: 11.5px;
  font-weight: 700;
  font-family: var(--agr-font-display);
  color: var(--agr-text-primary);
  line-height: 1.2;
}

.agr-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  padding: 12px 20px;
  border-radius: var(--agr-radius-md);
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  border: none;
  transition: all var(--agr-transition);
  position: relative;
  overflow: hidden;
}

.agr-btn:active {
  transform: scale(0.985);
}

.agr-btn-gold {
  background: linear-gradient(145deg, #FFD659 0%, var(--agr-gold) 50%, #D99A00 100%);
  color: var(--agr-forest-deep);
  box-shadow: var(--agr-shadow-gold);
  border: 1px solid rgba(255, 255, 255, 0.4);
}

.agr-btn-gold:active {
  box-shadow: 0 4px 12px rgba(217, 154, 0, 0.4);
}

.agr-btn-field {
  background: linear-gradient(145deg, var(--agr-field-light) 0%, var(--agr-field) 100%);
  color: var(--agr-white);
  box-shadow: 0 6px 18px rgba(20, 107, 46, 0.25);
}

.agr-btn-outline {
  background: transparent;
  border: 1.5px solid var(--agr-field);
  color: var(--agr-field);
}

.agr-btn-outline:active {
  background: var(--agr-mint);
}

.agr-btn-outline-danger {
  background: transparent;
  border: 1.5px solid var(--agr-danger);
  color: var(--agr-danger);
}

.agr-btn-outline-danger:active {
  background: var(--agr-danger-bg);
}

.agr-btn-sm {
  min-height: 36px;
  padding: 6px 14px;
  font-size: 13px;
  border-radius: var(--agr-radius-sm);
}

.agr-field-group {
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.agr-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--agr-text-secondary);
}

.agr-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.agr-input-icon {
  position: absolute;
  left: 14px;
  color: var(--agr-field);
  font-size: 16px;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.agr-input {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px 12px 42px;
  background: var(--agr-white);
  border: 1.5px solid var(--agr-divider);
  border-radius: var(--agr-radius-md);
  font-family: var(--agr-font-body);
  font-size: 15px;
  color: var(--agr-text-primary);
  outline: none;
  transition: all var(--agr-transition);
}

.agr-input.no-icon {
  padding-left: 14px;
}

.agr-input:focus {
  border-color: var(--agr-gold);
  box-shadow: 0 0 0 3px rgba(242, 183, 5, 0.22);
}

.agr-input::placeholder {
  color: var(--agr-text-muted);
}

.agr-segmented-control {
  display: flex;
  background: var(--agr-mint);
  border-radius: var(--agr-radius-full);
  padding: 4px;
  gap: 4px;
  margin-bottom: 16px;
}

.agr-segmented-btn {
  flex: 1;
  padding: 10px 12px;
  border: none;
  border-radius: var(--agr-radius-full);
  background: transparent;
  color: var(--agr-text-secondary);
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--agr-transition);
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.agr-segmented-btn.active {
  background: var(--agr-forest);
  color: var(--agr-white);
  box-shadow: 0 4px 12px rgba(10, 61, 31, 0.18);
}

.agr-segmented-btn.active i {
  color: var(--agr-gold);
}

.agr-pill-nav {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 440px;
  min-height: 62px;
  background: rgba(3, 14, 32, 0.88);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: var(--agr-radius-full);
  box-shadow: 0 16px 40px rgba(0, 5, 20, 0.6), 0 0 20px rgba(0, 123, 255, 0.15);
  border: 1px solid rgba(0, 229, 255, 0.22);
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 6px 8px;
  z-index: 100;
}

.agr-pill-nav-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: var(--agr-radius-full);
  color: #7A96B2;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  font-family: var(--agr-font-display);
  transition: all var(--agr-transition);
  cursor: pointer;
  border: none;
  background: transparent;
  position: relative;
}

.agr-pill-nav-item i {
  font-size: 19px;
  transition: transform var(--agr-transition);
}

.agr-pill-nav-item span {
  display: none;
  white-space: nowrap;
}

.agr-pill-nav-item.active {
  background: linear-gradient(135deg, #0056D2 0%, #007BFF 60%, #00C8F8 100%);
  color: #FFFFFF;
  box-shadow: 0 4px 18px rgba(0, 123, 255, 0.45);
  padding: 10px 18px;
}

.agr-pill-nav-item.active i {
  color: #FFFFFF;
  transform: scale(1.08);
}

.agr-pill-nav-item.active span {
  display: inline;
}

.agr-bottom-sheet {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 3000;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  transform: none;
}

.agr-bottom-sheet.open, .agr-bottom-sheet.active, .agr-bottom-sheet.is-open {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
  transform: none;
}

.agr-sheet-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(11, 37, 69, 0.45);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--agr-transition);
}

.agr-sheet-backdrop.open, .agr-sheet-backdrop.active, .agr-sheet-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.agr-sheet-handle {
  width: 44px;
  height: 5px;
  background: var(--agr-divider);
  border-radius: var(--agr-radius-full);
  margin: 12px auto 8px;
}

.agr-sheet-body {
  padding: 16px 20px 28px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.agr-dialog-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(10, 61, 31, 0.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  z-index: 200;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--agr-transition);
}

.agr-dialog-overlay.open, .agr-dialog-overlay:not(.hidden) {
  opacity: 1;
  pointer-events: auto;
}

.agr-dialog-box {
  width: 100%;
  max-width: 420px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 24px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(242, 183, 5, 0.2);
  transform: scale(0.94);
  transition: transform var(--agr-transition);
}

.agr-dialog-overlay.open .agr-dialog-box, .agr-dialog-overlay:not(.hidden) .agr-dialog-box {
  transform: scale(1);
}

.agr-compliance-note {
  font-size: 11px;
  color: var(--agr-text-muted);
  text-align: center;
  line-height: 1.45;
  padding: 16px 20px;
}

.agr-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 16px 12px;
}

.agr-section-title {
  font-family: var(--agr-font-display);
  font-size: 17px;
  font-weight: 800;
  color: var(--agr-text-primary);
  letter-spacing: -0.02em;
}

.agr-section-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--agr-field);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.agr-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: var(--agr-radius-full);
  background: var(--agr-mint);
  color: var(--agr-field);
  font-size: 12px;
  font-weight: 700;
  border: 1px solid rgba(20, 107, 46, 0.12);
  cursor: pointer;
  transition: all var(--agr-transition);
}

.agr-chip:active, .agr-chip.active {
  background: var(--agr-field);
  color: var(--agr-white);
}

.agr-timeline {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0 16px;
}

.agr-timeline-item {
  background: var(--agr-white);
  border-radius: var(--agr-radius-lg);
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: var(--agr-shadow-sm);
  border: 1px solid var(--agr-divider);
  transition: transform var(--agr-transition);
}

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

.agr-timeline-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--agr-radius-md);
  background: var(--agr-mint);
  color: var(--agr-field);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
  margin-right: 12px;
}

.agr-progress-bar {
  width: 100%;
  height: 8px;
  background: var(--agr-divider);
  border-radius: var(--agr-radius-full);
  overflow: hidden;
  position: relative;
}

.agr-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--agr-field) 0%, var(--agr-gold) 100%);
  border-radius: var(--agr-radius-full);
  transition: width 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.hidden {
  display: none !important;
}

@keyframes agrFadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.agr-animate-enter {
  animation: agrFadeUp 0.35s cubic-bezier(0.16, 1, 0.3, 1) both;
}

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

select.agr-input {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23146B2E' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 14px 14px;
  padding-right: 38px;
  cursor: pointer;
}

select.agr-input.no-icon {
  padding-left: 14px;
  padding-right: 38px;
}

select.agr-input option {
  background: var(--agr-white);
  color: var(--agr-text-primary);
  padding: 8px 12px;
}

textarea.agr-input {
  min-height: 96px;
  resize: vertical;
}

input[type="checkbox"] {
  accent-color: var(--agr-field);
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.auth-eye {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  color: var(--agr-text-muted);
  font-size: 17px;
  cursor: pointer;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--agr-radius-sm);
  transition: color var(--agr-transition);
  z-index: 2;
}

.auth-eye:hover, .auth-eye:focus-visible {
  color: var(--agr-field);
  outline: none;
}

.sheet-error {
  display: none;
  background: var(--agr-danger-bg);
  color: var(--agr-danger);
  border: 1px solid rgba(214, 69, 69, 0.25);
  border-radius: var(--agr-radius-md);
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 14px;
  line-height: 1.4;
}

.sheet-error:not(:empty) {
  display: block;
}

.sheet-error-link {
  color: var(--agr-field);
  font-weight: 700;
  text-decoration: underline;
  margin-left: 4px;
}

.deposit-amount-hint {
  font-size: 12px;
  font-weight: 600;
  color: var(--agr-field);
  margin-top: 6px;
}

.agr-chips-grid, .wl-quick-chips {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 12px 0 16px;
}

.wl-quick-chip {
  background: var(--agr-mint);
  border: 1.5px solid rgba(20, 107, 46, 0.16);
  border-radius: var(--agr-radius-full);
  padding: 10px 0;
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--agr-field);
  cursor: pointer;
  text-align: center;
  transition: all var(--agr-transition);
}

.wl-quick-chip:hover, .wl-quick-chip.active {
  background: var(--agr-field);
  border-color: var(--agr-gold);
  color: var(--agr-white);
  box-shadow: 0 4px 12px rgba(20, 107, 46, 0.25);
}

.carteira-form {
  display: flex;
  flex-direction: column;
}

.carteira-panel {
  transition: opacity var(--agr-transition);
}

.carteira-gate-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: 14px;
}

.carteira-hint {
  font-size: 13px;
  line-height: 1.45;
}

.carteira-hint--sm {
  font-size: 12px;
  color: var(--agr-text-muted);
  margin-bottom: 8px;
}

.carteira-saved {
  font-family: var(--agr-font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--agr-field);
}

.carteira-link-btn {
  background: transparent;
  border: none;
  color: var(--agr-field);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color var(--agr-transition);
}

.carteira-link-btn:hover {
  color: var(--agr-forest);
}

.wallet-tier-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.wallet-tier-name {
  color: var(--agr-white);
  font-size: 13px;
  font-weight: 700;
}

.wl-tier-limit {
  color: var(--agr-gold-bright);
  font-size: 13px;
  font-weight: 700;
}

.wl-tier-used {
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
}

.agr-withdraw-reg {
  display: flex;
  flex-direction: column;
}

.carteira-extrato {
  display: flex;
  flex-direction: column;
}

.carteira-extrato-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.wl-ext-head {
  display: grid;
  grid-template-columns: 80px 1fr 76px 70px;
  gap: 8px;
  padding: 8px 10px;
  background: var(--agr-mint-soft);
  border-radius: var(--agr-radius-sm);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--agr-text-muted);
}

.wl-col-date, .wl-col-desc, .wl-col-val, .wl-col-status {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wl-col-val, .wl-col-status {
  text-align: right;
}

.wl-ext-row {
  display: grid;
  grid-template-columns: 80px 1fr 76px 70px;
  gap: 8px;
  align-items: center;
  padding: 10px 10px;
  background: var(--agr-white);
  border: 1px solid var(--agr-divider);
  border-radius: var(--agr-radius-md);
  font-size: 12px;
  transition: background var(--agr-transition);
}

.wl-ext-row:hover {
  background: var(--agr-mint-soft);
}

.wl-ext-date {
  display: flex;
  flex-direction: column;
  font-size: 11px;
  color: var(--agr-text-secondary);
  font-variant-numeric: tabular-nums;
}

.wl-ext-date i {
  display: none;
}

.wl-ext-date em {
  font-style: normal;
  font-size: 10px;
  color: var(--agr-text-muted);
}

.wl-ext-desc {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.wl-ext-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--agr-text-secondary);
}

.wl-ext-tag.is-credit {
  color: var(--agr-success);
}

.wl-ext-tag.is-debit {
  color: var(--agr-danger);
}

.wl-ext-val {
  font-family: var(--agr-font-display);
  font-weight: 700;
  font-size: 13px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.wl-ext-val.is-credit {
  color: var(--agr-success);
}

.wl-ext-val.is-debit {
  color: var(--agr-text-primary);
}

.wl-ext-val.is-pending {
  color: var(--agr-amber);
}

.wl-ext-status-wrap {
  text-align: right;
}

.wl-ext-status {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 6px;
  border-radius: var(--agr-radius-sm);
  background: var(--agr-mint);
  color: var(--agr-field);
}

.wl-ext-status.is-completed, .wl-ext-status.is-credit {
  background: rgba(46, 158, 79, 0.12);
  color: var(--agr-success);
}

.wl-ext-status.is-pending, .wl-ext-status.is-processing {
  background: rgba(242, 183, 5, 0.15);
  color: var(--agr-amber);
}

.wl-ext-status.is-failed, .wl-ext-status.is-debit {
  background: var(--agr-danger-bg);
  color: var(--agr-danger);
}

.bottom-nav {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 440px;
  min-height: 62px;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: var(--agr-radius-full);
  box-shadow: 0 12px 36px rgba(10, 61, 31, 0.18), 0 2px 8px rgba(10, 61, 31, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 6px 8px;
  z-index: 100;
}

.nav-item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: var(--agr-radius-full);
  color: var(--agr-text-secondary);
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  font-family: var(--agr-font-display);
  transition: all var(--agr-transition);
  cursor: pointer;
  border: none;
  background: transparent;
  position: relative;
}

.nav-item i {
  font-size: 19px;
  color: var(--agr-text-muted);
  transition: color var(--agr-transition);
}

.nav-item span {
  display: none;
}

.nav-item.active {
  background: var(--agr-forest);
  color: var(--agr-white);
  padding: 10px 18px;
  box-shadow: 0 6px 18px rgba(10, 61, 31, 0.25);
}

.nav-item.active i {
  color: var(--agr-gold);
}

.nav-item.active span {
  display: inline;
}

.category-tabs, .carteira-wallet-tabs, .agr-filter-bar {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding: 4px 16px 12px;
}

.category-tabs::-webkit-scrollbar, .agr-filter-bar::-webkit-scrollbar {
  display: none;
}

.category-tab, .sk-chip-btn {
  white-space: nowrap;
  flex-shrink: 0;
  padding: 8px 16px;
  border-radius: var(--agr-radius-full);
  background: #FFFFFF;
  border: 1px solid rgba(180, 215, 255, 0.8);
  color: #5A738E;
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.category-tab:hover, .sk-chip-btn:hover {
  background: rgba(0, 123, 255, 0.2);
  border-color: #00E5FF;
  color: #FFFFFF;
}

.category-tab.active, .sk-chip-btn.active {
  background: linear-gradient(135deg, #0056D2 0%, #007BFF 100%);
  border-color: #00E5FF;
  color: #FFFFFF;
  box-shadow: 0 0 16px rgba(0, 229, 255, 0.35);
}

.category-tab.active i, .sk-chip-btn.active i {
  color: #00E5FF;
}

.receita-list, .traders-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.empty-msg, .positions-empty, .rl-empty {
  text-align: center;
  color: var(--agr-text-muted);
  font-size: 13px;
  padding: 32px 16px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-lg);
  border: 1px dashed var(--agr-divider);
}

.muted {
  color: var(--agr-text-muted) !important;
}

.pos, .positive, .text-success {
  color: var(--agr-success) !important;
}

.agr-auth-hero {
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 50%, var(--agr-field) 100%);
  padding: 44px 24px 48px;
  position: relative;
  overflow: hidden;
}

.agr-auth-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(rgba(242, 183, 5, 0.15) 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: 0.6;
  pointer-events: none;
}

.agr-auth-hero::after {
  content: '';
  position: absolute;
  right: -30px;
  bottom: -30px;
  width: 160px;
  height: 160px;
  background: radial-gradient(circle, rgba(242, 183, 5, 0.22) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.agr-auth-sheet {
  flex: 1;
  background: var(--agr-white);
  border-radius: 32px 32px 0 0;
  margin-top: -30px;
  padding: 28px 24px 40px;
  position: relative;
  z-index: 5;
  box-shadow: 0 -12px 36px rgba(10, 61, 31, 0.12);
}

.agr-auth-split {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.agr-wallet-hero {
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 60%, var(--agr-field) 100%);
  padding: 24px 20px 28px;
  position: relative;
  overflow: hidden;
  border-bottom: 2px solid rgba(242, 183, 5, 0.3);
}

.agr-wallet-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(rgba(242, 183, 5, 0.12) 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: 0.5;
  pointer-events: none;
}

.agr-wallet-hero-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  position: relative;
  z-index: 2;
}

.agr-wallet-balance-box {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(242, 183, 5, 0.25);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 24px;
  padding: 20px;
  position: relative;
  z-index: 2;
  overflow: hidden;
}

.agr-market-hero {
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 60%, var(--agr-field) 100%);
  padding: 24px 20px;
  position: relative;
  overflow: hidden;
}

.agr-aff-hero, .agr-producer-hero, .agr-ci-hero, .agr-statement-hero {
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 60%, var(--agr-field) 100%);
  padding: 24px 20px;
  position: relative;
  overflow: hidden;
  color: var(--agr-white);
}

.agr-aff-hero::before, .agr-producer-hero::before, .agr-ci-hero::before, .agr-statement-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(rgba(242, 183, 5, 0.12) 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: 0.5;
  pointer-events: none;
}

.agr-invite-box {
  background: var(--agr-mint);
  border: 1.5px dashed var(--agr-field);
  border-radius: var(--agr-radius-lg);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.agr-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.agr-table th {
  text-align: left;
  padding: 10px 12px;
  background: var(--agr-mint-soft);
  color: var(--agr-text-secondary);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.agr-table td {
  padding: 12px;
  border-bottom: 1px solid var(--agr-divider);
  color: var(--agr-text-primary);
}

.agr-avatar-ring {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  padding: 3px;
  background: linear-gradient(135deg, var(--agr-gold) 0%, var(--agr-field) 100%);
  box-shadow: 0 4px 14px rgba(10, 61, 31, 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.agr-avatar-inner {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--agr-forest);
  color: var(--agr-gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 800;
  overflow: hidden;
}

.agr-avatar-inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.agr-setting-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-md);
  border: 1px solid var(--agr-divider);
  text-decoration: none;
  color: var(--agr-text-primary);
  font-size: 14px;
  font-weight: 600;
  transition: all var(--agr-transition);
}

.agr-setting-row:hover {
  background: var(--agr-mint-soft);
  border-color: rgba(20, 107, 46, 0.2);
}

.agr-group-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-shadow: var(--agr-shadow-sm);
  border: 1px solid var(--agr-divider);
}

.agr-group-card .agr-setting-row {
  border: none;
  border-radius: var(--agr-radius-sm);
}

.chevron {
  color: var(--agr-text-muted);
  font-size: 15px;
}

.md {
  font-size: 15px;
}

.agr-wheel-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px 0;
}

.agr-voucher-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 24px 20px;
  box-shadow: var(--agr-shadow-md);
  border: 1px solid var(--agr-divider);
  text-align: center;
}

.agr-ci-icon-wrap {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(242, 183, 5, 0.2);
  color: var(--agr-gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  margin: 0 auto 12px;
}

.agr-statement-chips {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 14px 16px;
}

.agr-hero-farm {
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 55%, var(--agr-field) 100%);
  padding: 24px 20px 28px;
  position: relative;
  overflow: hidden;
  border-bottom: 2px solid rgba(242, 183, 5, 0.25);
}

.agr-hero-farm::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(rgba(242, 183, 5, 0.12) 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: 0.55;
  pointer-events: none;
}

.agr-farm-lead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  position: relative;
  z-index: 2;
}

.agr-farm-identity {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.agr-farm-logo {
  height: 38px;
  width: auto;
}

.agr-farm-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.agr-stats-editorial {
  background: var(--agr-white);
  border-radius: 24px;
  padding: 20px;
  margin: 0 16px;
  box-shadow: var(--agr-shadow-md);
  border: 1px solid var(--agr-divider);
}

.agr-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 14px;
  text-align: center;
}

.agr-stat-num {
  display: block;
  font-family: var(--agr-font-display);
  font-size: 20px;
  font-weight: 800;
  color: var(--agr-forest);
}

.agr-stat-lbl {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--agr-text-secondary);
  margin-top: 2px;
}

.agr-bento-hero-tile {
  background: linear-gradient(135deg, #0A2540 0%, #0052D4 60%, #0077FF 100%);
  border-radius: var(--agr-radius-xl);
  padding: 20px;
  color: var(--agr-white);
  box-shadow: var(--agr-shadow-md);
  border: 1px solid rgba(242, 183, 5, 0.22);
  position: relative;
  overflow: hidden;
}

.agr-bento-mini {
  padding: 14px;
  border-radius: var(--agr-radius-lg);
}

.agr-bento-row {
  display: flex;
  gap: 12px;
  padding: 0 16px;
}

.agr-bento-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0 16px;
}

.agr-vip-club-card {
  background: linear-gradient(135deg, #1C1A14 0%, #2A2415 60%, #17140B 100%);
  border: 1px solid rgba(242, 183, 5, 0.35);
  border-radius: var(--agr-radius-xl);
  padding: 20px;
  color: var(--agr-white);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.agr-feat-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
}

.agr-feat-ico {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--agr-mint);
  color: var(--agr-field);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.sk-balance-val, .sk-stat-val {
  font-family: var(--agr-font-display);
  font-weight: 800;
}

.sk-info-badge, .sk-investor-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.sk-info-title, .sk-investor-title {
  font-family: var(--agr-font-display);
  font-weight: 700;
}

.sk-investor-btn {
  text-decoration: none;
}

.tg-float, .wa-float {
  position: fixed;
  right: 18px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: var(--agr-white);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  z-index: 90;
  text-decoration: none;
  transition: transform var(--agr-transition);
}

.tg-float:active, .wa-float:active {
  transform: scale(0.92);
}

.tg-float {
  bottom: 148px;
  background: linear-gradient(135deg, #2AABEE 0%, #229ED9 100%);
}

.wa-float {
  bottom: 86px;
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
}

.agr-detail-media {
  width: 100%;
  height: 220px;
  position: relative;
  background: var(--agr-forest-surface);
  overflow: hidden;
}

.sk-dt-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.agr-detail-panel {
  background: var(--agr-white);
  border-radius: 28px 28px 0 0;
  margin-top: -24px;
  position: relative;
  z-index: 5;
  padding: 24px 20px 40px;
  box-shadow: 0 -10px 30px rgba(10, 61, 31, 0.1);
}

.sk-dt-specs-card {
  background: var(--agr-offwhite);
  border: 1px solid var(--agr-divider);
  border-radius: var(--agr-radius-lg);
  padding: 12px;
  margin: 16px 0;
}

.sk-dt-specs-grid, .sk-dt-specs-row2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.sk-dt-spec-item {
  background: #ffffff;
  border: 1px solid #eaefea;
  border-radius: 16px;
  padding: 12px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
  min-height: 72px;
}

.sk-dt-spec-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
}

.sk-dt-spec-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  flex: 1;
}

.sk-dt-spec-lbl {
  font-size: 10px;
  color: var(--agr-text-muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2px;
  line-height: 1.2;
  margin-bottom: 2px;
}

.sk-dt-spec-val {
  font-family: var(--agr-font-display);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.15;
  color: var(--agr-text-primary);
}

.sk-dt-spec-sub {
  font-size: 9px;
  font-weight: 600;
  color: var(--agr-text-muted);
  line-height: 1.1;
  margin-top: 2px;
}

.sk-dt-bottom-bar {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 480px;
  background: var(--agr-white);
  border-top: 1px solid var(--agr-divider);
  padding: 12px 20px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
  z-index: 95;
}

.sk-dt-rent-btn {
  flex: 1;
}

.sk-confirm-view {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.iv3-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 12px;
}

.iv3-card {
  background: #FFFFFF !important;
  border: 1px solid rgba(180, 215, 255, 0.75) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  padding: 16px !important;
  box-shadow: 0 8px 24px rgba(0, 80, 160, 0.08) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
  cursor: pointer;
  position: relative;
  color: #0B2545 !important;
}

.iv3-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(0, 119, 255, 0.15) !important;
  border-color: #0077FF !important;
}

.iv3-card:active {
  transform: scale(0.985);
}

.iv3-card--mid {
  border-color: rgba(180, 215, 255, 0.8) !important;
}

.iv3-card--long {
  border-color: rgba(180, 215, 255, 0.8) !important;
}

.iv3-card--combo {
  border-color: rgba(180, 215, 255, 0.8) !important;
}

.iv3-card-body {
  display: flex !important;
  gap: 14px !important;
  align-items: flex-start !important;
  margin-bottom: 14px !important;
}

.iv3-card-left {
  flex: 1;
  min-width: 0;
}

.iv3-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}

.iv3-title {
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #0B2545 !important;
  margin: 0;
  line-height: 1.25;
}

.iv3-badge-op {
  display: inline-block;
  background: rgba(0, 119, 255, 0.1) !important;
  color: #0077FF !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  letter-spacing: .3px;
  white-space: nowrap;
  border: 1px solid rgba(0, 119, 255, 0.25) !important;
}

.iv3-profit-range {
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #0077FF !important;
  margin-bottom: 6px;
  line-height: 1.4;
}

.iv3-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

.iv3-tag {
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(0, 119, 255, 0.08);
  color: #0077FF;
  font-weight: 600;
  border: 1px solid rgba(0, 119, 255, 0.2);
}

.iv3-cycle {
  font-size: 12px;
  font-weight: 600;
  color: #5A738E !important;
}

.iv3-card-right {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.iv3-avatar {
  width: 68px;
  height: 68px;
  border-radius: 16px !important;
  overflow: hidden;
  background: #EEF6FC !important;
  border: 1.5px solid #BEE3F8 !important;
  box-shadow: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.iv3-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  padding: 4px;
}

.iv3-card-ico {
  color: #0077FF !important;
  font-size: 14px;
}

.iv3-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid rgba(180, 215, 255, 0.5) !important;
}

.iv3-price-wrap {
  display: flex;
  flex-direction: column;
}

.iv3-price-main {
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 18px;
  font-weight: 800;
  color: #0B2545 !important;
  display: flex;
  align-items: center;
  gap: 6px;
}

.iv3-discount {
  font-size: 11px;
  font-weight: 700;
  color: #00A86B !important;
  background: rgba(0, 168, 107, 0.1) !important;
  border: 1px solid rgba(0, 168, 107, 0.25) !important;
  padding: 2px 6px;
  border-radius: 6px;
}

.iv3-price-old {
  font-size: 11px;
  color: #7A96B2 !important;
  text-decoration: line-through;
}

.iv3-btn {
  padding: 8px 20px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #0099FF 0%, #0077FF 100%) !important;
  color: #FFFFFF !important;
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  border: none !important;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 120, 240, 0.35) !important;
  transition: all 0.2s ease !important;
}

.iv3-btn:hover {
  filter: brightness(1.05) !important;
  box-shadow: 0 6px 18px rgba(0, 120, 240, 0.45) !important;
  transform: translateY(-1px) !important;
}

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

.iv3-btn--mid {
  background: linear-gradient(180deg, #0099FF 0%, #0077FF 100%) !important;
}

.iv3-btn--long {
  background: linear-gradient(180deg, #0099FF 0%, #0077FF 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(0, 120, 240, 0.35) !important;
}

.my-sub-card {
  background: #FFFFFF !important;
  border: 1px solid rgba(180, 215, 255, 0.75) !important;
  border-radius: 20px !important;
  padding: 16px !important;
  margin-bottom: 12px;
  box-shadow: 0 8px 24px rgba(0, 80, 160, 0.08) !important;
  color: #0B2545 !important;
}

.my-sub-top {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}

.my-sub-avatar {
  width: 48px;
  height: 48px;
  border-radius: var(--agr-radius-md);
  object-fit: cover;
  background: var(--agr-mint);
}

.my-sub-info {
  flex: 1;
  min-width: 0;
}

.my-sub-name {
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 800;
  color: var(--agr-text-primary);
}

.my-sub-meta {
  font-size: 12px;
  color: var(--agr-text-muted);
}

.my-sub-status {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: var(--agr-radius-sm);
  background: var(--agr-mint);
  color: var(--agr-field);
}

.my-sub-profit {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  background: var(--agr-mint-soft);
  border-radius: var(--agr-radius-md);
  padding: 12px;
  margin-bottom: 12px;
}

.my-sub-profit-label {
  font-size: 11px;
  color: var(--agr-text-secondary);
  font-weight: 600;
}

.my-sub-profit-val, .my-sub-profit-avail, .my-sub-profit-daily {
  font-family: var(--agr-font-display);
  font-size: 14px;
  font-weight: 800;
  color: var(--agr-field);
}

.my-sub-actions {
  display: flex;
  gap: 8px;
}

.sub-btn {
  flex: 1;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif);
  border: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sub-btn-operation {
  background: rgba(0, 229, 255, 0.15) !important;
  color: #00E5FF !important;
  border: 1px solid rgba(0, 229, 255, 0.35) !important;
}

.sub-btn-redeem {
  background: linear-gradient(135deg, #00FF9D 0%, #00B4D8 100%) !important;
  color: #010612 !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 14px rgba(0, 255, 157, 0.3) !important;
}

.ss2-hero {
  position: relative;
  border-radius: 20px;
  padding: 18px 16px;
  margin-bottom: 16px;
  background: linear-gradient(135deg, var(--agr-forest-deep) 0%, var(--agr-forest) 100%) !important;
  color: var(--agr-white);
  border: 1px solid rgba(242, 183, 5, 0.25);
  box-shadow: var(--agr-shadow-md);
  overflow: hidden;
}

.ss2-hero-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ss2-hero-avatar {
  width: 48px;
  height: 48px;
  border-radius: var(--agr-radius-md);
  object-fit: cover;
  background: rgba(255, 255, 255, 0.15);
}

.ss2-hero-id {
  font-size: 11px;
  color: var(--agr-gold-bright);
  font-weight: 700;
  text-transform: uppercase;
}

.ss2-hero-title {
  font-family: var(--agr-font-display);
  font-size: 17px;
  font-weight: 800;
  color: var(--agr-white);
}

.ss2-hero-sub {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
}

.ss2-hero-actions {
  margin-left: auto;
  display: flex;
  gap: 6px;
}

.ss2-deposit, .ss2-close {
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: var(--agr-white);
  border-radius: var(--agr-radius-full);
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.ss2-hero-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.ss2-stat {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
}

.ss2-stat i {
  color: var(--agr-gold);
  font-size: 14px;
}

.ss2-stat span {
  display: block;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.7);
}

.ss2-stat strong {
  display: block;
  font-size: 13px;
  color: var(--agr-gold-bright);
  font-family: var(--agr-font-display);
}

.ss2-balance {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--agr-mint-soft);
  border-radius: var(--agr-radius-md);
  padding: 10px 14px;
  margin-bottom: 14px;
  font-size: 13px;
}

.ss2-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--agr-text-secondary);
  text-transform: uppercase;
  letter-spacing: .2px;
  margin-bottom: 6px;
}

.ss2-plans-block {
  margin-bottom: 14px;
}

.ss2-plans {
  display: flex;
  gap: 8px;
}

.ss2-plans--single .ss2-plan {
  width: 100%;
}

.ss2-plan {
  flex: 1;
  padding: 12px;
  border-radius: var(--agr-radius-lg);
  border: 1.5px solid var(--agr-divider);
  background: var(--agr-white);
  cursor: pointer;
  text-align: left;
  transition: all var(--agr-transition);
  position: relative;
}

.ss2-plan.is-active {
  border-color: var(--agr-field);
  background: var(--agr-mint-soft);
  box-shadow: 0 0 0 1px var(--agr-field);
}

.ss2-plan-check {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--agr-field);
  color: var(--agr-white);
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}

.ss2-plan.is-active .ss2-plan-check {
  display: flex;
}

.ss2-plan-name {
  display: block;
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 800;
  color: var(--agr-text-primary);
}

.ss2-plan-meta {
  display: block;
  font-size: 11px;
  color: var(--agr-text-secondary);
  margin-top: 2px;
}

.ss2-amount-block {
  margin-bottom: 14px;
}

.ss2-amount-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ss2-rules {
  background: transparent;
  border: none;
  color: var(--agr-field);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.ss2-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
  margin-top: 6px;
}

.ss2-input-prefix {
  position: absolute;
  left: 14px;
  font-family: var(--agr-font-display);
  font-weight: 800;
  color: var(--agr-field);
  font-size: 15px;
}

.ss2-input {
  width: 100%;
  height: 48px;
  padding: 0 44px 0 42px;
  border: 1.5px solid var(--agr-divider);
  border-radius: var(--agr-radius-md);
  font-family: var(--agr-font-display);
  font-size: 16px;
  font-weight: 700;
  color: var(--agr-text-primary);
  outline: none;
  background: var(--agr-white);
  transition: border-color var(--agr-transition);
}

.ss2-input:focus {
  border-color: var(--agr-gold);
  box-shadow: 0 0 0 3px rgba(242, 183, 5, 0.22);
}

.ss2-input-edit {
  position: absolute;
  right: 12px;
  background: transparent;
  border: none;
  color: var(--agr-text-muted);
  font-size: 16px;
  cursor: pointer;
}

.ss2-chips {
  display: flex;
  gap: 8px;
  margin-top: 8px;
  overflow-x: auto;
  scrollbar-width: none;
}

.ss2-chips::-webkit-scrollbar {
  display: none;
}

.ss2-chip {
  flex-shrink: 0;
  padding: 6px 14px;
  border-radius: var(--agr-radius-full);
  background: var(--agr-mint);
  border: 1px solid rgba(20, 107, 46, 0.12);
  color: var(--agr-field);
  font-family: var(--agr-font-display);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--agr-transition);
}

.ss2-chip:hover, .ss2-chip.is-active {
  background: var(--agr-field);
  border-color: var(--agr-gold);
  color: var(--agr-white);
}

.sub-sheet-limits {
  font-size: 11px;
  color: var(--agr-text-muted);
  margin-top: 4px;
}

.ss2-range {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--agr-mint-soft);
  border-radius: var(--agr-radius-md);
  padding: 10px 14px;
  margin: 14px 0;
  font-size: 12px;
}

.ss2-range-side, .ss2-range-min, .ss2-range-max {
  font-weight: 700;
}

.ss2-range-hex {
  color: var(--agr-field);
}

.ss2-error, .ss2-error-txt {
  color: var(--agr-danger);
  font-size: 12px;
  font-weight: 600;
}

.ss2-summary {
  background: var(--agr-offwhite);
  border-radius: var(--agr-radius-lg);
  padding: 14px 16px;
  margin-bottom: 16px;
  border: 1px solid var(--agr-divider);
}

.ss2-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: 13px;
}

.ss2-summary-total {
  border-top: 1px solid var(--agr-divider);
  margin-top: 6px;
  padding-top: 10px;
  font-weight: 800;
  font-size: 15px;
}

.ss2-confirm, .ss2-cancel {
  width: 100%;
}

.ss2-accent {
  color: var(--agr-gold);
}

.ci-balance {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 16px;
  margin: 16px;
  box-shadow: var(--agr-shadow-sm);
  border: 1px solid var(--agr-divider);
}

.ci-balance-ico {
  width: 44px;
  height: 44px;
  border-radius: var(--agr-radius-md);
  background: var(--agr-mint);
  color: var(--agr-gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}

.ci-balance-lbl {
  font-size: 12px;
  color: var(--agr-text-secondary);
}

.ci-balance-val {
  font-family: var(--agr-font-display);
  font-size: 18px;
  font-weight: 800;
  color: var(--agr-forest);
}

.ci-tasks-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 16px 8px;
}

.ci-tasks-count {
  font-size: 12px;
  font-weight: 700;
  color: var(--agr-field);
  background: var(--agr-mint);
  padding: 4px 10px;
  border-radius: var(--agr-radius-full);
}

.ci-task {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 16px;
  margin: 0 16px 12px;
  box-shadow: var(--agr-shadow-sm);
  border: 1px solid var(--agr-divider);
}

.ci-task-top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.ci-task-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--agr-radius-md);
  background: var(--agr-mint);
  color: var(--agr-field);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.ci-task-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}

.ci-task-name {
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 800;
  color: var(--agr-text-primary);
}

.ci-task-check {
  color: var(--agr-success);
  font-size: 16px;
}

.ci-task-desc {
  font-size: 12px;
  color: var(--agr-text-secondary);
  margin-bottom: 12px;
}

.ci-task-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid var(--agr-divider);
}

.ci-task-reward {
  font-family: var(--agr-font-display);
  font-size: 14px;
  font-weight: 800;
  color: var(--agr-gold);
  display: flex;
  align-items: center;
  gap: 4px;
}

.ci-task-status {
  font-size: 11px;
  color: var(--agr-text-muted);
}

.ci-task-btn {
  padding: 8px 16px;
  border-radius: var(--agr-radius-full);
  font-family: var(--agr-font-display);
  font-size: 12px;
  font-weight: 700;
  border: none;
  cursor: pointer;
}

.ci-task-btn--go {
  background: var(--agr-gold);
  color: var(--agr-forest-deep);
  box-shadow: var(--agr-shadow-gold);
}

.ci-task-btn--done {
  background: var(--agr-divider);
  color: var(--agr-text-muted);
  cursor: not-allowed;
}

.bau-progress-card, .agr-map-board {
  background: radial-gradient(circle at 85% 20%, rgba(0, 240, 255, 0.25) 0%, transparent 60%),
              linear-gradient(150deg, #0A2540 0%, #0052D4 55%, #0077FF 100%);
  color: #FFFFFF;
  border-radius: var(--agr-radius-xl);
  padding: 18px;
  margin: 0 0 20px;
  box-shadow: 0 8px 24px rgba(10, 61, 31, 0.2);
  border: 1.5px solid rgba(242, 183, 5, 0.35);
  position: relative;
  overflow: hidden;
}

.agr-map-board-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.agr-map-board-title {
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 800;
  color: #FFE08A;
  display: flex;
  align-items: center;
  gap: 6px;
}

.agr-map-global-bar {
  margin: 10px 0 14px;
}

.agr-map-global-track {
  width: 100%;
  height: 10px;
  background: rgba(0, 0, 0, 0.35);
  border-radius: var(--agr-radius-full);
  overflow: hidden;
  border: 1px solid rgba(242, 183, 5, 0.25);
}

.agr-map-global-fill {
  height: 100%;
  background: linear-gradient(90deg, #146B2E 0%, #F2B705 50%, #FFE08A 100%);
  border-radius: var(--agr-radius-full);
  box-shadow: 0 0 12px rgba(242, 183, 5, 0.6);
  transition: width 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.bau-progress-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 8px;
}

.bau-progress-item {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--agr-radius-md);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
}

.bau-progress-item .lbl {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.78);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 5px;
}

.bau-progress-item .val {
  font-family: var(--agr-font-display);
  font-size: 18px;
  font-weight: 800;
  color: #FFE08A;
  margin-top: 2px;
}

.bau-progress-note {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.4;
  margin-top: 6px;
}

.agr-map-trail {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 10px 0 24px;
}

.agr-map-trail::before {
  content: '';
  position: absolute;
  top: 36px;
  bottom: 50px;
  left: 36px;
  width: 4px;
  background: repeating-linear-gradient(
    to bottom,
    #F2B705 0px,
    #F2B705 9px,
    transparent 9px,
    transparent 18px
  );
  border-radius: 4px;
  z-index: 1;
  opacity: 0.65;
}

.agr-map-node, .bau-card {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 14px;
  align-items: stretch;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin: 0 0 4px;
}

.agr-map-node-milestone {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  width: 72px;
  z-index: 2;
}

.agr-map-pin {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 800;
  background: #062312;
  border: 2.5px solid #F2B705;
  color: #FFE08A;
  box-shadow: 0 4px 12px rgba(10, 61, 31, 0.35);
  margin-bottom: 6px;
  transition: all var(--agr-transition);
}

.agr-map-node.is-done .agr-map-pin {
  background: #146B2E;
  border-color: #52C41A;
  color: #FFFFFF;
}

.agr-map-node.is-claimable .agr-map-pin {
  background: #D99A00;
  border-color: #FFFFFF;
  color: #062312;
  animation: agrMapPulse 1.8s infinite;
}

@keyframes agrMapPulse {
  0% { box-shadow: 0 0 0 0 rgba(242, 183, 5, 0.8); }
  70% { box-shadow: 0 0 0 10px rgba(242, 183, 5, 0); }
  100% { box-shadow: 0 0 0 0 rgba(242, 183, 5, 0); }
}

.agr-map-step-label {
  font-family: var(--agr-font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--agr-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 4px;
  text-align: center;
}

.bau-chest {
  width: 68px;
  height: 68px;
  flex-shrink: 0;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bau-chest img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.3));
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.agr-map-node:hover .bau-chest img {
  transform: scale(1.08) translateY(-3px);
}

.agr-map-node.is-claimable .bau-chest img {
  filter: drop-shadow(0 6px 18px rgba(242, 183, 5, 0.55));
}

.bau-chest.is-shaking {
  animation: agrChestShake 0.6s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

@keyframes agrChestShake {
  10%, 90% { transform: translate3d(-2px, 0, 0) rotate(-3deg); }
  20%, 80% { transform: translate3d(3px, 0, 0) rotate(4deg); }
  30%, 50%, 70% { transform: translate3d(-4px, 0, 0) rotate(-4deg); }
  40%, 60% { transform: translate3d(4px, 0, 0) rotate(3deg); }
}

.bau-chest.is-opening img {
  animation: agrChestBurst 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes agrChestBurst {
  0% { transform: scale(0.85); }
  50% { transform: scale(1.22); filter: drop-shadow(0 0 30px #FFD24D); }
  100% { transform: scale(1); }
}

.bau-burst {
  position: absolute;
  inset: -15px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 214, 89, 0.8) 0%, transparent 70%);
  animation: agrBurstFade 0.7s ease-out forwards;
  pointer-events: none;
  z-index: 5;
}

@keyframes agrBurstFade {
  0% { opacity: 1; transform: scale(0.4); }
  100% { opacity: 0; transform: scale(1.6); }
}

.agr-map-card {
  flex: 1;
  min-width: 0;
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 16px;
  box-shadow: 0 4px 18px rgba(10, 61, 31, 0.08);
  border: 1.5px solid rgba(242, 183, 5, 0.25);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all var(--agr-transition);
}

.agr-map-node.is-claimable .agr-map-card {
  border-color: #F2B705;
  box-shadow: 0 8px 24px rgba(242, 183, 5, 0.22);
  background-color: #FFFEF8;
}

.agr-map-node.is-done .agr-map-card {
  border-color: rgba(20, 107, 46, 0.3);
  background-color: #F8FCF9;
}

.bau-card-top {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 8px;
}

.bau-card-info {
  flex: 1;
  min-width: 0;
}

.bau-card-title {
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 800;
  color: var(--agr-text-primary);
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.bau-card-desc {
  font-size: 12px;
  color: var(--agr-text-secondary);
  margin: 3px 0 6px;
  line-height: 1.35;
}

.bau-kind {
  font-size: 11px;
  color: var(--agr-field);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.bau-kind--ref {
  color: var(--agr-field);
}

.bau-reward-tag {
  font-family: var(--agr-font-display);
  font-size: 16px;
  font-weight: 800;
  color: #D99A00;
  background: #FFF9E6;
  border: 1px solid rgba(217, 154, 0, 0.3);
  padding: 4px 10px;
  border-radius: var(--agr-radius-sm);
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(217, 154, 0, 0.12);
}

.bau-bar-wrap {
  margin: 8px 0 12px;
}

.bau-bar-track {
  width: 100%;
  height: 8px;
  background: #E8ECE9;
  border-radius: var(--agr-radius-full);
  overflow: hidden;
}

.bau-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #146B2E 0%, #F2B705 100%);
  border-radius: var(--agr-radius-full);
  transition: width 0.4s ease;
}

.bau-bar-meta {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--agr-text-muted);
  margin-top: 4px;
  font-weight: 600;
}

.bau-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: var(--agr-radius-sm);
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.bau-badge--done {
  background: #D1FAE5;
  color: #065F46;
  border: 1px solid rgba(6, 95, 70, 0.2);
}

.bau-badge--ready {
  background: #FEF3C7;
  color: #92400E;
  border: 1px solid rgba(146, 64, 14, 0.25);
  animation: agrMapPulse 2s infinite;
}

.bau-badge--lock {
  background: #F3F4F6;
  color: #6B7280;
  border: 1px solid #E5E7EB;
}

.bau-btn {
  width: 100%;
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 12px;
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 800;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: all var(--agr-transition);
}

.bau-btn--go {
  background: linear-gradient(145deg, #FFD659 0%, #F2B705 50%, #D99A00 100%);
  color: #062312;
  box-shadow: 0 4px 16px rgba(217, 154, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.4);
}

.bau-btn--go:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(217, 154, 0, 0.55);
}

.bau-btn--done {
  background: #E8F5E9;
  color: #146B2E;
  border: 1px solid rgba(20, 107, 46, 0.2);
  cursor: default;
}

.bau-btn--lock {
  background: #F5F7F5;
  color: #8A978F;
  border: 1px solid #E3E8E4;
  cursor: not-allowed;
}

.bau-info-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 18px;
  margin: 16px 0 0;
  border: 1.5px solid rgba(242, 183, 5, 0.25);
  box-shadow: 0 4px 18px rgba(10, 61, 31, 0.06);
}

.bau-info-card h3 {
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 800;
  color: #0A3D1F;
  display: flex;
  align-items: center;
  gap: 8px;
}

.bau-info-steps {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 14px;
}

.bau-info-step {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.bau-info-step-num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: linear-gradient(145deg, #0A3D1F 0%, #146B2E 100%);
  color: #FFE08A;
  font-family: var(--agr-font-display);
  font-weight: 800;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(10, 61, 31, 0.25);
}

.bau-info-step-text {
  font-size: 12px;
  color: var(--agr-text-secondary);
  line-height: 1.45;
}

.bau-pop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 200;
  padding: 20px;
}

.bau-pop-chest {
  width: 120px;
  height: 120px;
  margin: 0 auto 16px;
}

.bau-pop-headline {
  font-family: var(--agr-font-display);
  font-size: 20px;
  font-weight: 800;
  color: var(--agr-white);
  text-align: center;
}

.bau-pop-value {
  font-family: var(--agr-font-display);
  font-size: 32px;
  font-weight: 800;
  color: var(--agr-gold);
  text-align: center;
  margin: 8px 0;
}

.bau-pop-hint {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
}

.bau-pop-cta {
  margin-top: 18px;
  width: 100%;
}

.bau-pop-x {
  position: absolute;
  top: 16px;
  right: 16px;
  color: var(--agr-white);
  font-size: 20px;
  background: transparent;
  border: none;
  cursor: pointer;
}

.bau-pop-reveal {
  animation: agrPop 0.4s ease both;
}

.bau-float-ico, .bau-float-lbl {
  display: inline-flex;
}

.rl-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-md);
  margin-bottom: 6px;
  border: 1px solid var(--agr-divider);
}

.rl-row-l {
  display: flex;
  flex-direction: column;
}

.rl-row-l small {
  font-size: 11px;
  color: var(--agr-text-muted);
}

.rl-row-l b {
  font-size: 13px;
  color: var(--agr-text-primary);
}

.rl-row-amt {
  font-family: var(--agr-font-display);
  font-size: 14px;
  font-weight: 800;
  color: var(--agr-success);
}

.lot-summary-top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.lot-summary-avatar {
  width: 52px;
  height: 52px;
  border-radius: var(--agr-radius-md);
  object-fit: cover;
  background: var(--agr-mint);
}

.lot-kicker {
  font-size: 11px;
  font-weight: 700;
  color: var(--agr-field);
  text-transform: uppercase;
}

.lot-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 16px 0;
}

.lot-kpi-grid > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: #F8FBFE;
  border: 1px solid rgba(180, 215, 255, 0.65);
  border-radius: 14px;
  padding: 12px 14px;
}

.lot-kpi-grid > div span {
  font-size: 11px;
  font-weight: 700;
  color: #64748B;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.lot-kpi-grid > div strong {
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif);
  font-size: 16px;
  font-weight: 800;
  color: #0B2545;
}

.lot-kpi-grid > div strong.positive {
  color: #10B981;
}

.lot-kpi-grid > div strong.negative {
  color: #EF4444;
}

.lot-kpi-grid > div strong.highlight {
  color: #0077FF;
}

.lot-progress-row {
  margin: 16px 0 10px;
}

.lot-progress-track {
  width: 100%;
  height: 9px;
  background: #E2E8F0;
  border-radius: var(--agr-radius-full);
  overflow: hidden;
}

.lot-progress-track span, .lot-progress-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #0077FF 0%, #00D4FF 100%);
}

.lot-chart-action {
  margin-top: 14px;
}

.lot-chart-redeem-btn {
  width: 100%;
  padding: 14px 18px;
  border-radius: 14px;
  background: linear-gradient(180deg, #10B981 0%, #059669 100%);
  color: #FFFFFF;
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif);
  font-weight: 800;
  font-size: 14px;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35);
}

.lot-chart-bot-status {
  padding: 8px 12px;
  border-radius: var(--agr-radius-md);
  background: var(--agr-mint);
  color: var(--agr-field);
  font-size: 12px;
  font-weight: 600;
  margin: 10px 0;
}

.lot-empty-state {
  text-align: center;
  padding: 32px 16px;
  color: var(--agr-text-muted);
}

.lot-movement-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid var(--agr-divider);
  font-size: 13px;
}

.aff-ref-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-lg);
  margin-bottom: 8px;
  border: 1px solid var(--agr-divider);
}

.aff-ref-info {
  min-width: 0;
}

.aff-ref-phone {
  font-size: 13px;
  font-weight: 700;
  color: var(--agr-text-primary);
  font-variant-numeric: tabular-nums;
}

.aff-ref-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

.aff-ref-wa {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #25D366;
  color: var(--agr-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  text-decoration: none;
}

.aff-tier-item {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid var(--agr-divider);
  font-size: 13px;
}

.aff-tier-label {
  font-weight: 600;
  color: var(--agr-text-primary);
}

.aff-tier-pct {
  font-family: var(--agr-font-display);
  font-weight: 800;
  color: var(--agr-field);
}

.comm-form {
  display: flex;
  flex-direction: column;
}

.comm-field {
  margin-bottom: 14px;
}

.comm-input {
  width: 100%;
}

.comm-btn {
  width: 100%;
}

.comm-modal-hint {
  font-size: 12px;
  color: var(--agr-text-secondary);
  margin-bottom: 12px;
}

.mv-row, .movement-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-lg);
  margin-bottom: 8px;
  border: 1px solid var(--agr-divider);
  box-shadow: var(--agr-shadow-sm);
}

.mv-ico {
  width: 40px;
  height: 40px;
  border-radius: var(--agr-radius-md);
  background: var(--agr-mint);
  color: var(--agr-field);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.mv-body {
  flex: 1;
  min-width: 0;
}

.mv-label, .m-label {
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--agr-text-primary);
}

.mv-date, .m-date {
  font-size: 11px;
  color: var(--agr-text-muted);
  margin-top: 2px;
}

.mv-right {
  text-align: right;
  flex-shrink: 0;
}

.mv-amt, .m-amt {
  font-family: var(--agr-font-display);
  font-size: 14px;
  font-weight: 800;
  color: var(--agr-text-primary);
}

.mv-amt.pos, .mv-amt.credit {
  color: var(--agr-success);
}

.mv-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: var(--agr-radius-sm);
  background: var(--agr-mint);
  color: var(--agr-field);
  margin-top: 2px;
}

.faq-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 0;
}

.faq-item {
  background: var(--agr-white);
  border: 1px solid var(--agr-divider);
  border-radius: var(--agr-radius-md);
  overflow: hidden;
}

.faq-q {
  padding: 14px 16px;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--agr-text-primary);
  list-style: none;
}

.faq-q::-webkit-details-marker {
  display: none;
}

.faq-q::after {
  content: "\F282";
  font-family: "bootstrap-icons";
  color: var(--agr-field);
  transition: transform .2s ease;
}

.faq-item[open] .faq-q::after {
  transform: rotate(180deg);
}

.faq-a {
  padding: 0 16px 14px;
  font-size: 13px;
  color: var(--agr-text-secondary);
  line-height: 1.55;
}

.iaturbo-modal, .iaturbo-bal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.iaturbo-modal.is-open, .iaturbo-bal.is-open,
body.iaturbo-modal-open .iaturbo-modal, body.iaturbo-modal-open .iaturbo-bal {
  display: flex;
}

.iaturbo-modal-backdrop, .iaturbo-bal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 22, 12, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.iaturbo-modal-panel, .iaturbo-bal-frame, .iaturbo-bal-panel {
  position: relative;
  z-index: 2;
  background: var(--agr-white);
  border-radius: var(--agr-radius-2xl);
  padding: 24px;
  width: 100%;
  max-width: 400px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(242, 183, 5, 0.25);
  text-align: center;
}

.iaturbo-modal-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--agr-mint);
  color: var(--agr-field);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin: 0 auto 16px;
}

.iaturbo-modal-icon--error {
  background: var(--agr-danger-bg);
  color: var(--agr-danger);
}

.iaturbo-modal-icon--success {
  background: var(--agr-mint);
  color: var(--agr-success);
}

.iaturbo-modal-icon--warning {
  background: rgba(242, 183, 5, 0.2);
  color: var(--agr-amber);
}

.iaturbo-modal-title, .iaturbo-bal-title {
  font-family: var(--agr-font-display);
  font-size: 19px;
  font-weight: 800;
  color: var(--agr-text-primary);
  margin-bottom: 8px;
}

.iaturbo-modal-msg, .iaturbo-bal-msg, .iaturbo-modal-msg-text {
  font-size: 13px;
  color: var(--agr-text-secondary);
  line-height: 1.5;
  margin-bottom: 20px;
}

.iaturbo-modal-check {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  margin: 12px 0;
  cursor: pointer;
}

.iaturbo-modal-actions, .iaturbo-bal-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.iaturbo-modal-btn, .iaturbo-bal-btn {
  flex: 1;
  padding: 12px 18px;
  border-radius: var(--agr-radius-full);
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transition: all var(--agr-transition);
}

.iaturbo-modal-btn--ghost, .iaturbo-bal-btn--ghost {
  background: var(--agr-mint);
  color: var(--agr-field);
}

.iaturbo-modal-btn--primary, .iaturbo-bal-btn--primary {
  background: var(--agr-gold);
  color: var(--agr-forest-deep);
  box-shadow: var(--agr-shadow-gold);
}

.iaturbo-modal-btn--full {
  width: 100%;
}

.iaturbo-bal-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  margin: 0 auto 14px;
  position: relative;
}

.iaturbo-bal-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.iaturbo-bal-badge {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--agr-danger);
  color: var(--agr-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}

.iaturbo-bal-card {
  background: var(--agr-mint-soft);
  border-radius: var(--agr-radius-md);
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.iaturbo-bal-card-ico {
  color: var(--agr-field);
  font-size: 18px;
}

.iaturbo-bal-card-label {
  font-size: 12px;
  color: var(--agr-text-secondary);
}

.iaturbo-bal-card-val {
  font-family: var(--agr-font-display);
  font-size: 15px;
  font-weight: 800;
  color: var(--agr-forest);
}

.iaturbo-bal-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--agr-text-muted);
  margin-bottom: 18px;
}

.iaturbo-bal-hint-ico {
  color: var(--agr-field);
}

.iaturbo-toast, .ci-toast, .rl-toast, .bau-toast {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--agr-forest);
  color: var(--agr-white);
  padding: 12px 20px;
  border-radius: var(--agr-radius-full);
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  z-index: 300;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--agr-gold);
}

.iaturbo-toast--success {
  background: var(--agr-forest);
}

.iaturbo-toast--error {
  background: var(--agr-danger);
}

.pix-inline-box {
  background: var(--agr-mint-soft);
  border: 1.5px dashed var(--agr-field);
  border-radius: var(--agr-radius-md);
  padding: 14px;
  font-family: monospace;
  font-size: 12px;
  color: var(--agr-forest);
  word-break: break-all;
  user-select: all;
  margin-top: 10px;
}

.has-lang-switch {
  position: relative;
}

.trading-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.language-switch-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: var(--agr-radius-full);
  background: var(--agr-mint);
  border: 1px solid rgba(20, 107, 46, 0.15);
  color: var(--agr-field);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.language-switch-flag, .language-option-flag {
  font-size: 14px;
}

.language-switch-code {
  text-transform: uppercase;
}

.language-menu {
  position: absolute;
  top: 100%;
  right: 0;
  background: var(--agr-white);
  border-radius: var(--agr-radius-md);
  box-shadow: var(--agr-shadow-md);
  border: 1px solid var(--agr-divider);
  padding: 6px;
  display: none;
  z-index: 100;
}

.language-menu.is-open {
  display: block;
}

.language-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: var(--agr-radius-sm);
  color: var(--agr-text-primary);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
}

.language-option:hover {
  background: var(--agr-mint-soft);
}

.iaturbo-pay-modal, .iaturbo-pay-loading {
  position: fixed;
  inset: 0;
  z-index: 210;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.iaturbo-pay-modal.is-open, .iaturbo-pay-loading.is-open,
body.iaturbo-pay-open #iaturboPayModal, body.iaturbo-pay-open #iaturboPayLoading {
  display: flex;
}

.iaturbo-pay-modal-backdrop, .iaturbo-pay-loading-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 22, 12, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.iaturbo-pay-modal-panel, .iaturbo-pay-loading-card {
  position: relative;
  z-index: 2;
  background: var(--agr-white);
  border-radius: var(--agr-radius-2xl);
  padding: 24px;
  width: 100%;
  max-width: 400px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(242, 183, 5, 0.25);
  text-align: center;
}

.iaturbo-pay-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--agr-mint);
  border: none;
  color: var(--agr-field);
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.iaturbo-pay-title {
  font-family: var(--agr-font-display);
  font-size: 18px;
  font-weight: 800;
  color: var(--agr-forest);
  margin-bottom: 4px;
}

.iaturbo-pay-amount {
  font-family: var(--agr-font-display);
  font-size: 26px;
  font-weight: 800;
  color: var(--agr-field);
  margin-bottom: 14px;
}

.iaturbo-pay-qr-wrap {
  background: var(--agr-offwhite);
  border: 1px solid var(--agr-divider);
  border-radius: var(--agr-radius-xl);
  padding: 16px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
}

.iaturbo-pay-qr-mount {
  display: flex;
  align-items: center;
  justify-content: center;
}

.iaturbo-pay-qr-mount img, .iaturbo-pay-qr-mount canvas {
  max-width: 180px;
  max-height: 180px;
  border-radius: var(--agr-radius-sm);
}

.iaturbo-pay-hint {
  font-size: 12px;
  color: var(--agr-text-secondary);
  margin-bottom: 12px;
}

.iaturbo-pay-copy-row {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}

.iaturbo-pay-copy-input {
  flex: 1;
  height: 42px;
  padding: 0 12px;
  background: var(--agr-mint-soft);
  border: 1px solid var(--agr-divider);
  border-radius: var(--agr-radius-md);
  font-size: 12px;
  color: var(--agr-text-primary);
  font-family: monospace;
}

.iaturbo-pay-copy-btn {
  padding: 0 16px;
  height: 42px;
  border-radius: var(--agr-radius-md);
  background: var(--agr-field);
  color: var(--agr-white);
  border: none;
  font-family: var(--agr-font-display);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
}

.iaturbo-pay-status {
  font-size: 12px;
  color: var(--agr-text-muted);
  margin-bottom: 16px;
}

.iaturbo-pay-done-btn {
  width: 100%;
  padding: 12px;
  border-radius: var(--agr-radius-full);
  background: var(--agr-gold);
  color: var(--agr-forest-deep);
  border: none;
  font-family: var(--agr-font-display);
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: var(--agr-shadow-gold);
}

.iaturbo-pay-spinner {
  width: 44px;
  height: 44px;
  border: 4px solid var(--agr-mint);
  border-top-color: var(--agr-field);
  border-radius: 50%;
  animation: agrSpin 0.8s linear infinite;
  margin: 0 auto 14px;
}

.iaturbo-pay-loading-title {
  font-family: var(--agr-font-display);
  font-size: 16px;
  font-weight: 800;
  color: var(--agr-text-primary);
}

.iaturbo-pay-loading-sub {
  font-size: 12px;
  color: var(--agr-text-muted);
  margin-top: 4px;
}

@keyframes agrSpin {
  to { transform: rotate(360deg); }
}

.ticker-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--agr-text-secondary);
}

.ticker-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--agr-success);
}

.ticker-id {
  font-weight: 700;
  color: var(--agr-forest);
}

.ranking-intro-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: var(--agr-radius-full);
  background: rgba(242, 183, 5, 0.2);
  color: var(--agr-amber);
  font-size: 11px;
  font-weight: 800;
}

.ranking-intro-fire, .ranking-intro-sparks {
  font-size: 13px;
}

.trader-status-panel {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 20px;
  position: relative;
  z-index: 2;
}

.trader-status-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}

.trader-status-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
}

.trader-status-title {
  font-family: var(--agr-font-display);
  font-size: 17px;
  font-weight: 800;
}

.trader-status-copy {
  font-size: 13px;
  color: var(--agr-text-secondary);
}

.trader-status-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: 14px 0;
}

.trader-status-next {
  width: 100%;
}

.trader-tier-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.trade-transaction-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 16px;
  margin-bottom: 12px;
  border: 1px solid var(--agr-divider);
  box-shadow: var(--agr-shadow-sm);
}

.trade-transaction-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.trade-transaction-detail, .position-details-full {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 10px;
  border-top: 1px solid var(--agr-divider);
  margin-top: 10px;
}

.live-trader-card {
  background: var(--agr-white);
  border-radius: var(--agr-radius-xl);
  padding: 16px;
  margin-bottom: 12px;
  border: 1px solid var(--agr-divider);
  box-shadow: var(--agr-shadow-sm);
}

.live-trader-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.live-trader-main {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 10px 0;
}

.live-trader-sides, .live-trader-stats {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
}

.buy {
  color: var(--agr-success);
  font-weight: 700;
}

.sell {
  color: var(--agr-danger);
  font-weight: 700;
}

.trade-risk-preview-card {
  background: var(--agr-mint-soft);
  border-radius: var(--agr-radius-md);
  padding: 12px;
  margin: 10px 0;
}

.position-item {
  display: flex;
  flex-direction: column;
  padding: 12px;
  background: var(--agr-white);
  border-radius: var(--agr-radius-md);
  border: 1px solid var(--agr-divider);
  margin-bottom: 8px;
}

.position-info, .position-live, .position-details {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
}

.position-type {
  font-weight: 700;
  text-transform: uppercase;
}

.position-progress {
  width: 100%;
  height: 6px;
  background: var(--agr-divider);
  border-radius: var(--agr-radius-full);
  margin: 6px 0;
  overflow: hidden;
}

.notification-icon {
  font-size: 18px;
  color: var(--agr-field);
}

.notification-text {
  font-size: 13px;
  color: var(--agr-text-primary);
}

.is-hidden {
  display: none !important;
}

.is-loading {
  opacity: 0.6;
  pointer-events: none;
}

.is-opening {
  animation: agrPulse 0.4s ease infinite;
}

.is-shaking, .shake {
  animation: agrShake 0.4s ease-in-out;
}

.show {
  display: block !important;
}

.voucher-success--play {
  animation: agrPop 0.5s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.lbl {
  font-size: 11px;
  color: var(--agr-text-muted);
}

.val {
  font-family: var(--agr-font-display);
  font-weight: 700;
  color: var(--agr-text-primary);
}

body.iaturbo-sheet-open {
  overflow: hidden;
}

@keyframes agrPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

@keyframes agrShake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-4px); }
  40%, 80% { transform: translateX(4px); }
}

@keyframes agrPop {
  0% { transform: scale(0.8); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

.agr-bento-hero-tile {
  background: radial-gradient(circle at 85% 60%, rgba(242, 183, 5, 0.18) 0%, rgba(10, 61, 31, 0) 65%),
              linear-gradient(135deg, #052110 0%, #0A3D1F 55%, #146B2E 100%);
  border-radius: 26px;
  padding: 20px;
  color: #FFFFFF;
  box-shadow: 0 14px 34px rgba(6, 35, 18, 0.28);
  border: 1px solid rgba(242, 183, 5, 0.38);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: stretch;
}

.agr-bento-hero-main {
  position: relative;
  z-index: 2;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.agr-bento-hero-figure {
  position: absolute;
  right: -8px;
  bottom: -4px;
  width: 136px;
  height: 136px;
  z-index: 1;
  pointer-events: none;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.agr-bento-hero-figure img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom right;
  filter: drop-shadow(-8px 10px 18px rgba(0, 0, 0, 0.45));
}

.agr-bento-mini-themed {
  position: relative;
  overflow: hidden;
}

.agr-bento-mini-watermark {
  position: absolute;
  right: -6px;
  bottom: -6px;
  width: 48px;
  height: 48px;
  opacity: 0.18;
  pointer-events: none;
  object-fit: contain;
}

.agr-editorial-hero {
  display: grid;
  grid-template-columns: 1fr 108px;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}

.agr-editorial-figure {
  width: 108px;
  height: 108px;
  border-radius: 20px;
  background: radial-gradient(circle, rgba(20, 107, 46, 0.12) 0%, rgba(242, 183, 5, 0.08) 70%, transparent 100%);
  border: 1px solid rgba(20, 107, 46, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  flex-shrink: 0;
}

.agr-editorial-figure img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(10, 61, 31, 0.2));
}

.agr-wallet-balance-box {
  background: radial-gradient(circle at 88% 30%, rgba(242, 183, 5, 0.15) 0%, transparent 60%),
              rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(242, 183, 5, 0.32);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 24px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.agr-wallet-art-dock {
  position: absolute;
  right: 10px;
  top: 14px;
  width: 96px;
  height: 96px;
  pointer-events: none;
  z-index: 1;
}

.agr-wallet-art-dock img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.45));
}

.agr-auth-hero-stage {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  position: relative;
  z-index: 2;
  margin-top: auto;
  margin-bottom: 12px;
}

.agr-auth-hero-copy {
  flex: 1;
  min-width: 0;
}

.agr-auth-hero-mascot {
  width: 120px;
  height: 100px;
  flex-shrink: 0;
  pointer-events: none;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.agr-auth-hero-mascot img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.45));
}

@media (min-width: 400px) {
  .agr-bento-hero-figure {
    width: 150px;
    height: 150px;
    right: -4px;
  }
  .agr-editorial-hero {
    grid-template-columns: 1fr 120px;
  }
  .agr-editorial-figure {
    width: 120px;
    height: 120px;
  }
  .agr-auth-hero-mascot {
    width: 140px;
    height: 110px;
  }
}

.agr-live-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #062312;
  border-bottom: 1px solid rgba(242, 183, 5, 0.25);
  padding: 8px 16px;
  color: #FFFFFF;
  font-size: 11.5px;
  overflow: hidden;
}

.agr-live-pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22C55E;
  box-shadow: 0 0 8px #22C55E;
  flex-shrink: 0;
}

.agr-live-strip-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: rgba(255, 255, 255, 0.88);
}

.agr-live-strip-text strong {
  color: #FFE08A;
}

.agr-crops-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0 16px;
}

.agr-crop-card {
  background: rgba(4, 16, 38, 0.92) !important;
  border: 1px solid rgba(0, 229, 255, 0.3) !important;
  border-radius: 20px !important;
  padding: 16px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.65), 0 0 16px rgba(0, 123, 255, 0.15) !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  text-decoration: none;
  color: #FFFFFF !important;
}

.agr-crop-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(0, 229, 255, 0.25) !important;
  border-color: #00E5FF !important;
}

.agr-crop-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.agr-crop-card-info {
  display: flex;
  gap: 12px;
  align-items: center;
}

.agr-crop-card-icon {
  width: 48px !important;
  height: 48px !important;
  border-radius: 14px !important;
  background: #EEF6FC !important;
  border: 1.5px solid #BEE3F8 !important;
  box-shadow: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.agr-crop-card-icon img {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain !important;
}

.agr-crop-card-title {
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #0B2545 !important;
  margin: 0;
}

.agr-crop-card-sub {
  font-size: 11px;
  color: #5A738E !important;
  margin-top: 2px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.agr-crop-card-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  background: #F8FBFE !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(180, 215, 255, 0.7) !important;
}

.agr-crop-card-metric {
  text-align: center;
}

.agr-crop-card-metric-val {
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #0077FF !important;
  display: block;
}

.agr-crop-card-metric-val.gold {
  color: #00A86B !important;
}

.agr-crop-card-metric-val.dark {
  color: #0B2545 !important;
}

.agr-crop-card-metric-lbl {
  font-size: 10px;
  color: #5A738E !important;
  font-weight: 600;
  text-transform: uppercase;
}

.agr-crop-card-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.agr-crop-card-price {
  font-size: 12px;
  color: #5A738E !important;
}

.agr-crop-card-price strong {
  font-size: 16px;
  color: #0B2545 !important;
  font-family: var(--mp-font-hud, 'Plus Jakarta Sans', sans-serif) !important;
  display: block;
}

.agr-footer-institutional {
  background: #062312;
  color: #FFFFFF;
  padding: 28px 20px 100px;
  margin-top: 32px;
  border-top: 2px solid rgba(242, 183, 5, 0.35);
  text-align: center;
}

.agr-footer-seals {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 16px 0;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.agr-footer-seal-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
}

.agr-footer-seal-item i {
  color: #FFE08A;
  font-size: 14px;
}

.agr-display-num,
.sk-stat-val,
.sk-dt-spec-val,
.iv3-price-main,
.wl-sum strong,
.agr-crop-card-metric-val {
  font-variant-numeric: tabular-nums;
}

.wl-quick-chip {
  background: #FFFFFF !important;
  border: 1px solid #CFE2F4 !important;
  border-radius: 999px !important;
  padding: 8px 14px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #0B2545 !important;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 6px rgba(0, 80, 160, 0.05) !important;
}

.wl-quick-chip:hover,
.wl-quick-chip.active {
  background: linear-gradient(180deg, #0099FF 0%, #0077FF 100%) !important;
  border-color: #0077FF !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(0, 120, 240, 0.35) !important;
  transform: translateY(-1px);
}

.agr-page-pad-bottom {
  padding-bottom: 96px;
}