/* home.css */

/* アイコンサイズ */
.home-icon {
    width: 80vw;
    height: 80vw;
}

@media (min-width: 768px) {
    .home-icon {
        width: 35vw;
        height: 35vw;
    }
}

/* ホーム文字のデザイン */
.home-title {
    font-family: var(--font-main);
    font-size: 9vw;
    color: white;
    text-shadow: 4px 4px 8px var(--font-color);
    text-align: left;
}

@media (min-width: 768px) {
    .home-title {
        font-size: 7vw;
        padding-right: 3vw;
    }
}

/* 切り替えボタン */
.custom-toggle-button {
    font-family: var(--font-main);
    background: linear-gradient(
        135deg,
        var(--accent-gold),
        var(--accent-green)
    );
    color: var(--font-color);
    font-size: 1.1rem;
    font-weight: bold;
    padding: 12px 32px;
    border: none;
    box-shadow: 0 4px 10px var(--shadow);
    transition: transform 0.6s ease;
}

/* 物語モーダル */
.custom-modal-content {
    background: linear-gradient(
        180deg,
        var(--white-grey),
        var(--white-grey),
        var(--accent-green),
        var(--accent-gold)
    );
    color: var(--font-color);
}