/* ===================================================================
   Контентные страницы (Профиль, Достижения, FAQ, Поиск игрока)
   Тёмная бренд-гамма: #0a0c10 фон, панели #12151c, акцент #f59e0b
   =================================================================== */
.pg { --pg-accent: #f59e0b; --pg-accent2: #fbbf24; }

/* ---------- Hero страницы ---------- */
.pg-hero { position: relative; overflow: hidden; border-radius: 22px; padding: 26px 26px 24px;
    background:
        radial-gradient(130% 120% at 100% 0%, rgba(245,158,11,0.14), transparent 46%),
        linear-gradient(165deg, #171c26 0%, #10131a 60%, #0d1016 100%);
    border: 1px solid rgba(255,255,255,0.07);
    box-shadow: 0 20px 50px -20px rgba(0,0,0,0.7); }
.pg-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background-image:
        linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 34px 34px;
    -webkit-mask-image: radial-gradient(120% 100% at 100% 0%, #000, transparent 60%);
    mask-image: radial-gradient(120% 100% at 100% 0%, #000, transparent 60%); }
.pg-hero::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
    background: linear-gradient(90deg, transparent, rgba(245,158,11,0.7), transparent); }
.pg-hero-inner { position: relative; z-index: 1; }
.pg-h1 { font-size: 26px; font-weight: 900; letter-spacing: -0.02em; color: #fff; line-height: 1.1; }
.pg-hero-sub { font-size: 13.5px; color: #8b93a3; margin-top: 6px; }

/* ---------- Заголовок секции ---------- */
.pg-eyebrow { font-size: 11px; font-weight: 800; color: #6b7280; text-transform: uppercase;
    letter-spacing: 0.14em; margin: 0 0 12px 2px; }

/* ---------- Панель ---------- */
.pg-panel { border-radius: 18px; overflow: hidden;
    background: linear-gradient(165deg, rgba(255,255,255,0.035), rgba(255,255,255,0.015));
    border: 1px solid rgba(255,255,255,0.07); box-shadow: 0 12px 30px -16px rgba(0,0,0,0.6); }
.pg-panel-pad { padding: 20px; }
.pg-divide > * + * { border-top: 1px solid rgba(255,255,255,0.06); }

/* Строка «ключ — значение» */
.pg-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; }
.pg-row-l { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pg-row-ico { width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; }
.pg-row-ico svg { width: 17px; height: 17px; }
.pg-row-key { font-size: 13.5px; color: #9aa3b2; }
.pg-row-val { font-size: 13.5px; font-weight: 700; color: #fff; text-align: right;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 220px; }

/* Иконочные фоны */
.pg-ic-amber { background: rgba(245,158,11,0.13); color: #fbbf24; }
.pg-ic-green { background: rgba(16,185,129,0.13); color: #34d399; }
.pg-ic-blue  { background: rgba(59,130,246,0.13); color: #60a5fa; }
.pg-ic-violet{ background: rgba(139,92,246,0.13); color: #a78bfa; }
.pg-ic-cyan  { background: rgba(34,211,238,0.13); color: #22d3ee; }

/* ---------- Быстрая навигация (чипы) ---------- */
.pg-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.pg-chip { padding: 8px 14px; border-radius: 11px; font-size: 12.5px; font-weight: 600; color: #9aa3b2;
    text-decoration: none; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.07);
    transition: color .16s ease, background .16s ease, border-color .16s ease; }
.pg-chip:hover { color: #fff; background: rgba(255,255,255,0.07); border-color: rgba(245,158,11,0.3); }

/* ---------- Аккордеон (FAQ) ---------- */
.pg-acc { border-radius: 14px; overflow: hidden; cursor: pointer;
    background: rgba(255,255,255,0.035); border: 1px solid rgba(255,255,255,0.07);
    transition: background .18s ease, border-color .18s ease; }
.pg-acc:hover { background: rgba(255,255,255,0.055); }
.pg-acc.is-open { background: rgba(245,158,11,0.07); border-color: rgba(245,158,11,0.28); }
.pg-acc.green.is-open { background: rgba(16,185,129,0.07); border-color: rgba(16,185,129,0.28); }
.pg-acc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; }
.pg-acc-l { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pg-acc-num { flex-shrink: 0; width: 24px; height: 24px; border-radius: 8px; font-size: 11px; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    background: rgba(245,158,11,0.14); color: #fbbf24; }
.pg-acc.green .pg-acc-num { background: rgba(16,185,129,0.14); color: #34d399; }
.pg-acc-title { font-size: 13.5px; font-weight: 600; color: #e5e7eb;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pg-acc-chev { width: 16px; height: 16px; flex-shrink: 0; color: #6b7280; transition: transform .2s ease, color .2s ease; }
.pg-acc.is-open .pg-acc-chev { transform: rotate(180deg); color: var(--pg-accent2); }
.pg-acc.green.is-open .pg-acc-chev { color: #34d399; }
.pg-acc-body { padding: 0 18px 16px 54px; }
.pg-acc-body p { font-size: 13px; color: #9aa3b2; line-height: 1.6; }

/* ---------- Карточки-фичи (защита данных) ---------- */
.pg-feats { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; }
.pg-feats::-webkit-scrollbar { height: 0; }
.pg-feat { flex-shrink: 0; width: 210px; border-radius: 16px; padding: 18px;
    background: rgba(255,255,255,0.035); border: 1px solid rgba(255,255,255,0.07); }
.pg-feat-ico { width: 38px; height: 38px; border-radius: 11px; display: flex; align-items: center;
    justify-content: center; margin-bottom: 12px; }
.pg-feat-ico svg { width: 18px; height: 18px; }
.pg-feat h3 { font-size: 13.5px; font-weight: 700; color: #fff; margin-bottom: 4px; }
.pg-feat p { font-size: 12px; color: #8b93a3; line-height: 1.5; }

/* ---------- Поле ввода (форма пароля) ---------- */
.pg-label { display: block; font-size: 12px; color: #9aa3b2; margin-bottom: 8px; font-weight: 500; }
.pg-input { width: 100%; height: 44px; padding: 0 42px 0 14px; border-radius: 12px;
    background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.09);
    color: #fff; font-size: 13.5px; transition: border-color .18s ease, box-shadow .18s ease; }
.pg-input::placeholder { color: #5b6472; }
.pg-input:focus { outline: none; border-color: rgba(245,158,11,0.55);
    box-shadow: 0 0 0 3px rgba(245,158,11,0.12); }
.pg-input-wrap { position: relative; }
.pg-input-eye { position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
    color: #6b7280; background: none; border: none; cursor: pointer; padding: 0; }
.pg-input-eye:hover { color: #9aa3b2; }
.pg-input-eye svg { width: 17px; height: 17px; }

/* ---------- Кнопки ---------- */
.pg-btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    height: 42px; padding: 0 22px; border-radius: 12px; border: none; cursor: pointer; font-family: inherit;
    font-size: 13px; font-weight: 800; color: #0a0c10; white-space: nowrap;
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    box-shadow: 0 6px 18px -6px rgba(245,158,11,0.6); transition: transform .15s ease, box-shadow .2s ease; }
.pg-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 9px 22px -6px rgba(245,158,11,0.7); }
.pg-btn-primary:active { transform: scale(0.98); }
.pg-btn-tg { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px;
    border-radius: 12px; font-size: 12.5px; font-weight: 700; color: #fff; text-decoration: none;
    background: #229ED9; transition: background .18s ease; }
.pg-btn-tg:hover { background: #1c8ec2; }
.pg-btn-tg svg { width: 16px; height: 16px; }

/* Бейджи-статусы */
.pg-badge { padding: 6px 12px; border-radius: 9px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.pg-badge.ok { background: rgba(16,185,129,0.15); color: #34d399; }