:root {
  --manager-blue: #2785ff;
  --manager-teal: #1ec7ae;
  --manager-green: #36c875;
  --manager-gold: #d89a2b;
  --manager-orange: #d06f39;
  --manager-purple: #865dea;
}

.manager-home-shell {
  width: 100%;
  margin-bottom: 18px;
}

.manager-home-hero {
  margin-bottom: 12px;
  padding: 13px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(19, 21, 27, .98), rgba(11, 12, 16, .98));
  box-shadow: 0 14px 42px rgba(0, 0, 0, .20);
}

.manager-home-brand-row,
.manager-home-user-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.manager-home-brand-row {
  padding: 2px 2px 11px;
}

.manager-home-brand-row > div:first-child {
  min-width: 0;
}

.manager-home-brand-row strong,
.manager-home-brand-row span {
  display: block;
}

.manager-home-brand-row strong {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .2px;
}

.manager-home-brand-row span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  direction: ltr;
  text-align: right;
}

.manager-home-brand-chip {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(239, 48, 56, .38);
  border-radius: 10px;
  background: rgba(239, 48, 56, .10);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .8px;
}

.manager-home-user-card {
  min-height: 72px;
  padding: 12px 13px;
  border: 1px solid rgba(239, 48, 56, .25);
  border-right: 3px solid var(--red);
  border-radius: 14px;
  background:
    linear-gradient(90deg, rgba(239, 48, 56, .06), rgba(255, 255, 255, .025));
}

.manager-home-user-card span,
.manager-home-user-card strong {
  display: block;
}

.manager-home-user-card span {
  color: var(--muted);
  font-size: 10px;
}

.manager-home-user-card strong {
  margin-top: 5px;
  font-size: 17px;
  line-height: 1.35;
}

.manager-home-role {
  max-width: 46%;
  direction: ltr;
  unicode-bidi: isolate;
  color: #d6dae1;
  font-size: 10px;
  text-align: left;
  overflow-wrap: anywhere;
}

.manager-home-status-title {
  margin: 12px 2px 7px;
  color: #c7cbd2;
  font-size: 10px;
}

.manager-home-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.manager-home-status-grid > div {
  min-width: 0;
  padding: 9px 5px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 11px;
  background: rgba(255, 255, 255, .025);
  text-align: center;
}

.manager-home-status-grid strong,
.manager-home-status-grid span {
  display: block;
}

.manager-home-status-grid strong {
  font-size: 15px;
  line-height: 1.25;
}

.manager-home-status-grid span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.4;
}

.manager-home-status-grid .status-red { border-bottom-color: rgba(239, 48, 56, .55); }
.manager-home-status-grid .status-blue { border-bottom-color: rgba(39, 133, 255, .55); }
.manager-home-status-grid .status-green { border-bottom-color: rgba(54, 200, 117, .55); }
.manager-home-status-grid .status-gold { border-bottom-color: rgba(216, 154, 43, .55); }

.manager-home-sections {
  display: grid;
  gap: 8px;
}

.manager-home-section {
  --tone: #7d8795;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--tone) 30%, rgba(255, 255, 255, .08));
  border-radius: 15px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--tone) 7%, transparent), rgba(255, 255, 255, .018));
}

.manager-home-section.tone-blue { --tone: var(--manager-blue); }
.manager-home-section.tone-teal { --tone: var(--manager-teal); }
.manager-home-section.tone-green { --tone: var(--manager-green); }
.manager-home-section.tone-gold { --tone: var(--manager-gold); }
.manager-home-section.tone-orange { --tone: var(--manager-orange); }
.manager-home-section.tone-purple { --tone: var(--manager-purple); }

.manager-home-section > summary {
  min-height: 66px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto 22px;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  list-style: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.manager-home-section > summary::-webkit-details-marker { display: none; }

.manager-home-section-icon {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--tone) 45%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--tone) 12%, transparent);
  color: var(--tone);
  font-size: 15px;
  font-weight: 900;
}

.manager-home-section-copy {
  min-width: 0;
}

.manager-home-section-copy strong,
.manager-home-section-copy small {
  display: block;
}

.manager-home-section-copy strong {
  font-size: 14px;
  font-weight: 800;
}

.manager-home-section-copy small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
}

.manager-home-section-badge {
  min-width: 23px;
  min-height: 23px;
  display: grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--tone) 12%, transparent);
  color: var(--tone);
  font-size: 10px;
  font-weight: 800;
}

.manager-home-section-badge:empty { display: none; }

.manager-home-section-chevron {
  color: var(--muted);
  font-size: 17px;
  transition: transform .18s ease;
}

.manager-home-section[open] .manager-home-section-chevron {
  transform: rotate(180deg);
}

.manager-home-section-body {
  padding: 0 10px 11px;
  border-top: 1px solid rgba(255, 255, 255, .045);
}

