/* Guild Manager — approved A2 design system. Loaded after guild-manager-v469.css. */
:root {
  --a2-bg: var(--gm-ink-900);
  --a2-surface: var(--gm-ink-800);
  --a2-surface-2: var(--gm-ink-750);
  --a2-line: rgb(var(--gm-ink-300-rgb) / 0.13);
  --a2-text: var(--gm-ink-50);
  --a2-muted: var(--gm-ink-300);
  --a2-accent: var(--gm-violet-400);
  --a2-accent-2: var(--gm-violet-400);
  --a2-accent-soft: rgb(var(--gm-violet-400-rgb) / 0.12);
  --a2-warning: var(--gm-gold-500);
  --a2-success: var(--gm-green-500);
  --a2-danger: var(--gm-red-500);
  --a2-gutter: 16px;
  --a2-nav-height: 72px;
}

/* Personal account home, participant scope and entertainment. */
.home-account-greeting{display:grid;gap:4px;margin:4px 0 16px}.home-account-greeting span{color:var(--a2-accent-2);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.home-account-greeting h2{margin:0;font-size:24px}.home-account-greeting p{margin:0;color:var(--a2-muted)}.home-account-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}.home-account-card .profile-copy{min-width:0}.home-account-balance{display:grid;gap:2px;text-align:right}.home-account-balance small{color:var(--a2-muted)}.home-account-balance strong{color:var(--a2-accent-2);font-size:18px;white-space:nowrap}.home-account-status{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.home-account-status>div{display:grid;gap:5px;min-height:74px;padding:12px}.home-account-status small{color:var(--a2-muted);font-size:11px}.home-account-status strong{font-size:14px;overflow-wrap:anywhere}.home-actions-heading{margin-top:22px}.home-account-actions .quick-card{min-height:90px}.home-account-actions .quick-copy{display:grid;gap:3px}.home-account-actions .quick-copy small{color:var(--a2-muted)}.home-account-note{display:flex;align-items:flex-start;gap:12px;margin-top:12px;padding:15px}.home-account-note>span{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:12px;background:var(--a2-accent-soft);color:var(--a2-accent-2);font-size:22px}.home-account-note p{margin:4px 0 0;color:var(--a2-muted);line-height:1.45}.participant-community-picker{display:grid;gap:7px;margin-bottom:12px}.participant-community-picker label{color:var(--a2-muted);font-size:12px;font-weight:700}.participant-community-picker select{width:100%;min-height:50px;padding:0 14px;border:1px solid var(--a2-line);border-radius:12px;background:var(--a2-surface);color:var(--a2-text);font:inherit}.entertainment-page{min-height:65vh}.entertainment-empty{display:grid;place-items:center;align-content:center;gap:8px;min-height:55vh;padding:28px;text-align:center}.entertainment-empty>span{display:grid;place-items:center;width:78px;height:78px;border:1px solid rgb(var(--gm-ink-50-rgb) / 0.16);border-radius:24px;background:var(--a2-accent-soft);font-size:36px}.entertainment-empty h2,.entertainment-empty p{margin:0}.entertainment-empty p{max-width:310px;color:var(--a2-muted);line-height:1.5}@media(max-width:460px){.home-account-card{grid-template-columns:auto 1fr}.home-account-balance{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-top:10px;border-top:1px solid var(--a2-line);text-align:left}.home-account-status{grid-template-columns:1fr}.home-account-status>div{min-height:auto}.home-account-actions{grid-template-columns:1fr 1fr}}

* { box-sizing: border-box; }
html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
html, body {
  margin: 0;
  background: var(--a2-bg);
  color: var(--a2-text);
  font-family: var(--gm-font-ui);
  -webkit-font-smoothing: antialiased;
}
body { padding: 0 0 calc(var(--a2-nav-height) + env(safe-area-inset-bottom)); }
button, input, textarea, select { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }

.app-shell {
  width: min(100%, 560px);
  max-width: 560px;
  min-width: 0;
  margin: 0 auto;
  padding: 0 0 24px;
  background: var(--a2-bg);
}
.page-content, .page-content > *, #home-page, #community-page, #tickets-page, #more-page {
  width: 100%; max-width: 100%; min-width: 0;
}
.page-content { display: block; padding: 0; }
.hidden { display: none !important; }
.card { box-shadow: none; }

/* Brand bar */
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 72px;
  padding: 11px var(--a2-gutter);
  border-bottom: 1px solid var(--a2-line);
  background: rgb(var(--gm-ink-900-rgb) / 0.96);
}
.brand { display: flex; align-items: center; min-width: 0; gap: 12px; }
.brand .logo {
  display: grid;
  place-items: center;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.11);
  border-radius: 12px;
  background: linear-gradient(145deg, var(--gm-ink-750), var(--gm-ink-800));
  color: var(--a2-accent-2);
  box-shadow: none;
  font-size: 18px;
  font-style: italic;
  font-weight:700;
  letter-spacing: -.04em;
}
.brand h1, .brand p { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand h1 { font-size: 17px; line-height: 1.25; font-weight:700; letter-spacing: -.01em; }
.brand p { margin-top: 3px; color: var(--a2-muted); font-size: 12px; line-height: 1.25; }
.profile-settings-button {
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--gm-ink-300);
  font-size: 0;
}
.profile-settings-button .a2-icon { width: 21px; height: 21px; }

/* Shared typography and rows */
.eyebrow { display: none; }
.section { margin: 0; }
.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 50px;
  margin: 0;
  padding: 14px var(--a2-gutter) 10px;
  border: 0;
}
.section-heading h2 { margin: 0; font-size: 15px; line-height: 1.3; font-weight:700; }
.counter {
  display: inline-flex;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--a2-accent);
  font-size: 14px;
  font-weight:700;
}
.a2-icon { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Home */
#home-page .profile-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 96px;
  margin: 0;
  padding: 16px var(--a2-gutter);
  border: 0;
  border-bottom: 1px solid var(--a2-line);
  border-radius: 0;
  background: transparent;
}
#home-page .profile-card::after { content: "›"; justify-self: end; color: var(--gm-ink-300); font-size: 24px; line-height: 1; }
.profile-card .avatar {
  width: 56px;
  height: 56px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.5);
  border-radius: 50%;
  background: var(--a2-surface-2);
  box-shadow: none;
}
.profile-copy { min-width: 0; }
.profile-copy h2 { margin: 0; overflow: hidden; color: var(--a2-text); font-size: 17px; line-height: 1.22; font-weight:700; text-overflow: ellipsis; white-space: nowrap; }
.profile-copy p { margin: 2px 0 0; overflow: hidden; color: var(--a2-accent); font-size: 12px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.role-badge { display: block; width: max-content; max-width: 100%; margin-top: 5px; padding: 0; border: 0; background: transparent; color: var(--a2-muted); font-size: 11px; line-height: 1.3; font-weight:500; }
.staff-rating-inline { max-width: 100%; margin-top: 6px; padding: 4px 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.chat-rating-home {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) auto 14px;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 11px;
  width: 100%;
  min-height: 72px;
  margin: 0;
  padding: 12px var(--a2-gutter);
  border: 0;
  border-bottom: 1px solid var(--a2-line);
  border-radius: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}
.chat-rating-home::before { content: ""; grid-column: 1; grid-row: 1 / 3; width: 38px; height: 38px; border-radius: 12px; background: var(--a2-accent-soft) center/20px 20px no-repeat var(--a2-rating-icon); color: var(--a2-accent); }
.chat-rating-home::after { content: "›"; grid-column: 4; grid-row: 1 / 3; justify-self: end; color: var(--gm-ink-400); font-size: 22px; }
.chat-rating-home-head { display: contents; }
.chat-rating-home-head span { grid-column: 2; grid-row: 1; min-width: 0; overflow: hidden; font-size: 13px; line-height: 1.3; font-weight:700; text-overflow: ellipsis; white-space: nowrap; }
.chat-rating-home-head strong { grid-column: 3; grid-row: 1 / 3; align-self: center; color: var(--a2-accent); font-size: 12px; line-height: 1.3; font-weight:700; white-space: nowrap; }
.chat-rating-home small { grid-column: 2; grid-row: 2; margin-top: 2px; overflow: hidden; color: var(--a2-muted); font-size: 10px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }

.quick-grid {
  display: block;
  width: 100%;
  margin: 8px 0 0;
  padding: 0 var(--a2-gutter);
  border-top: 1px solid var(--a2-line);
  border-bottom: 1px solid var(--a2-line);
  background: rgb(var(--gm-ink-800-rgb) / 0.26);
}
.quick-card {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) minmax(0,auto) 14px;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-width: 0;
  min-height: 62px;
  margin: 0;
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid var(--a2-line);
  border-radius: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}
.quick-card:last-child { border-bottom: 0; }
.quick-icon { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.08); border-radius: 12px; background: var(--a2-accent-soft); color: var(--a2-accent); font-size: 0; }
.quick-icon .a2-icon { width: 19px; height: 19px; }
.quick-copy { display: contents; }
.quick-copy small { grid-column: 2; min-width: 0; overflow: hidden; color: var(--a2-text); font-size: 12px; font-weight:600; text-overflow: ellipsis; white-space: nowrap; }
.quick-copy strong { grid-column: 3; max-width: 130px; overflow: hidden; color: var(--a2-muted); font-size: 12px; font-weight:500; text-overflow: ellipsis; white-space: nowrap; }
.quick-card::after { content: "›"; grid-column: 4; justify-self: end; color: var(--gm-ink-400); font-size: 22px; line-height: 1; }

.community-list { display: block; padding: 0 var(--a2-gutter); }
.community { display: flex; align-items: center; gap: 11px; min-height: 64px; margin: 0; padding: 10px 0; border: 0; border-bottom: 1px solid var(--a2-line); border-radius: 0; background: transparent; }
.community > * { min-width: 0; }
.community-action { flex: 0 0 auto; padding: 5px 0; border: 0; background: transparent; color: var(--a2-accent); font-size: 11px; font-weight:600; }

/* Members */
#community-page > .text-button { display: block; margin: 0 auto; padding: 10px 16px; color: var(--a2-accent); }
.community-hero { display: flex; align-items: center; gap: 12px; margin: 0; padding: 15px var(--a2-gutter); border: 0; border-bottom: 1px solid var(--a2-line); border-radius: 0; background: transparent; }
.community-mark { display: grid; place-items: center; flex: 0 0 52px; width: 52px; height: 52px; border-radius: 16px; background: linear-gradient(145deg, var(--gm-violet-500), var(--gm-violet-600)); box-shadow: none; font-size: 24px; }
.community-hero h2 { margin: 0; font-size: 18px; line-height: 1.25; }
.community-hero p { margin: 2px 0 0; color: var(--a2-muted); font-size: 12px; }
.sticky-search { position: sticky; z-index: 8; top: 0; width: 100%; padding: 10px var(--a2-gutter) 8px; overflow: hidden; border-bottom: 1px solid var(--a2-line); background: rgb(var(--gm-ink-900-rgb) / 0.96); backdrop-filter: blur(18px); }
.search-box { display: flex; align-items: center; gap: 9px; width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--a2-line); border-radius: 12px; background: var(--a2-surface); color: var(--a2-muted); }
.search-box input { min-width: 0; width: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--a2-text); font-size: 12px; }
.filter-chips { display: flex; gap: 7px; width: 100%; margin: 8px 0 0; padding: 0 0 2px; overflow-x: auto; scrollbar-width: none; }
.filter-chip { flex: 0 0 auto; min-height: 32px; padding: 6px 10px; border: 1px solid var(--a2-line); border-radius: 999px; background: transparent; color: var(--a2-muted); font-size: 10px; font-weight:600; white-space: nowrap; }
.filter-chip.active { border-color: var(--a2-accent); background: var(--a2-accent-soft); color: var(--a2-accent-2); }
.staff-team-list, .member-list { display: block; padding: 0 var(--a2-gutter); }
.staff-team-row, .member-row { width: 100%; min-width: 0; min-height: 62px; margin: 0; padding: 9px 0; border: 0; border-bottom: 1px solid var(--a2-line); border-radius: 0; background: transparent; }
.staff-team-row { display: grid; grid-template-columns: 46px minmax(0,1fr) auto; gap: 10px; align-items: center; }
.member-row { display: flex; align-items: center; gap: 10px; }
.member-avatar, .staff-team-row .member-avatar { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; }
.member-main, .staff-team-copy { min-width: 0; flex: 1; }
.member-name, .staff-team-copy strong { display: block; overflow: hidden; color: var(--a2-text); font-size: 13px; font-weight:700; text-overflow: ellipsis; white-space: nowrap; }
.member-subline, .staff-team-copy span, .staff-team-copy small { display: block; margin-top: 2px; overflow: hidden; color: var(--a2-muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.member-arrow { flex: 0 0 auto; color: var(--gm-ink-400); font-size: 20px; }

/* Tickets */
.ticket-page { width: 100%; padding: 0 0 20px; }
.ticket-page .ticket-page-head { padding: 13px var(--a2-gutter) 8px; }
.ticket-page-head h2 { margin: 0; font-size: 20px; }
.ticket-toolbar, .ticket-filters, .ticket-scope-row { width: 100%; padding-inline: var(--a2-gutter); }
.ticket-filters { overflow-x: auto; }
.ticket-list { width: 100%; margin-top: 10px; border-top: 1px solid var(--a2-line); }
.ticket-item {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) 16px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 86px;
  margin: 0;
  padding: 11px var(--a2-gutter);
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid var(--a2-line);
  border-radius: 0;
  background: transparent;
}
.ticket-item.has-unread { background: linear-gradient(90deg, rgb(var(--gm-violet-400-rgb) / 0.07), transparent 78%); }
.ticket-item-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.10); border-radius: 12px; background: var(--a2-accent-soft); color: var(--a2-accent); font-size: 0; }
.ticket-item-icon::after { content: ""; width: 20px; height: 20px; background: center/contain no-repeat var(--a2-ticket-icon); }
.ticket-item-main { min-width: 0; }
.ticket-item-top { display: flex; align-items: flex-start; gap: 7px; min-width: 0; }
.ticket-item-top > strong { min-width: 0; flex: 1; overflow: hidden; color: var(--a2-text); font-size: 13px; line-height: 1.25; font-weight:700; text-overflow: ellipsis; white-space: nowrap; }
.ticket-item-badges { display: flex; flex: 0 0 auto; align-items: center; }
.ticket-priority { display: none; }
.ticket-status { padding: 2px 6px; border: 1px solid currentColor; border-radius: 4px; background: transparent; font-size: 9px; font-weight:700; white-space: nowrap; }
.ticket-status[data-status="open"] { color: var(--a2-accent-2); }
.ticket-status[data-status="in_progress"], .ticket-status[data-status="waiting"] { color: var(--a2-warning); }
.ticket-status[data-status="closed"] { color: var(--a2-success); }
.ticket-item-meta, .ticket-assignee-line, .ticket-item-main > small { display: block; max-width: 100%; margin: 3px 0 0; overflow: hidden; color: var(--a2-muted); font-size: 10px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.ticket-assignee-line { color: var(--gm-ink-300); }
.ticket-last-message { display: none; }
.ticket-item .member-arrow { justify-self: end; }
.ticket-unread { position: absolute; top: 16px; left: 50px; width: 6px; height: 6px; min-width: 0; padding: 0; overflow: hidden; border-radius: 50%; background: var(--a2-accent); color: transparent; }

/* More/settings: grouped, compact and safe for narrow Telegram WebViews. */
.more-menu-list {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 8px var(--a2-gutter) 4px;
}
.more-menu-group {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--a2-line);
  border-radius: 16px;
  background: rgb(var(--gm-ink-850-rgb) / 0.72);
}
.more-menu-group-head {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 12px 13px 8px;
  border-bottom: 1px solid rgb(var(--gm-ink-50-rgb) / 0.04);
}
.more-menu-group-head strong {
  color: var(--a2-accent-2);
  font-size: 10px;
  font-weight:700;
  letter-spacing: .08em;
  line-height: 1.2;
  text-transform: uppercase;
}
.more-menu-group-head small {
  min-width: 0;
  color: var(--a2-muted);
  font-size: 9px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.more-menu-owner-group {
  border-color: rgb(var(--gm-gold-400-rgb) / 0.22);
  background: linear-gradient(145deg, rgb(var(--gm-gold-400-rgb) / 0.055), rgb(var(--gm-ink-850-rgb) / 0.78));
}
.more-menu-owner-group .more-menu-group-head strong { color: var(--gm-gold-300); }
.more-menu-item, .more-menu-placeholder {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 64px;
  margin: 0;
  padding: 10px 13px;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid var(--a2-line);
  border-radius: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}
.more-menu-group .more-menu-item:last-child { border-bottom: 0; }
.more-menu-icon {
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--a2-accent-soft);
  color: var(--a2-accent);
}
.more-menu-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
  max-width: 100%;
}
.more-menu-copy strong,
.more-menu-copy small {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}
.more-menu-copy strong { font-size: 14px; line-height: 1.2; }
.more-menu-copy small { color: var(--a2-muted); font-size: 10px; line-height: 1.3; }
.more-menu-arrow {
  justify-self: end;
  margin-left: auto;
  color: var(--a2-muted);
  font-size: 22px;
  line-height: 1;
}
.settings-compact-head { padding: 14px var(--a2-gutter); border-bottom: 1px solid var(--a2-line); }
.settings-category-tabs { gap: 6px; padding: 9px var(--a2-gutter); overflow-x: auto; border-bottom: 1px solid var(--a2-line); background: rgb(var(--gm-ink-900-rgb) / 0.96); }
.settings-category-tab { border-color: var(--a2-line); background: transparent; color: var(--a2-muted); }
.settings-category-tab.active { border-color: var(--a2-accent); background: var(--a2-accent-soft); color: var(--a2-accent-2); }
.settings-panel, .settings-card { border-color: var(--a2-line); background: transparent; box-shadow: none; }
.settings-field input, .settings-field select, .settings-field textarea { min-height: 44px; border-color: var(--a2-line); background: var(--a2-surface); color: var(--a2-text); font-size: 13px; }

/* Bottom navigation */
.bottom-nav {
  position: fixed;
  z-index: 20;
  left: 50%;
  right: auto;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  width: min(100%, 560px);
  min-width: 0;
  min-height: var(--a2-nav-height);
  margin: 0;
  padding: 7px 5px max(7px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border: 0;
  border-top: 1px solid var(--a2-line);
  border-radius: 0;
  background: rgb(var(--gm-ink-850-rgb) / 0.97);
  box-shadow: none;
  backdrop-filter: blur(20px);
}
.nav-item { position: relative; display: grid; min-width: 0; min-height: 54px; place-items: center; align-content: center; gap: 3px; padding: 5px 2px; border: 0; border-radius: 0; background: transparent; color: var(--gm-ink-300); }
.nav-item::before { content: ""; position: absolute; top: -7px; left: 18%; right: 18%; height: 2px; border-radius: 4px; background: transparent; }
.nav-item .nav-glyph { display: grid; place-items: center; width: 23px; height: 23px; }
.nav-item .a2-icon { width: 20px; height: 20px; }
.nav-item small { max-width: 100%; overflow: hidden; color: inherit; font-size: 9px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.nav-item.active { background: transparent; color: var(--a2-accent); }
.nav-item.active::before { background: var(--a2-accent); }

/* Icon data, kept code-native and crisp at every density. */
:root {
  --a2-rating-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a768ff' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 18V12M12 18V6M18 18v-9'/%3E%3C/svg%3E");
  --a2-ticket-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a768ff' stroke-width='1.8'%3E%3Cpath d='M12 3 21 12 12 21 3 12Z'/%3E%3Cpath d='M12 8v8M8 12h8' opacity='.7'/%3E%3C/svg%3E");
}

@media (max-width: 380px) {
  :root { --a2-gutter: 12px; }
  .topbar { min-height: 70px; }
  .brand .logo { flex-basis: 46px; width: 46px; height: 46px; }
  .quick-copy strong { max-width: 110px; }
  .ticket-item { grid-template-columns: 42px minmax(0,1fr) 14px; gap: 8px; }
  .more-menu-list { gap: 10px; }
  .more-menu-item, .more-menu-placeholder {
    grid-template-columns: 36px minmax(0, 1fr) 12px;
    gap: 8px;
    padding: 9px 10px;
  }
  .more-menu-icon { width: 36px; height: 36px; }
}


/* A2 final mobile polish: compact rhythm and fully visible controls. */
@media (max-width: 560px) {
  .topbar { min-height: 80px; padding: 12px 20px; }
  .brand .logo { flex-basis: 50px; width: 50px; height: 50px; }
  .brand h1 { font-size: 18px; }

  #home-page .profile-card { min-height: 96px; padding-block: 15px; }
  .profile-copy h2 { font-size: 17px; }
  .staff-rating-inline { margin-left: 0; color: var(--a2-muted); background: transparent; border-color: transparent; }
  .chat-rating-home { min-height: 66px; padding-block: 9px; }
  .chat-rating-home-head strong { color: var(--a2-accent-2); font-size: 14px; }
  .quick-card { min-height: 54px; padding-block: 7px; }
  .quick-icon { width: 34px; height: 34px; }
  #home-page .section-heading { min-height: 44px; padding-top: 11px; padding-bottom: 7px; }
  .community { min-height: 58px; padding-block: 8px; }

  .sticky-search { position: static; padding-top: 10px; }
  .filter-chips {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    overflow: visible;
  }
  .filter-chip { width: 100%; min-width: 0; padding-inline: 7px; overflow: hidden; text-overflow: ellipsis; }
  .section-heading { min-height: 46px; padding-top: 11px; padding-bottom: 8px; }
  .section-heading h2 { font-size: 14px; }
  .counter { font-size: 13px; }

  .ticket-topline { padding-top: 12px !important; }
  .ticket-topline h2 { font-size: 20px; }
  .ticket-create-fab { width: 38px !important; height: 38px !important; min-width: 38px !important; border-radius: 12px !important; font-size: 22px !important; }
  .ticket-limit-note { padding-bottom: 10px; font-size: 10px; }
  .ticket-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    overflow: visible;
  }
  .ticket-chip { width: 100%; min-width: 0; min-height: 32px; padding: 6px 5px; overflow: hidden; font-size: 10px; text-overflow: ellipsis; }
  .ticket-chip:nth-child(4), .ticket-chip:nth-child(5) { grid-column: span 1; }
  .ticket-extra-filters,
  .ticket-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px !important; padding: 0 20px 9px !important; }
  .ticket-extra-filters select,
  .ticket-toolbar select { height: 38px !important; min-width: 0 !important; padding-left: 10px !important; font-size: 11px !important; }
  .ticket-scope { gap: 7px; padding-bottom: 9px; }
  .ticket-scope-button { min-height: 34px; font-size: 10px; }
  .ticket-item { min-height: 76px; padding-block: 9px; }
  .ticket-item-icon { width: 38px; height: 38px; border-radius: 12px; }
  .ticket-item-top > strong { font-size: 13px; }
  .ticket-item-meta, .ticket-assignee-line, .ticket-item-main > small { margin-top: 2px; font-size: 9px; }
}

@media (max-width: 380px) {
  .filter-chips, .ticket-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ticket-extra-filters, .ticket-toolbar { grid-template-columns: 1fr !important; }
}

/* v6 cascade lock: these values intentionally remain after all legacy overrides. */
@media (max-width: 560px) {
  :root { --a2-gutter: 20px; --a2-nav-height: 72px; }
  .topbar { min-height: 76px; padding-block: 11px; }
  .brand .logo { flex-basis: 48px; width: 48px; height: 48px; border-radius: 12px; }
  .brand h1 { font-size: 17px; }
  .brand p { margin-top: 2px; font-size: 12px; }
  #home-page .profile-card { grid-template-columns: 54px minmax(0, 1fr) 14px; min-height: 102px; padding-block: 16px; }
  .profile-card .avatar { width: 52px; height: 52px; }
  .staff-rating-inline { margin: 4px 0 0; padding: 0; font-size: 10px; font-weight:600; }
  .chat-rating-home { grid-template-columns: 36px minmax(0, 1fr) auto 12px; min-height: 62px; column-gap: 10px; padding-block: 9px; }
  .chat-rating-home::before { width: 34px; height: 34px; border-radius: 8px; background-size: 18px 18px; }
  .chat-rating-home-head span { font-size: 11px; }
  .chat-rating-home-head strong { font-size: 13px; font-weight:700; }
  .chat-rating-home small { font-size: 9px; }
  .quick-card { grid-template-columns: 34px minmax(0, 1fr) auto 12px; min-height: 52px; gap: 9px; }
  .quick-icon { width: 32px; height: 32px; border-radius: 8px; }
  .quick-copy small, .quick-copy strong { font-size: 11px; }
  .community-mark { flex-basis: 48px; width: 48px; height: 48px; border-radius: 12px; }
  .search-box { height: 40px; border-radius: 12px; }
  .filter-chips { gap: 6px; margin-top: 8px; }
  .filter-chip { min-height: 30px; padding: 5px 6px; font-size: 9px; }
  .staff-team-row { grid-template-columns: 42px minmax(0, 1fr) 48px; min-height: 60px; gap: 9px; padding-block: 8px; }
  .staff-team-row .member-avatar { width: 40px; height: 40px; }
  .staff-team-copy strong { font-size: 12px; }
  .staff-team-copy span, .staff-team-copy small { font-size: 9px; }
  .staff-team-rating { font-size: 10px; line-height: 1.25; }
  .ticket-filters { gap: 6px; padding-bottom: 8px; }
  .ticket-chip { min-height: 30px; padding-block: 5px; font-size: 9px; }
  .ticket-extra-filters, .ticket-toolbar { gap: 6px !important; padding-bottom: 8px !important; }
  .ticket-extra-filters select, .ticket-toolbar select { height: 36px !important; border-radius: 8px !important; font-size: 10px !important; }
  .ticket-scope { gap: 6px; padding-bottom: 10px; }
  .ticket-scope-button { min-height: 32px; font-size: 9px; }
  .ticket-item { grid-template-columns: 38px minmax(0, 1fr) 12px; min-height: 72px; gap: 9px; padding-block: 8px; }
  .ticket-item-icon { width: 36px; height: 36px; border-radius: 8px; }
  .ticket-item-top > strong { font-size: 12px; }
  .ticket-status { font-size: 8px; }
  .ticket-item-meta, .ticket-assignee-line, .ticket-item-main > small { font-size: 8px; line-height: 1.25; }
  .bottom-nav { padding-top: 5px; padding-bottom: max(5px, env(safe-area-inset-bottom)); }
  .nav-item { min-height: 54px; border-radius: 12px; }
  .nav-item .nav-glyph { width: 22px; height: 22px; }
  .nav-item .a2-icon { width: 20px; height: 20px; }
  .nav-item small { font-size: 9px; }
}

