/* VPNature skin для LibreSpeed — override поверх classic-стиля.
   Палитра/типографика сайта vpnature.net (Services/Website.md «Дизайн-система»). */
:root{
  --bg:#0a1810; --bg2:#0f2418; --card:#1a3a28; --line:#143020;
  --acc:#5dca5a; --acc2:#7ee07e;
  --tx:#e8f3e8; --tx2:#a8c4a8; --tx3:#708870;
  --serif:Georgia,'Charter',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
html,body{ background:var(--bg)!important; color:var(--tx)!important; }
body{ font-family:var(--sans)!important; text-align:center; }
#loading{ background:var(--bg)!important; color:var(--tx2)!important; }

/* ---------- шапка ---------- */
.vp-header{ display:flex; align-items:center; justify-content:space-between;
  max-width:760px; margin:0 auto; padding:18px 22px; box-sizing:border-box; }
.vp-logo{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.vp-logo svg{ width:34px; height:34px; display:block; }
.vp-logo .vp-name{ font-family:var(--serif); font-size:20px; font-weight:700;
  color:var(--tx); letter-spacing:.3px; }
.vp-back{ color:var(--tx2); text-decoration:none; font-size:14px; white-space:nowrap; }
.vp-back:hover{ color:var(--acc); }

/* ---------- заголовки ---------- */
h1{ font-family:var(--serif)!important; color:var(--tx)!important;
  font-size:26px!important; margin:14px 0 4px!important; }
.vp-sub{ color:var(--tx3); font-size:14px; margin:0 0 10px; }

/* ---------- карточка теста ---------- */
#testWrapper{ max-width:760px; margin:0 auto; padding:0 16px 48px; box-sizing:border-box; }
#test{ background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:28px 18px; margin-top:20px; }
.testName{ color:var(--tx2)!important; }
.meterText{ color:var(--tx)!important; }
.unit{ color:var(--tx3)!important; }
#ipArea,#ip{ color:var(--tx3)!important; }
#serverArea{ color:var(--tx2)!important; }
#serverArea select{ background:var(--bg2); color:var(--tx); border:1px solid var(--line);
  border-radius:6px; padding:4px 8px; }

/* ---------- кнопка старт/стоп ---------- */
#startStopBtn{ background:var(--acc)!important; box-shadow:none!important; }
#startStopBtn:hover{ background:var(--acc2)!important; }
#startStopBtn:before{ border-color:transparent transparent transparent var(--bg)!important; }
#startStopBtn.running{ background:var(--card)!important;
  border:2px solid var(--acc)!important; box-sizing:border-box; }
#startStopBtn.running:before{ background:var(--acc)!important;
  border-color:var(--acc)!important; }

/* ---------- футер ---------- */
.vp-footer{ margin-top:26px; color:var(--tx3); font-size:13px; }
.vp-footer a{ color:var(--tx2); text-decoration:none; }
.vp-footer a:hover{ color:var(--acc); }

/* ---------- адаптив ---------- */
@media (max-width:768px){ #test{ padding:22px 12px; } }
@media (max-width:480px){
  h1{ font-size:22px!important; }
  .vp-header{ padding:14px 14px; }
  .vp-logo .vp-name{ font-size:18px; }
}
