body{
    font-family: "Trebuchet MS", Verdana, sans-serif;
    background: linear-gradient(120deg,#0f172a,#1e293b);
    margin:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    min-height:100vh;
    padding:35px;
}

.dupimew{
    position:relative;
    width:82%;
    max-width:1080px;
    height:520px;
    background:#f9fafb;
    border-radius:20px;
    box-shadow:0 20px 45px rgba(0,0,0,0.45);
    padding:28px;
    margin-bottom:25px;
}

.gavekal{
    position:absolute;
    top:30px;
    left:30px;
    right:30px;
    bottom:30px;
}

#pointsCanvas{
    pointer-events:none;
    z-index:30;
}

#chartCanvas{
    z-index:10;
}

/* панель управления */

.luxucu{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    justify-content:center;
    max-width:1080px;
    background:rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.15);
    padding:20px;
    border-radius:16px;
    color:#e2e8f0;
}

.control-group{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:80px;
}

.control-group input{
    width:58px;
    padding:7px;
    border-radius:10px;
    border:1px solid #cbd5e1;
    text-align:center;
    font-size:13px;
}







/* карточная сетка */

.rejexab{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:28px;
    padding:10px;
}

/* карточка */

.kyfuno.wazyb{

    background:#ffffff;
    border-radius:22px;

    padding:26px;

    border:1px solid #e2e8f0;

    box-shadow:
    0 10px 25px rgba(0,0,0,0.08),
    0 4px 10px rgba(0,0,0,0.04);

    transition:all .3s ease;
}

.kyfuno.wazyb:hover{

    transform:translateY(-7px) scale(1.01);

    box-shadow:
    0 22px 40px rgba(0,0,0,0.18);
}

.kyfuno .tevu{
    list-style:none;
    margin:0;
    padding:0;
}

.kyfuno h2{

    margin:0;
    font-size:20px;
    font-weight:600;
    color:#0f172a;
}


/* категории */

.jocy *{
box-sizing:border-box;
}

.jocy{

display:flex !important;
flex-wrap:wrap;
gap:18px;
padding:26px;

background:linear-gradient(135deg,#f1f5f9,#e2e8f0);

border-radius:18px;
}

.category-card{

display:block !important;

min-width:150px;
text-align:center;

padding:16px 30px;

background:#ffffff;
color:#1e293b;

text-decoration:none;

border-radius:40px;

border:1px solid #cbd5e1;

font-family:Verdana,sans-serif;
font-size:14px;
font-weight:600;

transition:all .25s ease;

box-shadow:0 5px 12px rgba(0,0,0,0.08);
}

.category-card:hover{

background:#14b8a6;
color:white;

transform:translateY(-4px);

box-shadow:0 14px 25px rgba(0,0,0,0.2);
}


/* footer */

.myqati{

background:#0f172a;
padding:55px 25px;

font-family:Verdana,sans-serif;
}

.tunifac{

max-width:1250px;
margin:0 auto;
}

.fejehyc{

margin-bottom:26px;

color:#f1f5f9;
font-size:19px;
}

/* ссылки */

.jocy{

display:flex;
flex-wrap:wrap;
gap:16px;
}

.category-card{

display:inline-block;

padding:13px 24px;

background:#ffffff;

border-radius:25px;

text-decoration:none;

color:#334155;

font-size:14px;

transition:all .3s ease;

box-shadow:0 6px 12px rgba(0,0,0,0.1);
}

.category-card:hover{

background:#14b8a6;
color:white;

transform:translateY(-3px);

box-shadow:0 12px 22px rgba(0,0,0,0.2);
}







/* сетка карточек */

.rejexab{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:28px;
}

/* карточка */

.kyfuno.wazyb{

background:#ffffff;

padding:28px;

border-radius:22px;

border:1px solid #e2e8f0;

box-shadow:
0 12px 28px rgba(0,0,0,0.08);

transition:all .3s ease;
}

.kyfuno.wazyb:hover{

transform:translateY(-6px);

box-shadow:
0 22px 35px rgba(0,0,0,0.18);
}

.kyfuno .tevu{

list-style:none;
margin:0;
padding:0;
}

.kyfuno h2{

margin:0;

font-size:20px;
font-weight:600;

color:#0f172a;
}