/* =========================================================
   AL-TAFSIR — QALAM CURSOR (W10)
   Shared untuk semua surface via user_base.html.
   PNG authoritative; rotasi -18deg sesuai arahan owner.

   L07: ukuran dkecilkan signifikan — kursor hanya subtle
   brand detail, tidak mengganggu fokus desktop.
   Adaptive sizing tetap proporsional terhadap lingkungan.

   Safety: elemen hanya tampil saat skrip kursor memasang
   kelas .qalam-cursor-live (asset terkonfirmasi termuat,
   pointer presisi, motion aman).
   Tanpa JS / gagal load / touch / reduced-motion:
   tampilan tetap none — native cursor aktif.
   ========================================================= */

.qalam-cursor {

    display:
        none;
}

@media (hover: hover) and (pointer: fine) {

    html.qalam-cursor-live .qalam-cursor {

        display:
            block;

        position:
            fixed;

        top:
            0;

        left:
            0;

        /* L08: kursor selalu DI DEPAN sidebar & seluruh UI.
             Elemen ini anak langsung <body> tanpa ancestor yang
             menciptakan stacking context (tidak ada filter/
             transform pada html/body), sehingga nilai z tertinggi
             menang atas sidebar (200), header mobile (1900),
             drawer (1950), dan modal (10000+). Satu perubahan
             sadar — bukan z-index membabi buta. */

        z-index:
            2147483000;

        width:
            17px;

        height:
            auto;

        pointer-events:
            none;

        opacity:
            0;

        transition:
            opacity .3s ease;

        will-change:
            transform;
    }

    html.qalam-cursor-live .qalam-cursor img {

        width:
            100%;

        height:
            auto;

        transform:
            rotate(-18deg);

        transform-origin:
            50% 82%;

        filter:
            drop-shadow(0 2px 6px rgba(27, 26, 23, .35));
    }

    /* Pointer/layar besar: qalam tetap tenang — hanya
       sedikit lebih hadir dari default. */

    @media (any-pointer: fine) and (min-width: 1400px) {

        html.qalam-cursor-live .qalam-cursor {

            width:
                19px;
        }
    }

    /* Viewport kecil (laptop kecil): sedikit lebih kecil lagi. */

    @media (max-width: 900px) {

        html.qalam-cursor-live .qalam-cursor {

            width:
                15px;
        }
    }

    html.qalam-cursor-live.qalam-cursor-on,
    html.qalam-cursor-live.qalam-cursor-on * {

        cursor:
            none;
    }
}