/* ==========================================================
   member.css — 艦隊メンバー専用エリア / 究極デートプラン率計算機
   ========================================================== */

/* ===== ハンバーガーメニュー: メンバーログイン（控えめ） ===== */
.sidebar-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, #e2e8f0, transparent);
    margin: 12px 16px 8px;
    border: none;
}.sidebar-foot-block {
    margin-top: auto;
    padding: 8px 12px 16px;
}#member-login-btn,
#member-logout-btn {
    width: 100%;
    background: transparent;
    border: 1px dashed #cbd5e0;
    color: #94a3b8;
    padding: 7px 10px;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    font-family: inherit;
    letter-spacing: 0.02em;
}#member-login-btn:hover {
    color: #6c5ce7;
    border-color: #a29bfe;
    background: rgba(108, 92, 231, 0.04);
}#member-login-btn i,
#member-logout-btn i {
    font-size: 0.78rem;
    width: 14px;
    text-align: center;
    opacity: 0.7;
}#member-login-btn .ml-hint {
    font-size: 0.66rem;
    color: #cbd5e0;
    margin-left: auto;
    font-weight: 400;
}#member-logout-btn {
    color: #b8a4f0;
    border-style: solid;
    border-color: #e9e1ff;
    background: rgba(108, 92, 231, 0.03);
}#member-logout-btn:hover {
    color: #6c5ce7;
    border-color: #a29bfe;
}/* ===== メンバー専用ブロック =====
   ★ Phase 3.6 UI修正:
   ・ #member-tabs-block を flex コンテナにして .sidebar-nav と同じ
      flex-direction:column / gap:10px を適用し、
      上部メニュー (ホーム〜総戦力考察) と完全に同じ等間隔・同じボタン幅で並べる。
   ・ ボタン自体は `.tab-btn` を継承するため、padding / font-size / radius は自動で揃う。
*/
.member-block-label {
    font-size: 0.62rem;
    color: #a29bfe;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700;
    padding: 4px 20px 6px;
    margin-top: 4px;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}.member-block-label::before,
.member-block-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(162,155,254,0.35), transparent);
}.member-block-label i { font-size: 0.7rem; }/* ★ 等間隔配置のため、ブロック全体を flex 列レイアウトにし、
   親 .sidebar-nav と同じ gap:10px を適用 */