@media (max-width: 380px) {
  :root { --a2-gutter: 16px; }
  .staff-team-row { grid-template-columns: 40px minmax(0, 1fr) 44px; }
}

/* v6 — final hierarchy pass from the real Telegram WebView render. */
@media (max-width: 560px) {
  :root { --a2-gutter: 20px; --a2-nav-height: 72px; }

  .topbar { min-height: 76px; padding-block: 11px; }
  .brand .logo { flex-basis: 48px; width: 48px; height: 48px; border-radius: 14px; }
  .brand h1 { font-size: 17px; }
  .brand p { margin-top: 2px; font-size: 12px; }

  #home-page .profile-card {
    grid-template-columns: 54px minmax(0, 1fr) 14px;
    min-height: 102px;
    padding-block: 16px;
  }
  .profile-card .avatar { width: 52px; height: 52px; }
  .profile-copy h2 { font-size: 17px; }
  .role-badge { margin-top: 4px; }
  .staff-rating-inline { margin: 4px 0 0; padding: 0; font-size: 10px; font-weight: 600; }

  .chat-rating-home {
    grid-template-columns: 36px minmax(0, 1fr) auto 12px;
    min-height: 62px;
    column-gap: 10px;
    padding-block: 9px;
  }
  .chat-rating-home::before { width: 34px; height: 34px; border-radius: 10px; background-size: 18px 18px; }
  .chat-rating-home-head span { font-size: 11px; }
  .chat-rating-home-head strong { font-size: 13px; font-weight: 700; }
  .chat-rating-home small { font-size: 9px; }

  .quick-grid { padding-inline: 20px; border-top: 0; }
  .quick-card { grid-template-columns: 34px minmax(0, 1fr) auto 12px; min-height: 52px; gap: 9px; }
  .quick-icon { width: 32px; height: 32px; border-radius: 10px; }
  .quick-icon .a2-icon { width: 17px; height: 17px; }
  .quick-copy small, .quick-copy strong { font-size: 11px; }
  #home-page .section-heading { margin-top: 6px; }

  #community-page > .text-button { padding-top: 10px; padding-bottom: 6px; }
  .community-hero { padding-top: 12px; padding-bottom: 14px; }
  .community-mark { flex-basis: 48px; width: 48px; height: 48px; border-radius: 14px; }
  .community-hero h2 { font-size: 17px; }
  .sticky-search { padding-top: 10px; padding-bottom: 9px; }
  .search-box { height: 40px; border-radius: 11px; }
  .filter-chips { gap: 6px; margin-top: 8px; }
  .filter-chip { min-height: 30px; padding: 5px 6px; font-size: 9px; }
  .staff-team-row { grid-template-columns: 42px minmax(0, 1fr) 48px; min-height: 60px; gap: 9px; padding-block: 8px; }
  .staff-team-row .member-avatar { width: 40px; height: 40px; }
  .staff-team-copy strong { font-size: 12px; }
  .staff-team-copy span, .staff-team-copy small { font-size: 9px; }
  .staff-team-rating { font-size: 10px; line-height: 1.25; }

  .ticket-topline { padding-top: 14px !important; padding-bottom: 4px !important; }
  .ticket-limit-note { max-width: 410px; padding-top: 4px; padding-bottom: 12px; line-height: 1.35; }
  .ticket-filters { gap: 6px; padding-bottom: 8px; }
  .ticket-chip { min-height: 30px; padding-block: 5px; font-size: 9px; }
  .ticket-extra-filters, .ticket-toolbar { gap: 6px !important; padding-bottom: 8px !important; }
  .ticket-extra-filters select, .ticket-toolbar select { height: 36px !important; border-radius: 10px !important; font-size: 10px !important; }
  .ticket-scope { gap: 6px; padding-bottom: 10px; }
  .ticket-scope-button { min-height: 32px; font-size: 9px; }
  .ticket-item { grid-template-columns: 38px minmax(0, 1fr) 12px; min-height: 72px; gap: 9px; padding-block: 8px; }
  .ticket-item-icon { width: 36px; height: 36px; border-radius: 10px; }
  .ticket-item-icon::after { width: 17px; height: 17px; }
  .ticket-item-top > strong { font-size: 12px; }
  .ticket-status { padding: 2px 5px; font-size: 8px; }
  .ticket-item-meta, .ticket-assignee-line, .ticket-item-main > small { font-size: 8px; line-height: 1.25; }

  .bottom-nav { padding-top: 5px; padding-bottom: max(5px, env(safe-area-inset-bottom)); }
  .nav-item { min-height: 54px; border-radius: 13px; }
  .nav-item .nav-glyph { width: 22px; height: 22px; }
  .nav-item .a2-icon { width: 20px; height: 20px; }
  .nav-item small { font-size: 9px; }
}

@media (max-width: 380px) {
  :root { --a2-gutter: 16px; }
  .staff-team-row { grid-template-columns: 40px minmax(0, 1fr) 44px; }
}

/* A2 mobile fidelity pass — based on the real Telegram WebView screenshots. */
@media (max-width: 560px) {
  :root { --a2-gutter: 20px; --a2-nav-height: 76px; }
}

/* Keep every screen on the same quiet, edge-to-edge rhythm as the approved A2. */
.topbar { min-height: 88px; padding: 16px 20px; }
.brand .logo { flex-basis: 54px; width: 54px; height: 54px; border-radius: 16px; font-size: 20px; }
.brand h1 { font-size: 20px; }
.brand p { font-size: 13px; }
.profile-settings-button { flex-basis: 40px; width: 40px; height: 40px; }

#home-page .profile-card {
  grid-template-columns: 56px minmax(0, 1fr) 16px;
  min-height: 112px;
  padding: 20px;
}
.profile-card .avatar { width: 54px; height: 54px; }
.profile-copy h2 { font-size: 18px; }
.staff-rating-inline { display: inline-flex; width: max-content; margin: 5px 0 0 8px; padding: 3px 8px; }

.chat-rating-home {
  grid-template-columns: 40px minmax(0, 1fr) auto 14px;
  min-height: 72px;
  padding: 12px 20px;
}
.chat-rating-home-head span { font-size: 13px; }
.chat-rating-home-head strong { font-size: 13px; }

.quick-grid { margin-top: 0; padding: 0 20px; background: transparent; }
.quick-card { min-height: 58px; padding: 9px 0; }
.quick-icon { width: 36px; height: 36px; border-radius: 12px; }
.quick-copy small, .quick-copy strong { font-size: 12px; }

/* Members: left-aligned navigation and a single compact information hierarchy. */
#community-page > .text-button { margin: 0; padding: 12px 20px 8px; font-size: 13px; }
.community-hero { padding: 14px 20px 18px; }
.community-mark { flex-basis: 52px; width: 52px; height: 52px; font-size: 0; }
.community-mark::after { content: ""; width: 24px; height: 24px; background: center / contain no-repeat var(--a2-users-icon); }
.sticky-search { padding: 12px 20px 10px; }
.search-box { height: 44px; border-radius: 12px; }
.search-box > span { font-size: 0; }
.search-box > span::after { content: ""; display: block; width: 19px; height: 19px; background: center / contain no-repeat var(--a2-search-icon); }
.filter-chips { gap: 8px; margin-top: 10px; }
.filter-chip { min-height: 34px; padding: 7px 12px; font-size: 11px; }
.section-heading { padding-inline: 20px; }
.staff-team-list, .member-list { padding-inline: 20px; }

/* Tickets: no clipped title/FAB, no accidental brand colors, and readable rows. */
.ticket-page { overflow: hidden; padding-bottom: 18px; }
.ticket-topline {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 42px !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 16px 20px 6px !important;
}
.ticket-topline h2 { margin: 0; font-size: 22px; line-height: 1.2; }
.ticket-create-fab {
  position: static !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  padding: 0 !important;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.16) !important;
  border-radius: 12px !important;
  background: var(--a2-accent-soft) !important;
  color: var(--a2-accent-2) !important;
  box-shadow: none !important;
  font-size: 26px !important;
  line-height: 1 !important;
}
.ticket-limit-note { margin: 0; padding: 0 20px 12px; color: var(--a2-muted); font-size: 11px; line-height: 1.4; }
.ticket-filters { display: flex; gap: 8px; padding: 0 20px 10px; overflow-x: auto; scrollbar-width: none; }
.ticket-filters::-webkit-scrollbar { display: none; }
.ticket-chip { flex: 0 0 auto; min-height: 34px; padding: 7px 13px; border: 1px solid var(--a2-line); border-radius: 999px; background: transparent; color: var(--a2-muted); font-size: 11px; font-weight:600; white-space: nowrap; }
.ticket-chip.active { border-color: var(--a2-accent); background: var(--a2-accent-soft); color: var(--a2-accent-2); }
.ticket-toolbar { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; padding: 0 20px 10px !important; }
.ticket-toolbar select { width: 100% !important; min-width: 0 !important; height: 42px !important; padding: 0 36px 0 12px !important; border: 1px solid var(--a2-line) !important; border-radius: 12px !important; background-color: var(--a2-surface) !important; color: var(--a2-text) !important; font-size: 12px !important; }
.ticket-scope { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 20px 12px; }
.ticket-scope-button { min-width: 0; min-height: 36px; border: 1px solid var(--a2-line); border-radius: 999px; background: transparent; color: var(--a2-muted); font-size: 11px; font-weight:700; }
.ticket-scope-button.active { border-color: var(--a2-accent); background: var(--a2-accent-soft); color: var(--a2-accent-2); }
.ticket-list { margin-top: 0; }
.ticket-item { min-height: 82px; padding: 11px 20px; }
.ticket-item-top > strong { font-size: 14px; }
.ticket-status { font-size: 9px; }

/* Bottom navigation uses only the purple A2 accent and line icons. */
.bottom-nav { padding: 6px 8px max(6px, env(safe-area-inset-bottom)); background: rgb(var(--gm-ink-900-rgb) / 0.985); }
.nav-item { min-height: 58px; gap: 4px; }
.nav-item::before { display: none; }
.nav-item.active { border-radius: 12px; background: var(--a2-accent-soft); color: var(--a2-accent-2); }
.nav-item .nav-glyph { width: 24px; height: 24px; }
.nav-item .a2-icon { width: 22px; height: 22px; }
.nav-item small { font-size: 10px; }

:root {
  --a2-search-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238791a2' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E");
  --a2-users-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5f7fb' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20v-2a5 5 0 0 1 5-5h2a5 5 0 0 1 5 5v2M16 5a3 3 0 0 1 0 6M18 13a5 5 0 0 1 3 4.6V20'/%3E%3C/svg%3E");
}

@media (max-width: 380px) {
  :root { --a2-gutter: 16px; }
  .topbar, #home-page .profile-card, .chat-rating-home { padding-left: 16px; padding-right: 16px; }
  .quick-grid, .sticky-search, .staff-team-list, .member-list, .ticket-filters, .ticket-toolbar, .ticket-scope { padding-left: 16px !important; padding-right: 16px !important; }
  .ticket-topline { padding-left: 16px !important; padding-right: 16px !important; }
  .ticket-limit-note { padding-left: 16px; padding-right: 16px; }
}

/* v6 final overrides stay last so the legacy bundle cannot re-expand mobile UI. */
@media (max-width: 560px) {
  :root { --a2-nav-height: 72px; }
  .topbar { min-height: 76px; padding: 11px 20px; }
  .brand .logo { flex-basis: 48px; width: 48px; height: 48px; border-radius: 12px; }
  .brand h1 { font-size: 17px; }
  .brand p { font-size: 12px; }
  #home-page .profile-card { min-height: 102px; padding-block: 16px; }
  .profile-copy h2 { font-size: 17px; }
  .staff-rating-inline { margin-left: 0; color: var(--a2-muted); background: transparent; border-color: transparent; }
  .chat-rating-home { min-height: 62px; padding-block: 9px; }
  .chat-rating-home-head strong { color: var(--a2-accent-2); font-size: 13px; }
  .quick-card { min-height: 52px; padding-block: 7px; }
  .quick-icon { width: 32px; height: 32px; }
  #home-page .section-heading { min-height: 44px; padding-top: 11px; padding-bottom: 7px; }
  .community { min-height: 58px; padding-block: 8px; }
  .sticky-search { position: static; padding-top: 10px; }
  .filter-chips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; overflow: visible; }
  .filter-chip { width: 100%; min-width: 0; min-height: 30px; padding: 5px 6px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; }
  .section-heading { min-height: 46px; padding-top: 11px; padding-bottom: 8px; }
  .section-heading h2 { font-size: 14px; }
  .counter { font-size: 13px; }
  .ticket-topline { padding-top: 12px !important; grid-template-columns: minmax(0, 1fr) 38px !important; }
  .ticket-topline h2 { font-size: 20px; }
  .ticket-create-fab { width: 38px !important; height: 38px !important; min-width: 38px !important; border-radius: 12px !important; font-size: 22px !important; }
  .ticket-limit-note { padding-bottom: 10px; font-size: 10px; }
  .ticket-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; overflow: visible; }
  .ticket-chip { width: 100%; min-width: 0; min-height: 30px; padding: 5px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; }
  .ticket-extra-filters, .ticket-toolbar { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; padding: 0 20px 8px !important; }
  .ticket-extra-filters select, .ticket-toolbar select { width: 100% !important; height: 36px !important; min-width: 0 !important; padding-left: 10px !important; border-radius: 8px !important; font-size: 10px !important; }
  .ticket-scope { gap: 6px; padding-bottom: 10px; }
  .ticket-scope-button { min-height: 32px; font-size: 9px; }
  .ticket-item { min-height: 72px; padding-block: 8px; }
  .ticket-item-icon { width: 36px; height: 36px; border-radius: 8px; }
  .ticket-item-top > strong { font-size: 12px; }
  .ticket-item-meta, .ticket-assignee-line, .ticket-item-main > small { margin-top: 2px; font-size: 8px; }
}

@media (max-width: 380px) {
  .filter-chips, .ticket-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ticket-extra-filters, .ticket-toolbar { grid-template-columns: 1fr !important; }
}

/* v7 — final Telegram WebView balance pass. Keep last in the cascade. */
@media (max-width: 560px) {
  #home-page .profile-card { min-height: 96px; padding-block: 13px; }
  .staff-rating-inline { margin-top: 5px; color: var(--a2-muted); font-size: 10px; line-height: 1.25; }
  .chat-rating-home { min-height: 58px; padding-block: 7px; }
  .quick-grid { margin-top: 0; }
  .quick-card { min-height: 50px; padding-block: 6px; }
  #home-page .section-heading { margin-top: 0; }
  #community-page > .text-button { padding-top: 9px; padding-bottom: 5px; }
  .community-hero { padding-top: 10px; padding-bottom: 13px; }
  .sticky-search { padding-top: 9px; }
  .staff-team-rating { color: var(--a2-muted); font-size: 9px; font-weight: 650; white-space: normal; }
  .ticket-topline { padding-top: 14px !important; }
  .ticket-limit-note { padding-top: 2px; padding-bottom: 9px; }
  .ticket-item-meta, .ticket-assignee-line, .ticket-item-main > small { font-size: 9px; line-height: 1.3; }
  .ticket-item { min-height: 74px; }
}

/* v9 — reference-faithful glass redesign; keep this layer last. */
:root {
  --a2-bg:var(--gm-ink-950); --a2-surface:rgb(var(--gm-ink-800-rgb) / 0.72); --a2-surface-2:rgb(var(--gm-ink-750-rgb) / 0.82);
  --a2-line:rgb(var(--gm-ink-50-rgb) / 0.095); --a2-text:var(--gm-ink-50); --a2-muted:var(--gm-ink-300);
  --a2-accent:var(--gm-violet-400); --a2-accent-2:var(--gm-violet-300); --a2-accent-soft:rgb(var(--gm-violet-400-rgb) / 0.14);
  --a2-nav-height:96px;
}
html,body,.app-shell{background:var(--gm-ink-950)}
body{background:radial-gradient(circle at 22% -8%,rgb(var(--gm-violet-600-rgb) / 0.16),transparent 35%),radial-gradient(circle at 96% 18%,rgb(var(--gm-violet-800-rgb) / 0.12),transparent 30%),var(--gm-ink-950)}
.app-shell{min-height:100dvh;background:transparent}
.topbar{position:sticky;top:0;z-index:30;min-height:82px;padding:15px 20px;border-bottom-color:rgb(var(--gm-ink-50-rgb) / 0.07);background:rgb(var(--gm-ink-950-rgb) / 0.76);backdrop-filter:blur(24px) saturate(135%)}
.brand .logo{width:50px;height:50px;flex-basis:50px;border-color:rgb(var(--gm-ink-50-rgb) / 0.11);border-radius:16px;background:linear-gradient(145deg,rgb(var(--gm-violet-400-rgb) / 0.25),rgb(var(--gm-ink-750-rgb) / 0.72));color:var(--gm-violet-300);box-shadow:inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.08)}
.brand h1{font-size:18px;font-weight:700;letter-spacing:-.025em}.brand p{color:var(--gm-ink-300)}.profile-settings-button{width:42px;height:42px;flex-basis:42px;color:var(--gm-ink-300)}
.section-heading{min-height:64px;padding:22px 20px 12px}.section-heading h2{font-size:20px;line-height:1.15;font-weight:700;letter-spacing:-.025em}.counter{color:var(--a2-muted);font-size:13px}

/* Home */
#home-page{padding-top:8px}
#home-page .profile-card{grid-template-columns:68px minmax(0,1fr) 18px;min-height:112px;margin:0 20px;width:calc(100% - 40px);padding:18px 0;border-bottom-color:var(--a2-line)}
.profile-card .avatar{width:64px;height:64px;border:2px solid rgb(var(--gm-ink-50-rgb) / 0.78)}
.profile-copy h2{font-size:20px;font-weight:700;letter-spacing:-.02em}.profile-copy p{margin-top:4px;color:var(--a2-accent-2);font-size:13px}.role-badge,.staff-rating-inline{color:var(--a2-muted);font-size:12px}
#home-page .profile-card::after,.quick-card::after,.chat-rating-home::after{color:var(--gm-ink-400)}
.chat-rating-home{width:calc(100% - 40px);min-height:76px;margin:0 20px;padding:13px 0;border-bottom-color:var(--a2-line)}
.chat-rating-home::before{width:42px;height:42px;border-radius:12px}.chat-rating-home-head span{font-size:14px}.chat-rating-home-head strong{color:var(--gm-violet-300);font-size:14px}.chat-rating-home small{font-size:11px}
.quick-grid{width:calc(100% - 40px);margin:8px 20px 0;padding:0;border:0;background:transparent}.quick-card{min-height:66px;padding:11px 0}.quick-icon{width:40px;height:40px;border-radius:12px}.quick-copy small{font-size:14px}.quick-copy strong{color:var(--gm-ink-300);font-size:13px}
.community-list{padding:0 20px}.community{min-height:72px;padding:12px 0}

/* Members */
#community-page>.text-button{margin:0;padding:14px 20px 8px;color:var(--gm-violet-400);font-size:13px}.community-hero{gap:15px;padding:15px 20px 20px;border-bottom:0}.community-mark{width:62px;height:62px;flex-basis:62px;border-radius:20px;background:rgb(var(--gm-violet-400-rgb) / 0.15)}.community-mark::after{width:29px;height:29px}.community-hero h2{font-size:26px;letter-spacing:-.035em}.community-hero p{margin-top:5px;font-size:13px}
.sticky-search{position:static;padding:0 20px 15px;border-bottom:0;background:transparent;backdrop-filter:none}.search-box{height:48px;border-color:rgb(var(--gm-ink-50-rgb) / 0.13);border-radius:16px;background:rgb(var(--gm-ink-50-rgb) / 0.035)}.search-box input{font-size:13px}
.filter-chips{display:flex;gap:8px;margin-top:12px;overflow-x:auto}.filter-chip{width:auto;min-width:max-content;min-height:36px;padding:8px 14px;border-color:rgb(var(--gm-ink-50-rgb) / 0.15);background:transparent;font-size:11px}.filter-chip.active{border-color:rgb(var(--gm-violet-400-rgb) / 0.8);background:rgb(var(--gm-violet-400-rgb) / 0.12)}
.staff-team-list,.member-list{padding:0 20px}.staff-team-row,.member-row{min-height:78px;padding:12px 0}.staff-team-row{grid-template-columns:54px minmax(0,1fr) auto;gap:13px}.member-avatar,.staff-team-row .member-avatar{width:52px;height:52px;flex-basis:52px}.member-name,.staff-team-copy strong{font-size:15px}.member-subline,.staff-team-copy span,.staff-team-copy small{margin-top:4px;font-size:11px}.staff-team-rating{color:var(--gm-ink-300);font-size:11px}

/* Tickets */
.ticket-page{padding-top:8px}.ticket-topline{padding:18px 20px 8px!important}.ticket-topline h2{font-size:30px;font-weight:700;letter-spacing:-.04em}.ticket-create-fab{width:44px!important;height:44px!important;min-width:44px!important;border-color:rgb(var(--gm-ink-50-rgb) / 0.16)!important;border-radius:16px!important;background:rgb(var(--gm-violet-400-rgb) / 0.12)!important;color:var(--gm-violet-300)!important}.ticket-limit-note{padding:0 20px 16px;font-size:12px}
.ticket-filters{display:flex;gap:8px;padding:0 20px 12px;overflow-x:auto}.ticket-chip{width:auto;min-width:max-content;min-height:36px;padding:8px 14px;border-color:rgb(var(--gm-ink-50-rgb) / 0.15);background:transparent;font-size:11px}
.ticket-extra-filters,.ticket-toolbar{grid-template-columns:1fr 1fr!important;gap:8px!important;padding:0 20px 10px!important}.ticket-extra-filters select,.ticket-toolbar select{height:42px!important;border-color:rgb(var(--gm-ink-50-rgb) / 0.12)!important;border-radius:12px!important;background-color:rgb(var(--gm-ink-50-rgb) / 0.035)!important;font-size:11px!important}.ticket-scope{gap:8px;padding:0 20px 15px}.ticket-scope-button{min-height:36px;border-color:rgb(var(--gm-ink-50-rgb) / 0.14);font-size:11px}
.ticket-list{margin-top:2px;border-top-color:var(--a2-line)}.ticket-item{min-height:88px;padding:13px 20px;grid-template-columns:46px minmax(0,1fr) 14px;gap:12px}.ticket-item-icon{width:44px;height:44px;border-radius:16px}.ticket-item-top>strong{font-size:14px}.ticket-item-meta,.ticket-assignee-line,.ticket-item-main>small{font-size:10px;line-height:1.4}

/* Floating glass navigation */
.bottom-nav{left:50%;bottom:max(10px,env(safe-area-inset-bottom));width:calc(min(100%,560px) - 24px);height:72px;padding:7px;border:1px solid rgb(var(--gm-ink-50-rgb) / 0.11);border-radius:24px;background:rgb(var(--gm-ink-800-rgb) / 0.82);box-shadow:0 18px 50px rgb(var(--gm-ink-950-rgb) / 0.42);backdrop-filter:blur(26px) saturate(140%);transform:translateX(-50%)}
.nav-item{min-height:56px;border-radius:16px}.nav-item.active{background:rgb(var(--gm-violet-400-rgb) / 0.16)}.nav-item small{font-size:10px}

@media(max-width:380px){
 #home-page .profile-card,.chat-rating-home,.quick-grid{width:calc(100% - 32px);margin-left:16px;margin-right:16px}
 .community-list,.staff-team-list,.member-list{padding-left:16px;padding-right:16px}
 .filter-chips,.ticket-filters{display:flex;grid-template-columns:none;overflow-x:auto}
 .ticket-extra-filters,.ticket-toolbar{grid-template-columns:1fr 1fr!important;padding-left:16px!important;padding-right:16px!important}
}

