.visitor-funnel-shell {
    --vf-radius-lg: 28px;
    --vf-radius-md: 18px;
    --vf-radius-sm: 12px;
    --vf-shadow: 0 18px 50px rgba(22, 34, 67, .12);
    --vf-soft-shadow: 0 10px 28px rgba(22, 34, 67, .08);
    --vf-primary: #6057e9;
    --vf-primary-dark: #302a91;
    --vf-coral: #f9736b;
    --vf-gold: #f8b547;
    --vf-green: #16a085;
    --vf-blue: #0ea5e9;
    --vf-ink: #182033;
    --vf-muted: #657089;
    --vf-surface: #ffffff;
    color: var(--vf-ink);
}

.visitor-funnel-hero {
    position: relative;
    overflow: hidden;
    border-radius: var(--vf-radius-lg);
    padding: clamp(1.5rem, 4vw, 3.75rem);
    background:
        radial-gradient(circle at 12% 18%, rgba(249, 181, 71, .35), transparent 25%),
        radial-gradient(circle at 90% 12%, rgba(14, 165, 233, .25), transparent 28%),
        linear-gradient(135deg, #251970 0%, #6057e9 48%, #f9736b 100%);
    color: #fff;
    box-shadow: var(--vf-shadow);
}

.visitor-funnel-hero::after {
    content: "";
    position: absolute;
    inset: auto -80px -120px auto;
    width: 300px;
    height: 300px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .16);
    filter: blur(1px);
}

.visitor-funnel-hero > * { position: relative; z-index: 1; }
.visitor-funnel-hero .badge { backdrop-filter: blur(8px); }

.visitor-funnel-card,
.visitor-funnel-form-card,
.visitor-funnel-panel,
.visitor-funnel-metric,
.visitor-record-card,
.visitor-qr-card,
.visitor-task-card {
    border: 0;
    border-radius: var(--vf-radius-md);
    background: var(--vf-surface);
    box-shadow: var(--vf-soft-shadow);
}

.visitor-funnel-card-gradient {
    background:
        linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,.88)),
        radial-gradient(circle at top left, rgba(96,87,233,.18), transparent 35%),
        radial-gradient(circle at bottom right, rgba(249,115,107,.15), transparent 30%);
}

.visitor-funnel-form-card {
    padding: clamp(1rem, 3vw, 2rem);
}

.visitor-funnel-form-card .form-control,
.visitor-funnel-form-card .form-select,
.visitor-funnel-panel .form-control,
.visitor-funnel-panel .form-select {
    border-radius: 14px;
    border-color: rgba(101, 112, 137, .24);
    min-height: 46px;
}

.visitor-funnel-form-card .form-control:focus,
.visitor-funnel-form-card .form-select:focus,
.visitor-funnel-panel .form-control:focus,
.visitor-funnel-panel .form-select:focus {
    border-color: rgba(96, 87, 233, .55);
    box-shadow: 0 0 0 .25rem rgba(96, 87, 233, .12);
}

.visitor-funnel-icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    color: #fff;
    background: linear-gradient(135deg, var(--vf-primary), var(--vf-blue));
}

