/* =====================================================================
   勝ちスロ (kachislot) — Bright Theme
   明るい系テーマ。Metronic style.bundle.css の後に読み込まれ上書きする。
   旧ダークテーマは kachislot.css.dark-backup に退避済み。
   ===================================================================== */

:root {
    /* Brand — 「勝ち」グリーン×ゴールド */
    --ks-brand:        #12B886;   /* エメラルドグリーン */
    --ks-brand-600:    #0CA678;   /* hover */
    --ks-brand-700:    #099268;   /* active */
    --ks-brand-soft:   #E6FCF5;   /* 薄いブランド面 */
    --ks-cyan:         #20C997;   /* グラデ用ティール */
    --ks-accent:       #F59F00;   /* 差し色（ゴールド） */
    --ks-accent-600:   #E8920A;

    /* Surfaces (light) */
    --ks-bg:           #F1FAF5;   /* ページ背景（淡いグリーン） */
    --ks-surface:      #FFFFFF;   /* カード・パネル */
    --ks-surface-2:    #F3F8F5;   /* 入力欄・薄い面 */
    --ks-border:       #DCEBE3;   /* 罫線 */
    --ks-border-strong:#C8E0D4;

    /* Text */
    --ks-text:         #1F2A28;   /* 本文（やや緑寄りのダーク） */
    --ks-muted:        #5C6B64;   /* 補助テキスト */
    --ks-on-brand:     #FFFFFF;   /* ブランド面上の文字 */

    /* Effects */
    --ks-shadow:       0 6px 20px rgba(18,184,134,0.14);
    --ks-shadow-sm:    0 2px 8px rgba(31,42,40,0.08);
    --ks-radius:       12px;
}

/* ---------- Base surfaces ---------- */
body, #kt_body {
    background-color: var(--ks-bg) !important;
    color: var(--ks-text);
}
.bg-main { background-color: var(--ks-bg) !important; }
.p-bg-content { background-color: var(--ks-bg) !important; }
.p-bg-dark { background-color: var(--ks-surface) !important; }
.p-panel {
    background-color: var(--ks-surface);
    border: 1px solid var(--ks-border);
    border-radius: var(--ks-radius);
    box-shadow: var(--ks-shadow);
    padding: 30px 30px;
}

/* ---------- Logo wordmark ---------- */
.logo {
    color: var(--ks-brand);
    font-size: 32px;
    font-weight: 800;
    letter-spacing: 1px;
}