#member-tabs-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;   /* 上の「総戦力考察」との間隔を sidebar-nav の gap と一致させる */
}#member-tabs-block .member-block-label {
    margin-top: 0;      /* 上記 margin-top:10px で間隔が確保されるので二重を除去 */
    margin-bottom: 0;
}#member-tabs-block .tab-btn {
    position: relative;
    /* .tab-btn (common.css) の padding / font-size / 幅を継承するので、
       上のメニューと同じサイズ・幅・字体になる */
    width: 100%;
}#member-tabs-block .tab-btn .member-tag {
    margin-left: auto;
    background: linear-gradient(135deg, #6c5ce7, #a29bfe);
    color: #fff;
    font-size: 0.6rem;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 700;
    letter-spacing: 0.04em;
}/* ===== ログインモーダル ===== */
.member-login-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    padding: 20px;
}.member-login-overlay.show {
    opacity: 1;
    visibility: visible;
}.member-login-card {
    background: #ffffff;
    width: 100%;
    max-width: 380px;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.3);
    overflow: hidden;
    transform: scale(0.95);
    transition: transform 0.2s ease;
    position: relative;
}.member-login-overlay.show .member-login-card {
    transform: scale(1);
}.member-login-card.shake {
    animation: shakeX 0.4s ease;
}
@keyframes shakeX {0%,
100% { transform: translateX(0); }25% { transform: translateX(-8px); }50% { transform: translateX(8px); }75% { transform: translateX(-4px); }
}.member-login-head {
    /* 艦隊専用タブの active グラデーションと揃えたダークワイン色 */
    background: linear-gradient(135deg, #1a1442 0%, #2d1b4e 35%, #4a1d52 70%, #6b1d3a 100%);
    color: #fff;
    padding: 18px 20px 16px;
    position: relative;
}.member-login-head h3 {
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}.member-login-head h3 i { font-size: 0.95rem; color: #ffd1e0; }.member-login-close {
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: #fff;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
}.member-login-close:hover { background: rgba(255, 255, 255, 0.32); }.member-login-body {
    padding: 22px 20px 20px;
}.member-login-body label {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #4a5568;
    margin-bottom: 8px;
}.member-login-body input[type="password"],
.member-login-body input[type="text"] {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 1rem;
    font-family: inherit;
    background: #f8fafc;
    color: #2d3748;
    transition: all 0.2s ease;
    letter-spacing: 0.1em;
    text-align: center;
}.member-login-body input:focus {
    outline: none;
    border-color: #a29bfe;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(162, 155, 254, 0.18);
}.member-pw-err {
    color: #e74c3c;
    font-size: 0.72rem;
    margin-top: 8px;
    min-height: 1em;
    text-align: center;
    font-weight: 500;
}.member-login-foot {
    padding: 0 20px 20px;
    display: flex;
    gap: 10px;
}.member-login-foot button {
    flex: 1;
    padding: 11px 16px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
    border: none;
}.btn-pw-cancel {
    background: #f1f5f9;
    color: #64748b;
}.btn-pw-cancel:hover { background: #e2e8f0; }.btn-pw-submit {
    background: linear-gradient(135deg, #1a1442 0%, #2d1b4e 35%, #4a1d52 70%, #6b1d3a 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(26, 20, 66, 0.4);
}.btn-pw-submit:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(26, 20, 66, 0.5); }.member-login-footer-note {
    text-align: center;
    font-size: 0.66rem;
    color: #94a3b8;
    padding: 0 20px 16px;
    line-height: 1.5;
}.member-login-footer-note i {
    margin-right: 4px;
    color: #cbd5e0;
}/* ===== 旧艦隊ホームスタイル (v1.9.9 で艦隊ホームタブ削除、他で未使用のためデッドコード) ===== */
.fleet-hero {
    position: relative;
    background:
        radial-gradient(ellipse at 20% 0%, rgba(108, 92, 231, 0.18) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(253, 121, 168, 0.12) 0%, transparent 50%),
        linear-gradient(135deg, #1a1f3a 0%, #2d2752 50%, #1f1538 100%);
    color: #fff;
    border-radius: 18px;
    padding: 38px 26px 32px;
    margin-bottom: 22px;
    overflow: hidden;
}.fleet-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 15% 30%, rgba(255, 255, 255, 0.06) 1px, transparent 2px),
        radial-gradient(circle at 75% 60%, rgba(255, 255, 255, 0.05) 1px, transparent 2px),
        radial-gradient(circle at 45% 85%, rgba(255, 255, 255, 0.04) 1px, transparent 2px),
        radial-gradient(circle at 90% 15%, rgba(255, 255, 255, 0.07) 1px, transparent 2px);
    background-size: 200px 200px, 180px 180px, 220px 220px, 160px 160px;
    pointer-events: none;
}.fleet-hero-content { position: relative; z-index: 1; }.fleet-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #ffd6e7;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 100px;
    letter-spacing: 0.08em;
    margin-bottom: 14px;
    backdrop-filter: blur(8px);
}.fleet-badge i { color: #fd79a8; }.fleet-title {
    font-size: 1.7rem;
    font-weight: 800;
    margin: 0 0 6px;
    line-height: 1.25;
    letter-spacing: 0.01em;
}.fleet-title-sub {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: #fd79a8;
    margin-top: 4px;
    letter-spacing: 0.04em;
}.fleet-tagline {
    font-size: 0.78rem;
    font-weight: 600;
    color: #a29bfe;
    letter-spacing: 0.18em;
    margin-bottom: 6px;
    text-transform: uppercase;
}.fleet-desc {
    font-size: 0.85rem;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.86);
    margin: 14px 0 0;
    max-width: 640px;
}.fleet-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 22px;
}.fleet-stat-card {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 12px 10px;
    text-align: center;
    backdrop-filter: blur(8px);
}.fleet-stat-num {
    font-size: 1.3rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 2px;
}.fleet-stat-num.pink { color: #fd79a8; }.fleet-stat-num.purple { color: #a29bfe; }.fleet-stat-num.gold { color: #ffd966; }.fleet-stat-label {
    font-size: 0.68rem;
    color: rgba(255, 255, 255, 0.62);
    letter-spacing: 0.04em;
}/* メンバー専用機能カード */
.fleet-section-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: #2d3748;
    margin: 26px 0 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e9e1ff;
}.fleet-section-title i {
    color: #6c5ce7;
}.fleet-section-title .label-tag {
    margin-left: auto;
    background: linear-gradient(135deg, #6c5ce7, #a29bfe);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 4px;
    letter-spacing: 0.06em;
}.fleet-tools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}.fleet-tool-card {
    background: linear-gradient(135deg, #ffffff 0%, #fafbff 100%);
    border: 1.5px solid #e9e1ff;
    border-radius: 14px;
    padding: 18px 16px 16px;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}.fleet-tool-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #6c5ce7, #fd79a8);
}.fleet-tool-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(108, 92, 231, 0.15);
    border-color: #a29bfe;
}.fleet-tool-card .ft-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: linear-gradient(135deg, #6c5ce7, #a29bfe);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    margin-bottom: 12px;
    box-shadow: 0 4px 10px rgba(108, 92, 231, 0.25);
}.fleet-tool-card .ft-icon.pink {
    background: linear-gradient(135deg, #fd79a8, #fdcb6e);
    box-shadow: 0 4px 10px rgba(253, 121, 168, 0.25);
}.fleet-tool-card h3 {
    font-size: 0.95rem;
    font-weight: 800;
    margin: 0 0 6px;
    color: #2d3748;
}.fleet-tool-card p {
    font-size: 0.76rem;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}.fleet-tool-card .ft-tag {
    position: absolute;
    top: 12px;
    right: 12px;
    background: linear-gradient(135deg, #fd79a8, #e84393);
    color: #fff;
    font-size: 0.58rem;
    padding: 2px 7px;
    border-radius: 100px;
    font-weight: 700;
    letter-spacing: 0.04em;
}/* 未公開情報カード（雰囲気だけ） */
.fleet-secret-card {
    background:
        linear-gradient(135deg, rgba(108, 92, 231, 0.04) 0%, rgba(253, 121, 168, 0.03) 100%),
        #ffffff;
    border: 1.5px solid #e9e1ff;
    border-radius: 14px;
    padding: 18px;
    margin-bottom: 16px;
    position: relative;
}.fleet-secret-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}.fleet-secret-head .secret-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, #4a3f7a, #6c5ce7);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}.fleet-secret-head h3 {
    font-size: 0.9rem;
    font-weight: 800;
    color: #2d3748;
    margin: 0;
}.fleet-secret-head .secret-sub {
    font-size: 0.66rem;
    color: #94a3b8;
    margin-top: 2px;
}.fleet-secret-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 6px;
}.fleet-secret-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.76rem;
    color: #4a5568;
    padding: 6px 0;
    border-bottom: 1px dashed #f1f5f9;
}.fleet-secret-list li:last-child { border-bottom: none; }.fleet-secret-list li i {
    color: #a29bfe;
    font-size: 0.66rem;
    width: 14px;
}.fleet-secret-list .locked-row {
    color: #94a3b8;
    font-style: italic;
    filter: blur(0);
}.fleet-secret-list .locked-row .lock-tag {
    margin-left: auto;
    font-size: 0.64rem;
    background: #f1f5f9;
    color: #94a3b8;
    padding: 2px 7px;
    border-radius: 4px;
    font-style: normal;
}.fleet-quote {
    background: linear-gradient(135deg, #6c5ce7 0%, #5a4bd1 100%);
    color: #fff;
    border-radius: 12px;
    padding: 16px 18px;
    margin-top: 12px;
    font-size: 0.78rem;
    line-height: 1.7;
    position: relative;
    overflow: hidden;
}.fleet-quote::before {
    content: '"';
    position: absolute;
    top: -20px;
    left: 8px;
    font-size: 6rem;
    color: rgba(255, 255, 255, 0.08);
    font-weight: 900;
    line-height: 1;
}.fleet-quote .quote-author {
    display: block;
    font-size: 0.7rem;
    margin-top: 8px;
    opacity: 0.85;
    text-align: right;
}/* ============================================================
   究極デートプラン率計算機 タブ専用スタイル
   ============================================================ */
#content-date-calc,
/* ============================================================
   究極デートプラン率計算機 タブ専用スタイル
   ============================================================ */
#content-date-calc-v2 {
    /* 元のpink/yellowテイストを残しつつ、サイトのwhite背景に調和 */
}#content-date-calc .dc-container,
#content-date-calc-v2 .dc-container {
    max-width: 760px;
    margin: 0 auto;
}#content-date-calc .dc-card,
#content-date-calc-v2 .dc-card {
    background: #fff;
    border-radius: 14px;
    padding: 14px 14px 16px;
    margin-bottom: 12px;
    box-shadow: 0 2px 10px rgba(253,121,168,.08), 0 1px 2px rgba(0,0,0,.04);
    border: 1px solid #ffe1ed;
}#content-date-calc .dc-section-title,
#content-date-calc-v2 .dc-section-title {
    margin: 0 0 9px;
    font-size: 0.95rem;
    font-weight: 800;
    color: #e0599a;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 2px solid #ffd1e0;
    padding-bottom: 6px;
}#content-date-calc .dc-section-title i,
#content-date-calc-v2 .dc-section-title i { color: #fd9bc0; }.dc-hero-band {
    background: linear-gradient(135deg, #fd79a8 0%, #fdcb6e 100%);
    color: #fff;
    border-radius: 14px;
    padding: 14px 18px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 4px 14px rgba(253, 121, 168, 0.22);
}.dc-hero-band .dc-hero-icon {
    width: 38px;
    height: 38px;
    background: rgba(255, 255, 255, 0.22);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}.dc-hero-band h2 {
    font-size: 1rem;
    font-weight: 800;
    margin: 0 0 2px;
}.dc-hero-band p {
    font-size: 0.72rem;
    margin: 0;
    opacity: 0.94;
}#content-date-calc .row-block,
#content-date-calc-v2 .row-block { margin-bottom: 7px; }#content-date-calc .row-label,
#content-date-calc-v2 .row-label {
    font-size: 0.78rem;
    font-weight: 700;
    color: #9a7080;
    margin-bottom: 3px;
}#content-date-calc .slot-grid,
#content-date-calc-v2 .slot-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
}#content-date-calc .slot-empty,
#content-date-calc-v2 .slot-empty { visibility: hidden; }#content-date-calc .dc-slot,
#content-date-calc-v2 .dc-slot {
    position: relative;
    aspect-ratio: 1 / 1;
    background: #fff8fc;
    border: 2px dashed #ffb6cf;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    overflow: hidden;
    transition: transform .12s, box-shadow .12s, border-color .12s;
}#content-date-calc .dc-slot:active,
#content-date-calc-v2 .dc-slot:active { transform: scale(.97); }#content-date-calc .dc-slot.has-value,
#content-date-calc-v2 .dc-slot.has-value {
    border-style: solid;
    border-color: #fd79a8;
    background: #fff;
    box-shadow: 0 2px 6px rgba(253,121,168,.18);
}#content-date-calc .dc-slot.locked,
#content-date-calc-v2 .dc-slot.locked {
    background: repeating-linear-gradient(45deg, #f3e1eb, #f3e1eb 6px, #ebd2de 6px, #ebd2de 12px);
    border: 2px solid #d6b4c4;
    cursor: not-allowed;
    pointer-events: none;
}#content-date-calc .dc-slot.locked::after,
#content-date-calc-v2 .dc-slot.locked::after {
    content: "\f023";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 18px;
    color: #8c6c7d;
}#content-date-calc .dc-slot:not(.has-value):not(.locked)::after,
#content-date-calc-v2 .dc-slot:not(.has-value):not(.locked)::after {
    content: "+";
    font-size: 24px;
    color: #ffb6cf;
    font-weight: 700;
}#content-date-calc .slot-img,
#content-date-calc-v2 .slot-img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}#content-date-calc .slot-lv,
#content-date-calc-v2 .slot-lv {
    position: absolute;
    bottom: 2px; right: 2px;
    background: rgba(0,0,0,.72);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    padding: 1px 4px;
    border-radius: 4px;
}#content-date-calc .slot-rar,
#content-date-calc-v2 .slot-rar {
    position: absolute;
    top: 2px; left: 2px;
    background: rgba(255,255,255,.95);
    color: #e0599a;
    font-size: 8px;
    font-weight: 800;
    padding: 1px 3px;
    border-radius: 3px;
}#content-date-calc .slot-clear,
#content-date-calc-v2 .slot-clear {
    position: absolute;
    top: 2px; right: 2px;
    width: 16px; height: 16px;
    border: none;
    background: rgba(0,0,0,.6);
    color: #fff;
    border-radius: 50%;
    font-size: 9px;
    display: flex; align-items: center; justify-content: center;
    z-index: 2;
    cursor: pointer;
}#content-date-calc .opt-row,
#content-date-calc-v2 .opt-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px dashed #ffd1e0;
}#content-date-calc .opt-row:last-child,
#content-date-calc-v2 .opt-row:last-child { border-bottom: none; }#content-date-calc .opt-label,
#content-date-calc-v2 .opt-label {
    font-size: 0.82rem;
    font-weight: 700;
    color: #9a7080;
    display: flex; align-items: center; gap: 7px;
}#content-date-calc .opt-label i,
#content-date-calc-v2 .opt-label i { color: #fd9bc0; }#content-date-calc .opt-select,
#content-date-calc-v2 .opt-select {
    font-size: 0.82rem;
    font-weight: 600;
    border: 1.5px solid #ffb6cf;
    border-radius: 7px;
    padding: 5px 10px;
    background: #fff;
    color: #e0599a;
    outline: none;
    min-width: 140px;
    font-family: inherit;
}

