☰

BetterInstagram

An Instagram Modifier and Theme, You can inject it using Tampermoney or Greasemonkey.

// ==UserScript==
// @name BetterInstagram
// @namespace https://www.instagram.com/
// @include https://www.instagram.com/direct/*
// @version 1.1
// @author legend_recalls
// @grant GM_addStyle
// @license MIT
// @description An Instagram Modifier and Theme, You can inject it using Tampermoney or Greasemonkey.
// ==/UserScript==

(function() {
    'use strict';

    document.addEventListener('keydown', function(event) {
        document.querySelector('textarea').focus();
    });

    GM_addStyle(`
        /*
        /* Instagram Dark Theme v10.1*/
/* Created by frokfrdk (formerly Lexan)*/

/* Dark Scrollbar*/
::-webkit-scrollbar,
 ::-webkit-scrollbar-corner,
 ::-webkit-scrollbar,
::-webkit-scrollbar-corner {
    background: var(--bg-color) !important;
    width: 8px
  }
::-webkit-scrollbar-button,
 ::-webkit-scrollbar-button {
    display: none !important;
  }
::-webkit-scrollbar-thumb,
 ::-webkit-scrollbar-thumb {
    background: #999 !important;
    width: 8px !important;
    border-radius: 10px;
     transition: .1s !important;
  }
::-webkit-scrollbar-thumb:not(:active):hover,
 ::-webkit-scrollbar-thumb:not(:active):hover {
    background: #777 !important;
     transition: .1s !important;
  }
::-webkit-scrollbar-thumb:active,
::-webkit-scrollbar-thumb:hover:active,
 ::-webkit-scrollbar-thumb:active,
 ::-webkit-scrollbar-thumb:hover:active {
    background: #5c5c5c !important;
     transition: .1s !important;
  }

/*Variables*/
    :root {
        --bg: #000;
        --bg2: #141414;
	    --bg3: #222;
        --item: #333;
        --item-hover: #666;
        --item-active: #777;
        --text: #fff;
        --text-dark: #ddd;
        --text-dark2: #aaa;
        --none: #00000000;
        --accent: #0084ff;
        --multi-select: #1e4166;
        --ig-primary-background: 0,0,0;
        --ig-secondary-background: 0, 0, 0;
        --ig-highlight-background: 34,34,34;
        --ig-elevated-separator: 0,0,0,0;
        --ig-seperator: 0,0,0,0 !important;
        --post-separator: 0,0,0,0;
        --ig-primary-text: 255,255,255;
        --ig-secondary-button: 255,255,255;
        --ig-link: 255,255,255;
        --direct-message-max-width: 55vw;
        --ig-elevated-background: 35,35,35;
        --grey-9: 255,255,255;
        --nav-wide-width: 220px;
        --ig-banner-baclground: #141414;
        --input-border-radius: 20px !important;
    }

/*Main*/
body {
    background: var(--bg) !important;
}

input {
    background: var(--bg3) !important;
}

textarea {
    background: var(--none) !important;
}

/*Header*/
    .sp_jY02qVAhKr8.sx_98e64d,.sp_j88osDFh7lo.sx_385bf7,.sp_TNg2CZYaF1T.sx_7d646c,.sp_wTGAZ71KLpI.sx_67386d /*Instagram logo*/{
        filter: invert(1);
    }

    ._acun /*icon width*/{
        max-width: 90vw;
    }

._aawf /*search bar width*/{
    width: 35vw;
}

    ._lz6s,.Hz2lF,._acum /*Header*/{
	    backdrop-filter: blur(25px) !important;
        background-color: #000000cc !important;
        border-bottom: none !important;
    }

    ._ab6- /*UNIVERSAL ICON FIX PT2*/{
        color: #fff;
        fill: #fff;
    }

    polygon,circle,line,polyline,rect /*THE UNIVERSAL ICON FIX!!*/{
        stroke: #fff !important;
    }

._aa1g /*log out divider*/{
    background-color: var(--none);
}

/*Home*/
    ._ab6- [d="M34.6 3.1c-4.5 0-7.9 1.8-10.6 5.6-2.7-3.7-6.1-5.5-10.6-5.5C6 3.1 0 9.6 0 17.6c0 7.3 5.4 12 10.6 16.5.6.5 1.3 1.1 1.9 1.7l2.3 2c4.4 3.9 6.6 5.9 7.6 6.5.5.3 1.1.5 1.6.5s1.1-.2 1.6-.5c1-.6 2.8-2.2 7.8-6.8l2-1.8c.7-.6 1.3-1.2 2-1.7C42.7 29.6 48 25 48 17.6c0-8-6-14.5-13.4-14.5z"] /*Heart icon colour*/{
    fill: #ed4956 !important;
    }

._aahn, ._aaho{
    filter: invert(1)
}

textarea{
    background-color: var(--bg)
}

/*Sidebar*/
.xvb8j5{
    border-right: none;
}

._ad7x,._ad8j,._aa61{
    background: var(--bg3);
    border-bottom-style: none;
}

._aba8{
    border-bottom: none;
}

._aawf{
    width: 90%;
}

._aauy{
    border-radius: 20px;
}

/*Individual Post*/
    ._aatg ._aasi,._aasx,._ab0-._ab10 ._aepp,._ab0- ._aaz3 /*header*/{
        background-color: var(--bg);
        border: none;
    }

    ._aatg._aati ._aasi,._ab0-._ab10 ._aaz4 /*header border*/{
        border-left: none;
    }

    ._aatg._aati ._aasx{
        border-left: none;
    }

   ._aad7/*description*/{
        color: var(--text-dark2);
    }

._ae1h, ._ae2q /*background fix when looking at comments*/{
    background-color: var(--bg)
}

._ae3w{
    border-left: none;
}

._ae47,._ae3y{
    border-top: none;
}

a /*hashtags and links*/{
    color: var(--text)
}

    ._aatg ._aasi{
        border-bottom: none;
    }

    ._aatg ._aat0,._aatg._aati ._aaso,._aaoe,._ab0- ._aaz9{
        border-top: none;
    }
    .oajrlxb2.g5ia77u1.qu0x051f.esr5mh6w.e9989ue4.r7d6kgcz.rq0escxv.nhd2j8a9.nc684nl6.p7hjln8o.kvgmc6g5.cxmmr5t8.oygrvhab.hcukyx3x.jb3vyjys.rz4wbd8a.qt6c0cv9.a8nywdso.i1ao9s8h.esuyzwwr.f1sip0of.lzcic4wl._acan._acao._acat._acaw._a6hd, ._ac6f,._aacl._aaco._aacw._aad6._aade/*header text*/{
        color: var(--text);
    }

._ablz /*text area*/{
    color: var(--text-dark2);
}

._a9--:hover/*menu*/{
    background-color: var(--bg3);
    transition: .1s;
}

._a9_1 /*menu text*/{
    color: var(--text-dark)
}

._ab0q /*liked by profile icons*/{
    border-color: var(--bg)
}

._aasi,._aatk/*small resolution fix*/{
    background-color: var(--bg)
}

._aaqn,._aaqn:visited /*music in post*/{
    color: var(--text-dark);
}


/*Post Insights - With contributions from Alipoodle*/
div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w > div > div > div:nth-child(2) > div > div > div:nth-child(2) > div > div /* Insight notice regarding regions */{
    background: var(--bg2) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w > div > div > div:nth-child(2) > div > div > div:nth-child(2) > div > div span /* Insight notice regarding regions - Text */{
    color: var(--text) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w > div > div > div:nth-child(2) > div > div > div:nth-child(2) > div > div > div:nth-child(2) /*remove border*/{
    background: var(--bg2) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w > div > div > div:nth-child(2) > div > div > div:nth-child(2) > div > div span[style*="cursor: pointer;"] /* Learn More link */ {
    color: var(--accent) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w [data-bloks-name="ig.components.Icon"] /* Insight Icons */ {
    background-color: var(--text-dark) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w [data-bloks-name="bk.components.Text"] /* Insight Text */ {
    color: var(--text) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w > div > div > div:nth-child(2) > div > div > div:nth-child(4) > div /*remove border*/{
    background: var(--bg2) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w > div > div > div:nth-child(2) > div > div > div:nth-child(6) > div /*remove border*/{
    background: var(--bg2) !important;
}

div.rq0escxv.l9j0dhe7.du4w35lb > div > div.iqfcb0g7.tojvnm2t.a6sixzi8.k5wvi7nf.q3lfd5jv.pk4s997a.bipmatt0.cebpdrjk.qowsmv63.owwhemhu.dp1hu0rb.dhp61c6y.l9j0dhe7.iyyx5f41.a8s20v7p > div > div > div > div > div > div > div > div._ab8w._ab94._ab99._ab9f._ab9m._ab9o._ab9w [data-bloks-name="bk.components.Text"][style*="color: rgb(142, 142, 142);"] /*text hierarchy*/{
    color: var(--text-dark2) !important;
}

/*Reels*/
._aiiy{
    border: none;
}

/*Menu*/
._a9--, ._aas-{
    background-color: var(--bg2);
}

._a9--,._aas-/*menu*/{
    border-bottom: none;
    border-top: none;
}

.f0dnt3l3,.x7r02ix /*popup boxes*/{
    background-color: var(--bg2);
}

/*Direct Messages*/
._ab8j._ab8l._ab8w._ab94._ab99._ab9h._ab9k._ab9o._ab9s._abcm /*message width*/{
        max-width: 999999999px !important;
    border: none;
    }

._abyb::before{
    border-bottom: none;
}

    ._aa5b /*padding fix*/{
        padding: 0px;
    }

    ._abyb::before /*primary and general border*/{
        border-bottom: none;
    }

    ._acrb /*message box*/{
        background-color: var(--bg3)
    }

    ._aa61 /*emoji picker*/{
    background-color: var(--bg3);
    }

    ._aa62 /*emoji picker gradient*/{
        background: linear-gradient( to bottom, rgba(34, 34, 34, 0) 0%, rgb(34,34,34) 100% )
}
        ._aa5_ /*emoji picker arrow*/{
            background: var(--bg3) !important;
            border: none;
    }

   ._ac1q {
        background: var(--accent) !important;
}


/*    ._ac1q *sent messages - This is me trying to test gradients like in the mobile app, but to no success*{
        background-image: linear-gradient(to bottom, #a205bd ,#1480f7) !important;
}

*/

    ._ac1q:hover{
	    background: #1EBAFF !important;
        transition: .2s;
    }

._aacx,._aadf{
    text-shadow: 0px 0px 7px rgba(0,0,0,0.5)
}

._aadf{
    color: var(--text-dark)
}

    ._ac1r /*recieved messages*/{
        background: var(--bg3)
    }

    ._ac1r:hover{
        background: var(--item)
    }

    ._abwa /*message options*/{
        background-color: var(--bg3)
    }

    ._ac15 /*replying*/{
        border-top: none;
    }

    .qg4pu3sx /*reactions background*/{
        background-color: var(--bg2);
    }

     ._ac76 /*reactions heading*/{
        border-bottom:none;
    }

    ._ac78 /*reactions text*/{
        color: var(--text)
    }

    ._aada /*reactions body, also controls many secondary text elements*/{
        color: var(--text-dark2);
    }

    ._aacx /*New message names*/{
        color: var(--text);
    }

    ._abm4:hover /*hover item*/{
        background-color: var(--item);
        transition: .1s;
    }

    ._aag-{
        border-bottom: none;
    }

    ._aaie /*new message textbox*/{
        color: var(--text-dark2);
    }

     ._ab8p /*share names*/{
        background-color: var(--multi-select);
    }

._aaie{
    border-radius: 50px
}

    ._aa5a /*general messages*/{
        filter:invert(1);
    }

._aa4j /*header*/{
	    backdrop-filter: blur(12px) !important;
        background-color: #000000cc !important;
        border-bottom: none !important;
    }

._ab5x /*translucent fix*/{
    padding-top: 0
}

._abyc /*temp padding fix*/{
    padding-left: 20px;
}

._ab8o,._abm4:hover /*Selected account*/{
    border-radius: 20px
}

/*Create Post*/
    ._abg0 /*selected button*/{
        background: var(--item);
    }

    ._abmb /*background*/{
        background-color: var(--bg);
    }

    ._aagd /*tab text*/{
        color: var(--text);
    }

    ._aage /*tab underline*/{
        border-bottom: 1px solid #fff;
    }

    ._ac2v /*left border*/{
        border-left: none;
    }

    ._abgh,._abm8{
        border-top: none;
    }

    ._aaie._aaif._aaig._aaid._aaiq.focus-visible{
        color: var(--text-dark2) !important;
    }

.bixrwtb6,.p9wrh9lq{
    filter: invert(1);
}

._acm- /*hashtag selector*/{
    background-color: var(--item);
    border-bottom: none;
}

._acm_ {
    background-color: var(--bg3)
}

._acmx{
    border-bottom: none;
}

._acmu{
    color: var(--text)
}

._ac2y::-webkit-slider-thumb {
    background: var(--text);
}

/*sign in*/
    .sp_jY02qVAhKr8.sx_48f333 /*logo*/{
        filter:invert(1);
}

    ._ab21._ab22._ab23 /*background*/{
        background-color: var(--bg2)
}

    ._aahe:checked~._aahg::before /*check*/{
        border-bottom: 2px solid #fff;
        border-left: 2px solid #fff;
}

    ._aa5k,._aa5o/*text boxes*/{
        background: var(--bg3) !important;
        border: none;
}

    ._aa49 ._aa4b/*text colour*/{
        color: var(--text);
    }

    ._acao._acat, a._acao._acat, a._acao._acat:visited,._aa8q /*show password button*/{
        color: var(--text);
    }

._aa48 ._aa4b{
    caret-color: var(--text);
}

._ab2y, ._ab2y:hover, ._ab2y:active,._ab2y:visited{
    color: var(--accent);
}

.swB58{
    color: var(--text);
}

div._ab8w._ab94._ab99._ab9f._ab9m._ab9p._abal._abc5._abcm > div > i {
    filter:invert(1)
}

/*Logged out*/
.gr27e /*elevated boxes*/{
    background-color: var(--none);
    border: none;
}

.izU2O,.b_nGN /*text*/{
    color: var(--text-dark2)
}

._2Lks6, ._2Lks6:hover, ._2Lks6:active, ._2Lks6:visited,.KPnG0 /*links fix*/{
    color: var(--accent)
}

._2hvTZ,._9GP1n /*text inputs*/{
    background: var(--bg3);
    border: none;
    color: var(--text);
    caret-color: var(--text);
}

.yWX7d._8A5w5, a.yWX7d._8A5w5, a.yWX7d._8A5w5:visited{
    color: var(--text);
}

/*Forgot Password*/
.coreSpriteLockSmall /*lock icon*/{
    filter: invert(1);
}

.tHaIX{
    background-color: var(--bg2);
    border: none;
}

/*Explore*/
    ._aaqh /*arrow*/{
        background: var(--bg3);
    }

/*Stories*/
    ._ac0e /*background*/{
        background: var(--bg);
    }

._ac0k /*top shadow*/{
    background: linear-gradient( 180deg, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, 0) 100% )
}

._ac11 /*bottom shadow*/{
    background: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .6) 100% )
}

/*Profile*/
   ._ac2d /*post hover animation*/{
        transition: .1s !important;
    }

._aa-g{
    border-top: none;
}

._aa__ /*suggested accounts*/{
    border: none;
}

._acj1 /*suggested accounts background*/{
    background: var(--bg2)
}

._aap3 /*remove border from hover*/{
    box-shadow: none;
}

._acat, a._acat, a._acat:visited /*remove followers*/{
    color: var(--text);
}

._aacz,._aabs,._aabs:visited /*following account text*/{
    color: var(--text)
}

._acbw /*tab bottom bar*/{
    border-bottom: 1px solid var(--text);
}

._aabo /*not following hashtags circle*/{
    border: 1.5px solid var(--text)
}

._aa-r /*NO POSTSS? (megamind meme)*/{
    color: var(--text)
}

._aa-s /*decription for NO POSTSS?*/{
    color: var(--text-dark2)
}

/*Saved Posts*/
._aavc /*gradient fix*/{
    background-image: linear-gradient( to top, rgba(0, 0,0, .6), rgba(0, 0, 00, 0) )
}

._aavb{
    border: none;
}

._aav7,._aav8,._aav9,._aava /*border removal*/{
    border-top: none;
    border-right: none;
    border-left: none;
    border-bottom: none;
}

._9zlg /*no saves icon*/{
    filter: invert(1);
}

._aaic /*Create new collection text box*/{
    background: var(--item);
    border: none;
}

.x1wzhzgj{
    border-top: none;
}

/*Footer*/
select /*language selector*/{
    background-color: var(--bg);
    color: var(--text);
}

/*Settings (Legacy)*/
.PVkFi{
    background-color: var(--bg2);
}

.kHYQv{
    color: var(--text);
}

.JLJ-B{
    background-color: var(--bg3);
    border: none;
    color: var(--text-dark2);
}

.JLJ-B:focus, .p7vTm:focus, .yg1DH:focus {
    border: 2px solid #333 !important;
}

.wW1cu{
    background-color: var(--bg);
    border-right: none;
}

.sxIVS{
    color: var(--text);
}

.BvMHM{
    border: 1px solid #333;
}

.h-aRd, .h-aRd:visited, .h-aRd:hover, .h-aRd:active{
    color: var(--text);
}

.-HRM-{
    border-left-color: var(--text);
}

.fuQUr:hover{
    background-color: var(--bg3);
    transition: .1s;
}

.p7vTm{
    background-color: var(--bg3);
    border: none;
    color: var(--text-dark2);
}

.F0B8Y{
    background-color: var(--bg3);
    border: none;
    color: var(--text-dark2);
}

.AC7dP{
    color: var(--text-dark2);
}

.tlZCJ:checked~.mwD2G::before{
    border-left: 2px solid var(--text);
    border-bottom: 2px solid var(--text);
}

.RO68f{
    background-color: var(--bg3);
    border: none;
    color: var(--text);
}

.QXEMa, .kHYQv{
    color: var(--text);
}

._9MPbZ{
    color: var(--text) !important;
    border-bottom: 1px solid var(--text);
}

.PLphk{
    color: var(--text);
}

.nsKSz{
    color: var(--text);
}

.KVrxL{
    color: var(--text-dark2);
}

.SZRPf{
    color: var(--text-dark2);
}

.CcMMZ{
    color: var(--text-dark2);
}

.ufStW{
    color: var(--text);
}

.oxbtc{
    color: var(--text);
}

.JKd3m{
    color: var(--text-dark2);
}

.vlbOS{
    color: var(--text-dark2);
}

.P5eiA{
    background-color: var(--bg3);
    border: none;
    color: var(--text-dark2);
}

.coreSpriteKeyhole{
    filter: invert(1);
}

.olLwo{
    color: var(--text);
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip{
    background-color: var(--bg3);
}

.glyphsSpriteError__outline__24__grey_9{
    filter: invert(1);
}

.glyphsSpriteLocation__outline__24__grey_9, .glyphsSpriteLock__outline__24__grey_9{
    filter: invert(1);
}

.wpHm3{
    background-color: var(--bg);
}

    .UDpcu,.x-Vyw,.vdqkn,.vfoLd{
        background-color: var(--bg)
    }

    ._6zPK7 /*ewwww meta ewwwww eww ew ew ewwww ewwwwww fuck meta*/{
        background-color: var(--bg)
    }

    .UDpcu,.x-Vyw,.vdqkn,.vfoLd,.DPiy6{
        background-color: var(--bg)
    }

/*Header (Legacy)*/
._lz6s,.Hz2lF /*Header*/{
	backdrop-filter: blur(12px) !important;
    background-color: #000000cc !important;
    border-bottom: none !important;
}

.pbgfb.Di7vw,.LWmhU._0aCwM,.XTCLo,.pbgfb,.cTBqC /*Search Bar*/{
    background: var(--bg3) !important;
    border: none !important;
    border-radius: 7px !important;
}

    ._0aCwM,.QY4Ed /*search bar width*/{
        width: 600px !important;
    }

.LWmhU{
    max-width: 40vw !important;
    width: 1200px;
    min-width: 0vw !important;
}

.MWDvN{
    max-width: 90vw !important;
}

._8-yf5 /*legacy icon fix*/{
    fill: #fff !important
}


/*Add birthday popup*/
._1MP5K /*background*/{
    background-color: var(--bg)
}

.s4Iyt,.glyphsSpriteBirthday_cake /*Instagram logo and birthday cake*/{
    filter: invert(1)
}

.AHCwU, .x-Vyw, .vdqkn, .DPiy6,._1XyCr /*elevated box*/{
    background-color: var(--bg2);
    border: none;
}

.KV-D4,.m82CD,.HoLwm{
    color: var(--text)
}

.h144Z /*selection boxes*/{
    background: var(--item);
    border: none;
    color: var(--text) !important;
}

.tkIXv,.eiUFA,.aOOlW /*border removal*/{
    border-top: none;
    border-bottom: none;
}

/*Account directory*/
.GBPOY{
    background-color: var(--bg);
    border: none;
}

._7kTyW, ._7kTyW:visited{
    color: var(--text);
}

/*Account locked*/
div._0lGlC{
    color: var(--text);
}

.v2bgO{
    background-color: var(--bg2) !important;
    color: var(--text);
}

.yPuYu{
    border-top: 2px solid #fff;
}

/*Well congrats, you made it to the end, have a cookie*/
        */
    `);
})();
(function() {
    'use strict';

    // Define the emoji mappings
    const emojiMap = {
        ':sob:': '😭',
        ':joy:': '😂',
        ':skull:': '💀',
        ':heart:': '❤️',
        ':smile:': '😊',
        ':laugh:': '😂',
        ':wink:': '😉',
        ':thumbsup:': '👍',
        ':thumbsdown:': '👎',
        ':clap:': '👏',
        ':pray:': '🙏',
        ':fire:': '🔥',
        ':100:': '💯',
        ':money:': '💰',
        ':gift:': '🎁',
        ':clock:': '🕒',
        ':beer:': '🍺',
        ':pizza:': '🍕',
        ':hamburger:': '🍔',
        ':icecream:': '🍦',
        ':sunglasses:': '😎',
        ':thinking:': '🤔',
        ':sweat:': '😓',
        ':muscle:': '💪',
        ':heart_eyes:': '😍',
        ':star:': '⭐️',
        ':book:': '📚',
        ':envelope:': '✉️',
        ':phone:': '📱',
        ':computer:': '💻',
        ':globe:': '🌎',
        ':sun:': '☀️',
        ':rain:': '🌧️',
        ':snow:': '❄️',
        ':moon:': '🌙',
        ':spider:': '🕷️',
        ':snake:': '🐍',
        ':tiger:': '🐯',
        ':elephant:': '🐘',
        ':dog:': '🐶',
        ':cat:': '🐱',
        ':rabbit:': '🐰',
        ':bear:': '🐻',
        ':unicorn:': '🦄',
        ':dragon:': '🐲',
        ':octopus:': '🐙',
        ':fish:': '🐟',
        ':whale:': '🐳',
        ':penguin:': '🐧',
        ':bird:': '🐦',
        ':butterfly:': '🦋',
        ':flower:': '🌺',
        ':tree:': '🌳',
        ':mountain:': '⛰️',
        ':beach:': '🏖️',
        ':cityscape:': '🏙️',
        ':nails:': '💅',
        ':respect:':'🫡',
        ':wave:': '👋',
        ':inlove:':'🥰',
        ':heart2:':'💕',
        ':broken_heart:':'💔',
        ':kiss:':'👩‍❤️‍💋‍👨',
        ':heart_arrow:':'💘',
    };
    // Watch for keypress events on the document object
    document.addEventListener('keydown', function(event) {
        // Check if the keypress was triggered in an input element
        if (event.target.tagName === 'INPUT' || event.target.tagName === 'TEXTAREA') {
            const messageInput = event.target;

            // Replace :sob:, :joy:, and :skull: with their corresponding emojis
            Object.entries(emojiMap).forEach(([emojiStr, emoji]) => {
                messageInput.value = messageInput.value.replace(new RegExp(emojiStr, 'g'), emoji);
            });

                }
    });
})();