.site-header--preview-shell[hidden] { display: none !important; }

    .site-header--preview-shell {
      display: block;
      height: auto;
      min-height: 0;
    }

    .occ-preview-shell {
      max-width: var(--shell-max);
      margin: 0 auto;
      padding: .875rem var(--content-pad);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--space-md);
    }

    .occ-preview-shell__brand {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: .15rem;
    }

    .occ-preview-shell__home {
      color: var(--text-inverse);
      font-size: .78rem;
      font-weight: 700;
      letter-spacing: .06em;
      text-decoration: none;
      text-transform: uppercase;
      opacity: .84;
    }

    .occ-preview-shell__title {
      color: var(--text-inverse);
      font-size: .95rem;
      font-weight: 700;
      line-height: 1.25;
    }

    /* ├── Wizard shell ── */
    body {
      background: var(--surface-bg);
      padding: 0;
      margin: 0;
    }

    .wiz-header {
      background: var(--header-grad);
      color: var(--text-inverse);
      padding: var(--space-xl) var(--space-xl);
      display: flex;
      align-items: center;
      gap: var(--space-lg);
    }
    .wiz-header-logo {
      width: 54px;
      height: 54px;
      object-fit: contain;
      border-radius: var(--radius-md);
      background: rgba(255,255,255,.16);
      padding: 6px;
      flex-shrink: 0;
    }
    .wiz-header-copy {
      min-width: 0;
    }
    .occ-onboard-breadcrumb {
      color: var(--text-inverse);
    }
    .wiz-header h1 { font-size: 1.18rem; font-weight: 800; margin: 0; line-height: var(--lh-tight); letter-spacing: -.02em; }
    .wiz-header p  { font-size: .82rem; margin: .28rem 0 0; opacity: .84; }

    body.occ-onboard-preview .wiz-header {
      max-width: var(--shell-max);
      margin: 1.25rem auto 0;
      padding: var(--space-lg) var(--content-pad);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-lg);
    }

    .wiz-progress {
      background: var(--purple-50);
      padding: var(--space-md) var(--space-xl);
      display: flex;
      align-items: center;
      gap: var(--space-md);
      font-size: var(--fs-small);
      color: var(--purple-700);
      font-weight: 600;
      border-bottom: 1px solid var(--border-light);
    }

    .wiz-progress-bar {
      flex: 1;
      height: 8px;
      background: rgba(90,24,154,.14);
      border-radius: var(--radius-full);
      overflow: hidden;
    }
    .wiz-progress-fill {
      height: 100%;
      background: var(--progress-fill);
      border-radius: var(--radius-full);
      transition: width .4s ease;
    }

    body.occ-onboard-preview .wiz-progress {
      max-width: var(--shell-max);
      margin: 0 auto;
      border-radius: 0 0 var(--radius-xl) var(--radius-xl);
      box-shadow: var(--shadow-lg);
      border: 1px solid var(--border-light);
      border-top: 0;
    }

    .wiz-body { max-width: var(--shell-max); margin: 0 auto; padding: var(--space-3xl) var(--content-pad) 8rem; }
    .wiz-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: var(--space-xl);
      align-items: start;
    }
    .wiz-sidebar {
      min-width: 0;
    }
    .wiz-main {
      min-width: 0;
      width: 100%;
      max-width: 860px;
      justify-self: center;
    }
    @media (min-width: 1180px) {
      .wiz-layout {
        grid-template-columns: 320px minmax(0, 860px);
        justify-content: center;
      }
      .wiz-sidebar {
        position: sticky;
        top: var(--space-xl);
      }
      .wiz-main {
        max-width: 860px;
        justify-self: stretch;
      }
    }

    .status-card {
      background: var(--surface-card);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-lg);
      padding: var(--space-lg) var(--space-lg);
      margin-bottom: 1.1rem;
    }
    .status-card-title {
      font-size: var(--fs-xs);
      font-weight: 800;
      letter-spacing: .09em;
      text-transform: uppercase;
      color: var(--purple-700);
      margin: 0 0 var(--space-xs);
    }
    .status-card-copy {
      font-size: var(--fs-small);
      color: var(--text-muted);
      line-height: var(--lh-body);
      margin: 0 0 var(--space-md);
    }
    .pack-overview {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-sm);
      margin-bottom: var(--space-md);
    }
    .pack-overview-btn {
      text-align: left;
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      background: rgba(255,255,255,.86);
      padding: .72rem .85rem;
      cursor: pointer;
      transition: border-color var(--ease-micro), transform var(--ease-micro), box-shadow var(--ease-micro), background var(--ease-micro);
      min-height: 0;
    }
    .pack-overview-btn:hover:not(:disabled) {
      border-color: var(--purple-300);
      transform: translateY(-1px);
      box-shadow: var(--shadow-lg);
      background: var(--purple-50);
    }
    .pack-overview-btn:disabled {
      cursor: not-allowed;
      opacity: .72;
    }
    .pack-overview-btn.done {
      border-color: var(--color-success);
      background: var(--color-success-bg);
    }
    .pack-overview-btn.current {
      border-color: var(--purple-700);
      background: var(--purple-100);
      box-shadow: inset 0 0 0 1px var(--purple-300);
    }
    .pack-overview-btn.ready {
      border-color: var(--orange-500);
      background: var(--orange-50);
    }
    .pack-overview-kicker {
      display: block;
      font-size: .67rem;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: .18rem;
    }
    .pack-overview-btn.current .pack-overview-kicker { color: var(--purple-700); }
    .pack-overview-btn.done .pack-overview-kicker { color: var(--color-success); }
    .pack-overview-btn.ready .pack-overview-kicker { color: var(--orange-600); }
    .pack-overview-title {
      display: block;
      font-size: .88rem;
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: .1rem;
    }
    .pack-overview-note {
      display: block;
      font-size: .76rem;
      line-height: 1.4;
      color: var(--text-muted);
    }
    .upload-hint {
      margin: var(--space-xs) 0 0;
      color: var(--text-muted);
      font-size: var(--fs-small);
      line-height: 1.45;
    }
    .status-panel {
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      background: rgba(255,255,255,.78);
      padding: var(--space-md) var(--space-md);
    }
    .status-panel h3 {
      margin: 0 0 var(--space-md);
      font-size: var(--fs-xs);
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-muted);
    }
    .step-status-list,
    .current-step-checks {
      list-style: none;
      margin: 0;
      padding: 0;
    }
    .step-status-list li,
    .current-step-checks li {
      display: flex;
      align-items: flex-start;
      gap: .65rem;
      font-size: .84rem;
      line-height: 1.45;
      color: var(--text-primary);
      padding: .38rem 0;
    }
    .step-status-list li + li,
    .current-step-checks li + li {
      border-top: 1px solid var(--border-light);
    }
    .step-status-badge,
    .check-bullet {
      width: 1.45rem;
      height: 1.45rem;
      border-radius: var(--radius-full);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      font-size: .72rem;
      font-weight: 800;
      margin-top: .05rem;
    }
    .step-status-list li.done .step-status-badge,
    .current-step-checks li.done .check-bullet {
      background: var(--color-success-bg);
      color: var(--color-success);
    }
    .step-status-list li.current .step-status-badge,
    .current-step-checks li.current .check-bullet {
      background: var(--purple-100);
      color: var(--purple-700);
    }
    .step-status-list li.upcoming .step-status-badge,
    .current-step-checks li.upcoming .check-bullet {
      background: #f3f4f6;
      color: var(--text-muted);
    }
    .step-status-list li.ready .step-status-badge,
    .current-step-checks li.ready .check-bullet {
      background: var(--orange-50);
      color: var(--orange-600);
    }
    .step-status-label strong {
      display: block;
      font-size: .84rem;
      color: var(--text-primary);
      margin-bottom: .1rem;
    }
    .step-status-label span {
      display: block;
      font-size: .78rem;
      color: var(--text-muted);
    }
    @media (max-width: 760px) {
      .status-grid { grid-template-columns: 1fr; }
    }

    /* ├── Step cards ── */
    .wiz-step { display: none; }
    .wiz-step.active { display: block; }

    .step-card {
      background: var(--surface-card);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-lg);
      padding: var(--space-2xl) var(--space-2xl);
      margin-bottom: 1.5rem;
    }

    .step-badge {
      display: inline-flex;
      align-items: center;
      gap: var(--space-xs);
      background: var(--purple-100);
      color: var(--purple-700);
      font-size: .7rem;
      font-weight: 700;
      padding: .3rem .875rem;
      border-radius: var(--radius-full);
      margin-bottom: 1.1rem;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    .step-title {
      font-size: 1.4rem;
      font-weight: 800;
      color: var(--purple-900);
      margin: 0 0 .5rem;
      line-height: var(--lh-tight);
    }

    .step-subtitle {
      font-size: .9rem;
      color: var(--text-muted);
      margin: 0 0 1.5rem;
      line-height: 1.6;
    }
    .step-context {
      font-size: .9rem;
      color: var(--text-muted);
      margin: 0 0 1.25rem;
      line-height: 1.6;
    }

    /* ├── Embedded form iframe ── */
    .form-iframe {
      width: 100%;
      border: 1.5px solid var(--border-light);
      border-radius: var(--radius-lg);
      display: block;
      min-height: 320px;
      margin-bottom: 1.5rem;
      background: var(--surface-card);
    }

    /* ├── Signature row ── */
    .sig-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: var(--space-lg);
      margin-top: var(--space-xl);
    }
    @media (max-width: 500px) { .sig-row { grid-template-columns: 1fr; } }

    /* ├── Alert boxes inside wizard ── */
    .wiz-alert {
      border-radius: var(--radius-md);
      padding: var(--space-md) var(--space-lg);
      font-size: var(--fs-small);
      line-height: 1.5;
      margin-bottom: var(--space-lg);
    }
    .wiz-alert.info    { background: var(--color-info-bg); color: var(--color-info); border: 1px solid var(--color-info-bg); }
    .wiz-alert.warning { background: var(--color-warning-bg); color: var(--color-warning); border: 1px solid var(--color-warning-bg); }
    .wiz-alert.success { background: var(--color-success-bg); color: var(--color-success); border: 1px solid var(--color-success-bg); }
    .wiz-alert.danger  { background: var(--color-danger-bg); color: var(--color-danger); border: 1px solid var(--color-danger-bg); }

    /* ├── Print-only section (TFN/Bank) ── */
    .print-section {
      border: 2px dashed var(--color-warning);
      border-radius: var(--radius-lg);
      padding: var(--space-xl);
      background: var(--color-warning-bg);
      margin-bottom: var(--space-lg);
    }
    .print-section-title {
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--color-warning);
      text-transform: uppercase;
      letter-spacing: .05em;
      margin-bottom: .875rem;
    }

    /* ├── Nav buttons ── */
    .wiz-nav { display: none !important; }
    .wizard-action-bar {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 40;
      display: flex;
      justify-content: center;
      padding: 1rem var(--content-pad) max(1rem, env(safe-area-inset-bottom));
      background: linear-gradient(180deg, rgba(247,242,251,0), rgba(247,242,251,.94) 20%, rgba(247,242,251,.99) 100%);
      pointer-events: none;
    }
    .wizard-action-bar-inner {
      width: min(1040px, 100%);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: .875rem;
      padding: .9rem 1rem;
      background: rgba(255,255,255,.96);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-lg);
      backdrop-filter: blur(8px);
      pointer-events: auto;
    }
    .wizard-action-copy {
      min-width: 0;
      flex: 1;
    }
    .wizard-action-kicker {
      display: block;
      font-size: .72rem;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: .2rem;
    }
    .wizard-action-title {
      display: block;
      font-size: .95rem;
      font-weight: 700;
      color: var(--text-primary);
      line-height: 1.3;
    }
    .wizard-action-buttons {
      display: flex;
      align-items: center;
      gap: .75rem;
      flex-shrink: 0;
    }
    @media (max-width: 760px) {
      .wizard-action-bar-inner {
        flex-direction: column;
        align-items: stretch;
      }
      .wizard-action-buttons {
        width: 100%;
        justify-content: stretch;
      }
      .wizard-action-buttons .btn-wiz-back,
      .wizard-action-buttons .btn-wiz-next {
        flex: 1;
      }
    }

    .btn-wiz-next {
      background: var(--purple-700);
      color: var(--text-inverse);
      border: none;
      border-radius: var(--radius-md);
      padding: .8125rem 2rem;
      font-size: var(--fs-body);
      font-weight: 700;
      cursor: pointer;
      transition: background var(--ease-micro), transform .1s, box-shadow var(--ease-micro);
      letter-spacing: .01em;
      min-height: 44px;
    }
    .btn-wiz-next:hover { background: var(--purple-900); transform: translateY(-1px); box-shadow: var(--shadow-lg); }
    .btn-wiz-next:active { transform: translateY(0); }
    .btn-wiz-next:disabled { opacity: .4; cursor: not-allowed; transform: none; }

    .btn-wiz-back {
      background: var(--surface-card);
      border: 1.5px solid var(--border-light);
      color: var(--purple-900);
      border-radius: var(--radius-md);
      padding: .8rem 1.375rem;
      font-size: var(--fs-body);
      font-weight: 700;
      cursor: pointer;
      transition: border-color var(--ease-micro), color var(--ease-micro), background var(--ease-micro), transform var(--ease-micro);
      min-height: 44px;
    }
    .btn-wiz-back:hover { border-color: var(--purple-300); background: var(--purple-50); color: var(--purple-900); transform: translateY(-1px); }

    .btn-print {
      background: var(--orange-action);
      color: var(--text-inverse);
      border: none;
      border-radius: var(--radius-md);
      padding: .8125rem 1.75rem;
      font-size: var(--fs-body);
      font-weight: 700;
      cursor: pointer;
      transition: background var(--ease-micro), transform var(--ease-micro), box-shadow var(--ease-micro);
      min-height: 44px;
    }
    .btn-print:hover { background: var(--orange-600); transform: translateY(-1px); box-shadow: var(--shadow-lg); }

    /* ├── Success flash on save ── */
    .btn-wiz-next.saved {
      background: var(--color-success) !important;
    }

    /* ├── Phase interstitial checklist ── */
    .phase-checklist {
      list-style: none;
      padding: 0;
      margin: var(--space-md) 0 0;
    }
    .phase-checklist li {
      display: flex;
      align-items: center;
      gap: var(--space-sm);
      font-size: var(--fs-small);
      color: var(--color-success);
      padding: .2rem 0;
    }
    .phase-checklist li::before {
      content: 'Done';
      font-weight: 700;
      color: var(--color-success);
      flex-shrink: 0;
    }

    /* ├── Phase divider ── */
    .phase-divider {
      border: none;
      border-top: 1.5px solid var(--border-light);
      margin: var(--space-xl) 0;
    }

    /* ├── Action-required card (external process) ── */
    .download-card.action-card { cursor: pointer; }
    .download-card .action-label { font-size: .72rem; font-weight: 700; color: var(--color-warning); text-transform: uppercase; letter-spacing: .05em; margin-top: .15rem; }

    /* ├── Token error/loading states ── */
    #tokenGate {
      min-height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: var(--space-2xl);
    }
    .gate-card {
      background: var(--surface-card);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-2xl);
      box-shadow: var(--shadow-xl);
      padding: 2.5rem 2rem;
      max-width: 420px;
      width: 100%;
      text-align: center;
    }
    .gate-card h2 { font-size: var(--fs-h3); color: var(--purple-900); margin-bottom: var(--space-sm); }
    .gate-card p { font-size: .9rem; color: var(--text-muted); line-height: 1.6; }

    /* ├── Acknowledgement checkbox row ── */
    .ack-item {
      display: flex;
      align-items: flex-start;
      gap: var(--space-md);
      padding: .6rem .875rem;
      border: 1.5px solid var(--border-light);
      border-radius: var(--radius-lg);
      margin-bottom: var(--space-sm);
      cursor: pointer;
      transition: border-color var(--ease-micro), background var(--ease-micro), transform var(--ease-micro);
      min-height: 44px;
    }
    .ack-item:hover { border-color: var(--purple-300); background: var(--purple-50); transform: translateY(-1px); }
    .ack-item input[type=checkbox] { margin-top: .15rem; flex-shrink: 0; accent-color: var(--purple-700); width: 16px; height: 16px; }
    .ack-item label { font-size: var(--fs-small); color: var(--text-primary); line-height: 1.5; cursor: pointer; }

    /* ├── Download step ── */
    .download-card {
      border: 1.5px solid var(--border-light);
      border-radius: var(--radius-xl);
      padding: var(--space-lg) var(--space-xl);
      display: flex;
      align-items: center;
      gap: var(--space-lg);
      margin-bottom: var(--space-md);
      text-decoration: none;
      color: var(--text-primary);
      transition: border-color var(--ease-micro), background var(--ease-micro), transform var(--ease-micro), box-shadow var(--ease-micro);
    }
    .download-card:hover { border-color: var(--purple-300); background: var(--purple-50); transform: translateY(-1px); box-shadow: var(--shadow-lg); }
    .download-icon {
      width: 40px; height: 40px; border-radius: var(--radius-md);
      display: flex; align-items: center; justify-content: center;
      background: var(--purple-100); color: var(--purple-700); flex-shrink: 0;
      font-size: 1.1rem; font-weight: 700;
    }
    .download-label { font-size: .9rem; font-weight: 600; }
    .download-desc  { font-size: .8rem; color: var(--text-muted); }

    /* ├── Section heading ── */
    .section-subheading {
      font-size: var(--fs-xs);
      font-weight: 700;
      color: var(--text-subtle);
      text-transform: uppercase;
      letter-spacing: .08em;
      margin: var(--space-xl) 0 .625rem;
    }
    .section-subheading:first-child { margin-top: 0; }

    /* ├── File upload inputs ── */
    .file-input {
      display: block;
      width: 100%;
      padding: .45rem .6rem;
      font-size: var(--fs-small);
      border: 1.5px solid var(--border-light);
      border-radius: var(--radius-sm);
      background: var(--purple-50);
      cursor: pointer;
    }
    .file-input:focus { outline: none; border-color: var(--purple-700); }
    .field-hint {
      font-size: .78rem;
      color: var(--text-muted);
      margin: .3rem 0 0;
    }
    .req { color: var(--color-danger); font-weight: 700; }

    /* ├── Step 6: ATO confirmation groups ── */
    .ato-confirm-group {
      display: grid;
      gap: var(--space-xs);
      margin-bottom: var(--space-sm);
    }
    .ato-confirm-label {
      display: flex;
      align-items: flex-start;
      gap: var(--space-sm);
      font-size: var(--fs-small);
      color: var(--text-primary);
      cursor: pointer;
      padding: var(--space-xs) 0;
    }
    .ato-confirm-label input[type=radio],
    .ato-confirm-label input[type=checkbox] {
      margin-top: .15rem;
      width: 15px;
      height: 15px;
      flex-shrink: 0;
      accent-color: var(--purple-700);
    }

    /* ├── Step 6: Collapsible ATO guide steps ── */
    .ato-guide {
      display: grid;
      gap: var(--space-sm);
      margin-bottom: var(--space-lg);
    }
    .ato-step {
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      background: var(--surface-card);
      overflow: hidden;
      transition: box-shadow var(--ease-micro);
    }
    .ato-step:hover {
      box-shadow: var(--shadow-sm);
    }
    .ato-step-header {
      display: flex;
      align-items: center;
      gap: var(--space-sm);
      padding: .7rem 1rem;
      cursor: pointer;
      user-select: none;
      transition: background var(--ease-micro);
      min-height: 44px;
    }
    .ato-step-header:hover {
      background: var(--purple-50);
    }
    .ato-step-number {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 1.6rem;
      height: 1.6rem;
      border-radius: var(--radius-full);
      background: var(--purple-100);
      color: var(--purple-700);
      font-size: .72rem;
      font-weight: 800;
      flex-shrink: 0;
    }
    .ato-step-header[data-accent="orange"] .ato-step-number {
      background: var(--orange-100);
      color: var(--orange-600);
    }
    .ato-step-title {
      flex: 1;
      font-size: .88rem;
      font-weight: 700;
      color: var(--text-primary);
      line-height: 1.3;
    }
    .ato-step-toggle {
      font-size: .72rem;
      color: var(--text-muted);
      flex-shrink: 0;
      transition: transform var(--ease-micro);
    }
    .ato-step.open .ato-step-toggle {
      transform: rotate(180deg);
    }
    .ato-step-body {
      display: none;
      padding: 0 1rem .9rem;
      border-top: 1px solid var(--border-light);
    }
    .ato-step.open .ato-step-body {
      display: block;
    }
    .ato-step-body .ato-mockup {
      margin-top: .75rem;
      border: 1px solid var(--border-light);
      border-radius: var(--radius-md);
      background: var(--surface-white);
      padding: .75rem;
    }
    .ato-step-body .ato-mockup-header {
      background: var(--purple-700);
      color: var(--text-inverse);
      border-radius: var(--radius-md) var(--radius-md) 0 0;
      padding: .45rem .7rem;
      font-size: .78rem;
      font-weight: 700;
      margin: -.75rem -.75rem .5rem;
    }
    .ato-step-body .ato-mockup-row {
      border: 1px solid var(--border-light);
      border-radius: var(--radius-md);
      padding: .55rem .7rem;
      font-size: .82rem;
      margin-bottom: .4rem;
    }
    .ato-step-body .ato-mockup-row:last-child {
      margin-bottom: 0;
    }
    .ato-step-body .ato-mockup-row.highlight {
      border-width: 2px;
      border-color: var(--purple-700);
      font-weight: 700;
      color: var(--purple-900);
    }
    .ato-step-body .ato-mockup-row.highlight-orange {
      border-width: 2px;
      border-color: var(--orange-500);
      font-weight: 700;
      color: var(--orange-600);
    }
    .ato-step-body .ato-mockup-detail {
      display: grid;
      gap: .55rem;
    }
    .ato-step-body .ato-mockup-field {
      display: grid;
      gap: .2rem;
    }
    .ato-step-body .ato-mockup-field-label {
      font-size: .72rem;
      color: var(--text-muted);
    }
    .ato-step-body .ato-mockup-field-value {
      border: 1px solid var(--border-light);
      border-radius: var(--radius-md);
      padding: .55rem .7rem;
      font-size: .82rem;
      font-weight: 700;
    }
    .ato-step-body .ato-mockup-field-value.dashed {
      border-style: dashed;
      color: var(--text-muted);
      font-weight: 400;
    }
    .ato-step-body .ato-step-desc {
      margin: .65rem 0 0;
      font-size: .82rem;
      line-height: 1.6;
      color: var(--text-muted);
    }
    .ato-step-body .ato-step-desc a {
      color: var(--purple-700);
      font-weight: 700;
    }
    .ato-step-body .ato-check-row {
      display: flex;
      align-items: flex-start;
      gap: .55rem;
      border: 1px solid var(--color-success-bg);
      border-radius: var(--radius-md);
      padding: .6rem .7rem;
      background: var(--color-success-bg);
      margin-bottom: .4rem;
    }
    .ato-step-body .ato-check-row:last-child {
      margin-bottom: 0;
    }
    .ato-step-body .ato-check-icon {
      font-size: 1rem;
      color: var(--color-success);
      line-height: 1;
      flex-shrink: 0;
    }
    .ato-step-body .ato-check-label {
      font-size: .83rem;
      color: var(--color-success);
      font-weight: 700;
    }
    .ato-step-body .ato-check-sub {
      font-size: .78rem;
      color: var(--text-muted);
      font-weight: 400;
    }
    .ato-step-body .ato-start-btn {
      display: inline-block;
      background: var(--purple-700);
      color: var(--text-inverse);
      border-radius: var(--radius-md);
      padding: .55rem 1rem;
      font-size: .82rem;
      font-weight: 700;
      text-align: center;
    }
    .ato-step-body .ato-start-wrap {
      display: flex;
      justify-content: flex-end;
    }

    /* ├── Step 6: Fallback card ── */
    .ato-fallback {
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      background: var(--surface-card);
      padding: .85rem 1rem;
      margin-bottom: var(--space-lg);
    }
    .ato-fallback-header {
      font-size: .68rem;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: .35rem;
    }
    .ato-fallback p {
      margin: 0 0 .55rem;
      font-size: .83rem;
      line-height: 1.55;
      color: var(--text-muted);
    }
    .ato-fallback-links {
      display: flex;
      flex-wrap: wrap;
      gap: .75rem 1rem;
    }
    .ato-fallback-links a {
      font-size: .82rem;
      color: var(--purple-700);
      font-weight: 700;
    }

    /* ├── Step 6: Declaration cards (TFN / Super) ── */
    .declaration-card {
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      background: var(--surface-card);
      padding: var(--space-lg);
      margin-bottom: var(--space-lg);
      border-left: 3px solid var(--purple-700);
      transition: box-shadow var(--ease-micro);
    }
    .declaration-card:hover {
      box-shadow: var(--shadow-sm);
    }
    .declaration-card-title {
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: var(--space-sm);
    }
    .declaration-card .ato-confirm-group {
      margin-bottom: var(--space-sm);
    }
    .declaration-card .upload-panel {
      margin-top: var(--space-sm);
      margin-bottom: 0;
    }
    .declaration-card .ato-confirm-label {
      padding: var(--space-xs) 0;
    }
    .declaration-card .field-hint {
      margin-top: var(--space-xs);
    }
    .declaration-card .upload-panel p {
      margin-bottom: var(--space-sm);
    }
    .declaration-card .upload-panel .file-input {
      margin-bottom: 0;
    }

    /* ├── Step 6: Section dividers ── */
    .section-divider {
      display: flex;
      align-items: center;
      gap: var(--space-md);
      margin: var(--space-2xl) 0 var(--space-lg);
      border: none;
      padding: 0;
    }
    .section-divider::before {
      content: '';
      flex: 1;
      height: 2px;
      background: var(--purple-200);
      border-radius: 1px;
    }
    .section-divider-label {
      display: inline-flex;
      align-items: center;
      gap: var(--space-xs);
      color: var(--purple-700);
      font-size: .78rem;
      font-weight: 700;
      letter-spacing: .02em;
      white-space: nowrap;
      flex-shrink: 0;
    }
    .section-divider-label .section-divider-icon {
      font-size: 1rem;
      line-height: 1;
    }

    /* ├── Step 6: Upload panels ── */
    .upload-panel {
      padding: var(--space-md) var(--space-lg);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      background: var(--color-warning-bg);
      margin-bottom: var(--space-md);
    }
    .upload-panel p {
      margin: 0 0 var(--space-sm);
      font-size: var(--fs-small);
      line-height: 1.55;
      color: var(--text-primary);
    }
    .upload-panel .download-links {
      display: flex;
      flex-wrap: wrap;
      gap: .75rem 1rem;
    }
    .upload-panel .download-links a {
      font-size: var(--fs-small);
      color: var(--purple-700);
      font-weight: 700;
      text-decoration: none;
    }
    .upload-panel .download-links a:hover {
      text-decoration: underline;
    }

    /* ├── Step 6: File upload groups ── */
    .file-group {
      margin-bottom: var(--space-lg);
    }
    .file-group label {
      display: block;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: var(--space-xs);
    }
    .file-group label .label-note {
      font-weight: 400;
      color: var(--text-muted);
    }
    .file-group .expiry-row {
      display: flex;
      align-items: center;
      gap: var(--space-sm);
      margin-top: var(--space-xs);
    }
    .file-group .expiry-row label {
      font-size: var(--fs-small);
      font-weight: 600;
      color: var(--text-primary);
      margin-bottom: 0;
      white-space: nowrap;
    }
    .expiry-input {
      max-width: 200px;
    }

    /* ├── Step 6: Compliance grid ── */
    .compliance-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-lg);
    }
    @media (min-width: 760px) {
      .compliance-grid {
        grid-template-columns: 1fr 1fr;
      }
    }
    .compliance-item {
      background: var(--surface-card);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      padding: var(--space-lg);
    }
    .compliance-item label {
      display: block;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: var(--space-xs);
    }
    .compliance-item label .label-note {
      font-weight: 400;
      color: var(--text-muted);
    }

    /* ├── Step 6: Identity documents grid ── */
    .identity-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--space-lg);
    }
    @media (min-width: 760px) {
      .identity-grid {
        grid-template-columns: 1fr 1fr;
      }
    }
    .identity-item {
      background: var(--surface-card);
      border: 1px solid var(--border-light);
      border-radius: var(--radius-lg);
      padding: var(--space-lg);
      border-left: 3px solid var(--purple-700);
      transition: box-shadow var(--ease-micro);
    }
    .identity-item:hover {
      box-shadow: var(--shadow-md);
    }
    .identity-item label {
      display: block;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: var(--space-xs);
    }
    .identity-item label .label-note {
      font-weight: 400;
      color: var(--text-muted);
    }
    .identity-item .file-input {
      margin-bottom: var(--space-xs);
    }
    .identity-points-badge {
      display: inline-flex;
      align-items: center;
      gap: .25rem;
      background: var(--purple-100);
      color: var(--purple-700);
      font-size: .72rem;
      font-weight: 700;
      padding: .2rem .65rem;
      border-radius: var(--radius-full);
      margin-left: var(--space-xs);
      white-space: nowrap;
    }
    .identity-points-badge.highlight {
      background: var(--purple-700);
      color: var(--text-inverse);
    }
    .identity-divider {
      border: none;
      border-top: 1.5px dashed var(--border-light);
      margin: var(--space-md) 0;
      grid-column: 1 / -1;
    }
    .identity-summary {
      display: flex;
      align-items: center;
      gap: var(--space-sm);
      padding: var(--space-md) var(--space-lg);
      background: var(--color-success-bg);
      border: 1px solid var(--color-success);
      border-radius: var(--radius-lg);
      font-size: var(--fs-small);
      color: var(--color-success);
      font-weight: 700;
      grid-column: 1 / -1;
    }
    .identity-summary .check-icon {
      font-size: 1.1rem;
      flex-shrink: 0;
    }

    /* ├── Step 6: VEVO warning panel ── */
    .vevo-panel {

      display: none;
      padding: var(--space-lg);
      border: 1.5px solid var(--color-warning);
      border-radius: var(--radius-lg);
      background: var(--color-warning-bg);
      margin-bottom: var(--space-lg);
    }
    .vevo-panel.visible { display: block; }
    .vevo-panel label {
      display: block;
      font-size: var(--fs-small);
      font-weight: 700;
      color: var(--text-primary);
      margin-bottom: var(--space-xs);
    }
    .vevo-panel .field-hint {
      margin-bottom: var(--space-sm);
    }
    .vevo-panel .field-hint a {
      color: var(--color-warning);
      font-weight: 700;
    }

    /* ├── Step 6: Upload status ── */
    #part2UploadStatus {
      display: none;
      margin-top: var(--space-lg);
    }
    #part2UploadStatus.visible { display: block; }

    /* ├── Iframe loading placeholder ── */

    .iframe-loading {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 300px;
      font-size: var(--fs-small);
      color: var(--purple-700);
      background: var(--purple-50);
      border-radius: var(--radius-lg);
      margin-bottom: 1.5rem;
      gap: var(--space-sm);
    }

    /* ├── Responsive: Step 6 mobile layout ── */
    @media (max-width: 760px) {
      .compliance-grid { grid-template-columns: 1fr; }
      .identity-grid { grid-template-columns: 1fr; }
      .file-group .expiry-row {

        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-xs);
      }
      .file-group .expiry-row label { white-space: normal; }
      .expiry-input { max-width: 100%; width: 100%; }
      .vevo-panel { padding: var(--space-md); }
      .upload-panel { padding: var(--space-md); }
      .compliance-item { padding: var(--space-md); }
      .ato-confirm-group { gap: var(--space-sm); }
    }
    @media (max-width: 500px) {
      .sig-row { grid-template-columns: 1fr; }
      .step-card { padding: var(--space-lg) var(--space-md); }
    }

    /* Print styles for the final secure HR pack step */
    @media print {
      .wiz-header, .wiz-progress, .wiz-nav, .wizard-action-bar,
      .wiz-step:not(#step6) { display: none !important; }
      #step6 { display: block !important; }
      body { background: var(--surface-white); }
      .print-section { border: 1px solid #999; background: var(--surface-white); }
      .step-card { box-shadow: none; border: 1px solid #ccc; page-break-inside: avoid; }
      .compliance-grid { grid-template-columns: 1fr 1fr; page-break-inside: avoid; }
      .compliance-item { border: 1px solid #ccc; box-shadow: none; page-break-inside: avoid; }
      .file-group, .upload-panel, .vevo-panel { page-break-inside: avoid; }
      .wiz-alert { page-break-inside: avoid; }
      .ack-item { border: 1px solid #ccc; box-shadow: none; }
    }

    /* ── Step 6 session warning modal ── */
    .s6-modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(15, 10, 30, 0.62);
      z-index: 9000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: var(--space-lg);
    }
    .s6-modal-overlay[hidden] { display: none !important; }
    .s6-modal {
      background: var(--surface-card);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-xl, 0 24px 48px rgba(0,0,0,.28));
      padding: var(--space-xl);
      max-width: 480px;
      width: 100%;
    }
    .s6-modal-icon {
      font-size: 2rem;
      margin-bottom: var(--space-md);
      line-height: 1;
    }
    .s6-modal h2 {
      font-size: 1.08rem;
      font-weight: 800;
      color: var(--text-primary);
      margin: 0 0 var(--space-sm);
      line-height: var(--lh-tight);
    }
    .s6-modal p {
      font-size: .9rem;
      color: var(--text-secondary);
      margin: 0 0 var(--space-sm);
      line-height: 1.6;
    }
    .s6-modal ul {
      font-size: .88rem;
      color: var(--text-secondary);
      margin: 0 0 var(--space-lg);
      padding-left: 1.2rem;
      line-height: 1.7;
    }
    .s6-modal-actions {
      display: flex;
      gap: var(--space-sm);
      flex-wrap: wrap;
    }
    .s6-modal-actions .btn-back {
      flex: 1;
      padding: .65rem var(--space-md);
      border-radius: var(--radius-md);
      border: 1.5px solid var(--border-default);
      background: var(--surface-bg);
      color: var(--text-secondary);
      font-size: .88rem;
      font-weight: 600;
      cursor: pointer;
    }
    .s6-modal-actions .btn-continue {
      flex: 2;
      padding: .65rem var(--space-md);
      border-radius: var(--radius-md);
      border: none;
      background: var(--purple-700);
      color: #fff;
      font-size: .88rem;
      font-weight: 700;
      cursor: pointer;
    }