:root{
        --green:#0B1F3A;
        --green-dark:#071A2F;
        --green-deep:#071A2F;
        --green-soft:#EDF4FF;
        --primary:#0B1F3A;
        --primary-2:#123B68;
        --primary-gradient:linear-gradient(135deg,#071A2F,#0B1F3A,#123B68);
        --identity-blue:#1266B0;
        --contact-call-soft:#eef5ed;
        --contact-call:#166534;
        --dark-beige:#8B6F47;
        --cream:#fbf8ef;
        --gold-brown:#72612f;
        --ink:#1f2428;
        --muted:#7a7f88;
        --line:#e8e5df;
        --page:#fdfcfb;
        --card:#fff;
        --red:#dc2626;
        --shadow:0 10px 26px rgba(20,30,24,.055);
        --modal-shadow:0 28px 80px rgba(20,30,24,.24);
    }

    *{ box-sizing:border-box; }
    html{ direction:rtl; -webkit-text-size-adjust:100%; }
    body{
        margin:0;
        min-height:100vh;
        background:var(--page);
        color:var(--ink);
        font-family:"IBM Plex Sans Arabic","Tajawal","Cairo","Segoe UI",Tahoma,Arial,sans-serif;
        font-weight:700;
        overflow-x:hidden;
    }
    body.no-scroll{ overflow:hidden; }
    a,button,input,textarea,select{ font-family:inherit; }
    input,textarea,select,button{ font-size:16px; }

    .page{
        width:min(100%,560px);
        margin:0 auto;
        padding:calc(66px + env(safe-area-inset-top)) 12px calc(96px + env(safe-area-inset-bottom));
        overflow:visible;
        position:relative;
    }

    .top-actions{
        position:fixed;
        top:0;
        right:50%;
        z-index:1100;
        width:100vw;
        min-height:48px;
        display:grid;
        grid-template-columns:1fr auto 1fr;
        align-items:center;
        gap:10px;
        margin:0;
        padding:max(10px, env(safe-area-inset-top)) 12px 8px;
        background:linear-gradient(180deg, rgba(7,26,47,.78), rgba(11,31,58,.58));
        -webkit-backdrop-filter:blur(12px);
        backdrop-filter:blur(12px);
        box-shadow:0 10px 28px rgba(7,26,47,.12);
        transform:translateX(50%);
        pointer-events:none;
        transition:background .22s ease, backdrop-filter .22s ease, box-shadow .22s ease;
    }
    .top-actions.is-scrolled{
        background:linear-gradient(180deg, rgba(7,26,47,.96), rgba(11,31,58,.9));
        -webkit-backdrop-filter:blur(16px);
        backdrop-filter:blur(16px);
        box-shadow:0 12px 30px rgba(7,26,47,.24);
    }
    .top-actions > *{ pointer-events:auto; }
    .back-link{
        width:40px;
        height:40px;
        border:0;
        border-radius:50%;
        display:grid;
        place-items:center;
        color:#fff;
        text-decoration:none;
        font-size:16px;
        transition:background .16s ease, transform .16s ease;
        justify-self:start;
    }
    .back-link:hover{ background:rgba(255,255,255,.24); }
    .back-link:active{ transform:scale(.98); }
    .glass-control,
    .detail-hero-brand{
        background:rgba(255,255,255,.16);
        -webkit-backdrop-filter:blur(12px);
        backdrop-filter:blur(12px);
        box-shadow:0 8px 22px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.2);
    }
    .detail-hero-brand{
        justify-self:center;
        width:42px;
        height:42px;
        padding:4px;
        border-radius:50%;
        display:grid;
        place-items:center;
        color:#fff;
        text-decoration:none;
        overflow:hidden;
    }
    .detail-hero-brand img{
        width:100%;
        height:100%;
        border-radius:50%;
        object-fit:cover;
    }
    .tools{
        display:flex;
        align-items:center;
        gap:28px;
        direction:ltr;
        min-width:0;
    }
    .top-detail-tools{
        display:flex;
        align-items:center;
        justify-content:flex-end;
        gap:7px;
        direction:ltr;
        min-width:0;
        justify-self:end;
    }
    .tool-form{ margin:0; }
    .tool-btn{
        width:52px;
        min-width:0;
        border:0;
        background:transparent;
        color:#fff;
        display:grid;
        justify-items:center;
        gap:7px;
        text-decoration:none;
        cursor:pointer;
        font-size:13px;
        font-weight:800;
        text-shadow:0 1px 3px rgba(0,0,0,.18);
        transition:opacity .16s ease, transform .16s ease;
    }
    .tool-btn i{
        width:34px;
        height:34px;
        display:grid;
        place-items:center;
        font-size:28px;
    }
    .tool-btn:hover{ opacity:.88; }
    .tool-btn:active{ transform:scale(.98); }
    .tool-btn.is-active{ color:#fff; }

    .top-detail-tools .tool-btn{
        width:40px;
        min-width:40px;
        height:40px;
        min-height:40px;
        padding:0 9px;
        border:0;
        border-radius:50%;
        color:#fff;
        display:grid;
        place-items:center;
        align-items:center;
        justify-content:center;
        gap:0;
        font-size:11px;
        font-weight:900;
        line-height:1.2;
        text-shadow:none;
    }
    .top-detail-tools .tool-btn i{
        width:auto;
        height:auto;
        font-size:16px;
    }
    .top-detail-tools .tool-btn span{
        position:absolute;
        width:1px;
        height:1px;
        margin:-1px;
        padding:0;
        overflow:hidden;
        clip:rect(0,0,0,0);
        white-space:nowrap;
    }
    .top-detail-tools .tool-btn:hover{
        color:#fff;
        background:rgba(255,255,255,.24);
        opacity:1;
    }
    .top-detail-tools .tool-btn--favorite i{
        color:#D71920;
    }
    .top-detail-tools .tool-btn--favorite.is-active{
        background:rgba(255,245,245,.24);
        color:#D71920;
    }
    .top-detail-tools .tool-btn--favorite.is-active i{
        color:#D71920;
    }

    .detail-tools{
        display:flex;
        align-items:center;
        justify-content:center;
        flex-wrap:wrap;
        gap:8px;
        direction:ltr;
        margin:14px 0 0;
        padding:10px;
        border:1px solid var(--line);
        border-radius:16px;
        background:#fff;
        box-shadow:0 8px 20px rgba(20,30,24,.035);
    }
    .detail-tools .tool-btn{
        width:auto;
        min-width:84px;
        min-height:48px;
        padding:0 13px;
        border:1px solid var(--line);
        border-radius:13px;
        background:var(--cream);
        color:var(--green-deep);
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:8px;
        font-size:12.5px;
        font-weight:900;
        text-shadow:none;
    }
    .detail-tools .tool-btn i{
        width:auto;
        height:auto;
        font-size:21px;
    }
    .detail-tools .tool-btn.is-active,
    .detail-tools .tool-btn:hover{
        color:var(--green-deep);
        background:#f7f2e6;
        opacity:1;
    }
    .detail-tools .tool-btn--favorite i{
        color:#D71920;
    }
    .detail-tools .tool-btn--favorite.is-active{
        border-color:rgba(215,25,32,.38);
        background:#fff5f5;
        color:#D71920;
    }
    .detail-tools .tool-btn--favorite.is-active i{
        color:#D71920;
    }

    .messages{ display:grid; gap:10px; margin:12px 0; }
    .media-stack + .messages{ margin-top:12px; }
    .message{
        padding:10px 12px;
        border-radius:14px;
        line-height:1.7;
        font-size:13px;
        font-weight:800;
        background:var(--green-soft);
        color:var(--green);
        border:1px solid #d9efe4;
    }
    .message.error{ background:#fff1f1; color:var(--red); border-color:#fecaca; }
    .message.warning{ background:#fff8ed; color:#9a5c16; border-color:#f5dec1; }

    .detail-toast-region{
        position:fixed;
        top:calc(58px + env(safe-area-inset-top));
        right:50%;
        z-index:1250;
        width:min(420px, calc(100vw - 24px));
        display:grid;
        gap:8px;
        transform:translateX(50%);
        pointer-events:none;
    }
    .detail-toast{
        min-height:42px;
        padding:10px 14px;
        border:1px solid rgba(255,255,255,.18);
        border-radius:12px;
        background:rgba(7,26,47,.92);
        -webkit-backdrop-filter:blur(14px);
        backdrop-filter:blur(14px);
        box-shadow:0 16px 38px rgba(7,26,47,.22);
        color:#fff;
        display:flex;
        align-items:center;
        justify-content:center;
        text-align:center;
        line-height:1.6;
        font-size:13px;
        font-weight:900;
        opacity:1;
        transform:translateY(0);
        transition:opacity .22s ease, transform .22s ease;
        pointer-events:auto;
    }
    .detail-toast.error{
        background:rgba(127,29,29,.94);
        border-color:rgba(254,202,202,.32);
    }
    .detail-toast.warning{
        background:rgba(120,53,15,.94);
        border-color:rgba(254,215,170,.32);
    }
    .detail-toast.is-hiding{
        opacity:0;
        transform:translateY(-8px);
    }

    .seller-row{
        display:flex;
        align-items:center;
        gap:12px;
        margin:0;
        padding:0 0 12px;
        min-height:58px;
        border:0;
        border-bottom:1px solid rgba(7,26,47,.08);
        border-radius:0;
        background:transparent;
        box-shadow:none;
        min-width:0;
    }
    .seller-profile-link{
        min-width:0;
        display:flex;
        align-items:center;
        gap:12px;
        flex:1;
        color:inherit;
        text-decoration:none;
    }
    .seller-row .seller-avatar{
        width:44px;
        height:44px;
        aspect-ratio:1 / 1;
        border-radius:50%;
        border:0;
        padding:0;
        display:grid;
        place-items:center;
        background:#eef5ed;
        color:var(--green);
        font-size:19px;
        overflow:hidden;
        flex:0 0 auto;
        text-decoration:none;
    }
    .seller-row button.seller-avatar{ cursor:pointer; }
    .seller-row .seller-avatar img{ width:100%; height:100%; aspect-ratio:1 / 1; object-fit:cover; display:block; border-radius:50%; }
    .seller-info{ min-width:0; display:grid; gap:5px; flex:1; }
    .seller-name{
        color:var(--ink);
        font-size:15px;
        font-weight:900;
        text-decoration:none;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
        max-width:100%;
    }
    .seller-meta{
        display:flex;
        align-items:center;
        flex-wrap:wrap;
        gap:4px 9px;
        color:var(--green-deep);
        font-size:11.5px;
        font-weight:900;
        line-height:1.45;
    }
    .seller-meta span{
        display:inline-flex;
        align-items:center;
        gap:4px;
        white-space:nowrap;
    }
    .seller-meta i{
        color:var(--green-deep);
        font-size:11px;
    }
    .follow-form{ margin:0; }
    .seller-row > .follow-form,
    .seller-row > .follow-btn{
        margin-right:auto;
    }
    .follow-btn{
        flex:0 0 auto;
        min-height:40px;
        min-width:88px;
        padding:0 11px;
        border:1px solid rgba(6,97,58,.55);
        border-radius:13px;
        background:var(--cream);
        color:var(--green);
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:7px;
        text-decoration:none;
        font-size:13px;
        font-weight:900;
        cursor:pointer;
        transition:background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;
    }
    .follow-btn i{ font-size:14px; }
    .follow-btn.is-active,
    .follow-btn:hover{
        background:#f7f2e6;
        color:var(--green);
        box-shadow:0 6px 14px rgba(6,97,58,.08);
        transform:translateY(-1px);
    }
    .follow-btn:active{ transform:translateY(0); box-shadow:none; }
    .owner-actions{
        display:flex;
        justify-content:flex-start;
        flex-wrap:wrap;
        gap:8px;
        margin:10px 0 0;
    }
    .owner-actions form{ margin:0; }
    .owner-actions a,
    .owner-actions button{
        min-height:34px;
        padding:0 10px;
        border:1px solid rgba(220,38,38,.16);
        border-radius:999px;
        background:rgba(255,255,255,.58);
        color:var(--red);
        display:inline-flex;
        align-items:center;
        gap:7px;
        text-decoration:none;
        cursor:pointer;
        font-size:12.5px;
        font-weight:900;
    }
    .owner-actions button{ color:var(--red); }
    .owner-actions--detail{
        margin:10px 0 0;
    }

    .listing-info-panel{
        margin:0 0 0;
        padding:14px 14px 12px;
        border-radius:16px;
        background:#fff;
        box-shadow:0 10px 28px rgba(7,26,47,.055);
        overflow:visible;
    }
    .ad-content{
        padding-top:12px;
        overflow-wrap:anywhere;
    }
    .ad-head{
        display:grid;
        gap:8px;
        margin:0;
        padding:0;
        border:0;
        border-radius:0;
        background:transparent;
        box-shadow:none;
    }
    .ad-title{
        margin:0;
        color:var(--green-deep);
        font-size:24px;
        font-weight:900;
        line-height:1.35;
        text-align:right;
        min-width:0;
        max-width:100%;
        overflow-wrap:anywhere;
    }
    .ad-head-main{
        display:grid;
        gap:7px;
        min-width:0;
    }
    .ad-meta-row{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:8px;
        min-width:0;
        flex-wrap:nowrap;
    }
    .ad-meta-row .ad-detail-meta{
        flex:1 1 auto;
        min-width:0;
    }
    .ad-meta-row .price-line{ flex:0 0 auto; }
    .ad-title.is-read{
        color:var(--identity-blue);
    }
    .ad-time{
        margin:9px 0 0;
        color:var(--green-deep);
        display:flex;
        align-items:center;
        gap:6px;
        flex:0 0 auto;
        direction:rtl;
        font-size:15px;
        font-weight:800;
        white-space:nowrap;
    }
    .ad-time i{
        color:var(--green-deep);
        font-size:15px;
    }
    .description{
        margin:10px 0 0;
        padding:10px 0 12px;
        border:0;
        border-top:1px solid rgba(7,26,47,.08);
        border-radius:0;
        background:transparent;
        color:#2f3438;
        font-size:15px;
        line-height:1.9;
        white-space:pre-line;
        text-align:right;
    }
    .price-line{
        margin:0;
        color:var(--primary-2);
        font-size:16px;
        font-weight:900;
        line-height:1.6;
        white-space:nowrap;
    }
    .ad-detail-meta{
        display:flex;
        align-items:center;
        flex-wrap:nowrap;
        gap:7px 10px;
        color:var(--muted);
        font-size:12.5px;
        font-weight:900;
        line-height:1.6;
        overflow:hidden;
        white-space:nowrap;
    }
    .ad-detail-meta span{
        display:inline-flex;
        align-items:center;
        gap:5px;
        min-width:0;
        white-space:nowrap;
    }
    .ad-detail-meta i{ color:var(--primary-2); }
    .category-breadcrumb{
        margin:0 0 10px;
        color:var(--green);
        font-size:13px;
        font-weight:900;
        line-height:1.7;
    }
    .media-stack{
        display:block;
        width:auto;
        margin:12px -10px 0;
    }
    .media-stack--vertical{
        margin-top:12px;
    }
    .media-vertical{
        display:grid;
        gap:10px;
        width:100%;
    }
    .media-vertical-item{
        margin:0;
        width:100%;
        border-radius:12px;
        overflow:hidden;
        background:#f6f8fb;
        box-shadow:0 10px 24px rgba(7,26,47,.08);
    }
    .media-vertical-image{
        width:100%;
        height:auto;
        aspect-ratio:10 / 7;
        display:block;
        object-fit:cover;
        background:#eef2f6;
    }
    .media-vertical-video{
        width:100%;
        aspect-ratio:16 / 9;
        display:block;
        background:#111;
    }
    .media-gallery{
        position:relative;
        width:100%;
        overflow:hidden;
        border-radius:16px;
        background:#111827;
        border:0;
        box-shadow:0 18px 42px rgba(7,26,47,.16);
    }
    .media-gallery.is-pending::before{
        content:"";
        position:absolute;
        inset:0;
        z-index:5;
        background:rgba(17,24,39,.12);
        pointer-events:none;
    }
    .media-gallery.is-pending::after{
        content:"";
        position:absolute;
        top:50%;
        left:50%;
        z-index:6;
        width:28px;
        height:28px;
        margin:-14px 0 0 -14px;
        border-radius:50%;
        border:3px solid rgba(255,255,255,.4);
        border-top-color:#fff;
        animation:media-spin .8s linear infinite;
        pointer-events:none;
    }
    .media-stage{
        position:relative;
        width:100%;
        height:clamp(340px, 62vh, 660px);
        min-height:340px;
        max-height:660px;
        margin:0;
        display:grid;
        place-items:center;
        direction:rtl;
        background:#111827;
        overflow:hidden;
        touch-action:pan-y;
    }
    .media-main-image,
    .media-stage-video{
        width:100%;
        height:100%;
        display:block;
        object-fit:cover;
        background:#111;
        will-change:transform;
    }
    .media-main-image{
        position:relative;
        z-index:2;
        object-position:center center;
        opacity:1;
        background:transparent;
        transition:opacity .18s ease, transform .34s cubic-bezier(.2,.8,.2,1);
        cursor:pointer;
    }
    .media-main-image.is-cover{
        object-fit:cover;
    }
    .media-main-image.is-contain{
        object-fit:contain;
    }
    .media-main-image.is-fading{
        opacity:0;
    }
    .media-stage::before{
        content:"";
        position:absolute;
        inset:-18px;
        z-index:0;
        background-image:var(--media-bg, none);
        background-size:cover;
        background-position:center center;
        filter:blur(18px);
        opacity:.48;
        transform:scale(1.04);
        pointer-events:none;
    }
    .media-stage::after{
        content:"";
        position:absolute;
        inset:0;
        z-index:1;
        background:linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.18));
        pointer-events:none;
    }
    .media-stage-video{
        position:relative;
        z-index:2;
        object-fit:contain;
        transition:transform .34s cubic-bezier(.2,.8,.2,1);
    }
    .media-stage.is-swiping .media-main-image,
    .media-stage.is-swiping .media-stage-video,
    .media-lightbox__stage.is-swiping > img,
    .media-lightbox__stage.is-swiping > video,
    .media-swipe-visual{
        will-change:transform;
    }
    .media-swipe-visual{
        position:absolute;
        inset:0;
        z-index:2;
        width:100%;
        height:100%;
        display:block;
        object-fit:cover;
        background:#111;
        pointer-events:none;
        transition:transform .34s cubic-bezier(.2,.8,.2,1);
    }
    .media-swipe-visual.is-cover{
        object-fit:cover;
    }
    .media-swipe-visual.is-contain,
    .media-swipe-visual--lightbox{
        object-fit:contain;
    }
    .media-main-image[hidden],
    .media-stage-video[hidden],
    .video-play-badge[hidden]{
        display:none !important;
    }
    .media-counter{
        position:absolute;
        top:auto;
        right:auto;
        bottom:18px;
        left:16px;
        z-index:3;
        min-height:24px;
        padding:0 9px;
        border-radius:999px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        background:rgba(0,0,0,.46);
        -webkit-backdrop-filter:blur(8px);
        backdrop-filter:blur(8px);
        color:#fff;
        font-size:11px;
        font-weight:900;
        direction:ltr;
    }
    .media-counter[hidden]{ display:none !important; }
    .media-loader{
        position:absolute;
        inset:0;
        z-index:4;
        display:none;
        place-items:center;
        background:rgba(17,24,39,.18);
        pointer-events:none;
    }
    .media-stage.is-loading .media-loader{ display:grid; }
    .media-loader::before{
        content:"";
        width:28px;
        height:28px;
        border-radius:50%;
        border:3px solid rgba(255,255,255,.34);
        border-top-color:#fff;
        animation:media-spin .8s linear infinite;
    }
    @keyframes media-spin{ to{ transform:rotate(360deg); } }
    .video-play-badge{
        position:absolute;
        inset:50% auto auto 50%;
        z-index:2;
        min-width:64px;
        min-height:64px;
        padding:0;
        border-radius:999px;
        display:grid;
        place-items:center;
        align-items:center;
        gap:0;
        background:rgba(0,0,0,.46);
        -webkit-backdrop-filter:blur(10px);
        backdrop-filter:blur(10px);
        color:#fff;
        font-size:0;
        font-weight:900;
        cursor:pointer;
        transform:translate(-50%,-50%);
        box-shadow:0 12px 30px rgba(0,0,0,.22);
    }
    .video-play-badge i{ font-size:24px; }
    .media-dots{
        position:absolute;
        right:50%;
        bottom:22px;
        z-index:3;
        display:flex;
        align-items:center;
        justify-content:center;
        flex-direction:row-reverse;
        gap:6px;
        transform:translateX(50%);
        direction:ltr;
        pointer-events:none;
    }
    .media-dot{
        width:6px;
        height:6px;
        border:0;
        border-radius:999px;
        padding:0;
        background:rgba(255,255,255,.56);
        box-shadow:0 1px 4px rgba(0,0,0,.16);
        transition:width .18s ease, background .18s ease, opacity .18s ease;
        pointer-events:auto;
    }
    .media-dot.is-active{
        width:18px;
        background:#fff;
    }
    .media-empty{
        min-height:clamp(320px, 56vh, 560px);
        border:0;
        border-radius:16px;
        display:grid;
        place-items:center;
        background:#f4f1ed;
        color:var(--muted);
        font-size:36px;
    }
    .media-lightbox{
        position:fixed;
        inset:0;
        z-index:3700;
        display:none;
        grid-template-rows:auto minmax(0,1fr) auto;
        gap:10px;
        padding:max(14px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom));
        background:#000;
    }
    .media-lightbox.is-open{ display:grid; }
    .media-lightbox__stage{
        position:relative;
        min-width:0;
        min-height:0;
        display:grid;
        place-items:center;
        touch-action:none;
        transition:opacity .18s ease;
        overflow:hidden;
    }
    .media-lightbox__stage > img,
    .media-lightbox__stage > video{
        opacity:1;
        transition:opacity .18s ease, transform .34s cubic-bezier(.2,.8,.2,1);
    }
    .media-lightbox img,
    .media-lightbox video{
        max-width:100%;
        max-height:calc(100vh - 86px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
        object-fit:contain;
        border-radius:0;
    }
    .media-lightbox img{
        touch-action:none;
        user-select:none;
    }
    .media-lightbox video{
        width:min(100%,960px);
        background:#111;
    }
    .media-lightbox__close{
        position:absolute;
        top:max(14px, env(safe-area-inset-top));
        right:14px;
        width:44px;
        height:44px;
        border:0;
        border-radius:50%;
        display:grid;
        place-items:center;
        background:rgba(255,255,255,.12);
        -webkit-backdrop-filter:blur(10px);
        backdrop-filter:blur(10px);
        color:#fff;
        cursor:pointer;
        font-size:18px;
    }
    .media-lightbox__counter{
        justify-self:center;
        min-height:34px;
        padding:0 12px;
        border-radius:999px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        background:rgba(255,255,255,.14);
        color:#fff;
        font-size:13px;
        font-weight:900;
        direction:ltr;
    }
    .media-lightbox__counter[hidden]{ display:none !important; }
    .media-lightbox__dots{
        display:flex;
        justify-content:center;
        align-items:center;
        flex-direction:row-reverse;
        gap:6px;
        direction:ltr;
        padding:0 0 max(6px, env(safe-area-inset-bottom));
        min-height:20px;
    }
    .media-lightbox__dots:empty{ display:none; }
    .media-lightbox__dot{
        width:6px;
        height:6px;
        border:0;
        border-radius:999px;
        padding:0;
        background:rgba(255,255,255,.38);
        transition:width .18s ease, background .18s ease;
    }
    .media-lightbox__dot.is-active{
        width:18px;
        background:#fff;
    }

    .contact-section{
        margin:0;
        padding:12px 0 0;
        border-top:1px solid rgba(7,26,47,.08);
        position:relative;
    }
    .contact-title{
        margin:0 0 12px;
        color:var(--ink);
        display:flex;
        align-items:center;
        gap:8px;
        font-size:17px;
        font-weight:900;
    }
    .contact-title i{ color:var(--green); }
    .contact-btn{
        width:100%;
        min-height:50px;
        border:0;
        border-radius:9px;
        display:flex;
        align-items:center;
        justify-content:center;
        gap:10px;
        background:linear-gradient(135deg,var(--green),var(--green-dark));
        color:#fff;
        cursor:pointer;
        font-size:16px;
        font-weight:900;
        text-decoration:none;
        transition:transform .18s ease,filter .18s ease;
    }
    .contact-btn:hover{ transform:translateY(-1px); filter:saturate(1.05); }
    .contact-choice-backdrop{
        position:fixed;
        inset:0;
        z-index:120;
        padding:18px;
        display:grid;
        place-items:center;
        background:rgba(7,26,47,.38);
    }
    .contact-choice-backdrop[hidden]{ display:none; }
    .contact-choice-panel{
        position:relative;
        width:min(340px,100%);
        padding:22px 18px 18px;
        border:1px solid var(--line);
        border-radius:18px;
        background:#fff;
        box-shadow:0 20px 54px rgba(20,30,24,.2);
        direction:rtl;
    }
    .contact-choice-panel h2{
        margin:0 0 16px;
        color:var(--ink);
        font-size:18px;
        text-align:center;
    }
    .contact-choice-close{
        position:absolute;
        top:10px;
        left:10px;
        width:34px;
        height:34px;
        border:0;
        border-radius:50%;
        display:grid;
        place-items:center;
        background:var(--green-soft);
        color:var(--green);
        cursor:pointer;
    }
    .contact-choice-actions{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }
    .contact-choice-actions a,
    .contact-choice-actions button{
        min-height:72px;
        border:1px solid var(--line);
        border-radius:13px;
        background:#fff;
        color:var(--ink);
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:8px;
        text-decoration:none;
        cursor:pointer;
        font-size:14px;
        font-weight:900;
        transition:border-color .18s ease, box-shadow .18s ease;
    }
    .contact-choice-actions i{
        width:38px;
        height:38px;
        border-radius:50%;
        display:grid;
        place-items:center;
        font-size:18px;
    }
    .contact-choice-option--call i{
        background:var(--contact-call-soft);
        color:var(--contact-call);
    }
    .contact-choice-option--message i{
        background:var(--green-soft);
        color:var(--identity-blue);
    }
    .contact-choice-option--call:hover,
    .contact-choice-option--call:active{
        border-color:var(--contact-call);
        box-shadow:0 5px 16px rgba(22,101,52,.12);
    }
    .contact-choice-option--message:hover,
    .contact-choice-option--message:active{
        border-color:var(--identity-blue);
        box-shadow:0 5px 16px rgba(18,102,176,.12);
    }

    .section{
        margin-top:14px;
        padding-top:12px;
        border-top:1px solid var(--line);
    }
    .section-title{
        margin:0 0 10px;
        color:var(--ink);
        font-size:18px;
        font-weight:900;
        text-align:right;
    }
    .comments-list{ display:grid; gap:8px; }
    .comment-card{
        padding:12px;
        border:1px solid var(--line);
        border-radius:10px;
        background:#fff;
        box-shadow:var(--shadow);
    }
    .comment-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        margin-bottom:8px;
        min-width:0;
    }
    .comment-user{
        display:flex;
        align-items:center;
        gap:7px;
        min-width:0;
        color:var(--ink);
        font-size:14px;
        font-weight:900;
    }
    .comment-user i{ color:var(--green); }
    .comment-time{ color:var(--muted); font-size:12px; white-space:nowrap; }
    .comment-card p{ margin:0 0 10px; color:#222; line-height:1.8; font-size:14px; }
    .reply-btn{
        border:0;
        background:#fff;
        color:var(--green);
        display:inline-flex;
        align-items:center;
        gap:6px;
        cursor:pointer;
        font-size:12.5px;
        font-weight:900;
    }
    .empty-state{
        min-height:96px;
        border:1px dashed var(--line);
        border-radius:12px;
        display:grid;
        place-items:center;
        color:var(--muted);
        text-align:center;
        line-height:1.8;
    }

    .comment-form{
        margin-top:12px;
        display:flex;
        align-items:flex-end;
        flex-wrap:wrap;
        gap:10px;
        padding:8px;
        border:1px solid var(--line);
        border-radius:18px;
        background:#fff;
        box-shadow:var(--shadow);
    }
    .comment-form textarea{
        flex:1 1 auto;
        min-width:0;
        width:100%;
        min-height:48px;
        max-height:138px;
        border:0;
        border-radius:14px;
        background:#FFFDF8;
        color:var(--ink);
        outline:none;
        padding:12px 14px;
        font-size:16px;
        font-weight:800;
        resize:none;
        line-height:1.7;
        overflow-y:auto;
        -webkit-overflow-scrolling:touch;
    }
    .comment-form textarea:focus{
        box-shadow:inset 0 0 0 1px rgba(6,97,58,.28);
        background:#fff;
    }
    .comment-submit{
        flex:0 0 auto;
        width:48px;
        height:48px;
        border:0;
        border-radius:50%;
        background:var(--green);
        color:#fff;
        display:grid;
        place-items:center;
        cursor:pointer;
        font-size:17px;
        font-weight:900;
        box-shadow:0 10px 22px rgba(6,97,58,.18);
        transition:opacity .16s ease, transform .16s ease, background .16s ease;
    }
    .comment-submit:active{ transform:scale(.96); }
    .comment-submit:disabled{
        opacity:.42;
        cursor:not-allowed;
        box-shadow:none;
        background:#8EA28D;
        transform:none;
    }
    .comment-form.is-submitting .comment-submit{
        cursor:wait;
    }
    .comment-form .form-errors{
        flex:1 0 100%;
        order:3;
    }
    .login-required{
        padding:13px;
        border:1px solid var(--line);
        border-radius:10px;
        background:#fff;
        color:var(--muted);
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        font-size:14px;
        line-height:1.7;
    }
    .login-required a{ color:var(--green); font-weight:900; text-decoration:none; }
    .form-errors{
        padding:10px 12px;
        border-radius:10px;
        color:var(--red);
        background:#fff1f1;
        border:1px solid #fecaca;
        line-height:1.7;
        font-size:13px;
        font-weight:900;
    }

    .similar-scroll{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
        overflow:visible;
        padding:0 0 2px;
        scrollbar-width:auto;
        max-width:100%;
    }
    .similar-scroll::-webkit-scrollbar{ display:none; }
    .similar-card{
        min-width:0;
        border:1px solid var(--line);
        border-radius:11px;
        overflow:hidden;
        background:#fff;
        color:inherit;
        text-decoration:none;
        box-shadow:0 8px 18px rgba(20,30,24,.055);
        position:relative;
        transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
    }
    .similar-card:active{
        transform:scale(.985);
        border-color:rgba(18,102,176,.24);
        box-shadow:0 6px 14px rgba(20,30,24,.07);
    }
    .ad-card-image{
        width:100%;
        aspect-ratio:1 / 1;
        height:auto;
        border-radius:12px;
        overflow:hidden;
    }
    .ad-card-image__img,
    .ad-card-image img{
        width:100%;
        height:100%;
        object-fit:cover;
        display:block;
    }
    .similar-thumb{
        width:100%;
        aspect-ratio:1 / 1;
        height:auto;
        display:grid;
        place-items:center;
        background:#f6f8fb;
        color:var(--green);
        overflow:hidden;
        border-radius:12px;
    }
    .similar-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
    .similar-info{ padding:7px 9px 8px; display:block; }
    .similar-title{
        color:var(--green-deep);
        font-size:13px;
        font-weight:900;
        line-height:1.45;
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
        display:block;
    }
    .similar-card:active .similar-title,
    .similar-card.is-read .similar-title{
        color:var(--identity-blue);
    }

    .modal-backdrop{
        position:fixed;
        inset:0;
        z-index:1000;
        display:none;
        place-items:center;
        padding:18px;
        background:rgba(20,24,22,.46);
        backdrop-filter:blur(5px);
    }
    .modal-backdrop.is-open{ display:grid; }
    .soft-modal{
        width:min(100%,540px);
        max-height:min(88vh,720px);
        overflow:auto;
        border-radius:22px;
        background:#fff;
        box-shadow:var(--modal-shadow);
        padding:18px;
        position:relative;
    }
    .modal-close{
        position:absolute;
        top:12px;
        left:12px;
        width:38px;
        height:38px;
        border:1px solid var(--line);
        border-radius:50%;
        background:#fff;
        color:var(--muted);
        cursor:pointer;
    }
    .soft-modal h3{
        margin:26px 0 18px;
        text-align:center;
        color:var(--ink);
        font-size:21px;
        font-weight:900;
        line-height:1.5;
    }
    .modal-lead{
        margin:0;
        color:var(--muted);
        text-align:center;
        font-size:15px;
        font-weight:900;
        line-height:1.8;
    }
    .form-grid{ display:grid; gap:10px; }
    .report-modal textarea{
        width:100%;
        border:1px solid var(--line);
        border-radius:12px;
        background:#fff;
        color:var(--ink);
        outline:0;
        padding:12px;
        font-size:16px;
        font-weight:800;
    }
    .report-modal textarea{ min-height:150px; resize:vertical; line-height:1.8; }
    .form-errors[hidden]{ display:none; }
    .modal-submit{
        min-height:50px;
        border:0;
        border-radius:10px;
        background:var(--green);
        color:#fff;
        font-size:16px;
        font-weight:900;
        cursor:pointer;
    }
    .modal-actions{
        margin-top:16px;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:10px;
    }
    .modal-confirm,
    .modal-cancel{
        min-height:48px;
        border:0;
        border-radius:10px;
        color:#fff;
        font-size:15px;
        font-weight:900;
        cursor:pointer;
    }
    .modal-confirm{ background:var(--red); }
    .modal-cancel{ background:var(--green); }

    @media (min-width:760px){
        .page{ width:min(100%,760px); padding:calc(72px + env(safe-area-inset-top)) 18px calc(104px + env(safe-area-inset-bottom)); }
        .top-actions{ padding-right:18px; padding-left:18px; }
        .listing-info-panel{ padding:16px 16px 14px; }
        .ad-title{ font-size:27px; }
        .description{ font-size:16px; }
        .media-stack{ margin-right:-12px; margin-left:-12px; }
        .media-stage{ height:clamp(440px, 64vh, 720px); max-height:720px; }
        .similar-scroll{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
    }

    @media (max-width:390px){
        .page{ padding-right:10px; padding-left:10px; }
        .top-actions{ gap:7px; padding-right:10px; padding-left:10px; }
        .tools{ gap:18px; }
        .tool-btn{ width:44px; font-size:11.5px; }
        .tool-btn i{ font-size:24px; }
        .top-detail-tools{ gap:5px; }
        .top-detail-tools .tool-btn{ width:38px; min-width:38px; height:38px; min-height:38px; padding:0; font-size:10.5px; }
        .top-detail-tools .tool-btn i{ font-size:16px; }
        .detail-tools .tool-btn{ min-width:80px; min-height:46px; }
        .detail-tools .tool-btn i{ font-size:20px; }
        .back-link{ width:38px; height:38px; font-size:16px; }
        .detail-hero-brand{ width:38px; height:38px; padding:4px; }
        .detail-hero-brand img{ width:100%; height:100%; }
        .media-stack{ margin-right:-8px; margin-left:-8px; }
        .media-stage{ height:clamp(330px, 60vh, 560px); min-height:330px; }
        .seller-row{ gap:10px; padding:0 0 10px; border-radius:0; }
        .seller-profile-link{ gap:10px; }
        .seller-row .seller-avatar{ width:42px; height:42px; }
        .seller-name{ font-size:14px; }
        .follow-btn{ min-width:82px; min-height:38px; padding:0 9px; font-size:12px; }
        .ad-head{ gap:10px; padding:0; border-radius:0; }
        .ad-title{ font-size:22px; }
        .ad-meta-row{ align-items:center; gap:6px; }
        .ad-detail-meta{ gap:6px; font-size:11.5px; }
        .price-line{ font-size:14.5px; }
        .ad-time{ font-size:13px; margin-top:7px; }
    }