/* NodeForge · «жидкое стекло» (стиль Apple Liquid Glass). Только оформление, без логики. */
:root{
  --lg-blur:22px;
  --lg-sat:170%;
  --lg-spring:cubic-bezier(.34,1.56,.64,1);
  --lg-edge:rgba(255,255,255,.22);
  --lg-edge-soft:rgba(255,255,255,.07);
  --lg-sheen:linear-gradient(135deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.03) 38%,rgba(255,255,255,0) 60%);
  --lg-shadow:0 10px 34px rgba(2,6,23,.34),0 2px 8px rgba(2,6,23,.22);
}
html[data-theme="light"]{
  --lg-edge:rgba(255,255,255,.9);
  --lg-edge-soft:rgba(15,23,42,.06);
  --lg-sheen:linear-gradient(135deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,.25) 40%,rgba(255,255,255,0) 62%);
  --lg-shadow:0 10px 30px rgba(30,41,59,.12),0 2px 6px rgba(30,41,59,.07);
}

/* ---- фон: медленные «жидкие» цветные блики ---- */
body.workspace{background:var(--bg)}
body.workspace::before,body.workspace::after{content:"";position:fixed;z-index:-1;pointer-events:none;border-radius:50%;filter:blur(90px);opacity:.5}
body.workspace::before{width:58vmax;height:58vmax;left:-14vmax;top:-18vmax;background:radial-gradient(circle at 35% 35%,#5b9cff,rgba(91,156,255,0) 68%);animation:lgFloatA 26s ease-in-out infinite alternate}
body.workspace::after{width:52vmax;height:52vmax;right:-16vmax;bottom:-20vmax;background:radial-gradient(circle at 60% 60%,#c084fc,rgba(244,114,182,.0) 68%);animation:lgFloatB 32s ease-in-out infinite alternate}
html[data-theme="light"] body.workspace::before,html[data-theme="light"] body.workspace::after{opacity:.38}
@keyframes lgFloatA{0%{transform:translate(0,0) scale(1)}50%{transform:translate(9vmax,6vmax) scale(1.12)}100%{transform:translate(3vmax,14vmax) scale(.96)}}
@keyframes lgFloatB{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-10vmax,-5vmax) scale(1.1)}100%{transform:translate(-4vmax,-12vmax) scale(.94)}}

/* ---- стеклянные поверхности ---- */
.sidebar,.card,.hub-nav,.modal-card,.mobile-header,.map-legend,.gx-board{
  background:var(--lg-sheen),color-mix(in srgb,var(--surface) 58%,transparent) !important;
  -webkit-backdrop-filter:blur(var(--lg-blur)) saturate(var(--lg-sat));
  backdrop-filter:blur(var(--lg-blur)) saturate(var(--lg-sat));
  border:1px solid var(--lg-edge-soft) !important;
  box-shadow:inset 0 1px 0 var(--lg-edge),inset 0 -1px 0 var(--lg-edge-soft),var(--lg-shadow) !important;
}
.card,.hub-nav,.modal-card{border-radius:var(--r-xl,22px) !important}
.sidebar{border-radius:0 var(--r-xl,22px) var(--r-xl,22px) 0 !important;border-left:0 !important}
.card{transition:transform .35s var(--lg-spring),box-shadow .35s ease}
@media (hover:hover){
  .card:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 var(--lg-edge),inset 0 -1px 0 var(--lg-edge-soft),0 16px 44px rgba(2,6,23,.38) !important}
}

/* ---- навигация, кнопки, поля ---- */
.nav-item{border-radius:14px;transition:transform .3s var(--lg-spring),background .2s ease,box-shadow .25s ease}
.nav-item:hover{transform:translateX(3px)}
.nav-item:active{transform:scale(.97)}
.nav-item.on{background:var(--lg-sheen),color-mix(in srgb,var(--accent) 22%,transparent) !important;box-shadow:inset 0 1px 0 var(--lg-edge),0 4px 18px color-mix(in srgb,var(--accent) 28%,transparent)}
button,.btn,.btn-ghost,.btn-danger,.btn-sm,[type="button"],[type="submit"]{transition:transform .28s var(--lg-spring),box-shadow .25s ease,background .2s ease,filter .2s ease}
button:not(:disabled):hover,.btn:hover{transform:translateY(-1px) scale(1.02)}
button:not(:disabled):active,.btn:active{transform:scale(.96)}
.btn:not(.btn-ghost):not(.btn-danger),button.primary{border-radius:999px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 20px color-mix(in srgb,var(--accent) 35%,transparent)}
.btn-ghost,.btn-sm{border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
input:not([type="checkbox"]):not([type="radio"]),select,textarea{
  background:color-mix(in srgb,var(--bg-2) 55%,transparent) !important;border-radius:14px !important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 2px rgba(2,6,23,.25);transition:box-shadow .25s ease,border-color .25s ease}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent),inset 0 1px 2px rgba(2,6,23,.2) !important}

/* ---- затемнение под окнами, таблицы, плашки ---- */
[class*="overlay"],.modal{-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%)}
.tag,.badge{border-radius:999px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* ---- мобильные: легче и без тяжёлой анимации ---- */
@media (max-width:768px){
  :root{--lg-blur:14px}
  body.workspace::before,body.workspace::after{animation:none;filter:blur(60px);opacity:.35}
  .sidebar{border-radius:0 18px 18px 0 !important}
  .nav-item:hover{transform:none}
}
/* ---- уважаем «меньше движения» ---- */
@media (prefers-reduced-motion:reduce){
  body.workspace::before,body.workspace::after{animation:none}
  .card,.nav-item,button,.btn{transition:none !important}
  .card:hover,button:hover,.btn:hover,.nav-item:hover{transform:none !important}
}
/* ---- браузеры без backdrop-filter ---- */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .sidebar,.card,.hub-nav,.modal-card{background:var(--surface) !important}
}

/* ---- v2: остальные страницы (карта, граф, CDN, Happ) и мобильная версия ---- */
.map-stage,.map-inspect,.map-toggle,.gx-card,.hp-bridge,.hp-tunnel,.ins-cmd,.login-wrap{
  -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);
  box-shadow:inset 0 1px 0 var(--lg-edge-soft),0 6px 22px rgba(2,6,23,.22);border-radius:var(--r-lg,16px)}
.gx-card{transition:transform .3s var(--lg-spring)}
@media (hover:hover){.gx-card:hover{transform:translateY(-2px)}}
.login-wrap{background:var(--lg-sheen),color-mix(in srgb,var(--surface) 60%,transparent) !important}
@media (max-width:768px){
  .page-wrap{padding-left:12px !important;padding-right:12px !important}
  .card{padding:14px !important;border-radius:18px !important}
  .page-heading{flex-wrap:wrap;gap:10px}
  table{display:block;overflow-x:auto;white-space:nowrap}
  .hl-stats{grid-template-columns:1fr 1fr}
}
