/* ==========================================================================
   PEE.CHAT · CARTES DE NOTIFICATION (js/aa-notif.js) — agent notif, 13/10/2026
   a = Verre (haut-centre, carte centree, avatar pentagone + pastille LV, paquet empile)
   b = Ile (pilule haut-centre : avatar | texte centre | croix, actions en 2e rangee)
   c = Carte (bas-centre : bandeau photo, avatar pentagone, titre en capitales, paquet empile vers le haut)
   ========================================================================== */
.nc-stack {
    --nc-g: linear-gradient(135deg, #FF6B35, #F7C948);
    --nc-penta: polygon(50% 0%, 100% 37.2%, 84.1% 100%, 15.9% 100%, 0% 37.2%);
    position: fixed; z-index: 200600; pointer-events: none;
    left: 50%; transform: translateX(-50%);
    width: min(372px, calc(100vw - 16px));
    display: flex; flex-direction: column; align-items: stretch; gap: 8px;
    transition: top .3s ease, bottom .3s ease;
}
.nc-cards { position: relative; display: flex; flex-direction: column; gap: 8px; padding-bottom: var(--nc-peek, 0px); transition: padding .25s ease; }
.nc {
    position: relative; pointer-events: auto; cursor: pointer; touch-action: none; color: #fff; overflow: hidden;
    -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent;
    transition: opacity .28s ease, transform .28s ease, filter .25s ease;
    animation: ncIn .36s cubic-bezier(.2, .9, .3, 1.15);
}
.nc:focus-visible { outline: 2px solid #F7C948; outline-offset: 2px; }
@keyframes ncIn { from { opacity: 0; transform: translateY(-16px) scale(.96); } }
.nc.nc-drag { transition: none; }
.nc.nc-out { opacity: 0; transform: translateY(-12px) scale(.97); pointer-events: none; }
.nc.nc-gone { opacity: 0; transform: translate3d(var(--nc-fx, 0px), var(--nc-fy, -180px), 0) !important; pointer-events: none; }
.nc.nc-bump { animation: ncBump .4s ease; }
@keyframes ncBump { 40% { transform: scale(1.03); } }

/* elements communs */
.nc-cover, .nc-chip, .nc-link, .nc-thumb, .nc-lv2 { display: none; }
.nc-ic, .nc-x { position: absolute; top: 10px; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 2; }
.nc-ic svg, .nc-x svg { width: 14px; height: 14px; }
.nc-ic { left: 10px; color: #FF8C5A; background: rgba(255, 107, 53, .12); border: 1px solid rgba(255, 107, 53, .3); }
.nc-x { right: 10px; padding: 0; cursor: pointer; color: rgba(255, 255, 255, .72); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); transition: color .2s, border-color .2s; }
.nc-x:hover, .nc-x:focus-visible { color: #fff; border-color: rgba(255, 107, 53, .6); outline: none; }
.nc-vis { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 10px; }
.nc-av { position: relative; display: block; flex: 0 0 auto; }
.nc-pf { display: block; width: 54px; height: 54px; padding: 2px; clip-path: var(--pee-penta, var(--nc-penta)); background: var(--nc-g); }
.nc-pf > i { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding-top: 12%; font-style: normal;
    clip-path: var(--pee-penta, var(--nc-penta)); background: #161210 center / cover no-repeat; color: #FF6B35; font: 800 1.15rem/1 'Orbitron', sans-serif; }
.nc-pf > i.nc-img { padding-top: 0; }
.nc-lv { position: absolute; left: 50%; bottom: -7px; transform: translateX(-50%); display: inline-flex; line-height: 0; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .6)); }
.nc-lv:empty, .nc-lv2:empty { display: none !important; }
.nc-lv svg, .nc-lv2 svg { height: 14px; width: auto; }
.nc-main { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; max-width: 100%; }
.nc-who { max-width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; }
.nc-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 800 1rem/1.15 var(--font-sub, 'Rajdhani', sans-serif); letter-spacing: .2px; }
.nc-time { flex: 0 0 auto; font: 500 .72rem/1 'Inter', sans-serif; color: rgba(255, 255, 255, .5); }
.nc-time::before { content: '\00B7'; margin-right: 5px; }
.nc-title { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 .9rem/1.25 var(--font-sub, 'Rajdhani', sans-serif); letter-spacing: .3px;
    background: var(--nc-g); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nc-txt { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 .82rem/1.4 'Inter', sans-serif; color: rgba(255, 255, 255, .84); }
.nc-txt[hidden] { display: none; }
.nc-txt img { height: 1.15em; width: auto; vertical-align: -.2em; }
.nc-t-comment .nc-txt, .nc-t-reply .nc-txt, .nc-t-mention .nc-txt { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.nc-amt { display: inline-flex; align-items: baseline; justify-content: center; gap: 6px; margin-top: 2px; }
.nc-amt b { font: 800 1.3rem/1.15 'Orbitron', sans-serif; letter-spacing: .3px; background: var(--nc-g); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nc-amt small { font: 700 .74rem/1 var(--font-sub, 'Rajdhani', sans-serif); letter-spacing: .8px; color: rgba(255, 255, 255, .7); }
.nc-acts { position: relative; z-index: 1; width: 100%; display: grid; gap: 10px; margin-top: 12px; }
.nc-acts.n2 { grid-template-columns: 1fr 1fr; }
.nc-acts.n1 { grid-template-columns: minmax(0, 62%); justify-content: center; }
.nc-b { height: 38px; padding: 0 10px; border-radius: 12px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 0;
    font: 700 .9rem/1 var(--font-sub, 'Rajdhani', sans-serif); letter-spacing: .3px; transition: filter .2s, transform .15s; white-space: nowrap; }
.nc-b svg { width: 15px; height: 15px; flex: 0 0 auto; }
.nc-b span { overflow: hidden; text-overflow: ellipsis; }
.nc-b:active { transform: scale(.96); }
.nc-b:hover { filter: brightness(1.1); }
.nc-b:focus-visible { outline: 2px solid #F7C948; outline-offset: 2px; }
.nc-go { background: var(--nc-g); border: 0; color: #0A0A0A; box-shadow: 0 4px 14px rgba(255, 107, 53, .3); }
.nc-ghost { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .15); color: rgba(255, 255, 255, .88); }
.nc-no { background: rgba(255, 68, 68, .1); border: 1px solid rgba(255, 68, 68, .38); color: #FF6B6B; }
.nc-bar { position: absolute; left: 18px; right: 18px; bottom: 0; height: 2px; overflow: hidden; border-radius: 2px; background: rgba(255, 255, 255, .06); z-index: 2; }
.nc-bar > i { display: block; height: 100%; background: var(--nc-g); transform-origin: 50% 50%; animation: ncBar var(--nc-life, 6500ms) linear forwards; }
.nc-paused .nc-bar > i { animation-play-state: paused; }
@keyframes ncBar { to { transform: scaleX(0); } }
.nc-t-call .nc-pf { animation: ncRing 1.6s ease-in-out infinite; }
@keyframes ncRing { 0%, 100% { filter: drop-shadow(0 0 0 rgba(255, 107, 53, 0)); } 50% { filter: drop-shadow(0 0 12px rgba(255, 107, 53, .85)); } }

/* pile : 2 boutons de meme largeur sous la pile (Mute 1 h | Clear all) */
.nc-foot { display: flex; justify-content: center; gap: 8px; pointer-events: auto; }
.nc-foot[hidden] { display: none; }
.nc-fb { flex: 0 0 128px; height: 32px; border-radius: 99px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    font: 700 .8rem/1 var(--font-sub, 'Rajdhani', sans-serif); letter-spacing: .4px; color: rgba(255, 255, 255, .86);
    background: rgba(14, 14, 14, .82); border: 1px solid rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 6px 18px rgba(0, 0, 0, .45); }
.nc-fb svg { width: 14px; height: 14px; }
.nc-fb:hover { border-color: rgba(255, 107, 53, .55); color: #fff; }

/* paquet : les cartes plus anciennes depassent de 9 px derriere la premiere */
.nc-deck .nc.nc-back { position: absolute; left: 0; right: 0; top: 0; cursor: pointer; filter: brightness(.72);
    transform-origin: 50% 100%; transform: translateY(calc(var(--nc-i, 1) * 9px)) scale(calc(1 - var(--nc-i, 1) * .05)); animation: none; }
.nc-deck .nc.nc-back > * { opacity: 0 !important; pointer-events: none !important; }
.nc.nc-hide { display: none !important; }

/* silencieux : carte d'une ligne, sans son (les appels et invitations restent entiers) */
.nc.nc-quiet .nc-txt, .nc.nc-quiet .nc-acts, .nc.nc-quiet .nc-amt, .nc.nc-quiet .nc-thumb, .nc.nc-quiet .nc-link, .nc.nc-quiet .nc-lv, .nc.nc-quiet .nc-bar, .nc.nc-quiet .nc-time,
.nc.nc-mini .nc-txt, .nc.nc-mini .nc-acts, .nc.nc-mini .nc-amt, .nc.nc-mini .nc-bar, .nc.nc-mini .nc-time { display: none !important; }

/* carte « alertes du navigateur » de pm-notify rangee dans la pile */
.nc-stack .pmn-ask { width: auto; }

/* appel : notre carte recouvre celle du dock (qui reste en place, invisible, pour live-dock.js) */
body.nc-ring-own #callDock.cd-ringing { opacity: 0 !important; pointer-events: none !important; }

/* ================================ A · VERRE ================================ */
.nc-v-a { top: max(calc(env(safe-area-inset-top, 0px) + 8px), var(--cd-push, 0px)); }
@media (min-width: 769px) { .nc-v-a { top: max(calc(var(--top-bar-h, 60px) + 12px), var(--cd-push, 0px)); } }
body.nc-ring-own .nc-v-a { top: calc(env(safe-area-inset-top, 0px) + 8px); }
@media (min-width: 769px) { body.nc-ring-own .nc-v-a { top: calc(var(--top-bar-h, 60px) + 12px); } }
.nc-v-a .nc {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 14px 44px 16px; border-radius: 22px;
    background:
        linear-gradient(160deg, rgba(30, 30, 30, .985), rgba(12, 12, 12, .99)) padding-box,
        linear-gradient(150deg, rgba(255, 107, 53, .7), rgba(247, 201, 72, .35) 55%, rgba(255, 255, 255, .08)) border-box;
    border: 1px solid transparent;
    -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .55), 0 0 22px rgba(255, 107, 53, .12), inset 0 1px 0 rgba(255, 255, 255, .07);
}
.nc-v-a .nc-has-thumb .nc-link, .nc-v-a .nc-has-thumb .nc-thumb { display: flex; }
.nc-v-a .nc-link { width: 22px; height: 22px; border-radius: 50%; align-items: center; justify-content: center; background: var(--nc-g); color: #0A0A0A; box-shadow: 0 2px 8px rgba(255, 107, 53, .4); }
.nc-v-a .nc-link svg { width: 12px; height: 12px; }
.nc-v-a .nc-thumb { width: 54px; height: 54px; border-radius: 12px; background: #161210 center / cover no-repeat; border: 1px solid rgba(255, 255, 255, .2); box-shadow: 0 4px 12px rgba(0, 0, 0, .5); }
.nc-v-a .nc-who { margin-top: 12px; }
.nc-v-a .nc-title { margin-top: 2px; }
.nc-v-a .nc-txt { margin-top: 2px; }
.nc-v-a .nc-acts { margin-top: 12px; }
.nc-v-a .nc-acts.n2, .nc-v-a .nc-acts.n1 { width: calc(100% + 24px); }
.nc-v-a .nc.nc-quiet { flex-direction: row; justify-content: center; gap: 10px; padding: 8px 44px; }
.nc-v-a .nc.nc-quiet .nc-pf { width: 30px; height: 30px; }
.nc-v-a .nc.nc-quiet .nc-main { flex-direction: row; gap: 6px; align-items: baseline; }
.nc-v-a .nc.nc-quiet .nc-who { margin-top: 0; }
.nc-v-a .nc.nc-quiet .nc-name { font-size: .92rem; }
.nc-v-a .nc.nc-quiet .nc-title { margin: 0; font-size: .84rem; }
.nc-v-a .nc.nc-quiet .nc-ic, .nc-v-a .nc.nc-quiet .nc-x { top: 50%; margin-top: -13px; width: 26px; height: 26px; }

/* ================================ B · ILE ================================ */
.nc-v-b { top: max(calc(env(safe-area-inset-top, 0px) + 6px), var(--cd-push, 0px)); width: min(420px, calc(100vw - 16px)); gap: 6px; }
@media (min-width: 769px) { .nc-v-b { top: max(8px, var(--cd-push, 0px)); width: 440px; } }
body.nc-ring-own .nc-v-b { top: calc(env(safe-area-inset-top, 0px) + 6px); }
@media (min-width: 769px) { body.nc-ring-own .nc-v-b { top: 8px; } }
.nc-v-b .nc-cards { gap: 6px; }
.nc-v-b .nc {
    display: grid; grid-template-columns: 50px minmax(0, 1fr) 50px; grid-template-areas: "vis main x" "acts acts acts";
    align-items: center; column-gap: 8px; padding: 8px 8px 10px; border-radius: 34px;
    background: linear-gradient(180deg, rgba(14, 14, 14, .985), rgba(6, 6, 6, .99)) padding-box, linear-gradient(90deg, rgba(255, 107, 53, .75), rgba(247, 201, 72, .55)) border-box;
    border: 1px solid transparent;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .6), 0 0 26px rgba(255, 107, 53, .16);
}
.nc-v-b .nc:has(.nc-acts) { border-radius: 28px; }
.nc-v-b .nc-ic { display: none; }
.nc-v-b .nc-vis { grid-area: vis; justify-self: center; }
.nc-v-b .nc-pf { width: 46px; height: 46px; }
.nc-v-b .nc-lv { display: none; }
.nc-v-b .nc-chip { display: flex; position: absolute; right: -6px; bottom: -3px; width: 21px; height: 21px; border-radius: 50%; align-items: center; justify-content: center;
    background: var(--nc-g); color: #0A0A0A; border: 2px solid #0A0A0A; }
.nc-v-b .nc-chip svg { width: 11px; height: 11px; }
.nc-v-b .nc-main { grid-area: main; text-align: center; }
.nc-v-b .nc-lv2 { display: inline-flex; flex: 0 0 auto; line-height: 0; }
.nc-v-b .nc-name { font-size: .96rem; }
.nc-v-b .nc-title { font-size: .84rem; line-height: 1.2; }
.nc-v-b .nc-txt { font-size: .8rem; line-height: 1.3; }
.nc-v-b .nc-amt b { font-size: 1.08rem; }
.nc-v-b .nc-x { grid-area: x; position: static; justify-self: center; width: 34px; height: 34px; }
.nc-v-b .nc-x svg { width: 14px; height: 14px; }
.nc-v-b .nc-acts { grid-area: acts; margin: 8px 4px 0; width: auto; }
.nc-v-b .nc-b { height: 36px; border-radius: 18px; }
.nc-v-b .nc-bar { left: 30px; right: 30px; }
.nc-v-b .nc-cards > .nc.nc-mini:nth-child(2) { transform: scale(.97); }
.nc-v-b .nc-cards > .nc.nc-mini:nth-child(3) { transform: scale(.94); }
.nc-v-b .nc.nc-quiet, .nc-v-b .nc.nc-mini { grid-template-columns: 34px minmax(0, 1fr) 34px; padding: 5px 6px; border-radius: 24px; }
.nc-v-b .nc.nc-quiet .nc-pf, .nc-v-b .nc.nc-mini .nc-pf { width: 30px; height: 30px; }
.nc-v-b .nc.nc-quiet .nc-chip, .nc-v-b .nc.nc-mini .nc-chip { display: none; }
.nc-v-b .nc.nc-quiet .nc-main, .nc-v-b .nc.nc-mini .nc-main { flex-direction: row; justify-content: center; gap: 6px; align-items: baseline; }
.nc-v-b .nc.nc-quiet .nc-x, .nc-v-b .nc.nc-mini .nc-x { width: 28px; height: 28px; }
.nc-v-b .nc-foot { margin-top: 2px; }

/* ================================ C · CARTE ================================ */
.nc-v-c { top: auto; bottom: calc(env(safe-area-inset-bottom, 0px) + 14px); width: min(384px, calc(100vw - 16px)); flex-direction: column-reverse; }
@media (min-width: 769px) { .nc-v-c { bottom: 24px; width: 384px; } }
body.room-modal-open .nc-v-c { bottom: calc(env(safe-area-inset-bottom, 0px) + 92px); }
.nc-v-c .nc-cards { flex-direction: column-reverse; padding-bottom: 0; padding-top: var(--nc-peek, 0px); }
.nc-v-c .nc {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 0 18px 18px; border-radius: 24px; animation-name: ncInUp;
    background:
        linear-gradient(180deg, rgba(22, 22, 22, .985), rgba(10, 10, 10, .99)) padding-box,
        linear-gradient(160deg, rgba(255, 107, 53, .8), rgba(247, 201, 72, .3) 50%, rgba(255, 255, 255, .06)) border-box;
    border: 1px solid transparent;
    -webkit-backdrop-filter: blur(20px) saturate(150%); backdrop-filter: blur(20px) saturate(150%);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .65), 0 0 26px rgba(255, 107, 53, .14);
}
@keyframes ncInUp { from { opacity: 0; transform: translateY(18px) scale(.96); } }
.nc-v-c .nc.nc-out { transform: translateY(12px) scale(.97); }
.nc-v-c .nc-cover { display: block; position: absolute; left: -10%; right: -10%; top: -10px; height: 86px; z-index: 0;
    background: #2a1a10 center 30% / cover no-repeat; filter: blur(16px) saturate(1.4) brightness(.75); transform: scale(1.1); }
.nc-v-c .nc::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 76px; z-index: 0; pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 107, 53, .28), rgba(16, 16, 16, .15) 45%, rgba(16, 16, 16, .96)); }
.nc-v-c .nc-has-thumb .nc-cover { filter: brightness(.7) saturate(1.1); left: 0; right: 0; top: 0; height: 76px; transform: none; }
.nc-v-c .nc-ic { background: rgba(10, 10, 10, .55); border-color: rgba(255, 255, 255, .22); color: #F7C948; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.nc-v-c .nc-x { background: rgba(10, 10, 10, .55); border-color: rgba(255, 255, 255, .22); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.nc-v-c .nc-vis { margin-top: 40px; }
.nc-v-c .nc-pf { width: 64px; height: 64px; padding: 3px; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .6)); }
.nc-v-c .nc-who { margin-top: 13px; }
.nc-v-c .nc-name { font-size: 1.08rem; }
.nc-v-c .nc-title { order: -1; margin: 0 0 4px; font: 800 .72rem/1.2 var(--font-sub, 'Rajdhani', sans-serif); letter-spacing: 1.6px; text-transform: uppercase; }
.nc-v-c .nc-main { margin-top: 10px; }
.nc-v-c .nc-who { margin-top: 0; }
.nc-v-c .nc-txt { margin-top: 8px; padding: 7px 12px; border-radius: 12px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .09); max-width: 100%; }
.nc-v-c .nc-amt b { font-size: 1.55rem; }
.nc-v-c .nc-amt { margin-top: 6px; }
.nc-v-c .nc-acts { margin-top: 14px; }
.nc-v-c .nc-b { height: 40px; }
.nc-v-c.nc-deck .nc.nc-back { top: auto; bottom: 0; transform-origin: 50% 0; transform: translateY(calc(var(--nc-i, 1) * -9px)) scale(calc(1 - var(--nc-i, 1) * .05)); }
.nc-v-c .nc.nc-quiet { flex-direction: row; justify-content: center; gap: 10px; padding: 8px 44px; }
.nc-v-c .nc.nc-quiet .nc-cover, .nc-v-c .nc.nc-quiet::before { display: none; }
.nc-v-c .nc.nc-quiet .nc-vis { margin-top: 0; }
.nc-v-c .nc.nc-quiet .nc-pf { width: 30px; height: 30px; padding: 2px; }
.nc-v-c .nc.nc-quiet .nc-main { margin-top: 0; flex-direction: row; gap: 6px; align-items: baseline; }
.nc-v-c .nc.nc-quiet .nc-title { order: 1; margin: 0; }
.nc-v-c .nc.nc-quiet .nc-ic, .nc-v-c .nc.nc-quiet .nc-x { top: 50%; margin-top: -13px; width: 26px; height: 26px; }
/* les toasts du site passent au-dessus de la pile */
html.nc-var-c body.nc-on #toastContainer.toast-container { bottom: calc(var(--nc-h, 0px) + 36px); }

@media (prefers-reduced-motion: reduce) {
    .nc, .nc.nc-bump, .nc-t-call .nc-pf { animation: none; }
    .nc-bar > i { animation: none; display: none; }
    .nc-stack, .nc-cards { transition: none; }
}