/* ============================================================
   Session Count Checker v1.0.0 - Frontend
   ============================================================ */
.kaisu-checker{font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif!important;line-height:1.6!important;color:#333!important;max-width:800px!important;margin:32px auto!important;font-size:14px!important;border:1px solid #e0e0e0!important;border-radius:12px!important;overflow:hidden!important;background:#fff!important;box-sizing:border-box!important}
.kaisu-checker p{margin:0!important;padding:0!important}
.kaisu-checker div{box-sizing:border-box!important}
/* ヘッダー */
.kc-header{padding:18px 24px!important;background:#fff!important;border-bottom:3px solid #0A9298!important;display:flex!important;align-items:center!important;gap:12px!important}
.kc-header-icon{flex-shrink:0!important;width:36px!important;height:36px!important;background:linear-gradient(135deg,#0A9298,#00838f)!important;border-radius:8px!important;display:flex!important;align-items:center!important;justify-content:center!important}
.kc-header-icon svg{width:20px!important;height:20px!important;stroke:#fff!important;stroke-width:2!important;fill:none!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.kc-header-text{flex:1!important;min-width:0!important}
.kc-header-title{font-size:16px!important;font-weight:700!important;color:#333!important;line-height:1.4!important}
.kc-header-title .accent{color:#0A9298!important;font-weight:900!important}
.kc-header-sub{font-size:11px!important;color:#888!important;margin-top:2px!important}
/* 入力エリア */
.kc-input{padding:20px 24px!important}
.kc-label{font-size:12px!important;font-weight:700!important;color:#0A9298!important;margin:0 0 12px!important;display:flex!important;align-items:center!important;gap:6px!important}
.kc-label-num{width:20px!important;height:20px!important;background:#0A9298!important;color:#fff!important;border-radius:50%!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:11px!important;font-weight:700!important}
.kc-btn-group{display:flex!important;gap:8px!important;margin:0 0 20px!important}
.kc-btn{flex:1!important;min-width:0!important;padding:12px 8px!important;border-radius:10px!important;border:1.5px solid #ddd!important;background:#fff!important;font-size:13px!important;font-weight:600!important;color:#666!important;cursor:pointer!important;transition:all .15s!important;font-family:inherit!important;text-align:center!important;line-height:1.3!important}
.kc-btn:hover{border-color:#0A9298!important;color:#0A9298!important}
.kc-btn.is-active{background:#0A9298!important;color:#fff!important;border-color:#0A9298!important}
.kc-btn-sub{display:block!important;font-size:10px!important;font-weight:400!important;margin-top:3px!important;opacity:.75!important}
/* 結果エリア */
.kc-output{background:#f6f7f8!important;padding:20px 24px!important;border-top:1px solid #e8e8e8!important}
.kc-output-empty{text-align:center!important;color:#bbb!important;font-size:13px!important;padding:20px 0!important}
.kc-output.is-flash{animation:kcFlash .4s ease!important}
@keyframes kcFlash{0%{background:#f6f7f8}25%{background:#eef7f7}100%{background:#f6f7f8}}
/* メトリクス */
.kc-metrics{display:flex!important;gap:16px!important;margin:0 0 18px!important}
.kc-metric{flex:1!important;text-align:center!important}
.kc-metric-label{font-size:10px!important;color:#888!important;font-weight:600!important;margin:0 0 4px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:4px!important}
.kc-metric-label svg{width:14px!important;height:14px!important;stroke:#0A9298!important;stroke-width:2!important;fill:none!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.kc-metric-value{font-size:22px!important;font-weight:900!important;color:#E07B5A!important;line-height:1.2!important}
.kc-metric-value small{font-size:12px!important;font-weight:600!important}
.kc-metric-note{font-size:10px!important;color:#aaa!important;margin-top:3px!important}
.kc-metrics-divider{width:1px!important;background:#ddd!important;flex-shrink:0!important;margin:4px 0!important}
/* おすすめプラン */
.kc-plans{margin:0 0 16px!important}
.kc-plans-title{font-size:11px!important;font-weight:700!important;color:#0A9298!important;letter-spacing:.5px!important;margin:0 0 8px!important}
.kc-plan{display:flex!important;align-items:center!important;gap:10px!important;padding:12px 14px!important;background:#fff!important;border-radius:10px!important;margin:0 0 6px!important;transition:all .2s!important}
.kc-plan:last-of-type{margin:0!important}
.kc-plan.is-primary{box-shadow:0 1px 4px rgba(10,146,152,.12)!important}
.kc-plan-badge{flex-shrink:0!important;font-size:9px!important;font-weight:700!important;color:#fff!important;background:#0A9298!important;padding:3px 8px!important;border-radius:4px!important;white-space:nowrap!important}
.kc-plan:not(.is-primary) .kc-plan-badge{background:#bbb!important}
.kc-plan-info{flex:1!important;min-width:0!important}
.kc-plan-name{font-size:13px!important;font-weight:700!important;color:#333!important}
.kc-plan-comment{font-size:11px!important;color:#888!important;margin-top:1px!important}
.kc-plan-price{flex-shrink:0!important;font-size:18px!important;font-weight:900!important;color:#E07B5A!important;white-space:nowrap!important}
.kc-plan-price small{font-size:11px!important;font-weight:600!important}
/* ヒント */
.kc-hint{margin:0 0 16px!important;padding:10px 12px!important;background:#E6F5F5!important;border-radius:8px!important;font-size:11px!important;color:#077a80!important;line-height:1.5!important;display:flex!important;align-items:flex-start!important;gap:8px!important}
.kc-hint-icon{flex-shrink:0!important;width:15px!important;height:15px!important;margin-top:1px!important}
.kc-hint-icon svg{width:15px!important;height:15px!important;stroke:#0A9298!important;stroke-width:2!important;fill:none!important;stroke-linecap:round!important;stroke-linejoin:round!important}
/* CTA */
.kc-cta{text-align:center!important}
.kc-cta-btn{display:inline-block!important;background:linear-gradient(135deg,#e63535,#c0392b)!important;color:#fff!important;font-size:14px!important;font-weight:700!important;padding:12px 28px!important;border-radius:8px!important;text-decoration:none!important;transition:all .25s!important;cursor:pointer!important;border:none!important;line-height:1.4!important;box-shadow:0 2px 12px rgba(230,53,53,.25)!important;font-family:inherit!important;width:100%!important;max-width:360px!important}
.kc-cta-btn:hover{opacity:.85!important;transform:translateY(-1px)!important}
.kc-cta-sub{display:flex!important;justify-content:center!important;gap:10px!important;margin:6px 0 0!important;font-size:10px!important;color:#999!important}
.kc-cta-sub span::before{content:"✓"!important;color:#0A9298!important;margin-right:2px!important}
/* フッター */
.kc-footer{padding:10px 24px 14px!important;font-size:10px!important;color:#bbb!important;line-height:1.5!important;background:#fff!important;border-top:1px solid #eee!important}
/* レスポンシブ */
@media(max-width:500px){
.kc-header{padding:16px 16px!important}
.kc-input{padding:16px 16px!important}
.kc-output{padding:16px 16px!important}
.kc-header-title{font-size:14px!important}
.kc-btn{padding:10px 6px!important;font-size:12px!important}
.kc-btn-group[data-scc="goalBtns"]{flex-direction:column!important}
.kc-btn-group[data-scc="goalBtns"] .kc-btn{flex:none!important;padding:10px 14px!important;text-align:left!important;display:flex!important;justify-content:space-between!important;align-items:center!important}
.kc-btn-group[data-scc="goalBtns"] .kc-btn-sub{display:inline!important;margin:0 0 0 8px!important}
.kc-metrics{flex-direction:column!important;gap:10px!important}
.kc-metrics-divider{width:auto!important;height:1px!important;margin:0!important}
.kc-metric-value{font-size:20px!important}
.kc-plan-price{font-size:16px!important}
.kc-plan{display:grid!important;grid-template-columns:auto 1fr auto!important;grid-template-rows:auto auto auto!important;gap:2px 0!important;padding:10px 14px!important;align-items:center!important}
.kc-plan-badge{grid-column:1/2!important;grid-row:1/2!important}
.kc-plan-info{display:contents!important}
.kc-plan-name{grid-column:1/3!important;grid-row:2/3!important;font-size:14px!important}
.kc-plan-comment{grid-column:1/-1!important;grid-row:3/4!important}
.kc-plan-price{grid-column:3/4!important;grid-row:2/3!important;font-size:16px!important;text-align:right!important}
.kc-footer{padding:8px 16px 12px!important}
}