.management-home-embedded,
.manager-home-access-card {
  margin: 8px 0 0;
  padding: 4px 0 0;
  border: 0;
  background: transparent;
  overflow: visible;
}

.management-home-embedded > .management-module-head,
.manager-home-access-card > .management-module-head {
  display: none;
}

.manager-home-local-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 6px 0 9px;
}

.manager-home-local-actions button,
.manager-home-action-button {
  width: 100%;
  min-height: 47px;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .04) !important;
  color: #f5f6f8 !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  cursor: pointer;
}

.manager-home-local-actions button.active {
  border-color: color-mix(in srgb, var(--tone, var(--manager-blue)) 55%, rgba(255,255,255,.10)) !important;
  background: rgba(39, 133, 255, .10) !important;
}

#managerSessionsBody .manager-home-action-button {
  border-color: rgba(30, 199, 174, .28) !important;
  background: rgba(30, 199, 174, .07) !important;
}

#managerFinanceBody .manager-home-action-button {
  border-color: rgba(216, 154, 43, .30) !important;
  background: rgba(216, 154, 43, .07) !important;
}

.manager-home-section .management-create-form {
  margin: 8px 0 10px;
  padding: 11px;
  border-radius: 13px;
  background: rgba(255, 255, 255, .025);
}

.manager-home-section .management-list {
  margin-top: 10px;
}

.manager-home-section .management-create-button {
  min-height: 44px;
  font-size: 11px;
}

.manager-home-nested-details {
  margin: 7px 0 0;
  padding: 0;
  border: 1px solid rgba(54, 200, 117, .18);
  border-radius: 12px;
  background: rgba(54, 200, 117, .035);
}

.manager-home-nested-details > summary {
  padding: 13px;
  cursor: pointer;
  list-style-position: inside;
}

.manager-home-nested-details > p,
.manager-home-nested-details > form,
.manager-home-nested-details > div {
  margin-left: 10px;
  margin-right: 10px;
}

.manager-home-section-hint {
  margin-top: 8px;
  padding: 10px 11px;
  border: 1px dashed rgba(255, 255, 255, .08);
  border-radius: 11px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.7;
}

.manager-home-access-card {
  padding: 10px;
  border: 1px solid rgba(134, 93, 234, .16);
  border-radius: 12px;
  background: rgba(134, 93, 234, .025);
}

.manager-home-access-card + .manager-home-access-card {
  margin-top: 9px;
}

.manager-home-access-card .management-module-head {
  display: flex;
}

.manager-home-access-card .management-module-head h1 {
  font-size: 14px;
}

.manager-home-access-card .management-module-head p {
  font-size: 9px;
}

.manager-home-section input,
.manager-home-section select,
.manager-home-section textarea {
  font-size: 12px;
}

/* Compact contextual back navigation. The app scroll container already starts
   below Telegram's content safe area; sticky top:0 therefore stays below the
   Telegram Close/menu chrome instead of sitting underneath it. */
.atlet-context-back-bar,
.atlet-overlay-context-back {
  position: sticky;
  top: 0;
  z-index: 90;
  display: flex;
  justify-content: flex-start;
  padding: 5px 0 8px;
  background:
    linear-gradient(180deg, rgba(8, 9, 11, .98) 0%, rgba(8, 9, 11, .90) 70%, rgba(8, 9, 11, 0) 100%);
}

.atlet-context-back-button {
  width: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 999px !important;
  background: rgba(19, 21, 27, .94) !important;
  color: #f7f8fa !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .18);
  font: inherit !important;
  line-height: 1 !important;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.atlet-context-back-button:active {
  transform: scale(.97);
  background: rgba(31, 34, 41, .98) !important;
}

.atlet-context-back-arrow {
  display: inline-block;
  font-size: 14px;
  line-height: 1;
}

.atlet-native-back-replaced {
  display: none !important;
}

.atlet-overlay-context-back {
  z-index: 12;
  margin: -2px 0 2px;
  background:
    linear-gradient(180deg, rgba(16, 17, 20, 1) 0%, rgba(16, 17, 20, .94) 78%, rgba(16, 17, 20, 0) 100%);
}

/* Fixed overlays do not inherit body padding. Limit their height with the
   Telegram safe-area variables so their top controls stay below Telegram UI. */
#financeSummaryOverlay .finance-summary-sheet,
#bulkAttendanceOverlay .bulk-attendance-sheet {
  max-height: calc(
    100dvh
    - 12px
    - max(env(safe-area-inset-top, 0px), var(--tg-safe-area-inset-top, 0px))
    - var(--tg-content-safe-area-inset-top, 64px)
  ) !important;
}

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

  .manager-home-role {
    max-width: 40%;
    font-size: 9px;
  }

  .atlet-context-back-button {
    min-height: 32px !important;
    padding: 0 10px !important;
    font-size: 10px !important;
  }
}