:root{--void:var(--az-accent);--cabin:var(--az-accent);--leather:var(--az-accent);--stitch:var(--az-accent);--chrome:var(--az-accent);--amb:var(--az-accent);--amb-dim:var(--az-accent);--amb-lo:var(--az-accent);--amb-mid:var(--az-accent);--amb-hi:var(--az-accent);--amb-full:var(--az-accent);--platinum:var(--az-accent);--silver:var(--az-accent);--nickel:var(--az-accent);--graphite:var(--az-accent);--whisper:var(--az-accent);--danger-bg:var(--az-glass);--danger-stroke:var(--az-accent);--danger-text:var(--az-text);--success-bg:var(--az-glass);--success-stroke:var(--az-accent);--success-text:var(--az-text);--card-r: 18px;--ease: cubic-bezier(0.22, 0.68, 0.18, 1.0);--t-f: 0.18s;--t-m: 0.32s;--t-s: 0.5s}
*, *::before, *::after{margin: 0;padding: 0;box-sizing: border-box}
html, body{height: 100%;overflow: hidden;background:var(--az-bg);color:var(--az-text);font-family:var(--az-font);-webkit-font-smoothing: antialiased}
::-webkit-scrollbar{width: 4px}
::-webkit-scrollbar-track{background: transparent}
::-webkit-scrollbar-thumb{background:var(--az-glass);border-radius:var(--az-r-card)}
.social-container{position: fixed;bottom: 0;left: 50%;transform: translateX(-50%);max-width: 1440px;width: 100%;height: 100%;overflow-x: hidden;overflow-y: auto;padding: 14px 24px;display: flex;flex-direction: column;scrollbar-width: none;-ms-overflow-style: none}
.social-container::-webkit-scrollbar{display: none}
.page-title{text-align: center;margin: 16px 0 16px 0;font-family:var(--az-font);font-size: 26px;font-weight: 500;letter-spacing: 0.6px;color:var(--az-text)}
.page-title::after{content: '';display: block;width: 36px;height: 1px;background:var(--az-accent-soft);margin: 14px auto 0}
.stories-section{position: relative;display: block;width: 100%;max-width: 100%;overflow: hidden;margin-bottom: 20px;border-bottom:1px solid var(--az-glass-edge);padding: 4px 42px 10px 42px}
.stories-wrapper{display: flex;gap: 14px;width: 100%;max-width: 100%;padding: 4px 0 8px 0;overflow-x: auto;overflow-y: hidden;flex-wrap: nowrap;scroll-behavior: smooth;scrollbar-width: none;-ms-overflow-style: none}
.stories-wrapper::-webkit-scrollbar{display: none}
.story-item{width: 68px;min-width: 68px;position: relative;cursor: pointer;flex-shrink: 0;transition: transform var(--t-f) var(--ease)}
.story-item:hover{transform: scale(1.06)}
.story-image{width: 68px;height: 68px;object-fit: cover;border-radius: 50%;border:1px solid var(--az-glass-edge);display: block}
.owner-tooltip{position: absolute;bottom: 0px;right: -3px;overflow: visible}
.owner-icon{width: 24px;height: 24px;border-radius: 50%;border:1px solid var(--az-glass-edge);background:var(--az-glass);box-sizing: border-box;cursor: pointer;display: block}
.tooltip-text{position: absolute;top: 50%;left: calc(100% + 8px);transform: translateY(-50%);background:var(--az-glass);color:var(--az-text);padding: 5px 9px;font-size: 10.5px;line-height: 1.2;border-radius:var(--az-r-card);white-space: nowrap;opacity: 0;visibility: hidden;transition: opacity 0.1s ease;pointer-events: none;border:1px solid var(--az-glass-edge);z-index: 9999}
.owner-tooltip:hover .tooltip-text{opacity: 1;visibility: visible}
.stories-arrow{position: absolute;top: 50%;transform: translateY(-50%);width: 34px;height: 34px;border-radius: 50%;border:1px solid var(--az-glass-edge);background:var(--az-glass);color:var(--az-text);display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: 5;transition: all var(--t-f) ease;backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);box-shadow:var(--az-glass-shadow)}
.stories-arrow:hover{background:var(--az-glass);border-color:var(--az-glass-edge);color:var(--az-text)}
.stories-arrow.left{left: 0}
.stories-arrow.right{right: 0}
.stories-arrow.hidden{opacity: 0.28;pointer-events: none}
.stories-fade-left,
    .stories-fade-right{position: absolute;top: 0;bottom: 10px;width: 56px;pointer-events: none;z-index: 4}
