/* Menu lateral compartilhado por todas as páginas do sistema */
body.has-shell{display:block;height:auto;min-height:100%}
.app{display:flex;min-height:100vh}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.side{width:240px;flex:none;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:var(--space-4) var(--space-3) var(--space-3);border-right:1px solid var(--divider);background:var(--bg-subtle);overflow:auto}
.side .sbrand{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2) var(--space-4);font-weight:var(--weight-semibold);font-size:var(--text-lg);text-decoration:none;color:var(--text)}
.side .sbrand b{color:var(--brand-500)}
.side .sbrand i{width:24px;height:24px;border-radius:var(--radius-md);background:var(--gray-900);display:grid;place-items:center;flex:none}
.side .sbrand i svg{width:14px;height:14px;stroke:#fff}
.side .sgroup{margin:var(--space-4) var(--space-2) var(--space-1);font-size:var(--text-xs);line-height:var(--lh-xs);font-weight:var(--weight-medium);color:var(--text-tertiary)}
.side a.si{display:flex;align-items:center;gap:var(--space-3);height:var(--control-md);padding:0 var(--space-2);border-radius:var(--radius-md);color:var(--text);text-decoration:none;font-size:var(--text-md);font-weight:var(--weight-medium)}
.side a.si svg{width:16px;height:16px;flex:none;stroke:var(--text-tertiary);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.side a.si:hover{background:var(--gray-50)}
.side a.si.on{background:var(--gray-0);box-shadow:0 0 0 1px var(--border);font-weight:var(--weight-semibold)}
.side a.si.on svg{stroke:var(--brand-500)}
.side a.si .sn{margin-left:auto;font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);background:var(--gray-50);padding:0 var(--space-2);border-radius:var(--radius-sm);line-height:var(--lh-xs)}
.side a.si.on .sn{background:var(--gray-50)}
.side .dot{width:8px;height:8px;border-radius:50%;background:var(--gray-200);flex:none}
.side .dot.ok{background:#2ea36b}.side .dot.run{background:var(--brand-500);animation:pulse 1.2s infinite}
.side a{color:var(--text)}
.has-shell .bar .brand,.has-shell .homebar{display:none}
@media (max-width:860px){.side{display:none}}

/* rodapé: configurações + usuário */
.side .sjob{display:flex;align-items:center;gap:var(--space-2);margin:var(--space-3) var(--space-2) 0;font-size:var(--text-xs);color:var(--text-secondary)}
.side .sjob b{font-weight:var(--weight-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side .sbottom{margin-top:auto;padding-top:var(--space-3);border-top:1px solid var(--divider);display:flex;flex-direction:column;gap:var(--space-2)}
.side .suser{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2)}
.side .suser .av{width:32px;height:32px;border-radius:50%;background:var(--gray-900);color:#fff;font-size:var(--text-xs);font-weight:var(--weight-medium);display:grid;place-items:center;flex:none}
.side .suser .who{display:flex;flex-direction:column;min-width:0}
.side .suser .who b{font-size:var(--text-sm);font-weight:var(--weight-medium);line-height:var(--lh-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side .suser .who small{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--text-secondary);line-height:var(--lh-xs)}

.side .suser .logout{margin-left:auto;border:0;background:none;color:var(--text-tertiary);width:28px;height:28px;border-radius:var(--radius-md);display:grid;place-items:center;cursor:pointer;flex:none}
.side .suser .logout:hover{background:var(--gray-50);color:var(--text)}

/* carregamento */
.pageload{position:fixed;left:240px;top:77px;right:0;bottom:0;z-index:40;background:var(--gray-0);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);color:var(--text-secondary);font-size:var(--text-sm);transition:opacity .2s}
.pageload.out{opacity:0;pointer-events:none}
.spin{width:28px;height:28px;border-radius:50%;border:3px solid var(--gray-100);border-top-color:var(--brand-500);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.topload{position:fixed;left:0;right:0;top:0;height:3px;z-index:100;background:linear-gradient(90deg,transparent,var(--brand-500),transparent);background-size:40% 100%;background-repeat:no-repeat;animation:slide 1.1s ease-in-out infinite}
@keyframes slide{from{background-position:-40% 0}to{background-position:140% 0}}
@media (max-width:860px){.pageload{left:0}}
@media (prefers-reduced-motion:reduce){.spin,.topload{animation-duration:2.4s}}