/* Ranking de comprometimento (personal) e sino de notificacoes. Cor sempre acompanhada de rotulo. Mobile-first. */
.rk{display:grid;gap:12px;min-width:0;margin-bottom:18px}
.rk h3{margin:0}
.rk-callout{margin:0;padding:11px 13px;border-radius:12px;border:1px solid #ffffff1c;background:#ffffff0a;color:var(--ink);font-size:13px;font-weight:650}
.rk-callout.has-risk{border-color:#ff9b8a66;background:#ff9b8a14}
.rk-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rk-row{width:100%;display:flex;align-items:center;gap:12px;min-height:64px;padding:11px 12px;border:1px solid #ffffff1c;border-left:5px solid var(--bc,#8aa398);border-radius:13px;background:#0c1413;color:var(--ink);text-align:left;font:inherit;cursor:pointer}
.rk-row:hover{background:#111c1a}
.rk-row:focus-visible,.nb-btn:focus-visible,.nb-item:focus-visible,.nb-all:focus-visible{outline:2px solid #fff;outline-offset:2px;box-shadow:0 0 0 4px #5fffd055}
.band-engaged{--bc:#6fe3a0}.band-attention{--bc:#f2c55c}.band-risk{--bc:#ff9b8a}.band-new{--bc:#8fb8ff}
.rk-ring{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--bc) calc(var(--p)*1%),#ffffff1f 0)}
.rk-ring b{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#0c1413;color:var(--ink);font-size:12px}
.rk-main{flex:1;min-width:0;display:grid;gap:4px}
.rk-top{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.rk-name{overflow-wrap:anywhere;font-size:15px}
.rk-band{padding:2px 9px;border-radius:99px;border:1px solid var(--bc);color:var(--bc);font-size:11px;font-weight:800;white-space:nowrap}
.rk-trend{color:var(--muted);font-size:12px}
.rk-meta{color:var(--muted);font-size:12px}
.rk-flags{display:flex;flex-wrap:wrap;gap:5px}
.rk-flag{padding:2px 8px;border-radius:8px;background:#ffffff12;color:var(--ink);font-size:11px;font-weight:650}
.rk-flag.warn{background:#f2c55c24;color:#f6d98f}
.rk-go{color:var(--muted);font-size:22px}
@media(min-width:900px){.rk-row{padding:12px 16px}.rk-ring{width:58px;height:58px}.rk-ring b{width:45px;height:45px;font-size:13px}}

.nb{position:relative}
.nb[hidden]{display:none}
.nb-btn{position:relative;min-width:44px;min-height:44px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font-size:18px;cursor:pointer}
.nb-badge{position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 4px;border-radius:99px;background:#d8432e;color:#fff;font-size:11px;font-weight:800;line-height:18px;text-align:center}
.nb-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:30;width:min(380px,calc(100vw - 32px));max-height:min(70vh,520px);overflow:auto;padding:12px;border:1px solid #ffffff22;border-radius:14px;background:#0c1413;color:#edfff5;box-shadow:0 18px 50px #00000066;display:grid;gap:10px;align-content:start}
.nb-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nb-all{min-height:40px;padding:6px 10px;border:1px solid #ffffff2a;border-radius:10px;background:transparent;color:#edfff5;font-size:12px;font-weight:700;cursor:pointer}
.nb-all:disabled{opacity:.45;cursor:default}
.nb-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.nb-item{width:100%;display:flex;gap:10px;align-items:flex-start;min-height:48px;padding:10px;border:1px solid #ffffff14;border-radius:11px;background:#ffffff08;color:#edfff5;text-align:left;font:inherit;font-size:13px;cursor:pointer}
.nb-item.unread{background:#6fe3a01a;border-color:#6fe3a055;font-weight:650}
.nb-dot{flex:none;width:9px;height:9px;margin-top:5px;border-radius:50%;background:transparent}
.nb-item.unread .nb-dot{background:#6fe3a0}
.nb-text{display:grid;gap:3px;min-width:0;overflow-wrap:anywhere}
.nb-text small{color:#91aaa1;font-size:11px;font-weight:500}
.nb-empty{padding:8px 2px}
@media(max-width:660px){.nb-panel{position:fixed;left:16px;right:16px;top:64px;width:auto}}