
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :root {
            --bg: #ffffff;
            --text: #1c1c1c;
            --subtext: #6e6e6e;
            --card-bg: #ffffff;
            --border: #dcdcdc;
            --border-hover: #b9b9b9;
            --accent: #2f6bff;
            --shadow: rgba(0,0,0,0.04);
            --shadow-hover: rgba(0,0,0,0.12);
            --disabled-opacity: 0.45;
        }

        body.dark-mode {
            --bg: #0f0f0f;
            --text: #e7e7e7;
            --subtext: #9d9d9d;
            --card-bg: #161616;
            --border: #2e2e2e;
            --border-hover: #444;
            --shadow: rgba(255,255,255,0.02);
            --shadow-hover: rgba(255,255,255,0.07);
            --accent: #4c8dff;
        }

        body {
            font-family: "Inter", sans-serif;
            background: var(--bg);
            color: var(--text);
            transition: background 0.35s ease, color 0.35s ease;
        }

        /* CONTAINER */
        .container {
            max-width: 980px;
            margin: 0 auto;
            padding: 40px 20px;
            text-align: center;
        }

        /* THEME TOGGLE FIXO */
		.theme-toggle-fixed {
			position: fixed !important;
			top: 20px !important;
			right: 20px !important;
		
			left: auto !important;  /* evita bug de alinhamento */
			z-index: 5000 !important;
			transform: none !important; /* remove qualquer interferência */
		}


        .theme-switch {
            width: 53px;
            height: 26px;
            position: relative;
            display: inline-block;
        }

        .theme-switch input {
            opacity: 0;
            width: 0;
            height: 0;
        }

        .slider {
            position: absolute;
            inset: 0;
            border-radius: 30px;
            background: #cfd8dc;
            cursor: pointer;
            transition: 0.28s;
        }

        body.dark-mode .slider {
            background: #37474f;
        }

        .slider:before {
            content: "";
            position: absolute;
            left: 3px;
            bottom: 3px;
            width: 20px;
            height: 20px;
            background: #fff;
            border-radius: 50%;
            transition: 0.28s;
        }

        input:checked + .slider {
            background: var(--accent);
        }

        input:checked + .slider:before {
            transform: translateX(26px);
        }

        .slider .bi {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            font-size: 15px;
            transition: 0.3s ease;
        }

        .bi-sun-fill {
            left: 6px;
/*             color: #ffeb3b; */
            color: white;
        }

        .bi-moon-fill {
            right: 6px;
/*             color: #87cefa; */
            color: white;
        }

        /* SPLASH */
        #splash {
            position: fixed;
            inset: 0;
            background: white;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 9999;
            opacity: 1;
            transition: opacity .8s ease-in-out;
        }

        #splash-logo {
            width: min(50vw, 380px);
            max-width: 480px;
            opacity: 1;
            transition: transform 1.0s ease, opacity 1.0s ease;
        }

        /* LOGO FINAL */
        header {
            margin-top: 30px;
            margin-bottom: 20px;
            display: flex;
            justify-content: center;
        }

        .logo-final {
            width: 260px;
			transition: opacity 0.8s ease;
			opacity: 0; /* aparece depois */
            margin-bottom: 20px;
            border: 10px solid white;
            border-radius: 10px;
        }

        /* SUBTÍTULO */
        .subtitle {
            font-size: 1rem;
            opacity: 0.55;
            margin-top: 10px;
            margin-bottom: 26px;
        }

        /* GRID */
        .options {
            display: grid;
            gap: 20px;
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
        }

        /* CARTÕES ULTRA ELEGANTES */
        .option {
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 22px 18px;
            background: var(--card-bg);
            border-radius: 16px;
            border: 1px solid var(--border);
            text-decoration: none;
            color: var(--text);
            transition: 0.25s ease;
            box-shadow: 0 2px 4px var(--shadow);
        }

        .option:hover {
            border-color: var(--border-hover);
            transform: translateY(-4px);
            box-shadow: 0 10px 22px var(--shadow-hover);
        }

        /* ÍCONES */
        .option-icon {
            font-size: 38px;
            color: var(--accent);
            margin-bottom: 14px;
        }

        /* TITULO */
        .option h2 {
            font-size: 1.12rem;
            font-weight: 500;
            margin-bottom: 6px;
        }

        /* DESCRIÇÃO */
        .option p {
            font-size: 0.88rem;
            color: var(--subtext);
        }

        /* DESABILITADO */
        .option.disabled {
            opacity: var(--disabled-opacity);
            pointer-events: none;
            box-shadow: none;
        }

        .option.disabled:hover {
            transform: none;
        }