/* Единая шапка и подвал NorthByte Works (см. app/shared.tsx Header/Footer) —
   стили скопированы из app/northbyte.css и ограничены селектором .nbw-chrome
   с уникальными именами классов (префикс nbw-), чтобы НЕ конфликтовать с
   собственными (неизолированными) стилями каждой игровой страницы — там
   встречаются такие же общие имена (.site-header, .site-footer, .brand,
   .wrap), и совпадение имени ломает вёрстку даже под .nbw-chrome, если сам
   класс не уникален. */
.nbw-chrome{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;line-height:1.6}
.nbw-chrome a{color:inherit;text-decoration:none}
.nbw-chrome button{font:inherit;cursor:pointer}
.nbw-chrome .nbw-wrap{width:min(1180px,calc(100% - 64px));margin-inline:auto}
.nbw-chrome a:focus-visible,.nbw-chrome button:focus-visible{outline:3px solid #2785ad;outline-offset:4px}
.nbw-chrome .nbw-bar{background:var(--nb-deep);color:#e7eeee;border-bottom:1px solid #2b3b44}
.nbw-chrome .nbw-bar-row{display:flex;align-items:center;gap:30px;min-height:86px}
.nbw-chrome .nbw-brand{display:flex;align-items:center;gap:12px;font-size:18px;white-space:nowrap}
.nbw-chrome .nbw-brand strong{font-weight:750}
.nbw-chrome .nbw-mark{display:grid;place-items:center;width:39px;height:39px;border:1px solid #478b76;border-radius:7px;color:#9df2ce;font-size:16px;font-weight:800;flex-shrink:0}
.nbw-chrome .nbw-bar-row nav{display:flex;flex-wrap:wrap;gap:24px;margin-left:auto;font-size:14px}
.nbw-chrome .nbw-bar-row nav a{padding-block:12px}
.nbw-chrome .nbw-bar-row nav a:hover,.nbw-chrome .nbw-bar-row nav a[aria-current="page"]{color:var(--nb-north)}
.nbw-chrome .nbw-footbar{padding:52px 0 34px;background:var(--nb-deep);color:#d6e1e7}
.nbw-chrome .nbw-footbar .nbw-wrap{display:block}
.nbw-chrome .nbw-footgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;align-items:start}
.nbw-chrome .nbw-foottitle{color:#fff;font-size:13px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;margin-bottom:16px}
.nbw-chrome .nbw-foottag{color:#aabac3;font-size:14px;margin-top:12px;max-width:280px}
.nbw-chrome .nbw-footlegal{color:#7c8e98;font-size:13px;margin-top:18px;line-height:1.6}
.nbw-chrome .nbw-footcol-contacts .nbw-contactlinks{display:flex;flex-direction:column;gap:16px;margin-top:0}
.nbw-chrome .nbw-footcol-contacts .nbw-contactitem{position:relative;display:inline-flex;align-items:center;width:fit-content}
.nbw-chrome .nbw-footcol-contacts .nbw-contactlink{color:#d6e1e7;font-size:15px;display:inline-flex;align-items:center;gap:7px}
.nbw-chrome .nbw-footcol-contacts .nbw-contactlink:hover{color:#fff}
.nbw-chrome .nbw-footcol-links{display:flex;flex-direction:column;gap:12px;font-size:14px;color:#d6e1e7}
.nbw-chrome .nbw-footcol-links a:hover{color:#fff}
.nbw-chrome .nbw-contactitem{position:relative;display:inline-flex;align-items:center}
.nbw-chrome .nbw-contactitem::before{content:'';position:absolute;left:0;right:0;top:-12px;height:12px}
.nbw-chrome .nbw-contactcopy{position:absolute;left:0;bottom:calc(100% + 8px);display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid #3a4b56;border-radius:5px;background:#1a2b33;color:#d6e1e7;font-size:12px;white-space:nowrap;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .15s ease,transform .15s ease;z-index:2}
.nbw-chrome .nbw-contactitem:hover .nbw-contactcopy,.nbw-chrome .nbw-contactitem:focus-within .nbw-contactcopy,.nbw-chrome .nbw-contactcopy:focus-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.nbw-chrome .nbw-contactcopy:hover{border-color:var(--nb-north);color:#fff}
.nbw-chrome .nbw-contactcopy[data-copied="1"]{border-color:var(--nb-north);color:var(--nb-north)}
@media(max-width:1050px){.nbw-chrome .nbw-bar-row{gap:20px}.nbw-chrome .nbw-bar-row nav{gap:16px}}
@media(max-width:700px){.nbw-chrome .nbw-wrap{width:calc(100% - 36px)}.nbw-chrome .nbw-bar-row{flex-wrap:wrap;gap:6px;padding-block:13px 6px;min-height:0}.nbw-chrome .nbw-brand{font-size:17px}.nbw-chrome .nbw-bar-row nav{width:100%;justify-content:flex-start;gap:6px 16px;margin-left:0}.nbw-chrome .nbw-bar-row nav a{font-size:13px;padding-block:8px}.nbw-chrome .nbw-footgrid{grid-template-columns:1fr;gap:32px}}
/* 02.10.2026: у шапки/подвала часть раскладки задана inline-стилями в HTML
   (grid на 3 колонки, gap/min-height строки), а inline перебивает обычные
   правила — на телефоне подвал не складывался в колонку и вылезал за экран
   (ширина страницы ~700px при экране 390px). !important здесь нужен ровно
   для того, чтобы мобильные правила победили inline-стили. */
@media(max-width:700px){.nbw-chrome .nbw-wrap{width:calc(100% - 36px)!important}.nbw-chrome .nbw-bar-row{gap:6px!important;min-height:0!important}.nbw-chrome .nbw-footgrid{grid-template-columns:1fr!important;gap:32px!important}}