/* ===============================
   تایپوگرافی و رنگ‌بندی زنده
=============================== */
body{
    font-family: 'Vazirmatn', sans-serif;
    font-size:16px;
    font-weight:400;
    color:#333;
}
h1,h2,h3,h4,h5,h6{
    font-family: 'Vazirmatn', sans-serif;
    font-weight:700;
}
a{color:#ff3c00; text-decoration:none;}

/* ===============================
   استایل استوری
=============================== */
.stories{
    padding:10px 0;
    overflow-x:auto;
    white-space:nowrap;
}
.stories-container{
    display:flex;
    gap:10px;
}
.story-item{
    width:80px;
    height:80px;
    border-radius:50%;
    background-size:cover;
    background-position:center;
    position:relative;
    cursor:pointer;
    flex-shrink:0;
    transition: 0.3s ease;
}
.story-item:hover{
    filter: brightness(0.8);
}
.story-content{
    position:absolute;
    bottom:-20px;
    width:100%;
    text-align:center;
    font-size:12px;
    color:#fff;
}

/* ===============================
   Modal پیش‌نمایش عکس یا ویدئو
=============================== */
.story-modal{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.8);
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:9999;
}
.story-modal-inner{
    width:80%;
    max-width:600px;
    height:80%;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    border-radius:10px;
}
.story-modal-video{
    width:80%;
    max-width:600px;
    height:auto;
    border-radius:10px;
}