/* === イベント効果ボーナス (アルテミシア) === */
#content-date-calc-v2 .event-bonus-row {
    flex-wrap: wrap;
    gap: 6px 10px;
}
#content-date-calc-v2 .event-bonus-tag {
    margin-left: 4px;
    font-size: 0.72rem;
    color: #c97a99;
    font-weight: 600;
}
#content-date-calc-v2 .event-bonus-status { display: flex; align-items: center; }
#content-date-calc-v2 .event-bonus-badge {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 0.78rem; font-weight: 700;
    padding: 5px 11px; border-radius: 999px;
    border: 1.5px solid #d8c4cc;
    background: #f4ebef; color: #9a7080;
    transition: all 0.18s ease;
}
#content-date-calc-v2 .event-bonus-badge i { font-size: 0.85rem; }
#content-date-calc-v2 .event-bonus-badge.active {
    border-color: #ff5a8a;
    background: linear-gradient(135deg, #ff8fb4 0%, #ff5a8a 50%, #ff3d7a 100%);
    color: #fff;
    box-shadow: 0 2px 10px rgba(255,90,138,0.45), 0 0 0 3px rgba(255,90,138,0.12);
    animation: dc2-event-pulse 1.8s ease-in-out infinite;
}
@keyframes dc2-event-pulse {
    0%, 100% { box-shadow: 0 2px 10px rgba(255,90,138,0.45), 0 0 0 3px rgba(255,90,138,0.12); }
    50%      { box-shadow: 0 2px 14px rgba(255,90,138,0.65), 0 0 0 6px rgba(255,90,138,0.18); }
}
#content-date-calc-v2 .event-bonus-note {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: linear-gradient(135deg, #fff5f9 0%, #ffe6ef 100%);
    border: 1.5px solid #ffb6cf;
    color: #8a4060;
    font-size: 0.78rem;
    line-height: 1.55;
    display: flex; align-items: flex-start; gap: 8px;
}
#content-date-calc-v2 .event-bonus-note i { color: #ff3d7a; margin-top: 2px; flex-shrink: 0; }
#content-date-calc-v2 .event-bonus-note strong { color: #d62a6a; font-weight: 700; }
#content-date-calc-v2 .event-bonus-note.hidden { display: none; }

#content-date-calc .summary-card,
#content-date-calc-v2 .summary-card { padding: 0; overflow: hidden; }#content-date-calc .collapse-head,
#content-date-calc-v2 .collapse-head {
    width: 100%;
    background: #fff;
    border: none;
    padding: 9px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: inherit;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: background .12s, border-color .12s;
}#content-date-calc .collapse-head[aria-expanded="true"],
#content-date-calc-v2 .collapse-head[aria-expanded="true"] {
    border-bottom-color: #ffd1e0;
    background: #fffafd;
}#content-date-calc .collapse-title,
#content-date-calc-v2 .collapse-title {
    font-size: 0.9rem;
    font-weight: 800;
    color: #e0599a;
    display: flex; align-items: center; gap: 8px;
}#content-date-calc .collapse-title i,
#content-date-calc-v2 .collapse-title i { color: #fd9bc0; }#content-date-calc .collapse-icon,
#content-date-calc-v2 .collapse-icon {
    width: 24px; height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, #fd79a8 0%, #fdcb6e 100%);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.74rem;
    box-shadow: 0 2px 4px rgba(253,121,168,.32);
}#content-date-calc .collapse-body,
#content-date-calc-v2 .collapse-body { padding: 14px 16px 16px; }#content-date-calc .summary-card .pending,
#content-date-calc-v2 .summary-card .pending {
    font-size: 0.82rem;
    color: #999;
    background: #fff8fc;
    border: 1px dashed #ffb6cf;
    border-radius: 8px;
    padding: 14px;
    margin: 14px;
    text-align: center;
}#content-date-calc .summary-card .pending i,
#content-date-calc-v2 .summary-card .pending i { color: #fd9bc0; margin-right: 6px; }#content-date-calc .kv-table,
#content-date-calc-v2 .kv-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}#content-date-calc .kv-table td,
#content-date-calc-v2 .kv-table td {
    padding: 7px 6px;
    border-bottom: 1px solid #ffe1ed;
}#content-date-calc .kv-table td.num,
#content-date-calc-v2 .kv-table td.num {
    text-align: right;
    font-weight: 700;
    color: #e0599a;
    font-variant-numeric: tabular-nums;
}#content-date-calc .kv-table tr.row-total td,
#content-date-calc-v2 .kv-table tr.row-total td {
    background: #fff5f8;
    font-weight: 800;
    border-bottom: none;
    border-top: 2px solid #ffb6cf;
}#content-date-calc .kv-table tr.row-total td.num,
#content-date-calc-v2 .kv-table tr.row-total td.num { color: #e0599a; font-size: 1rem; }#content-date-calc .plan-bonus-grid,
#content-date-calc-v2 .plan-bonus-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
    margin-top: 10px;
}#content-date-calc .plan-bonus-cell,
#content-date-calc-v2 .plan-bonus-cell {
    background: #fff8fc;
    border: 1px solid #ffd1e0;
    border-radius: 8px;
    padding: 7px 4px 8px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 3px;
    min-width: 0;
    overflow: hidden;
}#content-date-calc .plan-bonus-cell .pname,
#content-date-calc-v2 .plan-bonus-cell .pname {
    font-size: 0.62rem;
    font-weight: 700;
    color: #9a7080;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.15;
}#content-date-calc .plan-bonus-cell .pname i,
#content-date-calc-v2 .plan-bonus-cell .pname i {
    margin-right: 2px;
    font-size: 0.62rem;
}#content-date-calc .plan-bonus-cell .pb-extra,
#content-date-calc-v2 .plan-bonus-cell .pb-extra {
    font-size: 0.6rem;
    font-weight: 700;
    color: #b07895;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}#content-date-calc .plan-bonus-cell .pb-extra-label,
#content-date-calc-v2 .plan-bonus-cell .pb-extra-label {
    display: block;
    font-size: 0.54rem;
    font-weight: 700;
    color: #b07895;
    letter-spacing: 0.02em;
    margin-bottom: 1px;
}#content-date-calc .plan-bonus-cell .pb-extra-val,
#content-date-calc-v2 .plan-bonus-cell .pb-extra-val {
    display: block;
    font-size: 0.68rem;
    font-weight: 800;
    color: #c97aa8;
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
}#content-date-calc .plan-bonus-cell .pb-total-label,
#content-date-calc-v2 .plan-bonus-cell .pb-total-label {
    display: block;
    font-size: 0.54rem;
    font-weight: 700;
    color: #b07895;
    letter-spacing: 0.02em;
    margin-top: 3px;
    border-top: 1px dashed #ffd1e0;
    padding-top: 3px;
}#content-date-calc .plan-bonus-cell .pval,
#content-date-calc-v2 .plan-bonus-cell .pval {
    font-size: 0.78rem;
    font-weight: 900;
    color: #e0599a;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    word-break: keep-all;
    overflow-wrap: anywhere;
}#content-date-calc .plan-result-grid,
#content-date-calc-v2 .plan-result-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 5px;
}#content-date-calc .plan-result-cell,
#content-date-calc-v2 .plan-result-cell {
    background: linear-gradient(135deg, #ffeaf3 0%, #ffd6e7 100%);
    border: 1.5px solid #fd79a8;
    border-radius: 9px;
    padding: 8px 3px;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(253,121,168,.18);
    transition: transform .12s, box-shadow .12s;
    min-width: 0;
    overflow: hidden;
}#content-date-calc .plan-result-cell:active,
#content-date-calc-v2 .plan-result-cell:active { transform: scale(.96); }#content-date-calc .plan-result-cell .prc-name,
#content-date-calc-v2 .plan-result-cell .prc-name {
    font-size: 0.62rem;
    font-weight: 800;
    color: #9a7080;
    margin-bottom: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
}#content-date-calc .plan-result-cell .prc-name i,
#content-date-calc-v2 .plan-result-cell .prc-name i { font-size: 0.62rem; margin-right: 2px; }#content-date-calc .plan-result-cell .prc-val,
#content-date-calc-v2 .plan-result-cell .prc-val {
    font-size: 0.82rem;
    font-weight: 900;
    color: #e0599a;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    word-break: break-all;
    overflow-wrap: break-word;
}#content-date-calc .plan-result-cell .prc-tap,
#content-date-calc-v2 .plan-result-cell .prc-tap {
    font-size: 0.55rem;
    color: #c598ab;
    margin-top: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}#content-date-calc .plan-result-grid.gold .plan-result-cell,