.visitor-funnel-icon.coral { background: linear-gradient(135deg, var(--vf-coral), var(--vf-gold)); }
.visitor-funnel-icon.green { background: linear-gradient(135deg, var(--vf-green), #5eead4); }
.visitor-funnel-icon.gold { background: linear-gradient(135deg, #d97706, var(--vf-gold)); }

.visitor-funnel-submit {
    border: 0;
    border-radius: 16px;
    min-height: 50px;
    background: linear-gradient(135deg, var(--vf-primary), var(--vf-primary-dark));
    color: #fff;
    box-shadow: 0 14px 28px rgba(96, 87, 233, .24);
}

.visitor-funnel-submit:hover,
.visitor-funnel-submit:focus {
    color: #fff;
    filter: brightness(.98);
    transform: translateY(-1px);
}

.visitor-funnel-meta-pill,
.visitor-stage-pill,
.visitor-source-pill {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .42rem .72rem;
    border-radius: 999px;
    background: rgba(96, 87, 233, .1);
    color: var(--vf-primary-dark);
    font-size: .83rem;
    font-weight: 700;
}

.visitor-source-pill { background: rgba(14, 165, 233, .12); color: #075985; }
.visitor-stage-pill.stage-member,
.visitor-stage-pill.stage-partner,
.visitor-stage-pill.stage-worker { background: rgba(22, 160, 133, .13); color: #0f766e; }
.visitor-stage-pill.stage-convert,
.visitor-stage-pill.stage-baptized { background: rgba(249, 181, 71, .18); color: #92400e; }
.visitor-stage-pill.stage-archived { background: rgba(100, 116, 139, .14); color: #475569; }

.visitor-funnel-metric {
    padding: 1.15rem;
    position: relative;
    overflow: hidden;
}

.visitor-funnel-metric::after {
    content: "";
    position: absolute;
    width: 82px;
    height: 82px;
    border-radius: 50%;
    right: -22px;
    bottom: -24px;
    background: rgba(96, 87, 233, .12);
}

.visitor-funnel-metric-value {
    font-size: clamp(1.6rem, 4vw, 2.35rem);
    font-weight: 800;
    line-height: 1;
}

.visitor-pipeline-board {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 1rem;
}

.visitor-pipeline-column {
    border-radius: var(--vf-radius-md);
    background: linear-gradient(180deg, rgba(96, 87, 233, .08), rgba(255,255,255,.95));
    padding: 1rem;
    min-height: 190px;
}

.visitor-record-card {
    padding: 1rem;
    border-left: 5px solid var(--vf-primary);
}

.visitor-record-card[data-stage="convert"],
.visitor-record-card[data-stage="baptized"] { border-left-color: var(--vf-gold); }
.visitor-record-card[data-stage="worker"],
.visitor-record-card[data-stage="partner"],
.visitor-record-card[data-stage="member"] { border-left-color: var(--vf-green); }

.visitor-card-actions .btn,
.visitor-admin-toolbar .btn,
.visitor-funnel-panel .btn {
    border-radius: 12px;
}

.visitor-qr-image {
    width: 160px;
    height: 160px;
    object-fit: contain;
    padding: .75rem;
    border-radius: 20px;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(101, 112, 137, .15);
}

.visitor-kiosk-shell {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(96, 87, 233, .18), transparent 24%),
        radial-gradient(circle at bottom right, rgba(249, 115, 107, .18), transparent 24%),
        #f5f7fb;
    padding: clamp(1rem, 3vw, 2.25rem);
}

.visitor-kiosk-shell .visitor-funnel-form-card {
    max-width: 980px;
    margin-inline: auto;
}

.visitor-empty-state {
    border-radius: var(--vf-radius-md);
    background: linear-gradient(135deg, rgba(96, 87, 233, .08), rgba(249, 181, 71, .12));
    padding: 2rem;
    text-align: center;
}

@media (max-width: 767.98px) {
    .visitor-funnel-hero { border-radius: 20px; }
    .visitor-funnel-form-card { padding: 1rem; }
    .visitor-admin-toolbar .btn,
    .visitor-card-actions .btn { width: 100%; }
    .visitor-record-card { padding: .9rem; }
    .visitor-pipeline-board { grid-template-columns: 1fr; }
}

.visitor-admin-shell {
    --vf-primary: #6057e9;
    --vf-primary-dark: #302a91;
    --vf-coral: #f9736b;
    --vf-gold: #f8b547;
    --vf-green: #16a085;
    --vf-blue: #0ea5e9;
    --vf-ink: #182033;
    --vf-muted: #657089;
    color: var(--vf-ink);
}

.visitor-admin-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-radius: 28px;
    padding: clamp(1.25rem, 3vw, 2.5rem);
    background:
        radial-gradient(circle at 15% 15%, rgba(248,181,71,.34), transparent 25%),
        linear-gradient(135deg, var(--vf-primary-dark), var(--vf-primary) 58%, var(--vf-coral));
    color: #fff;
    box-shadow: 0 22px 55px rgba(48,42,145,.18);
}

.visitor-admin-hero h1 { margin: 0; font-weight: 800; }
.visitor-admin-hero p { margin: .35rem 0 0; opacity: .92; max-width: 780px; }
.visitor-admin-hero-actions { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: flex-end; }

.visitor-metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
}

.visitor-metric-card {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    padding: 1rem;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
}

.visitor-metric-card i {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    color: #fff;
    background: linear-gradient(135deg, var(--vf-primary), var(--vf-blue));
    margin-bottom: .8rem;
}

.visitor-metric-card span { display: block; color: var(--vf-muted); font-weight: 700; font-size: .86rem; }
.visitor-metric-card strong { display: block; font-size: 2rem; line-height: 1; margin-top: .25rem; }
.visitor-tone-success i { background: linear-gradient(135deg, #16a085, #5eead4); }
.visitor-tone-warning i { background: linear-gradient(135deg, #d97706, #f8b547); }
.visitor-tone-info i { background: linear-gradient(135deg, #0ea5e9, #67e8f9); }
.visitor-tone-danger i { background: linear-gradient(135deg, #ef4444, #f9736b); }
.visitor-tone-purple i { background: linear-gradient(135deg, #7c3aed, #c084fc); }
.visitor-tone-cyan i { background: linear-gradient(135deg, #0891b2, #22d3ee); }
.visitor-tone-dark i { background: linear-gradient(135deg, #111827, #475569); }

.visitor-filter-panel,
.visitor-qr-panel,
.visitor-bulk-bar {
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
    padding: 1rem;
}

.visitor-filter-panel,
.visitor-qr-form,
.visitor-bulk-bar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: .85rem;
    align-items: end;
}

.visitor-pipeline-wrap {
    border-radius: 24px;
    background: #fff;
    padding: 1rem;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
}

.visitor-pipeline-stage {
    border-radius: 18px;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(96, 87, 233, .09), rgba(14, 165, 233, .08));
}

.visitor-pipeline-stage strong { display: block; font-size: 1.8rem; }

.visitor-qr-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.visitor-qr-list article {
    display: flex;
    gap: .9rem;
    align-items: center;
    border-radius: 18px;
    padding: .9rem;
    background: rgba(96, 87, 233, .06);
}

.visitor-qr-list img {
    width: 96px;
    height: 96px;
    object-fit: contain;
    border-radius: 14px;
    background: #fff;
    padding: .4rem;
}

.visitor-qr-list small {
    display: block;
    max-width: 100%;
    word-break: break-all;
    color: var(--vf-muted);
}

.visitor-qr-stats {
    display: flex;
    gap: .8rem;
    margin-top: .35rem;
    color: var(--vf-primary-dark);
    font-weight: 700;
}

.visitor-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: 1rem;
}

.visitor-admin-card {
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
    padding: 1rem;
    border-top: 5px solid var(--vf-primary);
}

.visitor-card-top,
.visitor-card-actions,
.visitor-contact-list,
.visitor-mini-grid {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    align-items: center;
}

.visitor-card-top { justify-content: space-between; }
.visitor-admin-card h2 { font-size: 1.15rem; margin: .8rem 0 .55rem; font-weight: 800; }
.visitor-contact-list span,
.visitor-mini-grid span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .38rem .55rem;
    border-radius: 999px;
    background: rgba(100, 116, 139, .08);
    color: #334155;
    font-size: .86rem;
}

.visitor-note {
    margin-top: .8rem;
    padding: .8rem;
    border-radius: 16px;
    background: rgba(248, 181, 71, .14);
}

.visitor-select-box input { width: 1.1rem; height: 1.1rem; }
.visitor-inline-form {
    display: grid;
    gap: .75rem;
    padding: .75rem;
    border-radius: 18px;
    background: rgba(96, 87, 233, .06);
}

.visitor-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    border-radius: 24px;
    padding: 2rem;
    background: linear-gradient(135deg, rgba(96, 87, 233, .08), rgba(248,181,71,.14));
    color: var(--vf-primary-dark);
    font-weight: 800;
}

.visitor-empty i { font-size: 2rem; }

@media (max-width: 767.98px) {
    .visitor-admin-hero { align-items: flex-start; flex-direction: column; }
    .visitor-admin-hero-actions, .visitor-admin-hero-actions .btn { width: 100%; }
    .visitor-filter-panel, .visitor-qr-form, .visitor-bulk-bar { grid-template-columns: 1fr; }
}