/* /Components/Ai/AiChatPanel.razor.rz.scp.css */
.ai-chat-backdrop[b-cvhao8ps6h] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.15);
    z-index: 1045;
}

.ai-chat-panel[b-cvhao8ps6h] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 420px;
    max-width: 100vw;
    background: #fff;
    border-left: 1px solid #e5e7eb;
    z-index: 1046;
    display: flex;
    flex-direction: column;
    animation: ai-chat-slide-in-b-cvhao8ps6h 0.18s ease-out;
}

@keyframes ai-chat-slide-in-b-cvhao8ps6h {
    from { transform: translateX(100%); }
    to   { transform: translateX(0); }
}

.ai-chat-header[b-cvhao8ps6h] {
    border-bottom: 1px solid #eef0f2;
    flex-shrink: 0;
}

.ai-chat-messages[b-cvhao8ps6h] {
    flex: 1 1 auto;
    overflow-y: auto;
    scroll-behavior: smooth;
}

.ai-chat-msg[b-cvhao8ps6h] {
    margin-bottom: 0.9rem;
}

.ai-chat-msg-role[b-cvhao8ps6h] {
    font-weight: 600;
    letter-spacing: 0.01em;
}

.ai-chat-msg-body[b-cvhao8ps6h] {
    font-size: 0.9rem;
    line-height: 1.45;
    white-space: normal;
    word-break: break-word;
}

.ai-chat-msg-user .ai-chat-msg-body[b-cvhao8ps6h] {
    background: #eef2ff;
    border-radius: 0.6rem;
    padding: 0.5rem 0.7rem;
}

.ai-chat-msg-asst .ai-chat-msg-body[b-cvhao8ps6h] {
    padding: 0.1rem 0.1rem;
}

.ai-chat-msg-body code[b-cvhao8ps6h] {
    background: #f1f3f5;
    padding: 0.05rem 0.3rem;
    border-radius: 0.3rem;
    font-size: 0.82rem;
}

.ai-chat-cursor[b-cvhao8ps6h] {
    display: inline-block;
    animation: ai-chat-blink-b-cvhao8ps6h 1s steps(2, start) infinite;
    color: #6366f1;
    font-weight: 700;
}

@keyframes ai-chat-blink-b-cvhao8ps6h {
    to { visibility: hidden; }
}

.ai-chat-note[b-cvhao8ps6h] {
    color: #9ca3af;
}

.ai-chat-input[b-cvhao8ps6h] {
    flex-shrink: 0;
    background: #fff;
}

.ai-chat-input textarea[b-cvhao8ps6h] {
    resize: none;
}

.ai-attach-chip[b-cvhao8ps6h] {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    font-size: .74rem;
    color: #3730a3;
    background: #eef2ff;
    border: 1px solid #e0e7ff;
    border-radius: 8px;
    padding: .2rem .5rem;
}