.stories-fade-left{left: 0;background:var(--az-glass)}
.stories-fade-right{right: 0;background:var(--az-glass)}
.posts-container{display: grid;grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));gap: 18px;padding-bottom: 24px;width: 100%}
.post-item{border-radius:var(--az-r-card);background:var(--az-glass);border:1px solid var(--az-glass-edge);box-shadow:var(--az-glass-shadow);overflow: hidden;position: relative;transform: translateZ(0);cursor: pointer;transition: transform var(--t-m) var(--ease), box-shadow var(--t-m) var(--ease), border-color var(--t-m) var(--ease);display: flex;flex-direction: column}
.post-item::before{content: '';position: absolute;top: -40px;left: -40px;width: 220px;height: 160px;background:var(--az-accent-soft);pointer-events: none;z-index: 1}
.post-item:hover{transform: translateY(-4px);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.post-image-wrap{position: relative;width: 100%;height: 190px;overflow: hidden;background:var(--az-glass);z-index: 2}
.post-image-wrap img{width: 100%;height: 100%;object-fit: cover;display: block;transform: scale(1.01);transition: transform var(--t-s) var(--ease), filter var(--t-s) var(--ease);filter: saturate(0.90) brightness(0.93)}
.post-item:hover .post-image-wrap img{transform: scale(1.05);filter: saturate(1.05) brightness(1.0)}
.post-details{padding: 12px 14px 0 14px;display: flex;flex-direction: column;gap: 0;position: relative;z-index: 2;flex: 1}
.post-meta-row{display: flex;align-items: center;justify-content: space-between;gap: 8px;margin-bottom: 8px}
.post-author{font-size: 12.5px;font-weight: 700;color:var(--az-text);display: flex;gap: 6px;align-items: center;letter-spacing: 0.1px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}
.post-author-logo{width: 22px;height: 22px;border-radius: 50%;object-fit: cover;border:1px solid var(--az-glass-edge);background:var(--az-glass);flex-shrink: 0}
.post-author-name{min-width: 0;overflow: hidden;text-overflow: ellipsis}
.post-time{font-size: 10px;font-weight: 600;color:var(--az-text);white-space: nowrap;flex-shrink: 0;letter-spacing: 0.2px}
.post-desc{font-size: 12px;font-weight: 400;color:var(--az-text);line-height: 1.5;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin-bottom: 4px}
.post-actions{padding: 10px 14px 12px 14px;display: flex;align-items: center;gap: 6px;position: relative;z-index: 2;border-top:1px solid var(--az-glass-edge);margin-top: auto}
.act-btn{display: flex;align-items: center;gap: 5px;padding: 5px 10px;border-radius:var(--az-r-control);background:var(--az-action);border:1px solid var(--az-glass-edge);cursor: pointer;transition: all var(--t-f) ease;user-select: none}
.act-btn i{font-size: 12px;color:var(--az-text);transition: color var(--t-f) ease}
.act-btn span{font-size: 11px;font-weight: 600;color:var(--az-text);transition: color var(--t-f) ease}
.act-btn:hover{background:var(--az-action);border-color:var(--az-glass-edge);transform: translateY(-1px)}
.act-btn:hover i{color:var(--az-text)}
.act-btn:hover span{color:var(--az-text)}
.act-btn.liked{background:var(--az-action);border-color:var(--az-glass-edge)}
.act-btn.liked i{color:var(--az-text)}
.act-btn.liked span{color:var(--az-text)}
.act-btn.share{margin-left: auto}
.act-btn.share:hover{background:var(--az-action);border-color:var(--az-glass-edge)}
.act-btn.share:hover i{color:var(--az-text)}
.action-btn{cursor: pointer}
.like-btn.liked{color:var(--az-text)}
.like-count, .comment-count{font-size: 11px;color:var(--az-text);font-weight: 600}
.action-group{display: contents}
.pagination{display: flex;justify-content: center;gap: 5px;margin: 16px 0 24px 0;flex-wrap: wrap}
.pagination a{color:var(--az-text);padding: 7px 13px;text-decoration: none;border:1px solid var(--az-glass-edge);border-radius:var(--az-r-card);background:var(--az-glass);font-size: 12.5px;font-weight: 600;transition: all var(--t-f) ease}
.pagination a.active{background:var(--az-glass);border-color:var(--az-glass-edge);color:var(--az-accent)}
.pagination a:hover{background:var(--az-glass);border-color:var(--az-glass-edge);color:var(--az-accent)}
#story-modal{display: none;position: fixed;inset: 0;background:var(--az-glass);backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);z-index: 220000;justify-content: center;align-items: center;padding: 18px}
#story-modal.active{display: flex !important}
body.story-viewer-open{overflow: hidden}
.story-container{position: relative;width: 380px;height: 580px;background:var(--az-glass);border:1px solid var(--az-glass-edge);border-radius:var(--az-r-card);overflow: hidden;box-shadow:var(--az-glass-shadow)}
.story-close{position: absolute;top: 14px;right: 14px;width: 36px;height: 36px;padding: 0;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);appearance: none;-webkit-appearance: none;display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: 30;color:var(--az-text);font-size: 15px;transition: all var(--t-f) ease}
.story-close:hover{border-color:var(--az-glass-edge);background:var(--az-glass)}
.story-owner{position: absolute;top: 16px;left: 16px;display: flex;align-items: center;z-index: 24}
#story-owner-icon{width: 30px;height: 30px;border-radius: 50%;margin-right: 8px;border:1px solid var(--az-glass-edge);background:var(--az-glass)}
#story-owner-name{color:var(--az-text);font-weight: 600;font-size: 13px}
.story-image-container{width: 100%;height: 100%;position: relative}
#story-image,
    #story-video{width: 100%;height: 100%;object-fit: cover;display: block}
