@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap");

:root {
  color-scheme: light;
  --bg: #f5f6f8;
  --surface: rgba(255, 255, 255, .86);
  --surface-solid: #fff;
  --ink: #14151a;
  --muted: #737782;
  --line: #e7e8ec;
  --violet: #6757e5;
  --violet-dark: #4c3bc9;
  --violet-soft: #eeebff;
  --mint: #38c995;
  --mint-soft: #e4f9f1;
  --orange: #ff9d55;
  --danger: #e95e6b;
  --shadow: 0 22px 65px rgba(30, 29, 45, .08);
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 16px;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #101116;
  --surface: rgba(28, 29, 37, .9);
  --surface-solid: #1c1d25;
  --ink: #f2f2f6;
  --muted: #a5a7b2;
  --line: #30313c;
  --violet: #8171f1;
  --violet-dark: #9a8eff;
  --violet-soft: #2c2848;
  --mint-soft: #19382f;
  --shadow: 0 22px 65px rgba(0, 0, 0, .3);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background: var(--bg);
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, textarea, select { font: inherit; }
input, textarea, select { color: var(--ink); caret-color: var(--violet); }
input::placeholder, textarea::placeholder { color: #8a8d96; opacity: 1; }
button { -webkit-tap-highlight-color: transparent; }
select option, select optgroup { color: #14151a; background: #fff; }
svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.app-container { max-width: 1120px; }
.ambient { position: fixed; z-index: -1; border-radius: 999px; pointer-events: none; filter: blur(4px); }
.ambient-one { width: 420px; height: 420px; top: -250px; right: -100px; background: rgba(126, 106, 255, .12); }
.ambient-two { width: 360px; height: 360px; bottom: 0; left: -250px; background: rgba(56, 201, 149, .1); }

.site-header { position: relative; z-index: 20; padding: 18px 0; }
.header-inner { display: flex; min-height: 50px; gap: 12px; align-items: center; }
.brand { display: inline-flex; gap: 10px; align-items: center; color: var(--ink); font-size: 18px; font-weight: 800; letter-spacing: -.045em; text-decoration: none; }
.brand:hover { color: var(--ink); }
.brand-mark { display: grid; width: 36px; height: 36px; place-items: center; color: white; border-radius: 11px; background: linear-gradient(145deg, #7c6cec, #5442d1); box-shadow: 0 8px 18px rgba(103, 87, 229, .26); }
.brand-mark svg { width: 22px; height: 22px; fill: currentColor; stroke: none; }
.brand-dot { color: var(--violet); }
.user-chip { display: flex; padding: 4px 6px 4px 4px; gap: 10px; align-items: center; color: inherit; border: 0; border-radius: 999px; background: transparent; text-align: left; transition: background .2s ease; }
.user-chip:hover { background: rgba(103,87,229,.08); }
.user-avatar { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; color: #5142bb; border: 1px solid #dcd7ff; border-radius: 50%; background: var(--violet-soft); font-size: 13px; font-weight: 800; }
.user-avatar img, .profile-avatar img { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; }
.user-avatar, .profile-avatar { position: relative; overflow: hidden; }
.user-avatar b, .profile-avatar b { font: inherit; }
.preferences-trigger { display: flex; min-height: 46px; margin-left: auto; padding: 7px 11px; gap: 8px; align-items: center; color: var(--ink); border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.82); font: inherit; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.preferences-trigger:hover { border-color: #d2ccff; box-shadow: 0 9px 24px rgba(48,40,104,.09); transform: translateY(-1px); }
.preferences-trigger span { font-size: 20px; line-height: 1; }
.preferences-trigger strong { font-size: 13px; font-weight: 750; }
.preferences-trigger svg { width: 15px; height: 15px; color: #898a94; }
.user-copy { display: flex; flex-direction: column; line-height: 1.25; }
.user-copy strong { font-size: 13px; font-weight: 700; }
.user-copy small { color: var(--muted); font-size: 11px; }
.secure-label { display: flex; gap: 7px; align-items: center; color: var(--muted); font-size: 12px; font-weight: 600; }
.secure-label svg { width: 16px; height: 16px; color: var(--mint); }
.page-main { padding-top: 32px; padding-bottom: 88px; }

.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
.balance-card { position: relative; min-height: 352px; overflow: hidden; padding: 34px 36px; color: white; border-radius: var(--radius-xl); background: linear-gradient(140deg, #17171e 4%, #25213b 55%, #4d3bc1 140%); box-shadow: 0 28px 72px rgba(36, 29, 82, .19); isolation: isolate; }
.balance-card::before { position: absolute; z-index: -1; width: 270px; height: 270px; right: -50px; bottom: -130px; content: ""; border-radius: 50%; background: #7968ef; filter: blur(20px); opacity: .48; }
.balance-topline, .balance-footer { display: flex; position: relative; z-index: 2; align-items: center; justify-content: space-between; }
.balance-label { display: flex; gap: 9px; align-items: center; color: rgba(255,255,255,.68); font-size: 13px; font-weight: 600; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: #61e4b5; box-shadow: 0 0 0 5px rgba(97,228,181,.12); }
.currency-badge { padding: 7px 11px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(255,255,255,.08); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.balance-number { display: flex; min-height: 192px; align-items: center; }
.balance-number span { font-size: clamp(58px, 8.2vw, 94px); font-weight: 700; letter-spacing: -.075em; line-height: .95; }
.balance-footer { padding-top: 23px; border-top: 1px solid rgba(255,255,255,.12); }
.balance-footer > div:first-child { display: flex; gap: 5px; flex-direction: column; }
.balance-footer small { color: rgba(255,255,255,.53); font-size: 11px; }
.balance-footer strong { font-size: 14px; }
.balance-actions { display: flex; gap: 10px; align-items: center; }
.balance-history-link { padding: 10px 13px; color: rgba(255,255,255,.86); border: 1px solid rgba(255,255,255,.16); border-radius: 11px; background: rgba(255,255,255,.08); font-size: 9px; font-weight: 750; text-decoration: none; }
.balance-history-link:hover { color: white; background: rgba(255,255,255,.14); }
.balance-orbit { position: absolute; z-index: -1; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; }
.orbit-one { width: 280px; height: 280px; right: -70px; top: 10px; }
.orbit-two { width: 180px; height: 180px; right: -20px; top: 60px; }

.provider-terms { display: flex; margin-top: 18px; padding: 14px; gap: 11px; align-items: flex-start; border: 1px solid #f0dfad; border-radius: 14px; background: #fffaf0; }
.provider-terms-icon { display: grid; width: 24px; height: 24px; flex: 0 0 auto; place-items: center; color: #8a6512; border-radius: 50%; background: #f9e9b9; font-size: 14px; font-weight: 850; }
.provider-terms strong { display: block; color: #433715; font-size: 12px; }
.provider-terms p { margin: 4px 0 6px; color: #75673f; font-size: 10px; line-height: 1.45; }
.provider-terms a { color: #6551d9; font-size: 10px; font-weight: 750; text-decoration: none; }
.provider-terms a:hover { text-decoration: underline; }

.micro-label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }

.content-section { padding-top: 76px; }
.section-title { display: flex; margin-bottom: 24px; gap: 20px; align-items: center; justify-content: space-between; }
.section-title h2 { margin: 0; font-size: clamp(27px, 4vw, 38px); font-weight: 750; letter-spacing: -.05em; }
.section-count { padding: 8px 12px; color: var(--muted); border: 1px solid var(--line); border-radius: 99px; background: rgba(255,255,255,.5); font-size: 10px; font-weight: 700; }
.category-tabs { display: grid; margin-bottom: 18px; padding: 5px; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.62); }
.category-tab { display: flex; min-height: 60px; padding: 8px 11px; gap: 10px; align-items: center; color: var(--muted); border: 0; border-radius: 13px; background: transparent; text-align: left; text-decoration: none; transition: .2s ease; }
.category-tab:hover { color: var(--ink); background: rgba(255,255,255,.72); }
.category-tab.active { color: white; background: linear-gradient(135deg, #7564eb, #5543ce); box-shadow: 0 9px 24px rgba(91,73,207,.27); }
.category-tab.active small { color: rgba(255,255,255,.72); }
.category-tab.active .category-tab-icon { color: #5b4bd0; background: white; }
.category-tab > span:last-child { display: flex; min-width: 0; gap: 2px; flex-direction: column; font-size: 11px; font-weight: 750; }
.category-tab small { color: var(--muted); font-size: 8px; font-weight: 500; }
.category-tab-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; color: #5d4fd0; border-radius: 10px; background: var(--violet-soft); }
.category-tab-icon svg { width: 17px; height: 17px; }
.telegram-icon { color: #2b98d6; background: #e8f5fc; }
.phone-icon { color: #d77a37; background: #fff0e3; }
.gift-icon { color: #2b9b76; background: var(--mint-soft); }
.category-dots { display: none; min-height: 8px; margin: -8px 0 15px; gap: 5px; align-items: center; justify-content: center; }
.category-dot { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 99px; background: #d3d1dc; transition: width .2s ease, background .2s ease; }
.category-dot.active { width: 18px; background: var(--violet); }
.telegram-subtabs { display: inline-flex; margin: 0 0 20px; padding: 5px; gap: 5px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.68); }
.telegram-subtabs a { display: flex; min-height: 42px; padding: 0 15px; gap: 8px; align-items: center; color: var(--muted); border-radius: 10px; font-size: 13px; font-weight: 700; text-decoration: none; transition: .2s ease; }
.telegram-subtabs a:hover { color: var(--ink); background: rgba(255,255,255,.8); }
.telegram-subtabs a.active { color: white; background: linear-gradient(135deg,#35a9e8,#2387d5); box-shadow: 0 7px 18px rgba(35,135,213,.22); }
.telegram-subtabs small { display: grid; min-width: 20px; height: 20px; padding: 0 5px; place-items: center; color: inherit; border-radius: 99px; background: rgba(128,128,150,.12); font-size: 10px; }
.telegram-subtabs a.active small { background: rgba(255,255,255,.2); }
.method-filters { display: flex; margin: -3px 0 18px; gap: 10px; align-items: center; justify-content: space-between; }
.method-search { display: flex; width: min(360px, 100%); padding: 0 13px; gap: 9px; align-items: center; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.78); transition: border-color .2s ease, box-shadow .2s ease; }
.method-search:focus-within { border-color: #cfc7ff; box-shadow: 0 0 0 3px rgba(116,100,233,.08); }
.method-search svg { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: #8e8f98; stroke-linecap: round; stroke-width: 1.8; }
.method-search input { width: 100%; padding: 10px 0; color: var(--ink); border: 0; outline: 0; background: transparent; font-size: 11px; }
.method-search input::placeholder { color: #a3a4ac; }
.catalog-filters { display: flex; gap: 10px; align-items: center; justify-content: flex-end; }
.catalog-filters > label { color: var(--muted); font-size: 10px; font-weight: 700; }
.country-select-wrap { display: flex; min-width: 220px; padding: 0 12px; gap: 8px; align-items: center; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.78); }
.country-select-wrap svg { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: #7767dd; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.country-select-wrap select { width: 100%; padding: 10px 24px 10px 0; color: var(--ink); border: 0; outline: 0; background: transparent; font-size: 11px; font-weight: 650; }
.filter-reset { color: var(--muted); font-size: 9px; font-weight: 700; white-space: nowrap; }
.method-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.content-section.catalog-loading .method-grid,
.content-section.catalog-loading .catalog-pagination { opacity: .42; pointer-events: none; }
.method-card { display: grid; position: relative; min-height: 112px; padding: 17px; grid-template-columns: 58px minmax(0,1fr) 28px; gap: 14px; align-items: center; color: var(--ink); border: 1px solid #e9e9ed; border-radius: 20px; background: rgba(255,255,255,.78); text-align: left; box-shadow: 0 10px 30px rgba(35, 34, 48, .035); transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.method-card:hover { z-index: 2; border-color: #d8d3ff; box-shadow: 0 18px 42px rgba(58,48,124,.1); transform: translateY(-4px); }
.provider-card { min-height: 230px; padding: 0 10px 16px 0; grid-template-columns: minmax(0,1fr) 42px; gap: 10px 8px; overflow: hidden; align-items: end; }
.provider-card .method-visual { width: 100%; height: 138px; grid-column: 1/-1; border-radius: 19px 19px 10px 10px; background: white; }
.provider-card .method-visual img { object-fit: contain; padding: 18px; }
.provider-card .method-copy { padding-left: 16px; }
.provider-card .method-copy strong { font-size: 14px; }
.provider-card .method-chevron { margin: 0 0 2px; justify-self: center; color: white; background: var(--violet); box-shadow: 0 6px 16px rgba(103,87,229,.24); }
.method-visual { display: grid; width: 58px; height: 58px; overflow: hidden; place-items: center; color: #5d4fd0; border-radius: 17px; background: var(--violet-soft); }
.method-visual img { width: 100%; height: 100%; object-fit: cover; }
.method-visual svg { width: 27px; height: 27px; }
.method-visual .image-fallback { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.method-telegram { color: #2b98d6; background: #e8f5fc; }
.method-phone_refill { color: #d77a37; background: #fff0e3; }
.method-gift_card { color: #2b9b76; background: var(--mint-soft); }
.method-copy { min-width: 0; }
.method-copy strong { display: block; overflow: hidden; margin-bottom: 5px; font-size: 13px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.method-copy small { display: -webkit-box; overflow: hidden; color: var(--muted); font-size: 10px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.fixed-method-price { display: block; margin-top: 8px; color: #5848cf; font-size: 15px; font-weight: 800; }
.package-preview { display: flex; overflow: hidden; margin-top: 7px; gap: 4px; flex-wrap: wrap; }
.package-preview span { padding: 3px 5px; color: #5c4bd0; border-radius: 6px; background: #f0edff; font-size: 7px; font-weight: 750; white-space: nowrap; }
.package-more { display: block; margin-top: 4px; color: var(--muted); font-size: 7px; font-weight: 650; }
.modal-packages { margin-bottom: 18px; }
.modal-packages > div { display: grid; max-height: 180px; margin-top: 7px; gap: 5px; overflow-y: auto; }
.modal-packages > div { grid-template-columns: repeat(2,minmax(0,1fr)); }
.package-choice { display: flex; min-height: 62px; padding: 10px 12px; gap: 5px; align-items: center; justify-content: center; flex-direction: column; color: var(--ink); border: 1px solid var(--line); border-radius: 11px; background: #fafafe; font-size: 10px; transition: .18s ease; }
.package-choice:hover { border-color: #cfc7ff; background: #f6f3ff; }
.package-choice.active { border-color: #7464e9; background: #efecff; box-shadow: 0 0 0 2px rgba(116,100,233,.1); }
.modal-packages strong { color: #5c4bd0; }
.package-choice .package-discount { padding: 2px 6px; color: #1877bb; border-radius: 6px; background: #dff2ff; font-size: 10px; font-weight: 800; }
.package-choice del { color: #9a9da7; font-size: 11px; }
.catalog-pagination { display: grid; margin-top: 24px; grid-template-columns: minmax(110px,1fr) auto minmax(110px,1fr); gap: 14px; align-items: center; }
.page-nav { display: inline-flex; min-height: 42px; padding: 0 14px; gap: 6px; align-items: center; justify-content: center; color: #6253d4; border: 1px solid #dcd7ff; border-radius: 12px; background: rgba(255,255,255,.8); font-size: 10px; font-weight: 750; text-decoration: none; }
.page-next { justify-self: end; }
.page-prev { justify-self: start; }
.page-nav:hover { color: #4d3bc5; background: white; }
.page-nav.disabled { color: #b8b8bf; border-color: var(--line); pointer-events: none; }
.page-numbers { display: flex; gap: 5px; align-items: center; justify-content: center; }
.page-number { display: grid; width: 38px; height: 38px; place-items: center; color: var(--ink); border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.75); font-size: 10px; font-weight: 700; text-decoration: none; }
.page-number:hover { color: #6253d4; border-color: #d3cdff; }
.page-number.active { color: white; border-color: var(--violet); background: var(--violet); }
.page-ellipsis { padding: 0 4px; color: var(--muted); }
.mobile-page-state { display: none; color: var(--muted); font-size: 10px; font-weight: 700; text-align: center; }
.activity-link-card { display: flex; margin-top: 54px; padding: 26px 30px; gap: 24px; align-items: center; justify-content: space-between; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.8); box-shadow: 0 12px 34px rgba(30,29,45,.04); }
.activity-link-card-top { margin-top: 34px; }
.activity-link-card h2 { margin: 0; font-size: 24px; letter-spacing: -.04em; }
.activity-link-card p { margin: 8px 0 0; color: var(--muted); font-size: 10px; }
.activity-link-card .primary-button { flex: 0 0 auto; }
.activity-page { max-width: 900px; padding-top: 34px; padding-bottom: 80px; }
.activity-heading h1 { margin: 0; font-size: 38px; letter-spacing: -.05em; }
.activity-type-switch { display: flex; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.7); }
.activity-type-switch a { padding: 9px 14px; color: var(--muted); border-radius: 8px; font-size: 10px; font-weight: 700; text-decoration: none; }
.activity-type-switch a.active { color: var(--ink); background: white; box-shadow: 0 4px 14px rgba(25,25,35,.08); }
.method-chevron { display: grid; width: 28px; height: 28px; place-items: center; color: #a8a9b0; border-radius: 50%; background: #f4f4f6; transition: .2s ease; }
.method-card:hover .method-chevron { color: white; background: var(--violet); transform: translateX(2px); }
.method-chevron svg { width: 14px; height: 14px; }
.popular-tag { position: absolute; top: 9px; right: 9px; padding: 3px 6px; color: #6b50c7; border-radius: 99px; background: #efeaff; font-size: 7px; font-weight: 800; text-transform: uppercase; }
.staff-header { display: flex; gap: 12px; align-items: center; font-size: 11px; font-weight: 700; }
.staff-header button { padding: 7px 11px; color: #6454d6; border: 1px solid #ddd8ff; border-radius: 9px; background: white; }
.staff-login-card { max-width: 480px; }
.staff-login-form { display: grid; margin-top: 24px; gap: 9px; text-align: left; }
.staff-login-form input, .staff-action-form input, .staff-action-form textarea, .staff-refund-form input, .staff-refund-form textarea { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: white; font-size: 11px; }
.staff-login-form input:focus, .staff-action-form input:focus, .staff-action-form textarea:focus, .staff-refund-form input:focus, .staff-refund-form textarea:focus { border-color: #c8c0ff; box-shadow: 0 0 0 3px rgba(116,100,233,.08); }
.staff-login-form .primary-button { margin-top: 10px; }
.staff-page > .section-title { padding-top: 20px; }
.staff-message { margin-bottom: 14px; padding: 12px 14px; border-radius: 12px; background: #eef9f5; color: #227a5d; font-size: 11px; font-weight: 650; }
.staff-message.error { color: #a44242; background: #fff0f0; }
.staff-order-list { display: grid; gap: 14px; }
.staff-order { padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.85); box-shadow: 0 12px 34px rgba(30,29,45,.04); }
.staff-order-summary { display: flex; gap: 20px; align-items: start; justify-content: space-between; }
.staff-order-summary h2 { margin: 7px 0 3px; font-size: 17px; }
.staff-order-summary p { margin: 0; color: var(--muted); font-size: 10px; }
.staff-order-summary > strong { font-size: 16px; white-space: nowrap; }
.staff-order-details { display: grid; margin: 16px 0; padding: 13px; grid-template-columns: 1fr 1fr; gap: 12px; border-radius: 13px; background: #f7f7fa; }
.staff-order-details div { display: flex; min-width: 0; gap: 5px; flex-direction: column; }
.staff-order-details span { color: var(--muted); font-size: 9px; }
.staff-order-details code { overflow-wrap: anywhere; color: var(--ink); font-size: 10px; }
.staff-actions { display: grid; grid-template-columns: minmax(0,2fr) minmax(220px,1fr); gap: 14px; align-items: end; }
.staff-action-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.staff-action-form textarea { min-height: 72px; grid-column: 1/-1; resize: vertical; }
.staff-action-form .primary-button { grid-column: 1/-1; }
.staff-refund-form { display: grid; gap: 8px; }
.staff-refund-form button { min-height: 42px; color: #a44242; border: 1px solid #f0caca; border-radius: 11px; background: #fff4f4; font-size: 10px; font-weight: 750; }
.staff-recent { margin-top: 34px; }
.staff-recent h2 { margin-bottom: 13px; font-size: 18px; }
.staff-recent-row { display: grid; padding: 11px 13px; grid-template-columns: minmax(0,1fr) auto auto; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); font-size: 10px; }
.staff-recent-row small { color: var(--muted); }
.staff-filters { display: grid; margin-bottom: 18px; padding: 14px; grid-template-columns: minmax(220px,2fr) repeat(2,minmax(130px,1fr)) repeat(2,minmax(145px,1fr)) auto auto; gap: 9px; align-items: end; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.82); }
.staff-filters input,.staff-filters select { width: 100%; height: 42px; padding: 0 11px; border: 1px solid var(--line); border-radius: 10px; background: white; font-size: 10px; }
.staff-filters label { display: grid; gap: 4px; color: var(--muted); font-size: 8px; }
.staff-filters .primary-button { min-height: 42px; padding: 0 18px; }
.staff-filters > a { padding: 13px 5px; color: var(--muted); font-size: 9px; }
.staff-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.9); box-shadow: 0 12px 34px rgba(30,29,45,.04); }
.staff-table { width: 100%; min-width: 920px; border-collapse: collapse; font-size: 10px; }
.staff-table th { padding: 12px 14px; color: var(--muted); background: #f8f8fa; font-size: 8px; text-align: left; text-transform: uppercase; letter-spacing: .06em; }
.staff-table td { padding: 14px; border-top: 1px solid var(--line); vertical-align: middle; }
.staff-table td small { display: block; margin-top: 3px; color: var(--muted); }
.staff-open-link { color: #6253d4; font-weight: 750; white-space: nowrap; }
.staff-pagination { display: flex; margin-top: 16px; align-items: center; justify-content: center; gap: 18px; font-size: 10px; }
.staff-pagination a { color: #6253d4; font-weight: 700; }
.staff-detail-grid { display: grid; grid-template-columns: minmax(0,2fr) minmax(310px,1fr); gap: 18px; align-items: start; }
.staff-order-full h1 { margin: 7px 0 3px; font-size: 21px; }
.staff-detail-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
.staff-note { margin-top: 12px; padding: 13px; border-radius: 13px; background: #f1f7ff; }
.staff-note.internal { background: #fff8e9; }
.staff-note span { color: var(--muted); font-size: 8px; font-weight: 700; text-transform: uppercase; }
.staff-note p { margin: 5px 0 0; font-size: 10px; white-space: pre-wrap; }
.staff-technical { margin-top: 12px; font-size: 9px; }
.staff-technical code { display: block; margin-top: 8px; overflow-wrap: anywhere; }
.staff-timeline { text-align: left; }
.staff-action-panel { display: grid; position: sticky; top: 88px; gap: 14px; }
.staff-action-panel form { padding: 17px; border: 1px solid var(--line); border-radius: 17px; background: white; box-shadow: 0 12px 34px rgba(30,29,45,.04); }
.staff-action-panel h2 { margin: 0 0 11px; font-size: 15px; }
.staff-action-panel .staff-action-form { grid-template-columns: 1fr; }
.staff-action-panel textarea { min-height: 74px; resize: vertical; }
.staff-finalized { padding: 20px; border: 1px solid var(--line); border-radius: 17px; background: white; }
.staff-finalized p { margin: 5px 0 0; color: var(--muted); font-size: 9px; }

.activity-tabs { display: inline-flex; padding: 4px; gap: 2px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.7); }
.activity-tabs button { padding: 8px 13px; color: var(--muted); border: 0; border-radius: 8px; background: transparent; font-size: 10px; font-weight: 700; transition: .2s ease; }
.activity-tabs button.active { color: var(--ink); background: white; box-shadow: 0 4px 14px rgba(25,25,35,.08); }
.activity-panel { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-solid); box-shadow: 0 14px 44px rgba(30,29,45,.045); }
.activity-row { display: grid; min-height: 76px; padding: 14px 18px; grid-template-columns: 42px minmax(0,1fr) auto 24px; gap: 14px; align-items: center; color: inherit; border-bottom: 1px solid #eff0f2; text-decoration: none; transition: background .18s ease; }
.activity-row:last-child { border-bottom: 0; }
a.activity-row:hover { color: inherit; background: #fafafe; }
.activity-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; }
.activity-icon svg { width: 19px; height: 19px; }
.outgoing { color: #6555d8; background: var(--violet-soft); }
.incoming { color: #29946f; background: var(--mint-soft); }
.activity-main, .activity-amount { display: flex; min-width: 0; gap: 4px; flex-direction: column; }
.activity-main strong, .activity-amount strong { overflow: hidden; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.activity-main small, .activity-amount small { color: var(--muted); font-size: 9px; }
.activity-amount { align-items: flex-end; text-align: right; }
.activity-amount.positive strong { color: #29946f; }
.status-pill { display: inline-flex; width: fit-content; padding: 3px 6px; border-radius: 99px; background: #f2f2f4; }
.status-completed { color: #238660!important; background: var(--mint-soft); }
.status-processing,.status-created,.status-pending_confirmation,.status-awaiting_price_confirmation { color: #8b5b1f!important; background: #fff2de; }
.status-failed,.status-refunded,.status-cancelled { color: #b84551!important; background: #ffeaec; }
.activity-arrow { color: #bbbcc2; }
.activity-arrow svg { width: 15px; height: 15px; }
.empty-state { padding: 58px 20px; text-align: center; }
.empty-state h3 { margin: 14px 0 6px; font-size: 16px; font-weight: 750; }
.empty-state p { margin: 0; color: var(--muted); font-size: 11px; }
.empty-icon { display: grid; width: 46px; height: 46px; margin: auto; place-items: center; color: #6657d8; border-radius: 15px; background: var(--violet-soft); font-size: 18px; }
.wide-empty { grid-column: 1/-1; border: 1px dashed #d9d9df; border-radius: var(--radius-lg); background: rgba(255,255,255,.45); }

.withdrawal-modal .modal-dialog { max-width: 480px; }
.withdrawal-modal .modal-content { overflow: hidden; border: 1px solid rgba(255,255,255,.8); border-radius: 28px; background: #fff; box-shadow: 0 35px 100px rgba(27,24,54,.22); }
.modal-backdrop.show { opacity: .32; backdrop-filter: blur(4px); }
.modal-head { display: grid; padding: 24px 26px 17px; grid-template-columns: 48px 1fr 36px; gap: 13px; align-items: center; }
.modal-head h3 { margin: 0; font-size: 20px; font-weight: 750; letter-spacing: -.035em; }
.modal-method-icon { display: grid; width: 48px; height: 48px; place-items: center; color: #5c4bd0; border-radius: 15px; background: var(--violet-soft); font-size: 20px; }
.modal-close { width: 36px; height: 36px; color: #868892; border: 0; border-radius: 50%; background: #f2f2f4; font-size: 23px; font-weight: 300; line-height: 1; }
.withdrawal-modal .modal-body { padding: 12px 26px 4px; }
.field-label { display: block; margin-bottom: 9px; font-size: 11px; font-weight: 700; }
.amount-field { display: flex; height: 68px; padding: 0 18px; align-items: center; border: 1px solid #dedfe4; border-radius: 16px; background: #fafafa; transition: .2s ease; }
.amount-field:focus-within { border-color: #8a7cef; background: white; box-shadow: 0 0 0 4px rgba(103,87,229,.08); }
.amount-field input { width: 100%; min-width: 0; color: var(--ink); border: 0; outline: 0; background: transparent; font-size: 28px; font-weight: 700; letter-spacing: -.04em; }
.amount-field span { color: var(--muted); font-size: 11px; font-weight: 800; }
.field-hint { display: flex; min-height: 30px; padding-top: 8px; align-items: center; justify-content: space-between; color: var(--muted); font-size: 9px; }
.field-hint button { padding: 0; color: var(--violet); border: 0; background: none; font-size: 9px; font-weight: 750; }
.text-field { width: 100%; height: 52px; padding: 0 15px; color: var(--ink); border: 1px solid #dedfe4; border-radius: 14px; outline: 0; background: #fafafa; font-size: 12px; transition: .2s ease; }
.text-field:focus { border-color: #8a7cef; background: white; box-shadow: 0 0 0 4px rgba(103,87,229,.08); }
.summary-box { display: grid; margin-top: 20px; padding: 15px; gap: 9px; border-radius: 13px; background: #f5f4fb; }
.summary-box > div { display: flex; align-items: center; justify-content: space-between; }
.summary-box span { color: var(--muted); font-size: 10px; }
.summary-box strong, .summary-box strong span { color: var(--ink); font-size: 11px; }
.summary-box .summary-total { padding-top: 9px; border-top: 1px solid #dfdafd; }
.summary-box .summary-total strong,.summary-box .summary-total strong span { color: #5b4dcc; font-size: 13px; }
.confirmation-box { margin-top: 12px; padding: 14px; border: 1px solid #ddd7ff; border-radius: 14px; background: #fbfaff; }
.confirmation-box > strong { font-size: 12px; }
.confirmation-box > p { margin: 5px 0 11px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.confirmation-box > div { display: flex; padding-top: 7px; justify-content: space-between; gap: 10px; border-top: 1px solid #eeebff; font-size: 9px; }
.confirmation-box > div + div { margin-top: 7px; }
.confirmation-box span { color: var(--muted); }
.confirmation-box div strong { max-width: 65%; overflow-wrap: anywhere; text-align: right; }
.form-message { margin-top: 14px; padding: 12px 14px; border-radius: 12px; font-size: 10px; line-height: 1.5; }
.form-message.success { color: #267859; background: var(--mint-soft); }
.form-message.error { color: #a6404b; background: #ffeaec; }
.phone-check { margin-top: 8px; font-size: 10px; line-height: 1.4; }
.phone-check.checking { color: var(--muted); }
.phone-check.success { color: #267859; }
.phone-check.error { color: #a6404b; }
.modal-actions { padding: 20px 26px 25px; }
.primary-button { display: inline-flex; min-height: 50px; padding: 0 20px; gap: 12px; align-items: center; justify-content: center; color: white; border: 0; border-radius: 14px; background: linear-gradient(135deg, #7464e9, #5846d1); box-shadow: 0 12px 24px rgba(88,70,209,.22); font-size: 11px; font-weight: 750; text-decoration: none; transition: .2s ease; }
.primary-button:hover { color: white; background: linear-gradient(135deg, #6757df, #4d3bc5); transform: translateY(-1px); }
.primary-button:disabled { opacity: .62; transform: none; }
.primary-button svg { width: 16px; height: 16px; }
.modal-actions .primary-button { width: 100%; }
.modal-actions .secondary-button { width: 100%; margin-bottom: 8px; padding: 11px; color: #6253d4; border: 1px solid #ddd8ff; border-radius: 12px; background: white; font-size: 10px; font-weight: 700; }
.modal-actions p { margin: 10px 0 0; color: #a0a2aa; font-size: 8px; text-align: center; }

.centered-page { display: grid; min-height: calc(100vh - 158px); padding-top: 55px; padding-bottom: 75px; place-items: center; }
.access-card,.error-card { width: min(100%, 550px); padding: 54px; border: 1px solid rgba(255,255,255,.8); border-radius: var(--radius-xl); background: rgba(255,255,255,.86); box-shadow: var(--shadow); text-align: center; backdrop-filter: blur(18px); }
.access-visual { display: grid; width: 68px; height: 68px; margin: 0 auto 27px; place-items: center; color: white; border-radius: 21px; background: linear-gradient(145deg, #48ade7, #227fc7); box-shadow: 0 17px 35px rgba(34,127,199,.22); }
.access-visual svg { width: 33px; height: 33px; }
.access-card h1,.error-card h1 { margin: 0; font-size: clamp(36px,7vw,54px); font-weight: 750; letter-spacing: -.065em; line-height: 1.02; }
.access-card > p,.error-card > p { max-width: 420px; margin: 20px auto 28px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.access-steps { display: grid; gap: 8px; text-align: left; }
.access-steps span { display: flex; padding: 12px 14px; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 13px; background: #fafafa; font-size: 11px; font-weight: 600; }
.access-steps i { display: grid; width: 25px; height: 25px; flex: 0 0 auto; place-items: center; color: #5a4acc; border-radius: 8px; background: var(--violet-soft); font-size: 9px; font-style: normal; font-weight: 800; }
.access-note { display: flex; margin-top: 22px; gap: 9px; align-items: center; justify-content: center; color: #2b8265; font-size: 9px; font-weight: 650; }
.access-note svg { width: 15px; height: 15px; }

.detail-page { max-width: 720px; padding-top: 34px; padding-bottom: 90px; }
.back-link { display: inline-flex; margin-bottom: 18px; gap: 6px; align-items: center; color: var(--muted); font-size: 10px; font-weight: 700; text-decoration: none; }
.back-link:hover { color: var(--violet); }
.back-link svg { width: 14px; height: 14px; }
.detail-card { padding: 42px; border: 1px solid rgba(255,255,255,.8); border-radius: var(--radius-xl); background: rgba(255,255,255,.9); box-shadow: var(--shadow); text-align: center; }
.detail-status { display: inline-flex; padding: 7px 10px; gap: 7px; align-items: center; color: #8b5b1f; border-radius: 99px; background: #fff2de; font-size: 9px; font-weight: 750; }
.detail-status span { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.detail-status.status-completed { color: #238660; background: var(--mint-soft); }
.detail-status.status-failed,.detail-status.status-refunded { color: #b84551; background: #ffeaec; }
.detail-icon { display: grid; width: 58px; height: 58px; margin: 28px auto 20px; place-items: center; color: #5d4fd0; border-radius: 18px; background: var(--violet-soft); }
.detail-icon svg { width: 26px; height: 26px; }
.detail-card h1 { margin: 0; font-size: clamp(42px,8vw,64px); font-weight: 750; letter-spacing: -.065em; }
.detail-card h1 small { color: var(--muted); font-size: .25em; letter-spacing: .05em; }
.detail-subtitle { margin: 8px 0 32px; color: var(--muted); font-size: 10px; }
.detail-state-message { margin: -18px 0 22px; padding: 12px; color: #555864; border-radius: 12px; background: #f5f5f8; font-size: 10px; line-height: 1.5; }
.detail-list { overflow: hidden; border: 1px solid var(--line); border-radius: 17px; text-align: left; }
.detail-list > div { display: flex; min-height: 49px; padding: 0 16px; align-items: center; justify-content: space-between; border-bottom: 1px solid #eff0f2; font-size: 10px; }
.detail-list > div:last-child { border-bottom: 0; }
.detail-list span { color: var(--muted); }
.detail-list strong { font-weight: 700; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }
.detail-alert { margin-top: 16px; padding: 13px; color: #a6404b; border-radius: 12px; background: #ffeaec; font-size: 10px; text-align: left; }
.detail-note { margin-top: 14px; padding: 14px; border-radius: 13px; background: #f1f7ff; font-size: 10px; text-align: left; }
.detail-note p { margin: 5px 0 0; white-space: pre-wrap; }
.copy-value { display: flex; align-items: center; gap: 8px; }
.copy-value button { padding: 5px 7px; color: #6253d4; border: 1px solid #ddd8ff; border-radius: 7px; background: white; font-size: 8px; }
.timeline { margin-top: 30px; text-align: left; }
.timeline-item { display: grid; position: relative; min-height: 46px; grid-template-columns: 18px 1fr; gap: 10px; }
.timeline-item::before { position: absolute; width: 1px; height: 100%; left: 4px; top: 7px; content: ""; background: var(--line); }
.timeline-item:last-child::before { display: none; }
.timeline-item > span { z-index: 1; width: 9px; height: 9px; margin-top: 3px; border: 2px solid white; border-radius: 50%; background: var(--violet); box-shadow: 0 0 0 2px #dcd7ff; }
.timeline-item div { display: flex; gap: 3px; flex-direction: column; }
.timeline-item strong { font-size: 10px; }
.timeline-item small { color: var(--muted); font-size: 8px; }
.error-code { display: block; color: #ded9ff; font-size: 90px; font-weight: 800; letter-spacing: -.08em; line-height: 1; }
.error-card .primary-button { margin: auto; }

.site-footer { padding: 20px 0 34px; color: #999ba3; font-size: 9px; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; }
.footer-inner a { color: #999ba3; text-decoration: none; }
.footer-inner a:hover { color: var(--violet); }
.footer-security { display: flex; gap: 6px; align-items: center; }
.footer-security span { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); }
.profile-modal .modal-dialog { max-width: 390px; }
.profile-modal .modal-content { position: relative; padding: 34px; border: 1px solid rgba(255,255,255,.8); border-radius: 26px; background: rgba(255,255,255,.96); box-shadow: var(--shadow); }
.profile-close { position: absolute; top: 15px; right: 15px; }
.profile-avatar { display: grid; width: 66px; height: 66px; margin-bottom: 22px; place-items: center; color: white; border-radius: 22px; background: linear-gradient(145deg,#7968ef,#5240c8); font-size: 23px; font-weight: 800; box-shadow: 0 12px 26px rgba(88,70,202,.24); }
.profile-modal h2 { margin: 0 0 22px; font-size: 25px; letter-spacing: -.04em; }
.profile-details { display: grid; gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--line); }
.profile-details div { display: flex; padding: 12px 14px; align-items: center; justify-content: space-between; background: white; font-size: 10px; }
.profile-details span { color: var(--muted); }
.profile-country-select { display: grid; width: min(210px, 66%); min-height: 38px; padding: 0 2px 0 8px; grid-template-columns: 24px minmax(0,1fr) 18px; gap: 5px; align-items: center; border-radius: 9px; background: #f7f7fa; }
.profile-country-select b { font-size: 18px; font-weight: 400; line-height: 1; }
.profile-country-select select { width: 100%; min-width: 0; color: var(--ink); border: 0; outline: 0; appearance: none; background: transparent; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.profile-country-select svg { width: 15px; height: 15px; color: #858791; pointer-events: none; }
.profile-country-select:has(select:focus) { box-shadow: 0 0 0 2px rgba(103,87,229,.18); }
.profile-country-select:has(select:disabled) { opacity: .55; }
.profile-activity-link { display: block; margin-top: 16px; padding: 12px; color: #5c4bd0; border-radius: 11px; background: var(--violet-soft); font-size: 10px; font-weight: 750; text-align: center; text-decoration: none; }
.preferences-modal .modal-dialog { max-width: 420px; margin-right: 24px; }
.preferences-modal .modal-content { padding: 30px; border: 1px solid rgba(255,255,255,.9); border-radius: 28px; background: #f7f8f8; box-shadow: 0 32px 90px rgba(21,34,31,.22); }
.preferences-head { display: flex; margin-bottom: 30px; align-items: center; justify-content: space-between; }
.preferences-head h2 { margin: 0; color: #173a34; font-size: 24px; font-weight: 780; letter-spacing: -.035em; }
.preferences-close { width: 40px; height: 40px; padding: 0; color: #163b34; border: 0; border-radius: 50%; background: transparent; font-size: 34px; font-weight: 300; line-height: 1; }
.preferences-close:hover { background: #edf0ef; }
.preferences-label { display: block; margin: 0 0 9px; color: #303a38; font-size: 13px; font-weight: 750; }
.preferences-select { display: grid; min-height: 72px; margin-bottom: 24px; padding: 0 18px; grid-template-columns: 32px minmax(0,1fr) 22px; gap: 10px; align-items: center; border: 1px solid #eceeee; border-radius: 16px; background: #fff; box-shadow: 0 7px 20px rgba(36,55,51,.035); }
.preferences-select select { width: 100%; height: 100%; min-width: 0; color: #173a34; border: 0; outline: 0; appearance: none; background: transparent; font: inherit; font-size: 16px; font-weight: 650; cursor: pointer; }
.preferences-leading { font-size: 23px; line-height: 1; text-align: center; }
.preferences-select svg { width: 20px; height: 20px; color: #173a34; pointer-events: none; }
.preferences-save { width: 100%; min-height: 58px; margin-top: 9px; color: white; border: 0; border-radius: 999px; background: #0b4138; font-size: 15px; font-weight: 780; box-shadow: 0 14px 28px rgba(11,65,56,.17); }
.preferences-save:hover { background: #07382f; }
.preferences-save:disabled { opacity: .6; cursor: wait; }
.preferences-modal .form-message { margin: -8px 0 10px; }
.email-status-verified { color: #168d6d; }
.email-status-pending { color: #d16a31; }
.email-verification-banner { display: flex; width: 100%; margin: 22px 0 0; padding: 18px 22px; align-items: center; gap: 15px; color: #342675; border: 1px solid #d9d1ff; border-radius: 20px; background: linear-gradient(120deg,#f5f1ff,#fff8ee); box-shadow: 0 14px 34px rgba(83,64,173,.11); text-align: left; }
.email-verification-banner strong, .email-verification-banner small { display: block; }
.guest-banner { margin-top: 0; text-decoration: none; }
#productPreviewModal .modal-head { grid-template-columns: minmax(0,1fr) 36px; }
#previewTitle { overflow-wrap: anywhere; }
#previewPackageList .package-choice { cursor: default; }
.email-verification-banner strong { font-size: 17px; }
.email-verification-banner small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.email-verification-lock { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 13px; background: #6a57e8; color: white; }
.email-verification-arrow { margin-left: auto; font-size: 24px; }
.method-card.email-locked { cursor: pointer; }
.method-card.email-locked .method-copy, .method-card.email-locked .method-visual { opacity: .68; }
.method-email-lock { display: inline-flex; width: fit-content; margin-top: 8px; padding: 4px 8px; color: #5e4bc9; border-radius: 8px; background: #eeeaff; font-size: 10px; font-weight: 800; line-height: 1.25; }
.email-verification-modal .modal-dialog { max-width: 480px; }
.email-verification-modal .modal-content { position: relative; padding: 34px; border: 1px solid rgba(255,255,255,.9); border-radius: 28px; background: rgba(255,255,255,.98); box-shadow: var(--shadow); }
.email-verification-modal h2 { margin: 8px 0 10px; font-size: 28px; letter-spacing: -.04em; }
.email-verification-modal p { margin: 0 0 22px; color: var(--muted); line-height: 1.55; }
.email-modal-icon { display: grid; width: 58px; height: 58px; margin-bottom: 18px; place-items: center; color: white; border-radius: 18px; background: linear-gradient(145deg,#7968ef,#5240c8); font-size: 25px; }
.email-submit { width: 100%; margin-top: 14px; justify-content: center; }
.email-modal-note { display: block; margin-top: 14px; color: var(--muted); text-align: center; }

:root[data-theme="dark"] .ambient-one { background: rgba(112, 88, 255, .17); }
:root[data-theme="dark"] .ambient-two { background: rgba(39, 185, 132, .1); }
:root[data-theme="dark"] .preferences-trigger,
:root[data-theme="dark"] .section-count,
:root[data-theme="dark"] .category-tabs,
:root[data-theme="dark"] .telegram-subtabs,
:root[data-theme="dark"] .method-search,
:root[data-theme="dark"] .country-select-wrap,
:root[data-theme="dark"] .method-card,
:root[data-theme="dark"] .page-nav,
:root[data-theme="dark"] .page-number,
:root[data-theme="dark"] .activity-link-card,
:root[data-theme="dark"] .activity-type-switch,
:root[data-theme="dark"] .staff-order,
:root[data-theme="dark"] .access-card,
:root[data-theme="dark"] .error-card,
:root[data-theme="dark"] .detail-card {
  background: var(--surface);
}
:root[data-theme="dark"] .category-tab:hover,
:root[data-theme="dark"] .telegram-subtabs a:hover,
:root[data-theme="dark"] .page-nav:hover,
:root[data-theme="dark"] .activity-type-switch a.active {
  background: #292a34;
}
:root[data-theme="dark"] .category-tab.active,
:root[data-theme="dark"] .telegram-subtabs a.active,
:root[data-theme="dark"] .page-number.active {
  color: white;
}
:root[data-theme="dark"] .method-card { border-color: var(--line); box-shadow: 0 10px 30px rgba(0,0,0,.14); }
:root[data-theme="dark"] .method-card:hover { border-color: #5c538e; box-shadow: 0 18px 42px rgba(0,0,0,.28); }
:root[data-theme="dark"] .provider-card .method-visual { background: #252630; }
:root[data-theme="dark"] .package-preview span { color: #b9afff; background: #302b50; }
:root[data-theme="dark"] .fixed-method-price,
:root[data-theme="dark"] .modal-packages strong { color: #a99cff; }
:root[data-theme="dark"] .package-choice { color: var(--ink); border-color: var(--line); background: #23242c; }
:root[data-theme="dark"] .package-choice:hover { background: #2b293a; }
:root[data-theme="dark"] .package-choice.active { background: #332d58; }
:root[data-theme="dark"] .method-chevron { color: #babcc5; background: #292a33; }
:root[data-theme="dark"] .amount-field,
:root[data-theme="dark"] .text-field {
  color: var(--ink);
  border-color: #3a3b47;
  background: #23242c;
}
:root[data-theme="dark"] .amount-field:focus-within,
:root[data-theme="dark"] .text-field:focus {
  border-color: #8171f1;
  background: #292a34;
  box-shadow: 0 0 0 4px rgba(129,113,241,.14);
}
:root[data-theme="dark"] .amount-field input { color: var(--ink); }
:root[data-theme="dark"] .amount-field input::placeholder,
:root[data-theme="dark"] .text-field::placeholder { color: #777a87; opacity: 1; }
:root[data-theme="dark"] .summary-box { background: #252630; }
:root[data-theme="dark"] .summary-box strong,
:root[data-theme="dark"] .summary-box strong span { color: var(--ink); }
:root[data-theme="dark"] .summary-box .summary-total { border-color: #45405f; }
:root[data-theme="dark"] .summary-box .summary-total strong,
:root[data-theme="dark"] .summary-box .summary-total strong span { color: #a99cff; }
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .profile-modal .modal-content,
:root[data-theme="dark"] .email-verification-modal .modal-content,
:root[data-theme="dark"] .preferences-modal .modal-content {
  color: var(--ink);
  border-color: var(--line);
  background: #1b1c23;
}
:root[data-theme="dark"] .modal-head,
:root[data-theme="dark"] .modal-actions { border-color: var(--line); }
:root[data-theme="dark"] .modal-close,
:root[data-theme="dark"] .preferences-close,
:root[data-theme="dark"] .preferences-head h2,
:root[data-theme="dark"] .preferences-label { color: var(--ink); }
:root[data-theme="dark"] .modal-close { background: #292a33; }
:root[data-theme="dark"] .modal-close:hover { color: white; background: #353640; }
:root[data-theme="dark"] .preferences-close:hover { background: #292a33; }
:root[data-theme="dark"] .preferences-select {
  border-color: var(--line);
  background: #25262e;
  box-shadow: none;
}
:root[data-theme="dark"] .preferences-select select,
:root[data-theme="dark"] .preferences-select svg { color: var(--ink); }
:root[data-theme="dark"] .profile-details { background: var(--line); }
:root[data-theme="dark"] .profile-details div { background: #22232b; }
:root[data-theme="dark"] .profile-country-select { background: #2b2c35; }
:root[data-theme="dark"] .profile-activity-link { color: #b3a9ff; background: #2d294a; }
:root[data-theme="dark"] .email-verification-banner {
  color: #ddd8ff;
  border-color: #494266;
  background: linear-gradient(120deg,#28233e,#302a24);
}
:root[data-theme="dark"] .access-steps span,
:root[data-theme="dark"] .detail-state-message,
:root[data-theme="dark"] .confirmation-box,
:root[data-theme="dark"] .staff-order-details,
:root[data-theme="dark"] .staff-action-panel,
:root[data-theme="dark"] .profile-country-select {
  border-color: var(--line);
  background: #23242c;
}
:root[data-theme="dark"] .provider-terms { border-color: #5b4e29; background: #2d291e; }
:root[data-theme="dark"] .provider-terms-icon { color: #f0cf75; background: #51451f; }
:root[data-theme="dark"] .provider-terms strong { color: #f3e7c4; }
:root[data-theme="dark"] .provider-terms p { color: #c2b58e; }
:root[data-theme="dark"] .detail-list > div { border-color: var(--line); }
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select { color-scheme: dark; }
:root[data-theme="dark"] select option,
:root[data-theme="dark"] select optgroup { color: #f2f2f6; background: #1c1d25; }
:root[data-theme="dark"] .wide-empty { color: var(--ink); border-color: var(--line); background: var(--surface); }
:root[data-theme="dark"] .staff-login-form input,
:root[data-theme="dark"] .staff-action-form input,
:root[data-theme="dark"] .staff-action-form textarea,
:root[data-theme="dark"] .staff-refund-form input,
:root[data-theme="dark"] .staff-refund-form textarea,
:root[data-theme="dark"] .modal-actions .secondary-button,
:root[data-theme="dark"] .copy-value button {
  color: var(--ink);
  border-color: var(--line);
  background: #25262e;
}
:root[data-theme="dark"] .timeline-item > span { border-color: #1b1c23; }

.reveal { animation: reveal .55s both ease-out; }
.reveal-delay { animation-delay: .08s; }
@keyframes reveal { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

@media (max-width: 991.98px) {
  .method-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .site-header { padding: 12px 0; }
  .app-container { padding-right: 18px; padding-left: 18px; }
  .page-main { padding-top: 18px; padding-bottom: 60px; }
  .hero-grid { margin-right: 6px; margin-left: 6px; }
  .balance-card { min-height: 310px; padding: 26px 24px; border-radius: 24px; }
  .balance-number { min-height: 164px; }
  .content-section { padding-top: 58px; }
  .section-title { align-items: flex-end; }
  .section-title h2 { font-size: 28px; }
  .history-section .section-title { display: block; }
  .category-tabs { display: flex; margin-right: -18px; padding: 5px 18px 7px 0; overflow-x: auto; border: 0; border-radius: 0; background: transparent; scrollbar-width: none; }
  .category-tabs::-webkit-scrollbar { display: none; }
  .category-tab { min-width: 150px; border: 1px solid var(--line); background: rgba(255,255,255,.62); }
  :root[data-theme="dark"] .category-tab:not(.active) { color: var(--muted); background: var(--surface); }
  :root[data-theme="dark"] .category-tab:not(.active):hover { color: var(--ink); background: #292a34; }
  .category-dots { display: flex; }
  .telegram-subtabs { display: flex; overflow-x: auto; scrollbar-width: none; }
  .telegram-subtabs::-webkit-scrollbar { display: none; }
  .telegram-subtabs a { flex: 1 0 auto; justify-content: center; }
  .method-filters { margin-top: 2px; flex-wrap: wrap; }
  .method-search { width: 100%; }
  .catalog-filters { width: 100%; justify-content: stretch; }
  .catalog-pagination { grid-template-columns: minmax(100px,1fr) auto minmax(100px,1fr); }
  .page-numbers { display: none; }
  .mobile-page-state { display: block; }
  .activity-link-card { align-items: flex-start; flex-direction: column; }
  .activity-link-card .primary-button { width: 100%; }
  .staff-actions { grid-template-columns: 1fr; }
  .staff-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .staff-filters > input:first-child { grid-column: 1/-1; }
  .staff-detail-grid { grid-template-columns: 1fr; }
  .staff-action-panel { position: static; }
  .country-select-wrap { min-width: 0; flex: 1; }
  .activity-tabs { margin-top: 18px; }
  .access-card,.error-card { padding: 38px 24px; border-radius: 24px; }
  .detail-card { padding: 30px 20px; border-radius: 24px; }
}
@media (max-width: 575.98px) {
  .preferences-trigger { min-height: 42px; padding: 6px 9px; }
  .preferences-trigger strong { display: none; }
  .preferences-trigger svg { display: none; }
  .preferences-modal .modal-dialog { margin: 12px; align-items: flex-end; min-height: calc(100% - 24px); }
  .preferences-modal .modal-content { padding: 26px 20px 22px; border-radius: 28px 28px 22px 22px; }
  .preferences-head { margin-bottom: 24px; }
  .preferences-select { min-height: 66px; margin-bottom: 20px; }
  .user-copy { display: none; }
  .method-grid { grid-template-columns: 1fr; }
  .method-card { min-height: 94px; }
  .provider-card { min-height: 198px; padding: 0 9px 14px 0; grid-template-columns: minmax(0,1fr) 42px; }
  .provider-card .method-visual { height: 120px; }
  .provider-card .method-visual img { padding: 12px; }
  .provider-card .method-copy { padding-left: 14px; }
  .provider-card .method-chevron { width: 34px; height: 34px; margin: 0 0 2px; }
  .balance-footer { gap: 12px; align-items: flex-end; }
  .balance-actions { gap: 7px; flex-direction: column-reverse; align-items: flex-end; }
  .balance-history-link { padding: 8px 10px; }
  .footer-inner { gap: 12px; flex-wrap: wrap; }
  .footer-security { width: 100%; }
  .staff-order { padding: 16px; }
  .staff-order-summary, .staff-order-details { grid-template-columns: 1fr; }
  .staff-order-summary { flex-direction: column; }
  .staff-action-form { grid-template-columns: 1fr; }
  .staff-action-form textarea, .staff-action-form .primary-button { grid-column: auto; }
  .staff-recent-row { grid-template-columns: 1fr auto; }
  .staff-recent-row small { grid-column: 1/-1; }
  .staff-filters { grid-template-columns: 1fr; }
  .staff-filters > input:first-child { grid-column: auto; }
  .staff-detail-list { grid-template-columns: 1fr; }
  .catalog-pagination { gap: 8px; }
  .page-nav { min-height: 46px; padding: 0 10px; }
  .activity-heading { align-items: flex-start; flex-direction: column; }
  .activity-type-switch { width: 100%; }
  .activity-type-switch a { flex: 1; text-align: center; }
  .section-count { display: none; }
  .activity-row { padding: 13px; grid-template-columns: 40px minmax(0,1fr) auto; gap: 10px; }
  .activity-arrow { display: none; }
  .activity-amount strong { font-size: 10px; }
  .withdrawal-modal .modal-dialog { margin: 12px; align-items: flex-end; min-height: calc(100% - 24px); }
  .withdrawal-modal .modal-content { border-radius: 25px; }
  .modal-head { padding: 20px 20px 13px; }
  .withdrawal-modal .modal-body { padding: 10px 20px 2px; }
  .modal-actions { padding: 18px 20px 22px; }
  .centered-page { padding-top: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; }
}

/* Readable type scale */
body { font-size: 16px; }
.brand { font-size: 20px; }
.user-copy strong, .balance-label, .secure-label { font-size: 14px; }
.user-copy small, .currency-badge, .balance-footer small { font-size: 12px; }
.balance-footer strong { font-size: 16px; }
.balance-history-link { font-size: 12px; }
.micro-label, .catalog-filters > label, .filter-reset { font-size: 12px; }
.category-tab > span:last-child { font-size: 14px; }
.category-tab small { font-size: 11px; }
.method-search input, .country-select-wrap select { font-size: 14px; }
.method-copy strong { font-size: 15px; }
.provider-card .method-copy strong { font-size: 17px; }
.method-copy small { font-size: 12px; }
.package-preview span, .package-more, .popular-tag { font-size: 10px; }
.package-choice, .page-nav, .page-number, .mobile-page-state { font-size: 13px; }
.activity-type-switch a, .activity-tabs button { font-size: 13px; }
.activity-main strong, .activity-amount strong { font-size: 15px; }
.activity-main small, .activity-amount small { font-size: 12px; }
.empty-state h3 { font-size: 18px; }
.empty-state p { font-size: 13px; }
.staff-header,
.staff-login-form input,
.staff-action-form input,
.staff-action-form textarea,
.staff-refund-form input,
.staff-refund-form textarea,
.staff-message { font-size: 13px; }
.staff-order-summary p,
.staff-order-details code,
.staff-refund-form button,
.staff-recent-row,
.staff-filters input,
.staff-filters select,
.staff-pagination,
.staff-note p,
.staff-action-panel,
.staff-table { font-size: 12px; }
.staff-order-details span,
.staff-filters label,
.staff-table th,
.staff-note span,
.staff-technical,
.staff-finalized p { font-size: 11px; }
.field-label, .amount-field span { font-size: 13px; }
.field-hint, .field-hint button { font-size: 12px; }
.text-field { font-size: 15px; }
.summary-box span { font-size: 12px; }
.summary-box strong, .summary-box strong span { font-size: 14px; }
.summary-box .summary-total strong,
.summary-box .summary-total strong span { font-size: 16px; }
.confirmation-box > strong { font-size: 14px; }
.confirmation-box > p,
.confirmation-box > div,
.modal-actions p { font-size: 12px; }
.form-message,
.primary-button,
.modal-actions .secondary-button { font-size: 13px; }
.access-card > p, .error-card > p { font-size: 14px; }
.access-steps span { font-size: 13px; }
.access-steps i, .access-note, .back-link { font-size: 12px; }
.detail-status { font-size: 12px; }
.detail-subtitle,
.detail-state-message,
.detail-list > div,
.detail-alert,
.detail-note,
.timeline-item strong { font-size: 13px; }
.mono, .copy-value button, .timeline-item small { font-size: 11px; }
.site-footer, .profile-details div, .profile-activity-link { font-size: 12px; }
@media (max-width: 575px) {
  .email-verification-banner { padding: 15px; }
  .email-verification-banner small { font-size: 12px; }
  .email-verification-arrow { display: none; }
  .email-verification-modal .modal-content { padding: 28px 22px; border-radius: 24px; }
}