.ai-attach-chip .text-truncate[b-cvhao8ps6h] {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Source citation chips ─────────────────────────────── */
.ai-src-row[b-cvhao8ps6h] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .55rem;
    padding-top: .5rem;
    border-top: 1px dashed #e4e7ec;
}
.ai-src[b-cvhao8ps6h] {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    font-size: .7rem;
    font-weight: 500;
    color: #475467;
    background: #f9fafb;
    border: 1px solid #e4e7ec;
    border-radius: 7px;
    padding: .15rem .45rem;
}
.ai-src i[b-cvhao8ps6h] { color: #2563eb; }
.ai-src .text-truncate[b-cvhao8ps6h] { max-width: 180px; }
.ai-src-pg[b-cvhao8ps6h] {
    margin-left: .3rem;
    font-family: ui-monospace, "Cascadia Code", Menlo, monospace;
    font-size: .66rem;
    color: #98a2b3;
}
/* /Components/Ai/AiConfirmCard.razor.rz.scp.css */
.ai-confirm-card[b-2lbspj6gk6] {
    border: 1px solid #fcd34d;
    background: #fffbeb;
    border-radius: 0.5rem;
    padding: 0.6rem 0.75rem;
}

.ai-confirm-card-body[b-2lbspj6gk6] {
    line-height: 1.35;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* MainLayout scoped styles — layout handled in app.css */
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* NavMenu scoped styles — layout handled in app.css */
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ftp61zsx5f],
.components-reconnect-repeated-attempt-visible[b-ftp61zsx5f],
.components-reconnect-failed-visible[b-ftp61zsx5f],
.components-pause-visible[b-ftp61zsx5f],
.components-resume-failed-visible[b-ftp61zsx5f],
.components-rejoining-animation[b-ftp61zsx5f] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-retrying[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-failed[b-ftp61zsx5f],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-ftp61zsx5f] {
    display: block;
}


#components-reconnect-modal[b-ftp61zsx5f] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-ftp61zsx5f 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-ftp61zsx5f 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-ftp61zsx5f 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-ftp61zsx5f]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-ftp61zsx5f 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-ftp61zsx5f {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-ftp61zsx5f {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-ftp61zsx5f {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-ftp61zsx5f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-ftp61zsx5f] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-ftp61zsx5f] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-ftp61zsx5f] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-ftp61zsx5f] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-ftp61zsx5f] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-ftp61zsx5f] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-ftp61zsx5f 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-ftp61zsx5f] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-ftp61zsx5f {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/KnowledgeBase.razor.rz.scp.css */
.kb-page[b-opueuc6jx0] { max-width: 1240px; }

.kb-rag-badge[b-opueuc6jx0] {
    background: #e7f0ff;
    color: #2563eb;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .04em;
    padding: .2rem .5rem;
}

/* ── Cards ─────────────────────────────────────────────── */
.kb-card[b-opueuc6jx0] {
    background: #fff;
    border: 1px solid #eceef1;
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
    overflow: hidden;
}

.kb-card-head[b-opueuc6jx0] {
    padding: .7rem 1rem;
    font-size: .74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #667085;
    background: #fbfcfd;
    border-bottom: 1px solid #f0f2f4;
}

.kb-label[b-opueuc6jx0] { font-size: .74rem; font-weight: 600; color: #667085; margin-bottom: .2rem; display: block; }
.kb-hint[b-opueuc6jx0]  { font-size: .72rem; color: #98a2b3; }
.kb-count[b-opueuc6jx0] { font-size: .72rem; color: #98a2b3; font-weight: 500; text-transform: none; letter-spacing: 0; }

/* ── Two-column layout ─────────────────────────────────── */
.rag-grid[b-opueuc6jx0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.1rem;
    align-items: stretch;
}
@media (max-width: 900px) { .rag-grid[b-opueuc6jx0] { grid-template-columns: 1fr; } }

.rag-panel[b-opueuc6jx0] {
    display: flex;
    flex-direction: column;
    height: min(74vh, 760px);
}
@media (max-width: 900px) { .rag-panel[b-opueuc6jx0] { height: 560px; } }

/* ══ LEFT — chat ═══════════════════════════════════════ */
.rag-chat-body[b-opueuc6jx0] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.rag-empty[b-opueuc6jx0] { margin: auto; text-align: center; max-width: 380px; }
.rag-empty-ic[b-opueuc6jx0] { font-size: 2rem; color: #c3d4f5; display: block; margin-bottom: .5rem; }
.rag-suggest[b-opueuc6jx0] { display: flex; flex-direction: column; gap: .4rem; }
.rag-chip-btn[b-opueuc6jx0] {
    border: 1px solid #e4e7ec; background: #fff; color: #344054;
    border-radius: 9px; padding: .5rem .75rem; font-size: .8rem; text-align: left;
    transition: border-color .15s, background .15s;
}
.rag-chip-btn:hover:not(:disabled)[b-opueuc6jx0] { border-color: #2563eb; background: #f5f8ff; color: #1d4ed8; }
.rag-chip-btn:disabled[b-opueuc6jx0] { opacity: .55; }

.rag-msg[b-opueuc6jx0] { display: flex; }
.rag-msg-user[b-opueuc6jx0] { justify-content: flex-end; }
.rag-msg-asst[b-opueuc6jx0] { justify-content: flex-start; }

.rag-bubble[b-opueuc6jx0] {
    max-width: 88%;
    font-size: .86rem;
    line-height: 1.5;
    padding: .6rem .8rem;
    border-radius: 13px;
}
.rag-msg-user .rag-bubble[b-opueuc6jx0] {
    background: #2563eb; color: #fff;
    border-bottom-right-radius: 4px;
}
.rag-msg-asst .rag-bubble[b-opueuc6jx0] {
    background: #f7f9fb; color: #1d2939; border: 1px solid #eef0f2;
    border-bottom-left-radius: 4px;
}
.rag-bubble code[b-opueuc6jx0] {
    background: rgba(16,24,40,.06); border-radius: 4px; padding: 0 .25rem; font-size: .82em;
}
.rag-msg-user .rag-bubble code[b-opueuc6jx0] { background: rgba(255,255,255,.2); }

.rag-tool[b-opueuc6jx0] { color: #98a2b3; font-style: italic; }
.rag-cursor[b-opueuc6jx0] { animation: rag-blink-b-opueuc6jx0 1s step-end infinite; color: #98a2b3; }
@keyframes rag-blink-b-opueuc6jx0 { 50% { opacity: 0; } }

/* source chips */
.rag-sources[b-opueuc6jx0] {
    display: flex; flex-wrap: wrap; gap: .4rem;
    margin-top: .6rem; padding-top: .6rem; border-top: 1px dashed #e4e7ec;
}
.rag-src[b-opueuc6jx0] {
    display: inline-flex; align-items: center; gap: .35rem;
    font-size: .72rem; font-weight: 500; color: #475467;
    background: #fff; border: 1px solid #e4e7ec; border-radius: 7px;
    padding: .2rem .5rem;
}
.rag-src i[b-opueuc6jx0] { color: #2563eb; }
.rag-src b[b-opueuc6jx0] { color: #1d2939; font-weight: 600; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rag-src-pg[b-opueuc6jx0] { font-family: ui-monospace, "Cascadia Code", Menlo, monospace; font-size: .68rem; color: #98a2b3; }
.rag-rel[b-opueuc6jx0] { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.rag-rel-strong[b-opueuc6jx0] { background: #12b76a; }
.rag-rel-good[b-opueuc6jx0]   { background: #f79009; }
.rag-rel-weak[b-opueuc6jx0]   { background: #d0d5dd; }

/* chat input */
.rag-chat-input[b-opueuc6jx0] {
    flex: 0 0 auto;
    display: flex; align-items: center; gap: .5rem;
    border-top: 1px solid #f0f2f4;
    padding: .6rem .7rem;
    background: #fff;
}
.rag-ask-input[b-opueuc6jx0] {
    flex: 1 1 auto; border: 1px solid #eaecf0; background: #f9fafb;
    border-radius: 10px; outline: none; font-size: .86rem; padding: .5rem .75rem;
}
.rag-ask-input:focus[b-opueuc6jx0] { border-color: #2563eb; background: #fff; }
.rag-ask-send[b-opueuc6jx0] {
    border: none; background: #2563eb; color: #fff;
    width: 36px; height: 36px; border-radius: 9px;
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.rag-ask-send:disabled[b-opueuc6jx0] { background: #c3d4f5; }

/* ══ RIGHT — knowledge base ════════════════════════════ */
.rag-kb-toolbar[b-opueuc6jx0] {
    display: flex; align-items: center; gap: .6rem;
    padding: .7rem 1rem; border-bottom: 1px solid #f0f2f4;
}
.rag-search[b-opueuc6jx0] {
    flex: 1 1 auto; display: flex; align-items: center; gap: .5rem;
    background: #f9fafb; border: 1px solid #eaecf0; border-radius: 9px; padding: .4rem .7rem;
}
.rag-search i[b-opueuc6jx0] { color: #98a2b3; font-size: .85rem; }
.rag-search input[b-opueuc6jx0] { flex: 1 1 auto; border: none; background: transparent; outline: none; font-size: .82rem; }

.rag-upload[b-opueuc6jx0] { padding: .9rem 1rem; border-bottom: 1px solid #f0f2f4; background: #fbfcfd; }

.rag-pipeline[b-opueuc6jx0] { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .8rem; }
.rag-pstep[b-opueuc6jx0] {
    display: flex; align-items: center; gap: .4rem;
    flex: 1 1 120px; min-width: 110px;
    background: #fff; border: 1px solid #eceef1; border-left: 3px solid #eceef1;
    border-radius: 8px; padding: .4rem .55rem; font-size: .74rem; color: #475467;
    transition: border-color .2s;
}
.rag-pstep.done[b-opueuc6jx0]   { border-left-color: #12b76a; }
.rag-pstep.active[b-opueuc6jx0] { border-left-color: #f79009; }
.rag-pstep.failed[b-opueuc6jx0] { border-left-color: #f04438; }
.rag-pstep.queued[b-opueuc6jx0] { opacity: .6; }
.rag-pstep-num[b-opueuc6jx0] {
    width: 18px; height: 18px; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    background: #eef2f6; color: #475467; border-radius: 5px; font-size: .66rem; font-weight: 700;
}
.rag-pstep.done .rag-pstep-num[b-opueuc6jx0]   { background: #d1fadf; color: #027a48; }
.rag-pstep.active .rag-pstep-num[b-opueuc6jx0] { background: #fef0c7; color: #b54708; }
.rag-pstep.failed .rag-pstep-num[b-opueuc6jx0] { background: #fee4e2; color: #b42318; }
.rag-pstep-title[b-opueuc6jx0] { font-weight: 600; }

/* document list */
.rag-kb-list[b-opueuc6jx0] { flex: 1 1 auto; overflow-y: auto; padding: .35rem .5rem; }

.rag-doc[b-opueuc6jx0] {
    display: flex; align-items: center; gap: .7rem;
    padding: .6rem .7rem; border-radius: 10px;
    transition: background .12s;
}
.rag-doc:hover[b-opueuc6jx0] { background: #fbfcfd; }
.rag-doc:hover .rag-doc-actions[b-opueuc6jx0] { opacity: 1; }

.rag-doc-ic[b-opueuc6jx0] {
    width: 34px; height: 34px; flex-shrink: 0;
    display: grid; place-items: center;
    background: #f2f4f7; border: 1px solid #eceef1; border-radius: 9px;
    color: #2563eb; font-size: 1rem;
}
.rag-doc-main[b-opueuc6jx0] { flex: 1 1 auto; min-width: 0; }
.rag-doc-name[b-opueuc6jx0] { font-weight: 600; font-size: .84rem; color: #1d2939; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rag-doc-sub[b-opueuc6jx0]  { font-size: .72rem; color: #98a2b3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.rag-doc-meta[b-opueuc6jx0] { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: .25rem; }
.rag-doc-chunks[b-opueuc6jx0] { font-size: .78rem; font-weight: 700; color: #344054; line-height: 1; }
.rag-doc-chunks small[b-opueuc6jx0] { font-weight: 500; color: #98a2b3; font-size: .6rem; margin-left: .15rem; }

.rag-doc-actions[b-opueuc6jx0] { flex: 0 0 auto; display: flex; opacity: 0; transition: opacity .12s; }
@media (hover: none) { .rag-doc-actions[b-opueuc6jx0] { opacity: 1; } }

/* status pills (shared with the rest of the KB UI) */
.kb-pill[b-opueuc6jx0] {
    display: inline-flex; align-items: center; gap: .25rem;
    font-size: .68rem; font-weight: 600; border-radius: 20px; padding: .12rem .5rem;
    border: 1px solid transparent; white-space: nowrap;
}
.kb-pill-ok[b-opueuc6jx0]   { background: #ecfdf3; color: #027a48; border-color: #abefc6; }
.kb-pill-run[b-opueuc6jx0]  { background: #eff8ff; color: #175cd3; border-color: #b2ddff; }
.kb-pill-fail[b-opueuc6jx0] { background: #fef3f2; color: #b42318; border-color: #fecdca; }
.kb-pill-wait[b-opueuc6jx0] { background: #f2f4f7; color: #475467; border-color: #e4e7ec; }
/* /Components/Pages/PublicPassport.razor.rz.scp.css */
/* Public product passport — consumer-facing, so it stands apart from the admin UI's Bootstrap
   chrome and is styled standalone. Mobile-first: almost every visitor arrives from a phone camera,
   holding the garment, in a shop or at home. The page is one column at every width; on a desktop it
   simply centres, because a passport is a document, not a dashboard. */

.passport-shell[b-wptm1vwfyj] {
    min-height: 100vh;
    background: #f6f6f4;
    padding: 0 0 3rem;
    display: flex;
    justify-content: center;
}

.passport-card[b-wptm1vwfyj] {
    width: 100%;
    max-width: 30rem;
    background: #fff;
    color: #1c1c1a;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    line-height: 1.55;
    padding-bottom: 1.5rem;
}

/* Edge-to-edge on a phone; a floating card once there is room around it. */
@media (min-width: 34rem) {
    .passport-shell[b-wptm1vwfyj] { padding: 2rem 1rem 3rem; }

    .passport-card[b-wptm1vwfyj] {
        border-radius: 0.9rem;
        overflow: hidden;
        box-shadow: 0 1px 3px rgb(0 0 0 / 8%), 0 12px 32px rgb(0 0 0 / 8%);
    }
}

/* ── Hero ──────────────────────────────────────────────────────────────────
   Square regardless of the photo's own aspect ratio, so a portrait phone shot and a landscape
   studio shot occupy the same space and the content below never jumps as the image loads. */

.hero[b-wptm1vwfyj] {
    position: relative;
    margin: 0;
    aspect-ratio: 1;
    background: #f0efec;
    overflow: hidden;
}

.hero img[b-wptm1vwfyj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Shown when the product has no photo. Deliberately quiet and clearly a placeholder — a consumer
   should not be left wondering whether the image failed to load. */
.hero-placeholder[b-wptm1vwfyj] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    color: #b6b3ab;
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Sits on the photo, so the first thing a scan communicates is that the claim is checkable. Only
   rendered when the credential really carries a signature. */
.verified-chip[b-wptm1vwfyj] {
    position: absolute;
    left: 0.85rem;
    bottom: 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.7rem 0.35rem 0.55rem;
    border-radius: 999px;
    background: rgb(255 255 255 / 94%);
    box-shadow: 0 1px 2px rgb(0 0 0 / 12%), 0 4px 12px rgb(0 0 0 / 10%);
    color: #16714a;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

/* ── Head ──────────────────────────────────────────────────────────────── */

.passport-head[b-wptm1vwfyj] { padding: 1.25rem 1.25rem 0; }

.eyebrow[b-wptm1vwfyj] {
    margin: 0 0 0.3rem;
    font-size: 0.7rem;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: #8a8a80;
}

.passport-head h1[b-wptm1vwfyj] {
    margin: 0 0 0.55rem;
    font-size: 1.5rem;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.chips[b-wptm1vwfyj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.6rem;
    padding: 0;
    list-style: none;
}

.chips li[b-wptm1vwfyj] {
    padding: 0.2rem 0.55rem;
    border: 1px solid #e4e2dc;
    border-radius: 999px;
    background: #faf9f7;
    font-size: 0.78rem;
    color: #55534c;
}

.identifier[b-wptm1vwfyj] { margin: 0; }

.identifier code[b-wptm1vwfyj],
.passport-foot code[b-wptm1vwfyj] {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    font-size: 0.78rem;
    color: #8a8a80;
    letter-spacing: 0.02em;
}

.description[b-wptm1vwfyj] {
    margin: 0.9rem 0 0;
    padding: 0 1.25rem;
    color: #45443e;
}

.notice[b-wptm1vwfyj] {
    margin: 1rem 1.25rem 0;
    padding: 0.7rem 0.85rem;
    border-radius: 0.5rem;
    background: #fdf6e3;
    border: 1px solid #f0e4c0;
    color: #6b5a1e;
    font-size: 0.87rem;
}

/* ── Blocks ────────────────────────────────────────────────────────────── */

.block[b-wptm1vwfyj] {
    margin: 1.5rem 0 0;
    padding: 1.25rem 1.25rem 0;
    border-top: 1px solid #eeece7;
}

.block:first-of-type[b-wptm1vwfyj] { border-top: none; }

.block h2[b-wptm1vwfyj] {
    margin: 0 0 0.75rem;
    font-size: 0.72rem;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: #8a8a80;
    font-weight: 600;
}

.block-note[b-wptm1vwfyj],
.footnote[b-wptm1vwfyj] {
    margin: 0.6rem 0 0;
    font-size: 0.78rem;
    color: #8a8a80;
}

.block-note[b-wptm1vwfyj] { margin: -0.35rem 0 0.75rem; }

/* ── Composition ───────────────────────────────────────────────────────── */

.comp-bar[b-wptm1vwfyj] {
    display: flex;
    height: 0.55rem;
    border-radius: 999px;
    overflow: hidden;
    background: #efedE8;
    margin-bottom: 0.85rem;
}

.comp-seg[b-wptm1vwfyj] { display: block; height: 100%; }

/* Four fibres is more than any garment here declares; the cycle is a safety net, not a palette. */
.comp-seg-0[b-wptm1vwfyj] { background: #3f6f5f; }
.comp-seg-1[b-wptm1vwfyj] { background: #86a795; }
.comp-seg-2[b-wptm1vwfyj] { background: #c2b48c; }
.comp-seg-3[b-wptm1vwfyj] { background: #b8867a; }

.comp-list[b-wptm1vwfyj] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.comp-list li[b-wptm1vwfyj] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.35rem 0;
    border-bottom: 1px solid #f4f2ee;
    font-size: 0.92rem;
}

.comp-list li:last-child[b-wptm1vwfyj] { border-bottom: none; }

.comp-dot[b-wptm1vwfyj] {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.comp-name[b-wptm1vwfyj] { flex: 1; }

.comp-pct[b-wptm1vwfyj] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: #2f2e2a;
}

/* ── Facts ─────────────────────────────────────────────────────────────── */

.facts[b-wptm1vwfyj] {
    margin: 0;
    display: grid;
    grid-template-columns: minmax(6.5rem, auto) 1fr;
    column-gap: 1rem;
}

.facts dt[b-wptm1vwfyj] {
    padding: 0.35rem 0;
    color: #8a8a80;
    font-size: 0.87rem;
}

.facts dd[b-wptm1vwfyj] {
    margin: 0;
    padding: 0.35rem 0;
    font-size: 0.92rem;
    text-align: right;
}

/* ── Journey ───────────────────────────────────────────────────────────── */

.journey[b-wptm1vwfyj] {
    margin: 0;
    padding: 0 0 0 0.35rem;
    list-style: none;
    position: relative;
}

.journey[b-wptm1vwfyj]::before {
    content: "";
    position: absolute;
    left: 0.32rem;
    top: 0.6rem;
    bottom: 0.6rem;
    width: 1px;
    background: #e4e2dc;
}

.journey li[b-wptm1vwfyj] {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    padding: 0.4rem 0 0.4rem 1.1rem;
    font-size: 0.92rem;
}

.journey-dot[b-wptm1vwfyj] {
    position: absolute;
    left: 0;
    top: 0.72rem;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: #3f6f5f;
    box-shadow: 0 0 0 3px #fff;
}

.journey-stage[b-wptm1vwfyj] { flex: 1; }

.journey-date[b-wptm1vwfyj] {
    color: #8a8a80;
    font-size: 0.82rem;
    white-space: nowrap;
}

/* ── Meter (declared verification ratio) ───────────────────────────────── */

.meter[b-wptm1vwfyj] { margin-bottom: 0.9rem; }

.meter-head[b-wptm1vwfyj] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.4rem;
    font-size: 0.87rem;
    color: #55534c;
}

.meter-head strong[b-wptm1vwfyj] {
    font-variant-numeric: tabular-nums;
    color: #2f2e2a;
}

.meter-track[b-wptm1vwfyj] {
    height: 0.55rem;
    border-radius: 999px;
    background: #efede8;
    overflow: hidden;
}

.meter-track span[b-wptm1vwfyj] {
    display: block;
    height: 100%;
    background: #3f6f5f;
}

.steps[b-wptm1vwfyj] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.steps li[b-wptm1vwfyj] {
    padding: 0.2rem 0.6rem;
    border: 1px solid #e4e2dc;
    border-radius: 999px;
    background: #faf9f7;
    font-size: 0.8rem;
    color: #55534c;
}

/* ── Verification ──────────────────────────────────────────────────────── */

.badges[b-wptm1vwfyj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.75rem;
}

.badge[b-wptm1vwfyj] {
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
}

.badge-ok[b-wptm1vwfyj] { background: #e7f3ec; color: #16714a; }
.badge-warn[b-wptm1vwfyj] { background: #fdf1e0; color: #8a5a10; }
.badge-info[b-wptm1vwfyj] { background: #eef1f6; color: #3c4a63; }

.cta[b-wptm1vwfyj] {
    display: inline-block;
    margin-top: 0.85rem;
    padding: 0.6rem 1rem;
    border-radius: 0.5rem;
    background: #1c1c1a;
    color: #fff;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
}

.cta:hover[b-wptm1vwfyj] { background: #333330; }

/* ── Footer / states ───────────────────────────────────────────────────── */

.passport-foot[b-wptm1vwfyj] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    margin-top: 1.75rem;
    padding: 1rem 1.25rem 0;
    border-top: 1px solid #eeece7;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #a8a69e;
}

.muted[b-wptm1vwfyj] { color: #8a8a80; }
.centred[b-wptm1vwfyj] { text-align: center; }

.empty-state[b-wptm1vwfyj] { padding: 2.5rem 1.5rem; }
.empty-state h1[b-wptm1vwfyj] { margin: 0 0 0.5rem; font-size: 1.35rem; }

/* Occupies the hero's space while the fetch is in flight, so the layout does not lurch when the
   photo arrives. */
.skeleton-hero[b-wptm1vwfyj] {
    aspect-ratio: 1;
    background: linear-gradient(100deg, #f0efec 30%, #f7f6f4 50%, #f0efec 70%);
    background-size: 220% 100%;
    animation: shimmer-b-wptm1vwfyj 1.4s ease-in-out infinite;
}

@keyframes shimmer-b-wptm1vwfyj {
    from { background-position: 130% 0; }
    to { background-position: -30% 0; }
}

@media (prefers-reduced-motion: reduce) {
    .skeleton-hero[b-wptm1vwfyj] { animation: none; }
}