/* ---------- Text color overrides (旧: 白文字 → 暗色) ---------- */
.color-white { color: var(--ks-text) !important; }
.text-white  { color: var(--ks-text) !important; }
.text-dark   { color: var(--ks-text) !important; }
.text-muted  { color: var(--ks-muted) !important; }
.placeholder-white::placeholder { color: var(--ks-muted) !important; opacity: 1; }
.bg-dark-o-70 { background-color: var(--ks-surface-2) !important; }
/* ブランド面/ボタン上はあえて白を維持 */
.btn .text-white,
.p-bg-primary .text-white,
.p-bg-danger .text-white,
.td-blue.text-white, .td-dark-blue.text-white,
.td-date-sat.text-white { color: #fff !important; }

/* ---------- Login ---------- */
.login.login-3 .login-form { max-width: 563px !important; }
.login-signin h3 { font-size: 36px; font-weight: 700; color: var(--ks-text); }
.login-form.text-white, .login-form .text-white { color: var(--ks-text) !important; }

.area {
    font-family: sans-serif; text-align: center; font-size: 22px;
    color: var(--ks-text); letter-spacing: -1px; font-weight: 700;
}
.area:hover { color: var(--ks-brand); }
.area1 {
    font-family: sans-serif; text-align: center; font-size: 22px;
    color: var(--ks-brand); letter-spacing: -1px; font-weight: 700;
    animation: blur 1.4s ease-out infinite;
}
.area1:hover { color: var(--ks-brand-600); }
@keyframes blur {
    from { text-shadow: 0 0 8px rgba(18,184,134,0.45), 0 0 16px rgba(32,201,151,0.30); }
    to   { text-shadow: 0 0 4px rgba(18,184,134,0.25); }
}

.p-form-control {
    border-radius: 50px !important;
    border: 1px solid var(--ks-border-strong) !important;
    background-color: var(--ks-surface) !important;
    color: var(--ks-text) !important;
}
.p-primary-btn {
    border: 1px solid var(--ks-brand) !important;
    background: var(--ks-brand) !important;
    color: #fff !important;
    font-weight: bold !important;
    border-radius: 10px;
}
.p-primary-btn:hover {
    background: var(--ks-brand-600) !important;
    color: #fff !important;
}

/* ---------- Buttons / links ---------- */
.btn.btn-primary {
    background: var(--ks-brand) !important;
    border-color: var(--ks-brand) !important;
    color: #fff !important;
}
.btn.btn-primary:hover:not(.btn-text):not(:disabled):not(.disabled) {
    background: var(--ks-brand-600) !important;
    border-color: var(--ks-brand-600) !important;
    color: #fff !important;
}
.btn.btn-primary:focus:not(.btn-text), .btn.btn-primary.focus:not(.btn-text) {
    background: var(--ks-brand-700) !important;
    border-color: var(--ks-brand-700) !important;
    color: #fff !important;
}
.region-btn:hover {
    color: var(--ks-accent) !important;
    border: 1px solid var(--ks-accent) !important;
    background-color: transparent !important;
}
.btn-hover-primary:hover { background-color: var(--ks-brand) !important; color:#fff !important; }
.btn.btn-hover-primary:not(:disabled):not(.disabled):active:not(.btn-text),
.btn.btn-hover-primary:not(:disabled):not(.disabled).active,
.show > .btn.btn-hover-primary.dropdown-toggle,
.show .btn.btn-hover-primary.btn-dropdown {
    color: #fff !important;
    background-color: var(--ks-brand) !important;
    border-color: var(--ks-brand) !important;
}
.btn.btn-hover-primary:hover:not(.btn-text):not(:disabled):not(.disabled),
.btn.btn-hover-primary:focus:not(.btn-text),
.btn.btn-hover-primary.focus:not(.btn-text) {
    background-color: var(--ks-brand-600) !important;
}

.p-link { color: var(--ks-brand) !important; }
.p-link:hover { color: var(--ks-accent) !important; cursor: pointer; }
.text-primary { color: var(--ks-brand) !important; }
.text-underline { text-decoration: underline !important; }
.nav-link:hover { color: var(--ks-brand) !important; }

/* ---------- Dividers / accents ---------- */
.divider { height: 3px; border-radius: 50px; background: linear-gradient(90deg, var(--ks-brand), var(--ks-cyan)); }
.sub-left-divider, .sub-right-divider { height: 1px; background-color: var(--ks-border-strong); }
.divide-cell { } /* layout below */

/* ---------- Font sizes (保持) ---------- */
.fs-2 { font-size: 40px; }
.fs-5 { font-size: 24px; }
.fs-6 { font-size: 20px; }
.fs-7 { font-size: 16px; }
.fs-8 { font-size: 14px; }
.fs-9 { font-size: 12px; }
.rounded-10 { border-radius: 10px !important; }
.font-weight-bold-600 { font-weight: 600 !important; }

/* ---------- Tables ---------- */
.table th, .table td {
    color: var(--ks-text) !important;
    font-size: 12px;
    border-color: var(--ks-border) !important;
}
.table td { border: none; padding: 15px 10px; }
.table-hover tbody tr:hover {
    background-color: var(--ks-brand-soft) !important;
    color: var(--ks-text) !important;
}
.td-border { border-bottom: 1px solid var(--ks-border) !important; }
.table-center tbody tr td { text-align: center !important; }

/* DataTables */
.dataTables_wrapper .dataTable th, .dataTables_wrapper .dataTable td { color: var(--ks-text) !important; }
.dataTables_wrapper .dataTable td { border: none; }
div.dataTables_wrapper div.dataTables_length label,
div.dataTables_wrapper div.dataTables_filter label { color: var(--ks-text) !important; }
div.dataTables_wrapper div.dataTables_length select,
div.dataTables_wrapper div.dataTables_filter input {
    background-color: var(--ks-surface-2);
    color: var(--ks-text) !important;
    border: 1px solid var(--ks-border) !important;
}
#kt_datatable_info { color: var(--ks-muted); }
#kt_datatable a { color: var(--ks-brand); }
#kt_datatable a:hover { color: var(--ks-accent); }
.dataTables_wrapper .dataTables_paginate .pagination .page-item.active > .page-link,
.dataTables_wrapper .dataTables_paginate .pagination .page-item:hover:not(.disabled) > .page-link {
    background-color: var(--ks-brand) !important;
    border-color: var(--ks-brand) !important;
    color: #fff !important;
}
#kt_datatable_next a, #kt_datatable_previous a {
    background-color: transparent;
    border: 1px solid var(--ks-border-strong);
    color: var(--ks-text);
}
#kt_datatable_next a:hover, #kt_datatable_previous a:hover { border: none; background: var(--ks-brand-soft); }

/* ---------- Inputs ---------- */
.form-control { color: var(--ks-text); }
.p-input {
    background-color: var(--ks-surface-2);
    border-radius: 10px;
    border: 1px solid var(--ks-border);
    color: var(--ks-text);
}
.g_input, .g_input:focus {
    background-color: var(--ks-surface-2) !important;
    color: var(--ks-text) !important;
    border-color: var(--ks-border-strong) !important;
}
.p-input-date-picker {
    background-color: var(--ks-surface-2) !important;
    border: 1px solid var(--ks-border);
    color: var(--ks-text) !important;
}
.border-left-side-radius { border-radius: 5px 0 0 5px !important; }
.border-right-side-radius { border-radius: 0 5px 5px 0 !important; }
.border-main { border-color: var(--ks-border-strong) !important; }

/* ---------- Header / footer ---------- */
#kt_footer {
    background: var(--ks-surface) !important;
    border-top: 1px solid var(--ks-border);
    padding: 55px 0;
}
#kt_header_menu .menu-text { font-weight: bold; }
#kt_header_menu .menu-item-here .menu-text { color: var(--ks-brand) !important; }
#kt_header_menu .menu-text:hover { color: var(--ks-brand) !important; }
.navi.navi-hover .navi-item .navi-link:hover { background-color: var(--ks-surface-2) !important; }

