/* リセット・ベース設定 */
body {
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    background-color: #f7f7f7;
    margin: 0;
    color: #333333;
    -webkit-text-size-adjust: 100%;
}

.container {
    max-width: 450px;
    margin: 0 auto;
    background: #ffffff;
    min-height: 100vh;
    padding: 24px;
    box-sizing: border-box;
}

header { text-align: center; padding-bottom: 15px; }
.date-badge { background: #bf0000; color: #fff; font-size: 0.7rem; padding: 3px 12px; border-radius: 20px; font-weight: bold; margin-bottom: 15px; display: inline-block; }

/* 楽天ブランドカラー（クリムゾンレッド） */
.brand-logo { font-size: 2.6rem; font-weight: 900; color: #bf0000; letter-spacing: -0.04em; margin: 0; }
h1 { font-size: 1.1rem; color: #111111; margin-top: 5px; font-weight: bold; }

/* 報酬デザイン（1,000pt強調） */
.reward-hero {
    background: #fff0f0;
    border-radius: 16px;
    border: 1px solid #fcc;
    padding: 20px;
    margin-top: 15px;
}

.reward-hero .label { display: block; font-size: 0.8rem; font-weight: bold; color: #bf0000; margin-bottom: 5px; }
.reward-amount { color: #bf0000; margin-bottom: 3px; }
.reward-hero .amount { font-size: 3.4rem; font-weight: 900; line-height: 1; letter-spacing: -0.02em; }
.reward-hero .unit { font-size: 1.2rem; font-weight: bold; margin-left: 4px; }

.total-text { font-size: 0.8rem; margin: 5px 0 0; color: #666; font-weight: bold; }

/* カード共通 */
.card { border: 1px solid #eeb; border-radius: 16px; padding: 24px 20px; margin-bottom: 20px; background: #fff; }
.section-title { font-size: 1.05rem; font-weight: bold; margin: 0 0 10px; color: #bf0000; text-align: center; }
.small-info { font-size: 0.78rem; color: #555; margin-bottom: 20px; line-height: 1.5; text-align: center; }

/* 楽天風目立つボタン */
.rakuten-theme { 
    border: 2px solid #bf0000; 
    background: #fffdfd;
    box-shadow: 0 4px 10px rgba(191, 0, 0, 0.05);
}

.btn-rakuten {
    display: block; 
    background: #bf0000; 
    color: #fff; 
    text-decoration: none; 
    text-align: center;
    font-weight: bold; 
    padding: 18px; 
    font-size: 1.1rem;
    border-radius: 50px;
    transition: 0.2s;
    box-shadow: 0 4px 0 #8a0000;
}

.btn-rakuten:active {
    transform: translateY(2px);
    box-shadow: 0 2px 0 #8a0000;
}

/* ステップガイド */
.step-list { display: flex; flex-direction: column; gap: 10px; }
.step-item { display: flex; gap: 12px; padding: 14px; background: #fafafa; border: 1px solid #eee; border-radius: 12px; }
.step-item.destaque { background: #fff; border: 1px solid #bf0000; }
.step-num { width: 24px; height: 24px; background: #bbb; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: bold; flex-shrink: 0; }
.step-num.highlight { background: #bf0000; }
.step-content strong { font-size: 0.85rem; display: block; margin-bottom: 2px; color: #111; }
.step-content p { font-size: 0.75rem; color: #666; margin: 0; line-height: 1.4; }

footer { text-align: center; font-size: 0.7rem; color: #999; margin-top: 40px; padding-bottom: 20px; }