/* v10 — exact reference component geometry. This is the sole authority for the three main screens. */
@media (max-width: 560px) {
  :root { --a2-gutter: 20px; --a2-nav-height: 112px; }
  html, body { background: var(--gm-ink-900); }
  body {
    background:
      radial-gradient(ellipse at 15% 8%, rgb(var(--gm-ink-500-rgb) / 0.2), transparent 34%),
      radial-gradient(ellipse at 84% 42%, rgb(var(--gm-ink-600-rgb) / 0.13), transparent 38%),
      var(--gm-ink-900);
  }
  .app-shell { padding-bottom: 36px; background: transparent; }
  .topbar {
    position: sticky; top: 0; z-index: 30;
    min-height: 104px; padding: 20px;
    border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13);
    background: rgb(var(--gm-ink-900-rgb) / 0.9);
    backdrop-filter: blur(24px) saturate(125%);
  }
  .brand { gap: 16px; }
  .brand .logo {
    flex-basis: 58px; width: 58px; height: 58px;
    border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.11); border-radius: 16px;
    background: linear-gradient(145deg, rgb(var(--gm-violet-800-rgb) / 0.72), rgb(var(--gm-ink-800-rgb) / 0.94));
    color: var(--gm-violet-400); font-size: 22px;
    box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.06), 0 10px 28px rgb(var(--gm-ink-950-rgb) / 0.18);
  }
  .brand h1 { font-size: 20px; line-height: 1.15; font-weight:700; }
  .brand p { margin-top: 6px; font-size: 14px; color: var(--gm-ink-300); }
  .profile-settings-button { width: 44px; height: 44px; flex-basis: 44px; color: var(--gm-ink-300); }
  .profile-settings-button .a2-icon { width: 27px; height: 27px; stroke-width: 1.7; }

  .section-heading { min-height: 58px; padding: 18px 20px 10px; }
  .section-heading h2 { font-size: 18px; font-weight:700; }
  .counter { color: var(--gm-violet-400); font-size: 18px; font-weight:500; }

  /* Home follows the same open-list composition as the references. */
  #home-page { padding-top: 18px; }
  #home-page .profile-card {
    grid-template-columns: 76px minmax(0, 1fr) 18px;
    width: calc(100% - 40px); min-height: 130px; margin: 0 20px; padding: 18px 0 22px;
    border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.14);
  }
  .profile-card .avatar { width: 72px; height: 72px; border: 2px solid rgb(var(--gm-ink-50-rgb) / 0.88); }
  .profile-copy h2 { font-size: 20px; }
  .profile-copy p { margin-top: 5px; color: var(--gm-violet-400); font-size: 14px; }
  .role-badge { margin-top: 8px; font-size: 12px; }
  .staff-rating-inline { margin: 8px 0 0; padding: 0; font-size: 11px; }
  .chat-rating-home {
    grid-template-columns: 54px minmax(0,1fr) auto 16px;
    width: calc(100% - 40px); min-height: 88px; margin: 0 20px; padding: 14px 0;
    border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.14);
  }
  .chat-rating-home::before { width: 48px; height: 48px; border-radius: 16px; background-size: 23px 23px; }
  .chat-rating-home-head span, .chat-rating-home-head strong { font-size: 14px; }
  .chat-rating-home small { font-size: 11px; }
  .quick-grid { width: calc(100% - 40px); margin: 0 20px; padding: 0; border: 0; background: transparent; }
  .quick-card { min-height: 72px; padding: 12px 0; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13); }
  .quick-icon { width: 44px; height: 44px; border-radius: 12px; }
  .quick-copy small { font-size: 14px; }
  .quick-copy strong { font-size: 13px; color: var(--gm-ink-300); }
  #home-page .section-heading { margin-top: 12px; padding-top: 20px; }
  .community-list { padding: 0 20px; }
  .community { min-height: 76px; padding: 14px 0; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13); }
  .community-action { color: var(--gm-violet-400); }

  /* Members: reference header, search/chips and full-width divided rows. */
  #community-page > .text-button { padding: 18px 20px 6px; color: var(--gm-violet-400); font-size: 13px; }
  .community-hero { gap: 16px; padding: 16px 20px 22px; }
  .community-mark { flex-basis: 64px; width: 64px; height: 64px; border-radius: 20px; }
  .community-mark::after { width: 31px; height: 31px; }
  .community-hero h2 { font-size: 26px; font-weight:700; }
  .community-hero p { margin-top: 6px; font-size: 13px; }
  .sticky-search { padding: 0 20px 14px; overflow: visible; }
  .search-box {
    height: 54px; padding: 0 15px; border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.24); border-radius: 16px;
    background: rgb(var(--gm-ink-750-rgb) / 0.38);
  }
  .search-box input { font-size: 14px; }
  .filter-chips { display: flex; gap: 9px; margin-top: 14px; padding-bottom: 2px; overflow-x: auto; }
  .filter-chip {
    width: auto; min-width: max-content; min-height: 42px; padding: 9px 18px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.24); border-radius: 8px;
    background: rgb(var(--gm-ink-850-rgb) / 0.42); color: var(--gm-ink-300); font-size: 13px; font-weight:500;
  }
  .filter-chip.active { border-color: var(--gm-violet-400); background: rgb(var(--gm-violet-400-rgb) / 0.1); color: var(--gm-violet-400); }
  .staff-team-list, .member-list { padding: 0; }
  .staff-team-row, .member-row { min-height: 92px; padding: 14px 20px; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13); }
  .staff-team-row { grid-template-columns: 62px minmax(0,1fr) auto; gap: 14px; }
  .member-row { gap: 14px; }
  .member-avatar, .staff-team-row .member-avatar { flex-basis: 58px; width: 58px; height: 58px; border: 1.5px solid rgb(var(--gm-ink-50-rgb) / 0.82); }
  .member-name, .staff-team-copy strong { font-size: 16px; font-weight:700; }
  .member-subline, .staff-team-copy span { margin-top: 4px; color: var(--gm-violet-400); font-size: 13px; }
  .staff-team-copy small { margin-top: 5px; font-size: 10px; }
  .staff-team-rating { max-width: 86px; color: var(--gm-ink-300); font-size: 11px; text-align: right; }
  .member-arrow { color: var(--gm-ink-300); font-size: 28px; }

  /* Tickets: exact control proportions and spacious status rows. */
  .ticket-page { padding-top: 20px; }
  .ticket-topline { grid-template-columns: minmax(0,1fr) 52px !important; padding: 18px 20px 10px !important; }
  .ticket-topline h2 { font-size: 30px; font-weight:700; letter-spacing: -.035em; }
  .ticket-create-fab {
    width: 50px !important; height: 50px !important; min-width: 50px !important;
    border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.16) !important; border-radius: 16px !important;
    background: rgb(var(--gm-violet-400-rgb) / 0.1) !important; font-size: 30px !important;
  }
  .ticket-limit-note { padding: 6px 20px 18px; font-size: 12px; }
  .ticket-filters { display: flex; gap: 9px; padding: 0 20px 14px; overflow-x: auto; }
  .ticket-chip {
    width: auto; min-width: max-content; min-height: 42px; padding: 9px 17px;
    border-radius: 8px; border-color: rgb(var(--gm-ink-300-rgb) / 0.24); color: var(--gm-ink-300); font-size: 12px;
  }
  .ticket-chip.active { border-color: var(--gm-violet-400); background: rgb(var(--gm-violet-400-rgb) / 0.1); color: var(--gm-violet-400); }
  .ticket-extra-filters, .ticket-toolbar {
    display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 10px !important; padding: 0 20px 14px !important;
  }
  .ticket-extra-filters select, .ticket-toolbar select {
    height: 48px !important; padding: 0 38px 0 14px !important;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.22) !important; border-radius: 12px !important;
    background-color: rgb(var(--gm-ink-850-rgb) / 0.44) !important; color: var(--gm-ink-100) !important; font-size: 12px !important;
  }
  .ticket-scope { gap: 10px; padding: 0 20px 20px; }
  .ticket-scope-button { min-height: 45px; border-color: rgb(var(--gm-ink-300-rgb) / 0.22); border-radius: 12px; font-size: 12px; }
  .ticket-scope-button.active { border-color: var(--gm-violet-400); background: rgb(var(--gm-violet-400-rgb) / 0.1); }
  .ticket-list { margin-top: 0; border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13); }
  .ticket-item {
    grid-template-columns: 56px minmax(0,1fr) 18px; gap: 14px;
    min-height: 106px; padding: 16px 20px; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13);
  }
  .ticket-item-icon { width: 52px; height: 52px; border-radius: 16px; }
  .ticket-item-icon::after { width: 24px; height: 24px; }
  .ticket-item-top > strong { font-size: 16px; font-weight:600; }
  .ticket-status { padding: 3px 8px; border-radius: 4px; font-size: 10px; }
  .ticket-item-meta { margin-top: 5px; font-size: 12px; }
  .ticket-assignee-line, .ticket-item-main > small { margin-top: 5px; font-size: 11px; }

  /* Reference-style floating glass navigation. */
  .bottom-nav {
    left: 12px; right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); transform: none;
    width: auto; height: 88px; padding: 8px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.18); border-radius: 24px;
    background: rgb(var(--gm-ink-800-rgb) / 0.88); box-shadow: 0 22px 54px rgb(var(--gm-ink-950-rgb) / 0.48);
    backdrop-filter: blur(28px) saturate(135%);
  }
  .nav-item { min-height: 70px; gap: 5px; border-radius: 16px; }
  .nav-item.active { background: rgb(var(--gm-violet-700-rgb) / 0.4); color: var(--gm-violet-400); }
  .nav-item .nav-glyph { width: 28px; height: 28px; }
  .nav-item .a2-icon { width: 26px; height: 26px; stroke-width: 1.7; }
  .nav-item small { font-size: 11px; }
}

@media (max-width: 380px) {
  :root { --a2-gutter: 16px; }
  .topbar { padding-left: 16px; padding-right: 16px; }
  #home-page .profile-card, .chat-rating-home, .quick-grid { width: calc(100% - 32px); margin-left: 16px; margin-right: 16px; }
  .community-list { padding-inline: 16px; }
  .sticky-search { padding-inline: 16px; }
  .staff-team-row, .member-row, .ticket-item { padding-inline: 16px; }
  .ticket-topline, .ticket-limit-note, .ticket-filters, .ticket-extra-filters, .ticket-toolbar, .ticket-scope { padding-left: 16px !important; padding-right: 16px !important; }
}

/* v11 — Telegram WebView fixes verified from the v10 production screenshots. */
@media (max-width: 560px) {
  body { padding-bottom: calc(124px + env(safe-area-inset-bottom)); }
  .app-shell { padding-bottom: calc(124px + env(safe-area-inset-bottom)); }
  #home-page, #community-page, .ticket-page { padding-bottom: 18px; }

  #home-page .profile-card,
  #home-page .chat-rating-home,
  #home-page .quick-card,
  #home-page .community {
    border-top: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  #home-page .quick-grid { display: grid; grid-template-columns: 1fr; gap: 0; }
  #home-page .quick-card { width: 100%; }

  .ticket-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    overflow: visible;
  }
  .ticket-chip {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: 8px 5px;
    overflow: hidden;
    font-size: 10px;
    text-overflow: ellipsis;
  }
}

@media (max-width: 380px) {
  .ticket-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* v12 — ticket screen rebuilt from the approved 853×1844 reference. */
@media (max-width: 560px) {
  body:has(#tickets-page:not(.hidden)) {
    padding-bottom: calc(104px + env(safe-area-inset-bottom));
    background:
      radial-gradient(ellipse at 52% 22%, rgb(var(--gm-ink-600-rgb) / 0.23), transparent 42%),
      linear-gradient(180deg, var(--gm-ink-850) 0%, var(--gm-ink-900) 100%);
  }
  body:has(#tickets-page:not(.hidden)) .app-shell { padding-bottom: 0; }
  #tickets-page.ticket-page { display: block !important; padding: 0 0 144px; overflow: visible; }
  #tickets-page .ticket-topline {
    display: grid; grid-template-columns: 1fr auto auto !important; align-items: center;
    min-height: 118px; padding: 27px 39px 17px !important;
  }
  #tickets-page .ticket-topline h2 { margin: 0; font-size: 40px; font-weight:700; letter-spacing: -.025em; }
  #tickets-page .ticket-total { color: var(--gm-violet-400); font-size: 40px; font-weight:500; }
  #tickets-page .ticket-create-fab { display: none !important; }
  #tickets-page .ticket-limit-note { display: none; }
  #tickets-page .ticket-search {
    display: flex; align-items: center; gap: 20px; height: 78px; margin: 0 39px 32px; padding: 0 22px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.28); border-radius: 16px;
    background: linear-gradient(110deg, rgb(var(--gm-ink-600-rgb) / 0.5), rgb(var(--gm-ink-750-rgb) / 0.56)); color: var(--gm-ink-300);
  }
  #tickets-page .ticket-search .a2-icon { width: 39px; height: 39px; flex: 0 0 auto; stroke-width: 1.7; }
  #tickets-page .ticket-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--gm-ink-50); font-size: 28px; }
  #tickets-page .ticket-search input::placeholder { color: var(--gm-ink-300); opacity: 1; }

  #tickets-page .ticket-filters {
    display: grid; grid-template-columns: 114px 1.55fr 1.75fr 1.78fr; gap: 18px;
    padding: 0 34px 23px !important; overflow: visible;
  }
  #tickets-page .ticket-chip {
    display: flex; align-items: center; justify-content: center; gap: 16px;
    width: 100%; min-width: 0; height: 67px; padding: 0 15px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.28); border-radius: 16px;
    background: rgb(var(--gm-ink-850-rgb) / 0.38); color: var(--gm-ink-300); font-size: 26px; font-weight:400;
    overflow: visible; text-overflow: clip;
  }
  #tickets-page .ticket-chip.active { border-color: var(--gm-violet-400); background: rgb(var(--gm-violet-500-rgb) / 0.1); color: var(--gm-violet-400); box-shadow: 0 0 0 1px rgb(var(--gm-violet-400-rgb) / 0.083); }
  #tickets-page .ticket-chip-count { color: var(--gm-violet-400); font-size: 26px; font-weight:500; }
  #tickets-page [data-ticket-status="in_progress"] .ticket-chip-count { color: var(--gm-gold-500); }
  #tickets-page [data-ticket-status="closed"] .ticket-chip-count { color: var(--gm-ink-300); }

  #tickets-page .ticket-extra-filters, #tickets-page .ticket-toolbar {
    display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 18px !important;
    padding: 0 34px 31px !important;
  }
  #tickets-page .ticket-extra-filters.hidden { display: grid !important; }
  #tickets-page .ticket-extra-filters select, #tickets-page .ticket-toolbar select {
    height: 68px !important; padding: 0 54px 0 29px !important;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.28) !important; border-radius: 16px !important;
    background-color: rgb(var(--gm-ink-850-rgb) / 0.32) !important; color: var(--gm-ink-300) !important;
    font-size: 24px !important; text-overflow: ellipsis;
  }
  #tickets-page .ticket-scope { display: none !important; }
  #tickets-page .ticket-list { margin: 0; border: 0; }
  #tickets-page .ticket-group-heading {
    height: 59px; margin: 0; padding: 4px 39px 0; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.17);
    color: var(--gm-ink-300); font-size: 26px; font-weight:400; line-height: 55px;
  }
  #tickets-page .ticket-group-recent { height: 82px; padding-top: 23px; }
  #tickets-page .ticket-item {
    display: grid; grid-template-columns: 102px minmax(0,1fr) 34px; gap: 35px; align-items: center;
    min-height: 146px; padding: 20px 38px; border: 0; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.17);
    border-radius: 0; background: rgb(var(--gm-ink-850-rgb) / 0.18); box-shadow: none;
  }
  #tickets-page .ticket-item.ticket-search-hidden { display: none; }
  #tickets-page .ticket-item-icon {
    position: relative; display: grid; place-items: center; width: 91px; height: 91px;
    border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.09); border-radius: 24px;
    background: rgb(var(--gm-violet-700-rgb) / 0.13); color: transparent; font-size: 0;
  }
  #tickets-page .ticket-item-icon::before {
    content: ''; width: 46px; height: 46px; transform: rotate(-42deg);
    border: 4px solid var(--gm-violet-500); border-radius: 8px;
    -webkit-mask: linear-gradient(var(--gm-ink-950) 0 0); mask: linear-gradient(var(--gm-ink-950) 0 0);
  }
  #tickets-page .ticket-item-icon::after { right: -8px; top: 35px; width: 15px; height: 15px; background: var(--gm-violet-500); }
  #tickets-page .ticket-item:has(.ticket-status[data-status="in_progress"]) .ticket-item-icon { border-color: rgb(var(--gm-ink-50-rgb) / 0.10); background: rgb(var(--gm-gold-700-rgb) / 0.13); }
  #tickets-page .ticket-item:has(.ticket-status[data-status="in_progress"]) .ticket-item-icon::before { border-color: var(--gm-line-strong); }
  #tickets-page .ticket-item:has(.ticket-status[data-status="in_progress"]) .ticket-item-icon::after { background: var(--gm-gold-500); }
  #tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) { opacity: .58; }
  #tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) .ticket-item-icon::before { border-color: var(--gm-green-500); }
  #tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) .ticket-item-icon::after { background: var(--gm-green-500); }
  #tickets-page .ticket-item-main { min-width: 0; align-self: center; }
  #tickets-page .ticket-item-top { display: flex; align-items: start; gap: 18px; }
  #tickets-page .ticket-item-top > strong { font-size: 28px; line-height: 1.2; font-weight:500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #tickets-page .ticket-item-badges { margin-left: auto; }
  #tickets-page .ticket-priority { display: none; }
  #tickets-page .ticket-status { padding: 5px 14px; border: 1px solid var(--gm-violet-500); border-radius: 8px; background: transparent; color: var(--gm-violet-400); font-size: 22px; font-weight:400; white-space: nowrap; }
  #tickets-page .ticket-status[data-status="open"] { font-size: 0; }
  #tickets-page .ticket-status[data-status="open"]::after { content: 'Новый'; font-size: 22px; }
  #tickets-page .ticket-status[data-status="in_progress"] { border-color: var(--gm-line-strong); color: var(--gm-gold-500); }
  #tickets-page .ticket-status[data-status="closed"] { border-color: var(--gm-green-500); color: var(--gm-green-500); }
  #tickets-page .ticket-item-meta { margin: 7px 0 0; color: var(--gm-ink-300); font-size: 24px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #tickets-page .ticket-item-meta::first-letter { color: var(--gm-ink-300); }
  #tickets-page .ticket-assignee-line { margin: 7px 0 0; color: var(--gm-ink-300); font-size: 20px; line-height: 1.2; }
  #tickets-page .ticket-last-message { display: none; }
  #tickets-page .ticket-time { margin: 7px 0 0; color: var(--gm-ink-300); font-size: 20px; line-height: 1.2; text-align: right; }
  #tickets-page .member-arrow { color: var(--gm-ink-300); font-size: 48px; font-weight:400; }
  #tickets-page .ticket-unread { display: none !important; }

  body:has(#tickets-page:not(.hidden)) .bottom-nav {
    left: 0; right: 0; bottom: 0; width: 100%; height: 192px; padding: 24px 15px max(18px, env(safe-area-inset-bottom));
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.2); border-radius: 28px 28px 0 0;
    background: rgb(var(--gm-ink-800-rgb) / 0.88); box-shadow: 0 -18px 54px rgb(var(--gm-ink-950-rgb) / 0.22);
    transform: none; backdrop-filter: blur(30px) saturate(130%);
  }
  body:has(#tickets-page:not(.hidden)) .nav-item { min-height: 120px; gap: 10px; border-radius: 20px; background: transparent; }
  body:has(#tickets-page:not(.hidden)) .nav-item.active { background: transparent; color: var(--gm-violet-400); }
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph { width: 52px; height: 52px; }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon { width: 49px; height: 49px; stroke-width: 1.75; }
  body:has(#tickets-page:not(.hidden)) .nav-item small { font-size: 24px; }
}

@media (max-width: 430px) {
  #tickets-page .ticket-topline { min-height: 55px; padding: 15px 18px 6px !important; }
  #tickets-page .ticket-topline h2 { font-size: 20px; }
  #tickets-page .ticket-total { font-size: 18px; }
  #tickets-page .ticket-search { height: 36px; margin: 0 18px 15px; padding: 0 11px; gap: 9px; border-radius: 8px; }
  #tickets-page .ticket-search .a2-icon { width: 20px; height: 20px; }
  #tickets-page .ticket-search input { font-size: 14px; }
  #tickets-page .ticket-filters { grid-template-columns: .8fr 1.25fr 1.55fr 1.45fr; gap: 9px; padding: 0 16px 11px !important; }
  #tickets-page .ticket-chip { height: 31px; min-height: 31px; padding: 0 6px; gap: 6px; border-radius: 8px; font-size: 13px; }
  #tickets-page .ticket-chip-count { font-size: 13px; }
  #tickets-page .ticket-extra-filters, #tickets-page .ticket-toolbar { gap: 9px !important; padding: 0 16px 14px !important; }
  #tickets-page .ticket-extra-filters select, #tickets-page .ticket-toolbar select { height: 32px !important; padding: 0 25px 0 13px !important; border-radius: 8px !important; font-size: 13px !important; }
  #tickets-page .ticket-group-heading { height: 28px; padding: 0 18px; font-size: 13px; line-height: 28px; }
  #tickets-page .ticket-group-recent { height: 39px; padding-top: 11px; }
  #tickets-page .ticket-item { grid-template-columns: 49px minmax(0,1fr) 14px; gap: 14px; min-height: 68px; padding: 8px 17px; }
  #tickets-page .ticket-item-icon { width: 43px; height: 43px; border-radius: 12px; }
  #tickets-page .ticket-item-icon::before { width: 22px; height: 22px; border-width: 2px; border-radius: 4px; }
  #tickets-page .ticket-item-icon::after { right: -4px; top: 17px; width: 8px; height: 8px; }
  #tickets-page .ticket-item-top > strong { font-size: 14px; }
  #tickets-page .ticket-status { padding: 2px 6px; border-radius: 4px; font-size: 11px; }
  #tickets-page .ticket-status[data-status="open"]::after { font-size: 11px; }
  #tickets-page .ticket-item-meta { margin-top: 2px; font-size: 12px; }
  #tickets-page .ticket-assignee-line { margin-top: 2px; font-size: 10px; }
  #tickets-page .ticket-time { margin-top: 2px; font-size: 10px; }
  #tickets-page .member-arrow { font-size: 26px; }
  body:has(#tickets-page:not(.hidden)) .bottom-nav { height: 91px; padding: 10px 7px max(7px, env(safe-area-inset-bottom)); border-radius: 16px 16px 0 0; }
  body:has(#tickets-page:not(.hidden)) .nav-item { min-height: 66px; gap: 3px; border-radius: 12px; }
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph { width: 28px; height: 28px; }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon { width: 26px; height: 26px; }
  body:has(#tickets-page:not(.hidden)) .nav-item small { font-size: 12px; }
}

/* v14 — production WebView calibration against the approved ticket reference. */
@media (max-width: 560px) {
  body:has(#tickets-page:not(.hidden)) .profile-settings-button {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    place-items: center;
    margin-left: auto;
    color: var(--gm-ink-300);
    background: transparent;
  }
}

@media (max-width: 430px) {
  #tickets-page.ticket-page { padding-bottom: 104px; }
  #tickets-page .ticket-item {
    min-height: 64px;
    padding-top: 7px;
    padding-bottom: 7px;
  }
  body:has(#tickets-page:not(.hidden)) .bottom-nav {
    height: 76px;
    padding: 7px 7px max(5px, env(safe-area-inset-bottom));
    border-radius: 16px 16px 0 0;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item {
    min-height: 58px;
    gap: 2px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph {
    width: 25px;
    height: 25px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon {
    width: 24px;
    height: 24px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item small { font-size: 11px; }
}

/* v15 — production fixes from the Android Telegram WebView screenshot. */
@media (max-width: 560px) {
  #tickets-page .ticket-search {
    box-sizing: border-box;
    width: auto;
    max-width: calc(100% - 78px);
    min-width: 0;
  }
  #tickets-page .ticket-search input {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
  }

  #tickets-page .ticket-item.ticket-row-even {
    background: linear-gradient(90deg, rgba(28, 25, 43, .42), rgba(16, 22, 32, .28));
  }
  #tickets-page .ticket-item.ticket-row-odd {
    background: linear-gradient(90deg, rgba(10, 17, 26, .18), rgba(18, 25, 36, .34));
  }
  #tickets-page .ticket-item.has-unread {
    background-color: transparent;
  }

  #tickets-page .ticket-item-icon::before { display: none; }
  #tickets-page .ticket-item-icon .a2-icon {
    display: block;
    width: 52%;
    height: 52%;
    color: #ae5cff;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
  }
  #tickets-page .ticket-item:has(.ticket-status[data-status="in_progress"]) .ticket-item-icon .a2-icon { color: #f6a21a; }
  #tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) .ticket-item-icon .a2-icon { color: #6fa274; }
}

@media (max-width: 430px) {
  #tickets-page .ticket-search { max-width: calc(100% - 36px); }
}

/* v16 — stable ticket controls and compact Android navigation. */
@media (max-width: 560px) {
  #tickets-page .ticket-item-icon > * { display: none !important; }
  #tickets-page .ticket-item-icon::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 0;
    background: var(--gm-violet-500);
    transform: none;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v4a2 2 0 0 0 0 4v4H4v-4a2 2 0 0 0 0-4V6Z' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 8v8' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v4a2 2 0 0 0 0 4v4H4v-4a2 2 0 0 0 0-4V6Z' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 8v8' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  #tickets-page .ticket-item:has(.ticket-status[data-status="in_progress"]) .ticket-item-icon::before { background-color: var(--gm-gold-500); }
  #tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) .ticket-item-icon::before { background-color: var(--gm-green-500); }
}

@media (max-width: 430px) {
  #tickets-page.ticket-page { padding-bottom: 86px; }
  body:has(#tickets-page:not(.hidden)) .bottom-nav {
    height: 64px;
    padding: 5px 7px max(4px, env(safe-area-inset-bottom));
    border-radius: 16px 16px 0 0;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item {
    min-height: 48px;
    gap: 1px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph { width: 22px; height: 22px; }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon { width: 21px; height: 21px; }
  body:has(#tickets-page:not(.hidden)) .nav-item small { font-size: 10px; }
}

/* v17 — reference-sized diagonal ticket marks and a one-third shorter nav. */
@media (max-width: 560px) {
  #tickets-page .ticket-item-icon::before {
    width: 32px;
    height: 32px;
    transform: rotate(-45deg);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5 9h22v5a3 3 0 0 0 0 6v5H5v-5a3 3 0 0 0 0-6V9Z' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 11.5v1M16 15.5v1M16 19.5v1M16 23.5v.2' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5 9h22v5a3 3 0 0 0 0 6v5H5v-5a3 3 0 0 0 0-6V9Z' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 11.5v1M16 15.5v1M16 19.5v1M16 23.5v.2' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  }
}

@media (max-width: 430px) {
  #tickets-page.ticket-page { padding-bottom: 60px; }
  body:has(#tickets-page:not(.hidden)) .bottom-nav {
    height: 43px;
    padding: 2px 7px max(2px, env(safe-area-inset-bottom));
    border-radius: 12px 12px 0 0;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item {
    min-height: 32px;
    gap: 0;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph { width: 16px; height: 16px; }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon { width: 15px; height: 15px; }
  body:has(#tickets-page:not(.hidden)) .nav-item small { font-size: 8px; line-height: 1; }
}

/* v18 — clean ticket outline and 2.5x navigation contents. */
@media (max-width: 560px) {
  #tickets-page .ticket-item-icon::before {
    width: 32px;
    height: 32px;
    transform: rotate(-45deg);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5 9h22v5a3 3 0 0 0 0 6v5H5v-5a3 3 0 0 0 0-6V9Z' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5 9h22v5a3 3 0 0 0 0 6v5H5v-5a3 3 0 0 0 0-6V9Z' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  #tickets-page .ticket-item-icon::after {
    right: -5px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: translateY(-50%);
  }
}

@media (max-width: 430px) {
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph { width: 40px; height: 40px; }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon { width: 37.5px; height: 37.5px; }
  body:has(#tickets-page:not(.hidden)) .nav-item small { font-size: 20px; line-height: 1; }
}

/* v19 — ticket mark without a status dot and readable compact nav labels. */
@media (max-width: 560px) {
  #tickets-page .ticket-item-icon::after {
    content: none;
    display: none !important;
  }
}

@media (max-width: 430px) {
  body:has(#tickets-page:not(.hidden)) .nav-item small {
    max-width: 100%;
    overflow: visible;
    font-size: 12px;
    line-height: 1;
    white-space: nowrap;
    text-overflow: clip;
  }
}

/* v20 — one navigation surface for every primary tab. */
@media (max-width: 560px) {
  .bottom-nav {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.2);
    background: rgb(var(--gm-ink-800-rgb) / 0.88);
    box-shadow: 0 -18px 54px rgb(var(--gm-ink-950-rgb) / 0.22);
    transform: none;
    backdrop-filter: blur(30px) saturate(130%);
  }
  .nav-item::before { display: none; }
  .nav-item.active { background: transparent; color: var(--gm-violet-400); }
}

@media (max-width: 430px) {
  .bottom-nav {
    height: 43px;
    padding: 2px 7px max(2px, env(safe-area-inset-bottom));
    border-radius: 12px 12px 0 0;
  }
  .nav-item { min-height: 32px; gap: 0; border-radius: 12px; }
  .nav-item .nav-glyph { width: 40px; height: 40px; }
  .nav-item .a2-icon { width: 37.5px; height: 37.5px; }
  .nav-item small {
    max-width: 100%;
    overflow: visible;
    font-size: 12px;
    line-height: 1;
    white-space: nowrap;
    text-overflow: clip;
  }
}


/* v22: hidden dynamic ticket surfaces must override the ticket layout display rule. */
#tickets-page.ticket-page.hidden,
#ticket-detail-page.hidden {
  display: none !important;
}

/* v24 — Members screen matched to the supplied reference (image 1). */
@media (max-width: 4096px) {
  body:has(#community-page:not(.hidden)) .profile-settings-button { visibility: hidden; pointer-events: none; }
  #community-page { padding: 0 0 72px; color: var(--gm-ink-50); background: var(--gm-ink-900); }
  #community-page > .text-button,
  #community-page > .community-hero { display: none !important; }
  #community-page .members-page-heading {
    display: flex; align-items: center; justify-content: space-between;
    min-height: 61px; margin: 0; padding: 19px 20px 12px;
  }
  #community-page .members-page-heading h2 {
    margin: 0; color: var(--gm-ink-50); font-size: 24px; font-weight:700;
    line-height: 1.2; letter-spacing: -.025em;
  }
  #community-page .members-page-heading .counter {
    color: var(--gm-violet-500); font-size: 22px; font-weight:400; line-height: 1;
  }
  #community-page .sticky-search {
    position: static; z-index: auto; padding: 0 20px 14px; overflow: visible;
    border: 0; background: transparent; backdrop-filter: none;
  }
  #community-page .search-box {
    height: 46px; gap: 12px; padding: 0 14px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.27); border-radius: 8px;
    background: rgb(var(--gm-ink-800-rgb) / 0.38); color: var(--gm-ink-300);
  }
  #community-page .search-box .a2-icon,
  #community-page .search-box > span {
    width: 21px; height: 21px; color: var(--gm-ink-300); font-size: 0;
  }
  #community-page .search-box input {
    height: 100%; padding: 0; color: var(--gm-ink-50); font-size: 14px; font-weight:400;
  }
  #community-page .search-box input::placeholder { color: var(--gm-ink-300); opacity: 1; }
  #community-page .filter-chips {
    display: grid; grid-template-columns: 1.08fr 2fr .98fr 1fr;
    gap: 8px; width: 100%; margin: 14px 0 0; padding: 0; overflow: visible;
  }
  #community-page .filter-chip {
    min-width: 0; min-height: 36px; padding: 7px 6px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.27); border-radius: 8px;
    background: rgb(var(--gm-ink-850-rgb) / 0.25); color: var(--gm-ink-300);
    font-size: 14px; font-weight:400; white-space: nowrap;
  }
  #community-page .filter-chip.active {
    border-color: var(--gm-violet-400); background: rgb(var(--gm-violet-500-rgb) / 0.12); color: var(--gm-violet-400);
    box-shadow: none;
  }
  #community-page .filter-chip[data-restriction="warn"],
  #community-page .filter-chip[data-restriction="none"] { display: none; }
  #community-page .section { margin: 0; }
  #community-page .section-heading {
    min-height: 39px; margin: 0; padding: 12px 20px 9px;
    border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13);
    border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13);
  }
  #community-page .section-heading .eyebrow { display: none; }
  #community-page .section-heading h2 {
    margin: 0; color: var(--gm-ink-300); font-size: 15px; font-weight:400;
    line-height: 1.2; letter-spacing: 0;
  }
  #community-page .counter {
    padding: 0; border-radius: 0; background: transparent;
    color: var(--gm-violet-500); font-size: 16px; font-weight:400;
  }
  #community-page .staff-team-list,
  #community-page .member-list { padding: 0; }
  #community-page .staff-team-row,
  #community-page .member-row {
    width: 100%; min-height: 76px; margin: 0; padding: 8px 20px;
    border: 0; border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.12);
    border-radius: 0; background: transparent; box-shadow: none;
  }
  #community-page .staff-team-row {
    grid-template-columns: 58px minmax(0,1fr) auto; gap: 16px;
  }
  #community-page .member-row { gap: 16px; }
  #community-page .member-avatar,
  #community-page .staff-team-row .member-avatar {
    flex: 0 0 58px; width: 58px; height: 58px;
    border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.88); border-radius: 50%; background: var(--gm-ink-750);
  }
  #community-page .staff-team-copy strong,
  #community-page .member-name {
    color: var(--gm-ink-50); font-size: 17px; font-weight:600; line-height: 1.15;
  }
  #community-page .staff-team-copy span,
  #community-page .member-subline {
    margin-top: 5px; color: var(--gm-violet-500); font-size: 15px; line-height: 1.15;
  }
  #community-page .members-row-tail {
    display: flex; align-items: center; justify-content: flex-end; gap: 10px;
    min-width: 0; margin-left: auto;
  }
  #community-page .member-role {
    max-width: 140px; overflow: hidden; color: var(--gm-ink-300); font-size: 14px;
    font-weight:400; line-height: 1.2; text-align: right; text-overflow: ellipsis; white-space: nowrap;
  }
  #community-page .member-restrictions {
    display: flex; align-items: center; gap: 5px; margin-left: auto;
  }
  #community-page .member-restrictions:not(:empty) + .members-row-tail .member-role { display: none; }
  #community-page .restriction-icon {
    width: auto; height: auto; padding: 0; border: 0; border-radius: 0;
    background: transparent; color: var(--gm-red-500); font-size: 14px; line-height: 1.2;
    white-space: nowrap;
  }
  #community-page .member-arrow { color: var(--gm-ink-300); font-size: 28px; font-weight:400; line-height: 1; }
  #community-page .staff-team-copy small,
  #community-page .staff-team-rating { display: none !important; }
  #community-page .members-source-count,
  #community-page .members-staff-duplicate { display: none !important; }
  #community-page #member-empty { margin: 16px 20px; }
}

