/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* All layout CSS is in global workplan-layout.css to avoid scoped/global conflicts */
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-sijxj27l30],
.components-reconnect-repeated-attempt-visible[b-sijxj27l30],
.components-reconnect-failed-visible[b-sijxj27l30],
.components-pause-visible[b-sijxj27l30],
.components-resume-failed-visible[b-sijxj27l30],
.components-rejoining-animation[b-sijxj27l30] {
    display: none;
}

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


#components-reconnect-modal[b-sijxj27l30] {
    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-sijxj27l30 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

#components-reconnect-modal button[b-sijxj27l30] {
    border: 0;
    background-color: var(--wp-primary, #20a29d);
    color: white;
    padding: 4px 24px;
    border-radius: 8px;
    font-weight: 600;
}

    #components-reconnect-modal button:hover[b-sijxj27l30] {
        background-color: var(--wp-primary-hover, #1a8a85);
    }

    #components-reconnect-modal button:active[b-sijxj27l30] {
        background-color: var(--wp-primary, #20a29d);
    }

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

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

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

@keyframes components-rejoining-animation-b-sijxj27l30 {
    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/Layout/SidebarMenu.razor.rz.scp.css */
/* All layout CSS is in global workplan-layout.css to avoid scoped/global conflicts */
/* /Components/Layout/TopBar.razor.rz.scp.css */
/* All layout CSS is in global workplan-layout.css to avoid scoped/global conflicts */
/* /Components/Pages/Contact/ContactInquiryDetail.razor.rz.scp.css */
/* ============================================================
   Omdesignad ärendesida – scoped styles
   ============================================================ */

.page[b-9x2edyd2h1] {
    --primary:#20a29d; --primary-hover:#1a8a85; --primary-light:#e8f5f4;
    --navy:#192734; --mint:#c6e2df;
    --muted:#5f7a8a; --text:#25323b; --text-soft:#4a5b66;
    --border:#dde5e3; --border-soft:#e8edeb;
    --work:#ffffff; --info:#f6f9f8;
    --accent-blue:#eef5fb; --accent-blue-bd:#cfe2f2;
    --warn:#fff7e6; --danger:#dc2626;
    --radius:12px;
    --shadow:0 1px 2px rgba(25,39,52,.04), 0 1px 3px rgba(25,39,52,.06);
    --shadow-work:0 2px 8px rgba(25,39,52,.06), 0 1px 3px rgba(25,39,52,.05);

    max-width:none;
    margin:0 auto;
    padding:1.1rem 1.5rem 3rem;
    font-family:'DM Sans', sans-serif;
    color:var(--text);
    font-size:14px;
    line-height:1.45;
}

.page[b-9x2edyd2h1]  .material-symbols-outlined,
.page .material-symbols-outlined[b-9x2edyd2h1] {
    font-variation-settings:'FILL' 0,'wght' 400,'opsz' 20;
    vertical-align:middle;
}

/* ---------- sidhuvud ---------- */
.page-head[b-9x2edyd2h1] { display:flex; align-items:flex-start; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.page-head h1[b-9x2edyd2h1] { margin:0; font-size:1.5rem; font-weight:700; color:var(--navy); letter-spacing:-.01em; display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.subtitle[b-9x2edyd2h1] { color:var(--muted); font-size:.82rem; margin:.2rem 0 0; }
.head-actions[b-9x2edyd2h1] { margin-left:auto; display:flex; gap:.5rem; }

.badge[b-9x2edyd2h1] { font-size:.68rem; font-weight:700; padding:.18rem .55rem; border-radius:999px; text-transform:uppercase; letter-spacing:.03em; display:inline-flex; align-items:center; gap:.25rem; }
.badge-new[b-9x2edyd2h1] { background:#fde9c8; color:#a7681a; }
.badge-info[b-9x2edyd2h1] { background:#e0edfb; color:#1f4d80; }
.badge-success[b-9x2edyd2h1] { background:#d7efe0; color:#1c6b3a; }
.badge-light[b-9x2edyd2h1] { background:#eef1f0; color:#4a5b66; }

/* ---------- knappar ---------- */
.btn[b-9x2edyd2h1] { display:inline-flex; align-items:center; gap:.4rem; border:none; border-radius:8px; padding:.5rem .85rem; font-family:inherit; font-size:.85rem; font-weight:600; cursor:pointer; transition:.12s; text-decoration:none; }
.btn .material-symbols-outlined[b-9x2edyd2h1] { font-size:18px; }
.btn-primary[b-9x2edyd2h1] { background:var(--primary); color:#fff; }
.btn-primary:hover:not(:disabled)[b-9x2edyd2h1] { background:var(--primary-hover); }
.btn-primary:disabled[b-9x2edyd2h1] { background:#b9d9d7; cursor:not-allowed; }
.btn-ghost[b-9x2edyd2h1] { background:transparent; color:var(--text-soft); border:1px solid var(--border); }
.btn-ghost:hover:not(:disabled)[b-9x2edyd2h1] { background:var(--info); }
.btn-ghost:disabled[b-9x2edyd2h1] { opacity:.55; cursor:not-allowed; }
.btn-danger[b-9x2edyd2h1] { background:#fff; color:var(--danger); border:1px solid #f3c9c9; }
.btn-danger:hover:not(:disabled)[b-9x2edyd2h1] { background:#fef2f2; }
.btn-danger-solid[b-9x2edyd2h1] { background:var(--danger); color:#fff; }
.btn-danger-solid:hover:not(:disabled)[b-9x2edyd2h1] { background:#c11f1f; }
.btn-danger-solid:disabled[b-9x2edyd2h1] { background:#f0a2a2; cursor:not-allowed; }
.btn-sm[b-9x2edyd2h1] { padding:.4rem .65rem; font-size:.8rem; }
.btn-block[b-9x2edyd2h1] { width:100%; justify-content:center; }
.btn-row[b-9x2edyd2h1] { display:flex; gap:.5rem; flex-wrap:wrap; }
.row-end[b-9x2edyd2h1] { display:flex; justify-content:flex-end; gap:.5rem; }

/* ---------- grid ---------- */
.grid[b-9x2edyd2h1] { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:1rem; align-items:start; }
.col[b-9x2edyd2h1] { display:flex; flex-direction:column; gap:1rem; min-width:0; }
@media (max-width:1000px) { .grid[b-9x2edyd2h1] { grid-template-columns:1fr; } }

/* höger kolumn: splittas till två sub-kolumner på breda skärmar
   Kolumn 1: Ärendeuppgifter, Kunduppgifter, Koppla
   Kolumn 2: Åtgärder, Tilldelning */
@media (min-width:1500px) {
    .grid[b-9x2edyd2h1] { grid-template-columns:minmax(0,1fr) 780px; }
    .col-right[b-9x2edyd2h1] {
        display:grid;
        grid-template-columns:1fr 1fr;
        align-items:start;
        gap:1rem;
    }
    .col-slot-a1[b-9x2edyd2h1] { grid-column:1; grid-row:1; }
    .col-slot-a2[b-9x2edyd2h1] { grid-column:1; grid-row:2; }
    .col-slot-a3[b-9x2edyd2h1] { grid-column:1; grid-row:3; }
    .col-slot-b1[b-9x2edyd2h1] { grid-column:2; grid-row:1; }
    .col-slot-b2[b-9x2edyd2h1] { grid-column:2; grid-row:2; }
    .col-right .legend[b-9x2edyd2h1] { grid-column:1 / -1; grid-row:4; }
}

/* ---------- kort ---------- */
.card[b-9x2edyd2h1] { background:var(--work); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.card-work[b-9x2edyd2h1] { box-shadow:var(--shadow-work); }
.card-info[b-9x2edyd2h1] { background:var(--info); }
.card-hd[b-9x2edyd2h1] { display:flex; align-items:center; gap:.5rem; padding:.7rem 1rem; border-bottom:1px solid var(--border-soft); }
.card-hd h2[b-9x2edyd2h1] { margin:0; font-size:.92rem; font-weight:700; color:var(--navy); flex:1; display:flex; align-items:center; gap:.45rem; }
.card-hd .ic[b-9x2edyd2h1] { color:var(--primary); font-size:19px; }
.card-hd .count[b-9x2edyd2h1] { font-size:.72rem; color:var(--muted); background:var(--info); border:1px solid var(--border-soft); padding:.1rem .5rem; border-radius:999px; font-weight:600; }
.card-hd .unsaved[b-9x2edyd2h1] { font-size:.72rem; color:#c62828; font-weight:600; }
.card-bd[b-9x2edyd2h1] { padding:.9rem 1rem; }
.card-bd.tight[b-9x2edyd2h1] { padding:.7rem 1rem; }

.muted-note[b-9x2edyd2h1] { color:var(--muted); font-style:italic; font-size:.85rem; margin:0; }
.help[b-9x2edyd2h1] { font-size:.75rem; color:var(--muted); }
.help.mb[b-9x2edyd2h1] { margin:.2rem 0 .6rem; }
.help a[b-9x2edyd2h1] { color:var(--primary); }
.mb[b-9x2edyd2h1] { margin-bottom:.5rem; }

/* ---------- formulär ---------- */
.label[b-9x2edyd2h1] { display:block; font-size:.75rem; font-weight:600; color:var(--text-soft); margin-bottom:.3rem; text-transform:uppercase; letter-spacing:.02em; }
.field[b-9x2edyd2h1] { margin-bottom:.85rem; }
.field:last-child[b-9x2edyd2h1] { margin-bottom:0; }
.inp[b-9x2edyd2h1] { width:100%; border:1px solid var(--border); border-radius:8px; padding:.55rem .7rem; font-family:inherit; font-size:.87rem; background:#fff; color:var(--text); box-sizing:border-box; }
.inp:focus[b-9x2edyd2h1] { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-light); }
textarea.inp[b-9x2edyd2h1] { resize:vertical; min-height:96px; }
textarea.note-area[b-9x2edyd2h1] { min-height:70px; }
.inp:disabled[b-9x2edyd2h1] { background:var(--info); color:var(--muted); cursor:not-allowed; }
.row2[b-9x2edyd2h1] { display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
@media (max-width:520px) { .row2[b-9x2edyd2h1] { grid-template-columns:1fr; } }

/* fejkad dropdown-pil */
.ddl[b-9x2edyd2h1] { position:relative; flex:1; }
.ddl select.inp[b-9x2edyd2h1] { appearance:none; padding-right:2rem; cursor:pointer; }
.ddl[b-9x2edyd2h1]::after { content:'expand_more'; font-family:'Material Symbols Outlined'; position:absolute; right:.55rem; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; }

/* ---------- meddelande ---------- */
.msg-card[b-9x2edyd2h1] { border-left:4px solid var(--primary); }
.msg-from[b-9x2edyd2h1] { display:flex; align-items:center; gap:.6rem; padding:.7rem 1rem; border-bottom:1px solid var(--border-soft); }
.avatar[b-9x2edyd2h1] { width:34px; height:34px; border-radius:50%; background:var(--mint); color:var(--navy); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; flex:none; }
.msg-from .who[b-9x2edyd2h1] { font-weight:600; font-size:.85rem; }
.msg-from .who-org[b-9x2edyd2h1] { color:var(--muted); font-weight:400; }
.msg-from .meta[b-9x2edyd2h1] { font-size:.72rem; color:var(--muted); }
.msg-body[b-9x2edyd2h1] { background:var(--accent-blue); border:1px solid var(--accent-blue-bd); border-radius:8px; padding:.85rem; margin:.9rem 1rem; white-space:pre-wrap; font-size:.9rem; color:var(--text); }
.msg-foot[b-9x2edyd2h1] { padding:.5rem 1rem .8rem; font-size:.72rem; color:var(--muted); display:flex; gap:1.2rem; flex-wrap:wrap; }

.status-pill[b-9x2edyd2h1] { display:inline-flex; align-items:center; gap:.35rem; font-size:.75rem; font-weight:600; padding:.2rem .6rem; border-radius:999px; background:#fde9c8; color:#a7681a; }

/* ---------- konversation ---------- */
.chat[b-9x2edyd2h1] { display:flex; flex-direction:column; gap:.6rem; margin-bottom:.9rem; }
.chat-row[b-9x2edyd2h1] { display:flex; }
.chat-row.out[b-9x2edyd2h1] { justify-content:flex-end; }
.bubble[b-9x2edyd2h1] { max-width:80%; border-radius:10px; padding:.55rem .8rem; box-shadow:0 1px 2px rgba(0,0,0,.05); font-size:.87rem; }
.bubble.in[b-9x2edyd2h1] { background:var(--info); border:1px solid var(--border-soft); }
.bubble.out[b-9x2edyd2h1] { background:var(--mint); color:var(--navy); }
.bubble .who[b-9x2edyd2h1] { font-size:.7rem; color:var(--muted); margin-bottom:.2rem; }
.bubble.out .who[b-9x2edyd2h1] { color:#264a4a; }
.bubble .subj[b-9x2edyd2h1] { font-weight:600; margin-bottom:.2rem; }
.bubble .body[b-9x2edyd2h1] { white-space:pre-wrap; }
.bubble .time[b-9x2edyd2h1] { font-size:.68rem; color:var(--muted); margin-top:.3rem; display:flex; gap:.6rem; flex-wrap:wrap; }
.bubble.out .time[b-9x2edyd2h1] { color:#3a5a5a; }

.reply-block[b-9x2edyd2h1] { border-top:1px solid var(--border-soft); padding-top:.8rem; margin-top:.2rem; }

/* ---------- bilagor ---------- */
.attach-list[b-9x2edyd2h1] { list-style:none; margin:0 0 .8rem; padding:0; display:flex; flex-direction:column; gap:.4rem; }
.attach-item[b-9x2edyd2h1] { display:flex; align-items:center; gap:.5rem; padding:.45rem .55rem; border:1px solid var(--border-soft); border-radius:8px; background:#fff; }
.attach-item .ic[b-9x2edyd2h1] { color:var(--primary); }
.attach-item .name[b-9x2edyd2h1] { flex:1; min-width:0; }
.attach-item .name a[b-9x2edyd2h1] { color:var(--text); font-weight:500; text-decoration:none; }
.attach-item .name a:hover[b-9x2edyd2h1] { color:var(--primary); }
.attach-item .name .meta[b-9x2edyd2h1] { font-size:.7rem; color:var(--muted); }
.attach-item .del[b-9x2edyd2h1] { background:transparent; border:none; color:var(--danger); cursor:pointer; padding:.25rem; border-radius:6px; }
.attach-item .del:hover[b-9x2edyd2h1] { background:#fef2f2; }
.attach-actions[b-9x2edyd2h1] { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; border-top:1px solid var(--border-soft); padding-top:.6rem; }

/* ---------- kunduppgifter ---------- */
dl.kv[b-9x2edyd2h1] { margin:0; display:grid; grid-template-columns:auto 1fr; gap:.45rem .9rem; font-size:.85rem; }
dl.kv dt[b-9x2edyd2h1] { color:var(--muted); }
dl.kv dd[b-9x2edyd2h1] { margin:0; font-weight:500; }
dl.kv dd a[b-9x2edyd2h1] { color:var(--primary); text-decoration:none; }

/* ---------- koppla (en rad per typ) ---------- */
.inline-row[b-9x2edyd2h1] { display:flex; gap:.5rem; align-items:center; }
.linked-list[b-9x2edyd2h1] { list-style:none; margin:0 0 .6rem; padding:0; display:flex; flex-direction:column; gap:.35rem; }
.linked-item[b-9x2edyd2h1] { display:flex; align-items:center; gap:.5rem; padding:.4rem .55rem; border:1px solid var(--border-soft); border-radius:8px; background:#fff; }
.linked-item .ic[b-9x2edyd2h1] { color:var(--primary); }
.linked-item .name[b-9x2edyd2h1] { flex:1; min-width:0; }
.linked-item .name a[b-9x2edyd2h1] { color:var(--text); font-weight:500; text-decoration:none; }
.linked-item .name a:hover[b-9x2edyd2h1] { color:var(--primary); }
.linked-item .name .meta[b-9x2edyd2h1] { font-size:.7rem; color:var(--muted); }
.linked-item .btn-icon[b-9x2edyd2h1] { background:transparent; border:none; cursor:pointer; padding:.25rem; border-radius:6px; color:var(--muted); }
.linked-item .btn-icon.danger[b-9x2edyd2h1] { color:var(--danger); }
.linked-item .btn-icon:hover[b-9x2edyd2h1] { background:var(--info); }
.linked-item .btn-icon.danger:hover[b-9x2edyd2h1] { background:#fef2f2; }
.pill[b-9x2edyd2h1] { font-size:.68rem; font-weight:700; padding:.1rem .5rem; border-radius:999px; text-transform:uppercase; }
.pill-primary[b-9x2edyd2h1] { background:#d7efe0; color:#1c6b3a; }

/* ---------- historik ---------- */
.hist-tabs[b-9x2edyd2h1] { display:flex; gap:.25rem; padding:.5rem .75rem 0; border-bottom:1px solid var(--border-soft); }
.hist-tab[b-9x2edyd2h1] { background:transparent; border:none; padding:.55rem .8rem; font-family:inherit; font-size:.82rem; font-weight:600; color:var(--muted); cursor:pointer; border-bottom:2px solid transparent; }
.hist-tab.active[b-9x2edyd2h1] { color:var(--primary); border-bottom-color:var(--primary); }
.hist-body[b-9x2edyd2h1] { padding:.75rem 1rem; }
.event[b-9x2edyd2h1] { display:flex; gap:.6rem; align-items:flex-start; }
.event + .event[b-9x2edyd2h1] { margin-top:.75rem; }
.event-ic[b-9x2edyd2h1] { width:28px; height:28px; border-radius:50%; background:var(--warn); color:#a7681a; display:flex; align-items:center; justify-content:center; flex:none; }
.event-ic.info[b-9x2edyd2h1] { background:#e0edfb; color:#1f4d80; }
.event-ic.success[b-9x2edyd2h1] { background:#d7efe0; color:#1c6b3a; }
.event-ic.neutral[b-9x2edyd2h1] { background:var(--info); color:var(--muted); }
.event-ic .material-symbols-outlined[b-9x2edyd2h1] { font-size:16px; }
.event-title[b-9x2edyd2h1] { font-size:.85rem; }
.event-note[b-9x2edyd2h1] { font-size:.8rem; color:var(--muted); font-style:italic; }
.event-time[b-9x2edyd2h1] { font-size:.72rem; color:var(--muted); margin-top:.15rem; }

/* ---------- åtgärder (hopfällbart) ---------- */
.actions details[b-9x2edyd2h1] { border-top:1px solid var(--border-soft); }
.actions details:first-of-type[b-9x2edyd2h1] { border-top:none; }
.actions summary[b-9x2edyd2h1] { list-style:none; cursor:pointer; padding:.7rem 1rem; display:flex; align-items:center; gap:.55rem; font-weight:600; font-size:.87rem; color:var(--navy); }
.actions summary[b-9x2edyd2h1]::-webkit-details-marker { display:none; }
.actions summary .ic[b-9x2edyd2h1] { color:var(--muted); font-size:19px; }
.actions summary .chev[b-9x2edyd2h1] { margin-left:auto; color:var(--muted); font-size:20px; transition:.15s; }
.actions details[open] summary .chev[b-9x2edyd2h1] { transform:rotate(180deg); }
.actions .action-bd[b-9x2edyd2h1] { padding:0 1rem 1rem; }

/* ---------- merged banner ---------- */
.merged[b-9x2edyd2h1] { display:flex; align-items:center; gap:.75rem; background:#fff4d6; border:1px solid #e0b849; border-radius:var(--radius); padding:.85rem 1rem; margin-bottom:1rem; }
.merged .ic[b-9x2edyd2h1] { color:#8a6d0f; }
.merged .body[b-9x2edyd2h1] { flex:1; }
.merged .title[b-9x2edyd2h1] { font-weight:600; color:#5f4a00; }
.merged .meta[b-9x2edyd2h1] { font-size:.8rem; color:#5f4a00; }
.merged a[b-9x2edyd2h1] { color:#5f4a00; font-weight:600; }

/* ---------- origin chip ---------- */
.origin[b-9x2edyd2h1] { display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .6rem; background:var(--mint); color:var(--navy); border-radius:9999px; font-size:.78rem; font-weight:500; text-decoration:none; margin-top:.35rem; }
.origin .material-symbols-outlined[b-9x2edyd2h1] { font-size:15px; }

/* ---------- loader / tomt ---------- */
.state[b-9x2edyd2h1] { text-align:center; padding:3rem 1rem; color:var(--muted); }
.state .material-symbols-outlined[b-9x2edyd2h1] { font-size:3rem; color:var(--muted); }
.state h3[b-9x2edyd2h1] { margin:.75rem 0 .25rem; color:var(--navy); }

/* ---------- legend ---------- */
.legend[b-9x2edyd2h1] { display:flex; gap:1rem; flex-wrap:wrap; font-size:.72rem; color:var(--muted); margin:.2rem .2rem 0; }
.legend span[b-9x2edyd2h1] { display:inline-flex; align-items:center; gap:.35rem; }
.swatch[b-9x2edyd2h1] { width:12px; height:12px; border-radius:3px; border:1px solid var(--border); }
.sw-work[b-9x2edyd2h1] { background:#ffffff; }
.sw-in[b-9x2edyd2h1] { background:#eef5fb; border-color:#cfe2f2; }
.sw-ref[b-9x2edyd2h1] { background:#f6f9f8; }