/* ==========================================
   1. THE ALBUM ART COVER FONT
   ========================================== */
@font-face {
    font-family: 'EazymemRegular';
    src: url('/Eazymem-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

.purrp-font {
    font-family: 'EazymemRegular', Verdana, sans-serif;
}

/* ==========================================
   2. GLOBAL VERDANA BASE STYLES
   ========================================== */
body {
    font-family: Verdana, Geneva, sans-serif; 
    margin: 20px;
    padding: 0;
    font-size: 11pt;
    transition: background-color 0.1s, color 0.1s; 
}

h1 { font-size: 20pt; margin-bottom: 5px; }
h2 { font-size: 16pt; margin-top: 15px; }
h3 { font-size: 13pt; font-weight: normal; margin-top: 0; margin-bottom: 15px; }

ul { list-style-type: disc; padding-left: 30px; margin-top: 10px; }
li { background-color: transparent; padding: 2px 0; margin-bottom: 5px; border: none; }
iframe { display: block; margin-top: 15px; }

/* ==========================================
   3. THE TWO THEMES (LIGHT VS DARK)
   ========================================== */

/* --- THEME A: LIGHT MODE (DEFAULT) --- */
body {
    background-color: #ffffff;
    color: #000000;
}
hr { border: 0; border-top: 1px solid #000000; margin: 20px 0; }
iframe { border: 2px solid #000000; }
a:link { color: #0000ee; text-decoration: underline; }
a:visited { color: #551a8b; }
a:hover { color: #ff0000; }

/* --- THEME B: DARK MODE ACTIVE --- */
body.dark-mode {
    background-color: #121212;
    color: #ffffff;
}
body.dark-mode hr { border-top: 1px solid #ffffff; }
body.dark-mode iframe { border: 2px solid #ffffff; }
body.dark-mode a:link { color: #8ab4f8; }
body.dark-mode a:visited { color: #c58af9; }
body.dark-mode a:hover { color: #ff4d4d; }