.progress-bar{position: absolute;top: 8px;left: 10px;right: 10px;height: 2px;background:var(--az-glass);border-radius:var(--az-r-card);z-index: 28}
#progress{height: 100%;background:var(--az-glass);width: 0%;border-radius:var(--az-r-card);transition: width linear}
.story-nav-area{position: absolute;top: 0;bottom: 0;width: 50%;z-index: 8;cursor: pointer}
.left{left: 0}
.right{right: 0}
.post-details-modal{display: none;position: fixed;inset: 0;background:var(--az-glass);backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);z-index: 210000;justify-content: center;align-items: center}
.post-details-modal-content{background:var(--az-glass);border:1px solid var(--az-glass-edge);border-radius:var(--az-r-card);box-shadow:var(--az-glass-shadow);width: 90%;max-width: 600px;max-height: 82vh;overflow-y: auto;padding: 22px;position: relative;scrollbar-width: none;-ms-overflow-style: none}
.post-details-modal-content::-webkit-scrollbar{display: none}
.modal-close{position: absolute;top: 14px;right: 14px;width: 36px;height: 36px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: 10;color:var(--az-text);font-size: 15px;transition: all var(--t-f) ease}
.modal-close:hover{border-color:var(--az-glass-edge);background:var(--az-glass)}
.post-details-modal-content h2{text-align: center;font-family:var(--az-font);font-size: 17px;font-weight: 500;color:var(--az-text);margin-bottom: 18px}
.gallery{display: flex;flex-direction: column;align-items: center;margin-bottom: 16px}
.main-image{width: 100%;max-height: 360px;object-fit: cover;border-radius:var(--az-r-card);margin-bottom: 12px;border:1px solid var(--az-glass-edge)}
.thumbnails{display: flex;gap: 8px;overflow-x: auto;width: 100%;padding: 4px 0}
.thumbnails::-webkit-scrollbar{height: 3px}
.thumbnails::-webkit-scrollbar-thumb{background:var(--az-glass);border-radius:var(--az-r-card)}
.thumbnails img{width: 64px;height: 64px;object-fit: cover;cursor: pointer;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);opacity: 0.55;transition: all var(--t-f) ease}
.thumbnails img:hover{opacity: 0.8}
.thumbnails img.active{border-color:var(--az-glass-edge);opacity: 1}
.full-details{display: flex;gap: 16px;font-size: 13px;text-align: left}
.info-group{flex: 1;display: flex;flex-direction: column;gap: 8px}
.info-group p{margin: 0;display: flex;align-items: center;color:var(--az-text)}
.info-group i{margin-right: 8px;color:var(--az-text);width: 16px;text-align: center;font-size: 12px}
.description{margin-top: 14px;font-size: 13px;text-align: left}
.description p{margin: 0;display: flex;align-items: flex-start;color:var(--az-muted);line-height: 1.55}
.description i{margin-right: 8px;color:var(--az-muted);width: 16px;text-align: center;margin-top: 3px;font-size: 12px}
.modal-post-actions{display: flex;gap: 16px;margin-top: 16px;padding-top: 12px;border-top:1px solid var(--az-glass-edge)}
.comments-section{margin-top: 16px}
#post-company{display: inline-flex;align-items: center;gap: 9px}
#post-company img{width: 28px;height: 28px;border-radius: 50%;object-fit: cover;border:1px solid var(--az-glass-edge);background:var(--az-glass);flex-shrink: 0}
.comments-header{font-size: 14px;font-weight: 600;color:var(--az-text);margin-bottom: 10px}
.comments-loading,
    .comments-empty,
    .comments-error{padding: 12px 0;color:var(--az-danger);font-size: 12.5px;line-height: 1.45}
