@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@600;700;800&display=swap');

    .passport-create { max-width: 1040px; margin: 12px auto 48px; padding: 0 20px; font-family: 'Inter', sans-serif; }
    .passport-create.guest-mode { max-width: 1040px; margin: 24px auto 48px; padding: 0 20px; }
    @media (max-width: 640px) {
        .passport-create,
        .passport-create.guest-mode { margin: 18px auto 40px; padding: 0 14px; }
    }

    /* ── Hero banner ─────────────────────────────────────────── */
    .pc-hero {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 22px;
        background: linear-gradient(135deg, #0f172a 0%, #1e293b 62%, #0b3f7a 100%);
        border-radius: 24px;
        padding: 28px 28px 30px;
        margin-bottom: 24px;
        position: relative;
        overflow: hidden;
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
    }
    .pc-hero::before {
        content: '';
        position: absolute;
        right: -30px; bottom: -40px;
        width: 180px; height: 180px;
        border-radius: 50%;
        background: rgba(255,255,255,0.07);
        pointer-events: none;
    }
    .pc-hero::after {
        content: '';
        position: absolute;
        right: 80px; top: -55px;
        width: 130px; height: 130px;
        border-radius: 50%;
        background: rgba(255,255,255,0.05);
        pointer-events: none;
    }
    .pc-hero-main { display:flex; align-items:flex-start; gap:16px; max-width:580px; position:relative; z-index:1; }
    .pc-hero-overview { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; min-width:320px; position:relative; z-index:1; }
    .pc-hero-icon {
        width: 44px; height: 44px;
        background: rgba(255,255,255,0.15);
        border-radius: 12px;
        display: flex; align-items: center; justify-content: center;
        flex-shrink: 0;
        backdrop-filter: blur(4px);
    }
    .pc-hero-icon svg { width: 24px; height: 24px; color: #fff; }
    .pc-hero h1 {
        font-size: clamp(1.55rem, 3vw, 2.1rem); color: #fff !important;
        font-weight: 900; margin-bottom: 6px;
        font-family: 'Plus Jakarta Sans', sans-serif;
        letter-spacing: -0.5px; line-height: 1.12;
    }
    .pc-hero .subtitle {
        color: rgba(255,255,255,0.78) !important;
        margin-bottom: 0 !important;
        font-size: 0.94rem;
        line-height:1.65;
    }
    .pc-hero-actions {
        display:flex;
        flex-wrap:wrap;
        gap:10px;
        margin-top:16px;
    }
    .pc-hero-actions.single-action .pc-hero-action { width: 100%; }
    .pc-hero-action {
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-height:44px;
        padding:11px 16px;
        border-radius:12px;
        border:1px solid rgba(255,255,255,0.18);
        font-size:0.88rem;
        font-weight:800;
        text-decoration:none;
        cursor:pointer;
        transition:all 0.18s ease;
    }
    .pc-hero-action:hover { text-decoration:none; transform:translateY(-1px); }
    .pc-hero-action-primary {
        background:#fff;
        color:#0b3f7a;
        box-shadow:0 10px 22px rgba(15,23,42,0.18);
    }
    .pc-hero-action-primary:hover { color:#08335f; background:#f8fbff; }
    .pc-hero-action-secondary {
        background:rgba(255,255,255,0.08);
        color:#fff;
        border-color:rgba(255,255,255,0.22);
    }
    .pc-hero-action-secondary:hover { color:#fff; background:rgba(255,255,255,0.16); }
    .pc-hero-microcopy {
        margin:10px 0 0;
        color:#cbd5e1 !important;
        font-size:0.8rem;
        line-height:1.45;
    }
    .pc-hero-badge {
        display: inline-flex; align-items: center; gap: 5px;
        background: rgba(255,255,255,0.18);
        color: #fff;
        padding: 3px 10px 3px 8px;
        border-radius: 20px;
        font-size: 0.72rem; font-weight: 600;
        margin-bottom: 12px;
        letter-spacing: 0.5px; text-transform: uppercase;
    }
    .pc-hero-badge svg { width: 10px; height: 10px; }
    .pc-hero-stat {
        background: rgba(255,255,255,0.12);
        border: 1px solid rgba(255,255,255,0.16);
        border-radius: 16px;
        padding: 14px 16px;
        backdrop-filter: blur(10px);
    }
    .pc-hero-stat-label { font-size:0.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:#93c5fd; margin-bottom:6px; }
    .pc-hero-stat-value { font-size:1.02rem; font-weight:900; color:#fff; margin-bottom:4px; }
    .pc-hero-stat-copy { font-size:0.8rem; color:#cbd5e1; line-height:1.45; }
    @media (max-width: 900px) {
        .pc-hero { flex-direction:column; }
        .pc-hero-overview { width:100%; min-width:0; }
    }
    /* Smaller hero on mobile (banner was visually too tall) */
    @media (max-width: 600px) {
        .pc-hero { padding: 14px 14px; border-radius: 16px; gap: 10px; margin-bottom: 12px; box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14); }
        .pc-hero-main { gap: 10px; align-items: flex-start; }
        .pc-hero-icon { width: 38px; height: 38px; border-radius: 12px; }
        .pc-hero-icon svg { width: 20px; height: 20px; }
        .pc-hero-overview { display: none; }
        .pc-hero-badge { margin-bottom: 5px; font-size: 0.64rem; padding: 2px 8px; }
        .pc-hero h1 { font-size: 1.16rem; margin-bottom: 0; }
<<<<<<< HEAD
        .pc-hero .subtitle { display: none; }
        .pc-hero-main { width: 100%; }
        .pc-hero-main > div:last-child { flex: 1; min-width: 0; }
        .pc-hero-scan-now { display: inline-flex; }
=======
        .pc-hero .subtitle { display: block; font-size: 0.82rem; line-height: 1.45; margin-top: 6px; }
        .pc-hero-actions { margin-top: 12px; width: 100%; display:grid; grid-template-columns:1fr 1fr; }
        .pc-hero-actions.single-action { grid-template-columns: 1fr; }
        .pc-hero-action { width: 100%; min-height: 44px; padding: 10px 12px; font-size: 0.83rem; }
        .pc-hero-microcopy { font-size: 0.75rem; margin-top: 8px; }
>>>>>>> 38b6ad5 (polish(passport-create): speed up mobile entry)
        .passport-create .step-card#step1 { margin-top: 0; }
        .step-intro { display: none; }
        .upload-zone { margin-top: 0; padding: 18px 16px 15px; }
        .scan-link-secondary { margin-top: 14px; font-size: 0.82rem; }
    }

    /* ── Step cards ─────────────────────────────────────────── */
    .step-card {
        background: #fff;
        border-radius: 18px;
        padding: 24px 26px;
        margin-bottom: 18px;
        box-shadow: 0 16px 38px rgba(15,23,42,0.08);
        border: 1.5px solid #e8eef8;
        transition: box-shadow 0.2s, border-color 0.2s;
    }
    .step-card.active {
        border-color: #0b3f7a;
        box-shadow: 0 4px 24px rgba(37,99,235,0.12), 0 1px 4px rgba(0,0,0,0.04);
    }
    .step-card.done { border-color: #10b981; background: #f0fdf9; box-shadow: 0 2px 12px rgba(16,185,129,0.08); }
    .step-number {
        display: inline-flex; align-items: center; justify-content: center;
        width: 38px; height: 38px;
        border-radius: 50%;
        background: linear-gradient(135deg, #0b3f7a, #1e3a8a);
        color: #fff; font-weight: 700; font-size: 0.88rem;
        margin-right: 12px;
        box-shadow: 0 3px 10px rgba(37,99,235,0.3);
    }
    .step-number.done { background: linear-gradient(135deg, #059669, #10b981); box-shadow: 0 3px 10px rgba(16,185,129,0.3); }
    .step-title { font-size: 1.08rem; font-weight: 700; color: #1e293b; font-family: 'Plus Jakarta Sans', sans-serif; }
    .step-intro { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid #eef2f7; }
    .step-intro-copy { max-width:620px; }
    .step-kicker { display:inline-flex; align-items:center; gap:8px; font-size:0.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:#0b3f7a; margin-bottom:10px; }
    .step-side-note { min-width:220px; background:#f8fafc; border:1px solid #e2e8f0; border-radius:14px; padding:14px 16px; }
    .step-side-label { font-size:0.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:#94a3b8; margin-bottom:6px; }
    .step-side-title { font-size:0.95rem; font-weight:900; color:#0f172a; margin-bottom:4px; }
    .step-side-copy { font-size:0.82rem; color:#64748b; line-height:1.5; }
    @media (max-width: 720px) {
        .step-card { padding:20px 18px; }
        .step-intro { flex-direction:column; }
        .step-side-note { width:100%; min-width:0; }
    }

    /* ── Upload zone ────────────────────────────────────────── */
    .upload-zone {
        border: 2px dashed #c7d7f8;
        border-radius: 14px;
        padding: 22px 24px 18px;
        text-align: center;
        cursor: pointer;
        transition: all 0.25s;
        margin-top: 12px;
        background: #f8faff;
        position: relative;
    }
    .upload-zone:hover {
        border-color: #0b3f7a;
        background: rgba(22,112,191,0.08);
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(37,99,235,0.1);
    }
    .upload-zone.has-file { border-color: #0b3f7a; border-style: solid; background: rgba(22,112,191,0.08); }
    .upload-zone i { font-size: 1.8rem; color: #93afd9; margin-bottom: 6px; }
    .upload-zone .uz-title { color: #334155; font-size: 0.95rem; font-weight: 600; margin: 0 0 4px; }
    .upload-zone .uz-hint { color: #94a3b8; font-size: 0.8rem; margin: 0; }
    .upload-zone img { max-width: 280px; max-height: 200px; border-radius: 8px; margin-top: 12px; box-shadow: 0 4px 14px rgba(0,0,0,0.1); }
    .scan-file-status {
        margin-top: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        border: 1px solid #dbeafe;
        background: #f8fbff;
        color: #334155;
        font-size: 0.82rem;
        line-height: 1.45;
    }
    .scan-file-status strong { color: #0f172a; }
    .scan-file-status .scan-file-pill {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        margin-bottom: 6px;
        padding: 4px 10px;
        border-radius: 999px;
        background: rgba(22,112,191,0.08);
        color: #0b3f7a;
        font-size: 0.72rem;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    /* ── Buttons ────────────────────────────────────────────── */
    .scan-btn {
        background: linear-gradient(135deg, #1e3a8a 0%, #0b3f7a 100%);
        color: #fff; border: none;
        padding: 10px 24px;
        border-radius: 50px;
        font-size: 0.9rem; font-weight: 700;
        cursor: pointer; margin-top: 12px; width: 100%;
        letter-spacing: 0.3px;
        box-shadow: 0 4px 18px rgba(37,99,235,0.35);
        transition: all 0.2s;
    }
    .scan-btn:hover {
        box-shadow: 0 6px 24px rgba(37,99,235,0.45);
        transform: translateY(-1px);
        background: linear-gradient(135deg, #163a7e 0%, #2349d5 100%);
    }
    .scan-btn:disabled {
        background: linear-gradient(135deg, #93c5fd, #60a5fa);
        color: rgba(255,255,255,0.96);
        box-shadow: 0 4px 16px rgba(37,99,235,0.18);
        cursor: not-allowed;
        transform: none;
        opacity: 0.88;
    }
    .scan-btn.scan-btn-ready { opacity: 1; }
    .scan-link-secondary {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-top: 12px;
        color: #0b3f7a;
        font-size: 0.84rem;
        font-weight: 600;
        text-decoration: none;
        border-bottom: 1px solid rgba(37, 99, 235, 0.35);
        padding-bottom: 1px;
    }
    .scan-link-secondary:hover { color: #1e3a8a; text-decoration: none; border-bottom-color: rgba(30, 58, 138, 0.45); }

    .save-btn {
        background: linear-gradient(135deg, #059669 0%, #10b981 100%);
        color: #fff; border: none;
        padding: 15px 40px;
        border-radius: 50px;
        font-size: 1.05rem; font-weight: 700;
        cursor: pointer; width: 100%; margin-top: 12px;
        box-shadow: 0 4px 18px rgba(16,185,129,0.35);
        transition: all 0.2s;
    }
    .save-btn:hover {
        box-shadow: 0 6px 24px rgba(16,185,129,0.45);
        transform: translateY(-1px);
    }

    /* ── Scan status panel ───────────────────────────────────── */
    .scan-status { display: none; margin-top: 14px; }
    .scan-status.active { display: block; }
    .scan-busy-panel {
        display: grid;
        grid-template-columns: 40px 1fr;
        gap: 10px 12px;
        align-items: center;
        padding: 14px 16px;
        border: 1px solid rgba(22,112,191,0.30);
        border-radius: 14px;
        background: linear-gradient(135deg, rgba(22,112,191,0.08) 0%, #f8fbff 100%);
        box-shadow: 0 10px 28px rgba(37,99,235,0.12);
        text-align: left;
    }
    .scan-status .spinner { display: inline-block; width: 34px; height: 34px; border: 4px solid rgba(22,112,191,0.18); border-top-color: #0b3f7a; border-radius: 50%; animation: spin 0.8s linear infinite; }
    .scan-busy-title { margin: 0 0 3px; font-size: 0.96rem; font-weight: 900; color: #0f172a; }
    .scan-busy-copy { margin: 0; font-size: 0.8rem; line-height: 1.4; color: #475569; }
    .scan-busy-meta {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
        margin-top: 2px;
    }
    .scan-busy-pill {
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        padding: 4px 10px;
        border-radius: 999px;
        background: rgba(11,63,122,0.10);
        color: #0b3f7a;
        font-size: 0.72rem;
        font-weight: 900;
        letter-spacing: 0.02em;
    }
    .scan-busy-meta-copy { color: #64748b; font-size: 0.76rem; font-weight: 700; }
    .scan-busy-progress {
        grid-column: 1 / -1;
        height: 6px;
        border-radius: 999px;
        overflow: hidden;
        background: #e2e8f0;
        margin-top: 2px;
    }
    .scan-busy-progress-bar {
        height: 100%;
        width: 10%;
        border-radius: 999px;
        background: linear-gradient(90deg, #296aa2, #1670bf);
        transition: width 0.35s ease;
    }
    .scan-busy-steps { grid-column: 1 / -1; display: grid; gap: 5px; margin-top: 2px; }
    .scan-busy-step { display: flex; align-items: center; gap: 8px; color: #94a3b8; font-size: 0.78rem; font-weight: 800; }
    .scan-busy-dot { width: 8px; height: 8px; border-radius: 99px; background: #cbd5e1; box-shadow: 0 0 0 4px rgba(203,213,225,0.25); flex: 0 0 auto; }
    .scan-busy-step.active { color: #0b3f7a; }
    .scan-busy-step.active .scan-busy-dot { background: #0b3f7a; box-shadow: 0 0 0 5px rgba(37,99,235,0.16); animation: scan-pulse 1.1s ease-in-out infinite; }
    .scan-busy-step.done { color: #166534; }
    .scan-busy-step.done .scan-busy-dot { background: #16a34a; box-shadow: 0 0 0 4px rgba(22,163,74,0.14); }
    @keyframes scan-pulse { 0%, 100% { transform: scale(1); opacity: 0.75; } 50% { transform: scale(1.25); opacity: 1; } }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* ── Form fields ────────────────────────────────────────── */
    .review-fields { margin-top: 18px; }
    .review-fields label { font-weight: 600; font-size: 0.82rem; color: #374151; margin-bottom: 5px; display: block; text-transform: uppercase; letter-spacing: 0.4px; }
    .review-fields input, .review-fields select {
        width: 100%; padding: 11px 14px;
        border: 1.5px solid #e2e8f0;
        border-radius: 10px;
        font-size: 0.95rem; margin-bottom: 14px;
        font-family: 'Inter', sans-serif;
        transition: border-color 0.2s, box-shadow 0.2s;
        background: #fafbff;
    }
    .review-fields input:focus, .review-fields select:focus {
        border-color: #0b3f7a; outline: none;
        box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
        background: #fff;
    }
    .review-fields .serial-tip {
        margin: -8px 0 14px;
        color: #64748b;
        font-size: 0.78rem;
        font-weight: 600;
        line-height: 1.45;
    }

    .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    @media (max-width: 600px) { .field-row { grid-template-columns: 1fr; } }

    @media (max-width: 640px) {
        .cookies-box,
        .cookies-box.show {
            left: 12px;
            right: 12px;
            bottom: 12px;
            max-width: none;
            width: auto;
            padding: 12px 14px 14px;
            border-radius: 14px;
            z-index: 1200;
        }
        .cookies-box header { column-gap: 10px; }
        .cookies-box header h2 { font-size: 16px; }
        .cookies-box .data-content { margin-top: 10px; }
        .cookies-box .data-content p { font-size: 14px; line-height: 1.4; }
        .cookies-box .buttons { gap: 8px; }
        .cookies-box .buttons .button { width: 50%; font-size: 14px; padding: 9px 4px; }
    }

    /* ── AI badge ───────────────────────────────────────────── */
    .ai-badge {
        display: inline-flex; align-items: center; gap: 4px;
        background: #ecfdf5; color: #059669;
        padding: 4px 12px; border-radius: 20px;
        font-size: 0.74rem; font-weight: 700; margin-left: 10px;
        letter-spacing: 0.3px;
    }

    /* ── Confidence bar ─────────────────────────────────────── */
    .confidence-bar { height: 6px; background: #e8ecf1; border-radius: 3px; margin-top: 6px; overflow: hidden; }
    .confidence-bar .fill { height: 100%; border-radius: 3px; transition: width 0.6s ease; }
    .confidence-high { background: #10b981; }
    .confidence-medium { background: #f59e0b; }
    .confidence-low { background: #ef4444; }

    .back-to-create { display:inline-flex; align-items:center; gap:6px; color:#0b3f7a; font-size:0.88rem; font-weight:600; margin-bottom:18px; text-decoration:none; }
    .back-to-create:hover { color:#1e3a8a; }

    /* ── Receipt Smart Split — item picker cards ────────────── */
    .item-picker-card {
        border: 2px solid #e8eef8; border-radius: 12px;
        padding: 14px 16px; margin-bottom: 10px;
        cursor: pointer; transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
        display: flex; align-items: center; gap: 12px;
        user-select: none;
    }
    .item-picker-card:hover { border-color: #93c5fd; background: #f8fbff; }
    .item-picker-card.selected { border-color: #0b3f7a; background: rgba(22,112,191,0.08); box-shadow: 0 2px 12px rgba(37,99,235,0.12); }
    .item-picker-card .pic-check {
        width: 22px; height: 22px; flex-shrink: 0;
        border: 2px solid #d1d5db; border-radius: 6px;
        display: flex; align-items: center; justify-content: center;
        background: #fff; transition: all 0.15s;
    }
    .item-picker-card.selected .pic-check { background: #0b3f7a; border-color: #0b3f7a; }
    .item-picker-card.selected .pic-check svg { display: block; }
    .item-picker-card .pic-check svg { display: none; width: 13px; height: 13px; }
    .item-picker-card .pic-info { flex: 1; }
    .item-picker-card .pic-name { font-weight: 600; color: #1f2937; font-size: 0.95rem; }
    .item-picker-card .pic-details { font-size: 0.82rem; color: #6b7280; margin-top: 2px; }
    .item-picker-card .pic-price { font-weight: 700; color: #0b3f7a; font-size: 0.95rem; white-space: nowrap; }
    .batch-actions { margin-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
    .batch-hint { font-size: 0.82rem; color: #6b7280; }
    .batch-btn {
        background: linear-gradient(135deg, #1e3a8a, #0b3f7a);
        color: #fff; border: none; border-radius: 50px;
        padding: 12px 28px; font-size: 0.92rem; font-weight: 700;
        cursor: pointer; transition: all 0.2s;
        box-shadow: 0 3px 14px rgba(37,99,235,0.35);
    }
    .batch-btn:hover { transform: translateY(-1px); box-shadow: 0 5px 20px rgba(37,99,235,0.45); }
    .batch-btn:disabled { background: linear-gradient(135deg,#cbd5e1,#94a3b8); box-shadow:none; cursor:not-allowed; transform:none; }
    .batch-btn.secondary {
        background: #fff;
        color: #0b3f7a;
        border: 2px solid rgba(22,112,191,0.30);
        box-shadow: none;
    }
    .batch-btn.secondary:hover { border-color: #93c5fd; box-shadow: 0 4px 16px rgba(37,99,235,0.12); }
    /* ── Batch success screen ───────────────────────────────── */
    .batch-success { display:none; padding: 8px 0; }
    .batch-success-header { text-align:center; margin-bottom:24px; }
    .batch-success-header .bs-icon { width:64px; height:64px; background:linear-gradient(135deg,#059669,#10b981); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; box-shadow:0 4px 16px rgba(16,185,129,0.35); }
    .batch-success-header h2 { font-size:1.4rem; font-weight:800; color:#1e293b; margin:0 0 6px; font-family:'Plus Jakarta Sans',sans-serif; }
    .batch-success-header p { font-size:0.88rem; color:#64748b; margin:0; }
    .batch-passport-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; }
    .batch-passport-card { border:1.5px solid #e8eef8; border-radius:14px; padding:16px; text-decoration:none; display:block; transition:all 0.2s; }
    .batch-passport-card:hover { border-color:#0b3f7a; box-shadow:0 4px 16px rgba(37,99,235,0.12); transform:translateY(-2px); }
    .batch-passport-card .bpc-num { font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:#94a3b8; margin-bottom:6px; }
    .batch-passport-card .bpc-name { font-size:1rem; font-weight:700; color:#1e293b; margin-bottom:3px; line-height:1.3; }
    .batch-passport-card .bpc-sub { font-size:0.8rem; color:#6b7280; }
    .batch-passport-card .bpc-price { font-size:0.88rem; font-weight:700; color:#0b3f7a; margin-top:10px; }
    .batch-passport-card .bpc-arrow { font-size:0.82rem; color:#0b3f7a; font-weight:600; margin-top:8px; }
    .batch-create-more { display:block; text-align:center; margin-top:20px; color:#0b3f7a; font-size:0.88rem; font-weight:600; text-decoration:none; }
    .batch-create-more:hover { color:#1e3a8a; }