@import url('https://fonts.googleapis.com/css2?family=Cherry+Bomb+One&family=Fleur+De+Leah&&family=Nothing+You+Could+Do&display=swap');

body {
                background-image: url("https://file.garden/aSQ7O5-Qjze7pfjD/BeigeCheckeredBackground.jpg");
            }
            /* Scrollbar width */
            ::-webkit-scrollbar {
                width: 14px;
            }
            /* Background behind the scrollbar ( beige) */
            ::-webkit-scrollbar-track {
                background: #f3e8d8; /*  beige */
                border-radius: 10px;
            }
            /* Scrollbar thumb */
            ::-webkit-scrollbar-thumb {
                background: #e8b8c8;   /* light pink */
                border-radius: 10px;
                border: 3px solid #f3e8d8; /* makes it look roundish and pastel */
            }
            /* Hover effect (brighter pink...I think?) */
            ::-webkit-scrollbar-thumb:hover {
                background: #f0c6d3;
            }
            body {
              margin: 0;
            }
            .Page {
                width: 70%;
                height: 80%;
                border: 5px solid pink;
                border-radius: 30px;
                background-color: #fdf6e3; /* paperish color */
                position: absolute; right: 0%; bottom: 0%;
                margin: 0 auto;
                padding: 25px;

                /* Each line = 52px so that the text can fit inside the lines, like a rat :3 */
                line-height: 52px;  

                /* Background = repeated horizontal lines */
                background: repeating-linear-gradient(
                to bottom,
                #fdf6e3 0px,
                #fdf6e3 51px,
                #c8d2e0 52px
            );

                box-shadow: 0 4px 12px rgba(0,0,0,0.1);
                font-family: Nothing You Could Do;
                font-size: 40px;
                overflow-wrap: break-word;  /* breaks long words */
                word-wrap: break-word;      /* fallback */
                word-break: break-word;     /* for really long sentences */
            }
            .EntriesList {
            width: 20%;
            height: 75%;
            border: 5px solid pink;
            background: repeating-linear-gradient( 45deg, red, orange, yellow, hotpink, mediumpurple);
            border-radius: 30px;
            position: absolute; bottom: 0%; left: 0%;
            padding: 10px;
            overflow-y: auto;   /* does the inside scrolling thingy */
            overflow-x: hidden; /* optional */
            white-space: pre-wrap; /* keeps spacing similar to textarea */
            outline: none;      /* removes blue outline on focus */
            overflow-wrap: break-word;
            word-wrap: break-word;
            word-break: break-word;
            }
            #date_1-12-2025 {
                overflow: visible;
                display: none;
            }
            #date_1-12-2025:target {
                overflow: visible;
                display: block;                
            }
            #date_26-11-2025 {
                overflow: visible;
                display: none;
            }
            #date_26-11-2025:target {
                overflow: visible;
                display: block;
            }
            #date_25-11-2025 {
                display: none;
            }
            #date_25-11-2025:target {
                display: block;
            }
            .Entries {
                width: 100%; 
                height: auto;
                background-color: lightpink; 
                border: 5px solid rgba(240, 128, 128, 0.5);
                border-radius: 10px;
                border-style: inset;
                font-family: Cherry Bomb One; 
                font-size: 30px;
                overflow-wrap: break-word;  /* breaks long words */
                word-wrap: break-word;      /* fallback */
                word-break: break-word;     /* for really long sentences */
            }
            .Header {
                width: 100px; 
                height: 40px; 
                background-color: pink; 
                box-shadow: 5px 5px lightcoral;
                border-radius: 10px;
                font-family: Fleur De Leah; 
                font-size: 30px;
                color: black;
            }
            