/* =====================================================================
   NewOS Manager - complementos sobre o newos.css (mesma identidade)
   ===================================================================== */
.nm-count { margin-left: auto; min-width: 20px; padding: 1px 7px; border-radius: 999px; background: var(--estado-aviso);
    color: #3b2700; font-size: .72rem; font-weight: 800; text-align: center; }
.nm-tile { color: inherit; text-decoration: none; }
.nm-tile:hover { text-decoration: none; }
.nm-ok { color: var(--estado-ok); }
.nm-warn { color: #b7770f; }
.tile-value.nm-small { font-size: 1.6rem; }
.nm-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--text-muted); margin-right: 2px; }
.nm-dot.on { background: var(--estado-ok); box-shadow: 0 0 0 0 rgba(22, 163, 74, .5); animation: live 1.6s infinite; }
.nm-off { background: color-mix(in srgb, var(--estado-erro) 12%, transparent); color: var(--estado-erro); }
.nm-off .nm-dot { background: var(--estado-erro); }
.nm-filter { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.nm-filter .sys-search { flex: 1 1 260px; }
.nm-filter select { width: auto; }
.nm-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.nm-inline { display: flex; gap: 8px; align-items: center; }
.nm-inline select, .nm-inline input { width: auto; flex: 1; min-width: 120px; }
.nm-top { align-items: start; }
.nm-bars { display: grid; gap: 10px; }
.nm-bar { display: grid; grid-template-columns: 80px 1fr 40px; gap: 10px; align-items: center; }
.nm-bar-track { height: 10px; border-radius: 6px; background: var(--surface-suave); overflow: hidden; }
.nm-bar-track i { display: block; height: 100%; width: var(--w); border-radius: 6px;
    background: linear-gradient(90deg, var(--brand-navy), var(--accent-teal)); animation: grow .8s ease both; transform-origin: left; }
.nm-events { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: .9rem; }
.nm-events li { padding-bottom: 8px; border-bottom: 1px solid var(--border-color); }
.nm-events li:last-child { border-bottom: 0; }
.nm-kv th { width: 38%; text-align: left; color: var(--text-muted); font-weight: 600; }
.nm-box { padding: 12px 14px; margin-bottom: 14px; border-radius: 12px; background: color-mix(in srgb, var(--estado-aviso) 12%, var(--surface-card)); }
.nm-danger { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--border-color); display: flex; gap: 8px; }
.nm-newkey { border: 2px solid var(--accent-teal); }
.nm-key { font-size: 1.05rem; letter-spacing: .04em; padding: 14px 16px; border-radius: 12px; background: var(--surface-suave);
    word-break: break-all; user-select: all; color: var(--title-color); font-weight: 700; }
.nm-actions { display: flex; gap: 8px; margin: 12px 0; }
.nm-list { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
.nm-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 12px 0; max-width: 420px; }
.nm-codes span { padding: 8px 10px; border-radius: 8px; background: var(--surface-suave); text-align: center; }
.nm-first { max-width: 440px; }
.nm-step { display: flex; align-items: center; gap: 8px; margin: 18px 0 10px; font-size: 1rem; color: var(--title-color); }
.nm-step span { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--brand-navy);
    color: #fff; font-size: .8rem; }
.nm-qr { display: grid; place-items: center; margin: 10px 0; }
.nm-qr svg { width: 190px; height: 190px; border-radius: 12px; }
.nm-secret { text-align: center; word-break: break-all; }
.nm-newuser { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border-color); }
.nm-act { display: inline-block; }
.nm-hwid { cursor: help; }
@media (max-width: 900px) { .nm-inline { flex-wrap: wrap; } .nm-bar { grid-template-columns: 70px 1fr 30px; } }
