/* ══════════════════════════════════════
   WIZARD SHELL + BAR
══════════════════════════════════════ */
.wiz-shell {
    padding-top: var(--header-h);
    min-height: calc(100dvh - var(--header-h));
    display: flex;
    flex-direction: column;
}

.wiz-bar {
    position: sticky;
    top: var(--header-h, 72px);
    z-index: 100;
    background: var(--c-glass-bg);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--c-border);
    box-shadow: 0 2px 16px var(--c-shadow);
    height: 68px;
    transition: top 0.3s ease;
}

.wiz-bar-inner {
    max-width: 860px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0 20px;
}

.wiz-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    text-decoration: none;
    color: var(--c-text-muted);
    transition: color var(--tr);
    padding: 0 12px;
    position: relative;
}
.wiz-step--active { color: var(--c-primary); }
.wiz-step--done   { color: var(--c-green); }
.wiz-step--locked { opacity: .45; pointer-events: none; cursor: default; }

.wiz-step-icon {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 2px solid currentColor;
    display: flex; align-items: center; justify-content: center;
    background: transparent;
    transition: background var(--tr), border-color var(--tr), box-shadow var(--tr);
    position: relative; flex-shrink: 0;
}
.wiz-step--active .wiz-step-icon {
    background: rgba(232,101,26,0.12);
    box-shadow: 0 0 0 4px rgba(232,101,26,0.14);
}
.wiz-step--done .wiz-step-icon { background: rgba(74,124,89,0.12); }

.wiz-done-tick {
    position: absolute; top: -4px; right: -4px;
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--c-green); color: #fff;
    display: flex; align-items: center; justify-content: center;
}
.wiz-step-label { font-size: 11px; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }

.wiz-connector {
    flex: 1; height: 2px;
    background: var(--c-border); border-radius: 2px;
    max-width: 80px; transition: background .4s;
}
.wiz-connector--done { background: var(--c-green); }

.wiz-main { flex: 1; display: flex; flex-direction: column; }