@media (max-width: 380px) {
  #community-page .members-page-heading,
  #community-page .sticky-search,
  #community-page .section-heading,
  #community-page .staff-team-row,
  #community-page .member-row { padding-left: 16px; padding-right: 16px; }
  #community-page .staff-team-list,
  #community-page .member-list { padding: 0 !important; }
  #community-page .filter-chips { grid-template-columns: .95fr 2.15fr .85fr .85fr; gap: 6px; }
  #community-page .filter-chip { font-size: 11px; }
  #community-page .staff-team-row,
  #community-page .member-row { gap: 12px; }
  #community-page .member-role { max-width: 120px; font-size: 13px; }
}

/* v25 — Members header, search, filters and backdrop match the Tickets screen. */
@media (max-width: 560px) {
  body:has(#community-page:not(.hidden)) {
    background:
      radial-gradient(ellipse at 52% 22%, rgb(var(--gm-ink-600-rgb) / 0.23), transparent 42%),
      linear-gradient(180deg, var(--gm-ink-850) 0%, var(--gm-ink-900) 100%);
  }
  body:has(#community-page:not(.hidden)) .app-shell {
    padding-bottom: 0;
    background: transparent;
  }
  #community-page {
    background: transparent;
  }
  #community-page .members-page-heading {
    min-height: 118px;
    padding: 27px 39px 17px;
  }
  #community-page .members-page-heading h2 {
    font-size: 40px;
    font-weight:700;
    letter-spacing: -.025em;
  }
  #community-page .members-page-heading .counter {
    font-size: 40px;
    font-weight:500;
  }
  #community-page .sticky-search {
    padding: 0 0 23px;
  }
  #community-page .search-box {
    width: auto;
    height: 78px;
    margin: 0 39px 32px;
    padding: 0 22px;
    gap: 20px;
    border-radius: 16px;
    background: linear-gradient(110deg, rgb(var(--gm-ink-600-rgb) / 0.5), rgb(var(--gm-ink-750-rgb) / 0.56));
  }
  #community-page .search-box .a2-icon,
  #community-page .search-box > span {
    width: 39px;
    height: 39px;
  }
  #community-page .search-box input { font-size: 28px; }
  #community-page .filter-chips {
    grid-template-columns: 1.08fr 2fr .98fr 1fr;
    gap: 18px;
    width: auto;
    margin: 0;
    padding: 0 34px;
  }
  #community-page .filter-chip {
    height: 67px;
    min-height: 67px;
    padding: 0 15px;
    border-radius: 16px;
    font-size: 26px;
    font-weight:400;
  }
}

@media (max-width: 430px) {
  #community-page .members-page-heading {
    min-height: 55px;
    padding: 15px 18px 6px;
  }
  #community-page .members-page-heading h2 { font-size: 20px; }
  #community-page .members-page-heading .counter { font-size: 18px; }
  #community-page .sticky-search {
    padding: 0 0 11px;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  #community-page .search-box {
    height: 36px;
    margin: 0 18px 15px;
    padding: 0 11px;
    gap: 9px;
    border-radius: 8px;
  }
  #community-page .search-box .a2-icon,
  #community-page .search-box > span {
    width: 20px;
    height: 20px;
  }
  #community-page .search-box input { font-size: 14px; }
  #community-page .filter-chips {
    grid-template-columns: .85fr 2.25fr .9fr .9fr;
    gap: 9px;
    margin: 0;
    padding: 0 16px;
  }
  #community-page .filter-chip {
    height: 31px;
    min-height: 31px;
    padding: 0 6px;
    border-radius: 8px;
    font-size: 13px;
  }
}

/* v26 — Home rebuilt to the approved dashboard reference. */
@media (max-width: 4096px) {
  body:has(#home-page:not(.hidden)) {
    background:
      radial-gradient(ellipse at 52% 22%, rgb(var(--gm-ink-600-rgb) / 0.23), transparent 42%),
      linear-gradient(180deg, var(--gm-ink-850) 0%, var(--gm-ink-900) 100%);
  }
  body:has(#home-page:not(.hidden)) .app-shell {
    padding-bottom: 0;
    background: transparent;
  }
  #home-page {
    --home-gutter: clamp(16px, 4.3vw, 20px);
    padding: 0 0 28px;
    background: transparent;
  }
  #home-page .home-page-heading {
    display: grid;
    gap: 3px;
    height: clamp(60px, 16.4vw, 69px);
    min-height: clamp(60px, 16.4vw, 69px);
    padding: clamp(13px, 3.6vw, 15px) var(--home-gutter) clamp(7px, 2.1vw, 9px);
  }
  #home-page .home-page-heading h2,
  #home-page .home-page-heading p { margin: 0; }
  #home-page .home-page-heading h2 {
    color: var(--gm-ink-50);
    font-size: clamp(20px, 5.25vw, 22px);
    font-weight:700;
    line-height: 1.14;
    letter-spacing: -.025em;
  }
  #home-page .home-page-heading p {
    color: var(--gm-violet-500);
    font-size: clamp(13px, 3.34vw, 14px);
    font-weight:500;
    line-height: 1.2;
  }

  #home-page .home-overview-card {
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(126px, .98fr);
    align-items: stretch;
    width: calc(100% - (var(--home-gutter) * 2));
    height: clamp(140px, 38.6vw, 162px);
    min-height: clamp(140px, 38.6vw, 162px);
    margin: 0 var(--home-gutter);
    overflow: hidden;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.28);
    border-radius: 16px;
    background: linear-gradient(120deg, rgb(var(--gm-ink-800-rgb) / 0.78), rgb(var(--gm-ink-850-rgb) / 0.54));
    box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.018);
  }
  #home-page .home-overview-card .profile-card {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 13px;
    width: 100%;
    height: 100% !important;
    min-height: 0;
    margin: 0 !important;
    padding: 20px 15px 20px 17px;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  #home-page .home-overview-card .profile-card::after { content: none; display: none; }
  #home-page .home-overview-card .avatar {
    width: 72px;
    height: 72px;
    border: 1.5px solid rgb(var(--gm-ink-50-rgb) / 0.94);
    border-radius: 50%;
    background: var(--gm-ink-750);
  }
  #home-page .home-overview-card .profile-copy { min-width: 0; }
  #home-page .home-overview-card .profile-copy h2 {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    overflow: hidden;
    color: var(--gm-ink-50);
    font-size: 17px;
    font-weight:700;
    line-height: 1.16;
    letter-spacing: -.02em;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #home-page .home-overview-card .profile-copy h2::before {
    content: '♞';
    flex: 0 0 auto;
    color: var(--gm-ink-50);
    font-size: 16px;
    line-height: 1;
  }
  #home-page .home-overview-card .profile-copy p {
    margin: 7px 0 0;
    color: var(--gm-violet-500);
    font-size: 14px;
    line-height: 1.15;
  }
  #home-page .home-overview-card .role-badge {
    margin-top: 9px;
    color: var(--gm-ink-300);
    font-size: 12px;
    font-weight:400;
    line-height: 1.2;
  }
  #home-page #staff-rating-home { display: none !important; }

  #home-page .home-overview-card .chat-rating-home {
    --home-rating-progress: 360deg;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto clamp(66px, 19vw, 80px) auto;
    align-content: center;
    justify-items: center;
    gap: 7px;
    width: 100%;
    height: 100% !important;
    min-height: 0;
    margin: 0 !important;
    padding: clamp(12px, 3.8vw, 16px) 10px;
    border: 0 !important;
    border-left: 1px solid rgb(var(--gm-ink-300-rgb) / 0.2) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit;
    text-align: center;
  }
  #home-page .home-overview-card .chat-rating-home::before,
  #home-page .home-overview-card .chat-rating-home::after { content: none; display: none; }
  #home-page .home-overview-card .chat-rating-home-head { display: contents; }
  #home-page .home-overview-card .chat-rating-home-head span {
    grid-column: 1;
    grid-row: 1;
    color: var(--gm-ink-300);
    font-size: 12px;
    font-weight:400;
    line-height: 1.15;
    overflow: visible;
    text-overflow: clip;
  }
  #home-page .home-overview-card .chat-rating-home-head strong {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(66px, 19vw, 80px);
    height: clamp(66px, 19vw, 80px);
    border-radius: 50%;
    background:
      radial-gradient(circle, var(--gm-ink-800) 65%, transparent 67%),
      conic-gradient(var(--gm-violet-500) 0 var(--home-rating-progress), rgb(var(--gm-violet-500-rgb) / 0.18) var(--home-rating-progress) 360deg);
    color: var(--gm-ink-50);
    font-size: 20px;
    font-weight:600;
    line-height: 1;
    letter-spacing: -.035em;
  }
  #home-page .home-overview-card .chat-rating-home-head strong .home-rating-current {
    color: var(--gm-ink-50);
    font-size: 20px;
    font-weight:600;
    line-height: 1;
  }
  #home-page .home-overview-card .chat-rating-home-head strong .home-rating-max {
    color: var(--gm-violet-500);
    font-size: 13px;
    font-weight:500;
    line-height: 1;
  }
  #home-page .home-overview-card .chat-rating-home small {
    grid-column: 1;
    grid-row: 3;
    margin: 0;
    overflow: visible;
    color: var(--gm-ink-300);
    font-size: 11px;
    font-weight:400;
    line-height: 1.15;
    text-overflow: clip;
    white-space: nowrap;
  }

  #home-page .quick-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(8px, 2.15vw, 9px);
    width: calc(100% - (var(--home-gutter) * 2));
    margin: clamp(12px, 3.34vw, 14px) var(--home-gutter) 0;
    padding: 0 !important;
    border: 0;
    background: transparent;
  }
  #home-page .quick-card {
    display: grid;
    grid-template-columns: 39px minmax(0, 1fr) 14px;
    grid-template-rows: 1fr 1fr;
    align-items: center;
    column-gap: 11px;
    row-gap: 2px;
    width: 100% !important;
    height: clamp(67px, 18.6vw, 78px) !important;
    min-height: clamp(67px, 18.6vw, 78px) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 13px 12px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.28) !important;
    border-radius: 12px !important;
    background: linear-gradient(120deg, rgb(var(--gm-ink-750-rgb) / 0.72), rgb(var(--gm-ink-850-rgb) / 0.48)) !important;
    box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.015) !important;
    color: inherit;
    text-align: left;
  }
  #home-page .quick-icon {
    grid-column: 1;
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.08);
    border-radius: 8px;
    background: linear-gradient(145deg, rgb(var(--gm-violet-800-rgb) / 0.54), rgb(var(--gm-ink-750-rgb) / 0.72));
    color: var(--gm-violet-500);
  }
  #home-page .quick-icon .a2-icon { width: 23px; height: 23px; stroke-width: 1.8; }
  #home-page .quick-copy {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: center;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 4px;
    min-width: 0;
  }
  #home-page .quick-copy small {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: auto;
    min-width: 0;
    overflow: hidden;
    color: var(--gm-ink-300);
    font-size: 12px;
    font-weight:400;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #home-page .quick-copy strong {
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: auto;
    max-width: 100%;
    overflow: hidden;
    color: var(--gm-ink-50);
    font-size: 14px;
    font-weight:500;
    line-height: 1.18;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #home-page .quick-card::after {
    content: '›';
    grid-column: 3;
    grid-row: 1 / 3;
    align-self: center;
    justify-self: end;
    color: var(--gm-ink-300);
    font-size: 28px;
    font-weight:400;
    line-height: 1;
  }

  #home-page > .section { margin: 0; }
  #home-page .section-heading {
    height: clamp(46px, 12.85vw, 54px);
    min-height: clamp(46px, 12.85vw, 54px);
    margin: clamp(9px, 2.62vw, 11px) var(--home-gutter) 0;
    padding: clamp(11px, 3.1vw, 13px) 0 clamp(7px, 1.9vw, 8px);
  }
  #home-page .section-heading h2 {
    color: var(--gm-ink-50);
    font-size: 18px;
    font-weight:700;
    line-height: 1.15;
    letter-spacing: -.025em;
  }
  #home-page .section-heading .counter {
    color: var(--gm-violet-500);
    font-size: 18px;
    font-weight:500;
  }
  #home-page .community-list { padding: 0 var(--home-gutter); }
  #home-page .community {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 13px;
    width: 100%;
    height: clamp(64px, 17.15vw, 72px);
    min-height: clamp(64px, 17.15vw, 72px);
    margin: 0;
    padding: 12px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.28) !important;
    border-radius: 12px !important;
    background: linear-gradient(120deg, rgb(var(--gm-ink-750-rgb) / 0.72), rgb(var(--gm-ink-850-rgb) / 0.48)) !important;
    box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.015) !important;
  }
  #home-page .home-community-mark {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.08);
    border-radius: 12px;
    background: linear-gradient(145deg, rgb(var(--gm-violet-800-rgb) / 0.54), rgb(var(--gm-ink-750-rgb) / 0.72));
    color: var(--gm-violet-500);
    font-size: 17px;
    font-style: italic;
    font-weight:700;
    letter-spacing: -.05em;
  }
  #home-page .community .member-name {
    color: var(--gm-ink-50);
    font-size: 16px;
    font-weight:600;
    line-height: 1.15;
  }
  #home-page .community .member-subline {
    margin-top: 5px;
    color: var(--gm-violet-500);
    font-size: 13px;
    line-height: 1.15;
  }
  #home-page .community-action {
    display: grid;
    place-items: center;
    width: 18px;
    min-width: 18px;
    height: 40px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gm-ink-300);
    font-size: 30px;
    font-weight:400;
    line-height: 1;
  }
}

@media (max-width: 380px) {
  #home-page .home-overview-card {
    grid-template-columns: minmax(0, 1.38fr) minmax(116px, .92fr);
  }
  #home-page .home-overview-card .profile-card {
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 10px;
    padding-left: 13px;
    padding-right: 10px;
  }
  #home-page .home-overview-card .avatar { width: 62px; height: 62px; }
  #home-page .home-overview-card .profile-copy h2 { font-size: 15px; }
  #home-page .home-overview-card .profile-copy p { font-size: 12px; }
  #home-page .quick-card { column-gap: 8px; padding-inline: 10px; }
  #home-page .quick-copy small { font-size: 11px; }
  #home-page .quick-copy strong { font-size: 13px; }
}

/* v28 — Keep member groups and counters coherent when app scaling crosses 560px. */
#community-page .members-source-count,
#community-page .members-staff-duplicate {
  display: none !important;
}

@media (min-width: 4097px) {
  #community-page .members-page-heading {
    display: none !important;
  }
}

/* v29 — Preserve readable ticket text while keeping closed-state accents muted. */
#tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) {
  opacity: 1;
}

#tickets-page .ticket-item-top > strong {
  color: var(--gm-ink-50);
}

#tickets-page .ticket-item-meta {
  color: var(--gm-ink-200);
}

#tickets-page .ticket-assignee-line,
#tickets-page .ticket-time {
  color: var(--gm-ink-200);
}

#tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) .ticket-item-icon,
#tickets-page .ticket-item:has(.ticket-status[data-status="closed"]) .ticket-status {
  opacity: .78;
}

/* v30 — Keep ticket filters readable and stable when desktop app scaling crosses 560px. */
#tickets-page .ticket-extra-filters.hidden {
  display: grid !important;
}

#tickets-page .ticket-extra-filters select,
#tickets-page .ticket-toolbar select {
  color-scheme: dark;
  border-color: rgb(var(--gm-ink-200-rgb) / 0.34) !important;
  background-color: var(--gm-ink-800) !important;
  color: var(--gm-ink-50) !important;
}

#tickets-page .ticket-extra-filters select option,
#tickets-page .ticket-toolbar select option {
  background: var(--gm-ink-800);
  color: var(--gm-ink-50);
}

@media (min-width: 561px) {
  body:has(#tickets-page:not(.hidden)) {
    padding-bottom: calc(88px + env(safe-area-inset-bottom));
    background:
      radial-gradient(ellipse at 52% 22%, rgb(var(--gm-ink-600-rgb) / 0.23), transparent 42%),
      linear-gradient(180deg, var(--gm-ink-850) 0%, var(--gm-ink-900) 100%);
  }

  body:has(#tickets-page:not(.hidden)) .app-shell {
    width: min(100%, 560px);
    padding-bottom: 0;
    background: transparent;
  }

  #tickets-page.ticket-page {
    display: block !important;
    padding: 0 0 96px;
    overflow: visible;
  }
  #tickets-page .ticket-topline {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center;
    min-height: 61px;
    padding: 19px 20px 12px !important;
  }
  #tickets-page .ticket-topline h2 {
    margin: 0;
    font-size: 24px;
    font-weight:700;
    letter-spacing: -.025em;
  }
  #tickets-page .ticket-total {
    color: var(--gm-violet-400);
    font-size: 22px;
    font-weight:500;
  }
  #tickets-page .ticket-create-fab,
  #tickets-page .ticket-limit-note {
    display: none !important;
  }

  #tickets-page .ticket-search {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 10px;
    width: auto;
    max-width: none;
    min-width: 0;
    height: 46px;
    margin: 0 20px 15px;
    padding: 0 14px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.32);
    border-radius: 8px;
    background: linear-gradient(110deg, rgb(var(--gm-ink-600-rgb) / 0.5), rgb(var(--gm-ink-750-rgb) / 0.56));
    color: var(--gm-ink-300);
  }
  #tickets-page .ticket-search .a2-icon {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    stroke-width: 1.7;
  }
  #tickets-page .ticket-search input {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--gm-ink-50);
    font-size: 15px;
  }
  #tickets-page .ticket-search input::placeholder {
    color: var(--gm-ink-300);
    opacity: 1;
  }

  #tickets-page .ticket-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 0 20px 12px !important;
    overflow: visible;
  }
  #tickets-page .ticket-chip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    min-width: 0;
    height: 36px;
    min-height: 36px;
    padding: 0 7px;
    overflow: hidden;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.3);
    border-radius: 8px;
    background: rgb(var(--gm-ink-850-rgb) / 0.25);
    color: var(--gm-ink-200);
    font-size: 14px;
    font-weight:400;
    white-space: nowrap;
  }
  #tickets-page .ticket-chip.active {
    border-color: var(--gm-violet-400);
    background: rgb(var(--gm-violet-500-rgb) / 0.12);
    color: var(--gm-violet-400);
  }
  #tickets-page .ticket-chip-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #tickets-page .ticket-chip-count {
    flex: 0 0 auto;
    color: var(--gm-violet-400);
    font-size: 14px;
    font-weight:600;
  }
  #tickets-page [data-ticket-status="in_progress"] .ticket-chip-count { color: var(--gm-gold-500); }
  #tickets-page [data-ticket-status="closed"] .ticket-chip-count { color: var(--gm-ink-200); }

  #tickets-page .ticket-extra-filters,
  #tickets-page .ticket-toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding: 0 20px 14px !important;
  }
  #tickets-page .ticket-extra-filters select,
  #tickets-page .ticket-toolbar select {
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    padding: 0 34px 0 13px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    text-overflow: ellipsis;
  }
  #tickets-page .ticket-scope { display: none !important; }

  #tickets-page .ticket-list {
    margin: 0;
    border: 0;
  }
  #tickets-page .ticket-group-heading {
    height: 38px;
    margin: 0;
    padding: 8px 20px 0;
    border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.17);
    color: var(--gm-ink-200);
    font-size: 14px;
    font-weight:500;
    line-height: 30px;
  }
  #tickets-page .ticket-group-recent {
    height: 46px;
    padding-top: 16px;
  }
}

