/* =========================================================
   MOKSH CHECKPOINT — SYMBOL
   ========================================================= */

.garden-checkpoint {
    position: absolute;

    left: 42%;
    bottom: 34%;

    width: 28px;
    height: 28px;

    padding: 0;
    z-index: 150;

    isolation: isolate;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;
    background: transparent;

    color: rgba(210, 180, 96, 0.68);

    cursor: pointer;

    opacity: 0;

    transition:
        opacity 1.8s ease,
        transform 0.5s ease;
}

.garden.garden-awake .garden-checkpoint {
    opacity: 0.72;

    pointer-events: auto;
}

/* =========================================================
   CHECKPOINTS — HIDE WHILE READER IS OPEN
   ========================================================= */

.garden.reader-open .garden-checkpoint {
    opacity: 0 !important;
    pointer-events: none;
}

.checkpoint-symbol {
    font-size: 10px;
color: rgba(210, 180, 96, 0.72);

    text-shadow:
        0 0 5px rgba(210, 180, 96, 0.35);

    transition:
        transform 0.5s ease,
        text-shadow 0.5s ease;
}

.garden-checkpoint:hover .checkpoint-symbol {
    transform: scale(1.25);

    text-shadow:
        0 0 10px rgba(210, 180, 96, 0.65);
}
/* =========================================================
   CHECKPOINT 01 — DISCOVERY FLAG
   ========================================================= */

.checkpoint-flag {
    left: 42%;
    bottom: 34%;
}

/* =========================================================
   CHECKPOINT 02 — THE QUESTION
   ========================================================= */

.checkpoint-question {
    left: 49%;
    bottom: 70%;
}