/* MiraNow — панель проводников (Этап 3). Тёмная палитра, самодостаточно. */
.gbar{background:#080b18;border-bottom:1px solid #1e2740}
.gbar-in{max-width:1200px;margin:0 auto;padding:8px 24px;display:flex;justify-content:flex-end;align-items:center;gap:10px}
.gpill{display:inline-flex;align-items:center;gap:8px;background:#0f1526;border:1.5px solid #1e2740;border-radius:22px;padding:5px 15px 5px 6px;cursor:pointer;font-family:'Manrope',system-ui,sans-serif;font-weight:700;font-size:14px;color:#f7f8ff;transition:border-color .2s,transform .1s}
.gpill b{font-weight:700}
.gpill img{width:28px;height:28px;border-radius:50%;display:block;background:#1e2740}
.gpill[data-guide="mira"]:hover,.gpill[data-guide="mira"].open{border-color:#F06FA6}
.gpill[data-guide="neo"]:hover,.gpill[data-guide="neo"].open{border-color:#3D8BF0}
.gpill:active{transform:scale(.97)}
.gpill:focus-visible{outline:2px solid #8F8DF4;outline-offset:2px}
.gbar-panels{max-width:1200px;margin:0 auto;padding:0 24px}
.gp{background:#0f1526;border:1px solid #1e2740;border-radius:16px;padding:16px 18px;margin:2px 0 12px auto;max-width:380px;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.gp[hidden]{display:none}
.gp-h{display:flex;align-items:center;gap:12px}
.gp-av{width:40px;height:40px;border-radius:50%;flex:0 0 auto;background:#1e2740}
.gp-id{flex:1;display:flex;flex-direction:column;line-height:1.2;font-family:'Manrope',system-ui,sans-serif;min-width:0}
.gp-id b{font-size:16px;color:#f7f8ff;font-weight:700}
.gp-id span{font-size:12.5px;color:#7a839e}
.gp-x{background:none;border:0;color:#7a839e;font-size:24px;line-height:1;cursor:pointer;padding:0 2px;flex:0 0 auto}
.gp-x:hover{color:#f7f8ff}
.gp-x:focus-visible{outline:2px solid #8F8DF4;outline-offset:2px;border-radius:6px}
.gp-hd{font-family:'Manrope',system-ui,sans-serif;font-weight:700;font-size:13px;letter-spacing:.02em;color:#f7f8ff;margin:14px 0 4px}
.gp-r{font-family:'Manrope',system-ui,sans-serif;font-size:13.5px;color:#aab3cc;margin:0 0 12px;line-height:1.45}
.gp-routes{display:flex;flex-direction:column;gap:8px}
.gp-route{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#080b18;border:1px solid #1e2740;border-radius:11px;padding:11px 14px;font-family:'Manrope',system-ui,sans-serif;font-weight:600;font-size:14.5px;color:#f7f8ff!important;text-decoration:none!important;transition:border-color .15s,background .15s}
#gp-mira .gp-route:hover{border-color:#F06FA6;background:#12182b}
#gp-neo .gp-route:hover{border-color:#3D8BF0;background:#12182b}
.gp-route:focus-visible{outline:2px solid #8F8DF4;outline-offset:2px}
.gp-route .gp-ar{color:#7a839e;flex:0 0 auto}
.gp-route.is-read{opacity:.5}
.gp-route.is-read .gp-rt::after{content:' · прочитано';color:#7a839e;font-weight:500;font-size:12px}
/* 3.1 футер-«дверь» + «Спросить в Telegram» */
.gp-foots{border-top:1px solid #1e2740;margin-top:14px;padding-top:11px;display:flex;flex-direction:column;gap:7px}
.gp-foot{font-family:'Manrope',system-ui,sans-serif;font-size:13px;font-weight:600;color:#8a93ad!important;text-decoration:none!important;transition:color .15s}
.gp-foot:hover{color:#f7f8ff!important}
.gp-foot:focus-visible{outline:2px solid #8F8DF4;outline-offset:2px;border-radius:6px}
#gp-mira .gp-foot-tg{color:#F06FA6!important}#gp-neo .gp-foot-tg{color:#3D8BF0!important}
.gp-foot-tg:hover{filter:brightness(1.2)}
/* 3.1 микродвижение: подсветка кольца при открытии + наклон портрета при наведении на маршрут */
#gp-mira{--gcr:rgba(240,111,166,.55)}#gp-neo{--gcr:rgba(61,139,240,.55)}
.gp-av{transition:transform .18s ease}
.gp:not([hidden]) .gp-av{animation:gpGlow .5s ease-out}
@keyframes gpGlow{0%{box-shadow:0 0 0 0 var(--gcr)}55%{box-shadow:0 0 0 5px var(--gcr)}100%{box-shadow:0 0 0 0 rgba(0,0,0,0)}}
.gp:has(.gp-route:hover) .gp-av{transform:rotate(-3deg)}
@media(max-width:520px){
  .gbar-in{gap:8px;padding:7px 16px}
  .gpill{padding:4px 13px 4px 5px}.gpill b{font-size:13px}
  .gp{max-width:100%}.gbar-panels{padding:0 16px}
}
@media(prefers-reduced-motion:reduce){.gpill,.gp-route,.gp-av{transition:none!important}.gp:not([hidden]) .gp-av{animation:none!important}.gp:has(.gp-route:hover) .gp-av{transform:none!important}}