/* v31 — Restore ticket creation and smooth the Telegram Desktop scale transition. */
#tickets-page .ticket-topline {
  grid-template-columns: minmax(0, 1fr) auto 44px !important;
  column-gap: 10px;
}

#tickets-page .ticket-create-fab {
  display: grid !important;
  place-items: center;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.16) !important;
  border-radius: 12px !important;
  background: rgb(var(--gm-violet-400-rgb) / 0.14) !important;
  color: var(--gm-violet-300) !important;
  font-size: 24px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

/* Windows renders the opened native menu as a light system surface. */
#ticket-create-sheet #ticket-category {
  color-scheme: light;
  appearance: none;
  width: 100%;
  min-width: 0;
  border-color: rgb(var(--gm-ink-200-rgb) / 0.38) !important;
  background-color: var(--gm-ink-800) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d7dbe3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") !important;
  background-position: right 13px center !important;
  background-repeat: no-repeat !important;
  background-size: 18px 18px !important;
  color: var(--gm-ink-50) !important;
}

#ticket-create-sheet #ticket-category option {
  background: var(--gm-ink-50) !important;
  color: var(--gm-ink-800) !important;
}

/* The old 853px reference layout must not activate in this intermediate band. */
@media (min-width: 431px) and (max-width: 560px) {
  body:has(#tickets-page:not(.hidden)) {
    padding-bottom: calc(88px + env(safe-area-inset-bottom));
  }

  #tickets-page.ticket-page {
    padding: 0 0 96px;
  }
  #tickets-page .ticket-topline {
    min-height: 63px;
    padding: 18px 20px 10px !important;
  }
  #tickets-page .ticket-topline h2 {
    font-size: 24px;
    font-weight:700;
    letter-spacing: -.025em;
  }
  #tickets-page .ticket-total {
    color: var(--gm-violet-400);
    font-size: 22px;
    font-weight:500;
  }
  #tickets-page .ticket-limit-note { display: none !important; }

  #tickets-page .ticket-search {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 10px;
    width: auto;
    max-width: none;
    min-width: 0;
    height: 44px;
    margin: 0 20px 15px;
    padding: 0 13px;
    border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.3);
    border-radius: 8px;
    background: linear-gradient(110deg, rgb(var(--gm-ink-600-rgb) / 0.5), rgb(var(--gm-ink-750-rgb) / 0.56));
    color: var(--gm-ink-300);
  }
  #tickets-page .ticket-search .a2-icon {
    flex: 0 0 auto;
    width: 21px;
    height: 21px;
  }
  #tickets-page .ticket-search input {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--gm-ink-50);
    font-size: 14px;
  }
  #tickets-page .ticket-search input::placeholder {
    color: var(--gm-ink-300);
    opacity: 1;
  }

  #tickets-page .ticket-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 0 20px 12px !important;
    overflow: visible;
  }
  #tickets-page .ticket-chip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
    height: 35px;
    min-height: 35px;
    padding: 0 6px;
    overflow: hidden;
    border-radius: 8px;
    font-size: 13px;
    white-space: nowrap;
  }
  #tickets-page .ticket-chip-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #tickets-page .ticket-chip-count {
    flex: 0 0 auto;
    font-size: 13px;
  }

  #tickets-page .ticket-extra-filters,
  #tickets-page .ticket-toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    padding: 0 20px 14px !important;
  }
  #tickets-page .ticket-extra-filters select,
  #tickets-page .ticket-toolbar select {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    padding: 0 32px 0 12px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
  }
  #tickets-page .ticket-scope { display: none !important; }

  #tickets-page .ticket-group-heading {
    height: 36px;
    padding: 7px 20px 0;
    font-size: 14px;
    line-height: 29px;
  }
  #tickets-page .ticket-group-recent {
    height: 44px;
    padding-top: 14px;
  }
  #tickets-page .ticket-item {
    grid-template-columns: 48px minmax(0, 1fr) 15px;
    gap: 13px;
    min-height: 76px;
    padding: 9px 20px;
  }
  #tickets-page .ticket-item-icon {
    width: 43px;
    height: 43px;
    border-radius: 12px;
  }
  #tickets-page .ticket-item-icon::before {
    width: 22px;
    height: 22px;
    border-width: 2px;
    border-radius: 4px;
  }
  #tickets-page .ticket-item-top { gap: 8px; }
  #tickets-page .ticket-item-top > strong { font-size: 15px; }
  #tickets-page .ticket-status {
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 11px;
  }
  #tickets-page .ticket-status[data-status="open"]::after { font-size: 11px; }
  #tickets-page .ticket-item-meta { margin-top: 3px; font-size: 12px; }
  #tickets-page .ticket-assignee-line { margin-top: 3px; font-size: 10px; }
  #tickets-page .ticket-time { margin-top: 3px; font-size: 10px; }
  #tickets-page .member-arrow { font-size: 26px; }

  body:has(#tickets-page:not(.hidden)) .bottom-nav {
    left: 0;
    right: 0;
    width: 100%;
    height: 82px;
    padding: 7px 7px max(7px, env(safe-area-inset-bottom));
    transform: none;
    border-radius: 16px 16px 0 0;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item {
    min-height: 58px;
    gap: 2px;
    border-radius: 12px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item .nav-glyph {
    width: 27px;
    height: 27px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item .a2-icon {
    width: 25px;
    height: 25px;
  }
  body:has(#tickets-page:not(.hidden)) .nav-item small {
    font-size: 11px;
    line-height: 1;
  }
}

/* v32 — The ticket title already has its own create button. */
body:has(#tickets-page:not(.hidden)) .profile-settings-button {
  display: none !important;
}

/* v33 — Keep limits visible and make the members layout continuous while zooming. */
#tickets-page .ticket-create-fab.hidden { display: none !important; }
#tickets-page .ticket-limit-note {
  display: block !important;
  min-height: 18px;
  color: var(--gm-ink-300);
}
#tickets-page .ticket-limit-note.ticket-limit-reached {
  box-sizing: border-box;
  width: calc(100% - 32px);
  max-width: calc(100% - 32px);
  margin: 0 16px 12px;
  padding: 9px 12px !important;
  border: 1px solid rgb(var(--gm-red-400-rgb) / 0.28);
  border-radius: 8px;
  background: rgb(var(--gm-gold-800-rgb) / 0.14);
  color: var(--gm-ink-200);
  overflow-wrap: anywhere;
}

.ticket-create-upload-state {
  display: grid;
  gap: 7px;
  margin-top: 10px;
  color: var(--gm-ink-200);
  font-size: 12px;
}
.ticket-create-upload-track {
  display: block;
  width: 100%;
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgb(var(--gm-ink-300-rgb) / 0.18);
}
.ticket-create-upload-track > span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--gm-violet-600), var(--gm-violet-400) 64%, var(--gm-teal-400));
  box-shadow: 0 0 12px rgb(var(--gm-violet-400-rgb) / 0.231);
  transition: width .18s ease;
}
#ticket-create-submit:disabled {
  opacity: .42;
  filter: saturate(.55);
  cursor: wait;
  box-shadow: none;
}

@media (max-width: 4096px) {
  #community-page .members-page-heading {
    min-height: clamp(55px, 14vw, 61px);
    padding: 15px 18px 8px;
  }
  #community-page .members-page-heading h2 { font-size: clamp(20px, 5vw, 24px); }
  #community-page .members-page-heading .counter {
    max-width: 48%;
    font-size: clamp(14px, 3.6vw, 17px);
    text-align: right;
    white-space: nowrap;
  }
  #community-page .sticky-search {
    padding: 0 0 12px;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  #community-page .search-box {
    height: clamp(36px, 9.5vw, 44px);
    margin: 0 18px 15px;
    padding: 0 12px;
    gap: 9px;
    border-radius: 8px;
  }
  #community-page .search-box .a2-icon,
  #community-page .search-box > span { width: 20px; height: 20px; }
  #community-page .search-box input { font-size: 14px; }
  #community-page .filter-chips {
    grid-template-columns: .85fr 2.25fr .9fr .9fr;
    gap: 9px;
    width: auto;
    margin: 0;
    padding: 0 16px;
  }
  #community-page .filter-chip {
    height: clamp(31px, 8vw, 36px);
    min-height: clamp(31px, 8vw, 36px);
    padding: 0 6px;
    border-radius: 8px;
    font-size: clamp(11px, 3vw, 13px);
  }
  #community-page .section-heading .counter {
    max-width: 52%;
    font-size: 13px;
    text-align: right;
    white-space: nowrap;
  }
}

/* v34 — one canonical app shell across Telegram/Desktop zoom levels. */
@media (max-width: 4096px) {
  html,
  body {
    min-width: 280px;
    background:
      radial-gradient(ellipse at 52% 22%, rgba(35, 48, 64, .23), transparent 42%),
      linear-gradient(180deg, #0b1119 0%, #080e15 100%);
    font-family: var(--gm-font-ui);
  }
  .app-shell {
    width: min(100%, 560px);
    max-width: 560px;
    min-height: 100dvh;
    margin: 0 auto;
    background: transparent;
  }
  .bottom-nav {
    left: 50%;
    right: auto;
    bottom: 0;
    width: min(100%, 560px);
    height: 82px;
    margin: 0;
    padding: 7px 7px max(7px, env(safe-area-inset-bottom));
    border: 1px solid rgba(139, 151, 172, .20);
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
    background: rgba(14, 21, 31, .92);
    box-shadow: 0 -18px 54px rgba(0, 0, 0, .22);
    transform: translateX(-50%);
    backdrop-filter: blur(30px) saturate(130%);
  }
  .nav-item {
    min-height: 58px;
    gap: 2px;
    border-radius: 11px;
  }
  .nav-item .nav-glyph { width: 27px; height: 27px; }
  .nav-item .a2-icon { width: 25px; height: 25px; }
  .nav-item small { font-size: 11px; line-height: 1; }
}

/* v35 — native per-chat settings hierarchy. */
#community-settings-page {
  --settings-line: rgb(var(--gm-ink-300-rgb) / 0.16);
  --settings-surface: rgb(var(--gm-ink-800-rgb) / 0.78);
  --settings-surface-strong: rgb(var(--gm-ink-850-rgb) / 0.94);
  gap: 0;
  padding-bottom: 18px;
}
#community-settings-page > #back-community-settings {
  margin: 3px 18px 10px;
  color: var(--gm-violet-400);
  font-size: 15px;
}
.settings-native-head {
  display: grid;
  gap: 6px;
  padding: 0 18px 20px;
  border-bottom: 1px solid var(--settings-line);
}
.settings-native-head h2 {
  margin: 0;
  font-size: clamp(28px, 7vw, 32px);
  line-height: 1.05;
  letter-spacing: -.035em;
}
.settings-native-head p {
  margin: 0;
  color: var(--gm-ink-300);
  font-size: 13px;
  line-height: 1.4;
}
.settings-destinations {
  display: grid;
  gap: 9px;
  padding: 15px 16px 18px;
}
.settings-destinations > h3 {
  margin: 0 2px 2px;
  color: var(--gm-ink-300);
  font-size: 13px;
  font-weight:600;
}
.settings-community-list {
  display: grid;
  gap: 9px;
}
.settings-community-item {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--settings-line);
  border-radius: 16px;
  background: linear-gradient(145deg, rgb(var(--gm-ink-750-rgb) / 0.88), rgb(var(--gm-ink-850-rgb) / 0.92));
  box-shadow: 0 16px 42px rgb(var(--gm-ink-950-rgb) / 0.16);
}
.settings-community-item.expanded {
  border-color: rgb(var(--gm-ink-50-rgb) / 0.14);
  box-shadow: 0 18px 50px rgb(var(--gm-ink-950-rgb) / 0.24), 0 0 0 1px rgb(var(--gm-violet-500-rgb) / 0.022);
}
.settings-community-summary {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto 22px;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 72px;
  padding: 10px 13px;
  border: 0;
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.settings-community-item.expanded .settings-community-summary {
  border-bottom: 1px solid var(--settings-line);
}
.settings-community-avatar {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  overflow: hidden;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.11);
  border-radius: 16px;
  object-fit: cover;
  color: var(--gm-ink-100);
  background: linear-gradient(145deg, var(--gm-violet-700), var(--gm-ink-750));
  font-size: 13px;
  font-weight:700;
}
.settings-community-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}
.settings-community-copy strong {
  overflow: hidden;
  font-size: 16px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.settings-community-copy small {
  overflow: hidden;
  color: var(--gm-ink-300);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.settings-community-status {
  color: var(--gm-ink-300);
  font-size: 11px;
  font-weight:700;
  white-space: nowrap;
}
.settings-community-status.connected { color: var(--gm-green-400); }
.settings-community-disclosure,
.settings-menu-tail {
  display: grid;
  place-items: center;
  color: var(--gm-ink-300);
}
.settings-community-disclosure svg,
.settings-chevron {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.settings-community-menu {
  display: grid;
  padding: 2px 11px 10px;
  background: rgb(var(--gm-ink-900-rgb) / 0.46);
}
.settings-menu-group-label {
  padding: 12px 8px 7px;
  color: var(--gm-ink-300);
  font-size: 10px;
  font-weight:700;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.settings-menu-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 67px;
  padding: 8px 6px;
  border: 0;
  border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.11);
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.settings-menu-group-label + .settings-menu-row { border-top: 0; }
.settings-menu-row:active { background: rgb(var(--gm-violet-500-rgb) / 0.09); }
.settings-menu-icon,
.settings-editor-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.08);
  border-radius: 12px;
  color: var(--gm-violet-500);
  background: rgb(var(--gm-violet-600-rgb) / 0.14);
}
.settings-menu-icon svg,
.settings-editor-icon svg,
.settings-add-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.settings-menu-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}
.settings-menu-copy strong { font-size: 15px; line-height: 1.15; }
.settings-menu-copy small {
  overflow: hidden;
  color: var(--gm-ink-300);
  font-size: 11px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.settings-display-switch {
  position: relative;
  display: block;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: var(--gm-ink-600);
}
.settings-display-switch i {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--gm-ink-300);
  transition: transform .18s ease;
}
.settings-display-switch.on { background: linear-gradient(90deg, var(--gm-violet-600), var(--gm-violet-500)); }
.settings-display-switch.on i { transform: translateX(16px); background: var(--gm-ink-50); }
.settings-add-chat {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 66px;
  padding: 9px 13px;
  border: 1px solid var(--settings-line);
  border-radius: 16px;
  color: var(--gm-ink-50);
  background: rgb(var(--gm-ink-800-rgb) / 0.72);
  text-align: left;
}
.settings-add-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.10);
  border-radius: 12px;
  color: var(--gm-violet-500);
  background: rgb(var(--gm-violet-600-rgb) / 0.16);
}
.settings-add-chat > span:nth-child(2) { display: grid; min-width: 0; gap: 3px; }
.settings-add-chat strong { font-size: 15px; }
.settings-add-chat small { color: var(--gm-ink-300); font-size: 11px; }
.settings-add-chat.loading,
.settings-picker-button.loading { opacity: .55; }
.settings-list-loading {
  display: grid;
  justify-items: center;
  gap: 9px;
  padding: 28px;
  color: var(--gm-ink-300);
}
.settings-list-loading .spinner { width: 28px; height: 28px; margin: 0; border-width: 3px; }
.settings-editor {
  display: grid;
  gap: 12px;
  padding: 8px 16px 24px;
  border-top: 1px solid var(--settings-line);
  scroll-margin-top: 8px;
}
.settings-editor-back {
  width: max-content;
  margin-top: 4px;
  padding: 7px 2px;
  border: 0;
  color: var(--gm-violet-400);
  background: transparent;
  font-size: 13px;
  font-weight:700;
}
.settings-editor-head {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 4px 1px 10px;
}
.settings-editor-icon { width: 46px; height: 46px; }
.settings-editor-head > div { display: grid; min-width: 0; gap: 3px; }
.settings-editor-head h3 { margin: 0; font-size: 20px; line-height: 1.1; }
.settings-editor-head p {
  overflow: hidden;
  margin: 0;
  color: var(--gm-ink-300);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.settings-editor .settings-panel { display: grid; gap: 12px; }
.settings-editor .settings-panel.hidden { display: none !important; }
.settings-editor .settings-card {
  border-color: var(--settings-line);
  background: rgb(var(--gm-ink-850-rgb) / 0.72);
}
.settings-picker-button {
  display: grid;
  gap: 3px;
  width: 100%;
  min-height: 54px;
  padding: 10px 13px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.14);
  border-radius: 12px;
  color: var(--gm-violet-300);
  background: rgb(var(--gm-violet-600-rgb) / 0.14);
  text-align: left;
}
.settings-picker-button span { font-size: 14px; font-weight:700; }
.settings-picker-button small { color: var(--gm-ink-300); font-size: 11px; }
.settings-editor .settings-sticky-save {
  position: sticky;
  z-index: 4;
  bottom: calc(76px + env(safe-area-inset-bottom));
  padding: 12px 0 2px;
  background: linear-gradient(180deg, transparent, var(--gm-ink-900) 36%);
}
.settings-editor .settings-save { min-height: 48px; border-radius: 12px; }

@media (max-width: 390px) {
  .settings-destinations,
  .settings-editor { padding-left: 11px; padding-right: 11px; }
  .settings-community-summary { grid-template-columns: 44px minmax(0, 1fr) 12px; gap: 9px; padding-inline: 10px; }
  .settings-community-avatar { width: 44px; height: 44px; border-radius: 12px; }
  .settings-community-status { display: none; }
  .settings-community-status.connected + .settings-community-disclosure::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-bottom: 5px;
    border-radius: 50%;
    background: var(--gm-green-400);
    box-shadow: 0 0 9px rgb(var(--gm-green-400-rgb) / 0.303);
  }
  .settings-menu-row { grid-template-columns: 40px minmax(0, 1fr) 40px; gap: 9px; padding-inline: 3px; }
  .settings-menu-icon { width: 40px; height: 40px; }
  .settings-editor-head { grid-template-columns: 44px minmax(0, 1fr); }
  .settings-editor-head .settings-status { display: none; }
}

/* v36 — settings forms expand in place and share one compact control system. */
.settings-editor-parking { display: none !important; }
#community-settings-page {
  padding-bottom: calc(112px + env(safe-area-inset-bottom));
}
.settings-community-menu {
  gap: 5px;
  padding: 8px 10px 11px;
}
.settings-menu-group-label {
  padding: 10px 7px 3px;
  font-size: 11px;
  letter-spacing: .045em;
}
.settings-menu-row {
  min-height: 58px;
  padding: 7px 9px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.14);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.38);
  transition: border-color .18s ease, background .18s ease, border-radius .18s ease;
}
.settings-menu-row + .settings-menu-row,
.settings-menu-group-label + .settings-menu-row { border-top-width: 1px; }
.settings-menu-row.selected {
  margin-bottom: -5px;
  border-color: rgb(var(--gm-violet-500-rgb) / 0.72);
  border-bottom-color: rgb(var(--gm-ink-50-rgb) / 0.10);
  border-radius: 12px 12px 0 0;
  color: var(--gm-violet-300);
  background: linear-gradient(90deg, rgb(var(--gm-violet-600-rgb) / 0.24), rgb(var(--gm-violet-800-rgb) / 0.2));
}
.settings-menu-row.selected .settings-menu-icon {
  color: var(--gm-violet-400);
  border-color: transparent;
  background: transparent;
}
.settings-menu-row.selected + .settings-editor {
  animation: settings-inline-open .2s ease-out both;
}
@keyframes settings-inline-open {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}
.settings-editor {
  width: 100%;
  min-width: 0;
  margin: 0 0 7px;
  padding: 11px;
  border: 1px solid rgb(var(--gm-violet-500-rgb) / 0.72);
  border-top: 0;
  border-radius: 0 0 16px 16px;
  background: rgb(var(--gm-ink-900-rgb) / 0.72);
  box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.02);
  scroll-margin: 86px;
}
.settings-editor-back,
.settings-editor-head { display: none !important; }
.settings-editor .settings-panel {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.settings-editor .settings-card,
.settings-editor .settings-audit-section {
  display: grid;
  min-width: 0;
  gap: 11px;
  margin: 0;
  padding: 12px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.16);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.58);
  box-shadow: none;
}
.settings-editor .settings-card + .settings-card { margin-top: 0; }
.settings-editor .settings-card-head {
  min-height: 34px;
  margin: 0;
  gap: 9px;
}
.settings-editor .settings-card-head > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}
.settings-editor .settings-card-head .eyebrow { display: none; }
.settings-editor .settings-card-head h3,
.settings-editor .section-heading h2 {
  margin: 0;
  color: var(--gm-ink-50);
  font-size: 17px;
  line-height: 1.2;
  letter-spacing: -.012em;
}
.settings-subsection-card { overflow: hidden; }
.settings-subsection-body {
  display: grid;
  gap: 11px;
  min-width: 0;
  padding-top: 11px;
  border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13);
}
.settings-subsection-card.subsection-collapsed {
  gap: 0;
  background: rgb(var(--gm-ink-850-rgb) / 0.34);
}
.settings-subsection-toggle {
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  margin-left: auto;
  padding: 0;
  border: 0;
  border-radius: 12px;
  color: var(--gm-ink-300);
  background: transparent;
}
.settings-subsection-toggle svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .18s ease;
}
.subsection-collapsed .settings-subsection-toggle svg { transform: rotate(-90deg); }
.settings-editor .settings-field {
  display: grid;
  min-width: 0;
  gap: 6px;
  margin: 0;
  color: var(--gm-ink-300);
}
.settings-editor .settings-field > span,
.settings-editor .settings-field > small:first-child {
  font-size: 12px;
  font-weight:700;
  line-height: 1.25;
}
.settings-editor .settings-field input:not([type="checkbox"]):not([type="hidden"]),
.settings-editor .settings-field select,
.settings-editor .settings-field textarea,
.settings-editor .community-note-editor input:not([type="checkbox"]):not([type="hidden"]),
.settings-editor .community-note-editor select,
.settings-editor .community-note-editor textarea {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 11px 12px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.23);
  border-radius: 12px;
  outline: 0;
  color: var(--gm-ink-50);
  background: var(--gm-ink-800);
  font: inherit;
  font-size: 14px;
  line-height: 1.35;
}
.settings-editor .settings-field textarea,
.settings-editor .community-note-editor textarea {
  min-height: 88px;
  resize: vertical;
}
.settings-editor .settings-field input:focus,
.settings-editor .settings-field select:focus,
.settings-editor .settings-field textarea:focus,
.settings-editor .community-note-editor input:focus,
.settings-editor .community-note-editor textarea:focus {
  border-color: rgb(var(--gm-violet-400-rgb) / 0.72);
  box-shadow: 0 0 0 3px rgb(var(--gm-violet-500-rgb) / 0.066);
}
.settings-editor .compact-two-grid,
.settings-editor .note-editor-top-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.settings-editor .duration-grid,
.settings-editor .duration-editor,
.settings-editor .subscription-grace-duration {
  min-width: 0;
  gap: 7px;
}
.settings-editor .duration-grid,
.settings-editor .subscription-grace-duration {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.settings-editor .settings-toggle-row,
.settings-editor .settings-toggle-list > label,
.settings-editor .rp-enabled-row {
  min-height: 52px;
  padding: 10px 11px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.16);
  border-radius: 12px;
  background: rgb(var(--gm-ink-800-rgb) / 0.55);
}
.settings-editor .settings-toggle-row strong,
.settings-editor .settings-toggle-list span { font-size: 13px; }
.settings-editor .settings-toggle-row small { color: var(--gm-ink-300); font-size: 11px; }
.settings-editor .settings-help,
.settings-editor .settings-help-box {
  margin: 0;
  color: var(--gm-ink-300);
  font-size: 11px;
  line-height: 1.45;
}
.settings-editor .settings-help-box {
  padding: 10px 11px;
  border: 0;
  border-left: 2px solid rgb(var(--gm-ink-50-rgb) / 0.16);
  border-radius: 0 8px 8px 0;
  background: rgb(var(--gm-violet-600-rgb) / 0.08);
}
.settings-editor .reaction-details,
.settings-helper-details {
  overflow: hidden;
  margin: 0;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.17);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.4);
}
.settings-editor .reaction-details summary,
.settings-helper-details summary {
  display: flex;
  align-items: center;
  min-height: 50px;
  padding: 10px 12px;
  color: var(--gm-ink-50);
  font-size: 14px;
  font-weight:700;
  cursor: pointer;
  list-style: none;
}
.settings-editor .reaction-details summary::-webkit-details-marker,
.settings-helper-details summary::-webkit-details-marker { display: none; }
.settings-editor .reaction-details summary::after,
.settings-helper-details summary::after {
  content: "⌄";
  margin-left: auto;
  color: var(--gm-ink-300);
  font-size: 18px;
  line-height: 1;
  transition: transform .18s ease;
}
.settings-editor .reaction-details[open] summary::after,
.settings-helper-details[open] summary::after { transform: rotate(180deg); }
.settings-editor .reaction-details-body,
.settings-helper-details .template-help {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 11px;
  border: 0;
  border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.14);
  border-radius: 0;
  background: transparent;
}
.settings-helper-details summary > span {
  margin-right: 8px;
  color: var(--gm-violet-400);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}
