/* Сессия 7: серые страницы (форум, регистрация, админка) — токены, общие блоки, роутер страниц, меню профиля.
   Правило заказчика: красный и синий — только для торговой страницы, на остальных страницах блоки на серых подложках. */
:root{
  --g-blk:#17181a;          /* база серого блока */
  --g-in:rgba(10,11,12,.42);/* вложенная плашка внутри блока (как карточка статьи) */
  --g-in2:rgba(255,255,255,.04);
  --g-line:rgba(255,255,255,.08);
  --g-line2:rgba(255,255,255,.14);
  --g-tx:#eae2de;--g-dim:rgba(255,255,255,.55);--g-faint:rgba(255,255,255,.38);
  --g-act:#f1efee;--g-act-tx:#121314; /* активный таб / основная кнопка — белые */
  --g-metal:radial-gradient(90% 38% at 85% 0%,rgba(255,255,255,.06),transparent 70%),radial-gradient(70% 30% at 10% 62%,rgba(255,255,255,.03),transparent 70%),
    linear-gradient(150deg,#2c2f33 0%,#18191c 36%,#222428 60%,#131416 100%);
}

/* ---------- роутер: страницы ---------- */
.pg{width:min(1801px,100%)}
.pg[hidden]{display:none!important}
body[data-page]:not([data-page="trade"]) .deck,
body[data-page]:not([data-page="trade"]) .trade,
body[data-page]:not([data-page="trade"]) .ctrl{display:none!important}
.hnav a[aria-current="page"]{color:#fff;background:rgba(255,255,255,.08)}

/* ---------- серый блок ---------- */
.gblk{position:relative;isolation:isolate;border-radius:24px;border:2px solid var(--g-line);background:var(--g-blk);padding:20px;color:var(--g-tx)}
.gblk::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:var(--g-metal)}
.gh{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.gh h2,.gh h1{margin:0;font-size:20px;font-weight:600;line-height:1.25;color:var(--g-tx)}
.gh .gsub{font-size:14px;font-weight:500;color:var(--g-faint)}
.gsp{flex:1}

/* табы на серых страницах: активный белый */
.gtabs{display:flex;gap:2px;padding:4px;border-radius:13px;background:rgba(0,0,0,.35);border:1px solid var(--g-line);overflow-x:auto;scrollbar-width:none;max-width:100%}
.gtabs::-webkit-scrollbar{display:none}
.gtabs button{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:10px;font-size:14px;font-weight:500;color:var(--g-dim);white-space:nowrap;
  transition:background-color .2s,color .2s}
.gtabs button:hover{color:#fff}
.gtabs button[aria-pressed="true"]{background:var(--g-act);color:var(--g-act-tx)}
.gtabs button b{min-width:20px;height:20px;padding:0 6px;border-radius:7px;font-size:12px;font-weight:600;display:grid;place-items:center;background:rgba(255,255,255,.1);color:inherit}
.gtabs button[aria-pressed="true"] b{background:rgba(18,19,20,.12)}
.gtabs .dot{width:7px;height:7px;border-radius:50%;background:var(--c,#fff)}

/* кнопки серых страниц */
.btn.wh{color:var(--g-act-tx);background:linear-gradient(180deg,#fff,#d9d6d4);box-shadow:inset 0 1px 0 #fff,0 6px 16px -8px rgba(255,255,255,.35)}
.btn.sm{height:34px;padding:0 12px;border-radius:10px;font-size:14px}
.btn.adm{color:#fff;background:linear-gradient(180deg,#ff3a5c,#c3001f 60%,#8e0016);border:1px solid #8e0016;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 16px -6px rgba(253,0,47,.45)}
.gchip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap;
  color:var(--c,#cfcfcf);background:color-mix(in srgb,var(--c,#cfcfcf) 12%,transparent)}
.gchip i{width:6px;height:6px;border-radius:50%;background:currentColor}

/* поля ввода */
.gfld{display:flex;flex-direction:column;gap:6px;min-width:0}
.gfld>label,.gfld>.lb{font-size:14px;font-weight:500;color:var(--g-dim)}
.ginp{display:flex;align-items:center;gap:10px;height:46px;padding:0 12px 0 14px;border-radius:12px;background:rgba(0,0,0,.4);border:1px solid var(--g-line2);transition:border-color .2s,box-shadow .2s}
.ginp:focus-within{border-color:rgba(255,255,255,.4);box-shadow:0 0 0 3px rgba(255,255,255,.06)}
.ginp.err{border-color:rgba(255,107,111,.7)}.ginp.ok{border-color:rgba(95,211,168,.55)}
.ginp input,.ginp select{flex:1;min-width:0;height:100%;background:none;border:0;outline:0;color:#fff;font:500 16px var(--font)}
.ginp select option{background:#18191c}
.ginp input::placeholder{color:rgba(255,255,255,.35)}
.ginp .ico{width:18px;height:18px;color:var(--g-faint)}
.ginp .ib{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:var(--g-dim)}
.ginp .ib:hover{background:rgba(255,255,255,.06);color:#fff}
.ghint{font-size:13px;font-weight:500;color:var(--g-faint);display:flex;align-items:center;gap:6px;min-height:18px}
.ghint.err{color:#ff8f93}.ghint.ok{color:var(--ok)}
.ghint .ico{width:14px;height:14px}
.gcheck{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.4;color:var(--g-dim);cursor:pointer}
.gcheck input{appearance:none;flex:none;width:20px;height:20px;margin:0;border-radius:6px;border:1px solid var(--g-line2);background:rgba(0,0,0,.4);display:grid;place-items:center;cursor:pointer;transition:background-color .2s,border-color .2s}
.gcheck input:checked{background:var(--g-act);border-color:var(--g-act)}
.gcheck input:checked::after{content:"";width:10px;height:6px;border:2px solid var(--g-act-tx);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.gcheck input:focus-visible{outline:2px solid #fff;outline-offset:2px}
.gcheck a{color:#fff}

/* рекламный баннер на серых страницах (тот же язык, что баннер чата) */
.gad{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;border-radius:18px;text-align:center;
  color:#e8c77f;font-size:16px;font-weight:600;border:1px solid rgba(212,174,98,.22);
  background:radial-gradient(80% 60% at 50% 100%,rgba(212,174,98,.16),transparent 70%),linear-gradient(180deg,#1d1b18,#121212);transition:border-color .2s,transform .35s var(--spring)}
.gad span{font-size:14px;font-weight:500;color:rgba(232,199,127,.55)}
.gad small{font-size:12px;font-weight:500;color:rgba(255,255,255,.3);letter-spacing:.06em;text-transform:uppercase}
.gad:hover{border-color:rgba(212,174,98,.45)}
.gad:active{transform:scale(.985)}

/* аватар-инициал */
.gav{width:var(--s,32px);height:var(--s,32px);border-radius:calc(var(--s,32px)*.24);display:grid;place-items:center;flex:none;font-size:calc(var(--s,32px)*.42);font-weight:600;color:#fff;background:var(--c,#3a3c40)}

/* ---------- меню профиля ---------- */
.pmenu{position:absolute;top:calc(100% + 10px);right:0;width:300px;max-width:calc(100vw - 32px);padding:8px;border-radius:16px;background:#141416;
  border:1px solid rgba(255,255,255,.1);box-shadow:0 24px 60px rgba(0,0,0,.7);animation:tbin2 .25s var(--spring) both;z-index:6;text-align:left}
.pmenu .pm-h{padding:8px 8px 10px;font-size:13px;font-weight:500;color:var(--g-faint)}
.pmenu .pm-seg{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:3px;margin:0 4px 6px;border-radius:11px;background:rgba(255,255,255,.05)}
.pmenu .pm-seg button{height:32px;border-radius:9px;font-size:14px;font-weight:500;color:var(--g-dim)}
.pmenu .pm-seg button[aria-pressed="true"]{background:var(--g-act);color:var(--g-act-tx)}
.pmenu a,.pmenu .pm-i{display:flex;align-items:center;gap:10px;width:100%;padding:10px 8px;border-radius:10px;font-size:14px;font-weight:500;color:rgba(255,255,255,.8);text-decoration:none}
.pmenu a:hover,.pmenu .pm-i:hover{background:rgba(255,255,255,.05);color:#fff}
.pmenu a[aria-current="page"]{background:rgba(255,255,255,.07);color:#fff}
.pmenu .ico{width:18px;height:18px;color:var(--g-faint)}
.pmenu hr{border:0;height:1px;background:rgba(255,255,255,.07);margin:6px 4px}
.pmenu .pm-b{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:7px;background:#fd002f;color:#fff;font-size:12px;font-weight:600;display:grid;place-items:center}
.hme-w{position:relative}
.hadm{display:none;align-items:center;gap:8px;height:40px;padding:0 8px 0 12px;border-radius:11px;font-size:14px;font-weight:600;color:#ffd6dd;
  background:rgba(253,0,47,.12);border:1px solid rgba(253,0,47,.4);transition:background-color .2s,transform .3s var(--spring)}
.hadm:hover{background:rgba(253,0,47,.2)}.hadm:active{transform:scale(.95)}
.hadm b{min-width:22px;height:22px;padding:0 6px;border-radius:7px;background:#fd002f;color:#fff;font-size:13px;display:grid;place-items:center}
body[data-role="admin"] .hadm{display:flex}
body[data-role="admin"] .hdeals{display:none}

/* мобилка: на серых страницах прячем контекстную строку навигации */
@media (max-width:720px){
  body[data-page]:not([data-page="trade"]){padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  body[data-page]:not([data-page="trade"]) .msub{display:none}
  body[data-page]:not([data-page="trade"]) .mtab button[aria-current]{color:rgba(255,255,255,.45);background:none}
  body[data-page]:not([data-page="trade"]) .mtab button[aria-current]::before{display:none}
  body[data-page]:not([data-page="trade"]) .dl{display:none}
  .gblk{border-radius:20px;padding:14px}
  body[data-role="admin"] .hadm{display:none}
}