/* Segredos das marcas (easter eggs), copiados de cada sistema para abrir pelos logos do painel do Converge. */

/* ---- 2LN Analytics: Argos, o olho ---- */
/* ================= Olho do login: acompanha o mouse; ao clicar, pisca e conta a origem do olho (Argus, o gigante de 100 olhos) */
.sis-grande .sis-simbolo { cursor: pointer; }
.sis-grande .sis-simbolo > circle { transition: transform .18s ease-out; }
.sis-simbolo.piscando { animation: sis-piscar .45s ease-in-out; transform-origin: 50% 50%; }
@keyframes sis-piscar { 0%, 100% { transform: scaleY(1); } 45%, 55% { transform: scaleY(.08); } }
.sis-segredo { position: fixed; inset: 0; z-index: 9000; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 6px; padding: 24px; cursor: pointer; color: #eef1f1; opacity: 0; transition: opacity .45s ease;
    background: radial-gradient(ellipse at 50% 85%, #22385c 0%, #1c2541 45%, #0e1324 100%); }
.sis-segredo.visivel { opacity: 1; }
.sis-segredo.saindo { opacity: 0; }
.sis-leque { width: min(860px, 92vw); height: auto; max-height: 48vh; overflow: visible; }
.sis-leque .ao-contorno { fill: #0e1324; stroke: #8fb3cc; stroke-width: 1.1; }
.sis-leque .ao-iris { fill: #2e7d8f; }
.sis-leque .ao-pupila { fill: #0e1324; }
.sis-leque .ao-brilho { fill: #fff; opacity: .85; }
.sis-leque .ao-olho { transform-box: fill-box; transform-origin: center; opacity: 0;
    animation: ao-surgir .7s cubic-bezier(.2, .8, .2, 1) forwards, ao-piscar 9s ease-in-out infinite; }
@keyframes ao-surgir { from { opacity: 0; transform: scale(.2); } to { opacity: 1; transform: scale(1); } }
@keyframes ao-piscar { 0%, 94%, 100% { transform: scaleY(1); } 96.5% { transform: scaleY(.1); } }
.sis-segredo-texto { max-width: 640px; text-align: center; opacity: 0; transform: translateY(10px);
    animation: ao-texto .9s ease 1.4s forwards; font-family: "Segoe UI", Arial, sans-serif; }
@keyframes ao-texto { to { opacity: 1; transform: none; } }
.sis-segredo-sobre { font-size: 13px; letter-spacing: 2.5px; color: #8fb3cc; text-transform: uppercase; }
.sis-segredo h2 { margin: 6px 0 14px; font-size: 34px; font-weight: 700; letter-spacing: 4px; color: #fff; }
.sis-segredo p { margin: 0 0 10px; font-size: 15px; line-height: 1.6; color: #c3cbcb; }
.sis-segredo p.sis-segredo-destaque { color: #fff; font-weight: 600; margin-top: 14px; }
.sis-segredo-rodape { margin-top: 18px; font-size: 11.5px; color: #6f86a3; letter-spacing: .5px; }
@media (max-width: 760px) { .sis-segredo h2 { font-size: 26px; } .sis-segredo p { font-size: 13.5px; } }
@media (prefers-reduced-motion: reduce) { .sis-leque .ao-olho { animation: none; opacity: 1; } .sis-segredo-texto { animation: none; opacity: 1; transform: none; } }

/* ================= Curva ABC: Produtos − Estoque e Dias sem Venda (dias por unidade de negócio) */
.abc-lista2 th.abc-un-grupo { text-align: center; border-bottom: 1px solid rgba(255, 255, 255, .35); }

/* ---- 2LN Academy: Quíron, o arco ---- */
/* Official 2LN Academy artwork: transparent SVG, no blending or recreated lettering. */
body .qa-brand,body.qa-platform .q-brand,body.qa-platform .q-brand.qa-brand{position:relative;display:block;width:240px;max-width:100%;height:68px;margin:0 0 18px;overflow:visible;background:transparent;isolation:auto}
body .qa-brand img,body.qa-platform .q-brand img,body.qa-platform .q-brand.qa-brand img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:left center;mix-blend-mode:normal}
body.qa-platform .q-menu-brand{width:185px;height:52px;margin:0;background:#1A223A;border-radius:8px}
body.qa-platform .q-menu-brand img{width:100%;height:100%;position:static;mix-blend-mode:normal}
.academy-certificate-logo{display:block;width:270px;height:auto;margin:0 auto 20px}
.native-only{display:none}.quiron-native-app .native-only{display:block}
.quiron-native-app .sidebar .brand,.quiron-native-app .topbar>span:first-child{display:none}
.quiron-native-app .topbar{justify-content:flex-end}
.qa-brand-dialog{width:min(560px,calc(100vw - 32px));border:1px solid #C2CBCC55;border-radius:18px;padding:30px;color:#F6F7F5;background:#1A223A;font:16px/1.6 "Segoe UI",Arial,sans-serif;box-shadow:0 20px 80px #0008}
.qa-brand-dialog::backdrop{background:#101525bb}.qa-brand-dialog img{display:block;width:100%;max-width:360px;margin:0 auto 20px}.qa-brand-dialog h2{color:#F6F7F5;margin:0 0 12px}.qa-brand-dialog p{color:#C2CBCC}.qa-brand-dialog button{font:inherit;padding:10px 20px;border:1px solid #C2CBCC;border-radius:8px;background:#255D83;color:#F6F7F5;cursor:pointer}
@media(max-width:760px){.qa-brand{width:215px;height:60px}body.qa-platform .q-menu-brand{width:130px;height:42px}}
@media print{.academy-certificate-logo{width:240px}.qa-brand-dialog{display:none!important}}

/* Animação do arco e do centauro (copiada de academy/assets/2ln-brand.css) */
@keyframes academy-copy-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.qa-bow-dialog .qa-bow-stage{position:relative;width:100%;aspect-ratio:1000/560;overflow:hidden;animation:academy-bow-crop .65s 2.15s ease-in-out both;margin:0 auto 18px}
.qa-bow-stage>svg{position:absolute;left:0;top:0;display:block;width:100%;height:auto;overflow:visible}
.qa-centaur{animation:academy-centaur-exit .45s 1.5s ease-in both}
.qa-centaur path{stroke-dasharray:2000;stroke-dashoffset:2000;animation:academy-centaur-draw .9s ease-out both}
.qa-bow-symbol{animation:academy-bow-settle .75s 1.35s cubic-bezier(.22,.61,.36,1) both}
.qa-bow-string{animation:academy-bow-string .3s 1.05s ease-out both;transform-origin:71px 96px}
.qa-bow-shot{animation:academy-bow-shot .45s 1.05s cubic-bezier(.22,.61,.36,1) both}
.qa-bow-arrow-wipe{width:0;animation:academy-bow-arrow-reveal .5s 2s ease-out both}
.qa-bow-name-wipe{width:0;animation:academy-bow-name-reveal 1s 2.35s cubic-bezier(.22,.61,.36,1) both}
.qa-bow-dialog .qa-brand-story-copy{animation:academy-copy-in .6s 2.55s ease-out both}
@keyframes academy-centaur-draw{to{stroke-dashoffset:0}}
@keyframes academy-centaur-exit{to{opacity:0;transform:translateX(-16px)}}
@keyframes academy-bow-settle{from{transform:translate(613.1px,38.6px) scale(.9)}to{transform:translate(200px,125px) scale(.9)}}
@keyframes academy-bow-string{to{opacity:0;transform:scaleX(.15)}}
@keyframes academy-bow-shot{0%{opacity:1;transform:translateX(0)}80%{opacity:1}100%{opacity:0;transform:translateX(240px)}}
@keyframes academy-bow-arrow-reveal{to{width:240px}}
@keyframes academy-bow-name-reveal{to{width:600px}}
@keyframes academy-bow-crop{to{aspect-ratio:1000/340}}
@media(prefers-reduced-motion:reduce){.qa-centaur,.qa-bow-string,.qa-bow-shot{display:none}.qa-bow-symbol{animation:none;transform:translate(200px,125px) scale(.9)}.qa-bow-arrow-wipe{animation:none;width:240px}.qa-bow-name-wipe{animation:none;width:600px}.qa-bow-dialog .qa-bow-stage{animation:none;aspect-ratio:1000/340}.qa-bow-dialog .qa-brand-story-copy{animation:none}}

/* ---- 2LN Flow: Hermes, a pena ---- */
.flow-story{width:min(560px,calc(100vw - 32px));max-height:none;padding:30px;background:#1A223A;color:#F6F7F5;border:1px solid #C2CBCC55;border-radius:18px;box-shadow:0 20px 80px #0008;font:16px/1.6 "Segoe UI",Arial,sans-serif;overflow:visible}
.flow-story::backdrop{background:#101525bb;backdrop-filter:none}
.flow-story .flow-story-art{background:none;padding:0;margin:0 auto 18px}
.flow-story[open] .flow-story-art{animation:none}
.flow-story .flow-story-art svg{display:block;width:100%;height:auto;overflow:visible}
.flow-story .flow-story-copy{padding:0;animation:flow-story-surge .6s 2.3s ease-out both}
.flow-story .flow-story-copy h2{margin:0 0 12px;font-size:25px;font-weight:700;letter-spacing:-.7px;color:#F6F7F5}
.flow-story .flow-story-copy p{margin:0 0 16px;font-size:16px;line-height:1.6;color:#C2CBCC;text-align:justify;text-align-last:left}
.flow-story .flow-story-exit{margin:22px 0 0;text-align:center;color:#80a9c7;font:400 13px/1.6 "Segoe UI",Arial,sans-serif;letter-spacing:.8px;cursor:default}
.flow-story-traco{stroke-dasharray:1;stroke-dashoffset:1;animation:flow-story-traco 1.1s ease-out forwards}
.flow-story-caminho{animation-delay:.9s;animation-duration:.6s}
.flow-story-pena{transform-box:fill-box;transform-origin:center;animation:flow-story-pena .75s 1.35s cubic-bezier(.22,.61,.36,1) both}
.flow-story-nome{animation:flow-story-surge .8s 1.8s ease-out both}
@keyframes flow-story-traco{to{stroke-dashoffset:0}}
@keyframes flow-story-pena{from{opacity:0;transform:translate(-40px,10px) scale(.8) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes flow-story-surge{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:760px){.flow-story .flow-story-copy{padding:0}.flow-story .flow-story-copy h2{font-size:25px}.flow-story .flow-story-art{padding:0}}
@media(prefers-reduced-motion:reduce){.flow-story-traco{animation:none;stroke-dashoffset:0}.flow-story-pena,.flow-story-nome,.flow-story .flow-story-copy{animation:none}}


/* ---- Padrão único no Converge (o formato do 2LN Flow) para os três segredos ---- */
/* cartão */
.sis-segredo.segredo-padrao { background: #101525bb; padding: 16px; }
.segredo-padrao .segredo-cartao,
.qa-brand-dialog.segredo-padrao,
.manager-story-dialog.segredo-padrao,
.flow-story {
    width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; box-sizing: border-box;
    padding: 30px; background: #1A223A; color: #F6F7F5; border: 1px solid #C2CBCC55; border-radius: 18px;
    box-shadow: 0 20px 80px #0008; font: 16px/1.6 "Segoe UI", Arial, sans-serif;
}
.qa-brand-dialog.segredo-padrao::backdrop, .manager-story-dialog.segredo-padrao::backdrop, .flow-story::backdrop { background: #101525bb; backdrop-filter: none; }
/* arte no topo, do mesmo tamanho */
.segredo-padrao .sis-leque { display: block; width: 100%; max-height: 210px; margin: 0 auto 18px; }
.qa-brand-dialog.segredo-padrao .qa-bow-stage { margin: 0 auto 18px; }   /* o palco e a arte seguem a animação original */
.flow-story .flow-story-art svg { max-height: 210px; }
/* texto: mesmo título, parágrafos e alinhamento */
.segredo-padrao .sis-segredo-texto { max-width: none; text-align: left; }
.segredo-padrao .sis-segredo-sobre { font-size: 11px; letter-spacing: 2px; color: #8fb3cc; margin: 0 0 4px; }
.segredo-padrao h2, .flow-story .flow-story-copy h2 { margin: 0 0 12px; font-size: 25px; font-weight: 700; letter-spacing: -.7px; color: #F6F7F5; text-transform: none; }
.segredo-padrao p, .flow-story .flow-story-copy p { margin: 0 0 16px; font-size: 16px; line-height: 1.6; color: #C2CBCC; text-align: justify; text-align-last: left; }
.segredo-padrao p.sis-segredo-destaque { color: #F6F7F5; font-weight: 600; margin-top: 0; }
/* rodapé igual nos três */
.segredo-padrao .segredo-saida, .flow-story .flow-story-exit { margin: 22px 0 0; text-align: center !important; text-align-last: center !important; color: #80a9c7; font: 400 13px/1.6 "Segoe UI", Arial, sans-serif; letter-spacing: .8px; }
@media (max-width: 760px) { .segredo-padrao h2, .flow-story .flow-story-copy h2 { font-size: 22px; } .segredo-padrao p, .flow-story .flow-story-copy p { font-size: 15px; } }

/* ---- 2LN Manager: a coruja de Atena (animação copiada de manager/assets/brand/manager-story.css) ---- */
.manager-story-dialog .manager-story-stage { margin: 0 auto 18px; }
.manager-story-dialog .manager-story-stage svg { display: block; width: 100%; height: auto; max-height: 210px; }
.manager-story-coruja .manager-story-traco {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: manager-story-traco .55s linear forwards;
}
.manager-story-coruja .manager-story-traco:nth-child(1) { animation-delay: 0s; }
.manager-story-coruja .manager-story-traco:nth-child(2) { animation-delay: .4s; }
.manager-story-coruja .manager-story-traco:nth-child(3) { animation-delay: .4s; }
.manager-story-coruja .manager-story-traco:nth-child(4) { animation-delay: .8s; }
.manager-story-coruja .manager-story-traco:nth-child(5) { animation-delay: .8s; }
.manager-story-coruja .manager-story-traco:nth-child(6) { animation-delay: 1.15s; }
@keyframes manager-story-traco {
    from { stroke-dashoffset: 1; }
    to { stroke-dashoffset: 0; }
}
.manager-story-ponto {
    opacity: 0;
    animation: manager-story-ponto .25s ease-out 1.55s forwards;
}
@keyframes manager-story-ponto {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Depois da coruja pronta, o nome se forma (revelação em faixa, igual ao restante da marca) */
.manager-story-nome, .manager-story-assinatura {
    clip-path: inset(0 100% 0 0);
}
.manager-story-nome { animation: manager-story-wipe .7s ease-out 1.85s forwards; }
.manager-story-assinatura { animation: manager-story-wipe .5s ease-out 2.45s forwards; }
@keyframes manager-story-wipe {
    from { clip-path: inset(0 100% 0 0); }
    to { clip-path: inset(0 0 0 0); }
}
@media (prefers-reduced-motion: reduce) {
    .manager-story-coruja .manager-story-traco { animation: none; stroke-dashoffset: 0; }
    .manager-story-ponto { animation: none; opacity: 1; }
    .manager-story-nome, .manager-story-assinatura { animation: none; clip-path: none; }
}