.settings-editor .template-chip-row {
  grid-template-columns: minmax(86px, .65fr) minmax(0, 1.35fr);
  gap: 6px 9px;
}
.settings-editor .template-chip-row code {
  overflow: hidden;
  padding: 5px 8px;
  border-radius: 8px;
  color: var(--gm-violet-300);
  background: rgb(var(--gm-violet-600-rgb) / 0.22);
  text-overflow: ellipsis;
}
.settings-editor .connected-chat-card,
.settings-editor .community-note-editor,
.settings-editor .welcome-button-editor,
.settings-editor .rp-command-editor,
.settings-editor .note-image-section {
  border-color: rgb(var(--gm-ink-300-rgb) / 0.17);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.42);
}
.settings-editor .note-add-button,
.settings-editor .text-button {
  min-width: 38px;
  min-height: 38px;
}
.settings-editor .settings-audit-section .section-heading { margin: 0; }
.settings-editor .settings-sticky-save {
  position: static;
  z-index: auto;
  bottom: auto;
  margin-top: 2px;
  padding: 0;
  background: transparent;
}
.settings-editor .settings-save {
  min-height: 50px;
  border-radius: 12px;
  font-size: 14px;
}

.community-rule-pages {
  display: grid;
  min-width: 0;
  gap: 7px;
}
.community-rule-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.17);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.52);
}
.community-rule-page.is-main {
  border-color: rgb(var(--gm-ink-50-rgb) / 0.16);
  background: linear-gradient(135deg, rgb(var(--gm-violet-700-rgb) / 0.24), rgb(var(--gm-ink-850-rgb) / 0.52) 72%);
}
.community-rule-open {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 15px;
  align-items: center;
  gap: 9px;
  min-width: 0;
  min-height: 58px;
  padding: 8px 9px;
  border: 0;
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.community-rule-position {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.14);
  border-radius: 12px;
  color: var(--gm-violet-400);
  background: rgb(var(--gm-violet-600-rgb) / 0.18);
  font-size: 12px;
  font-weight:700;
}
.community-rule-copy { display: grid; min-width: 0; gap: 3px; }
.community-rule-copy strong,
.community-rule-copy small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.community-rule-copy strong { font-size: 13px; }
.community-rule-copy small { color: var(--gm-ink-300); font-size: 10px; }
.community-rule-chevron { color: var(--gm-violet-400); font-size: 22px; line-height: 1; }
.community-rule-order {
  display: grid;
  grid-template-rows: 1fr 1fr;
  width: 42px;
  border-left: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13);
}
.community-rule-order button,
.settings-icon-button {
  display: grid;
  place-items: center;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  border: 0;
  color: var(--gm-violet-400);
  background: transparent;
  font-size: 17px;
}
.community-rule-order button + button { border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.13); }
.community-rule-order button:disabled { color: var(--gm-ink-400); opacity: .55; }
.settings-icon-button {
  flex: 0 0 40px;
  width: 40px;
  border-radius: 12px;
  background: rgb(var(--gm-ink-50-rgb) / 0.055);
  font-size: 22px;
}
.settings-row-switch {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 26px;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 10px 11px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.16);
  border-radius: 12px;
  background: rgb(var(--gm-ink-800-rgb) / 0.55);
}
.settings-row-switch > span { display: grid; min-width: 0; gap: 2px; }
.settings-row-switch b { color: var(--gm-ink-50); font-size: 13px; }
.settings-row-switch small { color: var(--gm-ink-300); font-size: 10px; line-height: 1.3; }
.settings-row-switch input { width: 22px; height: 22px; accent-color: var(--gm-violet-500); }
.settings-editor .button.danger {
  border: 1px solid rgb(var(--gm-red-500-rgb) / 0.3);
  color: var(--gm-red-400);
  background: rgb(var(--gm-gold-800-rgb) / 0.16);
}

@media (max-width: 390px) {
  .settings-community-menu { padding-inline: 7px; }
  .settings-menu-row { grid-template-columns: 38px minmax(0, 1fr) 36px; gap: 8px; }
  .settings-menu-icon { width: 38px; height: 38px; border-radius: 12px; }
  .settings-editor { padding: 8px; }
  .settings-editor .settings-card,
  .settings-editor .settings-audit-section { padding: 10px; }
  .settings-editor .compact-two-grid,
  .settings-editor .note-editor-top-grid { grid-template-columns: 1fr; }
}

/* v37 — reliable settings accordions and native roles/permissions editor. */
.settings-subsection-body[hidden] { display: none !important; }
.settings-editor .settings-panel > .settings-card:only-child:not(.settings-subsection-card) {
  padding: 1px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.settings-editor .settings-subsection-card {
  gap: 0;
  padding: 0;
  border-color: rgb(var(--gm-ink-300-rgb) / 0.17);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.42);
}
.settings-editor .settings-subsection-card > .settings-card-head {
  min-height: 56px;
  padding: 9px 10px 9px 13px;
}
.settings-editor .settings-subsection-card > .settings-subsection-body {
  gap: 10px;
  padding: 11px;
  border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.14);
  background: rgb(var(--gm-ink-900-rgb) / 0.34);
}
.settings-editor .settings-subsection-card.subsection-collapsed > .settings-card-head {
  min-height: 54px;
}
.settings-editor .settings-subsection-card.subsection-collapsed {
  border-color: rgb(var(--gm-ink-300-rgb) / 0.13);
  background: rgb(var(--gm-ink-850-rgb) / 0.3);
}
.settings-editor .settings-subsection-card + .settings-subsection-card { margin-top: 0; }

#permissions-page {
  display: grid;
  gap: 12px;
  padding: 8px 16px calc(118px + env(safe-area-inset-bottom));
  --permission-line: rgb(var(--gm-ink-300-rgb) / 0.17);
  --permission-surface: rgb(var(--gm-ink-800-rgb) / 0.76);
  --permission-surface-strong: rgb(var(--gm-ink-850-rgb) / 0.92);
}
#permissions-page.hidden { display: none !important; }
#permissions-page > #back-permissions {
  margin: 0 2px 1px;
  color: var(--gm-violet-400);
  font-size: 14px;
}
.permission-page-head { gap: 5px; }
.permission-page-head .eyebrow { display: none; }
.permission-page-head h2 {
  font-size: clamp(26px, 7vw, 32px);
  line-height: 1.05;
  letter-spacing: -.035em;
}
.permission-page-head p {
  max-width: 440px;
  color: var(--gm-ink-300);
  font-size: 12px;
}
.permission-tabs {
  gap: 4px;
  padding: 4px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.1);
  border-radius: 16px;
  background: rgb(var(--gm-ink-750-rgb) / 0.62);
}
.permission-tab {
  min-height: 42px;
  border-radius: 12px;
  color: var(--gm-ink-300);
  font-size: 14px;
}
.permission-tab.active {
  color: var(--gm-ink-50);
  background: linear-gradient(135deg, rgb(var(--gm-violet-600-rgb) / 0.76), rgb(var(--gm-violet-700-rgb) / 0.68));
  box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.08);
}
.permission-search-box {
  display: grid;
  grid-template-columns: 21px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 50px;
  padding: 0 13px;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.22);
  border-radius: 12px;
  color: var(--gm-ink-300);
  background: rgb(var(--gm-ink-750-rgb) / 0.6);
}
.permission-search-box svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.permission-search-box input {
  width: 100%;
  min-width: 0;
  padding: 13px 0;
  border: 0;
  outline: 0;
  color: var(--gm-ink-50);
  background: transparent;
  font-size: 14px;
}
.permission-search-box input::placeholder { color: var(--gm-ink-400); }
.permission-view-summary {
  min-height: 19px;
  padding: 2px 3px 0;
  color: var(--gm-ink-300);
  font-size: 11px;
}
.permission-role-list,
.permission-member-list {
  display: grid;
  gap: 9px;
  margin-top: 0;
}
.permission-role-card {
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--permission-line);
  border-radius: 16px;
  background: linear-gradient(145deg, rgb(var(--gm-ink-750-rgb) / 0.78), rgb(var(--gm-ink-850-rgb) / 0.88));
  box-shadow: 0 14px 38px rgb(var(--gm-ink-950-rgb) / 0.14);
}
.permission-role-card.expanded {
  border-color: rgb(var(--gm-ink-50-rgb) / 0.16);
  box-shadow: 0 18px 48px rgb(var(--gm-ink-950-rgb) / 0.22), 0 0 0 1px rgb(var(--gm-violet-500-rgb) / 0.022);
}
.permission-role-heading {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto auto 18px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 66px;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.permission-role-card.expanded > .permission-role-heading {
  border-bottom: 1px solid var(--permission-line);
}
.permission-role-icon,
.permission-group-icon,
.permission-control-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--gm-violet-400);
  background: rgb(var(--gm-violet-500-rgb) / 0.17);
}
.permission-role-icon {
  width: 44px;
  height: 44px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.09);
  border-radius: 12px;
  font-size: 20px;
}
.permission-role-copy,
.permission-group-title {
  display: grid;
  min-width: 0;
  gap: 2px;
}
.permission-role-copy strong { font-size: 15px; line-height: 1.2; }
.permission-role-copy small,
.permission-group-title small {
  overflow: hidden;
  color: var(--gm-ink-300);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.permission-role-badge {
  padding: 5px 8px;
  border-radius: 999px;
  color: var(--gm-violet-300);
  background: rgb(var(--gm-violet-500-rgb) / 0.18);
  font-size: 10px;
  font-weight:700;
  white-space: nowrap;
}
.permission-role-lock { color: var(--gm-ink-300); font-size: 13px; }
.permission-chevron {
  color: var(--gm-ink-300);
  font-size: 20px;
  line-height: 1;
  transition: transform .18s ease;
}
.permission-role-card.expanded > .permission-role-heading .permission-chevron,
.permission-group-card.expanded > .permission-group-heading .permission-chevron,
.individual-permission-group.expanded > .permission-group-toggle .permission-chevron {
  transform: rotate(180deg);
}
.permission-role-body[hidden],
.permission-group-body[hidden] { display: none !important; }
.permission-role-body {
  display: grid;
  gap: 10px;
  padding: 10px;
  background: rgb(var(--gm-ink-900-rgb) / 0.32);
}
.permission-group-list,
.individual-permission-groups {
  display: grid;
  gap: 7px;
}
.permission-group-card {
  overflow: hidden;
  border: 1px solid rgb(var(--gm-ink-300-rgb) / 0.15);
  border-radius: 12px;
  background: rgb(var(--gm-ink-850-rgb) / 0.6);
}
.permission-group-card.expanded { border-color: rgb(var(--gm-ink-300-rgb) / 0.23); }
.permission-group-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 52px;
}
.permission-group-toggle {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 52px;
  padding: 8px 10px;
  border: 0;
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.permission-group-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  color: var(--gm-ink-200);
  background: rgb(var(--gm-ink-300-rgb) / 0.1);
  font-size: 16px;
}
.permission-group-title strong { font-size: 13px; }
.permission-group-bulk {
  min-height: 34px;
  margin-right: 9px;
  padding: 5px 7px;
  border: 0;
  border-radius: 8px;
  color: var(--gm-violet-400);
  background: transparent;
  font-size: 10px;
  font-weight:700;
  white-space: nowrap;
}
.permission-group-body {
  display: grid;
  padding: 0 10px;
  border-top: 1px solid rgb(var(--gm-ink-300-rgb) / 0.14);
}
.permission-control-row {
  position: relative;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 9px;
  min-height: 68px;
  padding: 9px 0;
  border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.12);
}
.permission-control-row:last-child { border-bottom: 0; }
.permission-control-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  color: var(--gm-ink-200);
  background: rgb(var(--gm-ink-300-rgb) / 0.1);
  font-size: 12px;
}
.permission-switch-copy strong {
  color: var(--gm-ink-50);
  font-size: 13px;
  line-height: 1.25;
}
.permission-switch-copy small {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 2px;
  color: var(--gm-ink-300);
  font-size: 10px;
  line-height: 1.3;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.permission-toggle-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.permission-toggle-ui {
  position: relative;
  width: 42px;
  height: 24px;
  border-radius: 999px;
  background: var(--gm-ink-500);
  box-shadow: inset 0 1px 3px rgb(var(--gm-ink-950-rgb) / 0.35);
  transition: background .18s ease, opacity .18s ease;
}
.permission-toggle-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--gm-ink-200);
  transition: transform .18s ease, background .18s ease;
}
.permission-toggle-input:checked + .permission-toggle-ui {
  background: linear-gradient(135deg, var(--gm-violet-600), var(--gm-violet-500));
}
.permission-toggle-input:checked + .permission-toggle-ui::after {
  background: var(--gm-ink-50);
  transform: translateX(18px);
}
.permission-toggle-input:focus-visible + .permission-toggle-ui {
  outline: 2px solid var(--gm-violet-400);
  outline-offset: 2px;
}
.permission-toggle-input:disabled + .permission-toggle-ui { opacity: .52; }
.permission-save {
  min-height: 48px;
  margin-top: 1px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--gm-violet-600), var(--gm-violet-500));
  box-shadow: 0 10px 28px rgb(var(--gm-violet-600-rgb) / 0.11);
  font-size: 13px;
}
.permission-filtered-out { display: none !important; }
.permission-note {
  margin-top: 1px;
  padding: 12px 13px;
  border-radius: 12px;
  color: var(--gm-ink-300);
  background: rgb(var(--gm-ink-800-rgb) / 0.42);
  font-size: 11px;
}
.permission-member-row {
  min-height: 64px;
  padding: 9px 10px;
  border: 1px solid var(--permission-line);
  border-radius: 16px;
  background: rgb(var(--gm-ink-800-rgb) / 0.72);
  box-shadow: none;
}
.permission-member-editor-head { gap: 8px; }
.permission-member-summary {
  padding: 12px 13px;
  border-radius: 16px;
  background: linear-gradient(145deg, rgb(var(--gm-ink-700-rgb) / 0.82), rgb(var(--gm-ink-800-rgb) / 0.78));
  box-shadow: none;
}
.individual-permission-groups { margin-top: 9px; }
.individual-permission-group > .permission-group-toggle {
  grid-template-columns: 32px minmax(0, 1fr) 18px;
}
.individual-permission-row {
  grid-template-columns: minmax(0, 1fr) minmax(112px, 128px);
  min-height: 68px;
  padding: 9px 0;
  border-bottom: 1px solid rgb(var(--gm-ink-300-rgb) / 0.12);
  background: transparent;
}
.individual-permission-row:last-child { border-bottom: 0; }
.individual-permission-select {
  min-height: 38px;
  padding: 7px 8px;
  border-radius: 8px;
  background-color: var(--gm-ink-800);
}

@media (max-width: 390px) {
  #permissions-page { padding-inline: 11px; }
  .permission-role-heading {
    grid-template-columns: 40px minmax(0, 1fr) auto 16px;
    gap: 8px;
    padding-inline: 10px;
  }
  .permission-role-icon { width: 40px; height: 40px; border-radius: 12px; }
  .permission-role-lock { display: none; }
  .permission-role-badge { padding-inline: 7px; }
  .permission-role-body { padding: 8px; }
  .permission-group-bulk { font-size: 9px; }
  .permission-control-row { grid-template-columns: 30px minmax(0, 1fr) 42px; }
  .permission-control-icon { width: 30px; height: 30px; }
  .individual-permission-row { grid-template-columns: minmax(0,1fr) 108px; }
}

.permission-svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.permission-role-icon .permission-svg { width: 24px; height: 24px; }
.permission-group-icon .permission-svg,
.permission-control-icon .permission-svg { width: 18px; height: 18px; }
.permission-role-lock .permission-svg { width: 15px; height: 15px; }
.permission-role-card:has(.permission-role-copy strong:first-child) .permission-role-icon {
  box-shadow: inset 0 1px rgb(var(--gm-ink-50-rgb) / 0.06), 0 8px 18px rgb(var(--gm-violet-700-rgb) / 0.077);
}
.permission-role-card.expanded > .permission-role-heading .permission-role-icon,
.permission-group-card.expanded > .permission-group-heading .permission-group-icon,
.individual-permission-group.expanded > .permission-group-toggle .permission-group-icon {
  color: var(--gm-violet-400);
  border-color: rgb(var(--gm-ink-50-rgb) / 0.14);
  background: linear-gradient(145deg, rgb(var(--gm-violet-500-rgb) / 0.28), rgb(var(--gm-violet-700-rgb) / 0.18));
}
.permission-control-row:has(.permission-toggle-input:checked) .permission-control-icon {
  color: var(--gm-violet-400);
  background: rgb(var(--gm-violet-500-rgb) / 0.16);
}

/* v39 — feature-page shell parity and a task-focused promo-code workspace. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body:has(#promo-page:not(.hidden)),
body:has(#community-settings-page:not(.hidden)),
body:has(#permissions-page:not(.hidden)) {
  padding-bottom: 0;
  background: var(--gm-ink-900);
}
body:has(#promo-page:not(.hidden)) .app-shell,
body:has(#community-settings-page:not(.hidden)) .app-shell,
body:has(#permissions-page:not(.hidden)) .app-shell {
  width: min(100%, 760px);
  max-width: 760px;
  min-height: 100dvh;
  padding-bottom: 0;
  background:
    radial-gradient(circle at 10% 0, rgb(var(--gm-violet-500-rgb) / 0.14), transparent 30rem),
    var(--gm-ink-900);
}
body:has(#community-settings-page:not(.hidden)) .topbar,
body:has(#permissions-page:not(.hidden)) .topbar,
body:has(#promo-page:not(.hidden)) .bottom-nav,
body:has(#community-settings-page:not(.hidden)) .bottom-nav,
body:has(#permissions-page:not(.hidden)) .bottom-nav {
  display: none !important;
}

.native-feature-page,
#community-settings-page.native-feature-page,
#permissions-page.native-feature-page {
  display: block;
  width: 100%;
  min-height: 100dvh;
  padding: 0 14px calc(32px + env(safe-area-inset-bottom));
  color: var(--gm-ink-50);
  background: transparent;
  font-family: var(--gm-font-ui);
}
.native-feature-page.hidden { display: none !important; }
.native-feature-header {
  position: sticky;
  z-index: 30;
  top: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 70px;
  width: auto;
  max-width: none;
  margin: 0 -14px 16px;
  padding: calc(12px + env(safe-area-inset-top)) 14px 12px;
  border-bottom: 1px solid var(--gm-ink-600);
  background: rgb(var(--gm-ink-850-rgb) / 0.94);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.native-feature-back {
  display: grid;
  place-items: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--gm-ink-500);
  border-radius: 50%;
  color: var(--gm-ink-50);
  background: var(--gm-ink-800);
}
.native-feature-back svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.native-feature-back:active { transform: scale(.96); }
.native-feature-back:focus-visible {
  outline: 2px solid var(--gm-violet-500);
  outline-offset: 2px;
}
.native-feature-header > div {
  display: grid;
  min-width: 0;
  gap: 1px;
}
.native-feature-header small {
  color: var(--gm-ink-300);
  font-size: 13px;
  line-height: 1.2;
}
.native-feature-header h2 {
  overflow: hidden;
  margin: 0;
  color: var(--gm-ink-50);
  font-size: clamp(20px, 5.5vw, 24px);
  line-height: 1.15;
  letter-spacing: -.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.native-feature-lead {
  max-width: 620px;
  margin: 0 0 18px;
  color: var(--gm-teal-500);
  font-size: 14px;
  line-height: 1.5;
}

/* Community settings and permissions now live in the same feature shell. */
#community-settings-page .settings-destinations {
  gap: 10px;
  padding: 0 0 18px;
}
#community-settings-page .settings-destinations > h3 {
  margin: 0 2px 3px;
  color: var(--gm-ink-300);
  font-size: 13px;
}
#community-settings-page .settings-community-item,
#community-settings-page .settings-add-chat {
  border-color: var(--gm-ink-500);
  background: rgb(var(--gm-ink-800-rgb) / 0.88);
  box-shadow: none;
}
#community-settings-page .settings-community-item.expanded {
  border-color: rgb(var(--gm-violet-500-rgb) / 0.58);
  box-shadow: 0 0 0 1px rgb(var(--gm-violet-500-rgb) / 0.033);
}
#community-settings-page .settings-community-menu,
#community-settings-page .settings-editor {
  background: rgb(var(--gm-ink-900-rgb) / 0.48);
}
#community-settings-page .settings-editor {
  margin: 0;
  padding: 10px 10px 18px;
  border-top-color: var(--gm-ink-600);
}
#community-settings-page .settings-editor .settings-sticky-save {
  bottom: 0;
  background: linear-gradient(180deg, transparent, var(--gm-ink-900) 36%);
}

#permissions-page.native-feature-page {
  gap: 0;
}
#permissions-page .permission-tabs,
#permissions-page .permission-search-box,
#permissions-page #permission-role-view,
#permissions-page #permission-member-view,
#permissions-page .permission-note {
  margin-bottom: 12px;
}
#permissions-page .permission-tabs {
  border-color: var(--gm-ink-600);
  background: rgb(var(--gm-ink-800-rgb) / 0.72);
}
#permissions-page .permission-search-box,
#permissions-page .permission-role-card,
#permissions-page .permission-member-row,
#permissions-page .permission-member-summary,
#permissions-page .permission-note {
  border-color: var(--gm-ink-500);
  background: rgb(var(--gm-ink-800-rgb) / 0.82);
}
#permissions-page .permission-view-summary { padding: 0 3px 7px; }