#content-date-calc-v2 .plan-result-grid.gold .plan-result-cell {
    background: linear-gradient(135deg, #fff8d4 0%, #ffd966 100%);
    border-color: #f5b700;
    box-shadow: 0 2px 4px rgba(245,183,0,.22);
}#content-date-calc .plan-result-grid.gold .plan-result-cell .prc-name,
#content-date-calc-v2 .plan-result-grid.gold .plan-result-cell .prc-name { color: #a08750; }#content-date-calc .plan-result-grid.gold .plan-result-cell .prc-val,
#content-date-calc-v2 .plan-result-grid.gold .plan-result-cell .prc-val { color: #d68a3a; }#content-date-calc .plan-result-grid.gold .plan-result-cell .prc-tap,
#content-date-calc-v2 .plan-result-grid.gold .plan-result-cell .prc-tap { color: #b89860; }#content-date-calc .plan-result-cell.zero,
#content-date-calc-v2 .plan-result-cell.zero {
    background: #f7f7f7;
    border-color: #ddd;
}#content-date-calc .plan-result-cell.zero .prc-name,
#content-date-calc-v2 .plan-result-cell.zero .prc-name,
#content-date-calc .plan-result-cell.zero .prc-val,
#content-date-calc-v2 .plan-result-cell.zero .prc-val { color: #999; }#content-date-calc .gold-total-label,
#content-date-calc-v2 .gold-total-label {
    font-size: 0.82rem;
    font-weight: 700;
    color: #9a7080;
    text-align: center;
    margin: 14px 0 8px;
}#content-date-calc .gold-total-value,
#content-date-calc-v2 .gold-total-value {
    background: linear-gradient(135deg, #ffeb3b 0%, #ff9800 100%);
    color: #fff;
    font-size: 1.95rem;
    font-weight: 900;
    text-align: center;
    border-radius: 12px;
    padding: 16px 8px;
    box-shadow: 0 4px 12px rgba(255,152,0,.32);
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
}/* モーダル */
#content-date-calc .modal-overlay,
/* モーダル */
#content-date-calc-v2 .modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    /* ヘッダー(.header z-index:100) より前面に出してヘッダーを隠す */
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 12px;
    animation: fadein .15s;
}#content-date-calc .modal-overlay.hidden,
#content-date-calc-v2 .modal-overlay.hidden { display: none; }#content-date-calc .modal,
#content-date-calc-v2 .modal {
    background: #fff;
    width: 100%;
    max-width: 480px;
    max-height: calc(100vh - 32px);
    border-radius: 16px;
    display: flex; flex-direction: column;
    overflow: hidden;
    box-shadow: 0 12px 36px rgba(0,0,0,.32);
}#content-date-calc .modal-header,
#content-date-calc-v2 .modal-header {
    background: linear-gradient(135deg, #fd79a8 0%, #fdcb6e 100%);
    color: #fff;
    padding: 12px 14px;
    display: flex; align-items: center; justify-content: space-between;
    font-weight: 800;
    font-size: 0.9rem;
}#content-date-calc .modal-close,
#content-date-calc-v2 .modal-close {
    background: rgba(255,255,255,.22);
    border: none; color: #fff;
    width: 28px; height: 28px; border-radius: 50%;
    font-size: 0.82rem;
    cursor: pointer;
}#content-date-calc .modal-body,
#content-date-calc-v2 .modal-body {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
}#content-date-calc .modal-body.hidden,
#content-date-calc-v2 .modal-body.hidden { display: none; }#content-date-calc .filter-bar,
#content-date-calc-v2 .filter-bar {
    display: flex;
    gap: 6px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}#content-date-calc .filter-chip,
#content-date-calc-v2 .filter-chip {
    padding: 4px 12px;
    border-radius: 999px;
    border: 1.2px solid #ffb6cf;
    background: #fff;
    color: #e0599a;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
    font-family: inherit;
}#content-date-calc .filter-chip.active,
#content-date-calc-v2 .filter-chip.active {
    background: #fd79a8; color: #fff; border-color: #fd79a8;
}#content-date-calc .grid-list,
#content-date-calc-v2 .grid-list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
}
@media (min-width: 480px) {#content-date-calc .grid-list,
#content-date-calc-v2 .grid-list { grid-template-columns: repeat(6, 1fr); }
}#content-date-calc .grid-item,
#content-date-calc-v2 .grid-item {
    position: relative;
    aspect-ratio: 1 / 1;
    border-radius: 6px;
    overflow: hidden;
    border: 1.5px solid #ffe1ed;
    background: #fff8fc;
    cursor: pointer;
}#content-date-calc .grid-item img,
#content-date-calc-v2 .grid-item img {
    width: 100%; height: 100%; object-fit: cover;
}#content-date-calc .grid-item .gi-name,
#content-date-calc-v2 .grid-item .gi-name {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    background: linear-gradient(0deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,0) 100%);
    color: #fff;
    font-size: 0.58rem;
    font-weight: 600;
    padding: 8px 3px 3px;
    text-align: center;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}#content-date-calc .grid-item .gi-rar,
