@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Crimson+Text:ital,wght@0,400;0,600;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Poppins:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=Roboto+Mono:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=VT323&:wght@400;700&display=swap');

/* ============================================
   THEME 1: 1920s GANGSTER (Current)
============================================ */
:root,
[data-theme="gangster-1920s"] {
    /* ===== PRIMARY COLORS ===== */
    --theme-primary: #9E1A1A;           /* Main brand color (crimson red) */
    --theme-primary-light: #C41E3A;     /* Lighter shade for hovers */
    --theme-primary-dark: #7A1515;      /* Darker shade for depth */
    --theme-primary-glow: rgba(158, 26, 26, 0.6); /* Glow effects */
	--theme-secondary-highlight: #ffc42e;
	--theme-hover-bg: #050505;
    
    /* ===== BACKGROUND COLORS ===== */
    --bg-gradient-start: #1a1a1a;       /* Gradient starting color */
    --bg-gradient-middle: #2c1810;      /* Gradient middle color */
    --bg-gradient-end: #1a0d0d;         /* Gradient ending color */
	--bg-gradient-end-bright: #9E1A1A;  /* Gradient ending bright color */
	--bg-hero-image: url("../img/spade.png");
    
    /* ===== TEXT COLORS ===== */
    --text-primary: #e0e0e0;            /* Main text color */
    --text-secondary: #c0c0c0;          /* Secondary text (subtitles) */
    --text-muted: #808080;              /* Muted text (footer) */
    --text-light: #d0d0d0;              /* Section content text */
	--text-strong: #9E1A1A;
    
    /* ===== BORDER & OVERLAY COLORS ===== */
    --border-primary: rgba(158, 26, 26, 0.4);  /* Card borders */
	--border-seconday: rgba(255,255,255,0.12);
    --border-accent: rgba(158, 26, 26, 0.2);   /* Corner decorations */
    --overlay-dark: rgba(0, 0, 0, 0.7);        /* Card backgrounds */
    --overlay-medium: rgba(0, 0, 0, 0.5);      /* Info boxes */
    --overlay-light: rgba(0, 0, 0, 0.4);       /* Character sections */
    --overlay-banner: rgba(158, 26, 26, 0.15); /* Confidential banner */
	--hero-bg-middle: rgba(139, 69, 19, 0.1);
	--hero-bg-end: rgba(75, 0, 0, 0.1);
    
    /* ===== SHADOW COLORS ===== */
    --shadow-glow: rgba(158, 26, 26, 0.4);     /* Hover shadows */
    --shadow-intense: rgba(158, 26, 26, 0.3);  /* QR code shadows */
    
    /* ===== TYPOGRAPHY ===== */
    --font-header: 'Cinzel', serif;            /* Headers font */
    --font-body: 'Crimson Text', serif;        /* Body text font */
	--font-size: 1.1rem;
	--li-marker: '♠';
	--info-logo-img: url("../img/cover.webp");
    
    /* ===== SPACING & SIZING ===== */
    --blur-strength: 15px;                     /* Backdrop blur amount */
    --film-grain-opacity: 0.3; 
	
    /* ===== THEME LANGUAGE ===== */
    --label-doc-type: "CONFIDENTIAL DOSSIER";
    --label-file: "Case File #";
    --label-private: "For Your Eyes Only";
    --label-evidence: "Exhibit";
	--intro-section-title: "Background";
	--endeavors-section-title: "The Word on the Street";
	--pre-todo-section-title: "Grand Opening";
	--post-todo-section-title: "Before the Night Gets Hot";
	--secret-section-title: "Secrets & Dirt";
	--dealings-section-title: "Sordid Affairs";
	--suggestions-section-title: "How to Play Your Hand";

    /* ===== THEME ICONS ===== */
    --icon-doc: "♠";
    --icon-file: "🗂️";
    --icon-private: "🔒";
    --icon-evidence: "🔎";

	/* ===== CHARACTER PAGE CSS OVERRIDE ===== */
	.artifact-layer-back, 
	.artifact-layer-mid {
	  background:
		linear-gradient(135deg, rgba(238, 211, 165, .1), rgba(154, 111, 72, .2)),
		url("../img/textures/paper-warm.webp");
	  background-size: cover;
	  background-blend-mode: multiply;
	  border: 1px solid rgba(255, 235, 190, .22);
	  border-radius: 12px;
	}

	.artifact-layer-back {
	  transform: rotate(5deg) translate(20px, 13px) scale(.965);
	}

	.artifact-layer-mid {
	  transform: rotate(-3deg) translate(9px, 8px) scale(.985);
	}

	.artifact-layer-front {
	  transform: rotate(-2deg) translateY(-4px);
	  border-radius: 12px;
	  box-shadow: 0 28px 46px rgba(0,0,0,.58);
	}

}

