
.mccf-wrapper { max-width: 600px; margin: 0 auto; font-family: inherit; background: #ffffff; padding: 2rem; border-radius: 8px; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); }
.mccf-progress-container { position: relative; display: flex; justify-content: space-between; margin-bottom: 2.5rem; padding: 0 1rem; }
.mccf-progress-line-bg { position: absolute; top: 15px; left: 0; width: 100%; height: 2px; background: #e5e7eb; z-index: 0; }
.mccf-progress-line-active { position: absolute; top: 15px; left: 0; height: 2px; background: var(--mccf-primary, #2563eb); z-index: 0; transition: width 0.3s ease; }
.mccf-step-item { position: relative; z-index: 1; text-align: center; display: flex; flex-direction: column; align-items: center; }
.mccf-step-circle { width: 32px; height: 32px; background: #ffffff; border: 2px solid #e5e7eb; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 12px; color: #9ca3af; transition: all 0.3s; }
.mccf-step-circle-active { border-color: var(--mccf-primary, #2563eb); background: var(--mccf-primary, #2563eb); color: #ffffff; }
.mccf-step-text { font-size: 12px; font-weight: bold; margin-top: 8px; color: #9ca3af; }
.mccf-step-text-active { color: var(--mccf-primary, #2563eb); }
.mccf-field { margin-bottom: 1.5rem; }
.mccf-label { display: block; font-size: 0.875rem; font-weight: 500; margin-bottom: 0.5rem; color: #374151; }
.mccf-req-tag { background: #fee2e2; color: #ef4444; font-size: 0.7rem; padding: 2px 6px; border-radius: 4px; margin-left: 6px; font-weight: bold; }
.mccf-input { width: 100%; padding: 0.75rem; border: 1px solid #d1d5db; box-sizing: border-box; font-size: 1rem; }
.mccf-split { display: flex; gap: 1rem; }
.mccf-split .mccf-input { width: 100%; }
.mccf-error { color: #ef4444; font-size: 0.75rem; margin-top: 0.25rem; font-weight: bold; }
.mccf-btn { display: inline-flex; align-items: center; justify-content: center; padding: 0.75rem 1.5rem; font-weight: 600; cursor: pointer; border: none; transition: opacity 0.2s; text-decoration: none; font-size: 1rem; }
.mccf-btn:hover { opacity: 0.9; }
.mccf-btn-primary { background-color: var(--mccf-primary, #2563eb); color: #ffffff; }
.mccf-btn-secondary { background-color: #ffffff; border: 1px solid #d1d5db; color: #374151; }
.mccf-btn-wide { width: 100%; }
.mccf-btn-group { display: flex; justify-content: center; gap: 1rem; margin-top: 2rem; }
.mccf-confirm-list { border-top: 1px solid #e5e7eb; margin-top: 1rem; }
.mccf-confirm-item { display: grid; grid-template-columns: 1fr 2fr; padding: 1rem 0; border-bottom: 1px solid #e5e7eb; font-size: 0.9rem; }
.mccf-confirm-item dt { font-weight: bold; color: #4b5563; }
.mccf-confirm-item dd { white-space: pre-wrap; margin: 0; word-break: break-all; }
.mccf-success-box { text-align: center; padding: 2rem 0; }
.mccf-success-icon { width: 80px; height: 80px; background: #dcfce7; color: #16a34a; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 40px; margin: 0 auto 1.5rem; }
.mccf-confirm-notice { background: #eff6ff; color: #1d4ed8; padding: 0.75rem; border-radius: 0.375rem; font-size: 0.75rem; margin-bottom: 1rem; display: flex; align-items: center; }
.mccf-confirm-notice:before { content: '🛡️'; margin-right: 6px; }
.mccf-back-link { display: inline-block; margin-top: 1.5rem; font-weight: 500; text-decoration: underline; }