#content-date-calc-v2 .grid-item .gi-rar {
    position: absolute; top: 1px; left: 1px;
    background: rgba(255,255,255,.95);
    color: #e0599a;
    font-size: 0.58rem; font-weight: 800;
    padding: 0 4px;
    border-radius: 3px;
}#content-date-calc .grid-item.disabled,
#content-date-calc-v2 .grid-item.disabled { opacity: .35; pointer-events: none; }#content-date-calc .lv-pick-header,
#content-date-calc-v2 .lv-pick-header {
    display: flex; align-items: center; gap: 12px;
    padding: 8px 4px 12px;
    border-bottom: 1px solid #ffe1ed;
    margin-bottom: 12px;
}#content-date-calc .lv-pick-header img,
#content-date-calc-v2 .lv-pick-header img {
    width: 56px; height: 56px;
    border-radius: 8px;
    object-fit: cover;
    border: 2px solid #fd79a8;
}#content-date-calc .lv-pick-name,
#content-date-calc-v2 .lv-pick-name { font-weight: 800; font-size: 0.9rem; color: #9a7080; }#content-date-calc .lv-pick-sub,
#content-date-calc-v2 .lv-pick-sub { font-size: 0.7rem; color: #aaa; margin-top: 2px; }#content-date-calc .level-grid,
#content-date-calc-v2 .level-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
}#content-date-calc .lv-btn,
#content-date-calc-v2 .lv-btn {
    padding: 9px 4px;
    background: #fff8fc;
    border: 1.8px solid #ffb6cf;
    border-radius: 7px;
    font-weight: 700;
    font-size: 0.82rem;
    color: #e0599a;
    cursor: pointer;
    font-family: inherit;
}
#content-date-calc .lv-slider-wrap,
#content-date-calc-v2 .lv-slider-wrap { padding: 18px 8px 6px; }
#content-date-calc .lv-big,
#content-date-calc-v2 .lv-big { text-align: center; font-size: 2.1rem; font-weight: 900; color: #e0599a; margin-bottom: 18px; letter-spacing: .02em; }
#content-date-calc .lv-slider-wrap input[type=range],
#content-date-calc-v2 .lv-slider-wrap input[type=range] { width: 100%; height: 10px; -webkit-appearance: none; appearance: none; background: linear-gradient(90deg, #ffd1e0, #fd79a8); border-radius: 999px; outline: none; cursor: pointer; }
#content-date-calc .lv-slider-wrap input[type=range]::-webkit-slider-thumb,
#content-date-calc-v2 .lv-slider-wrap input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 30px; height: 30px; border-radius: 50%; background: #fff; border: 3px solid #fd79a8; box-shadow: 0 2px 6px rgba(253,121,168,.4); cursor: pointer; }
#content-date-calc .lv-slider-wrap input[type=range]::-moz-range-thumb,
#content-date-calc-v2 .lv-slider-wrap input[type=range]::-moz-range-thumb { width: 30px; height: 30px; border-radius: 50%; background: #fff; border: 3px solid #fd79a8; cursor: pointer; }
#content-date-calc .lv-range-labels,
#content-date-calc-v2 .lv-range-labels { display: flex; justify-content: space-between; font-size: .7rem; color: #b89aa8; font-weight: 600; margin-top: 10px; padding: 0 2px; }
#content-date-calc .lv-btn:active,
#content-date-calc-v2 .lv-btn:active { transform: scale(.96); }#content-date-calc .lv-btn.lv-100,
#content-date-calc-v2 .lv-btn.lv-100 {
    background: linear-gradient(135deg, #fff8d4 0%, #ffd966 100%);
    border-color: #f5b700;
    color: #d68a3a;
}#content-date-calc .item-main-info,
#content-date-calc-v2 .item-main-info {
    background: #fff8fc;
    border: 1px solid #ffd1e0;
    border-radius: 8px;
    padding: 9px 11px;
    font-size: 0.78rem;
    color: #9a7080;
    margin-bottom: 12px;
}#content-date-calc .item-main-info .imi-h,
#content-date-calc-v2 .item-main-info .imi-h { font-weight: 800; color: #e0599a; margin-bottom: 6px; }#content-date-calc .item-sub-list,
#content-date-calc-v2 .item-sub-list { display: flex; flex-direction: column; gap: 7px; }#content-date-calc .item-sub-row,
#content-date-calc-v2 .item-sub-row {
    display: grid;
    grid-template-columns: 1fr 90px;
    gap: 6px;
    align-items: center;
}#content-date-calc .item-sub-row select,
#content-date-calc-v2 .item-sub-row select {
    font-size: 0.78rem;
    padding: 6px 8px;
    border: 1.5px solid #ffb6cf;
    border-radius: 6px;
    background: #fff;
    color: #9a7080;
    font-family: inherit;
}#content-date-calc .item-sub-row input,
#content-date-calc-v2 .item-sub-row input {
    font-size: 0.78rem;
    padding: 6px 8px;
    border: 1.5px solid #ffb6cf;
    border-radius: 6px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: #e0599a;
    font-family: inherit;
}#content-date-calc-v2 .item-sub-row select.sub-val-sel {
    text-align: right;
    font-weight: 800;
    color: #e0599a;
    font-variant-numeric: tabular-nums;
}#content-date-calc-v2 .item-sub-row select.sub-val-sel:disabled {
    background: #f7f3f5;
    color: #b9a4ae;
    cursor: not-allowed;
    border-color: #e7d6df;
}#content-date-calc .modal-foot,
#content-date-calc-v2 .modal-foot {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #ffe1ed;
    display: flex; justify-content: center;
}#content-date-calc .btn-primary,
#content-date-calc-v2 .btn-primary {
    background: linear-gradient(135deg, #fd79a8 0%, #fdcb6e 100%);
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 10px 28px;
    font-size: 0.88rem;
    font-weight: 800;
    box-shadow: 0 4px 10px rgba(253,121,168,.32);
    cursor: pointer;
    font-family: inherit;
}/* 詳細モーダル */
#content-date-calc .detail-modal,
/* 詳細モーダル */
#content-date-calc-v2 .detail-modal { max-width: 460px; }#content-date-calc .detail-modal .modal-header.gold,
#content-date-calc-v2 .detail-modal .modal-header.gold {
    background: linear-gradient(135deg, #fff3a8 0%, #ffb74d 100%);
    color: #a08750;
}#content-date-calc .detail-modal .modal-header.gold .modal-close,
#content-date-calc-v2 .detail-modal .modal-header.gold .modal-close {
    background: rgba(255,255,255,.55); color: #a08750;
}#content-date-calc .dt-section,
#content-date-calc-v2 .dt-section { margin-bottom: 14px; }#content-date-calc .dt-section:last-child,
#content-date-calc-v2 .dt-section:last-child { margin-bottom: 0; }#content-date-calc .dt-h,
#content-date-calc-v2 .dt-h {
    font-size: 0.82rem;
    font-weight: 800;
    color: #e0599a;
    margin-bottom: 7px;
    display: flex; align-items: center; gap: 7px;
    border-bottom: 1.5px solid #ffd1e0;
    padding-bottom: 4px;
}#content-date-calc .dt-result,
#content-date-calc-v2 .dt-result {
    background: linear-gradient(135deg, #ffeaf3 0%, #ffd6e7 100%);
    border: 1.5px solid #fd79a8;
    border-radius: 10px;
    padding: 12px 10px;
    text-align: center;
    margin-bottom: 14px;
}#content-date-calc .dt-result.gold,
#content-date-calc-v2 .dt-result.gold {
    background: linear-gradient(135deg, #fff8d4 0%, #ffd966 100%);
    border-color: #f5b700;
}#content-date-calc .dt-result .dr-lab,
#content-date-calc-v2 .dt-result .dr-lab {
    font-size: 0.74rem;
    font-weight: 700;
    color: #9a7080;
    margin-bottom: 5px;
}#content-date-calc .dt-result.gold .dr-lab,
#content-date-calc-v2 .dt-result.gold .dr-lab { color: #a08750; }#content-date-calc .dt-result .dr-val,
#content-date-calc-v2 .dt-result .dr-val {
    font-size: 1.5rem;
    font-weight: 900;
    color: #e0599a;
    font-variant-numeric: tabular-nums;
}#content-date-calc .dt-result.gold .dr-val,
#content-date-calc-v2 .dt-result.gold .dr-val { color: #d68a3a; }#content-date-calc .dt-table,
#content-date-calc-v2 .dt-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}#content-date-calc .dt-table td,
#content-date-calc-v2 .dt-table td {
    padding: 6px 7px;
    border-bottom: 1px solid #ffe1ed;
}#content-date-calc .dt-table td.num,
#content-date-calc-v2 .dt-table td.num {
    text-align: right;
    font-weight: 700;
    color: #e0599a;
    font-variant-numeric: tabular-nums;
}#content-date-calc .dt-table tr.dt-total td,
#content-date-calc-v2 .dt-table tr.dt-total td {
    background: #fff5f8;
    font-weight: 800;
    border-top: 1.5px solid #ffb6cf;
    border-bottom: none;
}#content-date-calc .dt-card-grid,
#content-date-calc-v2 .dt-card-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 5px;
    margin-bottom: 10px;
}#content-date-calc .dt-card-cell,
#content-date-calc-v2 .dt-card-cell {
    background: #fff;
    border: 1px solid #ffe1ed;
    border-radius: 6px;
    padding: 5px 3px;
    text-align: center;
}#content-date-calc .dt-card-cell .lab,
#content-date-calc-v2 .dt-card-cell .lab { color: #999; font-size: 0.6rem; }#content-date-calc .dt-card-cell .vv,
#content-date-calc-v2 .dt-card-cell .vv { font-weight: 700; color: #9a7080; font-size: 0.82rem; }#content-date-calc .dt-card-cell.gold,
#content-date-calc-v2 .dt-card-cell.gold {
    background: linear-gradient(135deg, #fff8d4 0%, #ffe57a 100%);
    border-color: #f5b700;
}#content-date-calc .dt-card-cell.gold .lab,
#content-date-calc-v2 .dt-card-cell.gold .lab { color: #a08750; }#content-date-calc .dt-card-cell.gold .vv,
#content-date-calc-v2 .dt-card-cell.gold .vv { color: #d68a3a; }#content-date-calc .dt-prob-list,
#content-date-calc-v2 .dt-prob-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    font-size: 0.78rem;
}#content-date-calc .dt-prob-row,
#content-date-calc-v2 .dt-prob-row {
    display: flex; justify-content: space-between;
    padding: 5px 8px;
    border-radius: 6px;
    background: #fff;
    border: 1px solid #ffe1ed;
}#content-date-calc .dt-prob-row.gold,
#content-date-calc-v2 .dt-prob-row.gold {
    grid-column: span 2;
    background: linear-gradient(135deg, #fff8d4 0%, #ffe57a 100%);
    border: 1.5px solid #f5b700;
    font-weight: 800;
    font-size: 0.92rem;
    padding: 7px 9px;
}#content-date-calc .dt-prob-row.gold .v,
#content-date-calc-v2 .dt-prob-row.gold .v { color: #d68a3a; }#content-date-calc .dt-warn,
#content-date-calc-v2 .dt-warn {
    color: #e57373;
    font-size: 0.72rem;
    font-weight: 700;
    margin-top: 5px;
    text-align: center;
}#content-date-calc .dt-empty,
#content-date-calc-v2 .dt-empty {
    font-size: 0.74rem;
    color: #999;
    text-align: center;
    padding: 10px;
}/* デートリンク */
#content-date-calc .datelink-grid,
/* デートリンク */
#content-date-calc-v2 .datelink-grid {
    display: flex;
    flex-direction: column;
    gap: 9px;
}#content-date-calc .datelink-cell,
#content-date-calc-v2 .datelink-cell {
    background: linear-gradient(135deg, #fff5fb 0%, #fde9f3 100%);
    border: 1.5px solid #fdb6d4;
    border-radius: 12px;
    padding: 11px 13px;
    cursor: pointer;
    position: relative;
}#content-date-calc .datelink-cell:active,
#content-date-calc-v2 .datelink-cell:active {
    transform: scale(0.98);
    box-shadow: 0 1px 3px rgba(253,121,168,.15);
}#content-date-calc .dl-head,
#content-date-calc-v2 .dl-head {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 0.74rem;
    font-weight: 700;
    color: #e0599a;
    margin-bottom: 7px;
}#content-date-calc .dl-head i.fa-link,
#content-date-calc-v2 .dl-head i.fa-link { font-size: 0.82rem; }#content-date-calc .dl-head .dl-title,
#content-date-calc-v2 .dl-head .dl-title { letter-spacing: .04em; }#content-date-calc .dl-head .dl-lv,
#content-date-calc-v2 .dl-head .dl-lv {
    margin-left: auto;
    font-size: 0.7rem;
    background: #fff;
    border: 1px solid #fdb6d4;
    color: #e0599a;
    padding: 2px 8px;
    border-radius: 8px;
    font-weight: 800;
}#content-date-calc .dl-members,
#content-date-calc-v2 .dl-members {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    margin-bottom: 7px;
    font-size: 0.82rem;
    font-weight: 700;
    color: #5a5a5a;
}#content-date-calc .dl-mem,
#content-date-calc-v2 .dl-mem {
    background: #fff;
    border: 1px solid #ffd0e2;
    padding: 2px 9px 2px 4px;
    border-radius: 999px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    line-height: 1.2;
    max-width: 100%;
}#content-date-calc .dl-mem .dl-mem-ico,
#content-date-calc-v2 .dl-mem .dl-mem-ico {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid #ffd0e2;
    background: #fff;
}#content-date-calc .dl-mem.big .dl-mem-ico,
#content-date-calc-v2 .dl-mem.big .dl-mem-ico {
    width: 28px;
    height: 28px;
    border-width: 1.5px;
}#content-date-calc .dl-mem .dl-mem-name,
#content-date-calc-v2 .dl-mem .dl-mem-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}#content-date-calc .dl-mem-row-ico,
#content-date-calc-v2 .dl-mem-row-ico {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid rgba(0,0,0,.08);
    background: #fff;
}#content-date-calc .dl-mem-row .dl-mem-row-name,
#content-date-calc-v2 .dl-mem-row .dl-mem-row-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}#content-date-calc .dl-x,
#content-date-calc-v2 .dl-x { color: #f06292; font-weight: 800; padding: 0 1px; }#content-date-calc .dl-effects,
#content-date-calc-v2 .dl-effects {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 5px;
}#content-date-calc .dl-eff-chip,
#content-date-calc-v2 .dl-eff-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #fff;
    border: 1px solid #f8a5c2;
    color: #d06b9a;
    font-size: 0.74rem;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 999px;
}#content-date-calc .dl-eff-chip.global,
#content-date-calc-v2 .dl-eff-chip.global {
    background: linear-gradient(135deg,#ffd54f,#ffb300);
    color: #806020;
    border-color: #ffb300;
}#content-date-calc .dl-tap,
#content-date-calc-v2 .dl-tap {
    font-size: 0.6rem;
    color: #aaa;
    text-align: right;
}#content-date-calc .dl-detail-members,
#content-date-calc-v2 .dl-detail-members {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin-top: 6px;
}#content-date-calc .dl-mem.big,
#content-date-calc-v2 .dl-mem.big { font-size: 0.86rem; padding: 3px 11px; }#content-date-calc .dl-x.big,
#content-date-calc-v2 .dl-x.big { font-size: 0.92rem; }#content-date-calc .dl-mem-list,
#content-date-calc-v2 .dl-mem-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}#content-date-calc .dl-mem-row,
#content-date-calc-v2 .dl-mem-row {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 0.78rem;
    padding: 5px 9px;
    border-radius: 6px;
}#content-date-calc .dl-mem-row.on,
#content-date-calc-v2 .dl-mem-row.on { background: #e8f5e9; color: #4a8050; font-weight: 700; }#content-date-calc .dl-mem-row.off,
#content-date-calc-v2 .dl-mem-row.off { background: #f5f5f5; color: #aaa; }#content-date-calc .dl-mem-row.on  i,
#content-date-calc-v2 .dl-mem-row.on  i { color: #6ba572; }#content-date-calc .dl-mem-row.off i,
#content-date-calc-v2 .dl-mem-row.off i { color: #ccc; }#content-date-calc .hidden,
#content-date-calc-v2 .hidden { display: none !important; }

