
:root{
  --pink:#ff0a68;
  --pink2:#ff5a9f;
}
*{box-sizing:border-box}
html,body{margin:0;min-width:320px;background:#030407!important;color:#f6f7f9}
html body header.top,html body>footer{display:none!important}
html body main.wrap{width:100vw!important;max-width:none!important;margin:0!important;padding:0!important}
body{font-family:Inter,Arial,sans-serif}

.v30-page{
  min-height:100vh;
  background:radial-gradient(circle at 50% -10%,#3a0018 0,#0b0710 34%,#030407 76%);
}

.v30-header{
  width:min(calc(100% - 40px),1650px);
  margin:0 auto;
  padding:26px 0 58px;
  display:grid;
  grid-template-columns:220px minmax(0,1fr) auto;
  gap:28px;
  align-items:center;
}
.v30-brand img{width:190px;filter:drop-shadow(0 0 20px #ff0a6860)}
.v30-header>div{text-align:center}
.v30-header>div>span{color:#ff74aa;letter-spacing:2.5px;font-size:11px;font-weight:900}
.v30-header h1{margin:8px 0 4px;font-size:clamp(50px,6vw,88px);font-style:italic;line-height:.9}
.v30-header h1 em{color:#ff276f;display:block}
.v30-header p{margin:12px auto 0;max-width:720px;color:#aeb4bf}
.v30-header nav{display:flex;gap:7px}
.v30-header nav a{
  padding:10px 13px;border:1px solid #ffffff14;border-radius:8px;
  background:#080a0fc4;color:#c4c8d0;text-decoration:none;font-weight:800
}

.v30-main{width:min(calc(100% - 40px),1650px);margin:0 auto}
.v30-kpis{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px
}
.v30-kpis article{
  min-height:165px;padding:20px;border:1px solid #ffffff14;border-radius:14px;
  background:
    radial-gradient(circle at 78% 20%,#ff0a6816,transparent 34%),
    linear-gradient(145deg,#11131a,#07080c);
  box-shadow:0 18px 45px #0008
}
.v30-kpis span{color:#ff5a9f;font-size:11px;letter-spacing:1.6px;font-weight:900}
.v30-kpis strong{
  display:block;margin-top:10px;color:#fff;font-size:48px;text-shadow:0 0 20px #ff0a6848
}
.v30-kpis small{display:block;margin-top:6px;color:#838b96}

.v30-grid{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px
}
.v30-panel{
  min-height:360px;padding:20px;border:1px solid #ffffff14;border-radius:14px;
  background:linear-gradient(145deg,#101219,#07080c);
  box-shadow:0 20px 52px #0009
}
.v30-panel-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:20px;
  margin-bottom:20px
}
.v30-panel-head span,.v30-section-head span{
  color:#ff5a9f;font-size:11px;letter-spacing:1.6px;font-weight:900
}
.v30-panel-head h2,.v30-section-head h2{margin:6px 0 0;font-size:30px}
.v30-panel-head small{color:#858c97}

.v30-bars{display:grid;gap:14px}
.v30-bar-label{display:flex;justify-content:space-between;margin-bottom:6px}
.v30-bar-label span{color:#ff7caf}
.v30-bars i{
  display:block;height:11px;border-radius:999px;background:#171920;overflow:hidden;position:relative
}
.v30-bars i::after{
  content:"";position:absolute;inset:0 auto 0 0;width:var(--value);
  background:linear-gradient(90deg,#ff0a68,#ff6fa8);
  border-radius:inherit;box-shadow:0 0 15px #ff0a6840;
  animation:v30Bar 1s ease both
}
@keyframes v30Bar{from{width:0}}

.v30-donut-wrap{display:grid;grid-template-columns:210px 1fr;gap:26px;align-items:center}
.v30-donut{
  width:190px;height:190px;margin:auto;display:grid;place-items:center;
  border-radius:50%;
  background:
    radial-gradient(circle,#0a0c11 0 54%,transparent 55%),
    conic-gradient(var(--segments));
  box-shadow:0 0 32px #ff0a681d,inset 0 0 30px #0009
}
.v30-donut strong{font-size:38px}
.v30-donut span{margin-top:-58px;color:#8a919c;font-size:11px;text-transform:uppercase}
.v30-legend{display:grid;gap:10px}
.v30-legend>div{
  display:grid;grid-template-columns:14px 1fr auto;gap:9px;align-items:center;
  padding:9px;border:1px solid #ffffff10;border-radius:8px;background:#090b10
}
.v30-legend>div>span{width:10px;height:10px;border-radius:50%;background:#ff0a68;box-shadow:0 0 10px #ff0a68}
.v30-legend small{color:#ff7caf}

.v30-chip-list{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px
}
.v30-chip-list a{
  min-height:100px;padding:14px;display:flex;flex-direction:column;justify-content:center;
  border:1px solid #ffffff12;border-radius:10px;background:#090b10;
  color:#fff;text-decoration:none;transition:.2s
}
.v30-chip-list a:hover{transform:translateY(-3px);border-color:#ff0a6870;box-shadow:0 0 20px #ff0a6820}
.v30-chip-list strong{font-size:19px}
.v30-chip-list span{margin-top:5px;color:#ff78ad;font-size:11px}

.v30-slot-list{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.v30-slot-list>div{
  min-height:72px;padding:12px;display:flex;justify-content:space-between;align-items:center;
  border:1px solid #ffffff11;border-radius:9px;background:#090b10
}
.v30-slot-list span{color:#bdc2ca}
.v30-slot-list strong{color:#ff5a9f;font-size:22px}

.v30-latest{padding:80px 0 20px}
.v30-section-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:18px
}
.v30-section-head a{color:#ff6fa8;text-decoration:none}
.v30-build-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:13px}
.v30-build-grid>a{
  min-height:145px;padding:18px;display:grid;grid-template-columns:62px minmax(0,1fr) 24px;
  gap:14px;align-items:center;border:1px solid #ffffff14;border-radius:13px;
  background:linear-gradient(145deg,#101219,#07080c);color:#fff;text-decoration:none;transition:.2s
}
.v30-build-grid>a:hover{transform:translateY(-3px);border-color:#ff0a6870;box-shadow:0 0 24px #ff0a6824}
.v30-build-icon{
  width:62px;height:62px;display:grid;place-items:center;border:1px solid #ff0a6850;
  border-radius:11px;background:radial-gradient(circle,#420b23,#090a0f);
  color:#ff5a9f;font-size:25px;font-weight:900
}
.v30-build-grid span{color:#ff5a9f;font-size:10px;letter-spacing:1.2px}
.v30-build-grid h3{margin:5px 0;font-size:21px}
.v30-build-grid p{margin:0;color:#9ca3ad;font-size:12px}
.v30-build-grid small{display:block;margin-top:6px;color:#6f7782}
.v30-build-grid>a>strong{color:#ff6fa8;font-size:30px}

.v30-footer{
  width:min(calc(100% - 40px),1650px);margin:70px auto 0;padding:22px 0;
  display:flex;justify-content:space-between;border-top:1px solid #ffffff10;color:#7f8691;font-size:12px
}
.v30-footer strong{color:#fff}

.v30-reveal{opacity:0;transform:translateY(22px);transition:.5s ease var(--delay,0ms)}
.v30-reveal.visible{opacity:1;transform:translateY(0)}

@media(max-width:1000px){
  .v30-header{grid-template-columns:1fr;text-align:center}
  .v30-brand,.v30-header nav{justify-self:center}
  .v30-kpis{grid-template-columns:repeat(2,1fr)}
  .v30-grid{grid-template-columns:1fr}
}
@media(max-width:650px){
  .v30-header,.v30-main,.v30-footer{width:calc(100% - 22px)}
  .v30-kpis{grid-template-columns:1fr}
  .v30-donut-wrap{grid-template-columns:1fr}
  .v30-chip-list,.v30-slot-list{grid-template-columns:1fr}
  .v30-section-head{align-items:flex-start;flex-direction:column}
  .v30-footer{flex-direction:column;gap:7px;text-align:center}
}