.comments-error{color:var(--az-danger)}
.comment{border-bottom:1px solid var(--az-glass-edge);padding: 10px 0;display: flex;flex-direction: column}
.comment-header{display: flex;align-items: center}
.comment-avatar{width: 26px;height: 26px;border-radius: 50%;margin-right: 8px;border:1px solid var(--az-glass-edge)}
.comment-author{font-weight: 600;font-size: 12.5px;color:var(--az-text)}
.comment-text{margin-top: 4px;font-size: 12.5px;color:var(--az-text);line-height: 1.45}
.comment-actions{margin-top: 4px;display: flex;gap: 8px}
.comment-actions button{background:var(--az-action);border:1px solid var(--az-glass-edge);color:var(--az-text);cursor: pointer;padding: 3px 9px;border-radius:var(--az-r-control);font-size: 11px;font-weight: 600;transition: all var(--t-f) ease}
.comment-actions button:hover{background:var(--az-action);border-color:var(--az-glass-edge)}
.comment-form{display: flex;gap: 8px;margin-top: 14px}
.comment-form textarea{flex: 1;background:var(--az-glass);border:1px solid var(--az-glass-edge);color:var(--az-text);padding: 10px;border-radius:var(--az-r-control);font-family:var(--az-font);font-size: 13px;resize: none;outline: none;transition: border-color var(--t-f) ease}
.comment-form textarea:focus{border-color:var(--az-glass-edge)}
.comment-form textarea::placeholder{color:var(--az-muted)}
.comment-form button{background:var(--az-action);color:var(--az-text);padding: 8px 14px;border: none;border-radius:var(--az-r-control);cursor: pointer;font-family:var(--az-font);font-weight: 600;font-size: 12.5px;transition: filter var(--t-f) ease}
.comment-form button:hover{filter: brightness(1.08)}
.comment-form button:disabled{cursor: wait;filter: grayscale(0.35) brightness(0.78)}
.share-modal{display: none;position: fixed;inset: 0;background:var(--az-glass);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);z-index: 1000;justify-content: center;align-items: center;padding: 16px}
.share-modal-content{background:var(--az-glass);border:1px solid var(--az-glass-edge);border-radius:var(--az-r-card);padding: 0;width: 100%;max-width: 380px;box-shadow:var(--az-glass-shadow);overflow: hidden;position: relative}
.share-close{position: absolute;top: 12px;right: 12px;width: 34px;height: 34px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);backdrop-filter: blur(10px);display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: 10;color:var(--az-text);font-size: 14px;transition: all var(--t-f) ease}
.share-close:hover{border-color:var(--az-glass-edge);background:var(--az-glass)}
.share-preview{width: 100%;height: 180px;overflow: hidden;position: relative}
.share-preview img{width: 100%;height: 100%;object-fit: cover;display: block;filter: saturate(0.88) brightness(0.85)}
.share-preview-overlay{position: absolute;bottom: 0;left: 0;right: 0;padding: 28px 16px 12px 16px;background:rgb(5 12 18 / .58);display: flex;align-items: baseline;gap: 8px}
.share-preview-company{font-size: 12px;font-weight: 600;color:var(--az-text);display: flex;align-items: center;gap: 5px}
.share-preview-company i{font-size: 10px;color:var(--az-text)}
.share-body{padding: 16px 18px 18px 18px}
.share-body h3{font-family:var(--az-font);font-weight: 500;font-size: 16px;color:var(--az-text);margin-bottom: 14px}
.share-grid{display: grid;grid-template-columns: repeat(4, 1fr);gap: 8px;margin-bottom: 14px}
.share-item{display: flex;flex-direction: column;align-items: center;gap: 5px;padding: 10px 4px;border-radius:var(--az-r-card);background:var(--az-glass);border:1px solid var(--az-glass-edge);cursor: pointer;text-decoration: none;transition: all var(--t-f) ease}
.share-item:hover{background:var(--az-glass);border-color:var(--az-glass-edge);transform: translateY(-2px)}
.share-item i{font-size: 20px;transition: color var(--t-f) ease}
.share-item span{font-size: 9px;font-weight: 700;color:var(--az-text);letter-spacing: 0.2px;text-transform: uppercase}
.share-item.fb i{color:var(--az-text)}
.share-item.fb:hover i{color:var(--az-text)}
.share-item.ig i{color:var(--az-text)}
.share-item.ig:hover i{color:var(--az-text)}
.share-item.tw .x-logo{font-size: 20px;font-weight: 900;color:var(--az-text);line-height: 1;font-family:var(--az-font);transition: color var(--t-f) ease}
.share-item.tw:hover .x-logo{color:var(--az-text)}
.share-item.wa i{color:var(--az-text)}
.share-item.wa:hover i{color:var(--az-accent)}
.share-item.vb i{color:var(--az-text)}
.share-item.vb:hover i{color:var(--az-text)}
.share-item.tg i{color:var(--az-text)}
.share-item.tg:hover i{color:var(--az-text)}
.share-item.sms i{color:var(--az-text)}
.share-item.sms:hover i{color:var(--az-text)}
.share-item.link i{color:var(--az-text)}
.share-item.link:hover i{color:var(--az-text)}
.share-copy-bar{display: flex;align-items: center;gap: 8px;padding: 8px 10px;border-radius:var(--az-r-card);background:var(--az-glass);border:1px solid var(--az-glass-edge)}
.share-copy-url{flex: 1;font-size: 11px;color:var(--az-text);white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-family:var(--az-font)}
.share-copy-btn{padding: 5px 12px;border-radius:var(--az-r-control);background:var(--az-action);color:var(--az-text);font-size: 10.5px;font-weight: 700;border: none;cursor: pointer;letter-spacing: 0.3px;white-space: nowrap;transition: filter var(--t-f) ease;flex-shrink: 0}
.share-copy-btn:hover{filter: brightness(1.1)}
.share-copy-btn.copied{background:var(--az-action)}
@media (max-width: 768px){.posts-container{grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));gap: 14px}
.post-image-wrap{height: 160px}
.stories-section{padding-left: 36px;padding-right: 36px}
.stories-arrow{width: 30px;height: 30px}}
@media (max-width: 600px){.story-container{width: 90%;height: 80%;max-width: 350px;max-height: 580px}}
@media (max-width: 480px){.social-container{left: 0;transform: none;padding: 10px 12px}
.posts-container{grid-template-columns: 1fr 1fr;gap: 10px}
.post-image-wrap{height: 130px}
.post-details{padding: 8px 10px 0 10px;gap: 6px}
.post-actions{padding: 6px 10px 10px 10px}
.post-desc{font-size: 11px;-webkit-line-clamp: 2}
.post-author{font-size: 11px}
.full-details{flex-direction: column}
.description{width: 100%}
.comment-form{flex-direction: column}
.page-title{font-size: 20px}
.stories-section{padding-left: 34px;padding-right: 34px}
.stories-arrow{width: 28px;height: 28px;font-size: 12px}
.stories-fade-left,
        .stories-fade-right{width: 40px}}