@media (max-width: 480px) {#content-date-calc .plan-bonus-grid,
#content-date-calc-v2 .plan-bonus-grid { gap: 4px; }#content-date-calc .plan-bonus-cell,
#content-date-calc-v2 .plan-bonus-cell { padding: 6px 3px 7px; }#content-date-calc .plan-bonus-cell .pname,
#content-date-calc-v2 .plan-bonus-cell .pname { font-size: 0.56rem; }#content-date-calc .plan-bonus-cell .pname i,
#content-date-calc-v2 .plan-bonus-cell .pname i { font-size: 0.56rem; }#content-date-calc .plan-bonus-cell .pb-extra-label,
#content-date-calc-v2 .plan-bonus-cell .pb-extra-label,
#content-date-calc .plan-bonus-cell .pb-total-label,
#content-date-calc-v2 .plan-bonus-cell .pb-total-label { font-size: 0.5rem; }#content-date-calc .plan-bonus-cell .pb-extra-val,
#content-date-calc-v2 .plan-bonus-cell .pb-extra-val { font-size: 0.64rem; }#content-date-calc .plan-bonus-cell .pval,
#content-date-calc-v2 .plan-bonus-cell .pval { font-size: 0.7rem; }#content-date-calc .plan-result-grid,
#content-date-calc-v2 .plan-result-grid { gap: 4px; }#content-date-calc .plan-result-cell,
#content-date-calc-v2 .plan-result-cell { padding: 6px 2px; border-radius: 7px; }#content-date-calc .plan-result-cell .prc-val,
#content-date-calc-v2 .plan-result-cell .prc-val { font-size: 0.74rem; }#content-date-calc .plan-result-cell .prc-name,
#content-date-calc-v2 .plan-result-cell .prc-name { font-size: 0.55rem; margin-bottom: 4px; }#content-date-calc .filter-chip,
#content-date-calc-v2 .filter-chip { font-size: 0.66rem; padding: 3px 9px; }.fleet-stats { grid-template-columns: repeat(3, 1fr); gap: 6px; }.fleet-stat-num { font-size: 1.05rem; }.fleet-title { font-size: 1.4rem; }.fleet-hero { padding: 28px 20px 24px; }
}/* ===== 艦隊専用タブ: 特別感のある暗めグラデ（active時） =====
   通常メニューは primary(#6c5ce7) → accent(#fd79a8) のグラデーションだが、
   艦隊専用ブロックだけは特別感を出すため、より暗い深紫〜ワイン系のグラデーションへ上書きする。 */
#member-tabs-block .tab-btn.active {
    background: linear-gradient(135deg, #1a1442 0%, #2d1b4e 35%, #4a1d52 70%, #6b1d3a 100%);
    color: #fff;
    box-shadow:
        0 4px 14px rgba(26, 20, 66, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.06);
}#member-tabs-block .tab-btn.active i {
    color: #ffd1e0;
    text-shadow: 0 0 6px rgba(255, 209, 224, 0.4);
}#member-tabs-block .tab-btn:hover:not(.active) {
    background: rgba(45, 27, 78, 0.08);
}/* 艦隊メンバーログイン中: 通常メニュー (.sidebar-nav 直下のホーム〜総戦力考察)
   は今までどおり pink/purple のグラデのまま (上書きしない) */