[data-theme="sock-hop-1950s"] {
    --theme-primary: #FF1493;
    --theme-primary-light: #FF69B4;
    --theme-primary-dark: #C71585;
    --theme-primary-glow: rgba(255, 20, 147, 0.6);
	--theme-secondary-highlight: #ffc42e;
	--theme-hover-bg: linear-gradient(135deg, 
        var(--bg-gradient-start) 0%, 
        var(--bg-gradient-middle) 50%, 
        var(--bg-gradient-end) 100%);
    
    --bg-gradient-start: #0a0a0a;
    --bg-gradient-middle: #1a0820;
    --bg-gradient-end: #2d1b3d;
    --bg-gradient-end-bright: #2d1b3d;
	--bg-hero-image: url("../img/spade.png");
    
    --text-primary: #f0e6ff;
    --text-secondary: #d4b5ff;
    --text-muted: #9d7fb8;
    --text-light: #e0d0f0;
	--text-strong-old: #f0e6ff;
	--text-strong: #C71585;
    
    --border-primary: rgba(255, 20, 147, 0.4);
	--border-seconday: rgba(255,255,255,0.12);
    --border-accent: rgba(255, 105, 180, 0.3);
    --overlay-dark: rgba(20, 0, 30, 0.8);
    --overlay-medium: rgba(20, 0, 30, 0.6);
    --overlay-light: rgba(20, 0, 30, 0.5);
    --overlay-banner: rgba(255, 20, 147, 0.2);
	--hero-bg-middle: rgba(139, 69, 19, 0.1);
	--hero-bg-end: rgba(75, 0, 0, 0.1);
    
    --shadow-glow: rgba(255, 20, 147, 0.5);
    --shadow-intense: rgba(255, 105, 180, 0.4);
	
    
    --font-header: 'Abril Fatface', serif;
    --font-body: 'Poppins', serif;
	--font-size: 1.1rem;
	--li-marker: '♠';
	--info-logo-img: url("../img/cover.webp");
    
    --blur-strength: 15px;
    --film-grain-opacity: 0.3;
	
    /* ===== THEME LANGUAGE ===== */
    --label-doc-type: "DANCE CARD";
    --label-file: "Record No.";
    --label-private: "Do Not Spill";
    --label-evidence: "Clue Track";
	--intro-section-title: "Before the Hop";
	--endeavors-section-title: "The Low Down";
	--pre-todo-section-title: "Before the First Song";
	--post-todo-section-title: "Before the Last Song";
	--secret-section-title: "Rumors & Secrets";
	--dealings-section-title: "Sordid Affairs";

    /* ===== THEME ICONS ===== */
    --icon-doc: "🎟️";
    --icon-file: "💿";
    --icon-private: "🤫";
    --icon-evidence: "🎵";	
	
	/* ===== RECORD SLEEVE STACK ===== */

	.artifact-stack {
	  filter:
		drop-shadow(0 18px 26px rgba(0,0,0,.42))
		drop-shadow(0 0 14px rgba(255,105,180,.14));
	}

	.artifact-layer-back,
	.artifact-layer-mid,
	.artifact-layer-front {
	  overflow: visible;
	  border: 0;
	  background: transparent;
	  box-shadow: none;
	}

	.artifact-layer {
		max-height: 18rem;
	}

	/* Sleeve surfaces */
	.artifact-layer-back::before,
	.artifact-layer-mid::before,
	.artifact-layer-front::before {
	  content: "";
	  position: absolute;
	  inset: 0;
	  border-radius: 14px;
	  border: 2px solid rgba(255,245,220,.72);
	  box-shadow:
		0 14px 26px rgba(0,0,0,.28),
		inset 0 1px 0 rgba(255,255,255,.34);
	  z-index: 1;
	  pointer-events: none;
	}

	/* Back sleeve */
	.artifact-layer-back::before {
	  background-color: #fcf5e5;
	  background-size: 12px 12px, cover;
	}

	/* Middle sleeve */
	.artifact-layer-mid::before {
	  background-color: #FADADD;
	  background-image: linear-gradient(135deg, #FADADD 0%, #fc6c85 74%);
	  background-size: 12px 12px, cover;
	}

	/* Front sleeve */
	.artifact-layer-front::before {
	  inset: 0;
	  background:
		linear-gradient(135deg, #fff8ef, #ffd8e9);
	  z-index: 1;
	}

	/* Vinyl records */
	.artifact-layer-back::after,
	.artifact-layer-mid::after {
	  content: "";
	  position: absolute;
	  width: 108%;
	  aspect-ratio: 1;
	  border-radius: 50%;
	  right: -10%;
	  top: 0px;
	  z-index: 2;
	  background:
		radial-gradient(circle at center,
		  #f6d25e 0 7%,
		  #ff69b4 7% 11%,
		  #151515 11% 100%
		);
	  box-shadow:
		inset 0 0 0 2px rgba(255,255,255,.06),
		inset 0 0 18px rgba(255,255,255,.08),
		0 10px 18px rgba(0,0,0,.35);
	}

	/* Record grooves */
	.artifact-layer-back::after {
	  background:
		repeating-radial-gradient(circle at center,
		  transparent 0 7px,
		  rgba(255,255,255,.035) 7px 8px
		),
		radial-gradient(circle at center,
		  #f6d25e 0 7%,
		  #ff69b4 7% 11%,
		  #151515 11% 100%
		);
	}

	.artifact-layer-mid::after {
	  background:
		repeating-radial-gradient(circle at center,
		  transparent 0 7px,
		  rgba(255,255,255,.035) 7px 8px
		),
		radial-gradient(circle at center,
		  #f6d25e 0 7%,
		  #ff69b4 7% 11%,
		  #151515 11% 100%
		);
	}

	/* Stack offsets */
	.artifact-layer-back {
	  transform: rotate(7deg) translate(30px, 18px) scale(.955);
	  opacity: 1;
	}

	.artifact-layer-mid {
	  transform: rotate(-4deg) translate(13px, 10px) scale(.98);
	  opacity: 1;
	}

	.artifact-layer-front {
	  position: relative;
	  z-index: 4;
	  transform: rotate(-2deg) translateY(-4px);
	  height: 100%;
	}

	/* Actual cover image as mounted insert */
	.artifact-cover-img {
	  position: relative;
	  z-index: 3;
	  display: block;
	  width: 100%;
	  height: 100%;
	  object-fit: contain;
	  padding: 1px;
	  box-sizing: border-box;
	  border-radius: 14px;
	  background:
		linear-gradient(135deg, #fff8ef, #ffe3ef);
	  box-shadow:
		0 28px 42px rgba(0,0,0,.42),
		inset 0 0 0 10px rgba(255,214,234,.7),
		inset 0 0 0 12px rgba(255,255,255,.5);
	}
	
	/* ===== DEFAULT FONT OVERRIDE ===== */
	.section-content {
		font-size: 0.75rem;
	}
	
}

[data-theme="y2k"] {
    --theme-primary: #00FF41;
    --theme-primary-light: #39FF14;
    --theme-primary-dark: #00CC33;
    --theme-primary-glow: rgba(0, 255, 65, 0.7);
	--theme-secondary-highlight: #ffc42e;
	--theme-hover-bg: linear-gradient(135deg, 
        var(--bg-gradient-start) 0%, 
        var(--bg-gradient-middle) 50%, 
        var(--bg-gradient-end) 100%);
    
    --bg-gradient-start: #111111;
    --bg-gradient-middle: #001a00;
    --bg-gradient-end: #003300;
    --bg-gradient-end-bright: #003300;
	--bg-hero-image: url("../img/my-computer.png");
    
    --text-primary: #00FF41;
    --text-secondary: #66AA66;
    --text-muted: #006622;
    --text-light: #33FF77;
    --text-strong: #39FF14;
    
    --border-primary: rgba(0, 255, 65, 0.5);
	--border-seconday: rgba(255,255,255,0.12);
    --border-accent: rgba(0, 255, 65, 0.3);
    --overlay-dark: rgba(0, 0, 0, 0.9);
    --overlay-medium: rgba(0, 10, 0, 0.85);
    --overlay-light: rgba(0, 20, 0, 0.7);
    --overlay-banner: rgba(0, 255, 65, 0.1);
	--hero-bg-middle: rgba(19, 139, 69, 0.1);
	--hero-bg-end: rgba(0, 75, 0, 0.1);
    
    --shadow-glow: rgba(0, 255, 65, 0.6);
    --shadow-intense: rgba(0, 255, 65, 0.7);
    
    --font-header: 'Orbitron', sans-serif;
    --font-body: 'VT323', monospace;
	--font-size: 1.4rem;
	--li-marker: '⌨';
	--info-logo-img: url("../img/y2k-gen-info.webp");
    
    --blur-strength: 8px;
    --film-grain-opacity: 0.1;
	
    /* ===== THEME LANGUAGE ===== */
    --label-doc-type: "SYSTEM PROFILE";
    --label-file: "User ID:";
    --label-private: "Encrypted";
    --label-evidence: "Data Fragment";
	--intro-section-title: "Origin File";
	--endeavors-section-title: "System Overview";
	--pre-todo-section-title: "Midnight Launch";
	--post-todo-section-title: "App Launch Tasks";
	--secret-section-title: "Hidden Files";
	--dealings-section-title: "Sordid Affairs";
	--suggestions-section-title: "F1 Help Tips";

    /* ===== THEME ICONS ===== */
    --icon-doc: "🖥️";
    --icon-file: "🆔";
    --icon-private: "🔐";
    --icon-evidence: "🧬";
	
	
	.artifact-stack {
	  filter:
		drop-shadow(0 0 18px rgba(0,255,65,.34))
		drop-shadow(0 22px 28px rgba(0,0,0,.65));
	}

	.artifact-layer-back,
	.artifact-layer-mid,
	.artifact-layer-front {
	  border-radius: 0;
	  border: 2px solid #c0c0c0;

	  background:
		linear-gradient(180deg, #000080 0 22px, #c0c0c0 22px);

	  box-shadow:
		inset 2px 2px 0 #ffffff,
		inset -2px -2px 0 #404040,
		0 0 18px rgba(0,255,65,.18);
	}

	/* fake title-bar text */
	.artifact-layer-back::before,
	.artifact-layer-mid::before,
	.artifact-layer-front::before {
	  content: "CLASSIFIED.EXE";
	  position: absolute;
	  top: 3px;
	  left: 7px;
	  z-index: 4;

	  color: #fff;

	  font-family: "Roboto Mono", monospace;
	  font-size: 10px;
	  line-height: 1;
	}

	/* fake window controls */
	.artifact-layer-back::after,
	.artifact-layer-mid::after,
	.artifact-layer-front::after {
	  content: "_ □ ×";

	  position: absolute;
	  top: 2px;
	  right: 5px;
	  z-index: 4;

	  color: #000;
	  background: #c0c0c0;

	  font-family: "Roboto Mono", monospace;
	  font-size: 10px;

	  padding: 1px 3px;

	  box-shadow:
		inset 1px 1px 0 #fff,
		inset -1px -1px 0 #404040;
	}

	.artifact-layer-back {
	  transform: translate(18px, 16px) scale(.965);
	  opacity: .75;
	}

	.artifact-layer-mid {
	  transform: translate(9px, 8px) scale(.985);
	  opacity: .9;
	}

	.artifact-layer-front {
	  transform: translateY(-4px);
	  z-index: 3;
	  overflow: hidden;

	  background:
		linear-gradient(180deg, #000080 0 22px, #050505 22px);
	}

	.artifact-cover-img {
	  height: calc(100% - 22px);
	  margin-top: 22px;

	  background: #050505;

	  object-fit: contain;

	  filter:
		contrast(1.08)
		saturate(1.05);
	}

}

/* Text glitch effect for Y2K CG theme */
[data-theme="y2k"] .character-name {
    animation: glitch 3s infinite;
}

@keyframes glitch {
    0%, 90%, 100% {
        text-shadow: 0 0 30px rgba(0, 255, 65, 0.7);
    }
    92%, 96% {
        text-shadow: 
            -2px 0 rgba(0, 255, 65, 0.7),
            2px 0 rgba(0, 255, 65, 0.7),
            0 0 30px rgba(0, 255, 65, 0.9);
    }
}

[data-theme="wizard-of-oz"] {
    /* ===== PRIMARY COLORS ===== */
    --theme-primary: #50C878;           /* Vibrant emerald green */
    --theme-primary-light: #7FD89A;     /* Lighter emerald */
    --theme-primary-dark: #3DA760;      /* Darker emerald */
    --theme-primary-glow: rgba(80, 200, 120, 0.8);
	--theme-secondary-highlight: #ffc42e;
    --theme-hover-bg: rgba(80, 200, 120, 0.2);
    
    /* ===== BACKGROUND COLORS ===== */
    --bg-gradient-start: #0a1410;       /* Deep emerald black */
    --bg-gradient-middle: #1a3a28;      /* Dark emerald */
    --bg-gradient-end: #0f2a1f;         /* Rich emerald shadow */
    --bg-gradient-end-bright: #2d5a42;  /* Bright emerald end */
    --bg-hero-image: url('../img/emerald-city.png');
    
    /* ===== TEXT COLORS ===== */
    --text-primary: #9BABA8;            /* Poppy Red */
    --text-secondary: #FFD700;          /* Yellow brick gold */
    --text-muted: #81c784;              /* Muted green */
    --text-light: #c8e6c9;              /* Light mint */
    --text-strong: #D56E4B;             /* Munchkin Blue */
    
    /* ===== BORDER & OVERLAY COLORS ===== */
    --border-primary: rgba(80, 200, 120, 0.6);
	--border-seconday: rgba(255,255,255,0.12);
    --border-accent: rgba(255, 215, 0, 0.4);
    --overlay-dark: rgba(10, 30, 20, 0.9);
    --overlay-medium: rgba(15, 40, 28, 0.8);
    --overlay-light: rgba(20, 50, 35, 0.7);
    --overlay-banner: rgba(80, 200, 120, 0.2);
    
    /* ===== SHADOW COLORS ===== */
    --shadow-glow: rgba(80, 200, 120, 0.7);
    --shadow-intense: rgba(255, 220, 133, 0.8);
    
    /* ===== TYPOGRAPHY ===== */
    --font-header: 'Cinzel', serif;
    --font-body: 'Crimson Text', serif;
    --li-marker: '♦';
    
    /* ===== SPACING & SIZING ===== */
    --blur-strength: 18px;
    --film-grain-opacity: 0.2;
	
    /* ===== THEME LANGUAGE ===== */
    --label-doc-type: "EMERALD CITY DOSSIER";
    --label-file: "Scroll No.";
    --label-private: "By Order of the Wizard";
    --label-evidence: "Enchanted Clue";
	--intro-section-title: "Your Journey Begins";
	--endeavors-section-title: "What You’ve Heard";
	--pre-todo-section-title: "Before You Reach the City";
	--post-todo-section-title: "Roads To Go Down";
	--secret-section-title: "Secrets & Spells";
	--dealings-section-title: "Sordid Affairs";
	--suggestions-section-title: "Tips";

    /* ===== THEME ICONS ===== */
    --icon-doc: "🌪️";
    --icon-file: "📜";
    --icon-private: "🔮";
    --icon-evidence: "✨";
}

[data-theme="centennial-vine"] {
    /* ===== PRIMARY COLORS ===== */
    --theme-primary: #7B1E3A;           /* Main brand color (deep burgundy wine) */
    --theme-primary-light: #A83A5B;     /* Lighter shade for hovers */
    --theme-primary-dark: #4A1024;      /* Darker shade for depth */
    --theme-primary-glow: rgba(123, 30, 58, 0.45); /* Soft wine glow effects */
	--theme-secondary-highlight: #D6B56D; /* Champagne gold */
	--theme-hover-bg: #2A151A;
    
    /* ===== BACKGROUND COLORS ===== */
    --bg-gradient-start: #170D11;       /* Deep wine cellar shadow */
    --bg-gradient-middle: #2B171E;      /* Burgundy/plum depth */
    --bg-gradient-end: #3A241E;         /* Warm oak/mahogany finish */
	--bg-gradient-end-bright: #7B1E3A;  /* Bright wine accent */
	--bg-hero-image: url("../img/grapes-and-glass.png");
    
    /* ===== TEXT COLORS ===== */
    --text-primary: #F7F1E6;            /* Warm ivory main text */
    --text-secondary: #E4D4BA;          /* Champagne secondary text */
    --text-muted: #A9957A;              /* Muted cellar gold/tan */
    --text-light: #F3E8D6;              /* Section content text */
	--text-strong: #D6B56D;             /* Gold emphasis */
    
    /* ===== BORDER & OVERLAY COLORS ===== */
    --border-primary: rgba(214, 181, 109, 0.45);  /* Gold card borders */
	--border-seconday: rgba(255, 241, 220, 0.16);
    --border-accent: rgba(123, 30, 58, 0.35);     /* Wine accent decorations */
    --overlay-dark: rgba(23, 13, 17, 0.74);       /* Rich dark panels */
    --overlay-medium: rgba(58, 36, 30, 0.58);     /* Oak/burgundy info boxes */
    --overlay-light: rgba(245, 239, 226, 0.12);   /* Light vineyard wash */
    --overlay-banner: rgba(214, 181, 109, 0.16);  /* Champagne banner */
	--hero-bg-middle: rgba(123, 30, 58, 0.16);
	--hero-bg-end: rgba(74, 16, 36, 0.18);
    
    /* ===== SHADOW COLORS ===== */
    --shadow-glow: rgba(214, 181, 109, 0.28);     /* Soft gold hover shadows */
    --shadow-intense: rgba(123, 30, 58, 0.36);    /* Wine-toned QR/card shadows */
    
    /* ===== TYPOGRAPHY ===== */
    --font-header: 'Cormorant Garamond', serif;   /* Elegant wine-label headers */
    --font-body: 'Crimson Text', serif;           /* Refined readable body text */
	--font-size: 1.1rem;
	--li-marker: '🍇';
	--info-logo-img: url("../img/cv_main_image_small.jpg");
    
    /* ===== SPACING & SIZING ===== */
    --blur-strength: 18px;                        /* Softer glassy vineyard blur */
    --film-grain-opacity: 0.18;                   /* Lighter texture than noir */
	
    /* ===== THEME LANGUAGE ===== */
    --label-doc-type: "PRIVATE RESERVE FILE";
    --label-file: "Vintage No.";
    --label-private: "Cellar Confidential";
    --label-evidence: "Tasting Note";
	--intro-section-title: "Your Story";
	--endeavors-section-title: "The Buzz Around the Vineyard";
	--pre-todo-section-title: "Before the First Pour";
	--post-todo-section-title: "Post Uncorking";
	--secret-section-title: "Secrets & Scandals";
	--dealings-section-title: "Sordid Affairs";
	--suggestions-section-title: "Pairing Notes";

    /* ===== THEME ICONS ===== */
    --icon-doc: "🍷";
    --icon-file: "🏷️";
    --icon-private: "🍾";
    --icon-evidence: "📋";
}