/* ---------- Backgrounds / utility ---------- */
.p-bg-danger  { background-color: var(--ks-accent) !important; }
.p-bg-primary { background-color: var(--ks-brand) !important; }
.bg-primary   { background-color: var(--ks-brand) !important; }
.p-nav-tabs { border: none !important; }
.p-nav-tabs .active { border-color: var(--ks-brand) !important; }

/* =====================================================================
   Begin::model detail table （データ解析ヒートマップ — 配色は意味なので維持）
   ===================================================================== */
.model-table { display: grid; grid-template-columns: auto; width: 100%; }
.model-table .model-table-row { display: flex; flex-wrap: nowrap; }
.model-table .td-block {
    background-color: #ffffff;
    flex: 1.35; min-width: 19px;
    border-right: 0.8px solid var(--ks-border-strong);
    border-bottom: 0.8px solid var(--ks-border-strong);
    box-sizing: border-box; height: 10px; width: 19px; font-size: 5px;
    display: flex; align-items: center; justify-content: center; color: #000;
}
.model-table .td-block.td-header { color: #000; font-size: 5px; }
.model-sticky-h-1 { position: sticky !important; left: 0 !important; z-index: 100 !important; }
.model-sticky-h-3 { position: sticky !important; left: 0 !important; z-index: 98 !important; }
.model-sticky-h-2 { position: sticky !important; z-index: 100 !important; }
.model-sticky-h-4 { position: sticky !important; z-index: 98 !important; }
.model-sticky-3   { position: sticky !important; top: 0 !important; z-index: 99 !important; }
.model-table .td-block.td-sheet { color: #000; cursor: pointer; justify-content: right !important; }

.dailyModelBlue {
    border-right: 1px solid var(--ks-border);
    background-color: #BAD3FF !important; color: #000;
    width: 50%; height: 100%; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
}
.dailyModelRed {
    background-color: #FF97C2 !important; color: #000;
    width: 50%; height: 100%;
    display: flex; align-items: center; justify-content: center;
}
.model-table-row > .td-block:nth-child(1), .divide-cell { border-right: 1px solid var(--ks-border-strong); }
.model-table-row > .td-block:nth-child(2), .divide-cell { flex: 1 !important; }
#modelDetailTable > .model-table-row:first-child { border-bottom: 0.5px solid var(--ks-border-strong); }
.model-table .model-table-row:last-child { border-top: 0.5px solid var(--ks-border-strong); }
.td-date { background-color: #FFFDF0 !important; color:#000; }
.td-date-sat { background-color: #4689FF !important; color: #fff !important; }
.td-model-name { background-color: #F0FFF4 !important; color:#000; }

/* 差枚ヒートマップの色（赤=負け / 青=勝ち、設定示唆の可視化） */
.td-white { background-color: #ffffff !important; }
.td-light-blue { background-color: #BAD3FF !important; }
.td-blue { background-color: #4689FF !important; color: #fff !important; }
.td-dark-blue { background-color: #0F37D6 !important; color: #fff !important; }
.td-pink { background-color: #FF97C2 !important; }
.td-red { background-color: #FF367F !important; color:#fff; }
.td-gray { background-color: #E2E6EF !important; }
.active_blink {
    box-shadow: 0 0.7em 0.7em -0.2em rgba(18,184,134,0.25);
    transform: translateY(-0.4em); font-weight: 700; transition: 0.2s;
    border-top: 1px solid var(--ks-brand-soft);
}
/* End::model detail table */

/* ---------- Modals ---------- */
#modalTable td { border: 1px solid var(--ks-border); }
#dataModal .modal-content {
    color: var(--ks-text);
    background: var(--ks-surface);
    border-radius: var(--ks-radius);
    box-shadow: var(--ks-shadow);
}
#dataModal .modal-title { color: var(--ks-text) !important; }
#dataModal .modal-content button > i { color: var(--ks-muted); }
#dataModal .modal-header, #dataModal .modal-footer { border-color: var(--ks-border) !important; }
#model-chart svg { background-color: transparent !important; }
#model-chart { min-height: 1px !important; }

.g_modal {
    background: var(--ks-surface);
    border-radius: var(--ks-radius);
    box-shadow: var(--ks-shadow);
}
.g_modal .modal-header, .g_modal .modal-footer { border-color: var(--ks-border) !important; }
#searchModal .modal-title { color: var(--ks-text) !important; }
#searchModal .modal-content button > i { color: var(--ks-muted); }
#searchModal .modal-header, #searchModal .modal-footer { border-color: var(--ks-border) !important; }

/* ---------- Sweet Alert ---------- */
.swal2-popup { background: var(--ks-surface) !important; box-shadow: var(--ks-shadow) !important; }
.swal2-popup .swal2-title { color: var(--ks-text) !important; }
.swal2-container .swal2-html-container { color: var(--ks-muted) !important; }

/* ---------- Profile / cards ---------- */
.form-group label { color: var(--ks-text); }
.p-panel .card-footer { background: unset; border-top: unset; }
.p-panel .card-header { border-color: var(--ks-border); }
.opacity-disable { opacity: 0 !important; }
.opacity-active { opacity: 1 !important; }

/* ---------- Scrollbar ---------- */
.scroll.ps > .ps__rail-x { height: 6px !important; }
.scroll.ps > .ps__rail-x > .ps__thumb-x { background: var(--ks-brand); height: 6px !important; }
::-webkit-scrollbar { width: 12px; height: 7px; }
::-webkit-scrollbar-thumb { background: #C3CDDE; border-radius: 0.42rem !important; }
::-webkit-scrollbar-thumb:hover { background: var(--ks-brand); }
html { scroll-behavior: smooth; }
.parallax { background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; }

/* ---------- Divide cell (model table diagonal) ---------- */
.divide-cell {
    position: relative; background-color: #ffffff; flex: 1; min-width: 19px;
    border-right: 1.2px solid var(--ks-border-strong);
    border-bottom: 1px solid var(--ks-border-strong);
    box-sizing: border-box; width: 100%;
    display: flex; align-items: center; justify-content: center;
    color: #000; font-size: 8px; font-weight: 600; height: auto;
}
.divide-cell::before {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(to bottom left, #fff 49%, var(--ks-border-strong) 50%, #fff 51%);
    transform-origin: 0 0;
}
.divide-cell .c1 { position: absolute; top: 0; right: 0; font-size: 4px; }
.divide-cell .c2 { position: absolute; left: 0; bottom: -2px; font-size: 4px; }

/* ---------- Misc ---------- */
.hide { display: none; }
.blur-background { opacity: 0.5; }
.set-x-smartphone { display: unset; }
.table-responsive { overflow-y: auto; height: 500px; }
.w-80 { width: 60% !important; }
@keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } }
.blinking-text { animation: blink 1s infinite; }
@media (max-width: 991.98px) { #kt_header_mobile { min-height: 80px !important; } }

/* =====================================================================
   Fluid / shine buttons （明るいテーマ向けに調整）
   ===================================================================== */
:root {
    --glow-hue: 210deg;
    --shadow-hue: 200deg;
    --spring-easing: linear(
        0, 0.002, 0.01 0.9%, 0.038 1.8%, 0.156, 0.312 5.8%, 0.789 11.1%, 1.015 14.2%,
        1.096, 1.157, 1.199, 1.224 20.3%, 1.231, 1.231, 1.226, 1.214 24.6%,
        1.176 26.9%, 1.057 32.6%, 1.007 35.5%, 0.984, 0.968, 0.956, 0.949 42%,
        0.946 44.1%, 0.95 46.5%, 0.998 57.2%, 1.007, 1.011 63.3%, 1.012 68.3%,
        0.998 84%, 1);
    --spring-duration: 1.33s;
    --size-default: 22px;
    --size-sm: 16px;
    --primary: #4F8CFF;
    --white: #ffffff;
    --color-black: #000;
}
@property --shimmer { syntax: "<angle>"; inherits: false; initial-value: 33deg; }
@keyframes shimmer { 0% { --shimmer: 0deg; } 100% { --shimmer: 360deg; } }
@keyframes shine { 0% { opacity: 0; } 15% { opacity: 1; } 55% { opacity: 1; } 100% { opacity: 0; } }
@keyframes text { 0% { background-position: 100% center; } 100% { background-position: -100% center; } }

.shineBtn {
    color: var(--ks-brand); font-weight: 600; padding: .8em 1.4em;
    position: relative; isolation: isolate; border-radius: 0.66em; scale: 1;
    transition: all var(--spring-duration) var(--spring-easing);
}
.shineBtn:hover:not(:active), .shineBtn.active {
    transition-duration: calc(var(--spring-duration)*0.5); scale: 1.2;
    box-shadow: 0 4px 8px -2px hsl(var(--glow-hue) 80% 60% / 35%), inset 0 0 0 transparent;
}
.shineBtn:active { scale: 1.1; transition-duration: calc(var(--spring-duration)*0.5); }
.shimmer {
    position: absolute; border-radius: inherit;
    mask-image: conic-gradient(from var(--shimmer, 0deg), transparent 0%, transparent 10%,
        black 36%, black 45%, transparent 50%, transparent 60%, black 85%, black 95%, transparent 100%);
    mask-size: cover; mix-blend-mode: plus-lighter; animation: shimmer 1s linear infinite both;
}
.shineBtn:hover .shimmer::before, .shineBtn:hover .shimmer::after,
.shineBtn.active .shimmer::before, .shineBtn.active .shimmer::after {
    opacity: 1; animation: shine 1.2s ease-in 1 forwards;
}
.shimmer::before, .shimmer::after {
    transition: all 0.5s ease; opacity: 0; content: ""; border-radius: inherit;
    position: absolute; mix-blend-mode: color; inset: 40px; pointer-events: none;
}
.shimmer::before {
    box-shadow: 0 0 3px 2px hsl(var(--glow-hue) 90% 92%), 0 0 7px 4px hsl(var(--glow-hue) 90% 80%),
        0 0 13px 4px hsl(var(--glow-hue) 80% 70%), 0 0 25px 5px hsl(var(--glow-hue) 90% 70%);
    z-index: -1;
}
.shimmer::after {
    box-shadow: inset 0 0 0 1px hsl(var(--glow-hue) 80% 92%), inset 0 0 2px 1px hsl(var(--glow-hue) 90% 80%),
        inset 0 0 5px 2px hsl(var(--glow-hue) 90% 70%);
    z-index: 2;
}
.shineBtn .text {
    color: transparent; background-clip: text; background-color: var(--ks-brand);
    background-image: linear-gradient(120deg, transparent, hsla(var(--glow-hue),100%,80%,0.66) 40%,
        hsla(var(--glow-hue),100%,90%,.9) 50%, transparent 52%);
    background-repeat: no-repeat; background-size: 300% 300%; background-position: center 200%;
}
.shineBtn:hover .text, .shineBtn.active .text { animation: text .66s ease-in 1 both; }

@property --angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@property --glowColor { syntax: "<color>"; initial-value: #4F8CFF; inherits: false; }
@keyframes rotate  { 0% { --angle: 0deg; --glowColor: var(--ks-cyan); } 100% { --angle: 360deg; --glowColor: var(--ks-cyan); } }
@keyframes rotate1 { 0% { --angle: 0deg; --glowColor: var(--primary); } 100% { --angle: 360deg; --glowColor: var(--primary); } }

.fluid-btn, .fluid-btn1 {
    display: flex; align-items: center; justify-content: center;
    border-radius: 100px; border: none; background: none; position: relative;
    padding: 1px; text-decoration: none; transition: all 0.18s ease-in-out;
    transform: translate3d(0, 0, 0);
}
.fluid-btn:after, .fluid-btn:before,
.fluid-btn1:after, .fluid-btn1:before {
    content: ""; display: block; position: absolute; top: 0; left: 0;
    width: 100%; height: 100%; border-radius: calc(100px + 1.5px);
    background-size: 100% 100%; background-position: 0 0;
    background-image: conic-gradient(from var(--angle) at 50% 50%, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 33%, var(--glowColor) 50%, rgba(0,0,0,0) 66%, rgba(0,0,0,0) 100%);
    animation: rotate 2s infinite linear;
}
.fluid-btn1:after, .fluid-btn1:before { animation: rotate1 2s infinite linear; }
.fluid-btn:before, .fluid-btn1:before { filter: blur(20px); }

.fluid-btn-inner, .fluid-btn-inner1 {
    position: relative; display: flex; flex-direction: column; width: 100%;
    padding: var(--size-sm) var(--size-default); border-radius: 100px;
    font-weight: 600; font-size: 17px; z-index: 1; transition: all 0.18s ease;
    background: var(--ks-surface);
    box-shadow: var(--ks-shadow-sm);
    backface-visibility: hidden;
}
.fluid-btn-inner  { color: var(--ks-brand); }
.fluid-btn-inner1 { color: var(--ks-brand); }
.fluid-btn:hover .fluid-btn-inner,
.fluid-btn1:hover .fluid-btn-inner1 {
    background: var(--ks-brand-soft);
    color: var(--ks-brand-600);
}
.fluid-btn:active, .fluid-btn1:active { transform: scale(0.95); }

/* ---------- Responsive ---------- */
@media screen and (max-width: 995px) {
    .apexcharts-xaxis { display: none; }
    #kt_login_forgot { margin-top: 25px; }
}
@media screen and (max-width: 768px) {
    .dataTables_length { text-align: left !important; }
    .dataTables_filter label { width: 100% !important; margin-top: 20px; }
}
@media screen and (max-width: 576px) {
    #dataModal .modal-dialog { justify-content: center; }
    #dataModal .modal-content { width: 90%; }
    #dataModal .modal-header { display: none; }
    #dataModal .modal-body { padding: 0.75rem; }
}

/* =====================================================================
   勝ちスロ 固有のデザインアクセント（元サイトと印象を変えるための追加分）
   ===================================================================== */
/* パネル上部にブランドのアクセントライン */
.p-panel { position: relative; overflow: hidden; }
.p-panel::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--ks-brand), var(--ks-cyan) 60%, var(--ks-accent));
}
/* テーブルのヘッダー帯 */
.table thead th, .dataTables_wrapper .dataTable thead th {
    background: var(--ks-brand-soft) !important;
    color: var(--ks-brand-700) !important;
    font-weight: 700 !important;
    border-bottom: 2px solid var(--ks-brand) !important;
    letter-spacing: .3px;
}
/* ボタンを少し立体的に（勝ち＝ゴールドのリング） */
.btn.btn-primary, .p-primary-btn {
    border-radius: 10px !important;
    box-shadow: 0 4px 0 0 var(--ks-brand-700), 0 8px 16px rgba(18,184,134,.25);
    transition: transform .12s ease, box-shadow .12s ease;
}
.btn.btn-primary:hover, .p-primary-btn:hover { transform: translateY(2px); box-shadow: 0 2px 0 0 var(--ks-brand-700), 0 4px 10px rgba(18,184,134,.25); }
/* ナビのアクティブ下線をブランド色に */
#kt_header_menu .menu-item-here .menu-text { position: relative; }
#kt_header_menu .menu-item-here .menu-text::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 3px;
    border-radius: 3px; background: linear-gradient(90deg, var(--ks-brand), var(--ks-accent));
}
/* 見出し下のアクセント（.divider と別に、セクション見出し向け） */
.fs-2.color-white, h1.fs-2 { letter-spacing: .5px; }