/* ============================================================
 * v3.2 改修: 艦隊専用ツールカード モバイルレイアウト改善
 *   - スマートフォン表示時、アイコンを左に配置 + テキスト右
 *   - カード幅を狭くして縦に並ぶ高さを縮小
 * ============================================================ */
@media (max-width: 768px) {
  .fleet-tools-grid {
    grid-template-columns: 1fr;
    gap: 8px;
    margin-bottom: 18px;
  }
  .fleet-tool-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 10px 14px 10px 12px;
    min-height: 0;
  }
  .fleet-tool-card .ft-icon {
    width: 38px;
    height: 38px;
    margin-bottom: 0;
    font-size: 0.95rem;
    flex-shrink: 0;
    border-radius: 9px;
  }
  .fleet-tool-card h3 {
    font-size: 0.9rem;
    margin: 0;
    flex: 1;
    line-height: 1.25;
    word-break: break-word;
  }
  .fleet-tool-card .ft-tag {
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 0.55rem;
    padding: 2px 6px;
  }
}

/* ============================================================
   v2 究極デート率計算機 専用追加スタイル
   ============================================================ */
#content-date-calc-v2 .dc2-note {
    font-size: 0.75rem;
    color: #6b6b6b;
    margin: 0 0 12px;
    line-height: 1.55;
}

#content-date-calc-v2 .dc2-plans-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

#content-date-calc-v2 .dc2-plan-card {
    border: 1px solid #ffd1e0;
    border-radius: 12px;
    background: linear-gradient(135deg, #fff8fc 0%, #fffefe 100%);
    padding: 12px 12px 14px;
}
#content-date-calc-v2 .dc2-plan-card .pc-head {
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px dashed #ffcce0;
    padding-bottom: 8px;
    margin-bottom: 10px;
}
#content-date-calc-v2 .dc2-plan-card .pc-head .pc-icon {
    width: 28px; height: 28px;
    border-radius: 8px;
    background: #fd79a8;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.85rem;
}
#content-date-calc-v2 .dc2-plan-card .pc-head .pc-name {
    font-weight: 800;
    color: #b94c84;
    font-size: 0.95rem;
}
#content-date-calc-v2 .dc2-plan-card .pc-head .pc-bonus {
    margin-left: auto;
    font-size: 0.72rem;
    color: #888;
    background: #fff;
    padding: 3px 8px;
    border-radius: 6px;
    border: 1px solid #eee;
}
#content-date-calc-v2 .dc2-plan-card .pc-head .pc-bonus b {
    color: #e0599a;
}

#content-date-calc-v2 .dc2-color-row {
    display: grid;
    grid-template-columns: 92px 60px 1fr 1fr;
    gap: 6px;
    align-items: center;
    padding: 6px 4px;
    border-bottom: 1px dotted #f3d8e3;
    font-size: 0.78rem;
}
#content-date-calc-v2 .dc2-color-row:last-child { border-bottom: none; }
#content-date-calc-v2 .dc2-color-row .cr-label {
    font-weight: 700;
    display: flex; align-items: center; gap: 6px;
}
#content-date-calc-v2 .dc2-color-row .cr-swatch {
    width: 14px; height: 14px;
    border-radius: 4px;
    display: inline-block;
    border: 1px solid rgba(0,0,0,.12);
}
#content-date-calc-v2 .dc2-color-row .cr-count {
    text-align: right;
    color: #444;
    font-variant-numeric: tabular-nums;
}
#content-date-calc-v2 .dc2-color-row .cr-count b {
    color: #b94c84;
    font-size: 1rem;
}
#content-date-calc-v2 .dc2-color-row .cr-rate {
    text-align: right;
    color: #555;
    font-variant-numeric: tabular-nums;
    font-size: 0.74rem;
}
#content-date-calc-v2 .dc2-color-row .cr-rate b {
    color: #c2185b;
    font-size: 0.85rem;
}
#content-date-calc-v2 .dc2-color-row .cr-prob {
    text-align: right;
    color: #333;
    font-variant-numeric: tabular-nums;
    font-size: 0.78rem;
}
#content-date-calc-v2 .dc2-color-row .cr-prob b {
    color: #2962ff;
    font-size: 0.92rem;
}
#content-date-calc-v2 .dc2-color-row.gold-row {
    background: linear-gradient(90deg, #fff8e1 0%, #ffe082 100%);
    border-radius: 6px;
    margin-top: 4px;
    padding: 8px 6px;
}
#content-date-calc-v2 .dc2-color-row.gold-row .cr-prob b {
    color: #d68910;
    font-size: 1rem;
}

#content-date-calc-v2 .dc2-color-row .cr-swatch.sw-silver  { background: #c0c0c0; }
#content-date-calc-v2 .dc2-color-row .cr-swatch.sw-blue    { background: #4a90e2; }
#content-date-calc-v2 .dc2-color-row .cr-swatch.sw-green   { background: #66bb6a; }
#content-date-calc-v2 .dc2-color-row .cr-swatch.sw-silvers { background: linear-gradient(135deg, #c0c0c0 40%, #5fa3e6 100%); }
#content-date-calc-v2 .dc2-color-row .cr-swatch.sw-red     { background: #ef5350; }
#content-date-calc-v2 .dc2-color-row .cr-swatch.sw-gold    { background: linear-gradient(135deg, #ffd54f 0%, #ffa000 100%); }

#content-date-calc-v2 .dc2-plan-card .pc-foot {
    margin-top: 10px;
    background: linear-gradient(90deg, #fff5e6 0%, #ffe9b0 100%);
    border: 1px solid #ffd54f;
    border-radius: 8px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.82rem;
}
#content-date-calc-v2 .dc2-plan-card .pc-foot .pcf-label {
    color: #8a5e10;
    font-weight: 700;
}
#content-date-calc-v2 .dc2-plan-card .pc-foot .pcf-value {
    color: #d68910;
    font-weight: 900;
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

/* v2: プラン別 金デート出現確率 は v1 と同じ plan-result-grid (repeat(5,1fr)) を使う */
#content-date-calc-v2 .plan-bonus-cell .pb-extra {
    font-size: 0.64rem;
    font-weight: 600;
    color: #b07f96;
    margin: 2px 0 1px;
    font-variant-numeric: tabular-nums;
}

@media (min-width: 720px) {
    #content-date-calc-v2 .dc2-plans-grid {
        grid-template-columns: 1fr 1fr;
    }
}

/* ============ v1.9.1: v2 詳細モーダル 追加スタイル ============ */
/* スマホで上下のブラウザバーで隠れにくくするため、モーダル高さを抑える */
#content-date-calc-v2 .detail-modal {
    max-height: calc(100vh - 96px);
}
@media (max-width: 480px) {
    #content-date-calc-v2 .detail-modal {
        max-height: calc(100vh - 140px);
    }
    #content-date-calc-v2 .modal-overlay { padding: 20px 8px 28px; }
}

/* プラン別 提供カード - 各色行 (画像 + 枚数 + レート + 出現率) */
#content-date-calc-v2 .dc2-color-row {
    display: grid;
    grid-template-columns: 88px 1fr 1fr;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-bottom: 1px dashed #f4d6e4;
    font-size: 0.78rem;
}
#content-date-calc-v2 .dc2-color-row:last-of-type { border-bottom: none; }
#content-date-calc-v2 .dc2-color-row.gold-row {
    background: linear-gradient(90deg,#fff8e6,#fff3d6);
    border-radius: 6px;
}
#content-date-calc-v2 .dc2-color-row .cr-label {
    display: flex; align-items: center; gap: 6px;
}
#content-date-calc-v2 .dc2-color-row .cr-planimg {
    width: 44px; height: 44px;
    object-fit: contain;
    background: transparent;
}
/* ×N枚 + 優先度 を縦に重ねるメタ列 */
#content-date-calc-v2 .dc2-color-row .cr-meta {
    display: inline-flex; flex-direction: column; line-height: 1.2;
}
#content-date-calc-v2 .dc2-color-row .cr-prio {
    font-size: 0.66rem; font-weight: 700; color: #b08; opacity: .72;
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
#content-date-calc-v2 .dc2-color-row.gold-row .cr-prio { color: #cf8a12; }
#content-date-calc-v2 .dc2-color-row .cr-count {
    font-weight: 800;
    color: #5a4050;
    font-variant-numeric: tabular-nums;
    font-size: 0.86rem;
    white-space: nowrap;
}
#content-date-calc-v2 .dc2-color-row .cr-rate,
#content-date-calc-v2 .dc2-color-row .cr-prob {
    color: #6a4f5e;
    font-variant-numeric: tabular-nums;
}
#content-date-calc-v2 .dc2-color-row .cr-rate b,
#content-date-calc-v2 .dc2-color-row .cr-prob b { color: #c0356a; }
#content-date-calc-v2 .dc2-color-row.gold-row .cr-rate b,
#content-date-calc-v2 .dc2-color-row.gold-row .cr-prob b { color: #d68910; }