/* Promo codes */
#promo-page {
  --promo-line: var(--gm-ink-500);
  --promo-surface: rgb(var(--gm-ink-800-rgb) / 0.86);
  --promo-surface-strong: var(--gm-ink-800);
  --promo-muted: var(--gm-ink-300);
  --promo-accent: var(--gm-violet-400);
}
#promo-page h3,
#promo-page h2 { color: var(--gm-ink-50); }
.promo-redeem-card,
.promo-page-section {
  border: 1px solid var(--promo-line);
  border-radius: 16px;
  background: var(--promo-surface);
}
.promo-redeem-card {
  display: grid;
  gap: 12px;
  padding: 16px;
}
.promo-redeem-card h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.25;
}
.promo-redeem-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}
.promo-redeem-row label { min-width: 0; }
.promo-redeem-row input {
  width: 100%;
  min-width: 0;
  height: 48px;
  padding: 0 14px;
  border: 1px solid var(--promo-line);
  border-radius: 12px;
  outline: none;
  color: var(--gm-ink-50);
  background: var(--gm-ink-850);
  font-size: 14px;
  font-weight:700;
  letter-spacing: .025em;
  text-transform: uppercase;
}
.promo-redeem-row input::placeholder {
  color: var(--gm-ink-400);
  font-weight:600;
}
.promo-redeem-row input:focus {
  border-color: var(--gm-violet-500);
  box-shadow: 0 0 0 3px rgb(var(--gm-violet-500-rgb) / 0.072);
}
.promo-redeem-row .button {
  width: auto;
  min-width: 112px;
  min-height: 48px;
  margin: 0;
  padding: 0 17px;
  border: 1px solid var(--gm-violet-500);
  border-radius: 12px;
  color: var(--gm-ink-50);
  background: linear-gradient(135deg, var(--gm-violet-600), var(--gm-violet-500));
  font-size: 13px;
  font-weight:700;
}
.promo-redeem-row .button:disabled {
  border-color: var(--gm-ink-500);
  color: var(--gm-ink-300);
  background: var(--gm-ink-600);
  opacity: .72;
  cursor: not-allowed;
}
.promo-result {
  display: grid;
  gap: 3px;
  min-height: 18px;
  padding: 0;
  border: 0;
  color: var(--promo-muted);
  background: transparent;
  font-size: 12px;
  line-height: 1.4;
}
.promo-result strong { font-size: 13px; }
.promo-result span { font-size: 12px; }
.promo-result-success {
  padding: 10px 12px;
  border: 1px solid rgb(var(--gm-green-400-rgb) / 0.3);
  border-radius: 12px;
  color: var(--gm-green-400);
  background: rgb(var(--gm-green-500-rgb) / 0.12);
}
.promo-result-error {
  padding: 10px 12px;
  border: 1px solid rgb(var(--gm-red-400-rgb) / 0.3);
  border-radius: 12px;
  color: var(--gm-red-400);
  background: rgb(var(--gm-gold-700-rgb) / 0.13);
}
.promo-page-section {
  margin-top: 14px;
  padding: 0;
  overflow: hidden;
}
.promo-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 12px 15px;
  border-bottom: 1px solid rgb(var(--gm-ink-500-rgb) / 0.72);
}
.promo-section-heading h2 {
  margin: 0;
  font-size: 17px;
  line-height: 1.25;
}
.promo-section-count {
  color: var(--promo-accent);
  font-size: 15px;
  font-weight:700;
}
.promo-history-list { display: grid; }
.promo-history-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 11px 15px;
  border-bottom: 1px solid rgb(var(--gm-ink-500-rgb) / 0.62);
  background: transparent;
}
.promo-history-item:last-child { border-bottom: 0; }
.promo-history-item > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}
.promo-history-item strong {
  color: var(--gm-ink-50);
  font-size: 14px;
  letter-spacing: .02em;
}
.promo-history-item small {
  overflow: hidden;
  color: var(--promo-muted);
  font-size: 12px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.promo-history-item time {
  color: var(--gm-ink-300);
  font-size: 11px;
  white-space: nowrap;
}
.promo-empty {
  padding: 22px 16px;
  color: var(--promo-muted);
  font-size: 13px;
  line-height: 1.45;
  text-align: center;
}
.promo-admin-section { margin-bottom: 10px; }
.promo-admin-heading { align-items: center; }
.promo-create-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid var(--gm-violet-500);
  border-radius: 12px;
  color: var(--gm-ink-50);
  background: linear-gradient(135deg, var(--gm-violet-600), var(--gm-violet-500));
  font-size: 12px;
  font-weight:700;
}
.promo-create-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.promo-admin-tools {
  display: grid;
  gap: 10px;
  padding: 13px 14px;
  border-bottom: 1px solid rgb(var(--gm-ink-500-rgb) / 0.72);
  background: rgb(var(--gm-ink-900-rgb) / 0.38);
}
.promo-admin-search {
  display: grid;
  grid-template-columns: 21px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 46px;
  padding: 0 12px;
  border: 1px solid var(--promo-line);
  border-radius: 12px;
  color: var(--gm-ink-300);
  background: var(--gm-ink-850);
}
.promo-admin-search svg,
.promo-admin-chevron,
.promo-admin-validity svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.promo-admin-search svg { width: 20px; height: 20px; }
.promo-admin-search input {
  width: 100%;
  min-width: 0;
  padding: 12px 0;
  border: 0;
  outline: none;
  color: var(--gm-ink-50);
  background: transparent;
  font-size: 13px;
}
.promo-admin-search input::placeholder { color: var(--gm-ink-400); }
.promo-admin-filters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.promo-admin-filters label {
  display: grid;
  min-width: 0;
  gap: 5px;
  color: var(--gm-ink-300);
  font-size: 10px;
}
.promo-admin-filters select {
  width: 100%;
  min-width: 0;
  min-height: 43px;
  padding: 0 11px;
  border: 1px solid var(--promo-line);
  border-radius: 12px;
  outline: none;
  color: var(--gm-ink-50);
  background: var(--gm-ink-850);
  font-size: 12px;
}
.promo-admin-summary {
  color: var(--gm-ink-300);
  font-size: 11px;
}
.promo-admin-list { display: grid; }
.promo-admin-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 94px;
  padding: 13px 15px;
  border: 0;
  border-bottom: 1px solid rgb(var(--gm-ink-500-rgb) / 0.68);
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.promo-admin-item:last-child { border-bottom: 0; }
.promo-admin-item:active { background: rgb(var(--gm-violet-600-rgb) / 0.1); }
.promo-admin-main {
  display: grid;
  min-width: 0;
  gap: 5px;
}
.promo-admin-code-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.promo-admin-code-line strong {
  overflow-wrap: anywhere;
  color: var(--gm-ink-50);
  font-size: 14px;
  letter-spacing: .025em;
}
.promo-status {
  padding: 4px 8px;
  border-radius: 999px;
  color: var(--gm-green-400);
  background: rgb(var(--gm-green-500-rgb) / 0.2);
  font-size: 9px;
  font-weight:700;
  white-space: nowrap;
}
.promo-status[data-status="disabled"] {
  color: var(--gm-ink-300);
  background: rgb(var(--gm-ink-400-rgb) / 0.22);
}
.promo-status[data-status="scheduled"] {
  color: var(--gm-gold-400);
  background: rgb(var(--gm-gold-600-rgb) / 0.2);
}
.promo-status[data-status="expired"] {
  color: var(--gm-red-400);
  background: rgb(var(--gm-gold-700-rgb) / 0.2);
}
.promo-admin-effects {
  overflow: hidden;
  color: var(--promo-accent);
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.promo-admin-validity {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: var(--gm-ink-300);
  font-size: 10px;
}
.promo-admin-validity svg { flex: 0 0 14px; width: 14px; height: 14px; }
.promo-admin-validity span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.promo-admin-side {
  display: grid;
  grid-template-columns: minmax(0, auto) 18px;
  align-items: center;
  gap: 8px;
  color: var(--gm-ink-300);
}
.promo-admin-uses {
  max-width: 112px;
  font-size: 10px;
  line-height: 1.3;
  text-align: right;
}
.promo-admin-chevron {
  width: 18px;
  height: 18px;
  color: var(--promo-accent);
}
.promo-redeem-card{position:relative;grid-template-columns:132px minmax(0,1fr);align-items:center;min-height:168px;overflow:hidden;padding:15px;background:radial-gradient(circle at 8% 45%,rgb(var(--gm-violet-600-rgb) / 0.24),transparent 45%),linear-gradient(140deg,rgb(var(--gm-ink-800-rgb) / 0.97),rgb(var(--gm-ink-800-rgb) / 0.97))}.promo-redeem-art{width:132px;height:132px;object-fit:contain;filter:drop-shadow(0 12px 19px rgb(var(--gm-violet-600-rgb) / 0.176))}.promo-redeem-content{display:grid;gap:9px;min-width:0}.promo-redeem-content>p{margin:0;color:var(--gm-ink-300);font-size:11px}.promo-admin-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.promo-admin-summary>span{display:grid;gap:3px;padding:8px 5px;border:1px solid rgb(var(--gm-ink-50-rgb) / 0.07);border-radius:12px;background:rgb(var(--gm-ink-50-rgb) / 0.025);text-align:center}.promo-admin-summary small{color:var(--gm-ink-300);font-size:8px}.promo-admin-summary strong{color:var(--gm-ink-50);font-size:13px}.promo-admin-list{gap:7px;padding:10px}.promo-admin-item{min-height:104px;padding:12px;border:1px solid rgb(var(--gm-ink-500-rgb) / 0.68)!important;border-radius:16px;background:linear-gradient(135deg,rgb(var(--gm-ink-750-rgb) / 0.9),rgb(var(--gm-ink-850-rgb) / 0.92))}.promo-admin-item:last-child{border-bottom:1px solid rgb(var(--gm-ink-500-rgb) / 0.68)}.promo-copy-code{width:27px;height:27px;padding:0;border:1px solid rgb(var(--gm-ink-50-rgb) / 0.13);border-radius:8px;color:var(--gm-violet-400);background:rgb(var(--gm-violet-600-rgb) / 0.12)}.promo-usage-progress{display:block;width:100%;height:5px;overflow:hidden;border-radius:999px;background:var(--gm-ink-700)}.promo-usage-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--gm-violet-600),var(--gm-violet-400))}

@media (max-width: 430px) {
  .native-feature-page,
  #community-settings-page.native-feature-page,
  #permissions-page.native-feature-page { padding-inline: 11px; }
  .native-feature-header {
    margin-inline: -11px;
    padding-inline: 11px;
  }
  .native-feature-lead { font-size: 13px; }
  .promo-redeem-card { grid-template-columns:92px minmax(0,1fr);padding: 13px; }
  .promo-redeem-art{width:92px;height:108px}
  .promo-redeem-row { grid-template-columns: 1fr; }
  .promo-redeem-row .button { width: 100%; }
  .promo-admin-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .promo-create-button { width: 100%; }
  .promo-admin-item { gap: 8px; padding-inline: 12px; }
  .promo-admin-side { grid-template-columns: 18px; justify-items: end; }
  .promo-admin-uses { display: none; }
  .promo-admin-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width: 350px) {
  .promo-admin-filters { grid-template-columns: 1fr; }
  .native-feature-header h2 { font-size: 18px; }
}

/* Promo cards stay comfortably readable on compact Telegram screens. */
.promo-admin-summary small{font-size:10px}.promo-admin-summary strong{font-size:16px}.promo-admin-item{min-height:118px;padding:15px}.promo-admin-main{gap:7px}.promo-admin-code-line strong{font-size:16px;line-height:1.25}.promo-status{padding:5px 9px;font-size:11px}.promo-admin-effects{font-size:13px;line-height:1.45;white-space:normal}.promo-admin-validity{font-size:12px;line-height:1.35}.promo-admin-validity svg{flex-basis:16px;width:16px;height:16px}.promo-admin-uses{font-size:12px}.promo-copy-code{width:34px;height:34px}

/* Personal account v1 — final cascade overrides. */
#home-page .home-account-greeting{margin:8px 20px 18px}
#home-page .home-account-card{display:grid;grid-template-columns:64px minmax(0,1fr) auto;width:calc(100% - 40px);min-height:116px;margin:0 20px;padding:16px;border:1px solid var(--a2-line);border-radius:20px;background:linear-gradient(145deg,rgb(var(--gm-ink-750-rgb) / 0.96),rgb(var(--gm-ink-850-rgb) / 0.96))}
#home-page .home-account-card::after{content:none;display:none}
#home-page .home-account-card .avatar{width:58px;height:58px}
#home-page .home-account-balance{display:grid;grid-column:auto;gap:3px;padding:0;border:0;text-align:right}
#home-page .home-account-status{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 20px 0}
#home-page .home-account-status>.card{display:grid;gap:5px;min-height:76px;padding:12px;border:1px solid var(--a2-line);border-radius:16px;background:rgb(var(--gm-ink-800-rgb) / 0.72)}
#home-page .home-actions-heading{margin-top:5px}
#home-page .home-account-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:calc(100% - 40px);margin:0 20px;padding:0;border:0;background:transparent}
#home-page .home-account-actions .quick-card{display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;min-height:86px;padding:13px;border:1px solid var(--a2-line);border-radius:16px;background:rgb(var(--gm-ink-800-rgb) / 0.72)}
#home-page .home-account-actions .quick-card::after{content:none;display:none}
#home-page .home-account-actions .quick-icon{grid-row:1/3;width:42px;height:42px;font-size:18px}
#home-page .home-account-actions .quick-copy{display:contents}
#home-page .home-account-actions .quick-copy small,#home-page .home-account-actions .quick-copy strong{grid-column:2;max-width:none;overflow:visible;text-overflow:clip;white-space:normal}
#home-page .home-account-actions .quick-copy small{grid-row:1;color:var(--a2-text);font-size:13px;font-weight:700}
#home-page .home-account-actions .quick-copy strong{grid-row:2;color:var(--a2-muted);font-size:11px;font-weight:500}
#home-page .home-account-note{margin:12px 20px 20px;border:1px solid var(--a2-line);border-radius:16px;background:rgb(var(--gm-violet-400-rgb) / 0.055)}
#community-page .participant-community-picker{margin:14px 20px 0}
@media(max-width:460px){#home-page .home-account-card{grid-template-columns:58px minmax(0,1fr)}#home-page .home-account-balance{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-top:11px;border-top:1px solid var(--a2-line);text-align:left}#home-page .home-account-status{grid-template-columns:1fr 1fr}#home-page .home-account-status>.card:last-child{grid-column:1/-1}#home-page .home-account-actions{grid-template-columns:1fr 1fr}}
/* Long user-generated labels must wrap instead of being truncated. */
.button,
button,
.feature-row,
.quick-copy,
.member-name,
.member-subline,
.profile-copy,
.detail-card,
.settings-row,
.permission-control-row {
  min-width: 0;
}

.feature-row strong,
.feature-row small,
.quick-copy strong,
.quick-copy small,
.member-name,
.member-subline,
.detail-card strong,
.settings-row strong,
.permission-control-row strong {
  max-width: none;
  overflow: visible;
  overflow-wrap: anywhere;
  white-space: normal;
  text-overflow: clip;
}

.ticket-item-top > strong,
.ticket-item-meta,
.ticket-assignee-line,
.ticket-item-main > small,
.nav-item small,
.home-activity-copy strong,
.home-activity-copy small {
  overflow: visible;
  overflow-wrap: anywhere;
  white-space: normal;
  text-overflow: clip;
}

.promo-copy-code{display:grid;place-items:center;width:30px;height:30px;padding:0}
.promo-copy-code svg{display:block;width:17px;height:17px}

.permission-role-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.permission-role-toolbar .permission-view-summary{margin:0}.permission-role-toolbar .button{flex:0 0 auto;min-height:38px;padding-inline:12px}
.permission-role-create-form{display:grid;grid-template-columns:minmax(0,1fr) 74px auto auto;align-items:end;gap:8px;margin-bottom:12px;padding:12px;border:1px solid rgb(var(--gm-ink-50-rgb) / 0.14);border-radius:16px;background:linear-gradient(135deg,rgb(var(--gm-violet-800-rgb) / 0.23),rgb(var(--gm-ink-850-rgb) / 0.88))}.permission-role-create-form label{display:grid;gap:5px;color:var(--gm-ink-300);font-size:10px}.permission-role-create-form input{width:100%;min-height:40px;box-sizing:border-box;padding:8px 10px;border:1px solid var(--gm-ink-500);border-radius:12px;color:var(--gm-ink-50);background:var(--gm-ink-800)}.permission-role-create-form input[type=color]{padding:4px}
.permission-custom-role-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.permission-custom-role-actions .danger{border-color:rgb(var(--gm-red-500-rgb) / 0.32);color:var(--gm-red-400);background:rgb(var(--gm-gold-800-rgb) / 0.14)}
@media(max-width:560px){.permission-role-create-form{grid-template-columns:minmax(0,1fr) 68px}.permission-role-create-form button{min-width:0}.permission-role-toolbar{align-items:flex-start}.permission-role-toolbar .button{max-width:42%;white-space:normal}}

.community-context-picker {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 66px;
  padding: 10px 13px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.14);
  border-radius: 16px;
  background: linear-gradient(135deg, rgb(var(--gm-violet-900-rgb) / 0.58), rgb(var(--gm-ink-850-rgb) / 0.94));
  box-shadow: inset 0 1px 0 rgb(var(--gm-ink-50-rgb) / 0.035);
}
.community-context-picker-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.14);
  border-radius: 12px;
  color: var(--gm-violet-400);
  background: rgb(var(--gm-violet-500-rgb) / 0.13);
  font-size: 18px;
}
.community-context-picker-copy { display: grid; min-width: 0; gap: 2px; }
.community-context-picker-copy > small { color: var(--gm-ink-300); font-size: 10px; font-weight:700; }
.community-context-picker select {
  width: 100%;
  min-width: 0;
  padding: 2px 0;
  border: 0;
  outline: 0;
  appearance: none;
  color: var(--gm-ink-50);
  background: transparent;
  font-size: 13px;
  font-weight:700;
  text-overflow: ellipsis;
}
.community-context-picker select:focus-visible { text-decoration: underline; text-decoration-color: var(--gm-violet-400); }
.community-context-picker select option,
.community-context-picker select optgroup { color: var(--gm-ink-50); background: var(--gm-ink-800); }
.community-context-picker-chevron { color: var(--gm-violet-400); font-size: 18px; text-align: center; }
.permission-community-picker { margin-bottom: 10px; }
.ticket-community-picker { margin: 2px 0 10px; }
.more-menu-connect .more-menu-icon {
  color: var(--gm-ink-100);
  background: linear-gradient(145deg, rgb(var(--gm-violet-500-rgb) / 0.42), rgb(var(--gm-violet-700-rgb) / 0.32));
  box-shadow: 0 0 22px rgb(var(--gm-violet-500-rgb) / 0.099);
}

@media (max-width: 340px) {
  .community-context-picker { grid-template-columns: 36px minmax(0, 1fr) 16px; gap: 8px; padding-inline: 10px; }
  .community-context-picker-icon { width: 36px; height: 36px; border-radius: 12px; }
}

/* Ticket community selection stays inside the dark Mini App surface instead of
   opening the platform-native white option popup. */
.ticket-community-picker .community-context-picker-icon svg,
.ticket-community-choice-icon svg,
.ticket-community-choice-row-icon svg {
  display: block;
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.community-context-picker-button {
  display: grid;
  gap: 2px;
  min-width: 0;
  min-height: 44px;
  padding: 3px 0;
  border: 0;
  outline: 0;
  color: var(--gm-ink-50);
  background: transparent;
  text-align: left;
}
.community-context-picker-button small {
  color: var(--gm-ink-300);
  font-size: 10px;
  font-weight:700;
}
.community-context-picker-button strong {
  min-width: 0;
  overflow: hidden;
  font-size: 13px;
  font-weight:700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.community-context-picker-button:focus-visible {
  border-radius: 8px;
  outline: 2px solid var(--gm-violet-400);
  outline-offset: 3px;
}
.community-context-picker-chevron {
  display: grid;
  place-items: center;
}
.community-context-picker-chevron svg,
.ticket-community-choice-chevron svg {
  display: block;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ticket-community-choice {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 62px;
  padding: 9px 12px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.14);
  border-radius: 16px;
  color: var(--gm-ink-50);
  background: linear-gradient(135deg, rgb(var(--gm-violet-800-rgb) / 0.7), rgb(var(--gm-ink-850-rgb) / 0.96));
  text-align: left;
}
.ticket-community-choice-icon,
.ticket-community-choice-row-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.13);
  border-radius: 12px;
  color: var(--gm-violet-400);
  background: rgb(var(--gm-violet-500-rgb) / 0.14);
}
.ticket-community-choice-copy,
.ticket-community-choice-row-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}
.ticket-community-choice-copy small,
.ticket-community-choice-row-copy small {
  color: var(--gm-ink-300);
  font-size: 10px;
  font-weight:700;
}
.ticket-community-choice-copy strong,
.ticket-community-choice-row-copy strong {
  min-width: 0;
  overflow: hidden;
  font-size: 13px;
  font-weight:700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ticket-community-choice-chevron { color: var(--gm-violet-400); }
.ticket-community-choice:focus-visible,
.ticket-community-choice-row:focus-visible {
  outline: 2px solid var(--gm-violet-400);
  outline-offset: 2px;
}
#ticket-community-picker-sheet { z-index: 130; color-scheme: dark; }
.ticket-community-choice-sheet {
  width: min(100%, 560px);
  max-height: min(76dvh, 660px);
  background: var(--gm-ink-800);
}
.ticket-community-choice-list {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}
.ticket-community-choice-group { display: grid; gap: 7px; }
.ticket-community-choice-group h3 {
  margin: 0;
  color: var(--gm-violet-400);
  font-size: 10px;
  font-weight:700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.ticket-community-choice-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 62px;
  padding: 9px 11px;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.075);
  border-radius: 16px;
  color: var(--gm-ink-50);
  background: var(--gm-ink-750);
  text-align: left;
}
.ticket-community-choice-row.selected {
  border-color: rgb(var(--gm-ink-50-rgb) / 0.16);
  background: linear-gradient(135deg, rgb(var(--gm-violet-700-rgb) / 0.38), var(--gm-ink-750) 72%);
}
.ticket-community-choice-check {
  color: var(--gm-violet-400);
  font-size: 18px;
  font-weight:700;
  text-align: center;
}
.ticket-community-choice-empty {
  margin: 0;
  padding: 18px 12px;
  border: 1px dashed rgb(var(--gm-ink-50-rgb) / 0.11);
  border-radius: 12px;
  color: var(--gm-ink-300);
  text-align: center;
}
#ticket-create-sheet,
#ticket-create-sheet select,
#ticket-create-sheet option,
#ticket-create-sheet optgroup {
  color-scheme: dark;
}
@media (max-width: 340px) {
  .ticket-community-choice,
  .ticket-community-choice-row { grid-template-columns: 36px minmax(0, 1fr) 18px; gap: 8px; padding-inline: 9px; }
  .ticket-community-choice-icon,
  .ticket-community-choice-row-icon { width: 36px; height: 36px; border-radius: 8px; }
}

/* Root tickets navigation returns to the page that opened the ticket list. */
#tickets-page .ticket-topline {
  grid-template-columns: 44px minmax(0, 1fr) auto 40px !important;
  column-gap: clamp(7px, 2.5vw, 11px) !important;
}
#tickets-page .ticket-topline-title {
  min-width: 0;
}
#tickets-page .ticket-list-back {
  display: grid;
  place-items: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid rgb(var(--gm-ink-50-rgb) / 0.15);
  border-radius: 12px;
  color: var(--gm-violet-300);
  background: rgb(var(--gm-ink-800-rgb) / 0.86);
  box-shadow: inset 0 1px 0 rgb(var(--gm-ink-50-rgb) / 0.035);
}
#tickets-page .ticket-list-back svg {
  display: block;
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#tickets-page .ticket-list-back:active {
  border-color: rgb(var(--gm-violet-400-rgb) / 0.58);
  background: rgb(var(--gm-violet-900-rgb) / 0.9);
  transform: translateY(1px);
}
#tickets-page .ticket-list-back:focus-visible {
  outline: 2px solid var(--gm-violet-400);
  outline-offset: 2px;
}
@media (max-width: 340px) {
  #tickets-page .ticket-topline {
    padding-inline: 12px !important;
  }
  #tickets-page .ticket-total {
    font-size: 17px;
  }
}

