/* Estaleiro OB2 «versão realista» (Designer, 14/11) no Painel — SÓ TESTE, SÓ desktop (≥1280 px). O telemóvel não usa nada disto.
   Reaproveita o âmbito .dv5 (css/dv5.css) e junta só o que é novo: destaque único, migalhas, painéis de pessoa/cliente, aviso e créditos CC BY. */
@media (min-width: 1280px) {
  html[data-layout="desktop"] .dv5.estaleiro { --e-f: Barlow, system-ui, sans-serif; --destaque-cor: #5BA898; --destaque-brilho: rgba(91,168,152,.55); --destaque-dur: 220ms; --destaque-pulso: 600ms; --destaque-curva: cubic-bezier(.22,1,.36,1); --destaque-anel: 2px; --destaque-raio: 26px; }
  html[data-layout="desktop"] .dv5.estaleiro::before { display: none; }
  /* destaque único (.cg-destaque) — o mesmo anel verde e brilho do clique nos bonecos; nunca muda a cor do texto */
  html[data-layout="desktop"] .estaleiro .cg-destaque { position: relative; isolation: isolate; outline: none; transition: box-shadow var(--destaque-dur) var(--destaque-curva), transform var(--destaque-dur) var(--destaque-curva), background-color var(--destaque-dur) var(--destaque-curva); }
  html[data-layout="desktop"] .estaleiro .cg-destaque:hover, html[data-layout="desktop"] .estaleiro .cg-destaque:focus-visible, html[data-layout="desktop"] .estaleiro .cg-destaque.ligado { box-shadow: 0 0 0 var(--destaque-anel) var(--destaque-cor), 0 0 var(--destaque-raio) 2px var(--destaque-brilho); }
  html[data-layout="desktop"] .estaleiro .cg-destaque.sobre-verde:hover, html[data-layout="desktop"] .estaleiro .cg-destaque.sobre-verde:focus-visible { box-shadow: 0 0 0 2px #0f2420, 0 0 0 calc(2px + var(--destaque-anel)) var(--destaque-cor), 0 0 var(--destaque-raio) 4px var(--destaque-brilho); }
  html[data-layout="desktop"] .estaleiro .cg-destaque::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; border: var(--destaque-anel) solid var(--destaque-cor); opacity: 0; z-index: 1; }
  html[data-layout="desktop"] .estaleiro .cg-destaque.cg-pulso::after { animation: est-pulso var(--destaque-pulso) var(--destaque-curva) forwards; }
  @keyframes est-pulso { 0% { opacity: .95; inset: 0; box-shadow: 0 0 var(--destaque-raio) var(--destaque-brilho); } 100% { opacity: 0; inset: -8px; box-shadow: 0 0 0 transparent; } }
  html[data-layout="desktop"] .d-mini.dv5-ligado { box-shadow: 0 0 0 2px #5BA898, 0 0 26px 2px rgba(91,168,152,.55); }
  /* rótulos: dica «clique para ver horas» e contador de Aprovações (#2F6B5F + branco, permitido pelo NÚCLEO) */
  html[data-layout="desktop"] .estaleiro .rotulo { display: flex; align-items: center; gap: 6px; }
  html[data-layout="desktop"] .estaleiro .rotulo .contador { font: 600 12px/20px var(--e-f); font-style: normal; min-width: 22px; padding: 0 6px; text-align: center; border-radius: 999px; background: #2F6B5F; color: #fff; box-shadow: 0 0 0 2px rgba(91,168,152,.45); }
  html[data-layout="desktop"] .estaleiro .rotulo.ativo .contador { background: #162824; color: #fff; box-shadow: none; }
  html[data-layout="desktop"] .estaleiro .rotulo .r-dica { font: 500 11px/14px var(--e-f); color: var(--dv-txt2); margin-left: 2px; display: inline-flex; align-items: center; gap: 4px; }
  html[data-layout="desktop"] .estaleiro .rotulo .r-dica::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #5BA898; box-shadow: 0 0 0 3px rgba(91,168,152,.25); }
  html[data-layout="desktop"] .estaleiro .rotulo.ativo .r-dica { color: #0f2420; }
  html[data-layout="desktop"] .estaleiro .rotulo.ativo .r-dica::before { background: #0f2420; }
  /* painel de vidro: pessoa (funcionário / cliente) */
  html[data-layout="desktop"] .estaleiro .painel-vidro.pessoa { width: 344px; gap: 10px; }
  html[data-layout="desktop"] .estaleiro .p-cab .micro { display: block; }
  html[data-layout="desktop"] .estaleiro .p-cab h3 { font: 600 20px/26px var(--e-f); }
  html[data-layout="desktop"] .estaleiro .avatar-g { width: 52px; height: 52px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #2F6B5F; color: #fff; font: 600 20px/1 var(--e-f); box-shadow: 0 0 0 2px rgba(91,168,152,.55); }
  html[data-layout="desktop"] .estaleiro .p-sub { font: 400 14px/18px var(--e-f); color: var(--dv-txt2); }
  html[data-layout="desktop"] .estaleiro .p-estado { display: flex; align-items: center; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid var(--dv-linha); }
  html[data-layout="desktop"] .estaleiro .chip-verde { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 999px; background: #5BA898; color: #0f2420; font: 600 12px/1 var(--e-f); }
  html[data-layout="desktop"] .estaleiro .chip-verde i { width: 7px; height: 7px; border-radius: 50%; background: #0f2420; }
  html[data-layout="desktop"] .estaleiro .p-nota { margin-left: auto; font: 400 13px/18px var(--e-f); color: var(--dv-txt2); text-align: right; }
  html[data-layout="desktop"] .estaleiro .p-bloco { display: flex; flex-direction: column; gap: 2px; }
  html[data-layout="desktop"] .estaleiro .p-l { display: flex; align-items: baseline; gap: 10px; }
  html[data-layout="desktop"] .estaleiro .p-l b { font: 600 15px/20px var(--e-f); color: var(--dv-txt); }
  html[data-layout="desktop"] .estaleiro .p-horas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  html[data-layout="desktop"] .estaleiro .p-horas > div { display: flex; flex-direction: column; padding: 8px 10px; border-radius: 12px; border: 1px solid rgba(230,239,236,.14); background: rgba(10,24,21,.35); }
  html[data-layout="desktop"] .estaleiro .p-horas b { font: 600 22px/26px var(--e-f); font-variant-numeric: tabular-nums; }
  html[data-layout="desktop"] .estaleiro .p-horas small { font: 400 11px/14px var(--e-f); color: var(--dv-txt2); }
  html[data-layout="desktop"] .estaleiro .p-barra { display: flex; flex-direction: column; gap: 6px; }
  html[data-layout="desktop"] .estaleiro .p-barra i { display: block; height: 6px; border-radius: 99px; background: rgba(230,239,236,.12); position: relative; overflow: hidden; }
  html[data-layout="desktop"] .estaleiro .p-barra i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--p); border-radius: inherit; background: #5BA898; }
  html[data-layout="desktop"] .estaleiro .p-aviso-ex { margin: 0; font: 500 12px/16px var(--e-f); color: #E8C76A; }
  html[data-layout="desktop"] .estaleiro .p-contactos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  html[data-layout="desktop"] .estaleiro .p-contactos .btn-sec { height: 38px; font-size: 14px; }
  html[data-layout="desktop"] .estaleiro .so-admin { font: 600 10px/14px var(--e-f); font-style: normal; text-transform: uppercase; letter-spacing: .05em; padding: 0 5px; border-radius: 5px; background: #2F6B5F; color: #fff; margin-left: 4px; }
  /* migalhas no foco: no lugar dos KPIs da app (que se escondem enquanto houver foco) */
  html[data-layout="desktop"] .estaleiro .migalhas { position: absolute; left: var(--dv-m, 24px); top: var(--dv-topo, 76px); display: flex; flex-direction: column; gap: 8px; z-index: 3; }
  html[data-layout="desktop"] .estaleiro .migalhas[hidden] { display: none; }
  html[data-layout="desktop"] .estaleiro .mig-pilula { display: flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border-radius: 999px; background: rgba(15,36,32,.78); border: 1px solid rgba(91,168,152,.28); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2); font: 500 13px/18px var(--e-f); color: rgba(236,244,241,.82); }
  html[data-layout="desktop"] .estaleiro .mig-pilula button { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,.06); color: #ECF4F1; font: 500 13px/18px var(--e-f); border: 0; cursor: pointer; }
  html[data-layout="desktop"] .estaleiro .mig-pilula b { color: #fff; font-weight: 600; }
  html[data-layout="desktop"] .estaleiro .mig-sep { opacity: .5; }
  html[data-layout="desktop"] .estaleiro .mig-dica { margin: 0 0 0 8px; font: 400 11.5px/16px var(--e-f); color: rgba(236,244,241,.62); }
  html.d-sem-lateral.pc-painel[data-layout="desktop"]:has(.dv5.estaleiro.com-migalhas) .d-kpis3 { opacity: 0; pointer-events: none; transform: translateX(-12px); transition: opacity .25s, transform .25s; }
  /* aviso (rascunhos: nada é enviado) */
  html[data-layout="desktop"] .estaleiro .aviso { position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); padding: 8px 16px; border-radius: 999px; background: #162824; color: var(--dv-txt); font: 500 14px/20px var(--e-f); border: 1px solid rgba(230,239,236,.12); opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 4; }
  html[data-layout="desktop"] .estaleiro .aviso.ver { opacity: 1; }
  /* créditos CC BY 4.0 dos modelos 3D — sempre visíveis no canto inferior direito */
  html[data-layout="desktop"] .estaleiro .est-creditos { position: absolute; right: 16px; bottom: 16px; z-index: 3; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; max-width: 420px; }
  html[data-layout="desktop"] .estaleiro .est-cred-btn { height: 26px; padding: 0 10px; border-radius: 8px; border: 1px solid rgba(230,239,236,.12); background: rgba(18,48,43,.62); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: #A9BDB8; font: 500 12px/16px var(--e-f); cursor: pointer; }
  html[data-layout="desktop"] .estaleiro .est-cred-lista { order: -1; padding: 12px 14px; border-radius: 14px; background: rgba(18,48,43,.92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(230,239,236,.12); color: var(--dv-txt); font: 400 12px/17px var(--e-f); box-shadow: 0 16px 40px rgba(0,0,0,.45); }
  html[data-layout="desktop"] .estaleiro .est-cred-lista[hidden] { display: none; }
  html[data-layout="desktop"] .estaleiro .est-cred-lista ul { margin: 6px 0; padding-left: 16px; }
  html[data-layout="desktop"] .estaleiro .est-cred-lista p { margin: 0; color: #A9BDB8; }
  html[data-layout="desktop"] .estaleiro .est-cred-lista a { color: #8FD3C3; }
  html[data-layout="desktop"] .d-heroi .dv5.estaleiro.com-foco .est-creditos { right: 16px; }
}
@media (min-width: 1280px) and (prefers-reduced-motion: reduce) { html[data-layout="desktop"] .estaleiro .cg-destaque.cg-pulso::after { animation: none; } }