/* 所持キャラ/メモリア リスト: アイコン + 名前 + 色タグ */
#content-date-calc-v2 .owners-section { margin-top: 14px; }
#content-date-calc-v2 .dl-mem-list.owners-scroll {
    /* このリストだけスクロール可。モーダル全体は隠れない高さ */
    max-height: 38vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 4px;
    border: 1px solid #f0d8e3;
    border-radius: 8px;
    background: #fffafd;
}
#content-date-calc-v2 .dl-mem-row.owner-row {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    align-items: center;
    gap: 7px;
    padding: 4px 8px;
    font-size: 0.78rem;
    background: transparent;
}
#content-date-calc-v2 .dl-mem-row.owner-row + .dl-mem-row.owner-row {
    border-top: 1px solid #f8e2ec;
}
#content-date-calc-v2 .owner-icon {
    width: 32px; height: 32px;
    border-radius: 50%;
    object-fit: cover;
    border: 1.5px solid #fdb6d4;
    background: #fff;
}
#content-date-calc-v2 .owner-name {
    font-weight: 700;
    color: #5a4050;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#content-date-calc-v2 .owner-tags {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

/* デートリンク詳細モーダル内の中央配置メンバー */
#content-date-calc-v2 .dl-detail-members { justify-content: center; }

/* =============================================================
 * v1.9.2 追加: 究極デートプラン確率計算機 v2 の詳細モーダルを
 *  開いた際にトップヘッダーを隠す (マスターインデックスと統一)
 * =========================================================== */
body.dc2-detail-open header,
body.dc2-detail-open .header,
body.dc2-detail-open #app-header,
body.dc2-detail-open .app-header {
    display: none !important;
}
body.dc2-detail-open {
    overflow: hidden !important;
}

/* デートプラン所持キャラ／メモリア の色タグ → プラン画像 */
#content-date-calc-v2 .owner-tags .owner-plan-img {
    width: 22px;
    height: 22px;
    object-fit: cover;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0,0,0,.12);
    background: #fff;
    flex: 0 0 auto;
}
#content-date-calc-v2 .dl-mem-row.owner-row .owner-tags {
    flex-wrap: nowrap;
    overflow: hidden;
}

/* ==========================================================
   v1.9.5: Google認証ログインモーダル 追加スタイル
   ========================================================== */

/* モーダル本体の説明文 */
.member-login-desc {
    font-size: 0.82rem;
    color: #475569;
    line-height: 1.6;
    text-align: center;
    margin: 0 0 16px;
}
.member-login-desc strong {
    color: #2d1b4e;
    font-weight: 700;
}

/* Googleログインボタン (Google公式ガイドライン準拠の中立配色) */
.btn-google-signin {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 16px;
    background: #ffffff;
    color: #3c4043;
    border: 1.5px solid #dadce0;
    border-radius: 10px;
    font-size: 0.95rem;
    font-weight: 600;
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    letter-spacing: 0.01em;
}
.btn-google-signin:hover:not(:disabled) {
    background: #f8f9fa;
    border-color: #c0c4c8;
    box-shadow: 0 2px 6px rgba(60, 64, 67, 0.15);
    transform: translateY(-1px);
}
.btn-google-signin:active:not(:disabled) {
    transform: translateY(0);
    background: #f1f3f4;
}
.btn-google-signin:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
.btn-google-signin .g-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}
.btn-google-signin .g-label {
    flex: 1;
    text-align: center;
}

/* ローディングスピナー */
.btn-google-signin .g-spinner {
    display: none;
    width: 16px;
    height: 16px;
    border: 2px solid #dadce0;
    border-top-color: #6c5ce7;
    border-radius: 50%;
    animation: gSpin 0.7s linear infinite;
    flex: 0 0 16px;
}
.btn-google-signin.loading .g-spinner { display: inline-block; }
.btn-google-signin.loading .g-logo { opacity: 0.45; }
.btn-google-signin.loading .g-label { color: #94a3b8; }

@keyframes gSpin {
    to { transform: rotate(360deg); }
}

/* 注意書きメモ */
.member-login-note {
    font-size: 0.7rem;
    color: #94a3b8;
    line-height: 1.55;
    text-align: center;
    margin: 14px 0 0;
    padding: 10px 12px;
    background: #f8fafc;
    border-radius: 6px;
    border: 1px solid #f1f5f9;
}
.member-login-note i {
    color: #a29bfe;
    margin-right: 4px;
}

/* キャンセルボタンのみのフッターを中央寄せ */
.member-login-foot {
    justify-content: center;
}
.member-login-foot .btn-pw-cancel {
    flex: 0 1 160px;
}


/* ============================================================
 * v1.9.20: 常時獲得量上昇 (6ステをコンパクトに 6列 → モバイル 3列)
 *          各セルはタップで内訳モーダルを表示。
 * ============================================================ */
.statsum-card .statgain-grid {
    width: 100%;
    padding: 2px 0 0;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 5px;
}
.statsum-card .sg-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    padding: 5px 2px;
    border-radius: 7px;
    background: #fff8fc;
    border: 1px solid #fce4ee;
    cursor: pointer;
    transition: background .15s, border-color .15s, transform .1s;
}
.statsum-card .sg-cell:hover {
    background: #fdeef5;
    border-color: #f5c2db;
}
.statsum-card .sg-cell:active {
    transform: scale(0.96);
}
.statsum-card .sg-stat {
    font-weight: 800;
    font-size: 0.68rem;
    letter-spacing: 0.3px;
    line-height: 1;
}
.statsum-card .sg-val {
    font-weight: 800;
    color: #2c3e50;
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}
.statsum-card .sg-tap {
    font-size: 0.5rem;
    color: #c98fae;
    line-height: 1;
}
@media (max-width: 560px) {
    .statsum-card .statgain-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 4px;
    }
}

/* v1.9.20: 常時獲得量上昇 内訳モーダルの行スタイル */
.sgd-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.sgd-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 12px;
    border-radius: 8px;
    background: #fff8fc;
    border: 1px solid #fce4ee;
}
.sgd-row .sgd-srcwrap {
    display: flex; align-items: center; gap: 9px; min-width: 0;
}
.sgd-row .sgd-ico {
    width: 32px; height: 32px; border-radius: 50%;
    object-fit: cover; flex-shrink: 0;
    background: #f3e7ee; box-shadow: 0 1px 2px rgba(0,0,0,.10);
}
.sgd-row .sgd-src {
    font-size: 0.86rem;
    color: #555;
    word-break: break-word;
}
/* 内訳行の優先度注記 */
#content-date-calc-v2 .cr-note {
    margin-top: 9px; padding: 8px 11px;
    background: #fff6fb; border: 1px solid #f6d8e8; border-radius: 8px;
    font-size: 0.76rem; color: #7a5666; line-height: 1.5;
}
#content-date-calc-v2 .cr-note i { color: #d6679e; margin-right: 5px; }
#content-date-calc-v2 .cr-note b { color: #c0356a; }
.sgd-row .sgd-val {
    font-weight: 700;
    color: #2c3e50;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.sgd-row.sgd-total {
    background: #fdeef5;
    border-color: #f5c2db;
    margin-top: 4px;
}
.sgd-row.sgd-total .sgd-src,
.sgd-row.sgd-total .sgd-val {
    font-weight: 800;
    color: #c0397b;
    font-size: 0.95rem;
}
.sgd-empty {
    padding: 16px;
    text-align: center;
    color: #999;
    font-size: 0.88rem;
}

/* スマホ(≤600px): 5列固定グリッドの潰れ防止 & 極小ラベルの可読性向上 */
@media (max-width: 600px) {
    #content-date-calc-v2 .plan-result-grid,
    #content-date-calc-v2 .plan-bonus-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    #content-date-calc-v2 .plan-bonus-cell .pb-extra-label,
    #content-date-calc-v2 .plan-bonus-cell .pb-total-label {
        font-size: 0.7rem;
    }
    #content-date-calc-v2 .plan-bonus-cell .pname {
        font-size: 0.72rem;
    }
    #content-date-calc-v2 .plan-result-cell .prc-name {
        font-size: 0.7rem;
    }
    #content-date-calc-v2 .grid-item .gi-name {
        font-size: 0.66rem;
    }
}