/* Promo treasury: one data-driven page, framed art and the owner's GM coins. */
body:has(#promo-page:not(.hidden)) .app-shell {
  width: min(100%, 960px);
  max-width: 960px;
  background: radial-gradient(ellipse at 65% 0, rgb(var(--gm-ink-700-rgb) / 0.251), transparent 55%), var(--gm-ink-900);
}
#promo-page {
  --promo-gold: var(--gm-gold-400);
  --promo-cream: var(--gm-ink-100);
  --promo-muted: var(--gm-ink-300);
  --promo-line: var(--gm-line-strong);
  --promo-edge: clamp(12px, 2.66vw, 25px);
  --promo-serif: var(--gm-font-display);
  --promo-corner: 9px;
  container-type: inline-size;
  padding: clamp(8px, 1.7vw, 16px) var(--promo-edge) calc(32px + max(env(safe-area-inset-bottom, 0px), var(--tg-safe-area-inset-bottom, 0px)));
  color: var(--promo-cream);
}
#promo-page *, #promo-editor-sheet * { box-sizing: border-box; }
#promo-page .promo-redeem-card {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
  gap: 0;
  position: relative;
  min-height: clamp(292px, 43.05vw, 405px);
  padding: clamp(14px, 2.1vw, 20px);
  overflow: visible;
  border: 1px solid transparent;
  border-image: none;
  border-radius: 0;
  background: var(--gm-ink-900);
  isolation: isolate;
}
#promo-page .promo-redeem-card::before {
  content: '';
  position: absolute;
  inset: -1px;
  z-index: -1;
  pointer-events: none;
  border: 1px solid transparent;
  border-image-source: url('/static/promos/promo-frame-v1.webp?v=1');
  border-image-slice: 80 fill;
  border-image-width: clamp(16px, 2.6vw, 25px);
  border-image-repeat: stretch;
  mix-blend-mode: screen;
}
#promo-page .promo-redeem-visual {
  position: relative;
  align-self: stretch;
  min-width: 0;
  min-height: 0;
  display: grid;
  align-items: center;
}
#promo-page .promo-redeem-art {
  display: block;
  width: 100%;
  height: auto;
  max-height: 363px;
  object-fit: contain;
  filter: none;
  mix-blend-mode: lighten;
  mask-image: linear-gradient(90deg, var(--gm-ink-950) 90%, transparent);
}
#promo-page .promo-redeem-coins {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 33%;
  height: auto;
  max-height: 40%;
  object-fit: contain;
  pointer-events: none;
}
#promo-page .promo-redeem-content {
  display: grid;
  grid-template-columns: auto;
  align-content: center;
  gap: clamp(14px, 2.1vw, 20px);
  min-width: auto;
  padding: clamp(10px, 1.8vw, 17px) clamp(4px, 1.6vw, 15px);
}
#promo-page .promo-redeem-content h3 {
  margin: 0;
  color: var(--gm-gold-400);
  font: 400 clamp(1.375rem, 3.4vw, 2rem)/1.2 var(--gm-font-display);
  text-align: center;
  overflow-wrap: anywhere;
}
#promo-page .promo-redeem-row { display: grid; grid-template-columns: auto; gap: clamp(14px, 2.2vw, 21px); min-width: auto; }
#promo-page .promo-redeem-row label { min-width: 0; }
#promo-page .promo-redeem-row input {
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: clamp(48px, 6.6vw, 62px);
  padding: 14px clamp(12px, 2.1vw, 20px);
  border: 1px solid var(--gm-line-strong);
  border-radius: 8px 4px;
  background: var(--gm-ink-900);
  color: var(--promo-cream);
  font-size: clamp(1rem, 2.5vw, 1.375rem);
  font-weight:400;
  line-height: 1.4;
}
#promo-page .promo-redeem-row input::placeholder { color: var(--gm-ink-300); font-weight:400; }
#promo-page .promo-redeem-row .button {
  position: relative;
  width: 100%;
  min-width: max-content;
  min-height: clamp(52px, 9.8vw, 92px);
  margin: 0;
  padding: 14px clamp(7px, 1.4vw, 13px);
  border: 3px double var(--gm-line-strong);
  border-radius: 12px 4px;
  color: var(--gm-ink-800);
  background: repeating-linear-gradient(135deg, transparent 0 13px, rgb(var(--gm-gold-300-rgb) / 0.071) 13px 14px), linear-gradient(155deg, var(--gm-gold-300), var(--gm-gold-400) 30%, var(--gm-gold-500) 57%, var(--gm-gold-400) 85%, var(--gm-gold-700));
  box-shadow: inset 0 0 0 4px rgb(var(--gm-gold-700-rgb) / 0.173), inset 0 0 0 6px rgb(var(--gm-gold-300-rgb) / 0.177), 0 4px 10px rgb(var(--gm-ink-950-rgb) / 0.6);
  font: 700 clamp(.875rem, 3.2vw, 1.875rem)/1.2 var(--gm-font-ui);
  letter-spacing: .02em;
  text-transform: uppercase;
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}
#promo-page .promo-redeem-row .button:disabled { opacity: .72; cursor: not-allowed; }
#promo-page .promo-redeem-row .button:not(:disabled):hover { filter: brightness(1.1); }
#promo-page .promo-redeem-row .button:not(:disabled):active { transform: translateY(1px); }
#promo-page .promo-result {
  min-height: 0;
  padding: 0 clamp(0px, 1.8vw, 17px);
  color: var(--promo-muted);
  font-size: clamp(.8125rem, 2.05vw, 1.1875rem);
  line-height: 1.45;
  overflow-wrap: anywhere;
}
#promo-page .promo-result strong, #promo-page .promo-result span { font-size: inherit; }
#promo-page .promo-result-success, #promo-page .promo-result-error { padding: 12px; }
#promo-page .promo-result-success { color: var(--gm-ink-100); }
#promo-page .promo-result-error { color: var(--gm-red-400); }
#promo-page .promo-divider {
  display: flex;
  align-items: center;
  gap: 0;
  width: 100%;
  height: clamp(50px, 8.15vw, 77px);
}
#promo-page .promo-divider::before, #promo-page .promo-divider::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--gm-gold-700), var(--gm-gold-500)); }
#promo-page .promo-divider::after { transform: scaleX(-1); }
#promo-page .promo-divider svg { width: clamp(60px, 12vw, 115px); height: 38px; fill: none; stroke: var(--gm-gold-500); stroke-width: 1; }
#promo-page .promo-page-section {
  margin: 0;
  padding: 0 clamp(0px, .55vw, 5px);
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: none;
}
#promo-page .promo-section-heading {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  min-height: 0;
  margin-bottom: clamp(12px, 1.8vw, 17px);
  padding: 0 clamp(0px, 2.1vw, 20px);
  gap: 12px;
  border: 0;
}
#promo-page .promo-section-heading > div { min-width: 0; }
#promo-page .promo-section-heading h2 {
  margin: 0;
  color: var(--promo-cream);
  font: 500 clamp(1.25rem, 3.3vw, 1.9375rem)/1.2 var(--gm-font-display);
  overflow-wrap: anywhere;
}
#promo-page .promo-section-count {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  min-width: 36px;
  min-height: 36px;
  padding: 3px 8px;
  border: 1px solid var(--gm-violet-700);
  border-radius: 8px 4px;
  color: var(--gm-violet-400);
  font: 500 clamp(1rem, 2.6vw, 1.5rem)/1.1 var(--gm-font-ui);
}
#promo-page .promo-history-list { display: grid; gap: 12px; }
#promo-page .promo-history-item {
  display: grid;
  grid-template-columns: clamp(42px, 7.5vw, 70px) minmax(0, 1fr) minmax(0, auto);
  align-items: center;
  min-height: clamp(92px, 11.25vw, 106px);
  padding: clamp(12px, 1.7vw, 16px) clamp(12px, 2.1vw, 20px);
  gap: clamp(12px, 2vw, 19px);
  border: 1px solid var(--gm-ink-500);
  border-radius: 8px 4px;
  background: linear-gradient(115deg, var(--gm-ink-850), var(--gm-ink-900));
}
#promo-page .promo-history-item:last-child { border-bottom: 1px solid var(--gm-ink-500); }
#promo-page .promo-history-icon { display: grid; place-items: center; min-width: 0; color: var(--gm-violet-400); }
#promo-page .promo-history-icon img, #promo-page .promo-history-icon svg { display: block; width: 100%; height: auto; max-height: 70px; object-fit: contain; }
#promo-page .promo-history-main { min-width: 0; display: grid; gap: 3px; }
#promo-page .promo-history-item strong { font: 500 clamp(1.0625rem, 3vw, 1.75rem)/1.2 var(--gm-font-ui); color: var(--promo-cream); overflow-wrap: anywhere; }
#promo-page .promo-history-item small, #promo-page .promo-history-item time {
  overflow: visible;
  min-width: 0;
  color: var(--promo-muted);
  font: 400 clamp(.8125rem, 2.7vw, 1.5625rem)/1.3 var(--gm-font-ui);
  white-space: normal;
  overflow-wrap: anywhere;
}
#promo-page .promo-empty { padding: 24px 14px; color: var(--promo-muted); font-size: 1rem; overflow-wrap: anywhere; }
#promo-page .promo-admin-section { margin-top: clamp(28px, 3.5vw, 33px); }
#promo-page .promo-admin-heading { margin-bottom: clamp(18px, 3vw, 28px); }
#promo-page .promo-admin-heading .eyebrow { display: block; margin-top: 4px; color: var(--promo-gold); font: 400 clamp(.875rem, 2.65vw, 1.5625rem)/1.2 var(--gm-font-ui); letter-spacing: 0; text-transform: none; }
#promo-page .promo-create-button {
  flex: 0 0 auto;
  width: clamp(44px, 6.6vw, 62px);
  height: clamp(44px, 6.6vw, 62px);
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--gm-line-strong);
  border-radius: 8px 4px;
  background: linear-gradient(135deg, var(--gm-ink-800), var(--gm-ink-900));
  color: var(--promo-gold);
  box-shadow: inset 0 0 0 4px var(--gm-ink-900), inset 0 0 0 5px rgb(var(--gm-ink-500-rgb) / 0.376);
}
#promo-page .promo-create-button svg { width: 65%; height: 65%; stroke-width: 1.5; }
#promo-page .promo-admin-tools { display: grid; gap: clamp(14px, 2.1vw, 20px); padding: 0; border: 0; background: transparent; }
#promo-page .promo-admin-search {
  grid-template-columns: clamp(20px, 2.6vw, 25px) minmax(0, 1fr);
  gap: clamp(12px, 2.7vw, 26px);
  min-height: clamp(48px, 6.2vw, 59px);
  padding: 0 clamp(12px, 2.5vw, 24px);
  border: 1px solid var(--gm-ink-500);
  border-radius: 8px 4px;
  background: var(--gm-ink-900);
  color: var(--promo-muted);
}
#promo-page .promo-admin-search svg { width: 100%; height: auto; }
#promo-page .promo-admin-search input { min-height: 44px; padding: 10px 0; color: var(--promo-cream); font: 400 clamp(.9375rem, 2.7vw, 1.5625rem)/1.3 var(--gm-font-ui); }
#promo-page .promo-admin-search input::placeholder { color: var(--promo-muted); }
#promo-page .promo-admin-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2.5vw, 24px); }
#promo-page .promo-admin-filters label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 9px;
  min-width: 0;
  min-height: clamp(48px, 6.4vw, 60px);
  padding: 0 12px;
  border: 1px solid var(--gm-ink-500);
  border-radius: 8px 4px;
  background: var(--gm-ink-900);
  color: var(--promo-muted);
  font: 400 clamp(.8125rem, 2.5vw, 1.4375rem)/1.3 var(--gm-font-ui);
}
#promo-page .promo-admin-filters label > span { padding: 8px 0; }
#promo-page .promo-admin-filters select {
  flex: 1 1 110px;
  width: 0;
  min-width: 0;
  min-height: 46px;
  padding: 8px 2px;
  border: 0;
  border-radius: 0;
  color: var(--promo-cream);
  background: var(--gm-ink-900);
  color-scheme: dark;
  font: inherit;
}
#promo-page .promo-admin-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
  min-height: clamp(88px, 12.5vw, 118px);
  padding: clamp(12px, 2.3vw, 22px) 8px;
  border: 1px solid var(--gm-ink-500);
  border-radius: 8px 4px;
  color: var(--promo-muted);
  background: linear-gradient(115deg, var(--gm-ink-850), var(--gm-ink-900));
  font-size: 1rem;
  overflow-wrap: anywhere;
}
#promo-page .promo-admin-summary > span { display: grid; align-content: center; gap: 5px; min-width: 0; padding: 0 4px; border: 0; border-right: 1px solid var(--gm-ink-500); border-radius: 0; background: none; text-align: center; }
#promo-page .promo-admin-summary > span:last-child { border-right: 0; }
#promo-page .promo-admin-summary strong { color: var(--gm-gold-500); font: 500 clamp(1.25rem, 4vw, 2.3125rem)/1.1 var(--gm-font-display); }
#promo-page .promo-admin-summary small { color: var(--promo-muted); font: 400 clamp(.75rem, 2.7vw, 1.5625rem)/1.2 var(--gm-font-ui); overflow-wrap: anywhere; }
#promo-page .promo-admin-list { display: grid; gap: clamp(12px, 1.9vw, 18px); padding: 0; margin-top: clamp(14px, 2.1vw, 20px); }
#promo-page .promo-admin-item {
  --promo-status-color: var(--gm-gold-500);
  --promo-status-rgb: 96, 109, 30;
  position: relative;
  display: grid;
  grid-template-columns: clamp(52px, 10.3vw, 97px) minmax(0, 1fr) minmax(0, .56fr);
  align-items: stretch;
  column-gap: clamp(14px, 2.7vw, 26px);
  row-gap: 0;
  width: 100%;
  min-height: clamp(110px, 14.7vw, 138px);
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--promo-status-color) 50%, var(--gm-ink-750)) !important;
  border-radius: 8px 4px;
  background: linear-gradient(115deg, rgba(var(--promo-status-rgb), .075), var(--gm-ink-900) 50%);
  color: var(--promo-cream);
  cursor: pointer;
}
#promo-page .promo-admin-item[data-status='scheduled'] { --promo-status-color: var(--gm-teal-400); --promo-status-rgb: 17, 106, 158; }
#promo-page .promo-admin-item[data-status='expired'] { --promo-status-color: var(--gm-violet-400); --promo-status-rgb: 131, 42, 155; }
#promo-page .promo-admin-item[data-status='disabled'] { --promo-status-color: var(--gm-ink-300); --promo-status-rgb: 96, 92, 110; }
#promo-page .promo-admin-emblem {
  display: grid;
  place-items: center;
  grid-row: 1 / span 2;
  min-width: 0;
  padding: 8px;
  align-self: stretch;
  border-right: 1px solid color-mix(in srgb, var(--promo-status-color) 55%, var(--gm-ink-750));
  border-radius: 8px 0 0 4px;
  color: var(--promo-status-color);
  background: radial-gradient(ellipse at 50% 0, rgba(var(--promo-status-rgb), .32), transparent 80%);
  box-shadow: inset 0 0 0 4px rgb(var(--gm-ink-900-rgb) / 0.376), inset 0 0 0 5px color-mix(in srgb, var(--promo-status-color) 30%, transparent);
}
#promo-page .promo-admin-emblem svg, #promo-page .promo-admin-emblem img { display: block; width: 75%; height: auto; max-height: 70px; object-fit: contain; }
#promo-page .promo-admin-main { display: grid; align-content: center; min-width: 0; padding: 17px 0; gap: 11px; }
#promo-page .promo-admin-code-line { display: flex; align-items: center; flex-wrap: wrap; gap: 7px clamp(8px, 1.3vw, 12px); min-width: 0; }
#promo-page .promo-admin-code-line strong { color: var(--promo-cream); font: 500 clamp(1.0625rem, 3.4vw, 2rem)/1.2 var(--gm-font-ui); letter-spacing: 0; overflow-wrap: anywhere; min-width: 0; max-width: 100%; }
#promo-page .promo-copy-code { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 1px solid var(--gm-line-strong); border-radius: 8px 4px; color: var(--gm-gold-400); background: var(--gm-ink-850); }
#promo-page .promo-copy-code svg { width: 25px; height: 25px; }
#promo-page .promo-status { display: block; max-width: 100%; padding: 6px 12px; border: 1px solid color-mix(in srgb, var(--promo-status-color) 40%, transparent); border-radius: 8px 4px; color: var(--promo-status-color); background: rgba(var(--promo-status-rgb), .11); font: 400 clamp(.8125rem, 2.6vw, 1.5rem)/1.2 var(--gm-font-ui); white-space: normal; overflow-wrap: anywhere; }
#promo-page .promo-admin-effects { min-width: 0; overflow: visible; color: var(--gm-violet-400); font: 400 clamp(.875rem, 2.7vw, 1.5625rem)/1.3 var(--gm-font-ui); white-space: normal; overflow-wrap: anywhere; }
#promo-page .promo-admin-item[data-status='active'] .promo-admin-effects { color: var(--gm-gold-400); }
#promo-page .promo-admin-side { display: grid; align-content: center; grid-template-columns: minmax(0, 1fr) 24px; row-gap: 20px; column-gap: 8px; min-width: 0; padding: 18px clamp(12px, 2.7vw, 26px) 18px 0; }
#promo-page .promo-admin-uses, #promo-page .promo-admin-validity { display: block; min-width: 0; max-width: none; margin: 0; padding: 0; color: var(--promo-muted); font: 400 clamp(.8125rem, 2.6vw, 1.5rem)/1.3 var(--gm-font-ui); text-align: left; overflow-wrap: anywhere; }
#promo-page .promo-admin-uses { grid-column: 1; grid-row: 1; }
#promo-page .promo-admin-validity { grid-column: 1; grid-row: 2; }
#promo-page .promo-admin-validity span { overflow: visible; white-space: normal; }
#promo-page .promo-admin-chevron { grid-column: 2; grid-row: 1 / span 2; align-self: center; width: 24px; height: 30px; color: var(--gm-gold-400); }
#promo-page :is(button, input, select, [role='button']):focus-visible { outline: 2px solid var(--gm-line-strong); outline-offset: 3px; }
#promo-page .promo-subscription-link { align-self: start; justify-self: start; min-width: 44px; min-height: 44px; max-width: 100%; padding: .45em .7em; border: 1px solid var(--gm-violet-400); border-radius: 8px; background: var(--gm-violet-900); color: var(--gm-ink-100); font: inherit; white-space: nowrap; }
#promo-editor-sheet {
  --pe-gold: var(--gm-gold-500);
  --pe-line: var(--gm-line-strong);
  --pe-cream: var(--gm-ink-100);
  --pe-muted: var(--gm-ink-200);
  background: rgb(var(--gm-ink-950-rgb) / 0.839);
  backdrop-filter: blur(6px);
}
#promo-editor-sheet .promo-editor-sheet {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  width: min(100%, 720px);
  height: min(92dvh, 900px);
  max-height: min(92dvh, 900px);
  overflow: hidden;
  padding: 10px clamp(10px, 3vw, 22px) max(14px, env(safe-area-inset-bottom, 0px), var(--tg-safe-area-inset-bottom, 0px));
  border: 1px solid var(--gm-line-strong);
  border-radius: 20px 20px 12px 12px;
  background: radial-gradient(ellipse at 15% 0, var(--gm-ink-750), var(--gm-ink-900) 55%);
  color: var(--gm-ink-100);
  font: 400 .9375rem/1.45 var(--gm-font-ui);
  container-type: inline-size;
}
#promo-editor-sheet .sheet-handle { background: var(--gm-ink-400); }
#promo-editor-sheet .sheet-heading { position: static; min-width: 0; gap: 10px; padding: 8px 0 16px; align-items: start; }
#promo-editor-sheet .sheet-heading > div { flex: 1; min-width: 0; }
#promo-editor-sheet .sheet-heading .eyebrow { color: var(--gm-violet-400); font-size: .6875rem; letter-spacing: .06em; }
#promo-editor-sheet .sheet-heading h2 { margin: 4px 0 0; color: var(--pe-cream); font: 400 clamp(1.25rem, 5cqi, 2rem)/1.2 var(--gm-font-display); overflow-wrap: anywhere; }
#promo-editor-sheet #close-promo-editor { flex: 0 0 44px; width: 44px; height: 44px; min-width: 44px; padding: 0; border: 1px solid var(--gm-ink-500); border-radius: 8px; background: var(--gm-ink-800); color: var(--gm-ink-100); font-size: 28px; line-height: 1; }
#promo-editor-sheet .promo-editor-stack { display: grid; align-content: start; gap: 12px; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; padding-bottom: 8px; scrollbar-gutter: stable; }
#promo-editor-sheet .promo-form-section { display: grid; gap: 13px; min-width: 0; padding: clamp(10px, 3cqi, 20px); border: 1px solid var(--pe-line); border-radius: 8px; background: linear-gradient(145deg, rgb(var(--gm-ink-850-rgb) / 0.941), rgb(var(--gm-ink-900-rgb) / 0.961)); }
#promo-editor-sheet details.promo-form-section { display: block; }
#promo-editor-sheet .promo-form-section-head { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; align-items: center; min-width: 0; }
#promo-editor-sheet summary.promo-form-section-head { grid-template-columns: 26px minmax(0, 1fr) 12px; min-height: 44px; list-style: none; cursor: pointer; }
#promo-editor-sheet summary::-webkit-details-marker { display: none; }
#promo-editor-sheet summary::after { content: "⌄"; color: var(--gm-violet-400); font-size: 20px; line-height: 1; }
#promo-editor-sheet details[open] > summary::after { content: "⌃"; }
#promo-editor-sheet .promo-form-section-head > div { display: grid; gap: 4px; min-width: 0; }
#promo-editor-sheet .promo-form-section-head strong { color: var(--pe-cream); font: 400 1.15em/1.25 var(--gm-font-ui); }
#promo-editor-sheet .promo-form-section-head small { color: var(--pe-muted); font-size: .8em; line-height: 1.4; }
#promo-editor-sheet .promo-form-icon { width: 26px; height: 30px; border: 1px solid var(--gm-line-strong); border-radius: 8px; background: var(--gm-ink-800); color: var(--pe-gold); font: 400 18px/1 var(--gm-font-ui); }
#promo-editor-sheet .promo-section-content { display: grid; gap: 13px; margin-top: 16px; min-width: 0; }
#promo-editor-sheet :is(label, .settings-field, .promo-form-section-head > div) { min-width: 0; overflow-wrap: anywhere; }
#promo-editor-sheet .settings-field { display: grid; gap: 7px; margin: 0; }
#promo-editor-sheet .settings-field > span { color: var(--gm-gold-400); font-size: .9em; font-weight:400; }
#promo-editor-sheet :is(input, select, textarea) { min-width: 0; max-width: 100%; font: inherit; line-height: 1.3; }
#promo-editor-sheet :is(input:not([type='checkbox']), select, textarea) { width: 100%; min-height: 44px; padding: .7em .65em; border: 1px solid var(--pe-line); border-radius: 4px; background: var(--gm-ink-900); color: var(--gm-ink-100); }
#promo-editor-sheet input[type='datetime-local'] { display: block; }
#promo-editor-sheet textarea { resize: vertical; }
#promo-editor-sheet input[type='checkbox'] { width: 22px; height: 22px; flex: 0 0 22px; accent-color: var(--gm-violet-500); }
#promo-editor-sheet :is(input, textarea)::placeholder { color: var(--gm-ink-300); opacity: 1; }
#promo-editor-sheet :is(button, input, textarea, select, summary):focus-visible { outline: 2px solid var(--gm-violet-400); outline-offset: 2px; }
#promo-editor-sheet :is(button, input, select):disabled { opacity: .55; }
#promo-editor-sheet :is(button, input:not([type='checkbox']), select) { min-height: 44px; }
#promo-editor-sheet button { min-width: 44px; cursor: pointer; }
#promo-editor-sheet .promo-code-create-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; }
#promo-editor-sheet .promo-two-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12em), 1fr)); gap: 12px; }
#promo-editor-sheet :is(.promo-generate-button, .promo-secondary-button, #save-promo-code, #delete-promo-code) { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: auto; height: auto; min-height: 44px; margin: 0 !important; padding: .6em .8em !important; border: 1px solid var(--gm-ink-400); border-radius: 8px; background: linear-gradient(140deg, var(--gm-ink-800), var(--gm-ink-900)); color: var(--gm-ink-100); font: inherit !important; line-height: 1.3; overflow-wrap: normal; word-break: normal; white-space: nowrap; }
#promo-editor-sheet #promo-refresh-options { justify-self: start; padding-inline: min(.8em, 3cqi) !important; }
#promo-editor-sheet .promo-toggle-row { min-height: 44px; padding: 9px 10px; gap: 10px; border: 1px solid var(--gm-ink-500); border-radius: 8px; background: rgb(var(--gm-ink-800-rgb) / 0.267); }
#promo-editor-sheet .promo-toggle-row > span { display: grid; gap: 3px; min-width: 0; }
#promo-editor-sheet .promo-toggle-row strong { color: var(--pe-cream); font-size: .95em; font-weight:500; }
#promo-editor-sheet .promo-toggle-row small { color: var(--pe-muted); font-size: .8em; }
#promo-editor-sheet .promo-reward-group { display: grid; gap: 12px; min-width: 0; padding: 13px 0 0; border: 0; border-top: 1px solid var(--gm-ink-500); border-radius: 0; background: transparent; }
#promo-editor-sheet .promo-reward-group-title { color: var(--gm-gold-400); font-size: .9em; font-weight:500; }
#promo-editor-sheet .promo-reward-group-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
#promo-editor-sheet .promo-reward-group-head strong { color: var(--pe-cream); font-weight:500; font-size: 1em; overflow-wrap: anywhere; }
#promo-editor-sheet :is(.promo-add-reward, .promo-remove-reward) { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 1px solid var(--gm-ink-400); border-radius: 8px; background: var(--gm-violet-900); color: var(--gm-violet-300); font-size: 26px; line-height: 1; }
#promo-editor-sheet .promo-remove-reward { align-self: end; border-color: var(--gm-ink-500); background: var(--gm-ink-800); color: var(--gm-red-400); }
#promo-editor-sheet .promo-asset-rewards { display: grid; gap: 12px; min-width: 0; }
#promo-editor-sheet .promo-asset-row { display: grid; gap: 10px; min-width: 0; padding: 12px; border: 1px solid var(--gm-ink-500); border-radius: 8px; background: var(--gm-ink-900); }
#promo-editor-sheet .promo-asset-row-head { display: grid; grid-template-columns: minmax(0, 1fr) 44px; gap: 10px; min-width: 0; }
#promo-editor-sheet .promo-asset-quantity { width: min(100%, 10em); }
#promo-editor-sheet .promo-duration-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 6em), 1fr)); gap: 8px; }
#promo-editor-sheet .promo-duration-grid > label { display: grid; gap: 6px; }
#promo-editor-sheet .promo-duration-grid small { color: var(--pe-muted); font-size: .8em; }
#promo-editor-sheet .promo-duration-grid input { text-align: center; }
#promo-editor-sheet :is(.settings-help, .settings-field > small) { margin: 0; color: var(--pe-muted); font-size: .8em; line-height: 1.45; overflow-wrap: anywhere; }
#promo-editor-sheet .settings-help:empty { display: none; }
#promo-editor-sheet .promo-options-error { color: var(--gm-ink-200); }
#promo-editor-sheet .promo-editor-actions { position: static; bottom: auto; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; margin-top: 0; padding-top: 12px; border-top: 1px solid var(--gm-ink-500); background: transparent; }
#promo-editor-sheet #save-promo-code { border-color: var(--gm-line-strong); box-shadow: inset 0 0 0 2px rgb(var(--gm-red-800-rgb) / 0.55); background: linear-gradient(120deg, var(--gm-violet-800), var(--gm-violet-700) 65%, var(--gm-violet-800)); color: var(--gm-ink-100); }
#promo-editor-sheet #delete-promo-code { color: var(--gm-ink-200); border-color: var(--gm-ink-500); }
#promo-editor-sheet .promo-editor-error { grid-column: 1 / -1; margin: 0; padding: 8px 10px; max-height: 5em; overflow-y: auto; border: 1px solid var(--gm-line-strong); border-radius: 8px; background: var(--gm-ink-800); color: var(--gm-ink-200); font-size: .8em; line-height: 1.4; overflow-wrap: anywhere; }
@container (max-width: 25rem) {
  #promo-editor-sheet .promo-code-create-row { grid-template-columns: minmax(0, 1fr); }
  #promo-editor-sheet .promo-generate-button { justify-self: start; }
}
@media (max-width: 740px) {
  #promo-page .promo-admin-item { grid-template-columns: clamp(52px, 10.3vw, 76px) minmax(0, 1fr); }
  #promo-page .promo-admin-main { padding-right: 14px; padding-bottom: 8px; }
  #promo-page .promo-admin-side { grid-column: 2; grid-template-columns: minmax(0, 1fr) 24px; grid-template-rows: auto auto; padding: 0 14px 14px 0; gap: 5px 8px; }
  #promo-page .promo-admin-emblem { grid-row: 1 / span 2; }
  #promo-page .promo-history-item { grid-template-columns: clamp(42px, 7.5vw, 56px) minmax(0, 1fr); }
  #promo-page .promo-history-icon { grid-row: 1 / span 2; }
  #promo-page .promo-history-item time { grid-column: 2; }
}
@media (max-width: 540px) {
  #promo-page .promo-redeem-card { min-height: clamp(184px, 55vw, 292px); padding: 8px; }
  #promo-page .promo-redeem-content { gap: 6px; padding: 4px; }
  #promo-page .promo-redeem-content h3 { font-size: 1rem; line-height: 1.1; overflow-wrap: normal; }
  #promo-page .promo-redeem-row { gap: 6px; }
  #promo-page .promo-redeem-row input { min-height: 44px; padding: 6px 8px; line-height: 1.2; }
  #promo-page .promo-redeem-row input::placeholder { font-size: .7em; letter-spacing: -.02em; }
  #promo-page .promo-redeem-row .button { min-height: 44px; padding: 4px; font-size: clamp(.625rem, 3.2vw, .75rem); letter-spacing: 0; white-space: nowrap; overflow-wrap: normal; }
  #promo-page .promo-result-hint { font-size: .625rem; line-height: 1.3; }
  #promo-page .promo-redeem-visual { overflow: hidden; }
  #promo-page .promo-redeem-art { transform: scale(1.1); }
  #promo-page .promo-admin-filters { grid-template-columns: minmax(0, 1fr); }
  #promo-page .promo-admin-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 16px; }
  #promo-page .promo-admin-summary > span:nth-child(2) { border-right: 0; }
}
@container (min-width: 18rem) and (max-width: 33.75rem) {
  #promo-page .promo-redeem-card { grid-template-columns: minmax(0, .85fr) minmax(min-content, 1.15fr); }
}
@media (max-width: 319px) {
  #promo-page .promo-redeem-card { grid-template-columns: minmax(0, 1fr); padding: 16px; }
  #promo-page .promo-redeem-visual { width: min(100%, 300px); justify-self: center; }
  #promo-page .promo-redeem-art { max-height: 240px; mask-image: none; }
  #promo-page .promo-redeem-coins { left: 4%; bottom: 3%; max-height: 35%; }
  #promo-page .promo-redeem-content { padding: 5px 0 12px; }
}
